@crystallize/design-system 0.2.0 → 1.0.0

package/dist/index.mjs

@@ -1,12 +1,8 @@
-// src/action-menu/action-menu.tsx
-import { cx as cx4 } from "class-variance-authority";
-
 // src/dropdown-menu/dropdown-menu-root.tsx
 import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
 import { jsx, jsxs } from "react/jsx-runtime";
-function DropdownMenuRoot({ children, content, onOpenChange, alignContent = "start" }) {
+function DropdownMenuRoot({ children, content, alignContent = "start", ...delegated }) {
   return /* @__PURE__ */ jsxs(DropdownMenuPrimitive.Root, {
-    onOpenChange,
     children: [
       /* @__PURE__ */ jsx(DropdownMenuPrimitive.Trigger, {
         asChild: true,
@@ -15,7 +11,8 @@ function DropdownMenuRoot({ children, content, onOpenChange, alignContent = "sta
       /* @__PURE__ */ jsx(DropdownMenuPrimitive.Content, {
         align: alignContent,
         sideOffset: 5,
-        className: "shadow",
+        className: "c-dropdown-menu-content",
+        ...delegated,
         children: content
       })
     ]
@@ -29,24 +26,17 @@ import { jsx as jsx2 } from "react/jsx-runtime";
 function DropdownMenuItem({ children, className, ...delegated }) {
   return /* @__PURE__ */ jsx2(DropdownMenuPrimitive2.Item, {
     ...delegated,
-    className: cx(
-      "text-xs font-medium text-black-text",
-      "flex h-10 cursor-pointer items-center bg-white px-4 outline-asteroid",
-      "hover:bg-[#F8F8F9] hover:outline-none hover:focus-visible:outline-none",
-      "first:rounded-tr first:rounded-tl last:rounded-br last:rounded-bl",
-      className
-    ),
+    className: cx("c-dropdown-menu-item", className),
     children
   });
 }
 
 // src/dropdown-menu/dropdown-menu-label.tsx
 import * as DropdownMenuPrimitive3 from "@radix-ui/react-dropdown-menu";
-import { cx as cx2 } from "class-variance-authority";
 import { jsx as jsx3 } from "react/jsx-runtime";
 function DropdownMenuLabel({ children }) {
   return /* @__PURE__ */ jsx3(DropdownMenuPrimitive3.Label, {
-    className: cx2("bg-white px-4 py-2 text-xs text-label", "first:rounded-tl first:rounded-tr"),
+    className: "c-dropdown-menu-label",
     children
   });
 }
@@ -58,29 +48,396 @@ var DropdownMenu = {
   Label: DropdownMenuLabel
 };
 
-// src/icons/arrow.tsx
-import { forwardRef } from "react";
+// src/action-menu/action-item.tsx
+import { cx as cx2 } from "class-variance-authority";
 import { jsx as jsx4 } from "react/jsx-runtime";
-var Arrow = forwardRef((delegated, ref) => {
-  return /* @__PURE__ */ jsx4("svg", {
+function Item2({ children, className, onSelect }) {
+  return /* @__PURE__ */ jsx4(DropdownMenu.Item, {
+    onClick: onSelect,
+    className: cx2(className, "c-action-menu-item"),
+    children
+  });
+}
+
+// src/action-menu/action-menu.tsx
+import { jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
+function ActionMenu({ children, tabIndex }) {
+  return /* @__PURE__ */ jsx5(DropdownMenu.Root, {
+    content: children,
+    alignContent: "center",
+    children: /* @__PURE__ */ jsxs2("button", {
+      tabIndex,
+      type: "button",
+      className: "c-action-menu",
+      "aria-label": "more options",
+      children: [
+        /* @__PURE__ */ jsx5("span", {
+          className: "sr-only",
+          children: "Open more options"
+        }),
+        /* @__PURE__ */ jsx5("span", {
+          className: "c-action-menu-dot"
+        }),
+        /* @__PURE__ */ jsx5("span", {
+          className: "c-action-menu-dot"
+        }),
+        /* @__PURE__ */ jsx5("span", {
+          className: "c-action-menu-dot"
+        })
+      ]
+    })
+  });
+}
+ActionMenu.Item = Item2;
+
+// src/avatar/avatar.tsx
+import { forwardRef } from "react";
+import { cva } from "class-variance-authority";
+
+// src/avatar/get-initials.ts
+var getInitials = (name) => {
+  const [first, second] = name.split(" ");
+  const initials = `${first?.charAt(0) ?? ""}${second?.charAt(0) ?? ""}`;
+  return initials.toUpperCase();
+};
+
+// src/avatar/avatar.tsx
+import { jsx as jsx6 } from "react/jsx-runtime";
+var avatarClassName = cva(["c-avatar"], {
+  variants: {
+    size: {
+      md: "c-avatar-md",
+      lg: "c-avatar-lg",
+      xl: "c-avatar-xl",
+      "2xl": "c-avatar-2xl"
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+var Avatar = forwardRef(({ name, size, className, ...delegated }, ref) => {
+  return /* @__PURE__ */ jsx6("div", {
+    ref,
+    ...delegated,
+    title: name,
+    className: avatarClassName({ size, className }),
+    children: /* @__PURE__ */ jsx6("span", {
+      className: "c-avatar-initials",
+      children: getInitials(name)
+    })
+  });
+});
+Avatar.displayName = "Avatar";
+
+// src/button/button.tsx
+import { forwardRef as forwardRef3 } from "react";
+import { cva as cva2 } from "class-variance-authority";
+
+// src/spinner/index.tsx
+import { cx as cx3 } from "class-variance-authority";
+import { forwardRef as forwardRef2 } from "react";
+import { jsx as jsx7, jsxs as jsxs3 } from "react/jsx-runtime";
+var realSize = 40;
+var Spinner = forwardRef2(
+  ({ children, className, color = "currentColor", size = 30, strokeSize, ...delegated }, ref) => {
+    const viewSize = size || realSize;
+    const sizeHalf = realSize / 2;
+    return /* @__PURE__ */ jsxs3("div", {
+      ref,
+      className: cx3("c-spinner", className),
+      "data-testid": "loading-spinner",
+      ...delegated,
+      children: [
+        /* @__PURE__ */ jsx7("svg", {
+          viewBox: `0 0 ${realSize} ${realSize}`,
+          x: "0px",
+          y: "0px",
+          style: { width: viewSize, height: viewSize },
+          children: /* @__PURE__ */ jsx7("circle", {
+            cx: "20",
+            cy: "20",
+            r: "18",
+            style: {
+              stroke: color,
+              strokeWidth: strokeSize ? strokeSize : viewSize / 10,
+              strokeLinecap: "round",
+              strokeDasharray: size < 16 ? size * 6 : size * 3.5,
+              transformOrigin: `${sizeHalf}px ${sizeHalf}px 0`
+            },
+            className: "c-spinner-artifact"
+          })
+        }),
+        children && /* @__PURE__ */ jsx7("span", {
+          className: "c-spinner-children",
+          style: { fontSize: size ? `${size * 0.75}px` : "1em" },
+          children
+        })
+      ]
+    });
+  }
+);
+Spinner.displayName = "Spinner";
+
+// src/button/button.tsx
+import { jsx as jsx8, jsxs as jsxs4 } from "react/jsx-runtime";
+var buttonTokens = {
+  variant: {
+    default: "c-btn",
+    elevate: "c-btn-elevate"
+  },
+  intent: {
+    default: "c-btn",
+    action: "c-btn-action",
+    danger: "c-btn-danger"
+  },
+  size: {
+    xs: "c-btn-xs",
+    sm: "c-btn-sm",
+    md: "c-btn-md",
+    lg: "c-btn-lg"
+  }
+};
+var buttonStyles = cva2("c-btn", {
+  variants: {
+    intent: {
+      default: "",
+      action: "",
+      danger: ""
+    },
+    variant: {
+      default: "",
+      elevate: ""
+    },
+    status: {
+      loading: "c-btn-loading"
+    },
+    size: {
+      xs: "c-btn-xs",
+      sm: "c-btn-sm",
+      md: "c-btn-md",
+      lg: "c-btn-lg"
+    }
+  },
+  compoundVariants: [
+    {
+      intent: "default",
+      variant: "elevate",
+      class: "c-btn-elevate"
+    },
+    {
+      intent: "action",
+      variant: "default",
+      class: "c-btn-action"
+    },
+    {
+      intent: "danger",
+      variant: "default",
+      class: "c-btn-danger"
+    },
+    {
+      intent: "danger",
+      variant: "elevate",
+      class: "c-btn-danger c-btn-elevate"
+    }
+  ],
+  defaultVariants: {
+    intent: "default",
+    variant: "default",
+    size: "sm"
+  }
+});
+var spinnerSizeMap = {
+  xs: 10,
+  sm: 12,
+  md: 14,
+  lg: 16
+};
+var Button = forwardRef3(
+  ({
+    children,
+    className,
+    type = "button",
+    as: El = "button",
+    size,
+    variant,
+    intent,
+    prepend,
+    append,
+    status,
+    ...delegated
+  }, ref) => {
+    let isAnchor = false;
+    if ("to" in delegated || "href" in delegated) {
+      isAnchor = true;
+    }
+    return /* @__PURE__ */ jsxs4(El, {
+      ref,
+      type: isAnchor ? void 0 : type,
+      className: buttonStyles({ size, variant, intent, status, className }),
+      ...delegated,
+      children: [
+        !prepend ? null : /* @__PURE__ */ jsx8("span", {
+          className: "c-btn__prepend",
+          children: prepend
+        }),
+        children,
+        status !== "loading" ? null : /* @__PURE__ */ jsx8("span", {
+          className: "c-btn__loading-spinner",
+          children: /* @__PURE__ */ jsx8(Spinner, {
+            size: size ? spinnerSizeMap[size] : spinnerSizeMap.md
+          })
+        }),
+        !append ? null : /* @__PURE__ */ jsx8("span", {
+          className: "c-btn__append",
+          children: append
+        })
+      ]
+    });
+  }
+);
+Button.displayName = "Button";
+
+// src/card/card.tsx
+import { cva as cva3 } from "class-variance-authority";
+import { jsx as jsx9 } from "react/jsx-runtime";
+var cardStyles = cva3("c-card", {
+  variants: {
+    variant: {
+      default: "c-card",
+      elevate: "c-card-elevate"
+    }
+  },
+  defaultVariants: {
+    variant: "default"
+  }
+});
+function Card({ children, className, variant, ...delegated }) {
+  return /* @__PURE__ */ jsx9("section", {
+    className: cardStyles({ variant, className }),
+    ...delegated,
+    children
+  });
+}
+
+// src/card/index.ts
+var cardToken = "c-card";
+
+// src/checkbox/checkbox.tsx
+import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
+import { forwardRef as forwardRef4 } from "react";
+import { jsx as jsx10, jsxs as jsxs5 } from "react/jsx-runtime";
+var Checkbox = forwardRef4((props, ref) => {
+  return /* @__PURE__ */ jsx10(CheckboxPrimitive.Root, {
+    ...props,
+    ref,
+    className: "c-checkbox",
+    children: /* @__PURE__ */ jsx10(CheckboxPrimitive.Indicator, {
+      children: /* @__PURE__ */ jsxs5("svg", {
+        viewBox: "0 0 9 9",
+        fill: "none",
+        className: "c-checkbox__svg",
+        children: [
+          /* @__PURE__ */ jsx10("path", {
+            className: "c-checkbox__svg-p1",
+            d: "M1.12 5.51a.559.559 0 01.832-.101l2.201 1.953-.427.624a.326.326 0 01-.486.06L1.21 6.245a.559.559 0 01-.09-.734z"
+          }),
+          /* @__PURE__ */ jsx10("path", {
+            className: "c-checkbox__svg-p2",
+            d: "M7.883 1.087c.043.03.053.09.023.132L3.669 7.132l-.154-.105L7.754 1.11a.093.093 0 01.129-.023z"
+          })
+        ]
+      })
+    })
+  });
+});
+Checkbox.displayName = "Checkbox";
+
+// src/dialog/destroyFns.ts
+var destroyFns = [];
+
+// src/dialog/dialog.tsx
+import * as DialogPrimitive from "@radix-ui/react-dialog";
+import { cva as cva4, cx as cx4 } from "class-variance-authority";
+
+// src/iconography/arrow.tsx
+import { forwardRef as forwardRef5 } from "react";
+import { jsx as jsx11 } from "react/jsx-runtime";
+var Arrow = forwardRef5((delegated, ref) => {
+  return /* @__PURE__ */ jsx11("svg", {
     ref,
     width: "10",
     height: "10",
     viewBox: "0 0 10 10",
     fill: "currentColor",
     ...delegated,
-    children: /* @__PURE__ */ jsx4("path", {
+    children: /* @__PURE__ */ jsx11("path", {
       d: "M4.14995 9.85C4.24341 9.94161 4.36907 9.99293 4.49995 9.99293C4.63083 9.99293 4.75649 9.94161 4.84995 9.85L8.03995 6.67C8.09195 6.6248 8.13404 6.56934 8.16359 6.5071C8.19314 6.44486 8.20951 6.37719 8.21167 6.30832C8.21383 6.23946 8.20173 6.17089 8.17614 6.10693C8.15055 6.04296 8.11201 5.98497 8.06295 5.9366C8.01389 5.88823 7.95536 5.85052 7.89104 5.82584C7.82671 5.80116 7.75798 5.79003 7.68915 5.79317C7.62033 5.79631 7.55289 5.81363 7.49108 5.84406C7.42927 5.87449 7.37441 5.91737 7.32995 5.97L4.49995 8.78L1.66995 5.96C1.62475 5.908 1.56929 5.86591 1.50705 5.83636C1.44481 5.80681 1.37714 5.79044 1.30827 5.78828C1.23941 5.78612 1.17084 5.79822 1.10688 5.82381C1.04291 5.8494 0.98492 5.88794 0.936549 5.937C0.888179 5.98606 0.850469 6.04459 0.825787 6.10892C0.801105 6.17324 0.789983 6.24197 0.79312 6.3108C0.796256 6.37962 0.813582 6.44706 0.844012 6.50887C0.874442 6.57068 0.917318 6.62554 0.96995 6.67L4.14995 9.85ZM4.49995 -2.18557e-08C4.22381 -3.39261e-08 3.99995 0.223858 3.99995 0.5L3.99995 9.5L4.99995 9.5L4.99995 0.5C4.99995 0.223857 4.77609 -9.78527e-09 4.49995 -2.18557e-08Z"
     })
   });
 });
 Arrow.displayName = "ArrowIcon";
 
-// src/icons/cancel.tsx
-import { forwardRef as forwardRef2 } from "react";
-import { jsx as jsx5 } from "react/jsx-runtime";
-var Cancel = forwardRef2((delegated, ref) => {
-  return /* @__PURE__ */ jsx5("svg", {
+// src/iconography/atom.tsx
+import { forwardRef as forwardRef6 } from "react";
+import { jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
+var Atom = forwardRef6((delegated, ref) => {
+  return /* @__PURE__ */ jsxs6("svg", {
+    ref,
+    width: "24",
+    height: "27",
+    viewBox: "0 0 24 27",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    ...delegated,
+    children: [
+      /* @__PURE__ */ jsx12("path", {
+        fill: "#528693",
+        d: "M18.068 3.103c.935 0 .938-1.5 0-1.5s-.938 1.5 0 1.5ZM5.911 2.928c.641 0 .643-1.027 0-1.027-.642 0-.643 1.027 0 1.027ZM4.294 8.862c.577 0 .578-.925 0-.925s-.578.925 0 .925ZM6.03 23.058a.39.39 0 0 0 .265-.126.413.413 0 0 0 0-.558.39.39 0 0 0-.264-.126.39.39 0 0 0-.264.126.413.413 0 0 0 0 .558.39.39 0 0 0 .264.126ZM16.93 23.13c.674 0 .675-1.078 0-1.078s-.675 1.078 0 1.078ZM18.966 17.685c.885 0 .887-1.418 0-1.418-.886 0-.886 1.418 0 1.418ZM11.6 23.619a.217.217 0 0 0 .15-.069.23.23 0 0 0 0-.315.216.216 0 0 0-.15-.068.216.216 0 0 0-.15.068.23.23 0 0 0 0 .315c.039.042.093.067.15.069ZM22.291 13.446l.043.031a.903.903 0 0 0 1.263-.344.972.972 0 0 0 0-.952.936.936 0 0 0-.34-.348.902.902 0 0 0-.924.004l-.042.03a.905.905 0 0 0-.319.33.937.937 0 0 0 0 .922c.077.136.187.25.319.329v-.002ZM11.496 26.097c3.17 0 5.738-.359 5.738-.8 0-.443-2.569-.802-5.738-.802-3.17 0-5.738.359-5.738.801 0 .442 2.569.8 5.738.8Z",
+        opacity: ".05"
+      }),
+      /* @__PURE__ */ jsx12("path", {
+        fill: "#FF99DB",
+        d: "M11.496 16.417c1.95 0 3.531-1.629 3.531-3.638 0-2.01-1.581-3.638-3.531-3.638-1.95 0-3.531 1.629-3.531 3.638 0 2.01 1.58 3.638 3.53 3.638Z"
+      }),
+      /* @__PURE__ */ jsx12("path", {
+        fill: "#528693",
+        d: "M8.252 12.78c0-.689.207-1.36.591-1.923.385-.563.929-.99 1.557-1.222a3.153 3.153 0 0 1 1.956-.076 3.236 3.236 0 0 1 1.642 1.096 3.424 3.424 0 0 1 .285 3.834 3.278 3.278 0 0 1-1.46 1.341 3.156 3.156 0 0 1-1.945.232A3.259 3.259 0 0 1 9 14.9a3.437 3.437 0 0 1-.748-2.122.3.3 0 0 0-.088-.202.283.283 0 0 0-.398 0 .3.3 0 0 0-.088.202c0 .81.243 1.602.695 2.265a3.834 3.834 0 0 0 1.834 1.439c.74.273 1.545.305 2.304.09a3.81 3.81 0 0 0 1.934-1.293 4.03 4.03 0 0 0 .33-4.516 3.859 3.859 0 0 0-1.723-1.577 3.715 3.715 0 0 0-2.29-.268 3.85 3.85 0 0 0-2.203 1.37 4.059 4.059 0 0 0-.881 2.49.3.3 0 0 0 .088.202.283.283 0 0 0 .398 0 .3.3 0 0 0 .088-.202Z"
+      }),
+      /* @__PURE__ */ jsx12("path", {
+        fill: "#528693",
+        d: "M9.025 12.946a2.787 2.787 0 0 1 .78-1.91 2.626 2.626 0 0 1 1.854-.803.157.157 0 0 0 .113-.048.167.167 0 0 0 0-.232.157.157 0 0 0-.113-.048c-.783 0-1.533.32-2.087.891a3.093 3.093 0 0 0-.866 2.15c0 .044.017.086.047.116a.157.157 0 0 0 .225 0 .167.167 0 0 0 .047-.116ZM8.972 13.854c.033 0 .066-.01.094-.029a.17.17 0 0 0 .062-.079.137.137 0 0 0 .014-.068l-.006-.046a.176.176 0 0 0-.044-.078l-.034-.027a.167.167 0 0 0-.086-.025.174.174 0 0 0-.12.053.183.183 0 0 0-.05.123l.005.046c.008.03.024.056.044.078l.035.028a.166.166 0 0 0 .086.023v.001ZM12.136 10.204v.004a.112.112 0 0 0 .026.051c.01.016.024.03.04.039l.036.015a.145.145 0 0 0 .077 0l.034-.015a.112.112 0 0 0 .041-.039.076.076 0 0 0 .019-.033.118.118 0 0 0 .012-.057l-.005-.04-.014-.035a.113.113 0 0 0-.038-.042.107.107 0 0 0-.05-.027.109.109 0 0 0-.057-.003.104.104 0 0 0-.054.018l-.03.024a.148.148 0 0 0-.037.065v.004a.136.136 0 0 0 0 .07Z"
+      }),
+      /* @__PURE__ */ jsx12("path", {
+        fill: "#528693",
+        d: "M6.023 12.779a23.383 23.383 0 0 1 1.024-7.096c.517-1.608 1.283-3.336 2.601-4.417.989-.81 2.233-.962 3.322-.27 1.369.87 2.196 2.529 2.747 4.027a21.916 21.916 0 0 1 1.234 6.778 24.482 24.482 0 0 1-.779 7.302c-.471 1.725-1.178 3.543-2.437 4.827-.881.898-2.097 1.4-3.294.86-1.407-.632-2.294-2.18-2.89-3.56-.883-2.039-1.303-4.3-1.46-6.515a27.856 27.856 0 0 1-.068-1.936.278.278 0 0 0-.082-.187.262.262 0 0 0-.369 0 .278.278 0 0 0-.081.187c.004 2.518.314 5.078 1.117 7.465.567 1.685 1.403 3.46 2.818 4.559a3.229 3.229 0 0 0 3.73.283c1.471-.883 2.37-2.582 2.98-4.158.88-2.267 1.261-4.74 1.347-7.17a24.885 24.885 0 0 0-.84-7.606c-.509-1.799-1.28-3.699-2.628-5.008C12.998.158 11.617-.328 10.28.247 8.781.892 7.8 2.46 7.15 3.92c-.951 2.138-1.408 4.494-1.582 6.829-.05.675-.074 1.352-.075 2.03.002.07.032.138.081.187a.262.262 0 0 0 .369 0 .278.278 0 0 0 .081-.187Z"
+      }),
+      /* @__PURE__ */ jsx12("path", {
+        fill: "#528693",
+        d: "M8.64 7.969c2.066-1.293 4.315-2.336 6.686-2.86 1.61-.357 3.548-.57 5.086.197.576.27 1.048.73 1.34 1.309.24.543.327 1.145.25 1.737-.164 1.605-1.1 3.108-2.06 4.333a21.318 21.318 0 0 1-4.85 4.42 22.562 22.562 0 0 1-6.661 3.155c-1.718.468-3.69.777-5.416.176-1.207-.422-2.038-1.42-2.049-2.758-.012-1.547.808-3.03 1.665-4.243a19.773 19.773 0 0 1 4.556-4.482c.474-.345.958-.673 1.454-.984.29-.184.024-.657-.269-.473a22.835 22.835 0 0 0-5.39 4.61C1.87 13.438.81 15.035.512 16.801c-.235 1.395.136 2.779 1.293 3.62 1.41 1.023 3.364.982 4.994.743 2.442-.36 4.8-1.342 6.944-2.575a23.78 23.78 0 0 0 5.757-4.55c1.223-1.345 2.372-2.932 2.86-4.732.359-1.328.254-2.821-.758-3.823-1.204-1.192-3.091-1.326-4.666-1.182-2.378.218-4.688 1.076-6.806 2.183-.599.313-1.183.651-1.757 1.01-.293.183-.026.657.268.473Z"
+      }),
+      /* @__PURE__ */ jsx12("path", {
+        fill: "#528693",
+        d: "M14.62 7.496c-2.17-1.357-4.551-2.454-7.05-2.966-1.725-.353-3.736-.512-5.352.35a3.343 3.343 0 0 0-1.39 1.404 3.481 3.481 0 0 0-.38 1.967c.135 1.715 1.061 3.29 2.067 4.615a21.487 21.487 0 0 0 5.078 4.687 22.835 22.835 0 0 0 7.03 3.29c1.783.463 3.854.752 5.624.074 1.321-.507 2.24-1.618 2.306-3.095.074-1.64-.756-3.25-1.652-4.546-1.285-1.86-2.956-3.421-4.755-4.742a24.734 24.734 0 0 0-1.526-1.037c-.293-.185-.56.289-.269.473a22.565 22.565 0 0 1 5.134 4.347c1.078 1.26 2.095 2.754 2.443 4.424.258 1.237-.018 2.535-1.092 3.266-1.361.927-3.228.846-4.768.588-2.321-.389-4.55-1.322-6.593-2.502a23.435 23.435 0 0 1-5.472-4.295c-1.187-1.278-2.314-2.784-2.819-4.501-.351-1.197-.326-2.555.618-3.46C2.94 4.75 4.755 4.716 6.204 4.867c2.261.235 4.469 1.078 6.48 2.139.567.3 1.123.623 1.668.964.06.032.131.04.197.02a.267.267 0 0 0 .155-.126.282.282 0 0 0-.084-.367Z"
+      }),
+      /* @__PURE__ */ jsx12("path", {
+        fill: "#fff",
+        d: "M11.963 14.285h.003c.2-.04.384-.14.53-.287.175-.111.317-.27.41-.46l.159-.388c.065-.21.075-.434.028-.649a1.234 1.234 0 0 0-.188-.604l-.246-.329-.32-.254a1.152 1.152 0 0 0-.585-.193 1.164 1.164 0 0 0-.63.03l-.377.163c-.343.228-.6.571-.725.971l-.056.433c-.01.217.037.433.136.626.036.136.106.26.203.359.11.176.263.32.442.418l.377.164c.275.078.564.078.84 0h-.001Z"
+      }),
+      /* @__PURE__ */ jsx12("path", {
+        fill: "#FF99DB",
+        d: "m11.172 13.1.017.019.105.083c.057.038.124.06.192.063a.253.253 0 0 0 .138 0 .379.379 0 0 0 .191-.063l.105-.083.08-.108a.403.403 0 0 0 .062-.199.414.414 0 0 0-.009-.212l-.002-.026a.548.548 0 0 0-.135-.24.524.524 0 0 0-.232-.139l-.14-.019a.513.513 0 0 0-.265.074.605.605 0 0 0-.243.324.562.562 0 0 0 .136.527Z"
+      })
+    ]
+  });
+});
+Atom.displayName = "AtomIcon";
+
+// src/iconography/cancel.tsx
+import { forwardRef as forwardRef7 } from "react";
+import { jsx as jsx13 } from "react/jsx-runtime";
+var Cancel = forwardRef7((delegated, ref) => {
+  return /* @__PURE__ */ jsx13("svg", {
     ref,
     width: "34",
     height: "34",
@@ -88,7 +445,7 @@ var Cancel = forwardRef2((delegated, ref) => {
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
     ...delegated,
-    children: /* @__PURE__ */ jsx5("path", {
+    children: /* @__PURE__ */ jsx13("path", {
       d: "m27.4301 24.4325-.1299.1299c-.17.15-.6497.5798-1.1695 1.0595l-1.7392 1.5993-.1499.05a.2783.2783 0 0 1-.2299-.14l-3.6183-3.7182-2.6088-2.6388a1.0488 1.0488 0 0 0-.7926-.3838 1.006 1.006 0 0 0-.7096.2899l-5.6474 5.6773-.7696.7496-.07.18h-.2599l-2.6987-2.7088a.3813.3813 0 0 1-.18-.2598l.02-.14 5.6674-5.6173 1.2394-1.2395a.2995.2995 0 0 0 .1-.2398.2903.2903 0 0 0-.1-.2299l-1.8591-1.8692-2.8487-2.8786-1.5692-1.5992-.6197-.6597-.1-.09v-.12a.3689.3689 0 0 1 .12-.2398l2.7786-2.6588.11-.09h.14l.1099.06 5.7273 5.9272.8696.8796a.6998.6998 0 0 0 .9995 0l5.9672-6.0071.1799-.18a4.5467 4.5467 0 0 1 .5597-.5197.5585.5585 0 0 1 .19-.1c.1099 0 .2099.13.2998.22l.08.0899 2.039 2.109s.1899.2.2299.2499a.864.864 0 0 0 .1399.13.7704.7704 0 0 1 .13.1199c.0899.1499 0 .2598-.1799.4298l-6.1172 6.0871a1.3994 1.3994 0 0 0-.5197.7696.9287.9287 0 0 0 .2899.7997l3.0185 2.9786 3.4284 3.1785a2.001 2.001 0 0 1 .1999.2398.2564.2564 0 0 1 .0853.1524.2564.2564 0 0 1-.0323.1715Z",
       fill: "currentColor"
     })
@@ -96,87 +453,232 @@ var Cancel = forwardRef2((delegated, ref) => {
 });
 Cancel.displayName = "CancelIcon";
 
-// src/icons/dots.tsx
-import { forwardRef as forwardRef3 } from "react";
-import { jsx as jsx6, jsxs as jsxs2 } from "react/jsx-runtime";
-var Dots = forwardRef3((delegated, ref) => {
-  return /* @__PURE__ */ jsxs2("svg", {
+// src/iconography/copy.tsx
+import { forwardRef as forwardRef8 } from "react";
+import { jsx as jsx14, jsxs as jsxs7 } from "react/jsx-runtime";
+var Copy = forwardRef8((delegated, ref) => {
+  return /* @__PURE__ */ jsxs7("svg", {
     ref,
-    width: "20",
-    height: "20",
-    viewBox: "0 0 20 20",
+    width: "14",
+    height: "16",
+    viewBox: "0 0 14 16",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
     ...delegated,
     children: [
-      /* @__PURE__ */ jsx6("circle", {
-        cx: "10",
-        cy: "5",
-        r: "1.7857",
-        fill: "#9095A8"
-      }),
-      /* @__PURE__ */ jsx6("circle", {
-        cx: "10",
-        cy: "10",
-        r: "1.7857",
-        fill: "#9095A8"
-      }),
-      /* @__PURE__ */ jsx6("circle", {
-        cx: "10",
-        cy: "15",
-        r: "1.7857",
-        fill: "#9095A8"
+      /* @__PURE__ */ jsx14("rect", {
+        x: ".5",
+        y: "3.5",
+        width: "9",
+        height: "12",
+        rx: "2.5",
+        fill: "#EAEBEE",
+        stroke: "#80878D",
+        strokeDasharray: "3 2"
+      }),
+      /* @__PURE__ */ jsx14("rect", {
+        x: "4.5",
+        y: ".5",
+        width: "9",
+        height: "12",
+        rx: "2.5",
+        fill: "#EAEBEE",
+        stroke: "#80878D"
       })
     ]
   });
 });
-Dots.displayName = "DotsIcon";
+Copy.displayName = "CopyIcon";
 
-// src/icons/error.tsx
-import { forwardRef as forwardRef4 } from "react";
-import { jsx as jsx7, jsxs as jsxs3 } from "react/jsx-runtime";
-var Error = forwardRef4((delegated, ref) => {
-  return /* @__PURE__ */ jsxs3("svg", {
+// src/iconography/crystal.tsx
+import { forwardRef as forwardRef9 } from "react";
+import { jsx as jsx15, jsxs as jsxs8 } from "react/jsx-runtime";
+var Crystal = forwardRef9((delegated, ref) => {
+  return /* @__PURE__ */ jsxs8("svg", {
     ref,
-    xmlns: "http://www.w3.org/2000/svg",
-    width: "22",
-    height: "22",
+    width: "27",
+    height: "27",
+    viewBox: "0 0 27 27",
     fill: "none",
-    viewBox: "0 0 22 22",
+    xmlns: "http://www.w3.org/2000/svg",
     ...delegated,
     children: [
-      /* @__PURE__ */ jsx7("path", {
-        fill: "#DD1367",
-        d: "M20.83 11c0 5.43-4.4 9.83-9.83 9.83S1.17 16.43 1.17 11 5.57 1.17 11 1.17s9.83 4.4 9.83 9.83Z"
+      /* @__PURE__ */ jsx15("path", {
+        fill: "#528693",
+        d: "M13.945 26.805c3.479 0 6.299-.386 6.299-.861 0-.476-2.82-.861-6.299-.861-3.478 0-6.298.385-6.298.86 0 .476 2.82.862 6.298.862ZM25.356 5.894l-2.998-2.938-1.98 4.77 4.978-1.832ZM26.995 14.579l-.341-3.357-3.644 1.896 3.985 1.46ZM.896 14.579l.341-3.357 3.643 1.896-3.984 1.46ZM2.563 5.894l2.999-2.938 1.98 4.77-4.979-1.832Z",
+        opacity: ".15"
+      }),
+      /* @__PURE__ */ jsx15("path", {
+        fill: "#AEF9F6",
+        d: "m23.267 13.32-1.348-.562-1.444-6.409 2.792 6.971Z"
+      }),
+      /* @__PURE__ */ jsx15("path", {
+        fill: "#fff",
+        d: "M20.475 6.35 15.51 10.6l-1.412-.367 6.378-3.884Z"
+      }),
+      /* @__PURE__ */ jsx15("path", {
+        fill: "#fff",
+        d: "m14.732 23.732-.635-13.5 1.412.368.217.181-.994 12.951Z"
+      }),
+      /* @__PURE__ */ jsx15("path", {
+        fill: "#AEF9F6",
+        d: "m23.267 13.32-8.535 10.412 6.63-10.123.557-.85 1.348.56ZM21.92 12.758 15.51 10.6l4.965-4.25 1.444 6.408Z"
       }),
-      /* @__PURE__ */ jsx7("path", {
+      /* @__PURE__ */ jsx15("path", {
+        fill: "#AEF9F6",
+        d: "m15.51 10.6 6.41 2.158-.558.85-6.63 10.124.777-13.132Z"
+      }),
+      /* @__PURE__ */ jsx15("path", {
         fill: "#528693",
-        fillRule: "evenodd",
-        d: "M21.431 11c0 5.76-4.67 10.43-10.43 10.43C5.238 21.43.568 16.76.568 11S5.24.57 11 .57C16.76.57 21.431 5.24 21.431 11Zm-10.43 9.83c5.429 0 9.83-4.4 9.83-9.83s-4.401-9.83-9.83-9.83c-5.43 0-9.832 4.4-9.832 9.83S5.571 20.83 11 20.83Z",
-        clipRule: "evenodd"
+        d: "m20.358 6.113-5.596 3.406-.782.476a.263.263 0 0 0-.145.223l.216 4.584.34 7.25.079 1.666a.27.27 0 0 0 .18.259.262.262 0 0 0 .3-.098l2.898-3.535 4.584-5.592 1.054-1.285a.267.267 0 0 0 .017-.266l-2.45-6.114-.343-.855c-.127-.316-.596-.078-.47.237l2.45 6.115.343.854.017-.266-2.898 3.535-4.584 5.592-1.054 1.285.48.162-.216-4.584-.341-7.25-.078-1.666-.145.223 5.596-3.406.782-.477c.288-.174.056-.65-.234-.473Z"
+      }),
+      /* @__PURE__ */ jsx15("path", {
+        fill: "#528693",
+        d: "M23.309 13.194c-.47-.196-.935-.417-1.416-.584-.556-.193-1.117-.376-1.675-.564l-4.498-1.514c-.517-.174-1.055-.288-1.582-.426-.162-.042-.246.209-.083.251.492.129.997.234 1.48.392.56.183 1.116.375 1.675.564l4.499 1.514c.516.174 1.014.409 1.517.618.156.065.239-.186.083-.251Z"
       }),
-      /* @__PURE__ */ jsx7("path", {
+      /* @__PURE__ */ jsx15("path", {
+        fill: "#528693",
+        d: "m14.863 23.739.16-2.712.327-5.509.258-4.366.027-.449c0-.013.014-.078.005-.089.043.052-.1.109-.006.054.164-.119.319-.25.462-.395l.857-.735 3.537-3.027.073-.062-.216-.072.905 4.012.48 2.13c.01.076.026.15.05.222.042.093-.023-.039.025-.05-.04.01-.128.196-.15.228l-2.166 3.307-3.055 4.663-1.18 1.8c-.2.308-.42.61-.606.928l-.027.041a.134.134 0 0 0 .038.18.13.13 0 0 0 .18-.032l1.504-2.297 3.03-4.626 2.375-3.626c.1-.151.316-.37.29-.562-.08-.56-.254-1.124-.378-1.676l-1.037-4.603-.021-.093a.135.135 0 0 0-.088-.098.131.131 0 0 0-.128.025l-3.14 2.689-1.64 1.403c-.084.072-.203.141-.23.254a1.507 1.507 0 0 0-.014.245l-.232 3.907-.333 5.624-.13 2.194c-.022.368-.062.74-.065 1.11l-.003.049a.13.13 0 0 0 .262.014Z"
+      }),
+      /* @__PURE__ */ jsx15("path", {
         fill: "#fff",
-        fillRule: "evenodd",
-        d: "m7.364 13.479 1.157 1.157L11 12.158l2.479 2.478 1.157-1.157L12.158 11l2.478-2.479-1.157-1.157-2.48 2.478-2.478-2.478L7.364 8.52 9.842 11l-2.478 2.479Z",
-        clipRule: "evenodd"
+        d: "M20.692 13.37c-.28.417-.553.837-.83 1.257-.456.693-.91 1.387-1.36 2.083-.497.767-.99 1.537-1.485 2.306-.409.635-.815 1.27-1.22 1.908-.194.303-.4.602-.583.912l-.008.013a.145.145 0 0 0 .041.195.14.14 0 0 0 .195-.035l.474-.746 1.162-1.83a928.57 928.57 0 0 0 2.815-4.46c.296-.47.59-.942.894-1.407l.06-.091a.095.095 0 0 0-.027-.128.093.093 0 0 0-.128.023ZM20.92 13.108l.005.006c.08.104.22-.012.178-.12l-.002-.006c-.041-.105-.196-.068-.215.03a.117.117 0 0 0 .057.12.114.114 0 0 0 .13-.011l.005-.003c.102-.081-.012-.222-.12-.18l-.005.003a.105.105 0 0 0-.054.073.108.108 0 0 0 .022.088ZM21.084 11.8l-.002-.028c.003.036-.003-.016-.005-.032l-.008-.05a56.027 56.027 0 0 0-.237-1.25c-.147-.724-.297-1.448-.449-2.17l-.107-.496a.123.123 0 0 0-.223-.041.126.126 0 0 0-.018.092c.093.45.182.903.275 1.354.148.724.296 1.448.461 2.168.028.12.055.239.085.358l.025.098c.014.052-.006-.01.01.027l.002.01a.097.097 0 0 0 .175.032.1.1 0 0 0 .016-.073Z"
+      }),
+      /* @__PURE__ */ jsx15("path", {
+        fill: "#fff",
+        d: "m22.606 13.365-1.138 1.425a4396.042 4396.042 0 0 0-2.227 2.793c-.031.04.034.083.065.044l1.133-1.429 1.803-2.277.413-.522c.025-.03-.026-.064-.05-.034h.001ZM22.54 12.58c-.21-.569-.417-1.138-.638-1.703-.018-.047-.088-.011-.07.035.219.565.436 1.13.653 1.695.014.037.068.009.054-.028Z",
+        opacity: ".25"
+      }),
+      /* @__PURE__ */ jsx15("path", {
+        fill: "#fff",
+        d: "M16.367 11.99a.23.23 0 0 0 .286-.152.237.237 0 0 0-.139-.294.23.23 0 0 0-.173.017.235.235 0 0 0-.102.31.233.233 0 0 0 .128.118ZM16.051 12.237l-.007.01a.16.16 0 0 0-.01.16l.022.033a.154.154 0 0 0 .069.046.156.156 0 0 0 .181-.063.162.162 0 0 0 .026-.08v-.012l-.003-.04a.114.114 0 0 0-.024-.054.077.077 0 0 0-.026-.03.117.117 0 0 0-.052-.031l-.04-.008-.04.003a.172.172 0 0 0-.095.066h-.001ZM16.749 10.5a.084.084 0 0 0 .107-.053.085.085 0 0 0-.118-.104.085.085 0 0 0-.038.115c.01.02.027.035.049.043ZM16.417 10.402a.085.085 0 0 0 .104-.055.087.087 0 0 0-.05-.108.084.084 0 0 0-.105.056.086.086 0 0 0 .05.107ZM16.69 10.169a.075.075 0 0 0 .092-.05.076.076 0 0 0-.045-.096.075.075 0 0 0-.092.05.077.077 0 0 0 .044.096ZM16.043 13.249l.011.004a.087.087 0 0 0 .108-.055l.004-.022a.088.088 0 0 0-.008-.043l-.013-.019a.085.085 0 0 0-.037-.025l-.012-.004a.061.061 0 0 0-.033-.003.061.061 0 0 0-.031.008.096.096 0 0 0-.043.05l-.004.022c0 .015.002.03.009.043l.012.018c.01.011.023.02.037.025v.001Z"
+      }),
+      /* @__PURE__ */ jsx15("path", {
+        fill: "#AEF9F6",
+        d: "m18.609 12.145-1.93.258L9.838 1.35l8.771 10.795Z"
+      }),
+      /* @__PURE__ */ jsx15("path", {
+        fill: "#fff",
+        d: "M9.837 1.35 7.842 14.228l-1.875.527L9.837 1.35Z"
+      }),
+      /* @__PURE__ */ jsx15("path", {
+        fill: "#fff",
+        d: "m14.69 25.314-8.723-10.56 1.875-.527.37.063 6.479 11.024Z"
+      }),
+      /* @__PURE__ */ jsx15("path", {
+        fill: "#AEF9F6",
+        d: "m18.609 12.144-3.918 13.17 1.906-11.552.082-1.359 1.93-.259ZM16.679 12.403l-8.837 1.824L9.837 1.35l6.842 11.053Z"
+      }),
+      /* @__PURE__ */ jsx15("path", {
+        fill: "#AEF9F6",
+        d: "m7.842 14.227 8.837-1.824-.082 1.36-1.906 11.551-6.849-11.087Z"
+      }),
+      /* @__PURE__ */ jsx15("path", {
+        fill: "#528693",
+        d: "M9.506 1.238 8.196 5.77l-2.085 7.22c-.156.54-.33 1.078-.469 1.623-.097.385.45.842.669 1.107l4.482 5.424c1.191 1.443 2.35 2.922 3.578 4.333l.06.072a.352.352 0 0 0 .592-.122l1.357-4.561 2.123-7.138c.144-.483.333-.973.437-1.467.05-.24-.08-.367-.213-.531l-.551-.678-4.5-5.536c-1.172-1.442-2.31-2.92-3.52-4.33-.02-.023-.038-.047-.057-.071-.286-.352-.808.12-.522.472l2.967 3.65 4.725 5.814 1.08 1.327-.072-.35-1.324 4.454-2.11 7.094-.483 1.624.592-.122-2.95-3.571-4.7-5.69-1.075-1.301.071.35 1.31-4.535 2.085-7.22.476-1.647c.126-.437-.537-.665-.663-.227Z"
+      }),
+      /* @__PURE__ */ jsx15("path", {
+        fill: "#528693",
+        d: "M18.574 11.97c-.673.091-1.357.148-2.023.28-.77.152-1.539.317-2.31.476l-6.2 1.28c-.713.147-1.41.377-2.11.573-.215.06-.147.407.07.347.654-.184 1.306-.402 1.97-.545.767-.165 1.539-.318 2.309-.477l6.202-1.28c.712-.146 1.442-.21 2.163-.308.223-.03.152-.376-.07-.346h-.001Z"
+      }),
+      /* @__PURE__ */ jsx15("path", {
+        fill: "#528693",
+        d: "m14.847 25.234-2.316-3.75-3.669-5.938-.571-.925c-.063-.102-.172-.388-.278-.45-.048-.028-.015.075.007.047.023-.03.022-.141.028-.178l.125-.81 1.025-6.616.516-3.326.183-1.18a5.54 5.54 0 0 0 .102-.658.661.661 0 0 1 .013-.087l-.33.068 2.325 3.757 3.67 5.928.566.915c.053.085.174.39.269.434.037.017.024-.093-.012-.045-.026.035-.022.146-.029.188l-.126.823-1.021 6.632c-.265 1.714-.59 3.431-.794 5.154l-.014.087c-.034.225.316.247.35.024l.672-4.367 1.075-6.974.162-1.056c.037-.163.063-.328.076-.494a.473.473 0 0 0-.11-.264l-.415-.671-3.527-5.699c-.92-1.485-1.83-2.978-2.76-4.457l-.045-.074a.178.178 0 0 0-.19-.089.177.177 0 0 0-.141.157l-.678 4.375-1.08 6.966-.161 1.043a3.035 3.035 0 0 0-.074.477c.012.1.053.195.118.271l.423.685 3.529 5.713c.916 1.483 1.822 2.974 2.749 4.45l.046.075c.118.192.431.033.312-.16v-.001Z"
+      }),
+      /* @__PURE__ */ jsx15("path", {
+        fill: "#fff",
+        d: "M15.423 13.982c-.141 1.096-.303 2.19-.45 3.284-.181 1.338-.356 2.677-.524 4.016l-.203 1.605c-.03.245.348.27.378.026.137-1.095.271-2.19.402-3.287.16-1.34.32-2.679.465-4.02.058-.536.117-1.071.18-1.606.02-.161-.228-.176-.248-.017ZM15.594 13.639l.008.004c.128.06.26-.14.154-.235l-.004-.004a.153.153 0 0 0-.264.134.155.155 0 0 0 .14.124.152.152 0 0 0 .155-.105l.002-.005c.061-.13-.139-.262-.232-.155l-.007.007a.142.142 0 0 0 .048.234ZM15.557 11.79c-.302-.557-.644-1.096-.975-1.636L13.55 8.473a133.094 133.094 0 0 1-2.044-3.407A79.116 79.116 0 0 1 10.46 3.19a.165.165 0 0 0-.219-.067.168.168 0 0 0-.075.218c1.215 2.33 2.615 4.56 4.013 6.78.383.609.756 1.227 1.165 1.817.085.123.282-.018.213-.147Z"
+      }),
+      /* @__PURE__ */ jsx15("path", {
+        fill: "#fff",
+        d: "M17.647 12.679c-.275.877-.552 1.753-.82 2.633-.02.064.078.098.098.034.272-.879.534-1.76.8-2.641.014-.051-.062-.076-.077-.026ZM17.583 11.942c-.563-.726-1.121-1.452-1.688-2.173-.042-.053-.119.017-.078.07.565.722 1.136 1.439 1.705 2.158.033.041.093-.014.06-.055Z",
+        opacity: ".25"
+      }),
+      /* @__PURE__ */ jsx15("path", {
+        fill: "#fff",
+        d: "M9.753 15.255a.311.311 0 0 0 .23-.368.314.314 0 0 0-.354-.246.312.312 0 0 0-.23.367.314.314 0 0 0 .354.247ZM9.55 15.754l-.001.016a.214.214 0 0 0 .094.191l.048.024a.206.206 0 0 0 .11.007.232.232 0 0 0 .134-.09.212.212 0 0 0 .011-.215l-.008-.014-.03-.044a.152.152 0 0 0-.063-.046.104.104 0 0 0-.05-.017.155.155 0 0 0-.08-.002l-.053.019-.043.03a.232.232 0 0 0-.067.14H9.55ZM9.129 13.173a.113.113 0 0 0 .088-.135.112.112 0 0 0-.205-.04.115.115 0 0 0 .032.158.112.112 0 0 0 .085.017ZM8.68 13.283a.116.116 0 0 0 .037-.206.114.114 0 0 0-.083-.018.114.114 0 0 0-.084.134.115.115 0 0 0 .047.071.113.113 0 0 0 .082.02ZM8.84 12.83a.103.103 0 0 0 .033-.183.1.1 0 0 0-.073-.018.102.102 0 0 0-.074.12.102.102 0 0 0 .114.08ZM10.21 16.93l.016-.004a.116.116 0 0 0 .071-.05.119.119 0 0 0 .018-.085l-.01-.03a.115.115 0 0 0-.04-.043l-.026-.013a.111.111 0 0 0-.06-.004l-.015.003a.082.082 0 0 0-.041.019.084.084 0 0 0-.031.03.13.13 0 0 0-.017.086l.01.029a.115.115 0 0 0 .039.043l.026.013c.02.006.04.008.06.004v.002ZM10.731 17.922a.108.108 0 0 0 .084-.128.11.11 0 0 0-.046-.07.107.107 0 0 0-.15.031.11.11 0 0 0 .03.152.107.107 0 0 0 .082.015Z"
+      })
+    ]
+  });
+});
+Crystal.displayName = "CrystalIcon";
+
+// src/iconography/edit.tsx
+import { forwardRef as forwardRef10 } from "react";
+import { jsx as jsx16, jsxs as jsxs9 } from "react/jsx-runtime";
+var Edit = forwardRef10((delegated, ref) => {
+  return /* @__PURE__ */ jsxs9("svg", {
+    ref,
+    width: "34",
+    height: "34",
+    viewBox: "0 0 34 34",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    ...delegated,
+    children: [
+      /* @__PURE__ */ jsx16("path", {
+        d: "m27.2751 9.9953-4.3639-4.367a.5799.5799 0 0 0-.8067.007c-3.9421 4.0122-4.6858 4.447-8.5799 8.509-1.3464 1.4174-2.7077 2.8197-4.0611 4.2301l-1.6672 1.6982a2.3308 2.3308 0 0 0-.8766 1.5362c-.3718 2.237-1.0105 3.9282-1.3824 6.1801-.07.4628-.007.8346.4568.7227 1.3884-.3089 2.6088-.7437 3.9911-1.0595.7227-.1619 2.199-.6597 3.0446-.9546a3.9637 3.9637 0 0 0 1.3194-.9535c.8996-.7787.9995-.9546 1.8581-1.7612a285.1786 285.1786 0 0 0 3.0096-2.8826 9.4842 9.4842 0 0 1 .9755-.9196s.084-.084.9536-.9675l3.2555-3.2555c1.0525-1.0525 2.6587-2.7987 3.7672-3.7982a1.0384 1.0384 0 0 0 .2998-.3998.5995.5995 0 0 0-.1269-.5328 8.0111 8.0111 0 0 0-1.0665-1.0315Zm.1 1.4733c-.014.014-.035.007-.042.028-3.9642 3.8982-4.4689 4.4689-8.439 8.3411l-5.7673 5.5414c-1.6323.5087-3.2495 1.1084-4.9197 1.5472l-.6097.147a2.7125 2.7125 0 0 1-.7647.1329l1.3324-6.0751L22.5183 6.6239c1.8522 1.8801 2.9956 2.9716 4.8548 4.8407l.002.004Z",
+        fill: "#528693"
+      }),
+      /* @__PURE__ */ jsx16("path", {
+        d: "M27.3731 11.4646c-.014.014-.035.007-.042.028-3.9641 3.8982-4.4689 4.4689-8.439 8.3411l-5.7673 5.5414c-1.6302.5127-3.2475 1.1124-4.9177 1.5512l-.6097.147a2.7125 2.7125 0 0 1-.7646.1329l1.3323-6.0751L22.5184 6.6239c1.8521 1.8801 2.9956 2.9716 4.8547 4.8407Z",
+        fill: "none"
+      })
+    ]
+  });
+});
+Edit.displayName = "EditIcon";
+
+// src/iconography/error.tsx
+import { forwardRef as forwardRef11 } from "react";
+import { jsx as jsx17, jsxs as jsxs10 } from "react/jsx-runtime";
+var Error = forwardRef11((delegated, ref) => {
+  return /* @__PURE__ */ jsxs10("svg", {
+    ref,
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "22",
+    height: "22",
+    fill: "none",
+    viewBox: "0 0 22 22",
+    ...delegated,
+    children: [
+      /* @__PURE__ */ jsxs10("g", {
+        "clip-path": "url(#clip0_1679_677)",
+        children: [
+          /* @__PURE__ */ jsx17("path", {
+            "fill-rule": "evenodd",
+            "clip-rule": "evenodd",
+            d: "M9.63864 18.2702C10.2437 19.3181 11.7562 19.3181 12.3613 18.2702L19.8485 5.3019C20.4536 4.25396 19.6973 2.94403 18.4872 2.94403L3.51271 2.94403C2.30265 2.94403 1.54636 4.25396 2.15139 5.3019L9.63864 18.2702ZM10.4355 12.9854C10.6864 13.4199 11.3135 13.4199 11.5643 12.9854L14.6686 7.60866C14.9195 7.17417 14.6059 6.63107 14.1042 6.63107L7.89566 6.63107C7.39396 6.63107 7.08039 7.17417 7.33124 7.60866L10.4355 12.9854Z",
+            fill: "#EB1782"
+          }),
+          /* @__PURE__ */ jsx17("path", {
+            "fill-rule": "evenodd",
+            "clip-rule": "evenodd",
+            d: "M10.1583 17.9702C10.5323 18.6181 11.4676 18.6181 11.8417 17.9702L19.3289 5.0019C19.703 4.35396 19.2354 3.54403 18.4872 3.54403L3.51271 3.54403C2.76453 3.54403 2.29692 4.35396 2.67101 5.0019L10.1583 17.9702ZM12.084 13.2854C11.6022 14.1199 10.3977 14.1199 9.9159 13.2854L6.81163 7.90866C6.32984 7.07417 6.93207 6.03107 7.89566 6.03107L14.1042 6.03107C15.0678 6.03107 15.67 7.07418 15.1882 7.90866L12.084 13.2854ZM12.3613 18.2702C11.7562 19.3181 10.2437 19.3181 9.63864 18.2702L2.15139 5.3019C1.54636 4.25396 2.30265 2.94403 3.51271 2.94403L18.4872 2.94403C19.6973 2.94403 20.4536 4.25396 19.8485 5.3019L12.3613 18.2702ZM11.5643 12.9854C11.3135 13.4199 10.6864 13.4199 10.4355 12.9854L7.33124 7.60866C7.08039 7.17417 7.39396 6.63107 7.89566 6.63107L14.1042 6.63107C14.6059 6.63107 14.9195 7.17417 14.6686 7.60866L11.5643 12.9854Z",
+            fill: "#528693"
+          })
+        ]
       }),
-      /* @__PURE__ */ jsx7("path", {
-        fill: "#528693",
-        fillRule: "evenodd",
-        d: "M6.94 13.903a.6.6 0 0 1 0-.849L8.994 11 6.94 8.946a.6.6 0 0 1 0-.849L8.097 6.94a.6.6 0 0 1 .849 0L11 8.994l2.054-2.054a.6.6 0 0 1 .849 0l1.157 1.157a.6.6 0 0 1 0 .849L13.006 11l2.054 2.054a.6.6 0 0 1 0 .849l-1.157 1.157a.6.6 0 0 1-.849 0L11 13.006 8.946 15.06a.6.6 0 0 1-.849 0L6.94 13.903ZM11 12.158l2.479 2.478 1.157-1.157L12.158 11l2.478-2.479-1.157-1.157L11 9.842 8.521 7.364 7.364 8.52 9.842 11l-2.478 2.479 1.157 1.157L11 12.158Z",
-        clipRule: "evenodd"
+      /* @__PURE__ */ jsx17("defs", {
+        children: /* @__PURE__ */ jsx17("clipPath", {
+          id: "clip0_1679_677",
+          children: /* @__PURE__ */ jsx17("rect", {
+            width: "22",
+            height: "22",
+            fill: "white"
+          })
+        })
       })
     ]
   });
 });
 Error.displayName = "ErrorIcon";
 
-// src/icons/glasses.tsx
-import { forwardRef as forwardRef5 } from "react";
-import { jsx as jsx8, jsxs as jsxs4 } from "react/jsx-runtime";
-var Glasses = forwardRef5((delegated, ref) => {
-  return /* @__PURE__ */ jsxs4("svg", {
+// src/iconography/glasses.tsx
+import { forwardRef as forwardRef12 } from "react";
+import { jsx as jsx18, jsxs as jsxs11 } from "react/jsx-runtime";
+var Glasses = forwardRef12((delegated, ref) => {
+  return /* @__PURE__ */ jsxs11("svg", {
     ref,
     width: "20",
     height: "15",
@@ -185,45 +687,45 @@ var Glasses = forwardRef5((delegated, ref) => {
     xmlns: "http://www.w3.org/2000/svg",
     ...delegated,
     children: [
-      /* @__PURE__ */ jsx8("path", {
+      /* @__PURE__ */ jsx18("path", {
         fillRule: "evenodd",
         clipRule: "evenodd",
         d: "M7.4856 2.0673c-.3158-.7572-1.2453-1.0361-1.9258-.578l-3.42 2.3025c-.8613.5798-.7287 1.8856.2315 2.2806l.1216.05.2282-.5549-.1216-.05c-.517-.2127-.5884-.9158-.1246-1.228l3.42-2.3025c.3664-.2467.8669-.0965 1.037.3112l.0748.1795a.3.3 0 0 0 .5537-.231l-.0748-.1795Z",
         fill: "#528693"
       }),
-      /* @__PURE__ */ jsx8("path", {
+      /* @__PURE__ */ jsx18("path", {
         d: "m9.7363 8.289-.2116.453-.906-.4233.2116-.453.906.4234Z",
         fill: "#528793"
       }),
-      /* @__PURE__ */ jsx8("path", {
+      /* @__PURE__ */ jsx18("path", {
         d: "M4.391 9.9236c1.5958.7593 3.5051.0811 4.2644-1.5148.7593-1.596.081-3.5052-1.5148-4.2644-1.5959-.7593-3.5051-.0811-4.2644 1.5148-.7593 1.5958-.0811 3.505 1.5148 4.2644Z",
         fill: "#BFF6F8"
       }),
-      /* @__PURE__ */ jsx8("path", {
+      /* @__PURE__ */ jsx18("path", {
         d: "M3.1883 8.7645a3.2004 3.2004 0 0 1-.3446-.514l5.955-2.1168c.0388.203.0579.4094.0568.6162L3.1883 8.7644Zm4.8102-4.212L2.468 6.517a3.2001 3.2001 0 0 0 .1588 1.2118l6.0129-2.136a3.2002 3.2002 0 0 0-.6412-1.0403Z",
         fill: "#fff"
       }),
-      /* @__PURE__ */ jsx8("path", {
+      /* @__PURE__ */ jsx18("path", {
         fillRule: "evenodd",
         clipRule: "evenodd",
         d: "M4.4255 9.3845c1.4463.6881 3.1766.0735 3.8647-1.3728.688-1.4463.0735-3.1765-1.3728-3.8646-1.4463-.6881-3.1765-.0735-3.8646 1.3728-.6882 1.4462-.0735 3.1765 1.3727 3.8646Zm-.2577.5418c1.7455.8305 3.8337.0887 4.6642-1.6568.8304-1.7455.0887-3.8338-1.6568-4.6642-1.7455-.8305-3.8338-.0887-4.6643 1.6568-.8304 1.7455-.0886 3.8337 1.6569 4.6642Z",
         fill: "#528793"
       }),
-      /* @__PURE__ */ jsx8("path", {
+      /* @__PURE__ */ jsx18("path", {
         d: "M11.3275 12.7751c1.5959.7593 3.5051.0811 4.2644-1.5148.7593-1.5959.0811-3.5051-1.5148-4.2644-1.5959-.7593-3.5051-.081-4.2644 1.5148-.7593 1.5959-.0811 3.5052 1.5148 4.2644Z",
         fill: "#BFF6F8"
       }),
-      /* @__PURE__ */ jsx8("path", {
+      /* @__PURE__ */ jsx18("path", {
         d: "M10.1248 11.616a3.2048 3.2048 0 0 1-.3446-.5139l5.9551-2.1168c.0388.203.0578.4094.0568.6161l-5.6673 2.0146Zm4.8102-4.212L9.4045 9.3687a3.1998 3.1998 0 0 0 .1588 1.2117l6.0129-2.1358a3.1995 3.1995 0 0 0-.6412-1.0404Z",
         fill: "#fff"
       }),
-      /* @__PURE__ */ jsx8("path", {
+      /* @__PURE__ */ jsx18("path", {
         fillRule: "evenodd",
         clipRule: "evenodd",
         d: "M11.3621 12.2361c1.4462.6881 3.1765.0734 3.8646-1.3728.6881-1.4463.0735-3.1766-1.3728-3.8647-1.4463-.688-3.1765-.0735-3.8646 1.3728-.6881 1.4463-.0735 3.1766 1.3728 3.8647Zm-.2578.5418c1.7455.8304 3.8337.0887 4.6642-1.6568.8305-1.7455.0887-3.8338-1.6568-4.6643-1.7455-.8304-3.8338-.0887-4.6642 1.6568-.8305 1.7455-.0887 3.8338 1.6568 4.6643Z",
         fill: "#528793"
       }),
-      /* @__PURE__ */ jsx8("path", {
+      /* @__PURE__ */ jsx18("path", {
         fillRule: "evenodd",
         clipRule: "evenodd",
         d: "M14.7461 5.0551c.7572-.3158 1.614.14 1.7751.9444l.81 4.0424c.204 1.0181-.809 1.8527-1.7692 1.4577l-.1216-.05.2283-.5549.1216.05c.517.2127 1.0625-.2367.9526-.7849l-.81-4.0424c-.0868-.4331-.5481-.6786-.9558-.5085l-.1794.0748a.3.3 0 0 1-.231-.5538l.1794-.0748Z",
@@ -234,11 +736,11 @@ var Glasses = forwardRef5((delegated, ref) => {
 });
 Glasses.displayName = "GlassesIcon";
 
-// src/icons/graphQL.tsx
-import { forwardRef as forwardRef6 } from "react";
-import { jsx as jsx9, jsxs as jsxs5 } from "react/jsx-runtime";
-var GraphQL = forwardRef6((delegated, ref) => {
-  return /* @__PURE__ */ jsxs5("svg", {
+// src/iconography/graphQL.tsx
+import { forwardRef as forwardRef13 } from "react";
+import { jsx as jsx19, jsxs as jsxs12 } from "react/jsx-runtime";
+var GraphQL = forwardRef13((delegated, ref) => {
+  return /* @__PURE__ */ jsxs12("svg", {
     ref,
     width: "23",
     height: "22",
@@ -247,97 +749,97 @@ var GraphQL = forwardRef6((delegated, ref) => {
     xmlns: "http://www.w3.org/2000/svg",
     ...delegated,
     children: [
-      /* @__PURE__ */ jsx9("path", {
+      /* @__PURE__ */ jsx19("path", {
         d: "M10.479 3.4a1.4 1.4 0 1 1 2.8 0 1.4 1.4 0 1 1-2.8 0Z",
         fill: "#BFF6F8"
       }),
-      /* @__PURE__ */ jsx9("path", {
+      /* @__PURE__ */ jsx19("path", {
         fillRule: "evenodd",
         clipRule: "evenodd",
         d: "M11.879 5.4a2 2 0 1 1 0-4 2 2 0 0 1 0 4Zm0-3.4a1.4 1.4 0 1 0 0 2.8 1.4 1.4 0 0 0 0-2.8Z",
         fill: "#528693"
       }),
-      /* @__PURE__ */ jsx9("path", {
+      /* @__PURE__ */ jsx19("path", {
         d: "M10.479 3.4a1.4 1.4 0 1 1 2.8 0 1.4 1.4 0 1 1-2.8 0Z",
         fill: "#BFF6F8"
       }),
-      /* @__PURE__ */ jsx9("path", {
+      /* @__PURE__ */ jsx19("path", {
         fillRule: "evenodd",
         clipRule: "evenodd",
         d: "M11.879 5.4a2 2 0 1 1 0-4 2 2 0 0 1 0 4Zm0-3.4a1.4 1.4 0 1 0 0 2.8 1.4 1.4 0 0 0 0-2.8Z",
         fill: "#528693"
       }),
-      /* @__PURE__ */ jsx9("path", {
+      /* @__PURE__ */ jsx19("path", {
         d: "M3.679 7.2a1.4 1.4 0 1 1 2.8 0 1.4 1.4 0 1 1-2.8 0Z",
         fill: "#BFF6F8"
       }),
-      /* @__PURE__ */ jsx9("path", {
+      /* @__PURE__ */ jsx19("path", {
         fillRule: "evenodd",
         clipRule: "evenodd",
         d: "M5.079 9.2a2 2 0 1 1 0-4 2 2 0 0 1 0 4Zm0-3.4a1.4 1.4 0 1 0 0 2.8 1.4 1.4 0 0 0 0-2.8Z",
         fill: "#528693"
       }),
-      /* @__PURE__ */ jsx9("path", {
+      /* @__PURE__ */ jsx19("path", {
         d: "M17.279 7.2a1.4 1.4 0 1 1 2.8 0 1.4 1.4 0 1 1-2.8 0Z",
         fill: "#BFF6F8"
       }),
-      /* @__PURE__ */ jsx9("path", {
+      /* @__PURE__ */ jsx19("path", {
         fillRule: "evenodd",
         clipRule: "evenodd",
         d: "M18.679 9.2a2 2 0 1 1 0-4 2 2 0 0 1 0 4Zm0-3.4a1.4 1.4 0 1 0 0 2.8 1.4 1.4 0 0 0 0-2.8Z",
         fill: "#528693"
       }),
-      /* @__PURE__ */ jsx9("path", {
+      /* @__PURE__ */ jsx19("path", {
         d: "M3.679 7.2a1.4 1.4 0 1 1 2.8 0 1.4 1.4 0 1 1-2.8 0Z",
         fill: "#BFF6F8"
       }),
-      /* @__PURE__ */ jsx9("path", {
+      /* @__PURE__ */ jsx19("path", {
         fillRule: "evenodd",
         clipRule: "evenodd",
         d: "M5.079 9.2a2 2 0 1 1 0-4 2 2 0 0 1 0 4Zm0-3.4a1.4 1.4 0 1 0 0 2.8 1.4 1.4 0 0 0 0-2.8Z",
         fill: "#528693"
       }),
-      /* @__PURE__ */ jsx9("path", {
+      /* @__PURE__ */ jsx19("path", {
         d: "M17.279 7.2a1.4 1.4 0 1 1 2.8 0 1.4 1.4 0 1 1-2.8 0Z",
         fill: "#BFF6F8"
       }),
-      /* @__PURE__ */ jsx9("path", {
+      /* @__PURE__ */ jsx19("path", {
         fillRule: "evenodd",
         clipRule: "evenodd",
         d: "M18.679 9.2a2 2 0 1 1 0-4 2 2 0 0 1 0 4Zm0-3.4a1.4 1.4 0 1 0 0 2.8 1.4 1.4 0 0 0 0-2.8Z",
         fill: "#528693"
       }),
-      /* @__PURE__ */ jsx9("path", {
+      /* @__PURE__ */ jsx19("path", {
         d: "M3.679 14.8a1.4 1.4 0 1 1 2.8 0 1.4 1.4 0 1 1-2.8 0Z",
         fill: "#BFF6F8"
       }),
-      /* @__PURE__ */ jsx9("path", {
+      /* @__PURE__ */ jsx19("path", {
         fillRule: "evenodd",
         clipRule: "evenodd",
         d: "M5.079 16.8a2 2 0 1 1 0-4 2 2 0 0 1 0 4Zm0-3.4a1.4 1.4 0 1 0 0 2.8 1.4 1.4 0 0 0 0-2.8Z",
         fill: "#528693"
       }),
-      /* @__PURE__ */ jsx9("path", {
+      /* @__PURE__ */ jsx19("path", {
         d: "M17.279 14.8a1.4 1.4 0 1 1 2.8 0 1.4 1.4 0 1 1-2.8 0Z",
         fill: "#fff"
       }),
-      /* @__PURE__ */ jsx9("path", {
+      /* @__PURE__ */ jsx19("path", {
         fillRule: "evenodd",
         clipRule: "evenodd",
         d: "M18.679 16.8a2 2 0 1 1 0-4 2 2 0 0 1 0 4Zm0-3.4a1.4 1.4 0 1 0 0 2.8 1.4 1.4 0 0 0 0-2.8Z",
         fill: "#528693"
       }),
-      /* @__PURE__ */ jsx9("path", {
+      /* @__PURE__ */ jsx19("path", {
         d: "M10.479 18.75a1.4 1.4 0 1 1 2.8 0 1.4 1.4 0 1 1-2.8 0Z",
         fill: "#BFF6F8"
       }),
-      /* @__PURE__ */ jsx9("path", {
+      /* @__PURE__ */ jsx19("path", {
         fillRule: "evenodd",
         clipRule: "evenodd",
         d: "M11.879 20.75a2 2 0 1 1 0-4 2 2 0 0 1 0 4Zm0-3.4a1.4 1.4 0 1 0 0 2.8 1.4 1.4 0 0 0 0-2.8ZM10.44 3.851a.3.3 0 0 1-.112.41l-3.5 2a.3.3 0 0 1-.298-.521l3.5-2a.3.3 0 0 1 .41.111ZM13.419 3.851a.3.3 0 0 0 .111.41l3.5 2a.3.3 0 0 0 .298-.521l-3.5-2a.3.3 0 0 0-.41.111Z",
         fill: "#528693"
       }),
-      /* @__PURE__ */ jsx9("path", {
+      /* @__PURE__ */ jsx19("path", {
         fillRule: "evenodd",
         clipRule: "evenodd",
         d: "M10.44 18.149a.3.3 0 0 0-.112-.41l-3.5-2a.3.3 0 0 0-.298.521l3.5 2a.3.3 0 0 0 .41-.111ZM13.419 18.149a.3.3 0 0 1 .111-.41l3.5-2a.3.3 0 0 1 .298.521l-3.5 2a.3.3 0 0 1-.41-.111ZM5.079 8.7a.3.3 0 0 1 .3.3v4a.3.3 0 1 1-.6 0V9a.3.3 0 0 1 .3-.3ZM18.679 8.7a.3.3 0 0 1 .3.3v4a.3.3 0 1 1-.6 0V9a.3.3 0 0 1 .3-.3ZM11.033 4.743a.3.3 0 0 1 .103.411l-4.8 8a.3.3 0 1 1-.514-.308l4.8-8a.3.3 0 0 1 .411-.103ZM12.725 4.743a.3.3 0 0 0-.103.411l4.8 8a.3.3 0 1 0 .514-.308l-4.8-8a.3.3 0 0 0-.411-.103ZM6.579 14.9a.3.3 0 0 1 .3-.3h10a.3.3 0 0 1 0 .6h-10a.3.3 0 0 1-.3-.3Z",
@@ -348,11 +850,11 @@ var GraphQL = forwardRef6((delegated, ref) => {
 });
 GraphQL.displayName = "GraphQLIcon";
 
-// src/icons/info.tsx
-import { forwardRef as forwardRef7 } from "react";
-import { jsx as jsx10, jsxs as jsxs6 } from "react/jsx-runtime";
-var Info = forwardRef7((delegated, ref) => {
-  return /* @__PURE__ */ jsxs6("svg", {
+// src/iconography/info.tsx
+import { forwardRef as forwardRef14 } from "react";
+import { jsx as jsx20, jsxs as jsxs13 } from "react/jsx-runtime";
+var Info = forwardRef14((delegated, ref) => {
+  return /* @__PURE__ */ jsxs13("svg", {
     ref,
     xmlns: "http://www.w3.org/2000/svg",
     width: "22",
@@ -361,44 +863,36 @@ var Info = forwardRef7((delegated, ref) => {
     viewBox: "0 0 22 22",
     ...delegated,
     children: [
-      /* @__PURE__ */ jsx10("path", {
-        fill: "#BFF6F8",
-        d: "M20.83 11c0 5.43-4.4 9.83-9.83 9.83S1.17 16.43 1.17 11 5.57 1.17 11 1.17s9.83 4.4 9.83 9.83Z"
-      }),
-      /* @__PURE__ */ jsx10("path", {
-        fill: "#528693",
-        fillRule: "evenodd",
-        d: "M21.431 11c0 5.76-4.67 10.43-10.43 10.43C5.238 21.43.568 16.76.568 11S5.24.57 11 .57C16.76.57 21.431 5.24 21.431 11Zm-10.43 9.83c5.429 0 9.83-4.4 9.83-9.83s-4.401-9.83-9.83-9.83c-5.43 0-9.832 4.4-9.832 9.83S5.571 20.83 11 20.83Z",
-        clipRule: "evenodd"
-      }),
-      /* @__PURE__ */ jsx10("path", {
-        fill: "#fff",
-        d: "M14.814 6.317a.991.991 0 1 1-1.983 0 .991.991 0 0 1 1.983 0Z"
+      /* @__PURE__ */ jsx20("path", {
+        d: "M17.593 3.85212C17.593 4.67937 16.9224 5.34999 16.0952 5.34999C15.2679 5.34999 14.5973 4.67937 14.5973 3.85212C14.5973 3.02487 15.2679 2.35425 16.0952 2.35425C16.9224 2.35425 17.593 3.02487 17.593 3.85212Z",
+        fill: "#BFF6F8"
       }),
-      /* @__PURE__ */ jsx10("path", {
-        fill: "#528693",
-        fillRule: "evenodd",
-        d: "M15.415 6.317a1.592 1.592 0 1 1-3.184 0 1.592 1.592 0 0 1 3.184 0Zm-1.592.991a.991.991 0 1 0 0-1.982.991.991 0 0 0 0 1.982Z",
-        clipRule: "evenodd"
+      /* @__PURE__ */ jsx20("path", {
+        "fill-rule": "evenodd",
+        "clip-rule": "evenodd",
+        d: "M18.253 3.85212C18.253 5.04383 17.2869 6.00991 16.0952 6.00991C14.9035 6.00991 13.9374 5.04383 13.9374 3.85212C13.9374 2.66041 14.9035 1.69434 16.0952 1.69434C17.2869 1.69434 18.253 2.66041 18.253 3.85212ZM16.0952 5.34999C16.9224 5.34999 17.5931 4.67937 17.5931 3.85212C17.5931 3.02487 16.9224 2.35425 16.0952 2.35425C15.2679 2.35425 14.5973 3.02487 14.5973 3.85212C14.5973 4.67937 15.2679 5.34999 16.0952 5.34999Z",
+        fill: "#528693"
       }),
-      /* @__PURE__ */ jsx10("path", {
-        fill: "#fff",
-        d: "m9.37 16.049 1.8.26-.22-.7-.78-.621.56-1.14 2.261-3.382-.34-1.381-1.92-1-1.261.14-.28.32 1.08.54.14.54-2.22 2.862-.821 2.36 2 1.202Z"
+      /* @__PURE__ */ jsx20("path", {
+        d: "M11.2267 19.6338C10.1339 19.5731 9.0685 19.2687 8.1091 18.743C6.45171 17.8422 5.90412 16.3181 6.67909 14.7659C7.26511 13.7065 7.9836 12.7256 8.81732 11.8468L8.91693 11.7313C9.29243 11.2963 9.68044 10.8467 10.0199 10.3976C10.4486 9.83253 10.8215 9.28929 10.6797 8.86312C10.5968 8.6196 10.3605 8.44373 9.9584 8.32457C9.83715 8.29874 9.71404 8.28256 9.59022 8.27617L9.50938 8.26941C9.26232 8.2834 9.01575 8.23452 8.79281 8.12735C8.54248 7.93066 8.64731 7.36817 8.77404 7.12204C8.87835 6.92966 9.02762 6.76522 9.2092 6.64266C9.39077 6.5201 9.59929 6.44304 9.81707 6.41802C10.0235 6.38077 10.2331 6.36335 10.4429 6.36598C11.4176 6.41652 12.3773 6.6275 13.2831 6.9904C14.9259 7.62106 15.7097 8.86885 15.3801 10.3284C15.1357 11.2718 14.6733 12.1451 14.0299 12.8781C13.8385 13.118 13.6419 13.3464 13.4458 13.5795L13.3415 13.7024C12.9232 14.1775 12.5323 14.6759 12.1707 15.1952L11.9564 15.5012C11.7156 15.8119 11.5223 16.1565 11.3827 16.5237C11.303 16.7335 11.308 16.966 11.3968 17.1721C11.4855 17.3783 11.651 17.5421 11.8583 17.6289C12.0086 17.6973 12.1701 17.7377 12.335 17.748C12.5957 17.7793 12.8648 17.8126 12.9712 18.0603C13.0139 18.1752 13.0313 18.298 13.0223 18.4203C13.0133 18.5425 12.9781 18.6615 12.9191 18.769C12.7552 19.0647 12.5066 19.305 12.2052 19.459C11.9037 19.6131 11.563 19.6739 11.2267 19.6338Z",
+        fill: "#BFF6F8"
       }),
-      /* @__PURE__ */ jsx10("path", {
-        fill: "#528693",
-        d: "M10.476 16.666a4.93 4.93 0 0 1-2.096-.599c-1.114-.605-1.482-1.63-.961-2.673a9.606 9.606 0 0 1 1.437-1.963l.067-.077c.252-.293.513-.595.742-.897.288-.38.538-.745.443-1.031-.056-.164-.215-.282-.485-.362a1.58 1.58 0 0 0-.247-.033l-.055-.004a.984.984 0 0 1-.481-.096c-.169-.132-.098-.51-.013-.676a.915.915 0 0 1 .701-.473c.139-.025.28-.037.42-.035.656.034 1.301.176 1.91.42 1.104.424 1.631 1.263 1.41 2.244a4.193 4.193 0 0 1-.908 1.714c-.128.161-.26.315-.392.471l-.07.083c-.282.32-.544.654-.788 1.003l-.144.206c-.161.209-.291.44-.385.687a.582.582 0 0 0 .32.743.91.91 0 0 0 .32.08c.175.021.356.044.428.21a.575.575 0 0 1-.035.477 1.144 1.144 0 0 1-1.138.581Zm-.877-8.193c.128.079.268.136.414.17.18.04.35.12.494.236.58.552.14 1.272-.318 1.903-.214.292-.47.58-.74.884l-.068.077c-.624.692-1.27 1.408-1.497 2.232a1.148 1.148 0 0 0 .163 1.06c.493.658 1.78.907 2.819.921l.035-.05-.025-.035a1.248 1.248 0 0 1-.865-.594 1.04 1.04 0 0 1 .006-.894 8.071 8.071 0 0 1 1.309-1.977l.127-.155c.171-.21.356-.437.525-.665.371-.501.844-1.245.664-1.915-.315-1.173-2.15-1.209-3.03-1.226h-.057l.044.028Z"
+      /* @__PURE__ */ jsx20("path", {
+        "fill-rule": "evenodd",
+        "clip-rule": "evenodd",
+        d: "M11.2842 18.976L11.3049 18.9785C11.5112 19.0031 11.7201 18.9658 11.9049 18.8714C12.0891 18.7772 12.2409 18.6306 12.3411 18.4504C12.3471 18.4394 12.352 18.4277 12.3558 18.4158C12.3317 18.4124 12.3048 18.4091 12.2731 18.4053C12.0384 18.3881 11.8084 18.33 11.5936 18.2335C11.2334 18.0797 10.9456 17.7933 10.7906 17.433C10.6341 17.0694 10.6252 16.6594 10.7658 16.2894C10.9266 15.8663 11.1487 15.4689 11.4246 15.1101L11.6291 14.8181C11.6293 14.8178 11.629 14.8184 11.6291 14.8181C12.0038 14.2802 12.4092 13.763 12.8423 13.2707L12.9418 13.1535C12.9894 13.097 13.0361 13.0418 13.0821 12.9874C13.2314 12.8108 13.3734 12.6428 13.5141 12.4665L13.5237 12.4544L13.5339 12.4428C14.107 11.7899 14.5194 11.0128 14.7386 10.1733C14.8642 9.60674 14.7724 9.1134 14.5125 8.69961C14.2452 8.27422 13.7678 7.88337 13.0466 7.60647L13.0376 7.60304C12.2034 7.26882 11.3198 7.07373 10.4221 7.02572C10.2586 7.02444 10.0952 7.03841 9.93422 7.06745L9.91342 7.0712L9.89242 7.07362C9.77981 7.08656 9.67209 7.12639 9.57839 7.18964C9.48729 7.25113 9.41209 7.33296 9.35867 7.42842C9.35249 7.44171 9.33941 7.47402 9.32659 7.52286C9.31959 7.54951 9.31383 7.57671 9.30949 7.60325C9.36308 7.61115 9.41754 7.61364 9.47206 7.61055L9.51828 7.60793L9.63538 7.61773C9.79024 7.6263 9.94419 7.64682 10.0959 7.67913L10.1211 7.68451L10.1459 7.69185C10.6213 7.83272 11.1176 8.10198 11.3044 8.65041L11.3058 8.6547C11.4603 9.11879 11.309 9.5616 11.1547 9.87197C10.9947 10.194 10.7584 10.5161 10.546 10.7961C10.1932 11.2626 9.79323 11.726 9.4222 12.1559L9.4167 12.1622L9.30686 12.2896L9.29607 12.301C8.50411 13.1358 7.82119 14.0671 7.26353 15.0728C6.95101 15.7053 6.92585 16.2828 7.10297 16.7755C7.28379 17.2785 7.70442 17.772 8.42421 18.1631L8.42623 18.1642C9.29923 18.6426 10.2687 18.9197 11.2633 18.9749L11.2842 18.976ZM6.67909 14.7659C7.26511 13.7065 7.9836 12.7256 8.81732 11.8468L8.91693 11.7313C9.29243 11.2963 9.68044 10.8467 10.0199 10.3976C10.4486 9.83253 10.8215 9.28929 10.6797 8.86312C10.5968 8.6196 10.3605 8.44373 9.9584 8.32457C9.83715 8.29874 9.71404 8.28256 9.59022 8.27617L9.50938 8.26941C9.26232 8.2834 9.01575 8.23452 8.79281 8.12735C8.54248 7.93066 8.64731 7.36817 8.77404 7.12204C8.87835 6.92966 9.02762 6.76522 9.2092 6.64266C9.39077 6.5201 9.59929 6.44304 9.81707 6.41802C10.0235 6.38077 10.2331 6.36335 10.4429 6.36598C11.4176 6.41652 12.3773 6.6275 13.2831 6.9904C14.9259 7.62106 15.7097 8.86885 15.3801 10.3284C15.1357 11.2718 14.6733 12.1451 14.0299 12.8781C13.8828 13.0625 13.7326 13.2401 13.582 13.4182C13.5366 13.4719 13.4912 13.5256 13.4458 13.5795L13.3415 13.7024C12.9232 14.1775 12.5323 14.6759 12.1707 15.1952L11.9564 15.5012C11.7156 15.8119 11.5223 16.1565 11.3827 16.5237C11.303 16.7335 11.308 16.966 11.3968 17.1721C11.4855 17.3783 11.651 17.5421 11.8583 17.6289C12.0086 17.6973 12.1701 17.7377 12.335 17.748C12.5957 17.7793 12.8648 17.8126 12.9712 18.0603C13.0139 18.1752 13.0313 18.298 13.0223 18.4203C13.0133 18.5425 12.9781 18.6615 12.9191 18.769C12.7552 19.0647 12.5066 19.305 12.2052 19.459C11.9037 19.6131 11.563 19.6739 11.2267 19.6338C10.1339 19.5731 9.0685 19.2687 8.1091 18.743C6.45171 17.8422 5.90412 16.3181 6.67909 14.7659Z",
+        fill: "#528693"
       })
     ]
   });
 });
 Info.displayName = "InfoIcon";
 
-// src/icons/nail-polish.tsx
-import { forwardRef as forwardRef8 } from "react";
-import { jsx as jsx11, jsxs as jsxs7 } from "react/jsx-runtime";
-var NailPolish = forwardRef8((delegated, ref) => {
-  return /* @__PURE__ */ jsxs7("svg", {
+// src/iconography/nail-polish.tsx
+import { forwardRef as forwardRef15 } from "react";
+import { jsx as jsx21, jsxs as jsxs14 } from "react/jsx-runtime";
+var NailPolish = forwardRef15((delegated, ref) => {
+  return /* @__PURE__ */ jsxs14("svg", {
     ref,
     width: "12",
     height: "16",
@@ -407,67 +901,67 @@ var NailPolish = forwardRef8((delegated, ref) => {
     xmlns: "http://www.w3.org/2000/svg",
     ...delegated,
     children: [
-      /* @__PURE__ */ jsx11("path", {
+      /* @__PURE__ */ jsx21("path", {
         d: "M.8573 9.7059H.4287v-.8824c0-.4873.3838-.8823.8571-.8823h4.2858c.4734 0 .8571.395.8571.8823v.8824h-.4286V15H.8573V9.7059Z",
         fill: "#BFF6F8"
       }),
-      /* @__PURE__ */ jsx11("path", {
+      /* @__PURE__ */ jsx21("path", {
         fillRule: "evenodd",
         clipRule: "evenodd",
         d: "M1.3716 9.1765v5.2941h4.1143V9.1765h.4285v-.353c0-.195-.1535-.353-.3428-.353H1.2858c-.1893 0-.3428.158-.3428.353v.353h.4286ZM6 9.7059h.4286v-.8824c0-.4873-.3837-.8823-.8571-.8823H1.2858c-.4733 0-.857.395-.857.8823v.8824h.4285V15H6V9.7059Z",
         fill: "#528693"
       }),
-      /* @__PURE__ */ jsx11("path", {
+      /* @__PURE__ */ jsx21("path", {
         d: "M1.2856 6.6176c0-.4873.3838-.8823.8572-.8823h2.5714c.4734 0 .8572.395.8572.8823v1.7648H1.2856V6.6176Z",
         fill: "#BFF6F8"
       }),
-      /* @__PURE__ */ jsx11("path", {
+      /* @__PURE__ */ jsx21("path", {
         fillRule: "evenodd",
         clipRule: "evenodd",
         d: "M4.7142 6.2647H2.1428c-.1894 0-.3429.158-.3429.353v1.2352h3.2572V6.6176c0-.1949-.1535-.3529-.3429-.3529Zm-2.5714-.5294c-.4734 0-.8572.395-.8572.8823v1.7648h4.2858V6.6176c0-.4873-.3838-.8823-.8572-.8823H2.1428Z",
         fill: "#528693"
       }),
-      /* @__PURE__ */ jsx11("path", {
+      /* @__PURE__ */ jsx21("path", {
         d: "M1.7144.6228c0-.344.2708-.6228.605-.6228 1.5594 0 2.8235 1.3013 2.8235 2.9066v3.2699H1.7144V.6228Z",
         fill: "#FFCCEC"
       }),
-      /* @__PURE__ */ jsx11("path", {
+      /* @__PURE__ */ jsx21("path", {
         fillRule: "evenodd",
         clipRule: "evenodd",
         d: "M2.2286 5.647h2.4V2.9067c0-1.3129-1.0338-2.3772-2.3092-2.3772a.0921.0921 0 0 0-.0908.0934v5.0243ZM2.3194 0c-.3342 0-.605.2789-.605.6228v5.5537h3.4285v-3.27C5.143 1.3014 3.8788 0 2.3194 0Z",
         fill: "#528693"
       }),
-      /* @__PURE__ */ jsx11("path", {
+      /* @__PURE__ */ jsx21("path", {
         fillRule: "evenodd",
         clipRule: "evenodd",
         d: "M2.4626 1.9929c-.432-.5148-.5769-1.1307-.5769-1.5517H2.4c0 .3142.1124.8013.4518 1.2056.3313.3947.8997.7355 1.8625.7355v.5295c-1.0943 0-1.8116-.3945-2.2517-.9189Z",
         fill: "#528693"
       }),
-      /* @__PURE__ */ jsx11("path", {
+      /* @__PURE__ */ jsx21("path", {
         d: "M4.8708 8.6772c.245-.9414 1.185-1.5 2.0995-1.2478l2.4838.6851c.9145.2523 1.4573 1.22 1.2122 2.1613l-1.2201 4.6876c-.1225.4707-.5925.75-1.0498.6239l-4.1397-1.1418c-.4573-.1262-.7286-.61-.606-1.0807l1.22-4.6876Z",
         fill: "#FFCCEC"
       }),
-      /* @__PURE__ */ jsx11("path", {
+      /* @__PURE__ */ jsx21("path", {
         fillRule: "evenodd",
         clipRule: "evenodd",
         d: "m9.321 8.6259-2.4838-.6851c-.6401-.1766-1.2981.2145-1.4697.8734l-1.2201 4.6876c-.049.1883.0595.3818.2424.4323l4.1397 1.1418c.1829.0505.3709-.0612.42-.2495l1.2201-4.6876c.1715-.659-.2084-1.3363-.8486-1.513ZM6.9703 7.4294c-.9145-.2523-1.8545.3064-2.0995 1.2478l-1.2202 4.6876c-.1225.4707.1489.9545.6061 1.0807l4.1397 1.1418c.4573.1261.9273-.1532 1.0498-.6239l1.2201-4.6876c.2451-.9414-.2977-1.909-1.2122-2.1613l-2.4838-.6851Z",
         fill: "#528693"
       }),
-      /* @__PURE__ */ jsx11("path", {
+      /* @__PURE__ */ jsx21("path", {
         d: "M7.9236 3.5069c.1508-.4319.598-.6727 1.0285-.554l.9602.2649c.4306.1188.7009.5575.6217 1.009l-.6114 3.4854c-.0892.508-.581.829-1.0654.6954l-1.5121-.417c-.4844-.1337-.7544-.6649-.5848-1.1507l1.1633-3.333Z",
         fill: "#BFF6F8"
       }),
-      /* @__PURE__ */ jsx11("path", {
+      /* @__PURE__ */ jsx21("path", {
         fillRule: "evenodd",
         clipRule: "evenodd",
         d: "m9.7792 3.7292-.9602-.2649c-.1722-.0475-.351.0488-.4114.2216l-1.1634 3.333c-.0678.1943.0402.4068.234.4603l1.5121.417c.1938.0535.3905-.075.4262-.2781l.6114-3.4853c.0316-.1806-.0765-.3561-.2487-.4036Zm-.827-.7763c-.4307-.1187-.8778.1221-1.0286.554l-1.1633 3.333c-.1696.4858.1004 1.017.5848 1.1506l1.5121.4171c.4844.1336.9762-.1875 1.0654-.6954l.6114-3.4853c.0792-.4516-.1911-.8903-.6217-1.0091l-.9602-.2649Z",
         fill: "#528693"
       }),
-      /* @__PURE__ */ jsx11("path", {
+      /* @__PURE__ */ jsx21("path", {
         d: "m5.8906 9.8713 3.3118.9135-.4437 1.7046-3.3118-.9135.4437-1.7046Z",
         fill: "#fff"
       }),
-      /* @__PURE__ */ jsx11("path", {
+      /* @__PURE__ */ jsx21("path", {
         fillRule: "evenodd",
         clipRule: "evenodd",
         d: "m8.5725 11.1592-2.3182-.6395-.1775.6819 2.3182.6394.1775-.6818ZM5.8906 9.8713 5.447 11.576l3.3118.9135.4437-1.7046-3.3118-.9135Z",
@@ -478,279 +972,203 @@ var NailPolish = forwardRef8((delegated, ref) => {
 });
 NailPolish.displayName = "NailPolishIcon";
 
-// src/icons/warning.tsx
-import { forwardRef as forwardRef9 } from "react";
-import { jsx as jsx12, jsxs as jsxs8 } from "react/jsx-runtime";
-var Warning = forwardRef9((delegated, ref) => {
-  return /* @__PURE__ */ jsxs8("svg", {
+// src/iconography/particle.tsx
+import { forwardRef as forwardRef16 } from "react";
+import { jsx as jsx22, jsxs as jsxs15 } from "react/jsx-runtime";
+var Particle = forwardRef16((delegated, ref) => {
+  return /* @__PURE__ */ jsxs15("svg", {
     ref,
-    xmlns: "http://www.w3.org/2000/svg",
     width: "22",
-    height: "22",
+    height: "20",
+    viewBox: "0 0 22 20",
     fill: "none",
-    viewBox: "0 0 22 22",
+    xmlns: "http://www.w3.org/2000/svg",
     ...delegated,
     children: [
-      /* @__PURE__ */ jsx12("path", {
-        fill: "#FFDE99",
-        d: "M20.83 11c0 5.43-4.4 9.83-9.83 9.83S1.17 16.43 1.17 11 5.57 1.17 11 1.17s9.83 4.4 9.83 9.83Z"
+      /* @__PURE__ */ jsx22("path", {
+        fill: "#528693",
+        d: "M10.9 18.597c0-.332-2.426-.606-5.418-.61-2.992-.006-5.418.26-5.419.592 0 .333 2.425.606 5.417.611 2.993.005 5.419-.26 5.42-.593ZM21.39 16.21c0-.267-1.94-.485-4.334-.49-2.394-.003-4.335.209-4.335.475s1.94.485 4.334.489c2.393.004 4.334-.209 4.335-.475Z",
+        opacity: ".05"
       }),
-      /* @__PURE__ */ jsx12("path", {
+      /* @__PURE__ */ jsx22("path", {
         fill: "#528693",
-        fillRule: "evenodd",
-        d: "M21.43 11c0 5.76-4.67 10.43-10.43 10.43S.57 16.76.57 11 5.24.57 11 .57 21.43 5.24 21.43 11ZM11 20.83c5.43 0 9.83-4.4 9.83-9.83S16.43 1.17 11 1.17 1.17 5.57 1.17 11s4.4 9.83 9.83 9.83Z",
-        clipRule: "evenodd"
+        d: "m17.404 11.998-4.03.47-6.417.748-1.462.17.21.373 1.94-3.537 3.09-5.638.71-1.295c.154-.28-.267-.53-.42-.25l-1.94 3.537-3.09 5.638-.71 1.295c-.082.149.017.396.21.373l4.03-.47 6.417-.748 1.462-.17c.308-.037.311-.533 0-.496Z"
       }),
-      /* @__PURE__ */ jsx12("path", {
-        fill: "#fff",
-        d: "M10.077 5.232c.41-.71 1.436-.71 1.846 0L17 14.025c.41.71-.103 1.599-.924 1.599H5.923c-.82 0-1.333-.889-.923-1.6l5.077-8.792Z"
+      /* @__PURE__ */ jsx22("path", {
+        fill: "#FFBD54",
+        d: "M11.235 5.898c1.486 0 2.69-1.224 2.69-2.734S12.722.429 11.236.429s-2.69 1.224-2.69 2.735c0 1.51 1.204 2.734 2.69 2.734Z"
       }),
-      /* @__PURE__ */ jsx12("path", {
+      /* @__PURE__ */ jsx22("path", {
         fill: "#528693",
-        fillRule: "evenodd",
-        d: "m16.48 14.325-5.077-8.793a.466.466 0 0 0-.806 0L5.52 14.325c-.18.31.045.699.403.699h10.153a.466.466 0 0 0 .404-.7Zm-4.557-9.093a1.066 1.066 0 0 0-1.846 0L5 14.025c-.41.71.103 1.599.923 1.599h10.153c.821 0 1.334-.889.924-1.6l-5.077-8.792Z",
-        clipRule: "evenodd"
+        d: "M8.918 3.793a2.474 2.474 0 0 1 .068-1.47c.17-.47.48-.876.887-1.162a2.37 2.37 0 0 1 2.76.025c.4.293.703.704.866 1.179.162.474.177.987.041 1.47a2.44 2.44 0 0 1-.798 1.227 2.375 2.375 0 0 1-1.348.536 2.393 2.393 0 0 1-1.552-.457 2.461 2.461 0 0 1-.924-1.348.297.297 0 0 0-.137-.18.288.288 0 0 0-.4.113.302.302 0 0 0-.027.226c.16.604.5 1.143.972 1.543a2.945 2.945 0 0 0 3.425.283c.53-.318.95-.794 1.204-1.364.253-.57.327-1.205.211-1.82a3.047 3.047 0 0 0-.858-1.61A2.94 2.94 0 0 0 9.912.448c-.613.317-1.1.837-1.384 1.473a3.12 3.12 0 0 0-.174 2.03c.093.37.657.213.564-.158Z"
       }),
-      /* @__PURE__ */ jsx12("path", {
-        fill: "#FFDE99",
-        d: "M10.588 8.628a.5.5 0 1 1 1 0v2.475a.5.5 0 0 1-1 0V8.628Z"
+      /* @__PURE__ */ jsx22("path", {
+        fill: "#528693",
+        d: "M9.92 3.52a1.419 1.419 0 0 1 .143-1.046 1.38 1.38 0 0 1 .822-.647.195.195 0 0 0 .117-.093.2.2 0 0 0-.073-.27.192.192 0 0 0-.148-.019 1.778 1.778 0 0 0-1.055.835c-.23.407-.296.89-.182 1.346a.2.2 0 0 0 .092.12.193.193 0 0 0 .266-.075.2.2 0 0 0 .018-.15Z"
       }),
-      /* @__PURE__ */ jsx12("path", {
+      /* @__PURE__ */ jsx22("path", {
+        fill: "#FFBD54",
+        d: "M5.494 18.192c2.477 0 4.485-2.04 4.485-4.558 0-2.517-2.008-4.557-4.485-4.557-2.476 0-4.484 2.04-4.484 4.557 0 2.518 2.008 4.558 4.484 4.558Z"
+      }),
+      /* @__PURE__ */ jsx22("path", {
         fill: "#528693",
-        fillRule: "evenodd",
-        d: "M12.188 8.628v2.475a1.1 1.1 0 0 1-2.2 0V8.628a1.1 1.1 0 1 1 2.2 0Zm-1.1-.5a.5.5 0 0 0-.5.5v2.475a.5.5 0 1 0 1 0V8.628a.5.5 0 0 0-.5-.5Z",
-        clipRule: "evenodd"
+        d: "M10.271 13.634c0-.998-.302-1.973-.867-2.79a4.785 4.785 0 0 0-2.289-1.778 4.702 4.702 0 0 0-2.878-.115 4.768 4.768 0 0 0-2.42 1.587c-.488.6-.828 1.31-.989 2.071a4.93 4.93 0 0 0 .062 2.303 4.876 4.876 0 0 0 1.098 2.014 4.77 4.77 0 0 0 1.889 1.272 4.704 4.704 0 0 0 4.363-.594 4.83 4.83 0 0 0 1.493-1.732c.353-.691.538-1.459.538-2.238a.3.3 0 0 0-.086-.21.29.29 0 0 0-.413 0 .3.3 0 0 0-.086.21c0 .88-.268 1.736-.766 2.454a4.2 4.2 0 0 1-2.016 1.557 4.127 4.127 0 0 1-2.531.093 4.186 4.186 0 0 1-2.122-1.406 4.316 4.316 0 0 1-.349-4.895 4.214 4.214 0 0 1 1.9-1.702 4.13 4.13 0 0 1 2.519-.279 4.22 4.22 0 0 1 2.408 1.485c.613.76.95 1.711.957 2.693a.3.3 0 0 0 .086.21.29.29 0 0 0 .413 0 .3.3 0 0 0 .086-.21Z"
       }),
-      /* @__PURE__ */ jsx12("path", {
-        fill: "#FFDE99",
-        d: "M11.588 13.403a.5.5 0 1 1-1 0 .5.5 0 0 1 1 0Z"
+      /* @__PURE__ */ jsx22("path", {
+        fill: "#FFBD54",
+        d: "M17.404 15.892c1.981 0 3.587-1.633 3.587-3.646 0-2.014-1.606-3.647-3.587-3.647s-3.587 1.633-3.587 3.646c0 2.014 1.606 3.647 3.587 3.647Z"
       }),
-      /* @__PURE__ */ jsx12("path", {
+      /* @__PURE__ */ jsx22("path", {
         fill: "#528693",
-        fillRule: "evenodd",
-        d: "M12.188 13.403a1.1 1.1 0 1 1-2.2 0 1.1 1.1 0 0 1 2.2 0Zm-1.1.5a.5.5 0 1 0 0-1 .5.5 0 0 0 0 1Z",
-        clipRule: "evenodd"
+        d: "M14.22 13.11a3.4 3.4 0 0 1 .092-2.02 3.342 3.342 0 0 1 1.219-1.598 3.258 3.258 0 0 1 3.793.032c.551.402.968.967 1.192 1.619.223.651.244 1.357.058 2.021a3.353 3.353 0 0 1-1.098 1.687 3.265 3.265 0 0 1-1.852.737 3.288 3.288 0 0 1-2.133-.627 3.382 3.382 0 0 1-1.27-1.851.296.296 0 0 0-.138-.18.288.288 0 0 0-.398.113.302.302 0 0 0-.028.226 3.951 3.951 0 0 0 1.263 2.006 3.83 3.83 0 0 0 4.454.37 3.923 3.923 0 0 0 1.566-1.773c.33-.74.426-1.567.276-2.366a3.964 3.964 0 0 0-1.114-2.095 3.857 3.857 0 0 0-2.099-1.061c-.79-.126-1.6 0-2.317.36a3.965 3.965 0 0 0-1.804 1.916 4.054 4.054 0 0 0-.225 2.643c.094.37.658.211.564-.159Z"
+      }),
+      /* @__PURE__ */ jsx22("path", {
+        fill: "#FFBD54",
+        d: "M5.494 18.192c2.477 0 4.485-2.04 4.485-4.558 0-2.517-2.008-4.557-4.485-4.557-2.476 0-4.484 2.04-4.484 4.557 0 2.518 2.008 4.558 4.484 4.558Z"
+      }),
+      /* @__PURE__ */ jsx22("path", {
+        fill: "#528693",
+        d: "M1.303 13.634c0-.878.268-1.735.766-2.453a4.2 4.2 0 0 1 2.016-1.558 4.128 4.128 0 0 1 2.531-.092 4.187 4.187 0 0 1 2.122 1.406 4.316 4.316 0 0 1 .349 4.895 4.214 4.214 0 0 1-1.9 1.702 4.13 4.13 0 0 1-2.518.279 4.22 4.22 0 0 1-2.409-1.485 4.344 4.344 0 0 1-.957-2.694.3.3 0 0 0-.086-.21.29.29 0 0 0-.413 0 .3.3 0 0 0-.086.21c0 1 .303 1.974.867 2.792a4.785 4.785 0 0 0 2.29 1.776c.924.34 1.929.38 2.877.116a4.768 4.768 0 0 0 2.42-1.587c.488-.6.828-1.31.99-2.072.16-.76.14-1.55-.062-2.302A4.876 4.876 0 0 0 9 10.343 4.77 4.77 0 0 0 7.113 9.07a4.703 4.703 0 0 0-4.363.595 4.83 4.83 0 0 0-1.493 1.733 4.917 4.917 0 0 0-.538 2.236.3.3 0 0 0 .086.21.29.29 0 0 0 .413 0 .3.3 0 0 0 .086-.21Z"
+      }),
+      /* @__PURE__ */ jsx22("path", {
+        fill: "#528693",
+        d: "M3.096 13.634c.007-.644.262-1.26.71-1.715a2.406 2.406 0 0 1 1.689-.722c.051 0 .101-.02.138-.057a.2.2 0 0 0 0-.28.193.193 0 0 0-.138-.059c-.74.001-1.448.3-1.97.83a2.86 2.86 0 0 0-.819 2.003.2.2 0 0 0 .057.14.193.193 0 0 0 .276 0 .2.2 0 0 0 .057-.14Z"
+      }),
+      /* @__PURE__ */ jsx22("path", {
+        fill: "#FFBD54",
+        d: "M17.407 15.694c1.981 0 3.587-1.633 3.587-3.646 0-2.014-1.606-3.647-3.587-3.647-1.982 0-3.588 1.633-3.588 3.647s1.606 3.646 3.588 3.646Z"
+      }),
+      /* @__PURE__ */ jsx22("path", {
+        fill: "#528693",
+        d: "M14.22 13.11a3.4 3.4 0 0 1 .092-2.02 3.342 3.342 0 0 1 1.219-1.598 3.258 3.258 0 0 1 3.793.032c.551.402.968.967 1.192 1.619.223.651.244 1.357.058 2.021a3.353 3.353 0 0 1-1.098 1.687 3.265 3.265 0 0 1-1.852.737 3.288 3.288 0 0 1-2.133-.627 3.382 3.382 0 0 1-1.27-1.851.296.296 0 0 0-.138-.18.288.288 0 0 0-.398.113.302.302 0 0 0-.028.226 3.951 3.951 0 0 0 1.263 2.006 3.83 3.83 0 0 0 4.454.37 3.923 3.923 0 0 0 1.566-1.773c.33-.74.426-1.567.276-2.366a3.964 3.964 0 0 0-1.114-2.095 3.857 3.857 0 0 0-2.099-1.061c-.79-.126-1.6 0-2.317.36a3.965 3.965 0 0 0-1.804 1.916 4.054 4.054 0 0 0-.225 2.643c.094.37.658.211.564-.159Z"
+      }),
+      /* @__PURE__ */ jsx22("path", {
+        fill: "#528693",
+        d: "M15.588 12.738a1.96 1.96 0 0 1 .197-1.445 1.906 1.906 0 0 1 1.134-.894.196.196 0 0 0 .118-.093.201.201 0 0 0-.073-.27.192.192 0 0 0-.148-.019 2.304 2.304 0 0 0-1.368 1.082 2.37 2.37 0 0 0-.236 1.744c.014.05.047.092.092.118a.192.192 0 0 0 .264-.074.2.2 0 0 0 .02-.149ZM8.652 12.516a3.843 3.843 0 0 1-.376 2.692 3.644 3.644 0 0 1-1.792 1.594c-.14.057-.077.292.064.233a3.851 3.851 0 0 0 1.635-1.293 3.943 3.943 0 0 0 .736-1.968 3.897 3.897 0 0 0-.116-1.3.079.079 0 0 0-.038-.043.077.077 0 0 0-.101.029.08.08 0 0 0-.011.056h-.001ZM5.574 17.212c.025 0 .049-.01.066-.027a.095.095 0 0 0 0-.134.092.092 0 0 0-.131 0 .096.096 0 0 0 0 .134.092.092 0 0 0 .065.027ZM19.744 10.834a3.173 3.173 0 0 1-.138 2.498 3.014 3.014 0 0 1-1.68 1.464c-.14.049-.079.276.06.226a3.216 3.216 0 0 0 1.54-1.177 3.3 3.3 0 0 0 .6-1.862 3.198 3.198 0 0 0-.226-1.193c-.04-.095-.192-.057-.156.044ZM17.372 15.06a.09.09 0 0 0 .062-.153.087.087 0 0 0-.125 0 .09.09 0 0 0 .063.152ZM12.698 2.3c.137.257.217.541.235.833.008.291-.061.579-.201.832-.141.238-.34.435-.576.574a1.592 1.592 0 0 1-.777.219.111.111 0 0 0-.075.034.115.115 0 0 0 0 .158c.02.02.047.033.075.034.315-.001.624-.088.896-.25.27-.164.495-.397.648-.676.293-.544.306-1.36-.107-1.85-.059-.07-.152.02-.117.092h-.001ZM10.765 4.552c.025 0 .049-.01.067-.028a.097.097 0 0 0 0-.135.094.094 0 0 0-.134 0 .097.097 0 0 0 0 .135.094.094 0 0 0 .067.028Z"
+      }),
+      /* @__PURE__ */ jsx22("path", {
+        fill: "#528693",
+        d: "M18.347 4.75c1.175 0 1.177-1.857 0-1.857-1.178 0-1.178 1.858 0 1.858ZM16.12 5.824l-.003.056c.002.07.03.135.078.184a.265.265 0 0 0 .181.08l.07-.01a.258.258 0 0 0 .114-.068l.04-.053a.266.266 0 0 0 .035-.133l-.003-.056a.202.202 0 0 0-.022-.1.267.267 0 0 0-.234-.16l-.068.01a.256.256 0 0 0-.113.067l-.039.052a.26.26 0 0 0-.035.131ZM5.704 6.722c.573 0 .574-.905 0-.905-.575 0-.575.905 0 .905ZM3.623 2.902c1.3 0 1.301-2.052 0-2.052s-1.301 2.052 0 2.052Z",
+        opacity: ".05"
+      })
+    ]
+  });
+});
+Particle.displayName = "ParticleIcon";
+
+// src/iconography/warning.tsx
+import { forwardRef as forwardRef17 } from "react";
+import { jsx as jsx23, jsxs as jsxs16 } from "react/jsx-runtime";
+var Warning = forwardRef17((delegated, ref) => {
+  return /* @__PURE__ */ jsxs16("svg", {
+    ref,
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "22",
+    height: "22",
+    fill: "none",
+    viewBox: "0 0 22 22",
+    ...delegated,
+    children: [
+      /* @__PURE__ */ jsx23("path", {
+        d: "M9.67541 3.72993C10.2804 2.68198 11.793 2.68198 12.398 3.72993L19.8853 16.6982C20.4903 17.7462 19.734 19.0561 18.524 19.0561H3.54948C2.33942 19.0561 1.58313 17.7462 2.18816 16.6982L9.67541 3.72993Z",
+        fill: "#FFDE99"
+      }),
+      /* @__PURE__ */ jsx23("path", {
+        "fill-rule": "evenodd",
+        "clip-rule": "evenodd",
+        d: "M19.3657 16.9982L11.8784 4.02993C11.5043 3.38198 10.5691 3.38198 10.195 4.02993L2.70778 16.9982C2.33369 17.6462 2.8013 18.4561 3.54948 18.4561H18.524C19.2722 18.4561 19.7398 17.6462 19.3657 16.9982ZM12.398 3.72993C11.793 2.68198 10.2804 2.68198 9.67541 3.72993L2.18816 16.6982C1.58313 17.7462 2.33942 19.0561 3.54948 19.0561H18.524C19.734 19.0561 20.4903 17.7462 19.8853 16.6982L12.398 3.72993Z",
+        fill: "#528693"
+      }),
+      /* @__PURE__ */ jsx23("path", {
+        d: "M10.4293 8.73822C10.4293 8.33098 10.7595 8.00085 11.1667 8.00085V8.00085C11.5739 8.00085 11.9041 8.33098 11.9041 8.73822V12.3883C11.9041 12.7956 11.5739 13.1257 11.1667 13.1257V13.1257C10.7595 13.1257 10.4293 12.7956 10.4293 12.3883V8.73822Z",
+        fill: "white"
+      }),
+      /* @__PURE__ */ jsx23("path", {
+        "fill-rule": "evenodd",
+        "clip-rule": "evenodd",
+        d: "M12.504 8.73824V12.3883C12.504 13.127 11.9053 13.7257 11.1667 13.7257C10.4281 13.7257 9.82932 13.127 9.82932 12.3883V8.73825C9.82932 7.99964 10.4281 7.40088 11.1667 7.40088C11.9053 7.40088 12.504 7.99964 12.504 8.73824ZM11.1667 8.00088C10.7594 8.00088 10.4293 8.33101 10.4293 8.73825V12.3883C10.4293 12.7956 10.7594 13.1257 11.1667 13.1257C11.5739 13.1257 11.904 12.7956 11.904 12.3883V8.73824C11.904 8.33101 11.5739 8.00088 11.1667 8.00088Z",
+        fill: "#528693"
+      }),
+      /* @__PURE__ */ jsx23("path", {
+        d: "M11.9041 15.7807C11.9041 16.1879 11.5739 16.5181 11.1667 16.5181C10.7595 16.5181 10.4293 16.1879 10.4293 15.7807C10.4293 15.3735 10.7595 15.0433 11.1667 15.0433C11.5739 15.0433 11.9041 15.3735 11.9041 15.7807Z",
+        fill: "white"
+      }),
+      /* @__PURE__ */ jsx23("path", {
+        "fill-rule": "evenodd",
+        "clip-rule": "evenodd",
+        d: "M12.504 15.7807C12.504 16.5193 11.9053 17.1181 11.1667 17.1181C10.4281 17.1181 9.82932 16.5193 9.82932 15.7807C9.82932 15.0421 10.4281 14.4434 11.1667 14.4434C11.9053 14.4434 12.504 15.0421 12.504 15.7807ZM11.1667 16.5181C11.5739 16.5181 11.904 16.188 11.904 15.7807C11.904 15.3735 11.5739 15.0434 11.1667 15.0434C10.7594 15.0434 10.4293 15.3735 10.4293 15.7807C10.4293 16.188 10.7594 16.5181 11.1667 16.5181Z",
+        fill: "#528693"
       })
     ]
   });
 });
 Warning.displayName = "WarningIcon";
 
-// src/icons/index.ts
+// src/iconography/index.ts
 var Icon = {
   Arrow,
+  Atom,
   Cancel,
-  Dots,
+  Copy,
+  Crystal,
+  Edit,
   Error,
   Glasses,
   GraphQL,
   Info,
   NailPolish,
+  Particle,
   Warning
 };
 
-// src/action-menu/action-item.tsx
-import { cx as cx3 } from "class-variance-authority";
-import { jsx as jsx13 } from "react/jsx-runtime";
-function Item2({ children, className, onSelect }) {
-  return /* @__PURE__ */ jsx13(DropdownMenu.Item, {
-    onClick: onSelect,
-    className: cx3(
-      "items-center text-density cursor-pointer flex font-sans font-medium text-sm gap-2 py-2.5 px-5",
-      "hover:bg-[#f4f4f4]",
-      "[&.danger]:text-error",
-      className
-    ),
-    children
-  });
-}
-
-// src/action-menu/action-menu.tsx
-import { jsx as jsx14, jsxs as jsxs9 } from "react/jsx-runtime";
-function ActionMenu({ children, tabIndex }) {
-  return /* @__PURE__ */ jsx14(DropdownMenu.Root, {
-    content: children,
-    alignContent: "center",
-    children: /* @__PURE__ */ jsxs9("button", {
-      tabIndex,
-      type: "button",
-      className: cx4(
-        "items-center bg-transparent rounded-full border-none cursor-pointer flex justify-center p-1",
-        "hover:bg-gray-6 focus:bg-gray-6 focus:outline-offset-2 focus:outline focus:outline-1 focus:outline-glacier focus-visible:outline-offset-2 focus-visible:outline focus-visible:outline-1 focus-visible:outline-glacier",
-        "active:scale-95"
-      ),
-      "aria-label": "more options",
-      children: [
-        /* @__PURE__ */ jsx14("span", {
-          className: "sr-only",
-          children: "Open more options"
-        }),
-        /* @__PURE__ */ jsx14(Icon.Dots, {})
-      ]
-    })
-  });
-}
-ActionMenu.Item = Item2;
-
-// src/button/button.tsx
-import { forwardRef as forwardRef10 } from "react";
-import { cva } from "class-variance-authority";
-import { jsx as jsx15 } from "react/jsx-runtime";
-var DEFAULT_TEXT_COLOR = "text-black-text disabled:text-black-text/50";
-var buttonStyles = cva(
-  [
-    "inline-grid grid-flow-col items-center gap-2 rounded border-none font-medium cursor-pointer whitespace-nowrap",
-    "disabled:cursor-default disabled:scale-100 disabled:drop-shadow-none",
-    "active:scale-95",
-    "focus:drop-shadow-active",
-    "hover:drop-shadow-hover"
-  ],
-  {
-    variants: {
-      variant: {
-        primary: `bg-neptune disabled:bg-neptune-light ${DEFAULT_TEXT_COLOR}`,
-        secondary: `bg-white disabled:bg-[#FBFCFC] ${DEFAULT_TEXT_COLOR}`,
-        "secondary-dark": `bg-cosmos disabled:bg-[#F7F8F9] ${DEFAULT_TEXT_COLOR}`,
-        danger: "text-white bg-error disabled:bg-error/50 disabled:text-white/75"
-      },
-      size: {
-        xs: "h-8 px-5",
-        sm: "h-9 px-6",
-        md: "h-10 px-7",
-        lg: "h-10 px-8",
-        xl: "h-11 px-9"
-      }
-    },
-    defaultVariants: {
-      variant: "primary",
-      size: "sm"
-    }
-  }
-);
-var Button = forwardRef10(
-  ({ children, className, type = "button", size, variant, ...delegated }, ref) => {
-    return /* @__PURE__ */ jsx15("button", {
-      ref,
-      type,
-      className: buttonStyles({ size, variant, className }),
-      ...delegated,
-      children
-    });
-  }
-);
-Button.displayName = "Button";
-
-// src/card/card.tsx
-import { cva as cva2 } from "class-variance-authority";
-import { jsx as jsx16 } from "react/jsx-runtime";
-var cardStyles = cva2("rounded-lg p-4 sm:p-8", {
-  variants: {
-    variant: {
-      gray: "bg-jupiter",
-      white: "bg-white"
-    }
-  },
-  defaultVariants: {
-    variant: "gray"
-  }
-});
-function Card({ children, className, variant, ...delegated }) {
-  return /* @__PURE__ */ jsx16("section", {
-    className: cardStyles({ variant, className }),
-    ...delegated,
-    children
-  });
-}
-
-// src/checkbox/checkbox.tsx
-import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
-import { cx as cx5 } from "class-variance-authority";
-import { forwardRef as forwardRef11 } from "react";
-import { jsx as jsx17, jsxs as jsxs10 } from "react/jsx-runtime";
-var Checkbox = forwardRef11((props, ref) => {
-  return /* @__PURE__ */ jsx17(CheckboxPrimitive.Root, {
-    ...props,
-    ref,
-    className: cx5(
-      "flex h-3.5 w-3.5 items-center justify-center rounded-sm border border-solid border-[#ddd] bg-white",
-      "focus:outline-none focus:ring-1 focus:ring-[#528693] focus:ring-offset-1",
-      "radix-state-checked:border-[#528693] radix-state-checked:bg-neptune",
-      "radix-state-checked:disabled:opacity-40 radix-state-unchecked:disabled:!bg-[#ddd]/20"
-    ),
-    children: /* @__PURE__ */ jsx17(CheckboxPrimitive.Indicator, {
-      children: /* @__PURE__ */ jsxs10("svg", {
-        viewBox: "0 0 9 9",
-        fill: "none",
-        className: "h-2 w-2",
-        children: [
-          /* @__PURE__ */ jsx17("path", {
-            d: "M1.12 5.51a.559.559 0 01.832-.101l2.201 1.953-.427.624a.326.326 0 01-.486.06L1.21 6.245a.559.559 0 01-.09-.734z",
-            fill: "#528693"
-          }),
-          /* @__PURE__ */ jsx17("path", {
-            d: "M7.883 1.087c.043.03.053.09.023.132L3.669 7.132l-.154-.105L7.754 1.11a.093.093 0 01.129-.023z",
-            stroke: "#528693"
-          })
-        ]
-      })
-    })
-  });
-});
-Checkbox.displayName = "Checkbox";
-
-// src/dialog/destroyFns.ts
-var destroyFns = [];
-
 // src/dialog/dialog.tsx
-import * as DialogPrimitive from "@radix-ui/react-dialog";
-import { cva as cva3, cx as cx6 } from "class-variance-authority";
-import { jsx as jsx18, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx24, jsxs as jsxs17 } from "react/jsx-runtime";
 var IconMap = {
   error: Icon.Error,
   info: Icon.Info,
   warning: Icon.Warning
 };
-var dialogContentStyles = cva3(
-  "bg-white rounded shadow fixed top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 max-w-xl w-auto p-6",
-  {
-    variants: {
-      withIcon: {
-        true: "flex gap-4 items-start"
-      }
+var dialogContentStyles = cva4("c-dialog", {
+  variants: {
+    withIcon: {
+      true: "c-dialog-with-icon"
     }
   }
-);
+});
 function DialogContent({ children, closable = true, type, className, container, ...delegated }) {
   const withIcon = typeof type !== "undefined";
   const IconComponent = type && IconMap[type];
-  return /* @__PURE__ */ jsxs11(DialogPrimitive.Portal, {
+  return /* @__PURE__ */ jsxs17(DialogPrimitive.Portal, {
     container,
     children: [
-      /* @__PURE__ */ jsx18(DialogPrimitive.Overlay, {
-        className: "bg-black/30 fixed inset-0"
+      /* @__PURE__ */ jsx24(DialogPrimitive.Overlay, {
+        className: "c-dialog-overlay"
       }),
-      /* @__PURE__ */ jsxs11(DialogPrimitive.Content, {
+      /* @__PURE__ */ jsxs17(DialogPrimitive.Content, {
         className: dialogContentStyles({ withIcon, class: className }),
         ...delegated,
         children: [
-          IconComponent && /* @__PURE__ */ jsx18(IconComponent, {
-            className: "my-1 shrink-0",
-            width: 32,
-            height: 32
+          IconComponent && /* @__PURE__ */ jsx24("div", {
+            className: "flex h-[44px] w-[44px]  min-w-[44px] items-center justify-center rounded-lg bg-gray-50-900 p-[5px]",
+            children: /* @__PURE__ */ jsx24(IconComponent, {
+              className: "c-dialog-icon",
+              width: 34,
+              height: 34
+            })
           }),
-          closable && /* @__PURE__ */ jsx18(DialogClose, {
+          closable && /* @__PURE__ */ jsx24(DialogClose, {
             asChild: true,
-            children: /* @__PURE__ */ jsx18(Button, {
-              className: "absolute top-2.5 right-2.5 !rounded-full !p-0 h-6 w-6 inline-flex items-center justify-center !bg-transparent hover:!bg-gray-200 focus:!bg-gray-200 !drop-shadow-none",
-              children: /* @__PURE__ */ jsx18(Icon.Cancel, {
+            children: /* @__PURE__ */ jsx24(Button, {
+              className: "c-dialog-close-button",
+              children: /* @__PURE__ */ jsx24(Icon.Cancel, {
                 color: "density",
                 "aria-label": "Close",
-                height: 18,
-                width: 18
+                height: 16,
+                width: 16
               })
             })
           }),
-          /* @__PURE__ */ jsx18("div", {
+          /* @__PURE__ */ jsx24("div", {
             children
           })
         ]
@@ -759,14 +1177,14 @@ function DialogContent({ children, closable = true, type, className, container,
   });
 }
 function DialogTitle({ className, ...delegated }) {
-  return /* @__PURE__ */ jsx18(DialogPrimitive.Title, {
-    className: cx6("m-0 font-medium text-xl font-sans text-black-text", className),
+  return /* @__PURE__ */ jsx24(DialogPrimitive.Title, {
+    className: cx4("c-dialog-title", className),
     ...delegated
   });
 }
 function DialogDescription(delegated) {
-  return /* @__PURE__ */ jsx18(DialogPrimitive.Description, {
-    className: "mt-2 mb-5 text-gray-600",
+  return /* @__PURE__ */ jsx24(DialogPrimitive.Description, {
+    className: "c-dialog-description",
     ...delegated
   });
 }
@@ -774,7 +1192,7 @@ var DialogTrigger = DialogPrimitive.Trigger;
 var DialogClose = DialogPrimitive.Close;
 var DialogRoot = DialogPrimitive.Root;
 function DialogBase({ children, ...delegated }) {
-  return /* @__PURE__ */ jsx18(DialogRoot, {
+  return /* @__PURE__ */ jsx24(DialogRoot, {
     ...delegated,
     children
   });
@@ -789,7 +1207,7 @@ DialogBase.Overlay = DialogPrimitive.Overlay;
 import { unmountComponentAtNode, render as DOMRender } from "react-dom";
 
 // src/dialog/confirm-dialog.tsx
-import { jsx as jsx19, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx25, jsxs as jsxs18 } from "react/jsx-runtime";
 function ConfirmDialog({
   open,
   close,
@@ -798,43 +1216,46 @@ function ConfirmDialog({
   content,
   okCancel,
   okText = "OK",
+  okButtonIntent = "default",
   onOk,
   onCancel,
   cancelText = "Cancel",
   onEscapeKeyDown,
   onInteractOutside,
   onPointerDownOutside,
-  type
+  type,
+  closable
 }) {
-  const cancelButton = okCancel && /* @__PURE__ */ jsx19(Button, {
-    variant: "secondary",
+  const cancelButton = okCancel && /* @__PURE__ */ jsx25(Button, {
     onClick: () => {
       onCancel?.();
       close();
     },
     children: cancelText
   });
-  return /* @__PURE__ */ jsx19(DialogRoot, {
+  return /* @__PURE__ */ jsx25(DialogRoot, {
     open,
     onOpenChange: () => close(),
-    children: /* @__PURE__ */ jsxs12(Dialog.Content, {
+    children: /* @__PURE__ */ jsxs18(Dialog.Content, {
       onEscapeKeyDown,
       onInteractOutside,
       onPointerDownOutside,
       type,
+      closable,
       children: [
-        title && /* @__PURE__ */ jsx19(Dialog.Title, {
+        title && /* @__PURE__ */ jsx25(Dialog.Title, {
           children: title
         }),
-        description && /* @__PURE__ */ jsx19(Dialog.Description, {
+        description && /* @__PURE__ */ jsx25(Dialog.Description, {
           children: description
         }),
         content,
-        /* @__PURE__ */ jsxs12("div", {
-          className: "flex items-center gap-4 mt-4 justify-end",
+        /* @__PURE__ */ jsxs18("div", {
+          className: "mt-4 flex items-center justify-end gap-4",
           children: [
             cancelButton,
-            /* @__PURE__ */ jsx19(Button, {
+            /* @__PURE__ */ jsx25(Button, {
+              intent: okButtonIntent,
               onClick: () => {
                 onOk?.();
                 close();
@@ -849,7 +1270,7 @@ function ConfirmDialog({
 }
 
 // src/dialog/config.tsx
-import { jsx as jsx20 } from "react/jsx-runtime";
+import { jsx as jsx26 } from "react/jsx-runtime";
 function confirm(config) {
   const container = document.createDocumentFragment();
   let currentConfig = { ...config, close, open: true };
@@ -885,7 +1306,7 @@ function confirm(config) {
   function render({ okText, cancelText, ...delegated }) {
     clearTimeout(timeoutId);
     timeoutId = setTimeout(() => {
-      DOMRender(/* @__PURE__ */ jsx20(ConfirmDialog, {
+      DOMRender(/* @__PURE__ */ jsx26(ConfirmDialog, {
         ...delegated,
         okText,
         cancelText
@@ -988,36 +1409,26 @@ function destroyAll() {
 }
 
 // src/icon-button/icon-button.tsx
-import { forwardRef as forwardRef12 } from "react";
-import { cva as cva4 } from "class-variance-authority";
-import { jsx as jsx21 } from "react/jsx-runtime";
-var buttonStyles2 = cva4(
-  [
-    "flex items-center justify-center rounded-full font-medium cursor-pointer",
-    "disabled:cursor-default disabled:scale-100 disabled:shadow-none",
-    "active:scale-95",
-    "focus:shadow focus:bg-slate-200",
-    "hover:shadow hover:bg-slate-200",
-    "focus-visible:outline-inherit focus-visible:outline-offset-1 focus-visible:outline focus-visible:outline-1"
-  ],
-  {
-    variants: {
-      size: {
-        xs: "h-8 w-8",
-        sm: "h-9 w-9",
-        md: "h-10 w-10",
-        lg: "h-10 w-10",
-        xl: "h-11 w-11"
-      }
-    },
-    defaultVariants: {
-      size: "sm"
+import { forwardRef as forwardRef18 } from "react";
+import { cva as cva5 } from "class-variance-authority";
+import { jsx as jsx27 } from "react/jsx-runtime";
+var buttonStyles2 = cva5(["c-icon-button"], {
+  variants: {
+    size: {
+      xxs: "c-icon-button-xxs",
+      xs: "c-icon-button-xs",
+      sm: "c-icon-button-sm",
+      md: "c-icon-button-md",
+      lg: "c-icon-button-lg"
     }
+  },
+  defaultVariants: {
+    size: "sm"
   }
-);
-var IconButton = forwardRef12(
+});
+var IconButton = forwardRef18(
   ({ children, className, type = "button", size, ...delegated }, ref) => {
-    return /* @__PURE__ */ jsx21("button", {
+    return /* @__PURE__ */ jsx27("button", {
       ref,
       type,
       className: buttonStyles2({ size, className }),
@@ -1030,26 +1441,19 @@ IconButton.displayName = "Button";
 
 // src/inline-radio/inline-radio.tsx
 import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
-import { cx as cx7 } from "class-variance-authority";
-import { jsx as jsx22 } from "react/jsx-runtime";
+import { cx as cx5 } from "class-variance-authority";
+import { jsx as jsx28 } from "react/jsx-runtime";
 function InlineRadioGroup(delegated) {
-  return /* @__PURE__ */ jsx22(RadioGroupPrimitive.Root, {
+  return /* @__PURE__ */ jsx28(RadioGroupPrimitive.Root, {
     ...delegated,
-    className: "inline-flex space-x-1 rounded-sm bg-[#9095a81a] p-[3px]"
+    className: "c-inline-radio-root"
   });
 }
 function InlineRadioItem({ children, className, ...delegated }) {
-  return /* @__PURE__ */ jsx22(RadioGroupPrimitive.Item, {
+  return /* @__PURE__ */ jsx28(RadioGroupPrimitive.Item, {
     ...delegated,
-    className: cx7(
-      "m-0 p-0",
-      "flex cursor-pointer items-center justify-center rounded border-none bg-transparent text-sm leading-none text-zinc-800",
-      "disabled:cursor-not-allowed",
-      "radix-state-checked:bg-white radix-state-checked:shadow-sm",
-      "focus:outline-neptune",
-      className
-    ),
-    children: /* @__PURE__ */ jsx22(RadioGroupPrimitive.Indicator, {
+    className: cx5("c-inline-radio", className),
+    children: /* @__PURE__ */ jsx28(RadioGroupPrimitive.Indicator, {
       forceMount: true,
       children
     })
@@ -1061,32 +1465,17 @@ var InlineRadio = {
 };
 
 // src/input/input.tsx
-import { cva as cva5 } from "class-variance-authority";
-import { forwardRef as forwardRef13 } from "react";
-import { jsx as jsx23 } from "react/jsx-runtime";
-var inputStyles = cva5(
-  [
-    "p-0 border-none text-zinc-800",
-    "focus:outline-none",
-    "placeholder:italic placeholder:font-light placeholder:text-gray-400 placeholder:text-sm",
-    "disabled:cursor-default"
-  ],
-  {
-    variants: {
-      paper: {
-        white: "bg-white",
-        gray: "bg-jupiter"
-      }
-    },
-    defaultVariants: {
-      paper: "gray"
-    }
-  }
-);
-var Input = forwardRef13(({ className, paper, ...delegated }, ref) => {
-  return /* @__PURE__ */ jsx23("input", {
+import { cva as cva6 } from "class-variance-authority";
+import { forwardRef as forwardRef19 } from "react";
+import { jsx as jsx29 } from "react/jsx-runtime";
+var inputStyles = cva6(["c-input"], {
+  variants: {},
+  defaultVariants: {}
+});
+var Input = forwardRef19(({ className, ...delegated }, ref) => {
+  return /* @__PURE__ */ jsx29("input", {
     ref,
-    className: inputStyles({ className, paper }),
+    className: inputStyles({ className }),
     type: "text",
     ...delegated
   });
@@ -1094,13 +1483,13 @@ var Input = forwardRef13(({ className, paper, ...delegated }, ref) => {
 Input.displayName = "Input";
 
 // src/label/label.tsx
-import { forwardRef as forwardRef14 } from "react";
-import { cx as cx8 } from "class-variance-authority";
-import { jsx as jsx24 } from "react/jsx-runtime";
-var Label2 = forwardRef14(({ className, ...delegated }, ref) => {
-  return /* @__PURE__ */ jsx24("label", {
+import { forwardRef as forwardRef20 } from "react";
+import { cx as cx6 } from "class-variance-authority";
+import { jsx as jsx30 } from "react/jsx-runtime";
+var Label2 = forwardRef20(({ className, ...delegated }, ref) => {
+  return /* @__PURE__ */ jsx30("label", {
     ref,
-    className: cx8("text-xs font-medium text-gray-400", className),
+    className: cx6("c-label", className),
     ...delegated
   });
 });
@@ -1108,33 +1497,28 @@ Label2.displayName = "Label";
 
 // src/progress/progress.tsx
 import * as ProgressPrimitives from "@radix-ui/react-progress";
-import { jsx as jsx25 } from "react/jsx-runtime";
-function Progress({ value }) {
-  return /* @__PURE__ */ jsx25(ProgressPrimitives.Root, {
-    className: "relative overflow-hidden rounded-full w-full h-6 bg-neutral-200",
+import { cx as cx7 } from "class-variance-authority";
+import { jsx as jsx31 } from "react/jsx-runtime";
+function Progress({ className, value }) {
+  return /* @__PURE__ */ jsx31(ProgressPrimitives.Root, {
+    className: cx7(className, "c-progress-root"),
     value,
-    children: /* @__PURE__ */ jsx25(ProgressPrimitives.Indicator, {
-      className: "bg-[#50dbdc] w-full h-full transform ease-linear duration-500",
-      style: { transform: `translateX(-${100 - value}%)` }
+    children: /* @__PURE__ */ jsx31(ProgressPrimitives.Indicator, {
+      className: "c-progress-indicator",
+      style: { transform: `translateX(-${100 - (value ?? 0)}%)` }
     })
   });
 }
 
 // src/radio/radio.tsx
 import * as RadioGroupPrimitive2 from "@radix-ui/react-radio-group";
-import { cx as cx9 } from "class-variance-authority";
-import { jsx as jsx26 } from "react/jsx-runtime";
+import { jsx as jsx32 } from "react/jsx-runtime";
 function RadioGroupItem(props) {
-  return /* @__PURE__ */ jsx26(RadioGroupPrimitive2.Item, {
+  return /* @__PURE__ */ jsx32(RadioGroupPrimitive2.Item, {
     ...props,
-    className: cx9(
-      "flex h-3 w-3 flex-shrink-0 items-center justify-center rounded-full border border-solid border-[#ddd] bg-white p-0",
-      "focus:outline-none",
-      "disabled:bg-[#ddd]/20",
-      "radix-state-checked:border-[#528693] radix-state-checked:bg-neptune"
-    ),
-    children: /* @__PURE__ */ jsx26(RadioGroupPrimitive2.Indicator, {
-      className: cx9("block h-[6px] w-[6px] rounded-full bg-[#528693]")
+    className: "c-radio-item",
+    children: /* @__PURE__ */ jsx32(RadioGroupPrimitive2.Indicator, {
+      className: "c-radio-indicator"
     })
   });
 }
@@ -1144,64 +1528,59 @@ var Radio = {
 };
 
 // src/select/select-item.tsx
-import { forwardRef as forwardRef15 } from "react";
+import { forwardRef as forwardRef21 } from "react";
 import * as SelectPrimitives from "@radix-ui/react-select";
-import { cx as cx10 } from "class-variance-authority";
-import { jsx as jsx27, jsxs as jsxs13 } from "react/jsx-runtime";
-var SelectItem = forwardRef15((props, ref) => {
+import { jsx as jsx33, jsxs as jsxs19 } from "react/jsx-runtime";
+var SelectItem = forwardRef21((props, ref) => {
   const { children, ...delegated } = props;
-  return /* @__PURE__ */ jsxs13(SelectPrimitives.Item, {
-    className: cx10(
-      "flex cursor-pointer items-center whitespace-nowrap px-6 py-2 font-medium",
-      "focus:bg-neptune/20",
-      "hover:bg-neptune/20"
-    ),
+  return /* @__PURE__ */ jsxs19(SelectPrimitives.Item, {
+    className: "c-select-item",
     ref,
     ...delegated,
     children: [
-      /* @__PURE__ */ jsx27(SelectPrimitives.ItemText, {
+      /* @__PURE__ */ jsx33(SelectPrimitives.ItemText, {
         children
       }),
-      /* @__PURE__ */ jsx27(SelectPrimitives.ItemIndicator, {})
+      /* @__PURE__ */ jsx33(SelectPrimitives.ItemIndicator, {})
     ]
   });
 });
 SelectItem.displayName = "SelectItem";
 
 // src/select/select-root.tsx
-import { forwardRef as forwardRef16 } from "react";
+import { forwardRef as forwardRef22 } from "react";
 import * as SelectPrimitives2 from "@radix-ui/react-select";
-import { jsx as jsx28, jsxs as jsxs14 } from "react/jsx-runtime";
-var SelectContainer = forwardRef16(
+import { jsx as jsx34, jsxs as jsxs20 } from "react/jsx-runtime";
+var SelectContainer = forwardRef22(
   ({ children, id, placeholder, disabled, ...delegated }, ref) => {
-    return /* @__PURE__ */ jsxs14(SelectPrimitives2.Root, {
+    return /* @__PURE__ */ jsxs20(SelectPrimitives2.Root, {
       ...delegated,
       children: [
-        /* @__PURE__ */ jsxs14(SelectPrimitives2.Trigger, {
+        /* @__PURE__ */ jsxs20(SelectPrimitives2.Trigger, {
           ref,
-          className: "inline-flex cursor-pointer items-center justify-center gap-4 whitespace-nowrap rounded border-0 bg-white px-4 py-3 text-sm font-medium text-black-text shadow disabled:cursor-default disabled:opacity-50",
+          className: "c-select-trigger",
           disabled,
           id,
           children: [
-            /* @__PURE__ */ jsx28(SelectPrimitives2.Value, {
-              placeholder: /* @__PURE__ */ jsx28("span", {
-                className: "italic text-label",
+            /* @__PURE__ */ jsx34(SelectPrimitives2.Value, {
+              placeholder: /* @__PURE__ */ jsx34("span", {
+                className: "c-select-value",
                 children: placeholder ?? "Select..."
               })
             }),
-            /* @__PURE__ */ jsx28(Icon.Arrow, {})
+            /* @__PURE__ */ jsx34(Icon.Arrow, {})
           ]
         }),
-        /* @__PURE__ */ jsx28(SelectPrimitives2.Portal, {
-          children: /* @__PURE__ */ jsxs14(SelectPrimitives2.Content, {
-            className: "overflow-hidden rounded bg-white text-black-text shadow",
+        /* @__PURE__ */ jsx34(SelectPrimitives2.Portal, {
+          children: /* @__PURE__ */ jsxs20(SelectPrimitives2.Content, {
+            className: "c-select-content",
             children: [
-              /* @__PURE__ */ jsx28(SelectPrimitives2.ScrollUpButton, {}),
-              /* @__PURE__ */ jsx28(SelectPrimitives2.Viewport, {
-                className: "py-2",
+              /* @__PURE__ */ jsx34(SelectPrimitives2.ScrollUpButton, {}),
+              /* @__PURE__ */ jsx34(SelectPrimitives2.Viewport, {
+                className: "c-select-viewport",
                 children
               }),
-              /* @__PURE__ */ jsx28(SelectPrimitives2.ScrollDownButton, {})
+              /* @__PURE__ */ jsx34(SelectPrimitives2.ScrollDownButton, {})
             ]
           })
         })
@@ -1217,69 +1596,87 @@ var Select = {
   Item: SelectItem
 };
 
-// src/text-field/text-field.tsx
-import { forwardRef as forwardRef17 } from "react";
-import { cva as cva6 } from "class-variance-authority";
-import { Fragment, jsx as jsx29, jsxs as jsxs15 } from "react/jsx-runtime";
-var textFieldStyles = cva6(
-  ["relative gap-3 flex flex-col p-3 text-sm font-medium text-gray-400 rounded border border-transparent border-solid"],
-  {
-    variants: {
-      variant: {
-        outlined: "",
-        filled: "",
-        standard: ""
-      },
-      raised: {
-        sm: "shadow-sm",
-        md: "shadow-md",
-        lg: "shadow-lg"
-      },
-      paper: {
-        white: "bg-white",
-        gray: "bg-jupiter"
-      },
-      error: {
-        true: "border-rose-800 text-rose-800"
-      }
+// src/input-with-label/input-with-label.tsx
+import { forwardRef as forwardRef24 } from "react";
+import { cva as cva7, cx as cx8 } from "class-variance-authority";
+
+// src/iconography/triangle.tsx
+import { forwardRef as forwardRef23 } from "react";
+import { jsx as jsx35 } from "react/jsx-runtime";
+var Triangle = forwardRef23((delegated, ref) => {
+  const { width = 20, height = 20, ...rest } = delegated;
+  return /* @__PURE__ */ jsx35("svg", {
+    viewBox: "0 0 17 15",
+    width,
+    height,
+    ref,
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    ...rest,
+    children: /* @__PURE__ */ jsx35("path", {
+      d: "M15.463 1.2L8.5 12.685 1.537 1.2h13.925zM1.353.896s0 0 0 0h0z",
+      stroke: "currentColor",
+      strokeWidth: 2.4
+    })
+  });
+});
+
+// src/input-with-label/input-with-label.tsx
+import { Fragment, jsx as jsx36, jsxs as jsxs21 } from "react/jsx-runtime";
+var inputWithLabelStyles = cva7(["c-input-with-label"], {
+  variants: {
+    variant: {
+      default: "",
+      elevated: "c-input-with-label-elevated",
+      outlined: "c-input-with-label-outlined"
     },
-    defaultVariants: {
-      variant: "standard",
-      paper: "white"
+    status: {
+      error: "c-input-with-label--error"
     }
-  }
-);
-var TextField = forwardRef17(
-  ({ variant, raised, className, label, paper, endAdornment, error, ...delegated }, ref) => {
-    return /* @__PURE__ */ jsxs15(Fragment, {
-      children: [
-        /* @__PURE__ */ jsxs15("label", {
-          className: textFieldStyles({ variant, raised, paper, error: Boolean(error), className }),
-          children: [
-            label,
-            /* @__PURE__ */ jsx29(Input, {
-              ref,
-              className: "w-10/12 text-ellipsis overflow-hidden",
-              type: "text",
-              ...delegated
-            }),
-            /* @__PURE__ */ jsx29("div", {
-              className: "absolute right-1 top-2/3 -translate-y-1/2 ",
-              children: endAdornment
-            })
-          ]
-        }),
-        error && /* @__PURE__ */ jsx29("div", {
-          className: "text-rose-800 text-sm px-3 !mt-1",
-          children: error
-        })
-      ]
+  },
+  defaultVariants: {}
+});
+var InputWithLabel = forwardRef24(
+  ({ className, label, append, errorMessage, status, variant, id, labelProps, ...delegated }, ref) => {
+    const { className: labelClassName, ...labelPropsRest } = labelProps ?? {};
+    return /* @__PURE__ */ jsx36(Fragment, {
+      children: /* @__PURE__ */ jsxs21(Label2, {
+        className: inputWithLabelStyles({ status, variant, className: labelClassName }),
+        htmlFor: id,
+        ...labelPropsRest,
+        children: [
+          label,
+          /* @__PURE__ */ jsxs21("span", {
+            className: "c-input-with-label-input-wrap",
+            children: [
+              /* @__PURE__ */ jsx36(Input, {
+                className: cx8("c-input-with-label-input", className),
+                ref,
+                id,
+                ...delegated
+              }),
+              !append && !errorMessage ? null : /* @__PURE__ */ jsx36("div", {
+                className: "c-input-with-label-append",
+                title: errorMessage,
+                children: errorMessage ? /* @__PURE__ */ jsx36(Triangle, {}) : append
+              })
+            ]
+          })
+        ]
+      })
     });
   }
 );
-TextField.displayName = "TextField";
+InputWithLabel.displayName = "InputWithLabel";
+
+// src/index.ts
+var tokens = {
+  button: buttonTokens,
+  card: cardToken
+};
 export {
   ActionMenu,
+  Avatar,
   Button,
   Card,
   Checkbox,
@@ -1289,15 +1686,18 @@ export {
   IconButton,
   InlineRadio,
   Input,
+  InputWithLabel,
   Label2 as Label,
   Progress,
   Radio,
   Select,
-  TextField,
+  buttonTokens,
+  cardToken,
   destroyAll,
   showConfirm,
   showDialog,
   showError,
   showInfo,
-  showWarning
+  showWarning,
+  tokens
 };