@webstudio-is/icons 0.2.0 → 0.4.0

package/src/align-self-stretch.tsx

@@ -0,0 +1,41 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const AlignSelfStretchIcon = React.forwardRef<SVGSVGElement, IconProps>(
+  ({ color = "currentColor", ...props }, forwardedRef) => {
+    return (
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        fill="none"
+        viewBox="0 0 16 16"
+        width="16"
+        height="16"
+        {...props}
+        ref={forwardedRef}
+      >
+        <path
+          fill={color}
+          fillRule="evenodd"
+          d="M14.5 14.2004c0 .3866-.3439.7-.7682.7H2.26818c-.42425 0-.76818-.3134-.76818-.7 0-.3866.34393-.7.76818-.7H13.7318c.4243 0 .7682.3134.7682.7Z"
+          clipRule="evenodd"
+        />
+        <rect
+          width="3"
+          height="9"
+          x="9.5"
+          y="12.5"
+          fill={color}
+          rx=".8"
+          transform="rotate(-180 9.5 12.5)"
+        />
+        <path
+          fill={color}
+          fillRule="evenodd"
+          d="M14.5 1.8c0 .3866-.3439.7-.7682.7H2.26818C1.84393 2.5 1.5 2.1866 1.5 1.8c0-.3866.34393-.7.76818-.7H13.7318c.4243 0 .7682.3134.7682.7Z"
+          clipRule="evenodd"
+        />
+      </svg>
+    );
+  }
+);
+AlignSelfStretchIcon.displayName = "AlignSelfStretchIcon";

package/src/aspect-ratio.tsx

@@ -0,0 +1,31 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const AspectRatioIcon = 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="M10.85 10.503a.625.625 0 100-1.25v1.25zM4.975 3.378a.625.625 0 10-1.25 0h1.25zm-.072 6.394l.275-.561-.275.561zm-.443-.426l.552-.292-.552.292zm6.39-.093H5.972v1.25h4.878v-1.25zM4.975 8.32V3.38h-1.25v4.94h1.25zm.997.934c-.294 0-.478 0-.617-.01a.524.524 0 01-.177-.032l-.55 1.123c.21.102.423.138.63.154.198.016.44.015.714.015v-1.25zM3.725 8.32c0 .262 0 .498.016.693.017.203.056.418.167.627l1.104-.585c0-.001-.004-.008-.009-.028a.803.803 0 01-.017-.12 7.858 7.858 0 01-.011-.587h-1.25zm1.453.892a.37.37 0 01-.166-.157l-1.104.585c.16.303.414.545.72.695l.55-1.123z"
+          fill={color}
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M4.349 6.067c.345 0 .625-.28.625-.625V3.466l1.428 1.429a.625.625 0 10.884-.884L4.791 1.515a.625.625 0 00-.884 0L1.412 4.011a.625.625 0 10.884.884l1.428-1.429v1.976c0 .345.28.625.625.625zM7.769 9.878c0 .345.28.625.625.625h1.975l-1.428 1.429a.625.625 0 10.884.883l2.495-2.495a.625.625 0 000-.883L9.825 6.94a.625.625 0 10-.884.884l1.428 1.428H8.394a.625.625 0 00-.625.625z"
+          fill={color}
+        />
+      </svg>
+    );
+  }
+);
+
+AspectRatioIcon.displayName = "AspectRatioIcon";

package/src/body.tsx

@@ -0,0 +1,26 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const BodyIcon = 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
+          d="M1 3.96833H14M2.51667 14H12.4833C13.321 14 14 13.321 14 12.4833V2.51667C14 1.67903 13.321 1 12.4833 1H2.51667C1.67903 1 1 1.67903 1 2.51667V12.4833C1 13.321 1.67903 14 2.51667 14Z"
+          stroke={color}
+          strokeWidth="1.15"
+        />
+      </svg>
+    );
+  }
+);
+
+BodyIcon.displayName = "BodyIcon";

package/src/brush.tsx

@@ -0,0 +1,27 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const BrushIcon = 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}
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M7 14c-1.66 0-3 1.34-3 3 0 1.31-1.16 2-2 2 .92 1.22 2.49 2 4 2 2.21 0 4-1.79 4-4 0-1.66-1.34-3-3-3zm13.71-9.37-1.34-1.34a.9959.9959 0 0 0-1.41 0L9 12.25 11.75 15l8.96-8.96c.39-.39.39-1.02 0-1.41z"
+        />
+      </svg>
+    );
+  }
+);
+
+BrushIcon.displayName = "BrushIcon";

package/src/chevron-double-down.tsx

@@ -0,0 +1,28 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const ChevronDoubleDownIcon = 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 2L8 7L3 2M13 9L8 14L3 9"
+          stroke={color}
+          strokeWidth="1.3"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </svg>
+    );
+  }
+);
+
+ChevronDoubleDownIcon.displayName = "ChevronDoubleDownIcon";

package/src/chevron-double-left.tsx

@@ -0,0 +1,28 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const ChevronDoubleLeftIcon = 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="M14 13L9 8L14 3M7 13L2 8L7 3"
+          stroke={color}
+          strokeWidth="1.3"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </svg>
+    );
+  }
+);
+
+ChevronDoubleLeftIcon.displayName = "ChevronDoubleLeftIcon";

package/src/chevron-double-right.tsx

@@ -0,0 +1,29 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const ChevronDoubleRightIcon = 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 3L7 8L2 13M9 3L14 8L9 13"
+        stroke={color}
+        strokeWidth="1.3"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+});
+
+ChevronDoubleRightIcon.displayName = "ChevronDoubleRightIcon";

package/src/chevron-double-up.tsx

@@ -0,0 +1,28 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const ChevronDoubleUpIcon = 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="M3 14L8 9L13 14M3 7L8 2L13 7"
+          stroke={color}
+          strokeWidth="1.3"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </svg>
+    );
+  }
+);
+
+ChevronDoubleUpIcon.displayName = "ChevronDoubleUpIcon";

package/src/chevron-down.tsx

@@ -0,0 +1,25 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const ChevronDownIcon = 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.04008 6.28383C4.29431 6.03037 4.70587 6.031 4.95932 6.28523L7.99985 9.33506L11.0404 6.28523C11.2938 6.031 11.7054 6.03037 11.9596 6.28383C12.2139 6.53728 12.2145 6.94884 11.961 7.20306L8.46017 10.7146C8.33822 10.837 8.17259 10.9057 7.99985 10.9057C7.82712 10.9057 7.66149 10.837 7.53953 10.7146L4.03868 7.20306C3.78523 6.94884 3.78585 6.53728 4.04008 6.28383Z"
+          fill={color}
+        />
+      </svg>
+    );
+  }
+);
+
+ChevronDownIcon.displayName = "ChevronDownIcon";

package/src/chevron-left.tsx

@@ -0,0 +1,27 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const ChevronLeftIcon = 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="M9.7162 4.04011C9.96966 4.29434 9.96903 4.7059 9.7148 4.95935L6.66497 7.99988L9.7148 11.0404C9.96903 11.2939 9.96966 11.7054 9.7162 11.9597C9.46275 12.2139 9.05119 12.2145 8.79697 11.9611L5.28541 8.4602C5.16308 8.33825 5.09432 8.17262 5.09432 7.99988C5.09432 7.82715 5.16308 7.66152 5.28541 7.53956L8.79697 4.03871C9.05119 3.78526 9.46275 3.78588 9.7162 4.04011Z"
+          fill={color}
+        />
+      </svg>
+    );
+  }
+);
+
+ChevronLeftIcon.displayName = "ChevronLeftIcon";

package/src/chevron-right.tsx

@@ -0,0 +1,27 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const ChevronRightIcon = 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.2838 11.9599C6.03034 11.7057 6.03097 11.2941 6.2852 11.0407L9.33503 8.00013L6.2852 4.95959C6.03097 4.70614 6.03034 4.29458 6.2838 4.04036C6.53725 3.78613 6.94881 3.7855 7.20303 4.03895L10.7146 7.5398C10.8369 7.66176 10.9057 7.82739 10.9057 8.00013C10.9057 8.17286 10.8369 8.33849 10.7146 8.46045L7.20303 11.9613C6.94881 12.2148 6.53725 12.2141 6.2838 11.9599Z"
+          fill={color}
+        />
+      </svg>
+    );
+  }
+);
+
+ChevronRightIcon.displayName = "ChevronRightIcon";

package/src/chevron-up.tsx

@@ -0,0 +1,27 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const ChevronUpIcon = 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.9599 9.71617C11.7057 9.96963 11.2941 9.969 11.0407 9.71477L8.00015 6.66494L4.95962 9.71477C4.70616 9.969 4.29461 9.96963 4.04038 9.71617C3.78615 9.46272 3.78552 9.05116 4.03897 8.79694L7.53983 5.28538C7.66178 5.16305 7.82741 5.09429 8.00015 5.09429C8.17288 5.09429 8.33851 5.16305 8.46047 5.28538L11.9613 8.79694C12.2148 9.05116 12.2141 9.46272 11.9599 9.71617Z"
+          fill={color}
+        />
+      </svg>
+    );
+  }
+);
+
+ChevronUpIcon.displayName = "ChevronUpIcon";

package/src/cloud.tsx

@@ -0,0 +1,28 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const CloudIcon = 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="M3.433 11.4A2.333 2.333 0 014.57 7.473a2.918 2.918 0 115.705-1.222 2.917 2.917 0 11.058 5.832h-5.25a2.333 2.333 0 01-1.65-.683z"
+          stroke={color}
+          strokeWidth={1.25}
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </svg>
+    );
+  }
+);
+
+CloudIcon.displayName = "CloudIcon";

package/src/copy.tsx

@@ -0,0 +1,28 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const CopyIcon = 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="M5.6 5.6V3.92C5.6 3.24794 5.6 2.91191 5.73079 2.65521C5.84584 2.42942 6.02942 2.24584 6.25521 2.13079C6.51191 2 6.84794 2 7.52 2H12.08C12.7521 2 13.0881 2 13.3448 2.13079C13.5706 2.24584 13.7542 2.42942 13.8692 2.65521C14 2.91191 14 3.24794 14 3.92V8.48C14 9.15206 14 9.4881 13.8692 9.74479C13.7542 9.97058 13.5706 10.1542 13.3448 10.2692C13.0881 10.4 12.7521 10.4 12.08 10.4H10.4M3.92 14H8.48C9.15206 14 9.48809 14 9.74479 13.8692C9.97058 13.7542 10.1542 13.5706 10.2692 13.3448C10.4 13.0881 10.4 12.7521 10.4 12.08V7.52C10.4 6.84794 10.4 6.51191 10.2692 6.25521C10.1542 6.02942 9.97058 5.84584 9.74479 5.73079C9.48809 5.6 9.15206 5.6 8.48 5.6H3.92C3.24794 5.6 2.91191 5.6 2.65521 5.73079C2.42942 5.84584 2.24584 6.02942 2.13079 6.25521C2 6.51191 2 6.84794 2 7.52V12.08C2 12.7521 2 13.0881 2.13079 13.3448C2.24584 13.5706 2.42942 13.7542 2.65521 13.8692C2.91191 14 3.24794 14 3.92 14Z"
+          stroke={color}
+          strokeWidth="1.3"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </svg>
+    );
+  }
+);
+
+CopyIcon.displayName = "CopyIcon";

package/src/cross-circled-filled.tsx

@@ -0,0 +1,28 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const CrossCircledFilledIcon = 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="M14 8C14 8.78793 13.8448 9.56815 13.5433 10.2961C13.2417 11.0241 12.7998 11.6855 12.2426 12.2426C11.6855 12.7998 11.0241 13.2417 10.2961 13.5433C9.56815 13.8448 8.78793 14 8 14C7.21207 14 6.43185 13.8448 5.7039 13.5433C4.97595 13.2417 4.31451 12.7998 3.75736 12.2426C3.20021 11.6855 2.75825 11.0241 2.45672 10.2961C2.15519 9.56815 2 8.78793 2 8C2 6.4087 2.63214 4.88258 3.75736 3.75736C4.88258 2.63214 6.4087 2 8 2C9.5913 2 11.1174 2.63214 12.2426 3.75736C13.3679 4.88258 14 6.4087 14 8ZM6.42426 5.57574C6.18995 5.34142 5.81005 5.34142 5.57574 5.57574C5.34142 5.81005 5.34142 6.18995 5.57574 6.42426L7.15147 8L5.57574 9.57574C5.34142 9.81005 5.34142 10.1899 5.57574 10.4243C5.81005 10.6586 6.18995 10.6586 6.42426 10.4243L8 8.84853L9.57574 10.4243C9.81005 10.6586 10.1899 10.6586 10.4243 10.4243C10.6586 10.1899 10.6586 9.81005 10.4243 9.57574L8.84853 8L10.4243 6.42426C10.6586 6.18995 10.6586 5.81005 10.4243 5.57574C10.1899 5.34142 9.81005 5.34142 9.57574 5.57574L8 7.15147L6.42426 5.57574Z"
+        fill={color}
+      />
+    </svg>
+  );
+});
+
+CrossCircledFilledIcon.displayName = "CrossCircledFilled";

package/src/cross-large.tsx

@@ -0,0 +1,26 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const CrossLargeIcon = React.forwardRef<SVGSVGElement, IconProps>(
+  ({ color = "currentColor", ...props }, forwardedRef) => {
+    return (
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        fill="none"
+        viewBox="0 0 16 16"
+        width="16"
+        height="16"
+        {...props}
+        ref={forwardedRef}
+      >
+        <path
+          stroke={color}
+          strokeLinecap="round"
+          strokeWidth="1.6"
+          d="M13 3 7.99998 8.00002m0 0L3 13m4.99998-4.99998L3 3.00008m4.99998 4.99994L13 13"
+        />
+      </svg>
+    );
+  }
+);
+CrossLargeIcon.displayName = "CrossLargeIcon";

package/src/cross-small.tsx

@@ -0,0 +1,26 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const CrossSmallIcon = React.forwardRef<SVGSVGElement, IconProps>(
+  ({ color = "currentColor", ...props }, forwardedRef) => {
+    return (
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        fill="none"
+        viewBox="0 0 16 16"
+        width="16"
+        height="16"
+        {...props}
+        ref={forwardedRef}
+      >
+        <path
+          stroke={color}
+          strokeLinecap="round"
+          strokeWidth="1.4"
+          d="M11 5 7.99999 8.00001m0 0L5 11m2.99999-2.99999L5 5.00005m2.99999 2.99996L11 11"
+        />
+      </svg>
+    );
+  }
+);
+CrossSmallIcon.displayName = "CrossSmallIcon";

package/src/cross.tsx

@@ -0,0 +1,27 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const CrossIcon = 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 3L7.99998 8.00002M7.99998 8.00002L3 13M7.99998 8.00002L3 3.00008M7.99998 8.00002L13 13"
+          stroke={color}
+          strokeWidth="1.6"
+          strokeLinecap="round"
+        />
+      </svg>
+    );
+  }
+);
+
+CrossIcon.displayName = "Cross";

package/src/devices.tsx

@@ -0,0 +1,25 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const DevicesIcon = 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="M22.265 9.51L17.265 9.5C16.715 9.5 16.265 9.95 16.265 10.5V19.5C16.265 20.05 16.715 20.5 17.265 20.5H22.265C22.815 20.5 23.265 20.05 23.265 19.5V10.5C23.265 9.95 22.815 9.51 22.265 9.51ZM22.265 19.5H17.265V10.5H19.5H22.265V19.5ZM20.265 1.5H2.26499C1.15499 1.5 0.264988 2.39 0.264988 3.5V15.5C0.264988 16.6 1.15499 17.5 2.26499 17.5H10.5V19.5H7.26499V20.5H15.265V19.5H12.5V17.5H15.265V16.5H1.26499V2.5H21.265V8.5H22.265V3.5C22.265 2.39 21.365 1.5 20.265 1.5Z"
+        />
+      </svg>
+    );
+  }
+);
+
+DevicesIcon.displayName = "DevicesIcon";

package/src/ellipses.tsx

@@ -0,0 +1,23 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const EllipsesIcon = React.forwardRef<SVGSVGElement, IconProps>(
+  ({ color = "currentColor", ...props }, forwardedRef) => {
+    return (
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        fill="none"
+        viewBox="0 0 16 16"
+        width="16"
+        height="16"
+        {...props}
+        ref={forwardedRef}
+      >
+        <circle cx="2.5" cy="8" r="1.5" fill={color} />
+        <circle cx="8" cy="8" r="1.5" fill={color} />
+        <circle cx="13.5" cy="8" r="1.5" fill={color} />
+      </svg>
+    );
+  }
+);
+EllipsesIcon.displayName = "EllipsesIcon";

package/src/external-link.tsx

@@ -0,0 +1,27 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const ExternalLinkIcon = React.forwardRef<SVGSVGElement, IconProps>(
+  ({ color = "currentColor", ...props }, forwardedRef) => {
+    return (
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        viewBox="0 0 16 16"
+        width="16"
+        height="16"
+        fill={color}
+        {...props}
+        ref={forwardedRef}
+      >
+        <path
+          fill={color}
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M3.7 3.7h2.294a.7.7 0 1 0 0-1.4H3.5a1.2 1.2 0 0 0-1.2 1.2v9a1.2 1.2 0 0 0 1.2 1.2h9a1.2 1.2 0 0 0 1.2-1.2V9.993a.7.7 0 1 0-1.4 0V12.3H3.7V3.7ZM8.813 3a.7.7 0 0 1 .7-.7H13a.7.7 0 0 1 .7.7v3.49a.7.7 0 1 1-1.4 0v-1.8L8.495 8.495a.7.7 0 1 1-.99-.99L11.31 3.7H9.513a.7.7 0 0 1-.7-.7Z"
+        />
+      </svg>
+    );
+  }
+);
+
+ExternalLinkIcon.displayName = "ExternalLinkIcon";

package/src/flex-direction-column-reverse.tsx

@@ -0,0 +1,26 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const FlexDirectionColumnReverseIcon = 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}
+      style={{ transform: "rotate(180deg)" }}
+    >
+      <path
+        d="M11.1667 6L11.1667 15.8881L8.175 12.9794L7 14.125L12 19L17 14.125L15.825 12.9794L12.8333 15.8881L12.8333 6L11.1667 6Z"
+        fill={color}
+      />
+    </svg>
+  );
+});
+FlexDirectionColumnReverseIcon.displayName = "FlexDirectionColumnReverseIcon";

package/src/flex-direction-column.tsx

@@ -0,0 +1,25 @@
+import * as React from "react";
+import { IconProps } from "./types";
+
+export const FlexDirectionColumnIcon = 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="M11.1667 6L11.1667 15.8881L8.175 12.9794L7 14.125L12 19L17 14.125L15.825 12.9794L12.8333 15.8881L12.8333 6L11.1667 6Z"
+        fill={color}
+      />
+    </svg>
+  );
+});
+FlexDirectionColumnIcon.displayName = "FlexDirectionColumnIcon";