From aa98b4c7c934592518466143338acecb5506efb7 Mon Sep 17 00:00:00 2001
From: Dennis Sheu <dennis@BiX-Skunk-Works.local>
Date: Wed, 8 May 2024 10:11:54 -0700
Subject: [PATCH 1/4] Fix [examples/react-rich] Invalid src/style.css url path
 causes vite build fail to bundle Toolbar format icons.

---
 examples/react-rich/src/styles.css | 20 ++++++++++----------
 1 file changed, 10 insertions(+), 10 deletions(-)

diff --git a/examples/react-rich/src/styles.css b/examples/react-rich/src/styles.css
index 071a794fc76..3682244685c 100644
--- a/examples/react-rich/src/styles.css
+++ b/examples/react-rich/src/styles.css
@@ -410,41 +410,41 @@ pre::-webkit-scrollbar-thumb {
 }
 
 i.undo {
-  background-image: url(icons/arrow-counterclockwise.svg);
+  background-image: url(/icons/arrow-counterclockwise.svg);
 }
 
 i.redo {
-  background-image: url(icons/arrow-clockwise.svg);
+  background-image: url(/icons/arrow-clockwise.svg);
 }
 
 i.bold {
-  background-image: url(icons/type-bold.svg);
+  background-image: url(/icons/type-bold.svg);
 }
 
 i.italic {
-  background-image: url(icons/type-italic.svg);
+  background-image: url(/icons/type-italic.svg);
 }
 
 i.underline {
-  background-image: url(icons/type-underline.svg);
+  background-image: url(/icons/type-underline.svg);
 }
 
 i.strikethrough {
-  background-image: url(icons/type-strikethrough.svg);
+  background-image: url(/icons/type-strikethrough.svg);
 }
 
 i.left-align {
-  background-image: url(icons/text-left.svg);
+  background-image: url(/icons/text-left.svg);
 }
 
 i.center-align {
-  background-image: url(icons/text-center.svg);
+  background-image: url(/icons/text-center.svg);
 }
 
 i.right-align {
-  background-image: url(icons/text-right.svg);
+  background-image: url(/icons/text-right.svg);
 }
 
 i.justify-align {
-  background-image: url(icons/justify.svg);
+  background-image: url(/icons/justify.svg);
 }

From 2e7fbd523f993d4c93ebb0426cf4505d0a9a6e18 Mon Sep 17 00:00:00 2001
From: Dennis Sheu <dennis@BiX-Skunk-Works.local>
Date: Wed, 8 May 2024 21:22:45 -0700
Subject: [PATCH 2/4] Revert "Fix [examples/react-rich] Invalid src/style.css
 url path causes vite build fail to bundle Toolbar format icons."

This reverts commit aa98b4c7c934592518466143338acecb5506efb7.
---
 examples/react-rich/src/styles.css | 20 ++++++++++----------
 1 file changed, 10 insertions(+), 10 deletions(-)

diff --git a/examples/react-rich/src/styles.css b/examples/react-rich/src/styles.css
index 3682244685c..071a794fc76 100644
--- a/examples/react-rich/src/styles.css
+++ b/examples/react-rich/src/styles.css
@@ -410,41 +410,41 @@ pre::-webkit-scrollbar-thumb {
 }
 
 i.undo {
-  background-image: url(/icons/arrow-counterclockwise.svg);
+  background-image: url(icons/arrow-counterclockwise.svg);
 }
 
 i.redo {
-  background-image: url(/icons/arrow-clockwise.svg);
+  background-image: url(icons/arrow-clockwise.svg);
 }
 
 i.bold {
-  background-image: url(/icons/type-bold.svg);
+  background-image: url(icons/type-bold.svg);
 }
 
 i.italic {
-  background-image: url(/icons/type-italic.svg);
+  background-image: url(icons/type-italic.svg);
 }
 
 i.underline {
-  background-image: url(/icons/type-underline.svg);
+  background-image: url(icons/type-underline.svg);
 }
 
 i.strikethrough {
-  background-image: url(/icons/type-strikethrough.svg);
+  background-image: url(icons/type-strikethrough.svg);
 }
 
 i.left-align {
-  background-image: url(/icons/text-left.svg);
+  background-image: url(icons/text-left.svg);
 }
 
 i.center-align {
-  background-image: url(/icons/text-center.svg);
+  background-image: url(icons/text-center.svg);
 }
 
 i.right-align {
-  background-image: url(/icons/text-right.svg);
+  background-image: url(icons/text-right.svg);
 }
 
 i.justify-align {
-  background-image: url(/icons/justify.svg);
+  background-image: url(icons/justify.svg);
 }

From 6aafb56128f529842989c98f26dffb42b5ad46e6 Mon Sep 17 00:00:00 2001
From: Dennis Sheu <dennis@BiX-Skunk-Works.local>
Date: Wed, 8 May 2024 21:26:41 -0700
Subject: [PATCH 3/4] [examples/react-rich] Fix:missing toolbar format icon in
 vite build. Move icons from /public to /src as etrepum suggests.

---
 examples/react-rich/public/icons/LICENSE.md                 | 5 -----
 examples/react-rich/public/icons/arrow-clockwise.svg        | 4 ----
 examples/react-rich/public/icons/arrow-counterclockwise.svg | 4 ----
 examples/react-rich/public/icons/journal-text.svg           | 5 -----
 examples/react-rich/public/icons/justify.svg                | 3 ---
 examples/react-rich/public/icons/text-center.svg            | 3 ---
 examples/react-rich/public/icons/text-left.svg              | 3 ---
 examples/react-rich/public/icons/text-paragraph.svg         | 3 ---
 examples/react-rich/public/icons/text-right.svg             | 3 ---
 examples/react-rich/public/icons/type-bold.svg              | 3 ---
 examples/react-rich/public/icons/type-italic.svg            | 3 ---
 examples/react-rich/public/icons/type-strikethrough.svg     | 3 ---
 examples/react-rich/public/icons/type-underline.svg         | 3 ---
 13 files changed, 45 deletions(-)
 delete mode 100644 examples/react-rich/public/icons/LICENSE.md
 delete mode 100644 examples/react-rich/public/icons/arrow-clockwise.svg
 delete mode 100644 examples/react-rich/public/icons/arrow-counterclockwise.svg
 delete mode 100644 examples/react-rich/public/icons/journal-text.svg
 delete mode 100644 examples/react-rich/public/icons/justify.svg
 delete mode 100644 examples/react-rich/public/icons/text-center.svg
 delete mode 100644 examples/react-rich/public/icons/text-left.svg
 delete mode 100644 examples/react-rich/public/icons/text-paragraph.svg
 delete mode 100644 examples/react-rich/public/icons/text-right.svg
 delete mode 100644 examples/react-rich/public/icons/type-bold.svg
 delete mode 100644 examples/react-rich/public/icons/type-italic.svg
 delete mode 100644 examples/react-rich/public/icons/type-strikethrough.svg
 delete mode 100644 examples/react-rich/public/icons/type-underline.svg

diff --git a/examples/react-rich/public/icons/LICENSE.md b/examples/react-rich/public/icons/LICENSE.md
deleted file mode 100644
index ce74f6abeed..00000000000
--- a/examples/react-rich/public/icons/LICENSE.md
+++ /dev/null
@@ -1,5 +0,0 @@
-Bootstrap Icons
-https://icons.getbootstrap.com
-
-Licensed under MIT license
-https://github.com/twbs/icons/blob/main/LICENSE.md
diff --git a/examples/react-rich/public/icons/arrow-clockwise.svg b/examples/react-rich/public/icons/arrow-clockwise.svg
deleted file mode 100644
index b072eb097ab..00000000000
--- a/examples/react-rich/public/icons/arrow-clockwise.svg
+++ /dev/null
@@ -1,4 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-arrow-clockwise" viewBox="0 0 16 16">
-  <path fill-rule="evenodd" d="M8 3a5 5 0 1 0 4.546 2.914.5.5 0 0 1 .908-.417A6 6 0 1 1 8 2v1z"/>
-  <path d="M8 4.466V.534a.25.25 0 0 1 .41-.192l2.36 1.966c.12.1.12.284 0 .384L8.41 4.658A.25.25 0 0 1 8 4.466z"/>
-</svg>
\ No newline at end of file
diff --git a/examples/react-rich/public/icons/arrow-counterclockwise.svg b/examples/react-rich/public/icons/arrow-counterclockwise.svg
deleted file mode 100644
index b0b23b9bbc4..00000000000
--- a/examples/react-rich/public/icons/arrow-counterclockwise.svg
+++ /dev/null
@@ -1,4 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-arrow-counterclockwise" viewBox="0 0 16 16">
-  <path fill-rule="evenodd" d="M8 3a5 5 0 1 1-4.546 2.914.5.5 0 0 0-.908-.417A6 6 0 1 0 8 2v1z"/>
-  <path d="M8 4.466V.534a.25.25 0 0 0-.41-.192L5.23 2.308a.25.25 0 0 0 0 .384l2.36 1.966A.25.25 0 0 0 8 4.466z"/>
-</svg>
\ No newline at end of file
diff --git a/examples/react-rich/public/icons/journal-text.svg b/examples/react-rich/public/icons/journal-text.svg
deleted file mode 100644
index 9b66f43aab5..00000000000
--- a/examples/react-rich/public/icons/journal-text.svg
+++ /dev/null
@@ -1,5 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-journal-text" viewBox="0 0 16 16">
-  <path d="M5 10.5a.5.5 0 0 1 .5-.5h2a.5.5 0 0 1 0 1h-2a.5.5 0 0 1-.5-.5zm0-2a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5zm0-2a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5zm0-2a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5z"/>
-  <path d="M3 0h10a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2v-1h1v1a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H3a1 1 0 0 0-1 1v1H1V2a2 2 0 0 1 2-2z"/>
-  <path d="M1 5v-.5a.5.5 0 0 1 1 0V5h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1zm0 3v-.5a.5.5 0 0 1 1 0V8h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1zm0 3v-.5a.5.5 0 0 1 1 0v.5h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1z"/>
-</svg>
\ No newline at end of file
diff --git a/examples/react-rich/public/icons/justify.svg b/examples/react-rich/public/icons/justify.svg
deleted file mode 100644
index 009bd7214d9..00000000000
--- a/examples/react-rich/public/icons/justify.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-justify" viewBox="0 0 16 16">
-  <path fill-rule="evenodd" d="M2 12.5a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5zm0-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5zm0-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5zm0-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z"/>
-</svg>
\ No newline at end of file
diff --git a/examples/react-rich/public/icons/text-center.svg b/examples/react-rich/public/icons/text-center.svg
deleted file mode 100644
index 2887a99f267..00000000000
--- a/examples/react-rich/public/icons/text-center.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-text-center" viewBox="0 0 16 16">
-  <path fill-rule="evenodd" d="M4 12.5a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5zm2-3a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z"/>
-</svg>
\ No newline at end of file
diff --git a/examples/react-rich/public/icons/text-left.svg b/examples/react-rich/public/icons/text-left.svg
deleted file mode 100644
index 04526116489..00000000000
--- a/examples/react-rich/public/icons/text-left.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-text-left" viewBox="0 0 16 16">
-  <path fill-rule="evenodd" d="M2 12.5a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm0-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5zm0-3a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm0-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z"/>
-</svg>
\ No newline at end of file
diff --git a/examples/react-rich/public/icons/text-paragraph.svg b/examples/react-rich/public/icons/text-paragraph.svg
deleted file mode 100644
index 9779beabf1c..00000000000
--- a/examples/react-rich/public/icons/text-paragraph.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-text-paragraph" viewBox="0 0 16 16">
-  <path fill-rule="evenodd" d="M2 12.5a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm0-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5zm0-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5zm4-3a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5z"/>
-</svg>
\ No newline at end of file
diff --git a/examples/react-rich/public/icons/text-right.svg b/examples/react-rich/public/icons/text-right.svg
deleted file mode 100644
index 34686b0f1ff..00000000000
--- a/examples/react-rich/public/icons/text-right.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-text-right" viewBox="0 0 16 16">
-  <path fill-rule="evenodd" d="M6 12.5a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm-4-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5zm4-3a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm-4-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z"/>
-</svg>
\ No newline at end of file
diff --git a/examples/react-rich/public/icons/type-bold.svg b/examples/react-rich/public/icons/type-bold.svg
deleted file mode 100644
index 276d133c25c..00000000000
--- a/examples/react-rich/public/icons/type-bold.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-type-bold" viewBox="0 0 16 16">
-  <path d="M8.21 13c2.106 0 3.412-1.087 3.412-2.823 0-1.306-.984-2.283-2.324-2.386v-.055a2.176 2.176 0 0 0 1.852-2.14c0-1.51-1.162-2.46-3.014-2.46H3.843V13H8.21zM5.908 4.674h1.696c.963 0 1.517.451 1.517 1.244 0 .834-.629 1.32-1.73 1.32H5.908V4.673zm0 6.788V8.598h1.73c1.217 0 1.88.492 1.88 1.415 0 .943-.643 1.449-1.832 1.449H5.907z"/>
-</svg>
\ No newline at end of file
diff --git a/examples/react-rich/public/icons/type-italic.svg b/examples/react-rich/public/icons/type-italic.svg
deleted file mode 100644
index 3ac6b09f02a..00000000000
--- a/examples/react-rich/public/icons/type-italic.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-type-italic" viewBox="0 0 16 16">
-  <path d="M7.991 11.674 9.53 4.455c.123-.595.246-.71 1.347-.807l.11-.52H7.211l-.11.52c1.06.096 1.128.212 1.005.807L6.57 11.674c-.123.595-.246.71-1.346.806l-.11.52h3.774l.11-.52c-1.06-.095-1.129-.211-1.006-.806z"/>
-</svg>
\ No newline at end of file
diff --git a/examples/react-rich/public/icons/type-strikethrough.svg b/examples/react-rich/public/icons/type-strikethrough.svg
deleted file mode 100644
index 1c940e42a87..00000000000
--- a/examples/react-rich/public/icons/type-strikethrough.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-type-strikethrough" viewBox="0 0 16 16">
-  <path d="M6.333 5.686c0 .31.083.581.27.814H5.166a2.776 2.776 0 0 1-.099-.76c0-1.627 1.436-2.768 3.48-2.768 1.969 0 3.39 1.175 3.445 2.85h-1.23c-.11-1.08-.964-1.743-2.25-1.743-1.23 0-2.18.602-2.18 1.607zm2.194 7.478c-2.153 0-3.589-1.107-3.705-2.81h1.23c.144 1.06 1.129 1.703 2.544 1.703 1.34 0 2.31-.705 2.31-1.675 0-.827-.547-1.374-1.914-1.675L8.046 8.5H1v-1h14v1h-3.504c.468.437.675.994.675 1.697 0 1.826-1.436 2.967-3.644 2.967z"/>
-</svg>
\ No newline at end of file
diff --git a/examples/react-rich/public/icons/type-underline.svg b/examples/react-rich/public/icons/type-underline.svg
deleted file mode 100644
index c299b8bf2f0..00000000000
--- a/examples/react-rich/public/icons/type-underline.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-type-underline" viewBox="0 0 16 16">
-  <path d="M5.313 3.136h-1.23V9.54c0 2.105 1.47 3.623 3.917 3.623s3.917-1.518 3.917-3.623V3.136h-1.23v6.323c0 1.49-.978 2.57-2.687 2.57-1.709 0-2.687-1.08-2.687-2.57V3.136zM12.5 15h-9v-1h9v1z"/>
-</svg>
\ No newline at end of file

From 8e9950c6bf5ce39f3d0ff029a0a59202810ddba5 Mon Sep 17 00:00:00 2001
From: Dennis Sheu <dennis@BiX-Skunk-Works.local>
Date: Wed, 8 May 2024 21:31:13 -0700
Subject: [PATCH 4/4] [examples/react-rich] Fix:missing toolbar format icon in
 vite build. Added icons to src.

---
 examples/react-rich/src/icons/LICENSE.md                 | 5 +++++
 examples/react-rich/src/icons/arrow-clockwise.svg        | 4 ++++
 examples/react-rich/src/icons/arrow-counterclockwise.svg | 4 ++++
 examples/react-rich/src/icons/journal-text.svg           | 5 +++++
 examples/react-rich/src/icons/justify.svg                | 3 +++
 examples/react-rich/src/icons/text-center.svg            | 3 +++
 examples/react-rich/src/icons/text-left.svg              | 3 +++
 examples/react-rich/src/icons/text-paragraph.svg         | 3 +++
 examples/react-rich/src/icons/text-right.svg             | 3 +++
 examples/react-rich/src/icons/type-bold.svg              | 3 +++
 examples/react-rich/src/icons/type-italic.svg            | 3 +++
 examples/react-rich/src/icons/type-strikethrough.svg     | 3 +++
 examples/react-rich/src/icons/type-underline.svg         | 3 +++
 13 files changed, 45 insertions(+)
 create mode 100644 examples/react-rich/src/icons/LICENSE.md
 create mode 100644 examples/react-rich/src/icons/arrow-clockwise.svg
 create mode 100644 examples/react-rich/src/icons/arrow-counterclockwise.svg
 create mode 100644 examples/react-rich/src/icons/journal-text.svg
 create mode 100644 examples/react-rich/src/icons/justify.svg
 create mode 100644 examples/react-rich/src/icons/text-center.svg
 create mode 100644 examples/react-rich/src/icons/text-left.svg
 create mode 100644 examples/react-rich/src/icons/text-paragraph.svg
 create mode 100644 examples/react-rich/src/icons/text-right.svg
 create mode 100644 examples/react-rich/src/icons/type-bold.svg
 create mode 100644 examples/react-rich/src/icons/type-italic.svg
 create mode 100644 examples/react-rich/src/icons/type-strikethrough.svg
 create mode 100644 examples/react-rich/src/icons/type-underline.svg

diff --git a/examples/react-rich/src/icons/LICENSE.md b/examples/react-rich/src/icons/LICENSE.md
new file mode 100644
index 00000000000..ce74f6abeed
--- /dev/null
+++ b/examples/react-rich/src/icons/LICENSE.md
@@ -0,0 +1,5 @@
+Bootstrap Icons
+https://icons.getbootstrap.com
+
+Licensed under MIT license
+https://github.com/twbs/icons/blob/main/LICENSE.md
diff --git a/examples/react-rich/src/icons/arrow-clockwise.svg b/examples/react-rich/src/icons/arrow-clockwise.svg
new file mode 100644
index 00000000000..b072eb097ab
--- /dev/null
+++ b/examples/react-rich/src/icons/arrow-clockwise.svg
@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-arrow-clockwise" viewBox="0 0 16 16">
+  <path fill-rule="evenodd" d="M8 3a5 5 0 1 0 4.546 2.914.5.5 0 0 1 .908-.417A6 6 0 1 1 8 2v1z"/>
+  <path d="M8 4.466V.534a.25.25 0 0 1 .41-.192l2.36 1.966c.12.1.12.284 0 .384L8.41 4.658A.25.25 0 0 1 8 4.466z"/>
+</svg>
\ No newline at end of file
diff --git a/examples/react-rich/src/icons/arrow-counterclockwise.svg b/examples/react-rich/src/icons/arrow-counterclockwise.svg
new file mode 100644
index 00000000000..b0b23b9bbc4
--- /dev/null
+++ b/examples/react-rich/src/icons/arrow-counterclockwise.svg
@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-arrow-counterclockwise" viewBox="0 0 16 16">
+  <path fill-rule="evenodd" d="M8 3a5 5 0 1 1-4.546 2.914.5.5 0 0 0-.908-.417A6 6 0 1 0 8 2v1z"/>
+  <path d="M8 4.466V.534a.25.25 0 0 0-.41-.192L5.23 2.308a.25.25 0 0 0 0 .384l2.36 1.966A.25.25 0 0 0 8 4.466z"/>
+</svg>
\ No newline at end of file
diff --git a/examples/react-rich/src/icons/journal-text.svg b/examples/react-rich/src/icons/journal-text.svg
new file mode 100644
index 00000000000..9b66f43aab5
--- /dev/null
+++ b/examples/react-rich/src/icons/journal-text.svg
@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-journal-text" viewBox="0 0 16 16">
+  <path d="M5 10.5a.5.5 0 0 1 .5-.5h2a.5.5 0 0 1 0 1h-2a.5.5 0 0 1-.5-.5zm0-2a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5zm0-2a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5zm0-2a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5z"/>
+  <path d="M3 0h10a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2v-1h1v1a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H3a1 1 0 0 0-1 1v1H1V2a2 2 0 0 1 2-2z"/>
+  <path d="M1 5v-.5a.5.5 0 0 1 1 0V5h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1zm0 3v-.5a.5.5 0 0 1 1 0V8h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1zm0 3v-.5a.5.5 0 0 1 1 0v.5h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1z"/>
+</svg>
\ No newline at end of file
diff --git a/examples/react-rich/src/icons/justify.svg b/examples/react-rich/src/icons/justify.svg
new file mode 100644
index 00000000000..009bd7214d9
--- /dev/null
+++ b/examples/react-rich/src/icons/justify.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-justify" viewBox="0 0 16 16">
+  <path fill-rule="evenodd" d="M2 12.5a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5zm0-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5zm0-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5zm0-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z"/>
+</svg>
\ No newline at end of file
diff --git a/examples/react-rich/src/icons/text-center.svg b/examples/react-rich/src/icons/text-center.svg
new file mode 100644
index 00000000000..2887a99f267
--- /dev/null
+++ b/examples/react-rich/src/icons/text-center.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-text-center" viewBox="0 0 16 16">
+  <path fill-rule="evenodd" d="M4 12.5a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5zm2-3a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z"/>
+</svg>
\ No newline at end of file
diff --git a/examples/react-rich/src/icons/text-left.svg b/examples/react-rich/src/icons/text-left.svg
new file mode 100644
index 00000000000..04526116489
--- /dev/null
+++ b/examples/react-rich/src/icons/text-left.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-text-left" viewBox="0 0 16 16">
+  <path fill-rule="evenodd" d="M2 12.5a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm0-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5zm0-3a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm0-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z"/>
+</svg>
\ No newline at end of file
diff --git a/examples/react-rich/src/icons/text-paragraph.svg b/examples/react-rich/src/icons/text-paragraph.svg
new file mode 100644
index 00000000000..9779beabf1c
--- /dev/null
+++ b/examples/react-rich/src/icons/text-paragraph.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-text-paragraph" viewBox="0 0 16 16">
+  <path fill-rule="evenodd" d="M2 12.5a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm0-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5zm0-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5zm4-3a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5z"/>
+</svg>
\ No newline at end of file
diff --git a/examples/react-rich/src/icons/text-right.svg b/examples/react-rich/src/icons/text-right.svg
new file mode 100644
index 00000000000..34686b0f1ff
--- /dev/null
+++ b/examples/react-rich/src/icons/text-right.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-text-right" viewBox="0 0 16 16">
+  <path fill-rule="evenodd" d="M6 12.5a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm-4-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5zm4-3a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm-4-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z"/>
+</svg>
\ No newline at end of file
diff --git a/examples/react-rich/src/icons/type-bold.svg b/examples/react-rich/src/icons/type-bold.svg
new file mode 100644
index 00000000000..276d133c25c
--- /dev/null
+++ b/examples/react-rich/src/icons/type-bold.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-type-bold" viewBox="0 0 16 16">
+  <path d="M8.21 13c2.106 0 3.412-1.087 3.412-2.823 0-1.306-.984-2.283-2.324-2.386v-.055a2.176 2.176 0 0 0 1.852-2.14c0-1.51-1.162-2.46-3.014-2.46H3.843V13H8.21zM5.908 4.674h1.696c.963 0 1.517.451 1.517 1.244 0 .834-.629 1.32-1.73 1.32H5.908V4.673zm0 6.788V8.598h1.73c1.217 0 1.88.492 1.88 1.415 0 .943-.643 1.449-1.832 1.449H5.907z"/>
+</svg>
\ No newline at end of file
diff --git a/examples/react-rich/src/icons/type-italic.svg b/examples/react-rich/src/icons/type-italic.svg
new file mode 100644
index 00000000000..3ac6b09f02a
--- /dev/null
+++ b/examples/react-rich/src/icons/type-italic.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-type-italic" viewBox="0 0 16 16">
+  <path d="M7.991 11.674 9.53 4.455c.123-.595.246-.71 1.347-.807l.11-.52H7.211l-.11.52c1.06.096 1.128.212 1.005.807L6.57 11.674c-.123.595-.246.71-1.346.806l-.11.52h3.774l.11-.52c-1.06-.095-1.129-.211-1.006-.806z"/>
+</svg>
\ No newline at end of file
diff --git a/examples/react-rich/src/icons/type-strikethrough.svg b/examples/react-rich/src/icons/type-strikethrough.svg
new file mode 100644
index 00000000000..1c940e42a87
--- /dev/null
+++ b/examples/react-rich/src/icons/type-strikethrough.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-type-strikethrough" viewBox="0 0 16 16">
+  <path d="M6.333 5.686c0 .31.083.581.27.814H5.166a2.776 2.776 0 0 1-.099-.76c0-1.627 1.436-2.768 3.48-2.768 1.969 0 3.39 1.175 3.445 2.85h-1.23c-.11-1.08-.964-1.743-2.25-1.743-1.23 0-2.18.602-2.18 1.607zm2.194 7.478c-2.153 0-3.589-1.107-3.705-2.81h1.23c.144 1.06 1.129 1.703 2.544 1.703 1.34 0 2.31-.705 2.31-1.675 0-.827-.547-1.374-1.914-1.675L8.046 8.5H1v-1h14v1h-3.504c.468.437.675.994.675 1.697 0 1.826-1.436 2.967-3.644 2.967z"/>
+</svg>
\ No newline at end of file
diff --git a/examples/react-rich/src/icons/type-underline.svg b/examples/react-rich/src/icons/type-underline.svg
new file mode 100644
index 00000000000..c299b8bf2f0
--- /dev/null
+++ b/examples/react-rich/src/icons/type-underline.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-type-underline" viewBox="0 0 16 16">
+  <path d="M5.313 3.136h-1.23V9.54c0 2.105 1.47 3.623 3.917 3.623s3.917-1.518 3.917-3.623V3.136h-1.23v6.323c0 1.49-.978 2.57-2.687 2.57-1.709 0-2.687-1.08-2.687-2.57V3.136zM12.5 15h-9v-1h9v1z"/>
+</svg>
\ No newline at end of file