Merge pull request #4370 from serlo/plugin-icons-as-react-components

refactor(editor): package plugin icons as react components (to remove `dangerouslySetInnerHtml`)
serlo · Dec 20, 2024 · ac642fa · ac642fa
2 parents 3a44257 + b8dfab4
commit ac642fa
Show file tree

Hide file tree

Showing 27 changed files with 908 additions and 30 deletions.
diff --git a/packages/editor/src/editor-ui/assets/plugin-icons/icon-audio.tsx b/packages/editor/src/editor-ui/assets/plugin-icons/icon-audio.tsx
@@ -0,0 +1,52 @@
+export function AudioIcon() {
+  return (
+    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 61 40" fill="none">
+      <rect width="60" height="40" fill="#FFF5E9" />
+      <rect
+        width="43"
+        height="23"
+        transform="translate(8.5 5.18077)"
+        fill="#FFDDB2"
+      />
+      <path
+        d="M31.8341 14.7394C32.7227 15.8115 32.7227 17.5497 31.8341 18.6217"
+        stroke="#57534F"
+        strokeWidth="0.65"
+        strokeMiterlimit="2"
+        strokeLinecap="round"
+      />
+      <path
+        d="M32.8945 13.4606C34.3687 15.2392 34.3687 18.1231 32.8945 19.9018"
+        stroke="#57534F"
+        strokeWidth="0.65"
+        strokeMiterlimit="2"
+        strokeLinecap="round"
+      />
+      <path
+        d="M33.9548 12.1808C36.0149 14.6661 36.0149 18.6955 33.9548 21.1808"
+        stroke="#57534F"
+        strokeWidth="0.65"
+        strokeMiterlimit="2"
+        strokeLinecap="round"
+      />
+      <path
+        d="M26.4897 14.6435H25.3154C24.8658 14.6435 24.5 15.0848 24.5 15.6274V17.7355C24.5 18.278 24.8658 18.7194 25.3154 18.7194H26.4897V14.6435Z"
+        fill="#57534F"
+      />
+      <path
+        d="M30.5116 12.5493C30.3675 12.4512 30.1966 12.4547 30.0551 12.5585L27.2123 14.6429H27.2109V18.7188H27.2123L30.0551 20.8031C30.128 20.8566 30.2089 20.8834 30.2897 20.8834C30.3658 20.8834 30.4418 20.8598 30.5116 20.8124C30.6561 20.7144 30.7422 20.5366 30.7422 20.3368V13.0248C30.7422 12.825 30.6561 12.6473 30.5116 12.5493Z"
+        fill="#57534F"
+      />
+      <rect x="8.5" y="28.1808" width="12" height="1" fill="#FFBB62" />
+      <rect x="20.5" y="28.1808" width="31" height="1" fill="#EBE1D6" />
+      <rect
+        x="8.53589"
+        y="32.1808"
+        width="42.9282"
+        height="2.63846"
+        fill="black"
+        fillOpacity="0.08"
+      />
+    </svg>
+  )
+}
diff --git a/packages/editor/src/editor-ui/assets/plugin-icons/icon-blanks-dnd.tsx b/packages/editor/src/editor-ui/assets/plugin-icons/icon-blanks-dnd.tsx
@@ -0,0 +1,58 @@
+export function BlanksDndIcon() {
+  return (
+    <svg
+      width="100%"
+      height="100%"
+      viewBox="0 0 90 60"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <rect width="90" height="60" rx="4" fill="#FFEFDA" />
+      <rect width="90" height="50" transform="translate(0 5)" fill="#FFEFDA" />
+      <rect x="22.5" y="21" width="9" height="3" fill="#FFBE5D" />
+      <rect
+        x="32.65"
+        y="21.15"
+        width="9.7"
+        height="2.7"
+        rx="0.35"
+        stroke="#57534F"
+        strokeWidth="0.3"
+        strokeDasharray="1 1"
+      />
+      <rect x="43.5" y="21" width="24" height="3" fill="#FFBE5D" />
+      <rect x="22.5" y="26" width="45" height="3" fill="#FFBE5D" />
+      <rect x="22.5" y="31" width="24" height="3" fill="#FFBE5D" />
+      <rect
+        x="47.65"
+        y="31.15"
+        width="9.7"
+        height="2.7"
+        rx="0.35"
+        stroke="#57534F"
+        strokeWidth="0.3"
+        strokeDasharray="1 1"
+      />
+      <rect x="58.5" y="31" width="9" height="3" fill="#FFBE5D" />
+      <rect x="22.5" y="36" width="13" height="3" fill="#FFBE5D" />
+      <rect
+        x="36.65"
+        y="36.15"
+        width="9.7"
+        height="2.7"
+        rx="0.35"
+        stroke="#57534F"
+        strokeWidth="0.3"
+        strokeDasharray="1 1"
+      />
+      <path
+        d="M48.4841 36.468L48.968 35.9841L49.4519 35.7422H51.1454H68.5648H71.2261L71.9519 36.2261L72.4357 36.9519V39.3712V40.8228H71.9519L71.468 41.3067L70.7422 41.0648L70.0164 41.7906L69.5325 40.5809L68.8067 40.097L68.3228 40.339L68.0809 41.0648L70.2583 44.2099L70.9841 45.4196L70.7422 45.1777H70.0164L69.5325 44.6938H68.8067L68.5648 44.9357V45.4196V45.9035H55.0164H51.8712H49.6938H48.968L48.4841 45.4196L48.2422 45.1777V43.968V43.0003V41.7906V40.339V38.8873V37.4357L48.4841 36.468Z"
+        fill="#FFEFDA"
+      />
+      <path
+        d="M67.5459 45.6614C67.6593 45.6614 67.7403 45.7622 67.7403 45.863C67.7403 45.9638 67.6593 46.0645 67.5621 46.0645H67.5459H66.4604C66.347 46.0645 66.266 45.9638 66.266 45.863C66.266 45.7622 66.347 45.6614 66.4442 45.6614H66.4604H67.5459ZM69.4738 40.3372L70.2028 41.4121C70.2514 41.2609 70.3487 41.1266 70.4945 41.0426C70.7861 40.8411 71.2073 40.8578 71.4665 41.0426C71.5151 40.8914 71.6123 40.7403 71.742 40.6563C72.0498 40.438 72.552 40.5051 72.8112 40.7403C72.8598 40.5891 72.957 40.4715 73.0866 40.3708C73.4269 40.1356 73.9939 40.2364 74.2207 40.5387V40.5555L74.3179 40.6563C74.7878 41.1938 75.1766 41.748 75.5006 42.3023L75.5654 42.4199L75.6626 42.6046L75.7598 42.7894L75.8408 42.9573C76.2297 43.6963 76.4079 44.217 76.6509 45.208C76.6995 45.4431 76.7643 45.6614 76.8453 45.863C77.0721 45.8294 77.3151 45.8966 77.4771 46.0813L77.4933 46.1149L77.8498 46.5684C78.0766 46.8707 78.0442 47.2906 77.7688 47.5426L77.7364 47.5594L74.9822 49.8604C74.6906 50.0955 74.2855 50.0619 74.0425 49.7764L74.0263 49.7428L73.6699 49.2893C73.5079 49.0878 73.4755 48.8358 73.5565 48.6175H73.5403H73.5241C73.3459 48.5167 73.1352 48.4495 72.9084 48.3991L72.8274 48.3824H72.8112C70.9481 47.8785 68.4855 46.2493 68.2587 45.4767C68.0481 44.7881 68.5503 44.4018 69.1336 44.4857C69.3118 44.5193 69.7492 44.6705 70.4297 44.9896L70.6565 45.0904L70.6241 45.0568C70.3649 44.6537 70.1218 44.3178 69.9112 43.9819L69.49 43.3436L68.9392 42.5374C68.6961 42.1847 68.4207 41.7816 68.1291 41.3281C67.8537 40.9082 67.9347 40.3372 68.3073 40.0684C68.6799 39.8165 69.1984 39.9341 69.4738 40.3372ZM76.7967 46.2829L76.7805 46.2997L74.0101 48.6175C73.8967 48.7183 73.8643 48.8862 73.9615 49.0038L73.9777 49.0206L74.3341 49.4741C74.4313 49.5916 74.5933 49.6252 74.7068 49.5245L74.723 49.5077L77.4933 47.1899C77.6067 47.0891 77.6392 46.9211 77.5419 46.8036L77.5257 46.7868L77.1855 46.3333C77.0883 46.2157 76.9263 46.1989 76.7967 46.2829ZM68.5341 40.4212C68.3397 40.5555 68.3073 40.8578 68.4531 41.093L69.247 42.2519L69.7006 42.9405C69.814 43.1085 69.9112 43.2596 70.0084 43.4108L70.1542 43.6292C70.5269 44.2002 70.9643 44.8049 71.4503 45.4599C71.5799 45.6278 71.4017 45.863 71.2073 45.779L70.7375 45.5607L70.4297 45.4263C69.6844 45.0904 69.2308 44.9224 69.085 44.8888C68.7609 44.8384 68.5665 45.0064 68.6637 45.3423C68.8419 45.9302 71.1425 47.4586 72.876 47.9625L72.9246 47.9793L72.9894 47.9961C73.2325 48.0464 73.4431 48.1304 73.6537 48.2312L73.7185 48.2648C73.7347 48.2816 73.7671 48.2984 73.7833 48.3152L76.4889 46.0477C76.4079 45.8126 76.3269 45.5775 76.2621 45.3087L76.2135 45.1072C75.9542 44.0826 75.7598 43.6124 75.209 42.655C74.885 42.0839 74.4961 41.5129 74.0101 40.9586L73.9129 40.7907L73.8967 40.7739C73.8157 40.6563 73.4755 40.5891 73.3135 40.7067C73.1515 40.8075 73.1028 41.1098 73.1839 41.2609L73.2001 41.2777L73.6051 41.8824C73.6699 41.9832 73.6375 42.1007 73.5565 42.1679C73.4755 42.2351 73.3459 42.2183 73.2811 42.1343L73.2649 42.1175L73.0056 41.7144L72.9732 41.6976L72.552 41.0594C72.471 40.9418 72.1308 40.8746 71.9526 40.9922C71.8068 41.093 71.7582 41.3953 71.8392 41.5297L71.8554 41.5465L72.5034 42.5374L72.6006 42.6718C72.6654 42.7726 72.633 42.8901 72.552 42.9573C72.471 43.0245 72.3414 43.0077 72.2766 42.9237L72.2604 42.9069L71.2883 41.4121C71.2073 41.2945 70.8833 41.2442 70.7051 41.3785C70.5431 41.4961 70.4945 41.7648 70.5755 41.8992L70.5917 41.916L71.6609 43.562V43.5788L71.6771 43.5956V43.6124V43.6292C71.6771 43.6459 71.6771 43.6459 71.6771 43.6627V43.6795V43.6963V43.7131V43.7299L71.6609 43.7467L71.6447 43.7635L71.6285 43.7803V43.8139L71.6123 43.8307L71.5961 43.8475C71.5961 43.8475 71.5799 43.8643 71.5637 43.8643H71.5475H71.5313H71.5151H71.4827H71.4665H71.4503H71.4341C71.4179 43.8643 71.4179 43.8643 71.4017 43.8475L71.3693 43.8307L71.3531 43.8139V43.8307L71.3369 43.8139L71.3207 43.7971L71.3045 43.7803L69.166 40.6059C69.004 40.3708 68.7123 40.2868 68.5341 40.4212ZM71.0615 35.5C71.8716 35.5 72.5358 36.1718 72.552 37.0116V37.062V39.4302C72.552 39.5478 72.4548 39.6318 72.3576 39.6318C72.2604 39.6318 72.1632 39.5478 72.1632 39.447V39.4302V37.0452C72.1632 36.4406 71.6933 35.9367 71.1101 35.9199H71.0777L49.5067 35.9868C48.9235 35.9868 48.4374 36.4739 48.4212 37.0786V37.1122V44.5863C48.4212 45.1909 48.8911 45.6948 49.4743 45.7116H49.5067L65.7476 45.6446C65.861 45.6446 65.942 45.7454 65.942 45.8462C65.942 45.947 65.861 46.0477 65.7638 46.0477H65.7476L49.4905 46.1147C48.6805 46.1147 48.0162 45.4429 48 44.6031V44.5527V37.1122C48 36.2724 48.648 35.5837 49.4581 35.5669H49.5067L71.0615 35.5Z"
+        fill="#57534F"
+      />
+    </svg>
+  )
+}
diff --git a/packages/editor/src/editor-ui/assets/plugin-icons/icon-blanks-typing.tsx b/packages/editor/src/editor-ui/assets/plugin-icons/icon-blanks-typing.tsx
@@ -0,0 +1,27 @@
+export function BlanksTypingIcon() {
+  return (
+    <svg
+      width="100%"
+      height="100%"
+      viewBox="0 0 90 60"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <g clipPath="url(#clip0_10649_33098)">
+        <rect width="90" height="60" fill="#FFEFDA" />
+        <rect x="22.5" y="18" width="9" height="3" fill="#FFBE5D" />
+        <rect x="42.5" y="18" width="25" height="3" fill="#FFBE5D" />
+        <rect x="22.5" y="25" width="45" height="3" fill="#FFBE5D" />
+        <rect x="22.5" y="32" width="25" height="3" fill="#FFBE5D" />
+        <rect x="58.5" y="32" width="9" height="3" fill="#FFBE5D" />
+        <rect x="22.5" y="39" width="13" height="3" fill="#FFBE5D" />
+        <rect x="48.5" y="39" width="19" height="3" fill="#FFBE5D" />
+      </g>
+      <defs>
+        <clipPath id="clip0_10649_33098">
+          <rect width="90" height="60" rx="4" fill="white" />
+        </clipPath>
+      </defs>
+    </svg>
+  )
+}
diff --git a/packages/editor/src/editor-ui/assets/plugin-icons/icon-box.tsx b/packages/editor/src/editor-ui/assets/plugin-icons/icon-box.tsx
@@ -0,0 +1,34 @@
+export function BoxIcon() {
+  return (
+    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 61 40" fill="none">
+      <path fill="#FFF5E9" d="M.084 0h60v40h-60z" />
+      <path
+        fill="#000"
+        fillOpacity=".08"
+        d="M10.084 3.565h42.928v2.638H10.084z"
+      />
+      <path
+        fill="#57534F"
+        d="M18.77 17.52a.235.235 0 0 0 .204-.12.265.265 0 0 0 .032-.117.212.212 0 0 0-.033-.123l-2.218-3.837a.249.249 0 0 0-.21-.12.248.248 0 0 0-.21.12l-2.218 3.837a.216.216 0 0 0-.033.123.26.26 0 0 0 .033.117.235.235 0 0 0 .204.12h4.449Zm-2.225-.72a.233.233 0 0 1-.17-.069.231.231 0 0 1-.07-.17c0-.068.023-.125.07-.171a.23.23 0 0 1 .17-.07c.068 0 .125.024.171.07a.231.231 0 0 1 .07.17.232.232 0 0 1-.07.172.231.231 0 0 1-.17.068Zm0-.719a.233.233 0 0 1-.17-.07.232.232 0 0 1-.07-.17v-.72c0-.067.023-.124.07-.17a.231.231 0 0 1 .17-.07c.068 0 .125.024.171.07a.231.231 0 0 1 .07.17v.72a.232.232 0 0 1-.07.171.231.231 0 0 1-.17.069Z"
+      />
+      <path
+        fill="#FFD59D"
+        d="M14.084 20.52h24.178v2.638H14.084zM14.084 24.158h15.317v2.638H14.084z"
+      />
+      <rect
+        width="42.1"
+        height="18.693"
+        x="10.534"
+        y="10.653"
+        stroke="#FFBB62"
+        strokeWidth=".9"
+        rx="1.55"
+      />
+      <path
+        fill="#000"
+        fillOpacity=".08"
+        d="M10.084 33.797h42.928v2.638H10.084z"
+      />
+    </svg>
+  )
+}
diff --git a/packages/editor/src/editor-ui/assets/plugin-icons/icon-dropzones.tsx b/packages/editor/src/editor-ui/assets/plugin-icons/icon-dropzones.tsx
@@ -0,0 +1,60 @@
+export function DropzonesIcon() {
+  return (
+    <svg
+      viewBox="0 0 90 60"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      preserveAspectRatio="xMidYMid meet"
+    >
+      <rect width="90" height="60" rx="4" fill="#FFEFDA" />
+      <g clipPath="url(#clip0_10788_34096)">
+        <rect
+          width="90"
+          height="50"
+          transform="translate(0 5)"
+          fill="#FFEFDA"
+        />
+        <rect x="7.5" y="12" width="75" height="36" rx="1" fill="#FFD59D" />
+        <path
+          d="M41.4286 28.6429L38 33.5H52.2857L47.7143 27.5L44.2857 32.3571L41.4286 28.6429Z"
+          fill="#575350"
+          stroke="#575350"
+          strokeWidth="0.5"
+          strokeLinejoin="round"
+        />
+        <rect
+          x="15.25"
+          y="20.25"
+          width="20"
+          height="7"
+          rx="0.25"
+          stroke="#57534F"
+          strokeWidth="0.5"
+          strokeDasharray="1 1"
+        />
+        <path
+          d="M73.25 49.75L73 50L73.25 50.75L74 51.5L75.25 52.25L77.25 53L78.25 53.5V54L79 54.75L79.75 54.5L81 53.25L82 52.5L82.25 51.75L81.75 51.25L81.25 51L81 50.75L80.5 48.75L79.5 47L78.5 45.5H77.75L77.25 46L76.5 45.75L75.75 46.25L75.25 46L74.75 46.5H74.5L74 45.75L73.5 45.25H73L72.75 45.75L73 46.75L74 47.75L74.75 49L75.25 49.75L75.5 50.5L75 50.25L74.5 50L73.75 49.75H73.25Z"
+          fill="#FFEFDA"
+        />
+        <path
+          d="M52.9841 41.468L53.468 40.9841L53.9519 40.7422H55.6454H73.0648H75.7261L76.4519 41.2261L76.9357 41.9519V44.3712V45.8228H76.4519L75.968 46.3067L75.2422 46.0648L74.5164 46.7906L74.0325 45.5809L73.3067 45.097L72.8228 45.339L72.5809 46.0648L74.7583 49.2099L75.4841 50.4196L75.2422 50.1777H74.5164L74.0325 49.6938H73.3067L73.0648 49.9357V50.4196V50.9035H59.5164H56.3712H54.1938H53.468L52.9841 50.4196L52.7422 50.1777V48.968V48.0003V46.7906V45.339V43.8873V42.4357L52.9841 41.468Z"
+          fill="#FFEFDA"
+        />
+        <path
+          d="M72.0459 50.6614C72.1593 50.6614 72.2403 50.7622 72.2403 50.863C72.2403 50.9638 72.1593 51.0645 72.0621 51.0645H72.0459H70.9604C70.847 51.0645 70.766 50.9638 70.766 50.863C70.766 50.7622 70.847 50.6614 70.9442 50.6614H70.9604H72.0459ZM73.9738 45.3372L74.7028 46.4121C74.7514 46.2609 74.8487 46.1266 74.9945 46.0426C75.2861 45.8411 75.7073 45.8578 75.9665 46.0426C76.0151 45.8914 76.1123 45.7403 76.242 45.6563C76.5498 45.438 77.052 45.5051 77.3112 45.7403C77.3598 45.5891 77.457 45.4715 77.5866 45.3708C77.9269 45.1356 78.4939 45.2364 78.7207 45.5387V45.5555L78.8179 45.6563C79.2878 46.1938 79.6766 46.748 80.0006 47.3023L80.0654 47.4199L80.1626 47.6046L80.2598 47.7894L80.3408 47.9573C80.7297 48.6963 80.9079 49.217 81.1509 50.208C81.1995 50.4431 81.2643 50.6614 81.3453 50.863C81.5721 50.8294 81.8151 50.8966 81.9771 51.0813L81.9933 51.1149L82.3498 51.5684C82.5766 51.8707 82.5442 52.2906 82.2688 52.5426L82.2364 52.5594L79.4822 54.8604C79.1906 55.0955 78.7855 55.0619 78.5425 54.7764L78.5263 54.7428L78.1699 54.2893C78.0079 54.0878 77.9755 53.8358 78.0565 53.6175H78.0403H78.0241C77.8459 53.5167 77.6352 53.4495 77.4084 53.3991L77.3274 53.3824H77.3112C75.4481 52.8785 72.9855 51.2493 72.7587 50.4767C72.5481 49.7881 73.0503 49.4018 73.6336 49.4857C73.8118 49.5193 74.2492 49.6705 74.9297 49.9896L75.1565 50.0904L75.1241 50.0568C74.8649 49.6537 74.6218 49.3178 74.4112 48.9819L73.99 48.3436L73.4392 47.5374C73.1961 47.1847 72.9207 46.7816 72.6291 46.3281C72.3537 45.9082 72.4347 45.3372 72.8073 45.0684C73.1799 44.8165 73.6984 44.9341 73.9738 45.3372ZM81.2967 51.2829L81.2805 51.2997L78.5101 53.6175C78.3967 53.7183 78.3643 53.8862 78.4615 54.0038L78.4777 54.0206L78.8341 54.4741C78.9313 54.5916 79.0933 54.6252 79.2068 54.5245L79.223 54.5077L81.9933 52.1899C82.1067 52.0891 82.1392 51.9211 82.0419 51.8036L82.0257 51.7868L81.6855 51.3333C81.5883 51.2157 81.4263 51.1989 81.2967 51.2829ZM73.0341 45.4212C72.8397 45.5555 72.8073 45.8578 72.9531 46.093L73.747 47.2519L74.2006 47.9405C74.314 48.1085 74.4112 48.2596 74.5084 48.4108L74.6542 48.6292C75.0269 49.2002 75.4643 49.8049 75.9503 50.4599C76.0799 50.6278 75.9017 50.863 75.7073 50.779L75.2375 50.5607L74.9297 50.4263C74.1844 50.0904 73.7308 49.9224 73.585 49.8888C73.2609 49.8384 73.0665 50.0064 73.1637 50.3423C73.342 50.9302 75.6425 52.4586 77.376 52.9625L77.4246 52.9793L77.4894 52.9961C77.7325 53.0464 77.9431 53.1304 78.1537 53.2312L78.2185 53.2648C78.2347 53.2816 78.2671 53.2984 78.2833 53.3152L80.9889 51.0477C80.9079 50.8126 80.8269 50.5775 80.7621 50.3087L80.7135 50.1072C80.4542 49.0826 80.2598 48.6124 79.709 47.655C79.385 47.0839 78.9961 46.5129 78.5101 45.9586L78.4129 45.7907L78.3967 45.7739C78.3157 45.6563 77.9755 45.5891 77.8135 45.7067C77.6515 45.8075 77.6028 46.1098 77.6839 46.2609L77.7001 46.2777L78.1051 46.8824C78.1699 46.9832 78.1375 47.1007 78.0565 47.1679C77.9755 47.2351 77.8459 47.2183 77.7811 47.1343L77.7649 47.1175L77.5056 46.7144L77.4732 46.6976L77.052 46.0594C76.971 45.9418 76.6308 45.8746 76.4526 45.9922C76.3068 46.093 76.2582 46.3953 76.3392 46.5297L76.3554 46.5465L77.0034 47.5374L77.1006 47.6718C77.1654 47.7726 77.133 47.8901 77.052 47.9573C76.971 48.0245 76.8414 48.0077 76.7766 47.9237L76.7604 47.9069L75.7883 46.4121C75.7073 46.2945 75.3833 46.2442 75.2051 46.3785C75.0431 46.4961 74.9945 46.7648 75.0755 46.8992L75.0917 46.916L76.1609 48.562V48.5788L76.1771 48.5956V48.6124V48.6292C76.1771 48.6459 76.1771 48.6459 76.1771 48.6627V48.6795V48.6963V48.7131V48.7299L76.1609 48.7467L76.1447 48.7635L76.1285 48.7803V48.8139L76.1123 48.8307L76.0961 48.8475C76.0961 48.8475 76.0799 48.8643 76.0637 48.8643H76.0475H76.0313H76.0151H75.9827H75.9665H75.9503H75.9341C75.9179 48.8643 75.9179 48.8643 75.9017 48.8475L75.8693 48.8307L75.8531 48.8139V48.8307L75.8369 48.8139L75.8207 48.7971L75.8045 48.7803L73.666 45.6059C73.504 45.3708 73.2123 45.2868 73.0341 45.4212ZM75.5615 40.5C76.3716 40.5 77.0358 41.1718 77.052 42.0116V42.062V44.4302C77.052 44.5478 76.9548 44.6318 76.8576 44.6318C76.7604 44.6318 76.6632 44.5478 76.6632 44.447V44.4302V42.0452C76.6632 41.4406 76.1933 40.9367 75.6101 40.9199H75.5777L54.0067 40.9868C53.4235 40.9868 52.9374 41.4739 52.9212 42.0786V42.1122V49.5863C52.9212 50.1909 53.3911 50.6948 53.9743 50.7116H54.0067L70.2476 50.6446C70.361 50.6446 70.442 50.7454 70.442 50.8462C70.442 50.947 70.361 51.0477 70.2638 51.0477H70.2476L53.9905 51.1147C53.1805 51.1147 52.5162 50.4429 52.5 49.6031V49.5527V42.1122C52.5 41.2724 53.148 40.5837 53.9581 40.5669H54.0067L75.5615 40.5Z"
+          fill="#57534F"
+        />
+      </g>
+      <defs>
+        <clipPath id="clip0_10788_34096">
+          <rect
+            width="90"
+            height="50"
+            fill="white"
+            transform="translate(0 5)"
+          />
+        </clipPath>
+      </defs>
+    </svg>
+  )
+}
diff --git a/packages/editor/src/editor-ui/assets/plugin-icons/icon-equations.tsx b/packages/editor/src/editor-ui/assets/plugin-icons/icon-equations.tsx
@@ -0,0 +1,26 @@
+export function EquationsIcon() {
+  return (
+    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 61 40" fill="none">
+      <path fill="#FFF5E9" d="M.084 0h60v40h-60z" />
+      <path fill="#000" fillOpacity=".08" d="M8.62 3.688h42.928v2.638H8.62z" />
+      <path
+        fill="#57534F"
+        d="M17.813 13.41c-.22 0-.403-.042-.55-.128a.791.791 0 0 1-.314-.345.903.903 0 0 1-.072-.462.851.851 0 0 1 .174-.468.916.916 0 0 1 .402-.285c.168-.066.36-.1.579-.1.128 0 .25.012.366.034a2.7 2.7 0 0 1 .339.08l.03-.287c.022-.204-.001-.355-.07-.453-.065-.098-.185-.147-.36-.147a.7.7 0 0 0-.275.05.462.462 0 0 0-.19.148.46.46 0 0 0-.083.228h-.696a.957.957 0 0 1 .204-.546.987.987 0 0 1 .444-.3c.182-.064.38-.096.597-.096.382 0 .664.094.846.282.182.186.255.472.219.858l-.174 1.854h-.552a3.272 3.272 0 0 1-.006-.198c0-.066-.002-.132-.006-.198-.102.158-.22.278-.354.36-.134.08-.3.12-.498.12Zm.18-.54a.663.663 0 0 0 .585-.33.834.834 0 0 0 .117-.353 2.37 2.37 0 0 0-.288-.066 1.574 1.574 0 0 0-.297-.03.755.755 0 0 0-.378.09c-.106.058-.165.156-.177.294a.341.341 0 0 0 .108.285c.08.074.19.11.33.11Z"
+      />
+      <path
+        fill="#57534F"
+        stroke="#57534F"
+        strokeWidth=".368"
+        d="M17.9 22.232v-6.72h.368v6.72z"
+      />
+      <path
+        fill="#57534F"
+        d="m18.084 24.673-1.955-3.386h3.91l-1.955 3.386ZM18.259 29.757a.697.697 0 0 1-.435-.147.847.847 0 0 1-.282-.44l-.198.503h-.414l.384-4.116h.642l-.15 1.566a.995.995 0 0 1 .342-.33.9.9 0 0 1 .447-.114c.198 0 .373.053.525.16.152.105.272.256.36.452.088.194.132.424.132.69 0 .184-.028.38-.084.585a2.095 2.095 0 0 1-.25.58c-.111.18-.252.326-.422.44-.17.114-.37.171-.597.171Zm-.036-.642a.558.558 0 0 0 .327-.096.802.802 0 0 0 .23-.252c.063-.106.109-.22.139-.345.03-.124.045-.246.045-.366 0-.226-.053-.406-.16-.54a.5.5 0 0 0-.41-.2.71.71 0 0 0-.552.297.7.7 0 0 0-.12.35l-.036.42a.795.795 0 0 0 .05.378.61.61 0 0 0 .199.261.48.48 0 0 0 .288.093Z"
+      />
+      <path fill="#FFDEB2" d="M22.341 10h12v4h-12z" />
+      <path fill="#FFBB62" d="M22.341 18h22v4h-22z" />
+      <path fill="#FFDEB2" d="M22.341 26h12v4h-12z" />
+      <path fill="#000" fillOpacity=".08" d="M8.62 33.673h42.928v2.638H8.62z" />
+    </svg>
+  )
+}