Merge pull request #1820 from dubinc/pricing-icons

Add pricing page icons to `@dub/ui`
dubinc · Dec 21, 2024 · e9706a0 · e9706a0
2 parents c7076ec + 7f3f078
commit e9706a0
Show file tree

Hide file tree

Showing 12 changed files with 577 additions and 1 deletion.
diff --git a/packages/ui/package.json b/packages/ui/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@dub/ui",
   "description": "UI components for Dub.co",
-  "version": "0.2.9",
+  "version": "0.2.11",
   "sideEffects": false,
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",

diff --git a/packages/ui/src/icons/nucleo/calendar.tsx b/packages/ui/src/icons/nucleo/calendar.tsx
@@ -0,0 +1,62 @@
+import { SVGProps } from "react";
+
+export function CalendarIcon(props: SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      height="18"
+      width="18"
+      viewBox="0 0 18 18"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <g fill="currentColor">
+        <line
+          fill="none"
+          stroke="currentColor"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          strokeWidth="1.5"
+          x1="5.75"
+          x2="5.75"
+          y1="2.75"
+          y2=".75"
+        />
+        <line
+          fill="none"
+          stroke="currentColor"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          strokeWidth="1.5"
+          x1="12.25"
+          x2="12.25"
+          y1="2.75"
+          y2=".75"
+        />
+        <line
+          fill="none"
+          stroke="currentColor"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          strokeWidth="1.5"
+          x1="2.25"
+          x2="15.75"
+          y1="6.25"
+          y2="6.25"
+        />
+        <rect
+          height="12.5"
+          width="13.5"
+          fill="none"
+          rx="2"
+          ry="2"
+          stroke="currentColor"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          strokeWidth="1.5"
+          x="2.25"
+          y="2.75"
+        />
+      </g>
+    </svg>
+  );
+}
diff --git a/packages/ui/src/icons/nucleo/folder5.tsx b/packages/ui/src/icons/nucleo/folder5.tsx
@@ -0,0 +1,37 @@
+import { SVGProps } from "react";
+
+export function Folder5(props: SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      height="18"
+      width="18"
+      viewBox="0 0 18 18"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <g fill="currentColor">
+        <path
+          d="M1.75,7.75V3.75c0-.552,.448-1,1-1h3.797c.288,0,.563,.125,.753,.342l2.325,2.658"
+          fill="none"
+          stroke="currentColor"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          strokeWidth="1.5"
+        />
+        <rect
+          height="9.5"
+          width="14.5"
+          fill="none"
+          rx="2"
+          ry="2"
+          stroke="currentColor"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          strokeWidth="1.5"
+          x="1.75"
+          y="5.75"
+        />
+      </g>
+    </svg>
+  );
+}
diff --git a/packages/ui/src/icons/nucleo/gear3.tsx b/packages/ui/src/icons/nucleo/gear3.tsx
@@ -0,0 +1,34 @@
+import { SVGProps } from "react";
+
+export function Gear3(props: SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      height="18"
+      width="18"
+      viewBox="0 0 18 18"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <g fill="currentColor">
+        <circle
+          cx="9"
+          cy="8.999"
+          fill="currentColor"
+          r="1.75"
+          stroke="currentColor"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          strokeWidth="1.5"
+        />
+        <path
+          d="m15.175,7.278l-.929-.328c-.102-.261-.219-.52-.363-.77s-.31-.48-.485-.699l.18-.968c.125-.671-.187-1.349-.778-1.69l-.351-.203c-.592-.342-1.334-.273-1.853.171l-.745.637c-.56-.086-1.133-.086-1.703,0l-.745-.638c-.519-.444-1.262-.513-1.853-.171l-.351.203c-.592.341-.903,1.019-.778,1.69l.18.965c-.36.449-.646.946-.852,1.474l-.924.326c-.644.227-1.075.836-1.075,1.519v.405c0,.683.431,1.292,1.075,1.519l.929.328c.102.261.218.519.363.769s.31.48.485.7l-.181.968c-.125.671.187,1.349.778,1.69l.351.203c.592.342,1.334.273,1.853-.171l.745-.638c.559.086,1.132.086,1.701,0l.746.639c.519.444,1.262.513,1.853.171l.351-.203c.592-.342.903-1.019.778-1.69l-.18-.966c.359-.449.646-.945.851-1.473l.925-.326c.644-.227,1.075-.836,1.075-1.519v-.405c0-.683-.431-1.292-1.075-1.519h.002Z"
+          fill="none"
+          stroke="currentColor"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          strokeWidth="1.5"
+        />
+      </g>
+    </svg>
+  );
+}
diff --git a/packages/ui/src/icons/nucleo/gem.tsx b/packages/ui/src/icons/nucleo/gem.tsx
@@ -0,0 +1,51 @@
+import { SVGProps } from "react";
+
+export function Gem(props: SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      height="18"
+      width="18"
+      viewBox="0 0 18 18"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <g fill="currentColor">
+        <line
+          fill="none"
+          stroke="currentColor"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          strokeWidth="1.5"
+          x1="2.053"
+          x2="15.951"
+          y1="6.75"
+          y2="6.75"
+        />
+        <polyline
+          fill="none"
+          points="7.88 3.25 6.057 6.75 8.765 15.723"
+          stroke="currentColor"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          strokeWidth="1.5"
+        />
+        <polyline
+          fill="none"
+          points="10.12 3.25 11.943 6.75 9.235 15.723"
+          stroke="currentColor"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          strokeWidth="1.5"
+        />
+        <path
+          d="M2.269,6.123l2.404-2.556c.191-.203,.458-.318,.738-.318h7.178c.28,0,.547,.115,.738,.318l2.404,2.556c.33,.351,.36,.885,.07,1.27l-5.993,7.956c-.403,.535-1.214,.535-1.616,0L2.199,7.393c-.29-.385-.26-.918,.07-1.27Z"
+          fill="none"
+          stroke="currentColor"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          strokeWidth="1.5"
+        />
+      </g>
+    </svg>
+  );
+}
diff --git a/packages/ui/src/icons/nucleo/index.ts b/packages/ui/src/icons/nucleo/index.ts
@@ -17,6 +17,7 @@ export * from "./books2";
 export * from "./box-archive";
 export * from "./bullet-list";
 export * from "./bullet-list-fill";
+export * from "./calendar";
 export * from "./calendar-days";
 export * from "./calendar6";
 export * from "./cards";
@@ -71,10 +72,13 @@ export * from "./flag-wavy";
 export * from "./flag2";
 export * from "./flag6";
 export * from "./folder";
+export * from "./folder5";
 export * from "./gaming-console";
 export * from "./gauge6";
 export * from "./gear";
 export * from "./gear2";
+export * from "./gear3";
+export * from "./gem";
 export * from "./gift";
 export * from "./gift-fill";
 export * from "./globe";
@@ -96,6 +100,7 @@ export * from "./input-search";
 export * from "./invoice-dollar";
 export * from "./key";
 export * from "./layout-sidebar";
+export * from "./license";
 export * from "./lines-y";
 export * from "./link-broken";
 export * from "./link4";
@@ -129,6 +134,7 @@ export * from "./scan-text";
 export * from "./scribble";
 export * from "./shield-alert";
 export * from "./shield-check";
+export * from "./shield-keyhole";
 export * from "./shuffle";
 export * from "./sliders";
 export * from "./sparkle3";
@@ -144,8 +150,12 @@ export * from "./trash";
 export * from "./tv";
 export * from "./user";
 export * from "./user-check";
+export * from "./user-crown";
 export * from "./users";
+export * from "./users-settings";
+export * from "./users2";
 export * from "./users6";
+export * from "./versions2";
 export * from "./watch";
 export * from "./webhook";
 export * from "./window";

diff --git a/packages/ui/src/icons/nucleo/license.tsx b/packages/ui/src/icons/nucleo/license.tsx
@@ -0,0 +1,61 @@
+import { SVGProps } from "react";
+
+export function License(props: SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      height="18"
+      width="18"
+      viewBox="0 0 18 18"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <g fill="currentColor">
+        <line
+          fill="none"
+          stroke="currentColor"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          strokeWidth="1.5"
+          x1="5.75"
+          x2="9.25"
+          y1="7.75"
+          y2="7.75"
+        />
+        <line
+          fill="none"
+          stroke="currentColor"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          strokeWidth="1.5"
+          x1="5.75"
+          x2="12.25"
+          y1="5.25"
+          y2="5.25"
+        />
+        <rect
+          height="14.5"
+          width="12.5"
+          fill="none"
+          rx="2"
+          ry="2"
+          stroke="currentColor"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          strokeWidth="1.5"
+          x="2.75"
+          y="1.75"
+        />
+        <circle
+          cx="11.25"
+          cy="12.25"
+          fill="none"
+          r="1.5"
+          stroke="currentColor"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          strokeWidth="1.5"
+        />
+      </g>
+    </svg>
+  );
+}
diff --git a/packages/ui/src/icons/nucleo/shield-keyhole.tsx b/packages/ui/src/icons/nucleo/shield-keyhole.tsx
@@ -0,0 +1,45 @@
+import { SVGProps } from "react";
+
+export function ShieldKeyhole(props: SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      height="18"
+      width="18"
+      viewBox="0 0 18 18"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <g fill="currentColor">
+        <circle
+          cx="9"
+          cy="8.25"
+          fill="none"
+          r="2"
+          stroke="currentColor"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          strokeWidth="1.5"
+        />
+        <line
+          fill="none"
+          stroke="currentColor"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          strokeWidth="1.5"
+          x1="9"
+          x2="9"
+          y1="10.25"
+          y2="12.5"
+        />
+        <path
+          d="M9.305,1.848l5.25,1.68c.414,.133,.695,.518,.695,.952v6.52c0,3.03-4.684,4.748-5.942,5.155-.203,.066-.413,.066-.616,0-1.258-.407-5.942-2.125-5.942-5.155V4.48c0-.435,.281-.82,.695-.952l5.25-1.68c.198-.063,.411-.063,.61,0Z"
+          fill="none"
+          stroke="currentColor"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          strokeWidth="1.5"
+        />
+      </g>
+    </svg>
+  );
+}
diff --git a/packages/ui/src/icons/nucleo/user-crown.tsx b/packages/ui/src/icons/nucleo/user-crown.tsx
@@ -0,0 +1,40 @@
+import { SVGProps } from "react";
+
+export function UserCrown(props: SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      height="18"
+      width="18"
+      viewBox="0 0 18 18"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <g fill="currentColor">
+        <path
+          d="M5.25,5.75v.75c0,2.071,1.679,3.75,3.75,3.75s3.75-1.679,3.75-3.75v-.75"
+          fill="none"
+          stroke="currentColor"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          strokeWidth="1.5"
+        />
+        <path
+          d="M2.953,16c1.298-1.958,3.522-3.25,6.047-3.25s4.749,1.291,6.047,3.25"
+          fill="none"
+          stroke="currentColor"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          strokeWidth="1.5"
+        />
+        <path
+          d="M13,1l-1.341,1.174c-.377,.33-.94,.33-1.317,0l-1.341-1.174-1.341,1.174c-.377,.33-.94,.33-1.317,0l-1.341-1.174,.25,4.75c.754-.314,2.067-.75,3.75-.75,.817,0,2.196,.103,3.75,.75l.25-4.75Z"
+          fill="none"
+          stroke="currentColor"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          strokeWidth="1.5"
+        />
+      </g>
+    </svg>
+  );
+}