@kivid/icons 1.0.0-alpha.10 → 1.0.0-alpha.15

package/src/components/web/GradientAlert.tsx

@@ -0,0 +1,86 @@
+import * as React from "react";
+import type { SVGProps } from "react";
+import { Ref, forwardRef, memo } from "react";
+interface Props extends React.SVGProps<SVGSVGElement> {
+  size?: number;
+  color?: string;
+}
+const GradientAlert = (props: Props, ref: React.Ref<SVGSVGElement>) => {
+  const {
+    size = 24,
+    color = "currentColor",
+    stroke = "",
+    strokeWidth = 1.5,
+  } = props;
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 16 16"
+      fill="none"
+      width={size}
+      height={size}
+      color={color}
+      stroke={stroke}
+      strokeWidth={strokeWidth}
+      ref={ref}
+      {...props}
+    >
+      <g filter="url(#6-filter0_i_3359_12282)">
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M8.00001 2C8.73638 2 9.33334 2.58216 9.33334 3.30028V9.36639C9.33334 10.0845 8.73638 10.6667 8.00001 10.6667C7.26363 10.6667 6.66667 10.0845 6.66667 9.36639V3.30028C6.66667 2.58216 7.26363 2 8.00001 2Z"
+          fill="#F2F7F7"
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M8.00001 11.3333C8.73638 11.3333 9.33334 11.9154 9.33334 12.6336V12.6997C9.33334 13.4178 8.73638 14 8.00001 14C7.26363 14 6.66667 13.4178 6.66667 12.6997V12.6336C6.66667 11.9154 7.26363 11.3333 8.00001 11.3333Z"
+          fill="#F2F7F7"
+        />
+      </g>
+      <defs>
+        <filter
+          id="6-filter0_i_3359_12282"
+          x={6.66667}
+          y={2}
+          width={3.66667}
+          height={13}
+          filterUnits="userSpaceOnUse"
+          colorInterpolationFilters="sRGB"
+        >
+          <feFlood floodOpacity={0} result="BackgroundImageFix" />
+          <feBlend
+            mode="normal"
+            in="SourceGraphic"
+            in2="BackgroundImageFix"
+            result="shape"
+          />
+          <feColorMatrix
+            in="SourceAlpha"
+            type="matrix"
+            values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+            result="hardAlpha"
+          />
+          <feOffset dx={1} dy={1} />
+          <feGaussianBlur stdDeviation={1} />
+          <feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
+          <feColorMatrix
+            type="matrix"
+            values="0 0 0 0 0.960784 0 0 0 0 0.541176 0 0 0 0 0.239216 0 0 0 0.4 0"
+          />
+          <feBlend
+            mode="normal"
+            in2="shape"
+            result="effect1_innerShadow_3359_12282"
+          />
+        </filter>
+      </defs>
+    </svg>
+  );
+};
+GradientAlert.displayName = "GradientAlert";
+const ForwardRef = forwardRef(GradientAlert);
+let MaybeCssInteropedComponent: React.ComponentType<Props> = ForwardRef;
+const Memo = memo(MaybeCssInteropedComponent);
+export { Memo as GradientAlert };

package/src/components/web/GradientBuilding200BasicPink.tsx

@@ -0,0 +1,57 @@
+import * as React from "react";
+import type { SVGProps } from "react";
+import { Ref, forwardRef, memo } from "react";
+interface Props extends React.SVGProps<SVGSVGElement> {
+  size?: number;
+  color?: string;
+}
+const GradientBuilding200BasicPink = (
+  props: Props,
+  ref: React.Ref<SVGSVGElement>
+) => {
+  const {
+    size = 24,
+    color = "currentColor",
+    stroke = "",
+    strokeWidth = 1.5,
+  } = props;
+  return (
+    <svg
+      viewBox="0 0 56 56"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      width={size}
+      height={size}
+      color={color}
+      stroke={stroke}
+      strokeWidth={strokeWidth}
+      ref={ref}
+      {...props}
+    >
+      <path
+        d="M50.7523 48.9997H4.08563M39.6667 48.9997V23.333H46.6667C47.9554 23.333 49 24.3777 49 25.6663V48.9997H39.6667ZM39.6667 48.9997V11.6663C39.6667 10.3777 38.622 9.33301 37.3334 9.33301H9.33335C8.04469 9.33301 7.00002 10.3777 7.00002 11.6663V48.9997H14M39.6667 48.9997H32.6667M23.3334 37.333V48.9997M32.6667 48.9997V37.333H14V48.9997M32.6667 48.9997H14M16.3334 27.9997H30.3334M16.3334 18.6663H30.3334"
+        stroke="url(#7-paint0_linear_10804_42229)"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <defs>
+        <linearGradient
+          id="7-paint0_linear_10804_42229"
+          x1={4.11167}
+          y1={48.9997}
+          x2={57.9195}
+          y2={26.3893}
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop stopColor="#9573E5" />
+          <stop offset={1} stopColor="#F39ECF" />
+        </linearGradient>
+      </defs>
+    </svg>
+  );
+};
+GradientBuilding200BasicPink.displayName = "GradientBuilding200BasicPink";
+const ForwardRef = forwardRef(GradientBuilding200BasicPink);
+let MaybeCssInteropedComponent: React.ComponentType<Props> = ForwardRef;
+const Memo = memo(MaybeCssInteropedComponent);
+export { Memo as GradientBuilding200BasicPink };

package/src/components/web/GradientCheck.tsx

@@ -0,0 +1,80 @@
+import * as React from "react";
+import type { SVGProps } from "react";
+import { Ref, forwardRef, memo } from "react";
+interface Props extends React.SVGProps<SVGSVGElement> {
+  size?: number;
+  color?: string;
+}
+const GradientCheck = (props: Props, ref: React.Ref<SVGSVGElement>) => {
+  const {
+    size = 24,
+    color = "currentColor",
+    stroke = "",
+    strokeWidth = 1.5,
+  } = props;
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 16 16"
+      fill="none"
+      width={size}
+      height={size}
+      color={color}
+      stroke={stroke}
+      strokeWidth={strokeWidth}
+      ref={ref}
+      {...props}
+    >
+      <g filter="url(#8-filter0_i_3359_12276)">
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M12.8985 4.39037C13.4574 4.93089 13.4806 5.83095 12.9504 6.40072L7.97736 11.5567C7.71389 11.8398 7.34787 12.0001 6.96506 12C6.58225 11.9999 6.2163 11.8394 5.95297 11.5562L3.04912 8.40463C2.51919 7.8346 2.54288 6.93454 3.10203 6.3943C3.66118 5.85406 4.54404 5.87821 5.07397 6.44825L6.96589 8.51126L10.9265 4.44334C11.4567 3.87357 12.3396 3.84985 12.8985 4.39037Z"
+          fill="#F2F7F7"
+        />
+      </g>
+      <defs>
+        <filter
+          id="8-filter0_i_3359_12276"
+          x={2.66667}
+          y={4}
+          width={11.6667}
+          height={9}
+          filterUnits="userSpaceOnUse"
+          colorInterpolationFilters="sRGB"
+        >
+          <feFlood floodOpacity={0} result="BackgroundImageFix" />
+          <feBlend
+            mode="normal"
+            in="SourceGraphic"
+            in2="BackgroundImageFix"
+            result="shape"
+          />
+          <feColorMatrix
+            in="SourceAlpha"
+            type="matrix"
+            values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+            result="hardAlpha"
+          />
+          <feOffset dx={1} dy={1} />
+          <feGaussianBlur stdDeviation={1} />
+          <feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
+          <feColorMatrix
+            type="matrix"
+            values="0 0 0 0 0.215686 0 0 0 0 0.886275 0 0 0 0 0.439216 0 0 0 0.4 0"
+          />
+          <feBlend
+            mode="normal"
+            in2="shape"
+            result="effect1_innerShadow_3359_12276"
+          />
+        </filter>
+      </defs>
+    </svg>
+  );
+};
+GradientCheck.displayName = "GradientCheck";
+const ForwardRef = forwardRef(GradientCheck);
+let MaybeCssInteropedComponent: React.ComponentType<Props> = ForwardRef;
+const Memo = memo(MaybeCssInteropedComponent);
+export { Memo as GradientCheck };

package/src/components/web/GradientClose.tsx

@@ -0,0 +1,78 @@
+import * as React from "react";
+import type { SVGProps } from "react";
+import { Ref, forwardRef, memo } from "react";
+interface Props extends React.SVGProps<SVGSVGElement> {
+  size?: number;
+  color?: string;
+}
+const GradientClose = (props: Props, ref: React.Ref<SVGSVGElement>) => {
+  const {
+    size = 24,
+    color = "currentColor",
+    stroke = "",
+    strokeWidth = 1.5,
+  } = props;
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 16 16"
+      fill="none"
+      width={size}
+      height={size}
+      color={color}
+      stroke={stroke}
+      strokeWidth={strokeWidth}
+      ref={ref}
+      {...props}
+    >
+      <g filter="url(#9-filter0_i_3359_12279)">
+        <path
+          d="M12.1996 5.86591C12.7827 5.28288 12.7929 4.3479 12.2226 3.77757C11.6523 3.20721 10.7173 3.2175 10.1342 3.80054L8.02294 5.91184L5.86576 3.75461C5.29541 3.18429 4.36043 3.19454 3.7774 3.77757C3.19439 4.36061 3.18411 5.29559 3.75446 5.86591L5.91166 8.02309L3.80036 10.1344C3.21733 10.7174 3.20705 11.6524 3.7774 12.2228C4.34774 12.7931 5.28272 12.7828 5.86576 12.1998L7.97706 10.0885L10.1342 12.2457C10.7046 12.8161 11.6396 12.8058 12.2226 12.2228C12.8056 11.6397 12.8159 10.7048 12.2455 10.1344L10.0883 7.97721L12.1996 5.86591Z"
+          fill="#F2F7F7"
+        />
+      </g>
+      <defs>
+        <filter
+          id="9-filter0_i_3359_12279"
+          x={3.33333}
+          y={3.3335}
+          width={10.3333}
+          height={10.3335}
+          filterUnits="userSpaceOnUse"
+          colorInterpolationFilters="sRGB"
+        >
+          <feFlood floodOpacity={0} result="BackgroundImageFix" />
+          <feBlend
+            mode="normal"
+            in="SourceGraphic"
+            in2="BackgroundImageFix"
+            result="shape"
+          />
+          <feColorMatrix
+            in="SourceAlpha"
+            type="matrix"
+            values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+            result="hardAlpha"
+          />
+          <feOffset dx={1} dy={1} />
+          <feGaussianBlur stdDeviation={1} />
+          <feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
+          <feColorMatrix
+            type="matrix"
+            values="0 0 0 0 0.898039 0 0 0 0 0.270588 0 0 0 0 0.270588 0 0 0 0.4 0"
+          />
+          <feBlend
+            mode="normal"
+            in2="shape"
+            result="effect1_innerShadow_3359_12279"
+          />
+        </filter>
+      </defs>
+    </svg>
+  );
+};
+GradientClose.displayName = "GradientClose";
+const ForwardRef = forwardRef(GradientClose);
+let MaybeCssInteropedComponent: React.ComponentType<Props> = ForwardRef;
+const Memo = memo(MaybeCssInteropedComponent);
+export { Memo as GradientClose };

package/src/components/web/GradientDocLabExam200BasicPink.tsx

@@ -0,0 +1,57 @@
+import * as React from "react";
+import type { SVGProps } from "react";
+import { Ref, forwardRef, memo } from "react";
+interface Props extends React.SVGProps<SVGSVGElement> {
+  size?: number;
+  color?: string;
+}
+const GradientDocLabExam200BasicPink = (
+  props: Props,
+  ref: React.Ref<SVGSVGElement>
+) => {
+  const {
+    size = 24,
+    color = "currentColor",
+    stroke = "",
+    strokeWidth = 1.5,
+  } = props;
+  return (
+    <svg
+      viewBox="0 0 40 40"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      width={size}
+      height={size}
+      color={color}
+      stroke={stroke}
+      strokeWidth={strokeWidth}
+      ref={ref}
+      {...props}
+    >
+      <path
+        d="M32.5022 12.5003V7.50033C32.5022 6.61627 32.151 5.76705 31.5259 5.14193C30.9008 4.51681 30.053 4.16699 29.1689 4.16699H7.50224C6.61819 4.16699 5.77039 4.51681 5.14527 5.14193C4.52014 5.76705 4.16891 6.61627 4.16891 7.50033V30.8337C4.16891 31.7177 4.52014 32.5653 5.14527 33.1904C5.77039 33.8156 6.61819 34.167 7.50224 34.167H15.8356M10.8356 24.167H14.1689M10.8356 17.5003H17.5022M10.8356 10.8337H25.8356M32.2538 17.5003H24.7538M31.0039 17.5003V23.8008L35.3256 30.7344C35.6408 31.2394 35.815 31.8206 35.8301 32.4157C35.8453 33.0108 35.7008 33.5978 35.4116 34.1182C35.1225 34.6385 34.699 35.0732 34.1856 35.3747C33.6723 35.6761 33.0877 35.8347 32.4923 35.8337H24.5057C23.9103 35.8347 23.3255 35.6761 22.8122 35.3747C22.2988 35.0732 21.8756 34.6385 21.5864 34.1182C21.2972 33.5978 21.1526 33.0108 21.1677 32.4157C21.1828 31.8206 21.357 31.2394 21.6722 30.7344L25.9939 23.8008V17.5003M31.2305 24.167H25.7772"
+        stroke="url(#10-paint0_linear_10803_6482)"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <defs>
+        <linearGradient
+          id="10-paint0_linear_10803_6482"
+          x1={4.18657}
+          y1={35.8337}
+          x2={42.2816}
+          y2={22.229}
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop stopColor="#9573E5" />
+          <stop offset={1} stopColor="#F39ECF" />
+        </linearGradient>
+      </defs>
+    </svg>
+  );
+};
+GradientDocLabExam200BasicPink.displayName = "GradientDocLabExam200BasicPink";
+const ForwardRef = forwardRef(GradientDocLabExam200BasicPink);
+let MaybeCssInteropedComponent: React.ComponentType<Props> = ForwardRef;
+const Memo = memo(MaybeCssInteropedComponent);
+export { Memo as GradientDocLabExam200BasicPink };

package/src/components/web/GradientFamily200BasicPink.tsx

@@ -0,0 +1,57 @@
+import * as React from "react";
+import type { SVGProps } from "react";
+import { Ref, forwardRef, memo } from "react";
+interface Props extends React.SVGProps<SVGSVGElement> {
+  size?: number;
+  color?: string;
+}
+const GradientFamily200BasicPink = (
+  props: Props,
+  ref: React.Ref<SVGSVGElement>
+) => {
+  const {
+    size = 24,
+    color = "currentColor",
+    stroke = "",
+    strokeWidth = 1.5,
+  } = props;
+  return (
+    <svg
+      viewBox="0 0 56 56"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      width={size}
+      height={size}
+      color={color}
+      stroke={stroke}
+      strokeWidth={strokeWidth}
+      ref={ref}
+      {...props}
+    >
+      <path
+        d="M51.3332 48.0623V36.3629C51.3289 34.9604 50.7678 33.6171 49.7732 32.6282C48.7786 31.6393 47.4321 31.0859 46.0296 31.0896H44.3309M4.6665 48.0623V36.3629C4.67083 34.9604 5.23196 33.6171 6.22653 32.6282C7.22109 31.6393 8.56767 31.0859 9.97017 31.0896H11.6688M39.3166 51.3337V33.1337C39.3104 31.1703 38.5248 29.2897 37.1326 27.9054C35.7403 26.521 33.8553 25.7461 31.8919 25.751H24.0986C22.1348 25.7486 20.2504 26.5261 18.8598 27.9128C17.4692 29.2994 16.6863 31.1816 16.6832 33.1454V51.3454M47.8167 20.606C47.8167 22.9359 45.9363 24.8247 43.6167 24.8247C41.2971 24.8247 39.4167 22.9359 39.4167 20.606C39.4167 18.2761 41.2971 16.3873 43.6167 16.3873C45.9363 16.3873 47.8167 18.2761 47.8167 20.606ZM34.9998 11.6997C34.9998 15.5837 31.8658 18.7323 27.9998 18.7323C24.1338 18.7323 20.9998 15.5837 20.9998 11.6997C20.9998 7.81562 24.1338 4.66699 27.9998 4.66699C31.8658 4.66699 34.9998 7.81562 34.9998 11.6997ZM16.5853 20.606C16.5853 22.9359 14.7049 24.8247 12.3853 24.8247C10.0657 24.8247 8.1853 22.9359 8.1853 20.606C8.1853 18.2761 10.0657 16.3873 12.3853 16.3873C14.7049 16.3873 16.5853 18.2761 16.5853 20.606Z"
+        stroke="url(#11-paint0_linear_10804_42202)"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <defs>
+        <linearGradient
+          id="11-paint0_linear_10804_42202"
+          x1={4.69254}
+          y1={51.3454}
+          x2={60.8418}
+          y2={31.2953}
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop stopColor="#9573E5" />
+          <stop offset={1} stopColor="#F39ECF" />
+        </linearGradient>
+      </defs>
+    </svg>
+  );
+};
+GradientFamily200BasicPink.displayName = "GradientFamily200BasicPink";
+const ForwardRef = forwardRef(GradientFamily200BasicPink);
+let MaybeCssInteropedComponent: React.ComponentType<Props> = ForwardRef;
+const Memo = memo(MaybeCssInteropedComponent);
+export { Memo as GradientFamily200BasicPink };

package/src/components/web/GradientPassaport200BasicPink.tsx

@@ -0,0 +1,57 @@
+import * as React from "react";
+import type { SVGProps } from "react";
+import { Ref, forwardRef, memo } from "react";
+interface Props extends React.SVGProps<SVGSVGElement> {
+  size?: number;
+  color?: string;
+}
+const GradientPassaport200BasicPink = (
+  props: Props,
+  ref: React.Ref<SVGSVGElement>
+) => {
+  const {
+    size = 24,
+    color = "currentColor",
+    stroke = "",
+    strokeWidth = 1.5,
+  } = props;
+  return (
+    <svg
+      viewBox="0 0 56 56"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      width={size}
+      height={size}
+      color={color}
+      stroke={stroke}
+      strokeWidth={strokeWidth}
+      ref={ref}
+      {...props}
+    >
+      <path
+        d="M34.9983 22.165H44.3316M40.5983 31.4984H34.9983M28.22 38.4984C27.8122 37.4756 27.1818 36.5581 26.3743 35.8096C25.0055 34.5389 23.2067 33.8313 21.3389 33.8317H18.3266C16.4589 33.8313 14.6602 34.5389 13.2913 35.8096C12.4838 36.5581 11.8533 37.4756 11.4456 38.4984M25.0816 22.7484C25.0816 25.6479 22.7311 27.9984 19.8316 27.9984C16.9321 27.9984 14.5816 25.6479 14.5816 22.7484C14.5816 19.8489 16.9321 17.4984 19.8316 17.4984C22.7311 17.4984 25.0816 19.8489 25.0816 22.7484ZM51.334 12.8317V43.165C51.334 44.4027 50.8423 45.5897 49.9671 46.4649C49.092 47.34 47.905 47.8317 46.6673 47.8317H9.33396C8.09629 47.8317 6.9093 47.34 6.03413 46.4649C5.15896 45.5897 4.6673 44.4027 4.6673 43.165V12.9274C4.6673 11.6643 5.16904 10.453 6.06215 9.55989C6.95526 8.66678 8.16658 8.16504 9.42963 8.16504H46.6673C47.905 8.16504 49.092 8.6567 49.9671 9.53187C50.8423 10.407 51.334 11.594 51.334 12.8317Z"
+        stroke="url(#12-paint0_linear_10803_20950)"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <defs>
+        <linearGradient
+          id="12-paint0_linear_10803_20950"
+          x1={4.69333}
+          y1={47.8317}
+          x2={58.5011}
+          y2={25.2214}
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop stopColor="#9573E5" />
+          <stop offset={1} stopColor="#F39ECF" />
+        </linearGradient>
+      </defs>
+    </svg>
+  );
+};
+GradientPassaport200BasicPink.displayName = "GradientPassaport200BasicPink";
+const ForwardRef = forwardRef(GradientPassaport200BasicPink);
+let MaybeCssInteropedComponent: React.ComponentType<Props> = ForwardRef;
+const Memo = memo(MaybeCssInteropedComponent);
+export { Memo as GradientPassaport200BasicPink };

package/src/components/web/GradientPersonDoc200BasicPink.tsx

@@ -0,0 +1,55 @@
+import * as React from "react";
+import type { SVGProps } from "react";
+import { Ref, forwardRef, memo } from "react";
+interface Props extends React.SVGProps<SVGSVGElement> {
+  size?: number;
+  color?: string;
+}
+const GradientPersonDoc200BasicPink = (
+  props: Props,
+  ref: React.Ref<SVGSVGElement>
+) => {
+  const {
+    size = 24,
+    color = "currentColor",
+    stroke = "",
+    strokeWidth = 1.5,
+  } = props;
+  return (
+    <svg
+      viewBox="0 0 56 56"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      width={size}
+      height={size}
+      color={color}
+      stroke={stroke}
+      strokeWidth={strokeWidth}
+      ref={ref}
+      {...props}
+    >
+      <path
+        d="M32.9035 18.3245L33.7912 17.4446C33.7824 17.4356 33.7733 17.4268 33.7642 17.4181L32.9035 18.3245ZM42.0003 46.6668V45.4168H14.0003V46.6668V47.9168H42.0003V46.6668ZM14.0003 46.6668V45.4168C10.8243 45.4168 8.25031 42.8428 8.25031 39.6668H7.00031H5.75031C5.75031 44.2235 9.44362 47.9168 14.0003 47.9168V46.6668ZM7.00031 39.6668H8.25031V16.3335H7.00031H5.75031V39.6668H7.00031ZM7.00031 16.3335H8.25031C8.25031 13.1575 10.8243 10.5835 14.0003 10.5835V9.3335V8.0835C9.44362 8.0835 5.75031 11.7768 5.75031 16.3335H7.00031ZM14.0003 9.3335V10.5835H42.0003V9.3335V8.0835H14.0003V9.3335ZM42.0003 9.3335V10.5835C45.1763 10.5835 47.7503 13.1575 47.7503 16.3335H49.0003H50.2503C50.2503 11.7768 46.557 8.0835 42.0003 8.0835V9.3335ZM49.0003 16.3335H47.7503V39.6668H49.0003H50.2503V16.3335H49.0003ZM49.0003 39.6668H47.7503C47.7503 42.8428 45.1763 45.4168 42.0003 45.4168V46.6668V47.9168C46.557 47.9168 50.2503 44.2235 50.2503 39.6668H49.0003ZM32.9035 18.3245L32.0157 19.2045C34.3437 21.5532 34.3043 25.2258 32.0427 27.3733L32.9035 28.2798L33.7642 29.1862C37.0942 26.0242 37.0548 20.7372 33.7912 17.4446L32.9035 18.3245ZM32.9035 28.2798L32.0427 27.3733C29.6773 29.6194 26.0412 29.6688 23.95 27.4271L23.0359 28.2798L22.1219 29.1324C25.2934 32.532 30.538 32.2496 33.7642 29.1862L32.9035 28.2798ZM23.0359 28.2798L23.95 27.4271C21.7185 25.0351 21.6678 21.3474 23.8967 19.231L23.0359 18.3245L22.1752 17.4181C18.8125 20.6111 19.0907 25.8832 22.1219 29.1324L23.0359 28.2798ZM23.0359 18.3245L23.8967 19.231C26.2101 17.0343 29.7293 17.0343 32.0427 19.231L32.9035 18.3245L33.7642 17.4181C30.486 14.3053 25.4534 14.3053 22.1752 17.4181L23.0359 18.3245ZM23.3336 37.3335V38.5835H32.667V37.3335V36.0835H23.3336V37.3335ZM32.667 37.3335V38.5835C37.1313 38.5835 40.7503 42.2025 40.7503 46.6668H42.0003H43.2503C43.2503 40.8218 38.512 36.0835 32.667 36.0835V37.3335ZM23.3336 37.3335V36.0835C17.4886 36.0835 12.7503 40.8218 12.7503 46.6668H14.0003H15.2503C15.2503 42.2025 18.8693 38.5835 23.3336 38.5835V37.3335Z"
+        fill="url(#13-paint0_linear_10804_41962)"
+      />
+      <defs>
+        <linearGradient
+          id="13-paint0_linear_10804_41962"
+          x1={7.02374}
+          y1={46.6668}
+          x2={56.0808}
+          y2={26.9546}
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop stopColor="#9573E5" />
+          <stop offset={1} stopColor="#F39ECF" />
+        </linearGradient>
+      </defs>
+    </svg>
+  );
+};
+GradientPersonDoc200BasicPink.displayName = "GradientPersonDoc200BasicPink";
+const ForwardRef = forwardRef(GradientPersonDoc200BasicPink);
+let MaybeCssInteropedComponent: React.ComponentType<Props> = ForwardRef;
+const Memo = memo(MaybeCssInteropedComponent);
+export { Memo as GradientPersonDoc200BasicPink };

package/src/components/web/HandHeart.tsx

@@ -0,0 +1,41 @@
+import * as React from "react";
+import type { SVGProps } from "react";
+import { Ref, forwardRef, memo } from "react";
+interface Props extends React.SVGProps<SVGSVGElement> {
+  size?: number;
+  color?: string;
+}
+const HandHeart = (props: Props, ref: React.Ref<SVGSVGElement>) => {
+  const {
+    size = 24,
+    color = "currentColor",
+    stroke = "",
+    strokeWidth = 1.5,
+  } = props;
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 25 24"
+      fill="none"
+      width={size}
+      height={size}
+      color={color}
+      stroke={stroke}
+      strokeWidth={strokeWidth}
+      ref={ref}
+      {...props}
+    >
+      <path
+        d="M19.0206 15.5V11.5C19.0206 10.67 19.6906 10 20.5206 10C21.3506 10 22.0206 10.67 22.0206 11.5V18.06C22.0206 18.68 21.8806 19.29 21.6006 19.85L21.0206 21.01M14.0206 21V18.09C14.0206 17.66 14.1606 17.24 14.4206 16.89L16.1006 14.65C16.6906 13.86 17.8506 13.78 18.5506 14.48C19.1206 15.05 19.1906 15.96 18.7006 16.6L17.6506 18M5.02063 15.5V11.5C5.02063 10.67 4.35063 10 3.52063 10C2.69063 10 2.02063 10.67 2.02063 11.5V18.06C2.02063 18.68 2.16063 19.29 2.44063 19.85L3.02063 21.01M10.0206 21V18.09C10.0206 17.66 9.88063 17.24 9.62063 16.89L7.94063 14.65C7.35063 13.86 6.19063 13.78 5.49063 14.48C4.92063 15.05 4.85063 15.96 5.34063 16.6L6.39063 18M13.5806 10.36C13.1706 10.77 12.6106 11 12.0206 11C11.4406 11 10.8806 10.77 10.4606 10.36L7.83063 7.72C6.75063 6.64 6.75063 4.89 7.83063 3.81C8.91063 2.73 10.6606 2.73 11.7406 3.81L12.0206 4.09L12.3006 3.81C13.3806 2.73 15.1306 2.73 16.2106 3.81C17.2906 4.89 17.2906 6.64 16.2106 7.72L13.5706 10.36H13.5806Z"
+        stroke={color}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+};
+HandHeart.displayName = "HandHeart";
+const ForwardRef = forwardRef(HandHeart);
+let MaybeCssInteropedComponent: React.ComponentType<Props> = ForwardRef;
+const Memo = memo(MaybeCssInteropedComponent);
+export { Memo as HandHeart };

package/src/components/web/Happy.tsx

@@ -0,0 +1,41 @@
+import * as React from "react";
+import type { SVGProps } from "react";
+import { Ref, forwardRef, memo } from "react";
+interface Props extends React.SVGProps<SVGSVGElement> {
+  size?: number;
+  color?: string;
+}
+const Happy = (props: Props, ref: React.Ref<SVGSVGElement>) => {
+  const {
+    size = 24,
+    color = "currentColor",
+    stroke = "",
+    strokeWidth = 1.5,
+  } = props;
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 20 20"
+      fill="none"
+      width={size}
+      height={size}
+      color={color}
+      stroke={stroke}
+      strokeWidth={strokeWidth}
+      ref={ref}
+      {...props}
+    >
+      <path
+        d="M6.5 8V7M13.5 7V8M13 12C13 13.657 11.657 15 10 15C8.343 15 7 13.657 7 12H13ZM10 1C5.037 1 1 5.037 1 10C1 14.963 5.037 19 10 19C14.963 19 19 14.962 19 10C19 5.038 14.962 1 10 1Z"
+        stroke={color}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+};
+Happy.displayName = "Happy";
+const ForwardRef = forwardRef(Happy);
+let MaybeCssInteropedComponent: React.ComponentType<Props> = ForwardRef;
+const Memo = memo(MaybeCssInteropedComponent);
+export { Memo as Happy };

package/src/components/web/Headset.tsx

@@ -0,0 +1,41 @@
+import * as React from "react";
+import type { SVGProps } from "react";
+import { Ref, forwardRef, memo } from "react";
+interface Props extends React.SVGProps<SVGSVGElement> {
+  size?: number;
+  color?: string;
+}
+const Headset = (props: Props, ref: React.Ref<SVGSVGElement>) => {
+  const {
+    size = 24,
+    color = "currentColor",
+    stroke = "",
+    strokeWidth = 1.5,
+  } = props;
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 25 24"
+      fill="none"
+      width={size}
+      height={size}
+      color={color}
+      stroke={stroke}
+      strokeWidth={strokeWidth}
+      ref={ref}
+      {...props}
+    >
+      <path
+        d="M18.0206 16.875H19.0206C19.5511 16.875 20.0598 16.6643 20.4348 16.2892C20.8099 15.9141 21.0206 15.4054 21.0206 14.875V11.875C21.0206 11.3446 20.8099 10.8359 20.4348 10.4608C20.0598 10.0857 19.5511 9.875 19.0206 9.875H18.0206C17.7554 9.875 17.5011 9.98036 17.3135 10.1679C17.126 10.3554 17.0206 10.6098 17.0206 10.875V15.875C17.0206 16.1402 17.126 16.3946 17.3135 16.5821C17.5011 16.7696 17.7554 16.875 18.0206 16.875ZM18.0206 16.875V17.875C18.0206 18.4054 17.8099 18.914 17.4348 19.2891C17.0598 19.6641 16.5511 19.875 16.0206 19.875H13.8956M18.5206 9.875V9.375C18.5206 7.65109 17.8358 5.9978 16.6168 4.77881C15.3978 3.55982 13.7445 2.875 12.0206 2.875C10.2967 2.875 8.64342 3.55982 7.42444 4.77881C6.20545 5.9978 5.52063 7.65109 5.52063 9.375V9.875M13.8956 19.875C13.8956 19.1846 13.336 18.625 12.6456 18.625H11.3956C10.7053 18.625 10.1456 19.1846 10.1456 19.875C10.1456 20.5654 10.7053 21.125 11.3956 21.125H12.6456C13.336 21.125 13.8956 20.5654 13.8956 19.875ZM5.02063 9.875H6.02063C6.28585 9.875 6.5402 9.98036 6.72774 10.1679C6.91527 10.3554 7.02063 10.6098 7.02063 10.875V15.875C7.02063 16.1402 6.91527 16.3946 6.72774 16.5821C6.5402 16.7696 6.28585 16.875 6.02063 16.875H5.02063C4.4902 16.875 3.98149 16.6643 3.60642 16.2892C3.23134 15.9141 3.02063 15.4054 3.02063 14.875V11.875C3.02063 11.3446 3.23134 10.8359 3.60642 10.4608C3.98149 10.0857 4.4902 9.875 5.02063 9.875Z"
+        stroke={color}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+};
+Headset.displayName = "Headset";
+const ForwardRef = forwardRef(Headset);
+let MaybeCssInteropedComponent: React.ComponentType<Props> = ForwardRef;
+const Memo = memo(MaybeCssInteropedComponent);
+export { Memo as Headset };