@webstudio-is/icons 0.2.0 → 0.4.0

package/src/justify-items-space-around.tsx

@@ -0,0 +1,26 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+// @todo this is just a copy of justifyContent icons for now
+export const JustifyItemsSpaceAroundIcon = React.forwardRef<
+  SVGSVGElement,
+  IconProps
+>(({ color = "currentColor", ...props }, forwardedRef) => {
+  return (
+    <svg
+      width="24"
+      height="24"
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+      ref={forwardedRef}
+    >
+      <path d="M7.9999 19.2V4.79999H6.3999V19.2H7.9999Z" fill={color} />
+      <path d="M17.5999 19.2V4.79999H15.9999V19.2H17.5999Z" fill={color} />
+      <path d="M15.1999 16.8H12.7999V7.19999H15.1999V16.8Z" fill={color} />
+      <path d="M8.7999 16.8H11.1999V7.19999H8.7999V16.8Z" fill={color} />
+    </svg>
+  );
+});
+JustifyItemsSpaceAroundIcon.displayName = "JustifyItemsSpaceAroundIcon";

package/src/justify-items-space-between.tsx

@@ -0,0 +1,28 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+// @todo this is just a copy of justifyContent icons for now
+export const JustifyItemsSpaceBetweenIcon = React.forwardRef<
+  SVGSVGElement,
+  IconProps
+>(({ color = "currentColor", ...props }, forwardedRef) => {
+  return (
+    <svg
+      width="24"
+      height="24"
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+      ref={forwardedRef}
+    >
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M11.1999 7.19999H7.9999V4.79999H6.3999V19.2H7.9999V16.8H11.1999V7.19999ZM12.7999 16.8H15.9999V19.2H17.5999V4.79999H15.9999V7.19999H12.7999V16.8Z"
+        fill={color}
+      />
+    </svg>
+  );
+});
+JustifyItemsSpaceBetweenIcon.displayName = "JustifyItemsSpaceBetweenIcon";

package/src/justify-items-start.tsx

@@ -0,0 +1,26 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+// @todo this is just a copy of justifyContent icons for now
+export const JustifyItemsStartIcon = React.forwardRef<SVGSVGElement, IconProps>(
+  ({ color = "currentColor", ...props }, forwardedRef) => {
+    return (
+      <svg
+        width="24"
+        height="24"
+        viewBox="0 0 24 24"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        {...props}
+        ref={forwardedRef}
+      >
+        <path
+          d="M10.9999 7.19999H8.79995V4.79999H7.19995V19.2H8.79995V16.8H10.9999V7.19999Z"
+          fill={color}
+        />
+        <path d="M16.8 7.19999H13.6V16.8H16.8V7.19999Z" fill={color} />
+      </svg>
+    );
+  }
+);
+JustifyItemsStartIcon.displayName = "JustifyItemsStartIcon";

package/src/legacy.ts

@@ -0,0 +1,31 @@
+export {
+  ImageIcon,
+  FontBoldIcon,
+  FontItalicIcon,
+  Link2Icon,
+  MobileIcon,
+  LaptopIcon,
+  DesktopIcon,
+  PlusIcon,
+  HamburgerMenuIcon,
+  DotsHorizontalIcon,
+  CheckIcon,
+  RocketIcon,
+  ExternalLinkIcon,
+  Share1Icon,
+  EyeOpenIcon,
+  ExclamationTriangleIcon,
+  DotFilledIcon,
+  TriangleRightIcon,
+  TriangleDownIcon,
+  CommitIcon,
+  InputIcon,
+  ButtonIcon,
+  HeadingIcon,
+  TextIcon,
+  SquareIcon,
+  InfoCircledIcon,
+  CrossCircledIcon,
+  CheckCircledIcon,
+  TokensIcon,
+} from "@radix-ui/react-icons";

package/src/list-nested.tsx

@@ -0,0 +1,27 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const ListNestedIcon = React.forwardRef<SVGSVGElement, IconProps>(
+  ({ color = "currentColor", ...props }, forwardedRef) => {
+    return (
+      <svg
+        width="15"
+        height="15"
+        viewBox="0 0 15 15"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        {...props}
+        ref={forwardedRef}
+      >
+        <path
+          fill={color}
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z"
+        />
+      </svg>
+    );
+  }
+);
+
+ListNestedIcon.displayName = "ListNestedIcon";

package/src/lock-close.tsx

@@ -0,0 +1,39 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const LockCloseIcon = React.forwardRef<SVGSVGElement, IconProps>(
+  ({ color = "currentColor", ...props }, forwardedRef) => {
+    return (
+      <svg
+        width="8"
+        height="10"
+        viewBox="0 0 8 10"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        {...props}
+        ref={forwardedRef}
+      >
+        <g clipPath="url(#clip0_561_9202)">
+          <rect width="8" height="9" transform="translate(0 0.5)" fill="none" />
+          <path
+            fillRule="evenodd"
+            clipRule="evenodd"
+            d="M1.14286 4.4375V3.3125C1.14286 2.56658 1.44388 1.85121 1.97969 1.32376C2.51551 0.796316 3.24224 0.5 4 0.5C4.75776 0.5 5.48449 0.796316 6.02031 1.32376C6.55612 1.85121 6.85714 2.56658 6.85714 3.3125V4.4375C7.16025 4.4375 7.45094 4.55603 7.66527 4.767C7.87959 4.97798 8 5.26413 8 5.5625V8.375C8 8.67337 7.87959 8.95952 7.66527 9.1705C7.45094 9.38147 7.16025 9.5 6.85714 9.5H1.14286C0.839753 9.5 0.549062 9.38147 0.334735 9.1705C0.120408 8.95952 0 8.67337 0 8.375V5.5625C0 5.26413 0.120408 4.97798 0.334735 4.767C0.549062 4.55603 0.839753 4.4375 1.14286 4.4375ZM5.71429 3.3125V4.4375H2.28571V3.3125C2.28571 2.86495 2.46633 2.43572 2.78782 2.11926C3.10931 1.80279 3.54534 1.625 4 1.625C4.45466 1.625 4.89069 1.80279 5.21218 2.11926C5.53367 2.43572 5.71429 2.86495 5.71429 3.3125Z"
+            fill={color}
+          />
+        </g>
+        <defs>
+          <clipPath id="clip0_561_9202">
+            <rect
+              width="8"
+              height="9"
+              fill="none"
+              transform="translate(0 0.5)"
+            />
+          </clipPath>
+        </defs>
+      </svg>
+    );
+  }
+);
+LockCloseIcon.displayName = "LockCloseIcon";

package/src/lock-open.tsx

@@ -0,0 +1,37 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const LockOpenIcon = React.forwardRef<SVGSVGElement, IconProps>(
+  ({ color = "currentColor", ...props }, forwardedRef) => {
+    return (
+      <svg
+        width="8"
+        height="10"
+        viewBox="0 0 8 10"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        {...props}
+        ref={forwardedRef}
+      >
+        <g clipPath="url(#clip0_561_9202)">
+          <rect width="8" height="9" transform="translate(0 0.5)" fill="none" />
+          <path
+            d="M4 0.5C3.24224 0.5 2.51551 0.80102 1.97969 1.33684C1.44388 1.87266 1.14286 2.59938 1.14286 3.35714V4.5C0.839753 4.5 0.549062 4.62041 0.334735 4.83474C0.120408 5.04906 0 5.33975 0 5.64286V8.5C0 8.8031 0.120408 9.09379 0.334735 9.30812C0.549062 9.52245 0.839753 9.64286 1.14286 9.64286H6.85714C7.16025 9.64286 7.45094 9.52245 7.66527 9.30812C7.87959 9.09379 8 8.8031 8 8.5V5.64286C8 5.33975 7.87959 5.04906 7.66527 4.83474C7.45094 4.62041 7.16025 4.5 6.85714 4.5H2.28571V3.35714C2.28557 2.9398 2.43768 2.53673 2.71352 2.22353C2.98936 1.91034 3.36998 1.70852 3.784 1.65594C4.19802 1.60335 4.61701 1.70361 4.96239 1.9379C5.30776 2.1722 5.5558 2.52444 5.66 2.92857C5.69789 3.07535 5.79253 3.20107 5.92311 3.27806C5.98777 3.31619 6.0593 3.3412 6.13362 3.35168C6.20795 3.36216 6.28361 3.3579 6.35629 3.33914C6.42896 3.32038 6.49723 3.28749 6.5572 3.24235C6.61717 3.1972 6.66765 3.14069 6.70578 3.07603C6.7439 3.01138 6.76892 2.93984 6.7794 2.86552C6.78988 2.7912 6.78562 2.71553 6.76686 2.64286C6.60831 2.02958 6.25053 1.48634 5.74972 1.09848C5.24891 0.710614 4.63344 0.500099 4 0.5V0.5Z"
+            fill={color}
+          />
+        </g>
+        <defs>
+          <clipPath id="clip0_561_9202">
+            <rect
+              width="8"
+              height="9"
+              fill="none"
+              transform="translate(0 0.5)"
+            />
+          </clipPath>
+        </defs>
+      </svg>
+    );
+  }
+);
+LockOpenIcon.displayName = "LockOpenIcon";

package/src/magnifying-glass.tsx

@@ -0,0 +1,27 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const MagnifyingGlassIcon = React.forwardRef<SVGSVGElement, IconProps>(
+  ({ color = "currentColor", ...props }, forwardedRef) => {
+    return (
+      <svg
+        width="16"
+        height="16"
+        viewBox="0 0 16 16"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        {...props}
+        ref={forwardedRef}
+      >
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M6.38912 10.67C7.12473 11.1939 8.02464 11.502 8.9965 11.502C11.4818 11.502 13.4965 9.48723 13.4965 7.00195C13.4965 4.51667 11.4818 2.50195 8.9965 2.50195C6.51122 2.50195 4.4965 4.51667 4.4965 7.00195C4.4965 7.97383 4.8046 8.87375 5.32845 9.60937L2.59467 12.3432C2.30178 12.636 2.30178 13.1109 2.59467 13.4038C2.88756 13.6967 3.36244 13.6967 3.65533 13.4038L6.38912 10.67ZM5.9965 7.00195C5.9965 8.65881 7.33965 10.002 8.9965 10.002C10.6534 10.002 11.9965 8.65881 11.9965 7.00195C11.9965 5.3451 10.6534 4.00195 8.9965 4.00195C7.33965 4.00195 5.9965 5.3451 5.9965 7.00195Z"
+          fill={color}
+        />
+      </svg>
+    );
+  }
+);
+
+MagnifyingGlassIcon.displayName = "MagnifyingGlass";

package/src/menu.tsx

@@ -0,0 +1,33 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const MenuIcon = React.forwardRef<SVGSVGElement, IconProps>(
+  ({ color = "currentColor", ...props }, forwardedRef) => {
+    return (
+      <svg
+        width="16"
+        height="16"
+        viewBox="0 0 16 16"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        {...props}
+        ref={forwardedRef}
+      >
+        <path
+          d="M4 8C4 8.82843 3.32843 9.5 2.5 9.5C1.67157 9.5 1 8.82843 1 8C1 7.17157 1.67157 6.5 2.5 6.5C3.32843 6.5 4 7.17157 4 8Z"
+          fill={color}
+        />
+        <path
+          d="M9.5 8C9.5 8.82843 8.82843 9.5 8 9.5C7.17157 9.5 6.5 8.82843 6.5 8C6.5 7.17157 7.17157 6.5 8 6.5C8.82843 6.5 9.5 7.17157 9.5 8Z"
+          fill={color}
+        />
+        <path
+          d="M15 8C15 8.82843 14.3284 9.5 13.5 9.5C12.6716 9.5 12 8.82843 12 8C12 7.17157 12.6716 6.5 13.5 6.5C14.3284 6.5 15 7.17157 15 8Z"
+          fill={color}
+        />
+      </svg>
+    );
+  }
+);
+
+MenuIcon.displayName = "MenuIcon";

package/src/new-folder.tsx

@@ -0,0 +1,28 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const NewFolderIcon = React.forwardRef<SVGSVGElement, IconProps>(
+  ({ color = "currentColor", ...props }, forwardedRef) => {
+    return (
+      <svg
+        width="16"
+        height="16"
+        viewBox="0 0 16 16"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        {...props}
+        ref={forwardedRef}
+      >
+        <path
+          d="M8.6 5L7.93068 3.66135C7.73804 3.27608 7.64172 3.08344 7.49802 2.9427C7.37095 2.81824 7.21779 2.72358 7.04965 2.66558C6.8595 2.6 6.64412 2.6 6.21337 2.6H3.92C3.24794 2.6 2.91191 2.6 2.65521 2.73079C2.42942 2.84584 2.24584 3.02942 2.13079 3.25521C2 3.5119 2 3.84794 2 4.52V5M2 5H11.12C12.1281 5 12.6321 5 13.0172 5.19619C13.3559 5.36876 13.6312 5.64412 13.8038 5.98282C14 6.36786 14 6.8719 14 7.88V10.52C14 11.5281 14 12.0321 13.8038 12.4172C13.6312 12.7559 13.3559 13.0312 13.0172 13.2038C12.6321 13.4 12.1281 13.4 11.12 13.4H4.88C3.87191 13.4 3.36786 13.4 2.98282 13.2038C2.64413 13.0312 2.36876 12.7559 2.19619 12.4172C2 12.0321 2 11.5281 2 10.52V5ZM8 11V7.4M6.2 9.2H9.8"
+          stroke={color}
+          strokeWidth="1.3"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </svg>
+    );
+  }
+);
+
+NewFolderIcon.displayName = "NewFolderIcon";

package/src/new-page.tsx

@@ -0,0 +1,28 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const NewPageIcon = React.forwardRef<SVGSVGElement, IconProps>(
+  ({ color = "currentColor", ...props }, forwardedRef) => {
+    return (
+      <svg
+        width="16"
+        height="16"
+        viewBox="0 0 16 16"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        {...props}
+        ref={forwardedRef}
+      >
+        <path
+          d="M9.19995 2.16172V4.64004C9.19995 4.97607 9.19995 5.14409 9.26535 5.27244C9.32287 5.38533 9.41466 5.47712 9.52756 5.53465C9.6559 5.60004 9.82392 5.60004 10.16 5.60004H12.6383M7.99995 11.6V8M6.19995 9.8H9.79995M9.19995 2H6.07995C5.07186 2 4.56781 2 4.18277 2.19619C3.84408 2.36876 3.56871 2.64413 3.39614 2.98282C3.19995 3.36786 3.19995 3.87191 3.19995 4.88V11.12C3.19995 12.1281 3.19995 12.6321 3.39614 13.0172C3.56871 13.3559 3.84408 13.6312 4.18277 13.8038C4.56781 14 5.07186 14 6.07995 14H9.91995C10.928 14 11.4321 14 11.8171 13.8038C12.1558 13.6312 12.4312 13.3559 12.6038 13.0172C12.8 12.6321 12.8 12.1281 12.8 11.12V5.6L9.19995 2Z"
+          stroke={color}
+          strokeWidth="1.3"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </svg>
+    );
+  }
+);
+
+NewPageIcon.displayName = "NewPageIcon";

package/src/order-first.tsx

@@ -0,0 +1,36 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const OrderFirstIcon = React.forwardRef<SVGSVGElement, IconProps>(
+  ({ color = "currentColor", ...props }, forwardedRef) => {
+    return (
+      <svg
+        width="16"
+        height="16"
+        viewBox="0 0 16 16"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        {...props}
+        ref={forwardedRef}
+      >
+        <path
+          d="M2.10022 2.5C1.54794 2.5 1.10022 2.94771 1.10022 3.5L1.10022 12.5C1.10022 13.0523 1.54793 13.5 2.10022 13.5H3.90022C4.4525 13.5 4.90022 13.0523 4.90022 12.5L4.90022 3.5C4.90022 2.94772 4.45251 2.5 3.90022 2.5L2.10022 2.5Z"
+          fill={color}
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M11.9 4C11.3477 4 10.9 4.44771 10.9 5L10.9 11C10.9 11.5523 11.3477 12 11.9 12H13.9C14.4523 12 14.9 11.5523 14.9 11L14.9 5C14.9 4.44772 14.4523 4 13.9 4L11.9 4ZM12 5.1L12 10.9H13.8L13.8 5.1H12Z"
+          fill={color}
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M7.10022 4C6.54794 4 6.10022 4.44771 6.10022 5L6.10022 11C6.10022 11.5523 6.54794 12 7.10022 12H9.10022C9.65251 12 10.1002 11.5523 10.1002 11L10.1002 5C10.1002 4.44771 9.65251 4 9.10022 4L7.10022 4ZM7.20022 5.1L7.20022 10.9H9.00022L9.00022 5.1L7.20022 5.1Z"
+          fill={color}
+        />
+      </svg>
+    );
+  }
+);
+OrderFirstIcon.displayName = "OrderFirstIcon";

package/src/order-last.tsx

@@ -0,0 +1,36 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const OrderLastIcon = React.forwardRef<SVGSVGElement, IconProps>(
+  ({ color = "currentColor", ...props }, forwardedRef) => {
+    return (
+      <svg
+        width="16"
+        height="16"
+        viewBox="0 0 16 16"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        {...props}
+        ref={forwardedRef}
+      >
+        <path
+          d="M13.8998 13.5C14.4521 13.5 14.8998 13.0523 14.8998 12.5L14.8998 3.5C14.8998 2.94772 14.4521 2.5 13.8998 2.5H12.0998C11.5475 2.5 11.0998 2.94771 11.0998 3.5L11.0998 12.5C11.0998 13.0523 11.5475 13.5 12.0998 13.5H13.8998Z"
+          fill={color}
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M6.89978 12C6.57826 12 6.29219 11.8483 6.10925 11.6125C5.97795 11.4433 5.89978 11.2308 5.89978 11L5.89978 5C5.89978 4.76923 5.97795 4.55672 6.10925 4.3875C6.29219 4.15173 6.57826 4 6.89978 4H8.89978C9.45207 4 9.89978 4.44772 9.89978 5V11C9.89978 11.5523 9.45206 12 8.89978 12H6.89978ZM8.79978 5.1V10.9H6.99978L6.99978 5.1L8.79978 5.1Z"
+          fill={color}
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M4.89051 4.3875C5.02181 4.55672 5.09998 4.76923 5.09998 5L5.09998 11C5.09998 11.2308 5.02181 11.4433 4.89051 11.6125C4.70757 11.8483 4.42149 12 4.09998 12H2.09998C1.54769 12 1.09998 11.5523 1.09998 11V5C1.09998 4.44771 1.54769 4 2.09998 4H4.09998C4.42149 4 4.70757 4.15173 4.89051 4.3875ZM3.99998 5.1L3.99998 10.9H2.19998L2.19998 5.1L3.99998 5.1Z"
+          fill={color}
+        />
+      </svg>
+    );
+  }
+);
+OrderLastIcon.displayName = "OrderLastIcon";

package/src/page.tsx

@@ -0,0 +1,28 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const PageIcon = React.forwardRef<SVGSVGElement, IconProps>(
+  ({ color = "currentColor", ...props }, forwardedRef) => {
+    return (
+      <svg
+        width="16"
+        height="16"
+        viewBox="0 0 16 16"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        {...props}
+        ref={forwardedRef}
+      >
+        <path
+          d="M9.19995 2.16168V4.64C9.19995 4.97603 9.19995 5.14405 9.26535 5.27239C9.32287 5.38529 9.41466 5.47708 9.52756 5.5346C9.6559 5.6 9.82392 5.6 10.16 5.6H11.3991H12.6383M12.8 6.79293V11.12C12.8 12.1281 12.8 12.6321 12.6038 13.0172C12.4312 13.3559 12.1558 13.6312 11.8171 13.8038C11.4321 14 10.928 14 9.91995 14H6.07995C5.07186 14 4.56781 14 4.18277 13.8038C3.84408 13.6312 3.56871 13.3559 3.39614 13.0172C3.19995 12.6321 3.19995 12.1281 3.19995 11.12V4.88C3.19995 3.87191 3.19995 3.36786 3.39614 2.98282C3.56871 2.64413 3.84408 2.36876 4.18277 2.19619C4.56781 2 5.07186 2 6.07995 2H8.00702C8.44728 2 8.66741 2 8.87457 2.04973C9.05823 2.09383 9.23381 2.16656 9.39486 2.26525C9.57651 2.37656 9.73217 2.53222 10.0435 2.84353L11.9564 4.75647C12.2677 5.06778 12.4234 5.22344 12.5347 5.40509C12.6334 5.56614 12.7061 5.74172 12.7502 5.92538C12.8 6.13254 12.8 6.35267 12.8 6.79293Z"
+          stroke={color}
+          strokeWidth="1.3"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </svg>
+    );
+  }
+);
+
+PageIcon.displayName = "PageIcon";

package/src/redo.tsx

@@ -0,0 +1,23 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const RedoIcon = React.forwardRef<SVGSVGElement, IconProps>(
+  ({ color = "currentColor", ...props }, forwardedRef) => {
+    return (
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        height="15"
+        width="15"
+        viewBox="0 0 24 24"
+        fill={color}
+        {...props}
+        ref={forwardedRef}
+      >
+        <path d="M0 0h24v24H0z" fill="none" />
+        <path d="M18.4 10.6C16.55 8.99 14.15 8 11.5 8c-4.65 0-8.58 3.03-9.96 7.22L3.9 16c1.05-3.19 4.05-5.5 7.6-5.5 1.95 0 3.73.72 5.12 1.88L13 16h9V7l-3.6 3.6z" />
+      </svg>
+    );
+  }
+);
+
+RedoIcon.displayName = "RedoIcon";

package/src/size.tsx

@@ -0,0 +1,27 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const SizeIcon = React.forwardRef<SVGSVGElement, IconProps>(
+  ({ color = "currentColor", ...props }, forwardedRef) => {
+    return (
+      <svg
+        width={16}
+        height={16}
+        viewBox="0 0 16 16"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        {...props}
+        ref={forwardedRef}
+      >
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M11.897 12.497a.6.6 0 00.6-.6V8a.6.6 0 10-1.2 0v2.449L5.55 4.702H8a.6.6 0 000-1.2H4.102a.6.6 0 00-.6.6V8a.6.6 0 001.2 0V5.55l5.747 5.747h-2.45a.6.6 0 100 1.2h3.898z"
+          fill={color}
+        />
+      </svg>
+    );
+  }
+);
+
+SizeIcon.displayName = "SizeIcon";

package/src/tablet.tsx

@@ -0,0 +1,25 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const TabletIcon = React.forwardRef<SVGSVGElement, IconProps>(
+  ({ color = "currentColor", ...props }, forwardedRef) => {
+    return (
+      <svg
+        width="15"
+        height="15"
+        viewBox="0 0 24 24"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        {...props}
+        ref={forwardedRef}
+      >
+        <path
+          fill={color}
+          d="M20 0H6C4.34 0 4 0.84 4 2.5V20.5C4 22.16 5.34 23.5 7 23.5H19C20.66 23.5 22 22.16 22 20.5V2.5C22 0.84 21.66 0 20 0ZM15 22.5H13H11V22H13H15V22.5ZM21 21H13H5V10.5V1H13H21V21Z"
+        />
+      </svg>
+    );
+  }
+);
+
+TabletIcon.displayName = "TabletIcon";

package/src/text-align-center.tsx

@@ -0,0 +1,32 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const TextAlignCenterIcon = React.forwardRef<SVGSVGElement, IconProps>(
+  ({ color = "currentColor", ...props }, forwardedRef) => {
+    return (
+      <svg
+        width="16"
+        height="16"
+        viewBox="0 0 16 16"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        {...props}
+        ref={forwardedRef}
+      >
+        <path
+          d="M1 4C1 3.65482 1.27982 3.375 1.625 3.375H14.375C14.7202 3.375 15 3.65482 15 4C15 4.34518 14.7202 4.625 14.375 4.625H1.625C1.27982 4.625 1 4.34518 1 4Z"
+          fill={color}
+        />
+        <path
+          d="M4 8C4 7.65482 4.27982 7.375 4.625 7.375H11.375C11.7202 7.375 12 7.65482 12 8C12 8.34518 11.7202 8.625 11.375 8.625H4.625C4.27982 8.625 4 8.34518 4 8Z"
+          fill={color}
+        />
+        <path
+          d="M3 12C3 11.6548 3.27982 11.375 3.625 11.375H12.375C12.7202 11.375 13 11.6548 13 12C13 12.3452 12.7202 12.625 12.375 12.625H3.625C3.27982 12.625 3 12.3452 3 12Z"
+          fill={color}
+        />
+      </svg>
+    );
+  }
+);
+TextAlignCenterIcon.displayName = "TextAlignCenterIcon";

package/src/text-align-justify.tsx

@@ -0,0 +1,32 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const TextAlignJustifyIcon = React.forwardRef<SVGSVGElement, IconProps>(
+  ({ color = "currentColor", ...props }, forwardedRef) => {
+    return (
+      <svg
+        width="16"
+        height="16"
+        viewBox="0 0 16 16"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        {...props}
+        ref={forwardedRef}
+      >
+        <path
+          d="M1 4C1 3.65482 1.27982 3.375 1.625 3.375H14.375C14.7202 3.375 15 3.65482 15 4C15 4.34518 14.7202 4.625 14.375 4.625H1.625C1.27982 4.625 1 4.34518 1 4Z"
+          fill={color}
+        />
+        <path
+          d="M1 8C1 7.65482 1.27982 7.375 1.625 7.375H14.375C14.7202 7.375 15 7.65482 15 8C15 8.34518 14.7202 8.625 14.375 8.625H1.625C1.27982 8.625 1 8.34518 1 8Z"
+          fill={color}
+        />
+        <path
+          d="M1.625 11.375C1.27982 11.375 1 11.6548 1 12C1 12.3452 1.27982 12.625 1.625 12.625H14.375C14.7202 12.625 15 12.3452 15 12C15 11.6548 14.7202 11.375 14.375 11.375H1.625Z"
+          fill={color}
+        />
+      </svg>
+    );
+  }
+);
+TextAlignJustifyIcon.displayName = "TextAlignJustifyIcon";

package/src/text-align-left.tsx

@@ -0,0 +1,32 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const TextAlignLeftIcon = React.forwardRef<SVGSVGElement, IconProps>(
+  ({ color = "currentColor", ...props }, forwardedRef) => {
+    return (
+      <svg
+        width="16"
+        height="16"
+        viewBox="0 0 16 16"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        {...props}
+        ref={forwardedRef}
+      >
+        <path
+          d="M1 4C1 3.65482 1.27982 3.375 1.625 3.375H14.375C14.7202 3.375 15 3.65482 15 4C15 4.34518 14.7202 4.625 14.375 4.625H1.625C1.27982 4.625 1 4.34518 1 4Z"
+          fill={color}
+        />
+        <path
+          d="M1 8C1 7.65482 1.27982 7.375 1.625 7.375H8.375C8.72018 7.375 9 7.65482 9 8C9 8.34518 8.72018 8.625 8.375 8.625H1.625C1.27982 8.625 1 8.34518 1 8Z"
+          fill={color}
+        />
+        <path
+          d="M1 12C1 11.6548 1.27982 11.375 1.625 11.375H10.375C10.7202 11.375 11 11.6548 11 12C11 12.3452 10.7202 12.625 10.375 12.625H1.625C1.27982 12.625 1 12.3452 1 12Z"
+          fill={color}
+        />
+      </svg>
+    );
+  }
+);
+TextAlignLeftIcon.displayName = "TextAlignLeftIcon";

package/src/text-align-right.tsx

@@ -0,0 +1,32 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const TextAlignRightIcon = React.forwardRef<SVGSVGElement, IconProps>(
+  ({ color = "currentColor", ...props }, forwardedRef) => {
+    return (
+      <svg
+        width="16"
+        height="16"
+        viewBox="0 0 16 16"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        {...props}
+        ref={forwardedRef}
+      >
+        <path
+          d="M1 4C1 3.65482 1.27982 3.375 1.625 3.375H14.375C14.7202 3.375 15 3.65482 15 4C15 4.34518 14.7202 4.625 14.375 4.625H1.625C1.27982 4.625 1 4.34518 1 4Z"
+          fill={color}
+        />
+        <path
+          d="M7 8C7 7.65482 7.27982 7.375 7.625 7.375H14.375C14.7202 7.375 15 7.65482 15 8C15 8.34518 14.7202 8.625 14.375 8.625H7.625C7.27982 8.625 7 8.34518 7 8Z"
+          fill={color}
+        />
+        <path
+          d="M5 12C5 11.6548 5.27982 11.375 5.625 11.375H14.375C14.7202 11.375 15 11.6548 15 12C15 12.3452 14.7202 12.625 14.375 12.625H5.625C5.27982 12.625 5 12.3452 5 12Z"
+          fill={color}
+        />
+      </svg>
+    );
+  }
+);
+TextAlignRightIcon.displayName = "TextAlignRightIcon";