mainstack-design-system 0.0.0

package/src/icons/FilterListIcon.tsx

@@ -0,0 +1,35 @@
+/** @format */
+
+import { Icon, IconProps } from "@chakra-ui/icons";
+
+const FilterListIcon = (props: IconProps) => {
+  return (
+    <Icon
+      {...props}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      style={{ maskType: "alpha" }}
+    >
+      <mask
+        id="mask0_1118_40458"
+        style={{ maskType: "alpha" }}
+        maskUnits="userSpaceOnUse"
+        x="0"
+        y="0"
+        width="24"
+        height="24"
+      >
+        <rect width="24" height="24" fill="#D9D9D9" />
+      </mask>
+      <g mask="url(#mask0_1118_40458)">
+        <path
+          d="M10.5 17.5V16.5H13.5V17.5H10.5ZM6.5 12.125V11.125H17.5V12.125H6.5ZM3.5 6.72498V5.72498H20.5V6.72498H3.5Z"
+          fill="currentColor"
+        />
+      </g>
+    </Icon>
+  );
+};
+
+export default FilterListIcon;

package/src/icons/FitbitArrowDownIcon.tsx

@@ -0,0 +1,35 @@
+/** @format */
+
+import { Icon, IconProps } from "@chakra-ui/icons";
+
+const FitbitArrowDownIcon = (props: IconProps) => {
+  return (
+    <Icon
+      {...props}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      style={{ maskType: "alpha" }}
+    >
+      <mask
+        id="mask0_1118_9032"
+        style={{ maskType: "alpha" }}
+        maskUnits="userSpaceOnUse"
+        x="0"
+        y="0"
+        width="24"
+        height="24"
+      >
+        <rect width="24" height="24" fill="#D9D9D9" />
+      </mask>
+      <g mask="url(#mask0_1118_9032)">
+        <path
+          d="M11.5 15.5789V7.21155C11.5 7.06925 11.5478 6.95034 11.6433 6.85482C11.7388 6.75931 11.8577 6.71155 12 6.71155C12.1423 6.71155 12.2612 6.75931 12.3567 6.85482C12.4523 6.95034 12.5 7.06925 12.5 7.21155V15.5789L16.2462 11.8577C16.3397 11.7641 16.4567 11.7132 16.5971 11.7048C16.7375 11.6965 16.8564 11.7475 16.9539 11.8577C17.0474 11.9513 17.091 12.0692 17.0846 12.2115C17.0782 12.3539 17.0282 12.4718 16.9346 12.5654L12.5654 16.9346C12.4039 17.0962 12.2154 17.1769 12 17.1769C11.7846 17.1769 11.5962 17.0962 11.4346 16.9346L7.04616 12.5462C6.95258 12.4526 6.90482 12.3388 6.90289 12.2048C6.90097 12.0709 6.94873 11.9552 7.04616 11.8577C7.13975 11.7513 7.2577 11.7013 7.40001 11.7077C7.54233 11.7141 7.66028 11.7641 7.75386 11.8577L11.5 15.5789Z"
+          fill="currentColor"
+        />
+      </g>
+    </Icon>
+  );
+};
+
+export default FitbitArrowDownIcon;

package/src/icons/FitbitArrowUpwardIcon.tsx

@@ -0,0 +1,35 @@
+/** @format */
+
+import { Icon, IconProps } from "@chakra-ui/icons";
+
+const FitbitArrowUpwardIcon = (props: IconProps) => {
+  return (
+    <Icon
+      {...props}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      style={{ maskType: "alpha" }}
+    >
+      <mask
+        id="mask0_1118_9026"
+        style={{ maskType: "alpha" }}
+        maskUnits="userSpaceOnUse"
+        x="0"
+        y="0"
+        width="24"
+        height="24"
+      >
+        <rect width="24" height="24" fill="#D9D9D9" />
+      </mask>
+      <g mask="url(#mask0_1118_9026)">
+        <path
+          d="M11.5 8.63265L7.75388 12.3538C7.6603 12.4474 7.54331 12.4983 7.40291 12.5067C7.26253 12.515 7.14362 12.464 7.04618 12.3538C6.9526 12.2602 6.90901 12.1423 6.91541 11.9999C6.92183 11.8576 6.97183 11.7397 7.06541 11.6461L11.4347 7.27687C11.5962 7.11532 11.7847 7.03455 12 7.03455C12.2154 7.03455 12.4039 7.11532 12.5654 7.27687L16.9539 11.6653C17.0475 11.7589 17.0952 11.8727 17.0972 12.0067C17.0991 12.1407 17.0513 12.2564 16.9539 12.3538C16.8603 12.4602 16.7424 12.5102 16.6 12.5038C16.4577 12.4974 16.3398 12.4474 16.2462 12.3538L12.5 8.63265V16.9999C12.5 17.1423 12.4523 17.2612 12.3568 17.3567C12.2613 17.4522 12.1424 17.4999 12 17.4999C11.8577 17.4999 11.7388 17.4522 11.6433 17.3567C11.5478 17.2612 11.5 17.1423 11.5 16.9999V8.63265Z"
+          fill="currentColor"
+        />
+      </g>
+    </Icon>
+  );
+};
+
+export default FitbitArrowUpwardIcon;

package/src/icons/FlagIcon.tsx

@@ -0,0 +1,35 @@
+/** @format */
+
+import { Icon, IconProps } from "@chakra-ui/icons";
+
+const FlagIcon = (props: IconProps) => {
+  return (
+    <Icon
+      {...props}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      style={{ maskType: "alpha" }}
+    >
+      <mask
+        id="mask0_1118_8785"
+        style={{ maskType: "alpha" }}
+        maskUnits="userSpaceOnUse"
+        x="0"
+        y="0"
+        width="24"
+        height="24"
+      >
+        <rect width="24" height="24" fill="#D9D9D9" />
+      </mask>
+      <g mask="url(#mask0_1118_8785)">
+        <path
+          d="M6 20.5V5H13.2L13.6 7H19V15H13.8L13.4 13H7V20.5H6ZM14.65 14H18V8H12.75L12.35 6H7V12H14.25L14.65 14Z"
+          fill="currentColor"
+        />
+      </g>
+    </Icon>
+  );
+};
+
+export default FlagIcon;

package/src/icons/FormatAlignCenterIcon.tsx

@@ -0,0 +1,35 @@
+/** @format */
+
+import { Icon, IconProps } from "@chakra-ui/icons";
+
+const FormatAlignCenterIcon = (props: IconProps) => {
+  return (
+    <Icon
+      {...props}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      style={{ maskType: "alpha" }}
+    >
+      <mask
+        id="mask0_1118_8506"
+        style={{ maskType: "alpha" }}
+        maskUnits="userSpaceOnUse"
+        x="0"
+        y="0"
+        width="24"
+        height="24"
+      >
+        <rect width="24" height="24" fill="#C4C4C4" />
+      </mask>
+      <g mask="url(#mask0_1118_8506)">
+        <path
+          d="M4.5 20C4.35833 20 4.23958 19.952 4.14375 19.8561C4.04792 19.7601 4 19.6412 4 19.4993C4 19.3575 4.04792 19.2388 4.14375 19.1433C4.23958 19.0478 4.35833 19 4.5 19H20.5C20.6417 19 20.7604 19.048 20.8563 19.1439C20.9521 19.2399 21 19.3588 21 19.5007C21 19.6425 20.9521 19.7612 20.8563 19.8567C20.7604 19.9522 20.6417 20 20.5 20H4.5ZM8.5 16C8.35833 16 8.23958 15.952 8.14375 15.8561C8.04792 15.7601 8 15.6412 8 15.4993C8 15.3575 8.04792 15.2388 8.14375 15.1433C8.23958 15.0478 8.35833 15 8.5 15H16.5C16.6417 15 16.7604 15.048 16.8562 15.144C16.9521 15.2399 17 15.3588 17 15.5007C17 15.6425 16.9521 15.7612 16.8562 15.8567C16.7604 15.9522 16.6417 16 16.5 16H8.5ZM4.5 12C4.35833 12 4.23958 11.952 4.14375 11.8561C4.04792 11.7601 4 11.6412 4 11.4993C4 11.3575 4.04792 11.2388 4.14375 11.1433C4.23958 11.0478 4.35833 11 4.5 11H20.5C20.6417 11 20.7604 11.048 20.8563 11.144C20.9521 11.2399 21 11.3588 21 11.5007C21 11.6425 20.9521 11.7612 20.8563 11.8567C20.7604 11.9522 20.6417 12 20.5 12H4.5ZM8.5 8C8.35833 8 8.23958 7.95202 8.14375 7.85605C8.04792 7.7601 8 7.64119 8 7.49933C8 7.35746 8.04792 7.23878 8.14375 7.14328C8.23958 7.04776 8.35833 7 8.5 7H16.5C16.6417 7 16.7604 7.04798 16.8562 7.14395C16.9521 7.2399 17 7.35881 17 7.50067C17 7.64254 16.9521 7.76122 16.8562 7.85672C16.7604 7.95224 16.6417 8 16.5 8H8.5ZM4.5 4C4.35833 4 4.23958 3.95202 4.14375 3.85605C4.04792 3.7601 4 3.64119 4 3.49933C4 3.35746 4.04792 3.23878 4.14375 3.14328C4.23958 3.04776 4.35833 3 4.5 3H20.5C20.6417 3 20.7604 3.04798 20.8563 3.14395C20.9521 3.2399 21 3.35881 21 3.50067C21 3.64254 20.9521 3.76122 20.8563 3.85672C20.7604 3.95224 20.6417 4 20.5 4H4.5Z"
+          fill="currentColor"
+        />
+      </g>
+    </Icon>
+  );
+};
+
+export default FormatAlignCenterIcon;

package/src/icons/FormatAlignJustifyIcon.tsx

@@ -0,0 +1,35 @@
+/** @format */
+
+import { Icon, IconProps } from "@chakra-ui/icons";
+
+const FormatAlignJustifyIcon = (props: IconProps) => {
+  return (
+    <Icon
+      {...props}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      style={{ maskType: "alpha" }}
+    >
+      <mask
+        id="mask0_1118_8503"
+        style={{ maskType: "alpha" }}
+        maskUnits="userSpaceOnUse"
+        x="0"
+        y="0"
+        width="24"
+        height="24"
+      >
+        <rect width="24" height="24" fill="#C4C4C4" />
+      </mask>
+      <g mask="url(#mask0_1118_8503)">
+        <path
+          d="M4 20.5C3.85833 20.5 3.73958 20.452 3.64375 20.3561C3.54792 20.2601 3.5 20.1412 3.5 19.9993C3.5 19.8575 3.54792 19.7388 3.64375 19.6433C3.73958 19.5478 3.85833 19.5 4 19.5H20C20.1417 19.5 20.2604 19.548 20.3563 19.6439C20.4521 19.7399 20.5 19.8588 20.5 20.0007C20.5 20.1425 20.4521 20.2612 20.3563 20.3567C20.2604 20.4522 20.1417 20.5 20 20.5H4ZM4 16.5C3.85833 16.5 3.73958 16.452 3.64375 16.3561C3.54792 16.2601 3.5 16.1412 3.5 15.9993C3.5 15.8575 3.54792 15.7388 3.64375 15.6433C3.73958 15.5478 3.85833 15.5 4 15.5H20C20.1417 15.5 20.2604 15.548 20.3563 15.644C20.4521 15.7399 20.5 15.8588 20.5 16.0007C20.5 16.1425 20.4521 16.2612 20.3563 16.3567C20.2604 16.4522 20.1417 16.5 20 16.5H4ZM4 12.5C3.85833 12.5 3.73958 12.452 3.64375 12.3561C3.54792 12.2601 3.5 12.1412 3.5 11.9993C3.5 11.8575 3.54792 11.7388 3.64375 11.6433C3.73958 11.5478 3.85833 11.5 4 11.5H20C20.1417 11.5 20.2604 11.548 20.3563 11.644C20.4521 11.7399 20.5 11.8588 20.5 12.0007C20.5 12.1425 20.4521 12.2612 20.3563 12.3567C20.2604 12.4522 20.1417 12.5 20 12.5H4ZM4 8.5C3.85833 8.5 3.73958 8.45202 3.64375 8.35605C3.54792 8.2601 3.5 8.14119 3.5 7.99933C3.5 7.85746 3.54792 7.73878 3.64375 7.64328C3.73958 7.54776 3.85833 7.5 4 7.5H20C20.1417 7.5 20.2604 7.54798 20.3563 7.64395C20.4521 7.7399 20.5 7.85881 20.5 8.00067C20.5 8.14254 20.4521 8.26122 20.3563 8.35672C20.2604 8.45224 20.1417 8.5 20 8.5H4ZM4 4.5C3.85833 4.5 3.73958 4.45202 3.64375 4.35605C3.54792 4.2601 3.5 4.14119 3.5 3.99933C3.5 3.85746 3.54792 3.73878 3.64375 3.64328C3.73958 3.54776 3.85833 3.5 4 3.5H20C20.1417 3.5 20.2604 3.54798 20.3563 3.64395C20.4521 3.7399 20.5 3.85881 20.5 4.00067C20.5 4.14254 20.4521 4.26122 20.3563 4.35672C20.2604 4.45224 20.1417 4.5 20 4.5H4Z"
+          fill="currentColor"
+        />
+      </g>
+    </Icon>
+  );
+};
+
+export default FormatAlignJustifyIcon;

package/src/icons/FormatAlignLeftIcon.tsx

@@ -0,0 +1,35 @@
+/** @format */
+
+import { Icon, IconProps } from "@chakra-ui/icons";
+
+const FormatAlignLeftIcon = (props: IconProps) => {
+  return (
+    <Icon
+      {...props}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      style={{ maskType: "alpha" }}
+    >
+      <mask
+        id="mask0_1118_8500"
+        style={{ maskType: "alpha" }}
+        maskUnits="userSpaceOnUse"
+        x="0"
+        y="0"
+        width="24"
+        height="24"
+      >
+        <rect width="24" height="24" fill="#C4C4C4" />
+      </mask>
+      <g mask="url(#mask0_1118_8500)">
+        <path
+          d="M4.5 16C4.35833 16 4.23958 15.952 4.14375 15.8561C4.04792 15.7601 4 15.6412 4 15.4993C4 15.3575 4.04792 15.2388 4.14375 15.1433C4.23958 15.0478 4.35833 15 4.5 15H14.5C14.6417 15 14.7604 15.048 14.8562 15.144C14.9521 15.2399 15 15.3588 15 15.5007C15 15.6425 14.9521 15.7612 14.8562 15.8567C14.7604 15.9522 14.6417 16 14.5 16H4.5ZM4.5 8C4.35833 8 4.23958 7.95202 4.14375 7.85605C4.04792 7.7601 4 7.64119 4 7.49933C4 7.35746 4.04792 7.23878 4.14375 7.14328C4.23958 7.04776 4.35833 7 4.5 7H14.5C14.6417 7 14.7604 7.04798 14.8562 7.14395C14.9521 7.2399 15 7.35881 15 7.50067C15 7.64254 14.9521 7.76122 14.8562 7.85672C14.7604 7.95224 14.6417 8 14.5 8H4.5ZM4.5 12C4.35833 12 4.23958 11.952 4.14375 11.8561C4.04792 11.7601 4 11.6412 4 11.4993C4 11.3575 4.04792 11.2388 4.14375 11.1433C4.23958 11.0478 4.35833 11 4.5 11H20.5C20.6417 11 20.7604 11.048 20.8563 11.144C20.9521 11.2399 21 11.3588 21 11.5007C21 11.6425 20.9521 11.7612 20.8563 11.8567C20.7604 11.9522 20.6417 12 20.5 12H4.5ZM4.5 20C4.35833 20 4.23958 19.952 4.14375 19.8561C4.04792 19.7601 4 19.6412 4 19.4993C4 19.3575 4.04792 19.2388 4.14375 19.1433C4.23958 19.0478 4.35833 19 4.5 19H20.5C20.6417 19 20.7604 19.048 20.8563 19.1439C20.9521 19.2399 21 19.3588 21 19.5007C21 19.6425 20.9521 19.7612 20.8563 19.8567C20.7604 19.9522 20.6417 20 20.5 20H4.5ZM4.5 4C4.35833 4 4.23958 3.95202 4.14375 3.85605C4.04792 3.7601 4 3.64119 4 3.49933C4 3.35746 4.04792 3.23878 4.14375 3.14328C4.23958 3.04776 4.35833 3 4.5 3H20.5C20.6417 3 20.7604 3.04798 20.8563 3.14395C20.9521 3.2399 21 3.35881 21 3.50067C21 3.64254 20.9521 3.76122 20.8563 3.85672C20.7604 3.95224 20.6417 4 20.5 4H4.5Z"
+          fill="currentColor"
+        />
+      </g>
+    </Icon>
+  );
+};
+
+export default FormatAlignLeftIcon;

package/src/icons/FormatAlignRightIcon.tsx

@@ -0,0 +1,35 @@
+/** @format */
+
+import { Icon, IconProps } from "@chakra-ui/icons";
+
+const FormatAlignRightIcon = (props: IconProps) => {
+  return (
+    <Icon
+      {...props}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      style={{ maskType: "alpha" }}
+    >
+      <mask
+        id="mask0_1118_8509"
+        style={{ maskType: "alpha" }}
+        maskUnits="userSpaceOnUse"
+        x="0"
+        y="0"
+        width="24"
+        height="24"
+      >
+        <rect width="24" height="24" fill="#C4C4C4" />
+      </mask>
+      <g mask="url(#mask0_1118_8509)">
+        <path
+          d="M4.5 20C4.35833 20 4.23958 19.952 4.14375 19.8561C4.04792 19.7601 4 19.6412 4 19.4993C4 19.3575 4.04792 19.2388 4.14375 19.1433C4.23958 19.0478 4.35833 19 4.5 19H20.5C20.6417 19 20.7604 19.048 20.8563 19.1439C20.9521 19.2399 21 19.3588 21 19.5007C21 19.6425 20.9521 19.7612 20.8563 19.8567C20.7604 19.9522 20.6417 20 20.5 20H4.5ZM10.5 16C10.3583 16 10.2396 15.952 10.1438 15.8561C10.0479 15.7601 10 15.6412 10 15.4993C10 15.3575 10.0479 15.2388 10.1438 15.1433C10.2396 15.0478 10.3583 15 10.5 15H20.5C20.6417 15 20.7604 15.048 20.8563 15.144C20.9521 15.2399 21 15.3588 21 15.5007C21 15.6425 20.9521 15.7612 20.8563 15.8567C20.7604 15.9522 20.6417 16 20.5 16H10.5ZM4.5 12C4.35833 12 4.23958 11.952 4.14375 11.8561C4.04792 11.7601 4 11.6412 4 11.4993C4 11.3575 4.04792 11.2388 4.14375 11.1433C4.23958 11.0478 4.35833 11 4.5 11H20.5C20.6417 11 20.7604 11.048 20.8563 11.144C20.9521 11.2399 21 11.3588 21 11.5007C21 11.6425 20.9521 11.7612 20.8563 11.8567C20.7604 11.9522 20.6417 12 20.5 12H4.5ZM10.5 8C10.3583 8 10.2396 7.95202 10.1438 7.85605C10.0479 7.7601 10 7.64119 10 7.49933C10 7.35746 10.0479 7.23878 10.1438 7.14328C10.2396 7.04776 10.3583 7 10.5 7H20.5C20.6417 7 20.7604 7.04798 20.8563 7.14395C20.9521 7.2399 21 7.35881 21 7.50067C21 7.64254 20.9521 7.76122 20.8563 7.85672C20.7604 7.95224 20.6417 8 20.5 8H10.5ZM4.5 4C4.35833 4 4.23958 3.95202 4.14375 3.85605C4.04792 3.7601 4 3.64119 4 3.49933C4 3.35746 4.04792 3.23878 4.14375 3.14328C4.23958 3.04776 4.35833 3 4.5 3H20.5C20.6417 3 20.7604 3.04798 20.8563 3.14395C20.9521 3.2399 21 3.35881 21 3.50067C21 3.64254 20.9521 3.76122 20.8563 3.85672C20.7604 3.95224 20.6417 4 20.5 4H4.5Z"
+          fill="currentColor"
+        />
+      </g>
+    </Icon>
+  );
+};
+
+export default FormatAlignRightIcon;

package/src/icons/FormatBoldIcon.tsx

@@ -0,0 +1,35 @@
+/** @format */
+
+import { Icon, IconProps } from "@chakra-ui/icons";
+
+const FormatBoldIcon = (props: IconProps) => {
+  return (
+    <Icon
+      {...props}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      style={{ maskType: "alpha" }}
+    >
+      <mask
+        id="mask0_1118_8488"
+        style={{ maskType: "alpha" }}
+        maskUnits="userSpaceOnUse"
+        x="0"
+        y="0"
+        width="24"
+        height="24"
+      >
+        <rect width="24" height="24" fill="#C4C4C4" />
+      </mask>
+      <g mask="url(#mask0_1118_8488)">
+        <path
+          d="M8.07495 17.275V4.77502H12.275C13.2583 4.77502 14.104 5.06236 14.812 5.63702C15.5206 6.21236 15.875 7.00002 15.875 8.00002C15.875 8.70002 15.696 9.28336 15.338 9.75002C14.9793 10.2167 14.55 10.5584 14.05 10.775V10.8C14.7166 10.9834 15.2583 11.3374 15.675 11.862C16.0916 12.3874 16.3 13.05 16.3 13.85C16.3 14.95 15.9333 15.7957 15.2 16.387C14.4666 16.979 13.55 17.275 12.45 17.275H8.07495ZM9.27495 10.325H12.2C12.95 10.325 13.546 10.125 13.988 9.72502C14.4293 9.32502 14.65 8.77502 14.65 8.07502C14.65 7.39169 14.4293 6.85002 13.988 6.45002C13.546 6.05002 12.95 5.85002 12.2 5.85002H9.27495V10.325ZM9.27495 16.175H12.375C13.175 16.175 13.8206 15.975 14.312 15.575C14.804 15.175 15.05 14.575 15.05 13.775C15.05 12.975 14.804 12.375 14.312 11.975C13.8206 11.575 13.175 11.375 12.375 11.375H9.27495V16.175Z"
+          fill="currentColor"
+        />
+      </g>
+    </Icon>
+  );
+};
+
+export default FormatBoldIcon;

package/src/icons/FormatItalicIcon.tsx

@@ -0,0 +1,35 @@
+/** @format */
+
+import { Icon, IconProps } from "@chakra-ui/icons";
+
+const FormatItalicIcon = (props: IconProps) => {
+  return (
+    <Icon
+      {...props}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      style={{ maskType: "alpha" }}
+    >
+      <mask
+        id="mask0_1118_8494"
+        style={{ maskType: "alpha" }}
+        maskUnits="userSpaceOnUse"
+        x="0"
+        y="0"
+        width="24"
+        height="24"
+      >
+        <rect width="24" height="24" fill="#C4C4C4" />
+      </mask>
+      <g mask="url(#mask0_1118_8494)">
+        <path
+          d="M5.5 19.125V17.875H9L13.675 6.125H10.2V4.875H18.5V6.125H15L10.325 17.875H13.8V19.125H5.5Z"
+          fill="currentColor"
+        />
+      </g>
+    </Icon>
+  );
+};
+
+export default FormatItalicIcon;

package/src/icons/FormatListBulletedIcon.tsx

@@ -0,0 +1,35 @@
+/** @format */
+
+import { Icon, IconProps } from "@chakra-ui/icons";
+
+const FormatListBulletedIcon = (props: IconProps) => {
+  return (
+    <Icon
+      {...props}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      style={{ maskType: "alpha" }}
+    >
+      <mask
+        id="mask0_1118_8512"
+        style={{ maskType: "alpha" }}
+        maskUnits="userSpaceOnUse"
+        x="0"
+        y="0"
+        width="24"
+        height="24"
+      >
+        <rect width="24" height="24" fill="#C4C4C4" />
+      </mask>
+      <g mask="url(#mask0_1118_8512)">
+        <path
+          d="M4.5 13C4.21667 13 3.97933 12.904 3.788 12.712C3.596 12.5207 3.5 12.2833 3.5 12C3.5 11.7167 3.596 11.479 3.788 11.287C3.97933 11.0957 4.21667 11 4.5 11C4.78333 11 5.021 11.0957 5.213 11.287C5.40433 11.479 5.5 11.7167 5.5 12C5.5 12.2833 5.40433 12.5207 5.213 12.712C5.021 12.904 4.78333 13 4.5 13ZM4.5 7C4.21667 7 3.97933 6.90433 3.788 6.713C3.596 6.521 3.5 6.28333 3.5 6C3.5 5.71667 3.596 5.479 3.788 5.287C3.97933 5.09567 4.21667 5 4.5 5C4.78333 5 5.021 5.09567 5.213 5.287C5.40433 5.479 5.5 5.71667 5.5 6C5.5 6.28333 5.40433 6.521 5.213 6.713C5.021 6.90433 4.78333 7 4.5 7ZM4.5 19C4.21667 19 3.97933 18.904 3.788 18.712C3.596 18.5207 3.5 18.2833 3.5 18C3.5 17.7167 3.596 17.4793 3.788 17.288C3.97933 17.096 4.21667 17 4.5 17C4.78333 17 5.021 17.096 5.213 17.288C5.40433 17.4793 5.5 17.7167 5.5 18C5.5 18.2833 5.40433 18.5207 5.213 18.712C5.021 18.904 4.78333 19 4.5 19ZM8.5 18.5V17.5H20.5V18.5H8.5ZM8.5 12.5V11.5H20.5V12.5H8.5ZM8.5 6.5V5.5H20.5V6.5H8.5Z"
+          fill="currentColor"
+        />
+      </g>
+    </Icon>
+  );
+};
+
+export default FormatListBulletedIcon;

package/src/icons/FormatListNumberedIcon.tsx

@@ -0,0 +1,35 @@
+/** @format */
+
+import { Icon, IconProps } from "@chakra-ui/icons";
+
+const FormatListNumberedIcon = (props: IconProps) => {
+  return (
+    <Icon
+      {...props}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      style={{ maskType: "alpha" }}
+    >
+      <mask
+        id="mask0_1118_8515"
+        style={{ maskType: "alpha" }}
+        maskUnits="userSpaceOnUse"
+        x="0"
+        y="0"
+        width="24"
+        height="24"
+      >
+        <rect width="24" height="24" fill="#C4C4C4" />
+      </mask>
+      <g mask="url(#mask0_1118_8515)">
+        <path
+          d="M3.30005 19.875V19.125H5.30005V18.375H4.30005V17.625H5.30005V16.875H3.30005V16.125H6.07505V19.875H3.30005ZM4.30005 7.875V4.875H3.30005V4.125H5.07505V7.875H4.30005ZM3.30005 13.875V13.15L5.15005 10.875H3.30005V10.125H6.07505V10.85L4.25005 13.125H6.07505V13.875H3.30005ZM8.70005 18.5V17.5H20.7001V18.5H8.70005ZM8.70005 12.5V11.5H20.7001V12.5H8.70005ZM8.70005 6.5V5.5H20.7001V6.5H8.70005Z"
+          fill="currentColor"
+        />
+      </g>
+    </Icon>
+  );
+};
+
+export default FormatListNumberedIcon;

package/src/icons/FormatSizeIcon.tsx

@@ -0,0 +1,35 @@
+/** @format */
+
+import { Icon, IconProps } from "@chakra-ui/icons";
+
+const FormatSizeIcon = (props: IconProps) => {
+  return (
+    <Icon
+      {...props}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      style={{ maskType: "alpha" }}
+    >
+      <mask
+        id="mask0_1118_8410"
+        style={{ maskType: "alpha" }}
+        maskUnits="userSpaceOnUse"
+        x="0"
+        y="0"
+        width="24"
+        height="24"
+      >
+        <rect width="24" height="24" fill="#C4C4C4" />
+      </mask>
+      <g mask="url(#mask0_1118_8410)">
+        <path
+          d="M14.875 19.125V6.125H9.875V4.875H21.125V6.125H16.125V19.125H14.875ZM5.875 19.125V11.125H2.875V9.875H10.125V11.125H7.125V19.125H5.875Z"
+          fill="currentColor"
+        />
+      </g>
+    </Icon>
+  );
+};
+
+export default FormatSizeIcon;

package/src/icons/FormatUnderlineIcon.tsx

@@ -0,0 +1,35 @@
+/** @format */
+
+import { Icon, IconProps } from "@chakra-ui/icons";
+
+const FormatUnderlineIcon = (props: IconProps) => {
+  return (
+    <Icon
+      {...props}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      style={{ maskType: "alpha" }}
+    >
+      <mask
+        id="mask0_1118_8491"
+        style={{ maskType: "alpha" }}
+        maskUnits="userSpaceOnUse"
+        x="0"
+        y="0"
+        width="24"
+        height="24"
+      >
+        <rect width="24" height="24" fill="#C4C4C4" />
+      </mask>
+      <g mask="url(#mask0_1118_8491)">
+        <path
+          d="M12 16.3C10.5166 16.3 9.26262 15.7873 8.23795 14.762C7.21262 13.7373 6.69995 12.4833 6.69995 11V3.70001H7.79995V11C7.79995 12.1833 8.20428 13.179 9.01295 13.987C9.82095 14.7957 10.8166 15.2 12 15.2C13.1833 15.2 14.1793 14.7957 14.988 13.987C15.796 13.179 16.2 12.1833 16.2 11V3.70001H17.3V11C17.3 12.4833 16.7876 13.7373 15.763 14.762C14.7376 15.7873 13.4833 16.3 12 16.3ZM5.69995 20.5V19.5H18.3V20.5H5.69995Z"
+          fill="currentColor"
+        />
+      </g>
+    </Icon>
+  );
+};
+
+export default FormatUnderlineIcon;

package/src/icons/ForumIcon.tsx

@@ -0,0 +1,35 @@
+/** @format */
+
+import { Icon, IconProps } from "@chakra-ui/icons";
+
+const ForumIcon = (props: IconProps) => {
+  return (
+    <Icon
+      {...props}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      style={{ maskType: "alpha" }}
+    >
+      <mask
+        id="mask0_1118_9074"
+        style={{ maskType: "alpha" }}
+        maskUnits="userSpaceOnUse"
+        x="0"
+        y="0"
+        width="24"
+        height="24"
+      >
+        <rect width="24" height="24" fill="#D9D9D9" />
+      </mask>
+      <g mask="url(#mask0_1118_9074)">
+        <path
+          d="M3.38452 14.5101V3.76922C3.38452 3.55127 3.45824 3.36858 3.60567 3.22115C3.75312 3.07372 3.93582 3 4.15377 3H16.0768C16.2948 3 16.4775 3.07372 16.6249 3.22115C16.7724 3.36858 16.8461 3.55127 16.8461 3.76922V11.6923C16.8461 11.9103 16.7724 12.0929 16.6249 12.2404C16.4775 12.3878 16.2948 12.4615 16.0768 12.4615H6.46145L4.09992 14.8231C3.95889 14.9641 3.8044 14.9962 3.63645 14.9193C3.4685 14.8423 3.38452 14.7059 3.38452 14.5101ZM7.2307 16.2308C7.01275 16.2308 6.83006 16.1571 6.68262 16.0096C6.53517 15.8622 6.46145 15.6795 6.46145 15.4615V14.4615H18.2115L18.8461 15.0962V6H19.8461C20.064 6 20.2467 6.07372 20.3942 6.22115C20.5416 6.36858 20.6153 6.55128 20.6153 6.76923V18.2811C20.6153 18.4758 20.5313 18.6116 20.3634 18.6885C20.1954 18.7654 20.041 18.7333 19.8999 18.5923L17.5384 16.2308H7.2307ZM15.8461 4H4.38455V12.8462L5.76915 11.4615H15.8461V4Z"
+          fill="currentColor"
+        />
+      </g>
+    </Icon>
+  );
+};
+
+export default ForumIcon;

package/src/icons/ForwardToInboxIcon.tsx

@@ -0,0 +1,35 @@
+/** @format */
+
+import { Icon, IconProps } from "@chakra-ui/icons";
+
+const ForwardToInboxIcon = (props: IconProps) => {
+  return (
+    <Icon
+      {...props}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      style={{ maskType: "alpha" }}
+    >
+      <mask
+        id="mask0_1118_8482"
+        style={{ maskType: "alpha" }}
+        maskUnits="userSpaceOnUse"
+        x="0"
+        y="0"
+        width="24"
+        height="24"
+      >
+        <rect width="24" height="24" fill="#C4C4C4" />
+      </mask>
+      <g mask="url(#mask0_1118_8482)">
+        <path
+          d="M12 12.125L4 6.875V17.375C4 17.5583 4.05833 17.7083 4.175 17.825C4.29167 17.9417 4.44167 18 4.625 18H13.5V19H4.625C4.15833 19 3.771 18.846 3.463 18.538C3.15433 18.2293 3 17.8417 3 17.375V6.625C3 6.15833 3.15433 5.771 3.463 5.463C3.771 5.15433 4.15833 5 4.625 5H19.375C19.8417 5 20.2293 5.15433 20.538 5.463C20.846 5.771 21 6.15833 21 6.625V13.5C20.8667 13.5 20.7127 13.5 20.538 13.5C20.3627 13.5 20.1833 13.5 20 13.5V6.875L12 12.125ZM12 11L19.7 6H4.3L12 11ZM18.625 21.8L17.925 21.1L19.975 19H15.125V18H20L17.9 15.9L18.625 15.2L21.9 18.5L18.625 21.8ZM4 6.875V17.375C4 17.5583 4 17.7083 4 17.825C4 17.9417 4 18 4 18V18.675C4 17.2417 4 16.0207 4 15.012C4 14.004 4 13.5 4 13.5C4 13.5 4 13.5123 4 13.537C4 13.5623 4 13.6083 4 13.675V6.875Z"
+          fill="currentColor"
+        />
+      </g>
+    </Icon>
+  );
+};
+
+export default ForwardToInboxIcon;

package/src/icons/GalleryThumbnailIcon.tsx

@@ -0,0 +1,35 @@
+/** @format */
+
+import { Icon, IconProps } from "@chakra-ui/icons";
+
+const GalleryThumbnailIcon = (props: IconProps) => {
+  return (
+    <Icon
+      {...props}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      style={{ maskType: "alpha" }}
+    >
+      <mask
+        id="mask0_1118_8702"
+        style={{ maskType: "alpha" }}
+        maskUnits="userSpaceOnUse"
+        x="0"
+        y="0"
+        width="24"
+        height="24"
+      >
+        <rect width="24" height="24" fill="#D9D9D9" />
+      </mask>
+      <g mask="url(#mask0_1118_8702)">
+        <path
+          d="M4.11538 18C3.67114 18 3.29085 17.8418 2.9745 17.5255C2.65817 17.2091 2.5 16.8289 2.5 16.3846V7.61537C2.5 7.17114 2.65817 6.79086 2.9745 6.47453C3.29085 6.15818 3.67114 6 4.11538 6H12.8846C13.3289 6 13.7091 6.15818 14.0255 6.47453C14.3418 6.79086 14.5 7.17114 14.5 7.61537V16.3846C14.5 16.8289 14.3418 17.2091 14.0255 17.5255C13.7091 17.8418 13.3289 18 12.8846 18H4.11538ZM17.3172 11C17.0788 11 16.883 10.9234 16.7298 10.7702C16.5766 10.617 16.5 10.4212 16.5 10.1828V6.8172C16.5 6.5788 16.5766 6.383 16.7298 6.2298C16.883 6.0766 17.0788 6 17.3172 6H20.6828C20.9212 6 21.117 6.0766 21.2702 6.2298C21.4234 6.383 21.5 6.5788 21.5 6.8172V10.1828C21.5 10.4212 21.4234 10.617 21.2702 10.7702C21.117 10.9234 20.9212 11 20.6828 11H17.3172ZM5.5 14.9038H11.5C11.6551 14.9038 11.7715 14.8314 11.849 14.6866C11.9266 14.5417 11.9179 14.3987 11.8231 14.2577L10.1981 12.0827C10.1109 11.975 10.0032 11.9212 9.875 11.9212C9.7468 11.9212 9.63911 11.975 9.55193 12.0827L8 14.1538L6.94808 12.7577C6.86089 12.65 6.7532 12.5962 6.625 12.5962C6.4968 12.5962 6.38911 12.65 6.30192 12.7577L5.17692 14.2577C5.08204 14.3987 5.07338 14.5417 5.15095 14.6866C5.22852 14.8314 5.34487 14.9038 5.5 14.9038ZM17.3172 18C17.0788 18 16.883 17.9234 16.7298 17.7702C16.5766 17.617 16.5 17.4212 16.5 17.1828V13.8172C16.5 13.5788 16.5766 13.383 16.7298 13.2298C16.883 13.0766 17.0788 13 17.3172 13H20.6828C20.9212 13 21.117 13.0766 21.2702 13.2298C21.4234 13.383 21.5 13.5788 21.5 13.8172V17.1828C21.5 17.4212 21.4234 17.617 21.2702 17.7702C21.117 17.9234 20.9212 18 20.6828 18H17.3172Z"
+          fill="currentColor"
+        />
+      </g>
+    </Icon>
+  );
+};
+
+export default GalleryThumbnailIcon;

package/src/icons/GppBadFilledIcon.tsx

@@ -0,0 +1,35 @@
+/** @format */
+
+import { Icon, IconProps } from "@chakra-ui/icons";
+
+const GppBadFilledIcon = (props: IconProps) => {
+  return (
+    <Icon
+      {...props}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      style={{ maskType: "alpha" }}
+    >
+      <mask
+        id="mask0_1118_35488"
+        style={{ maskType: "alpha" }}
+        maskUnits="userSpaceOnUse"
+        x="0"
+        y="0"
+        width="24"
+        height="24"
+      >
+        <rect width="24" height="24" fill="#D9D9D9" />
+      </mask>
+      <g mask="url(#mask0_1118_35488)">
+        <path
+          d="M12 13.0154L13.5731 14.5885C13.7115 14.7269 13.8856 14.7978 14.0952 14.801C14.3048 14.8042 14.482 14.7334 14.6269 14.5885C14.7718 14.4436 14.8442 14.268 14.8442 14.0616C14.8442 13.8552 14.7718 13.6795 14.6269 13.5347L13.0538 11.9616L14.6269 10.3885C14.7653 10.25 14.8362 10.076 14.8394 9.86639C14.8426 9.65677 14.7718 9.47953 14.6269 9.33466C14.482 9.1898 14.3064 9.11736 14.1 9.11736C13.8936 9.11736 13.7179 9.1898 13.5731 9.33466L12 10.9078L10.4269 9.33466C10.2884 9.19621 10.1144 9.12538 9.90477 9.12216C9.69517 9.11896 9.51794 9.1898 9.37308 9.33466C9.22819 9.47953 9.15575 9.65516 9.15575 9.86156C9.15575 10.068 9.22819 10.2436 9.37308 10.3885L10.9461 11.9616L9.37308 13.5347C9.23461 13.6731 9.16378 13.8472 9.16058 14.0568C9.15736 14.2664 9.22819 14.4436 9.37308 14.5885C9.51794 14.7334 9.69357 14.8058 9.89997 14.8058C10.1064 14.8058 10.282 14.7334 10.4269 14.5885L12 13.0154ZM12 21.3712C11.8961 21.3712 11.7942 21.3628 11.6942 21.3462C11.5942 21.3295 11.4974 21.3045 11.4038 21.2712C9.29486 20.5212 7.61698 19.1914 6.3702 17.2817C5.1234 15.3721 4.5 13.3116 4.5 11.1V6.59621C4.5 6.21801 4.60962 5.87667 4.82885 5.57219C5.04808 5.26769 5.33013 5.04685 5.675 4.90969L11.3673 2.78469C11.5814 2.70777 11.7923 2.66931 12 2.66931C12.2077 2.66931 12.4186 2.70777 12.6327 2.78469L18.325 4.90969C18.6698 5.04685 18.9519 5.26769 19.1711 5.57219C19.3903 5.87667 19.5 6.21801 19.5 6.59621V11.1C19.5 13.3116 18.8765 15.3721 17.6297 17.2817C16.383 19.1914 14.7051 20.5212 12.5961 21.2712C12.5025 21.3045 12.4057 21.3295 12.3057 21.3462C12.2057 21.3628 12.1038 21.3712 12 21.3712Z"
+          fill="currentColor"
+        />
+      </g>
+    </Icon>
+  );
+};
+
+export default GppBadFilledIcon;