@aliimam/icons 0.1.3 → 0.1.4

package/src/stroke/design/SplinePointer.tsx

@@ -0,0 +1,93 @@
+import * as React from "react";
+import type { IconProps, IconMetadata, IconComponent } from "../../types";
+
+interface SplinePointerProps extends IconProps {
+  type?: "stroke";
+}
+
+export const SplinePointer: IconComponent<SplinePointerProps> =
+  React.forwardRef<SVGSVGElement, SplinePointerProps>(function SplinePointer(
+    {
+      color = "currentColor",
+      fill,
+      size = 24,
+      strokeWidth,
+      strokeLinecap,
+      strokeLinejoin,
+      strokeDasharray,
+      opacity,
+      className,
+      type = "stroke",
+      ...props
+    },
+    forwardedRef,
+  ) {
+    if (type === "stroke") {
+      return (
+        <svg
+          width={size}
+          height={size}
+          viewBox="0 0 24 24"
+          fill="none"
+          xmlns="http://www.w3.org/2000/svg"
+          className={className}
+          strokeWidth={strokeWidth}
+          strokeLinecap={strokeLinecap}
+          strokeLinejoin={strokeLinejoin}
+          strokeDasharray={strokeDasharray}
+          opacity={opacity}
+          {...props}
+          ref={forwardedRef}
+        >
+          <path
+            d="M12.034 12.681C11.998 12.591 11.989 12.492 12.009 12.396 12.028 12.301 12.076 12.213 12.144 12.145 12.213 12.076 12.301 12.029 12.396 12.009 12.492 11.989 12.591 11.998 12.681 12.034L21.681 15.534C21.777 15.572 21.86 15.638 21.917 15.725 21.974 15.812 22.002 15.914 21.999 16.017 21.995 16.121 21.959 16.221 21.897 16.303 21.834 16.385 21.747 16.446 21.648 16.477L18.204 17.545C18.049 17.593 17.907 17.678 17.792 17.793 17.677 17.908 17.592 18.05 17.544 18.205L16.477 21.648C16.446 21.747 16.385 21.834 16.303 21.897 16.221 21.959 16.121 21.995 16.017 21.999 15.914 22.002 15.812 21.974 15.725 21.917 15.638 21.86 15.572 21.778 15.534 21.681L12.034 12.681ZM5 17C5 13.817 6.264 10.765 8.515 8.515 10.765 6.264 13.817 5 17 5M19 7C20.105 7 21 6.105 21 5 21 3.895 20.105 3 19 3 17.895 3 17 3.895 17 5 17 6.105 17.895 7 19 7ZM5 21C6.105 21 7 20.105 7 19 7 17.895 6.105 17 5 17 3.895 17 3 17.895 3 19 3 20.105 3.895 21 5 21Z"
+            stroke={color}
+            strokeLinecap="round"
+            strokeLinejoin="round"
+          />
+        </svg>
+      );
+    }
+
+    if (type === "stroke") {
+      return (
+        <svg
+          width={size}
+          height={size}
+          viewBox="0 0 24 24"
+          fill="none"
+          xmlns="http://www.w3.org/2000/svg"
+          className={className}
+          strokeWidth={strokeWidth}
+          strokeLinecap={strokeLinecap}
+          strokeLinejoin={strokeLinejoin}
+          strokeDasharray={strokeDasharray}
+          opacity={opacity}
+          {...props}
+          ref={forwardedRef}
+        >
+          <path
+            d="M12.034 12.681C11.998 12.591 11.989 12.492 12.009 12.396 12.029 12.301 12.076 12.213 12.145 12.145 12.213 12.076 12.301 12.029 12.396 12.009 12.492 11.989 12.591 11.998 12.681 12.034L21.681 15.534C21.778 15.572 21.86 15.638 21.917 15.725 21.974 15.812 22.002 15.914 21.999 16.017 21.995 16.121 21.959 16.221 21.897 16.303 21.834 16.385 21.747 16.446 21.648 16.477L18.204 17.545C18.049 17.593 17.907 17.678 17.792 17.793 17.677 17.908 17.592 18.05 17.544 18.205L16.477 21.648C16.446 21.747 16.385 21.834 16.303 21.897 16.221 21.959 16.121 21.995 16.017 21.999 15.914 22.002 15.812 21.974 15.725 21.917 15.638 21.86 15.572 21.778 15.534 21.681L12.034 12.681ZM5 17C5 13.817 6.264 10.765 8.515 8.515 10.765 6.264 13.817 5 17 5M19 7C20.105 7 21 6.105 21 5 21 3.895 20.105 3 19 3 17.895 3 17 3.895 17 5 17 6.105 17.895 7 19 7ZM5 21C6.105 21 7 20.105 7 19 7 17.895 6.105 17 5 17 3.895 17 3 17.895 3 19 3 20.105 3.895 21 5 21Z"
+            stroke={color}
+            strokeLinecap="round"
+            strokeLinejoin="round"
+          />
+        </svg>
+      );
+    }
+
+    console.error(`SplinePointer doesn't support ${type}`);
+    return null;
+  });
+
+SplinePointer.displayName = "SplinePointer";
+
+SplinePointer.metadata = {
+  name: "SplinePointer",
+  category: "stroke/design",
+  tags: ["spline", "pointer", "icon"],
+  description: "SplinePointer icon from stroke/design category",
+  type: ["stroke", "icon"],
+} as IconMetadata;
+
+export default SplinePointer;

package/src/stroke/design/SprayCan.tsx

@@ -0,0 +1,58 @@
+import * as React from "react";
+import type { IconProps, IconMetadata, IconComponent } from "../../types";
+
+export const SprayCan: IconComponent = React.forwardRef<
+  SVGSVGElement,
+  IconProps
+>(function SprayCan(
+  {
+    color = "currentColor",
+    fill,
+    size = 24,
+    strokeWidth,
+    strokeLinecap,
+    strokeLinejoin,
+    strokeDasharray,
+    opacity,
+    className,
+    ...props
+  },
+  forwardedRef,
+) {
+  return (
+    <svg
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+      strokeWidth={strokeWidth}
+      strokeLinecap={strokeLinecap}
+      strokeLinejoin={strokeLinejoin}
+      strokeDasharray={strokeDasharray}
+      opacity={opacity}
+      {...props}
+      ref={forwardedRef}
+    >
+      <path
+        d="M3 3H3.01M7 5H7.01M11 7H11.01M3 7H3.01M7 9H7.01M3 11H3.01M19 5H15V9H19V5ZM19 9 21 11V21C21 21.6 20.6 22 20 22H14C13.4 22 13 21.6 13 21V11L15 9M13 14 21 12M13 19 21 17"
+        stroke={color}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+});
+
+SprayCan.displayName = "SprayCan";
+
+SprayCan.metadata = {
+  name: "SprayCan",
+  category: "stroke/design",
+  tags: ["spray", "can", "icon"],
+  description: "SprayCan icon from stroke/design category",
+  type: ["stroke", "icon"],
+} as IconMetadata;
+
+export default SprayCan;

package/src/stroke/design/SquareDashed.tsx

@@ -0,0 +1,58 @@
+import * as React from "react";
+import type { IconProps, IconMetadata, IconComponent } from "../../types";
+
+export const SquareDashed: IconComponent = React.forwardRef<
+  SVGSVGElement,
+  IconProps
+>(function SquareDashed(
+  {
+    color = "currentColor",
+    fill,
+    size = 24,
+    strokeWidth,
+    strokeLinecap,
+    strokeLinejoin,
+    strokeDasharray,
+    opacity,
+    className,
+    ...props
+  },
+  forwardedRef,
+) {
+  return (
+    <svg
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+      strokeWidth={strokeWidth}
+      strokeLinecap={strokeLinecap}
+      strokeLinejoin={strokeLinejoin}
+      strokeDasharray={strokeDasharray}
+      opacity={opacity}
+      {...props}
+      ref={forwardedRef}
+    >
+      <path
+        d="M5 3C4.47 3 3.961 3.211 3.586 3.586 3.211 3.961 3 4.47 3 5M19 3C19.53 3 20.039 3.211 20.414 3.586 20.789 3.961 21 4.47 21 5M21 19C21 19.53 20.789 20.039 20.414 20.414 20.039 20.789 19.53 21 19 21M5 21C4.47 21 3.961 20.789 3.586 20.414 3.211 20.039 3 19.53 3 19M9 3H10M9 21H10M14 3H15M14 21H15M3 9V10M21 9V10M3 14V15M21 14V15"
+        stroke={color}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+});
+
+SquareDashed.displayName = "SquareDashed";
+
+SquareDashed.metadata = {
+  name: "SquareDashed",
+  category: "stroke/design",
+  tags: ["square", "dashed", "icon"],
+  description: "SquareDashed icon from stroke/design category",
+  type: ["stroke", "icon"],
+} as IconMetadata;
+
+export default SquareDashed;

package/src/stroke/design/SquaresExclude.tsx

@@ -0,0 +1,58 @@
+import * as React from "react";
+import type { IconProps, IconMetadata, IconComponent } from "../../types";
+
+export const SquaresExclude: IconComponent = React.forwardRef<
+  SVGSVGElement,
+  IconProps
+>(function SquaresExclude(
+  {
+    color = "currentColor",
+    fill,
+    size = 24,
+    strokeWidth,
+    strokeLinecap,
+    strokeLinejoin,
+    strokeDasharray,
+    opacity,
+    className,
+    ...props
+  },
+  forwardedRef,
+) {
+  return (
+    <svg
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+      strokeWidth={strokeWidth}
+      strokeLinecap={strokeLinecap}
+      strokeLinejoin={strokeLinejoin}
+      strokeDasharray={strokeDasharray}
+      opacity={opacity}
+      {...props}
+      ref={forwardedRef}
+    >
+      <path
+        d="M16 12V14C16 14.53 15.789 15.039 15.414 15.414 15.039 15.789 14.53 16 14 16H9C8.735 16 8.48 16.105 8.293 16.293 8.105 16.48 8 16.735 8 17V20C8 20.53 8.211 21.039 8.586 21.414 8.961 21.789 9.47 22 10 22H20C20.53 22 21.039 21.789 21.414 21.414 21.789 21.039 22 20.53 22 20V10C22 9.47 21.789 8.961 21.414 8.586 21.039 8.211 20.53 8 20 8M4 16C3.47 16 2.961 15.789 2.586 15.414 2.211 15.039 2 14.53 2 14V4C2 3.47 2.211 2.961 2.586 2.586 2.961 2.211 3.47 2 4 2H14C14.53 2 15.039 2.211 15.414 2.586 15.789 2.961 16 3.47 16 4V7C16 7.265 15.895 7.52 15.707 7.707 15.52 7.895 15.265 8 15 8H10C9.47 8 8.961 8.211 8.586 8.586 8.211 8.961 8 9.47 8 10V12"
+        stroke={color}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+});
+
+SquaresExclude.displayName = "SquaresExclude";
+
+SquaresExclude.metadata = {
+  name: "SquaresExclude",
+  category: "stroke/design",
+  tags: ["squares", "exclude", "icon"],
+  description: "SquaresExclude icon from stroke/design category",
+  type: ["stroke", "icon"],
+} as IconMetadata;
+
+export default SquaresExclude;

package/src/stroke/design/SquaresIntersect.tsx

@@ -0,0 +1,58 @@
+import * as React from "react";
+import type { IconProps, IconMetadata, IconComponent } from "../../types";
+
+export const SquaresIntersect: IconComponent = React.forwardRef<
+  SVGSVGElement,
+  IconProps
+>(function SquaresIntersect(
+  {
+    color = "currentColor",
+    fill,
+    size = 24,
+    strokeWidth,
+    strokeLinecap,
+    strokeLinejoin,
+    strokeDasharray,
+    opacity,
+    className,
+    ...props
+  },
+  forwardedRef,
+) {
+  return (
+    <svg
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+      strokeWidth={strokeWidth}
+      strokeLinecap={strokeLinecap}
+      strokeLinejoin={strokeLinejoin}
+      strokeDasharray={strokeDasharray}
+      opacity={opacity}
+      {...props}
+      ref={forwardedRef}
+    >
+      <path
+        d="M10 22C9.47 22 8.961 21.789 8.586 21.414 8.211 21.039 8 20.53 8 20M14 2C14.53 2 15.039 2.211 15.414 2.586 15.789 2.961 16 3.47 16 4M16 22H14M2 10V8M2 4C2 3.47 2.211 2.961 2.586 2.586 2.961 2.211 3.47 2 4 2M20 8C20.53 8 21.039 8.211 21.414 8.586 21.789 8.961 22 9.47 22 10M22 14V16M22 20C22 20.53 21.789 21.039 21.414 21.414 21.039 21.789 20.53 22 20 22M4 16C3.47 16 2.961 15.789 2.586 15.414 2.211 15.039 2 14.53 2 14M8 10C8 9.47 8.211 8.961 8.586 8.586 8.961 8.211 9.47 8 10 8H15C15.265 8 15.52 8.105 15.707 8.293 15.895 8.48 16 8.735 16 9V14C16 14.53 15.789 15.039 15.414 15.414 15.039 15.789 14.53 16 14 16H9C8.735 16 8.48 15.895 8.293 15.707 8.105 15.52 8 15.265 8 15V10ZM8 2H10"
+        stroke={color}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+});
+
+SquaresIntersect.displayName = "SquaresIntersect";
+
+SquaresIntersect.metadata = {
+  name: "SquaresIntersect",
+  category: "stroke/design",
+  tags: ["squares", "intersect", "icon"],
+  description: "SquaresIntersect icon from stroke/design category",
+  type: ["stroke", "icon"],
+} as IconMetadata;
+
+export default SquaresIntersect;

package/src/stroke/design/SquaresSubtract.tsx

@@ -0,0 +1,58 @@
+import * as React from "react";
+import type { IconProps, IconMetadata, IconComponent } from "../../types";
+
+export const SquaresSubtract: IconComponent = React.forwardRef<
+  SVGSVGElement,
+  IconProps
+>(function SquaresSubtract(
+  {
+    color = "currentColor",
+    fill,
+    size = 24,
+    strokeWidth,
+    strokeLinecap,
+    strokeLinejoin,
+    strokeDasharray,
+    opacity,
+    className,
+    ...props
+  },
+  forwardedRef,
+) {
+  return (
+    <svg
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+      strokeWidth={strokeWidth}
+      strokeLinecap={strokeLinecap}
+      strokeLinejoin={strokeLinejoin}
+      strokeDasharray={strokeDasharray}
+      opacity={opacity}
+      {...props}
+      ref={forwardedRef}
+    >
+      <path
+        d="M10 22C9.47 22 8.961 21.789 8.586 21.414 8.211 21.039 8 20.53 8 20M16 22H14M16 4C16 3.47 15.789 2.961 15.414 2.586 15.039 2.211 14.53 2 14 2H4C3.47 2 2.961 2.211 2.586 2.586 2.211 2.961 2 3.47 2 4V14C2 14.53 2.211 15.039 2.586 15.414 2.961 15.789 3.47 16 4 16H7C7.265 16 7.52 15.895 7.707 15.707 7.895 15.52 8 15.265 8 15V10C8 9.47 8.211 8.961 8.586 8.586 8.961 8.211 9.47 8 10 8H15C15.265 8 15.52 7.895 15.707 7.707 15.895 7.52 16 7.265 16 7V4ZM20 8C20.53 8 21.039 8.211 21.414 8.586 21.789 8.961 22 9.47 22 10M22 14V16M22 20C22 20.53 21.789 21.039 21.414 21.414 21.039 21.789 20.53 22 20 22"
+        stroke={color}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+});
+
+SquaresSubtract.displayName = "SquaresSubtract";
+
+SquaresSubtract.metadata = {
+  name: "SquaresSubtract",
+  category: "stroke/design",
+  tags: ["squares", "subtract", "icon"],
+  description: "SquaresSubtract icon from stroke/design category",
+  type: ["stroke", "icon"],
+} as IconMetadata;
+
+export default SquaresSubtract;

package/src/stroke/design/SquaresUnite.tsx

@@ -0,0 +1,58 @@
+import * as React from "react";
+import type { IconProps, IconMetadata, IconComponent } from "../../types";
+
+export const SquaresUnite: IconComponent = React.forwardRef<
+  SVGSVGElement,
+  IconProps
+>(function SquaresUnite(
+  {
+    color = "currentColor",
+    fill,
+    size = 24,
+    strokeWidth,
+    strokeLinecap,
+    strokeLinejoin,
+    strokeDasharray,
+    opacity,
+    className,
+    ...props
+  },
+  forwardedRef,
+) {
+  return (
+    <svg
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+      strokeWidth={strokeWidth}
+      strokeLinecap={strokeLinecap}
+      strokeLinejoin={strokeLinejoin}
+      strokeDasharray={strokeDasharray}
+      opacity={opacity}
+      {...props}
+      ref={forwardedRef}
+    >
+      <path
+        d="M4 16C3.46957 16 2.96086 15.7893 2.58579 15.4142C2.21071 15.0391 2 14.5304 2 14V4C2 3.46957 2.21071 2.96086 2.58579 2.58579C2.96086 2.21071 3.46957 2 4 2H14C14.5304 2 15.0391 2.21071 15.4142 2.58579C15.7893 2.96086 16 3.46957 16 4V7C16 7.26522 16.1054 7.51957 16.2929 7.70711C16.4804 7.89464 16.7348 8 17 8H20C20.5304 8 21.0391 8.21071 21.4142 8.58579C21.7893 8.96086 22 9.46957 22 10V20C22 20.5304 21.7893 21.0391 21.4142 21.4142C21.0391 21.7893 20.5304 22 20 22H10C9.46957 22 8.96086 21.7893 8.58579 21.4142C8.21071 21.0391 8 20.5304 8 20V17C8 16.7348 7.89464 16.4804 7.70711 16.2929C7.51957 16.1054 7.26522 16 7 16H4Z"
+        stroke={color}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+});
+
+SquaresUnite.displayName = "SquaresUnite";
+
+SquaresUnite.metadata = {
+  name: "SquaresUnite",
+  category: "stroke/design",
+  tags: ["squares", "unite", "icon"],
+  description: "SquaresUnite icon from stroke/design category",
+  type: ["stroke", "icon"],
+} as IconMetadata;
+
+export default SquaresUnite;

package/src/stroke/design/Stamp.tsx

@@ -0,0 +1,57 @@
+import * as React from "react";
+import type { IconProps, IconMetadata, IconComponent } from "../../types";
+
+export const Stamp: IconComponent = React.forwardRef<SVGSVGElement, IconProps>(
+  function Stamp(
+    {
+      color = "currentColor",
+      fill,
+      size = 24,
+      strokeWidth,
+      strokeLinecap,
+      strokeLinejoin,
+      strokeDasharray,
+      opacity,
+      className,
+      ...props
+    },
+    forwardedRef,
+  ) {
+    return (
+      <svg
+        width={size}
+        height={size}
+        viewBox="0 0 24 24"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        className={className}
+        strokeWidth={strokeWidth}
+        strokeLinecap={strokeLinecap}
+        strokeLinejoin={strokeLinejoin}
+        strokeDasharray={strokeDasharray}
+        opacity={opacity}
+        {...props}
+        ref={forwardedRef}
+      >
+        <path
+          d="M14 13V8.5C14 7 15 7 15 5 15 4.204 14.684 3.441 14.121 2.879 13.559 2.316 12.796 2 12 2 11.204 2 10.441 2.316 9.879 2.879 9.316 3.441 9 4.204 9 5 9 7 10 7 10 8.5V13M20 15.5C20 14.837 19.737 14.201 19.268 13.732 18.799 13.263 18.163 13 17.5 13H6.5C5.837 13 5.201 13.263 4.732 13.732 4.263 14.201 4 14.837 4 15.5V17C4 17.265 4.105 17.52 4.293 17.707 4.48 17.895 4.735 18 5 18H19C19.265 18 19.52 17.895 19.707 17.707 19.895 17.52 20 17.265 20 17V15.5ZM5 22H19"
+          stroke={color}
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </svg>
+    );
+  },
+);
+
+Stamp.displayName = "Stamp";
+
+Stamp.metadata = {
+  name: "Stamp",
+  category: "stroke/design",
+  tags: ["stamp", "icon"],
+  description: "Stamp icon from stroke/design category",
+  type: ["stroke", "icon"],
+} as IconMetadata;
+
+export default Stamp;

package/src/stroke/design/SwatchBook.tsx

@@ -0,0 +1,70 @@
+import * as React from "react";
+import type { IconProps, IconMetadata, IconComponent } from "../../types";
+
+export const SwatchBook: IconComponent = React.forwardRef<
+  SVGSVGElement,
+  IconProps
+>(function SwatchBook(
+  {
+    color = "currentColor",
+    fill,
+    size = 24,
+    strokeWidth,
+    strokeLinecap,
+    strokeLinejoin,
+    strokeDasharray,
+    opacity,
+    className,
+    ...props
+  },
+  forwardedRef,
+) {
+  return (
+    <svg
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+      strokeWidth={strokeWidth}
+      strokeLinecap={strokeLinecap}
+      strokeLinejoin={strokeLinejoin}
+      strokeDasharray={strokeDasharray}
+      opacity={opacity}
+      {...props}
+      ref={forwardedRef}
+    >
+      <path
+        d="M11 17C11 18.0609 10.5786 19.0783 9.82843 19.8284C9.07828 20.5786 8.06087 21 7 21C5.93913 21 4.92172 20.5786 4.17157 19.8284C3.42143 19.0783 3 18.0609 3 17V5C3 4.46957 3.21071 3.96086 3.58579 3.58579C3.96086 3.21071 4.46957 3 5 3H9C9.53043 3 10.0391 3.21071 10.4142 3.58579C10.7893 3.96086 11 4.46957 11 5V17Z"
+        stroke={color}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M16.7 13H19C19.53 13 20.039 13.211 20.414 13.586 20.789 13.961 21 14.47 21 15V19C21 19.53 20.789 20.039 20.414 20.414 20.039 20.789 19.53 21 19 21H7M7 17H7.01"
+        stroke={color}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M10.9999 8.00001L13.2999 5.70001C13.5232 5.47593 13.7886 5.29821 14.0808 5.17706C14.3731 5.05592 14.6864 4.99374 15.0027 4.99411C15.3191 4.99448 15.6322 5.05739 15.9242 5.17923C16.2161 5.30106 16.4811 5.47941 16.7039 5.70401L18.5999 7.60001C18.8305 7.82182 19.0144 8.0875 19.1408 8.38143C19.2673 8.67535 19.3336 8.99159 19.3361 9.31154C19.3385 9.63149 19.2769 9.94869 19.1549 10.2445C19.033 10.5403 18.8531 10.8087 18.6259 11.034L9.8999 19.8"
+        stroke={color}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+});
+
+SwatchBook.displayName = "SwatchBook";
+
+SwatchBook.metadata = {
+  name: "SwatchBook",
+  category: "stroke/design",
+  tags: ["swatch", "book", "icon"],
+  description: "SwatchBook icon from stroke/design category",
+  type: ["stroke", "icon"],
+} as IconMetadata;
+
+export default SwatchBook;

package/src/stroke/design/Tangent.tsx

@@ -0,0 +1,58 @@
+import * as React from "react";
+import type { IconProps, IconMetadata, IconComponent } from "../../types";
+
+export const Tangent: IconComponent = React.forwardRef<
+  SVGSVGElement,
+  IconProps
+>(function Tangent(
+  {
+    color = "currentColor",
+    fill,
+    size = 24,
+    strokeWidth,
+    strokeLinecap,
+    strokeLinejoin,
+    strokeDasharray,
+    opacity,
+    className,
+    ...props
+  },
+  forwardedRef,
+) {
+  return (
+    <svg
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+      strokeWidth={strokeWidth}
+      strokeLinecap={strokeLinecap}
+      strokeLinejoin={strokeLinejoin}
+      strokeDasharray={strokeDasharray}
+      opacity={opacity}
+      {...props}
+      ref={forwardedRef}
+    >
+      <path
+        d="M17 6C18.105 6 19 5.105 19 4 19 2.895 18.105 2 17 2 15.895 2 15 2.895 15 4 15 5.105 15.895 6 17 6ZM15.59 5.41 5.41 15.59M4 19C5.105 19 6 18.105 6 17 6 15.895 5.105 15 4 15 2.895 15 2 15.895 2 17 2 18.105 2.895 19 4 19ZM12 22C12 22 8 13 10.5 10.5 13 8 22 12 22 12"
+        stroke={color}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+});
+
+Tangent.displayName = "Tangent";
+
+Tangent.metadata = {
+  name: "Tangent",
+  category: "stroke/design",
+  tags: ["tangent", "icon"],
+  description: "Tangent icon from stroke/design category",
+  type: ["stroke", "icon"],
+} as IconMetadata;
+
+export default Tangent;