@fanvue/ui 1.16.3 → 1.16.5

package/README.md

@@ -2,6 +2,7 @@
 
 React component library built with Tailwind CSS for the Fanvue ecosystem.
 
+
 [![CI](https://github.com/fanvue/fanv-ui/actions/workflows/ci.yml/badge.svg)](https://github.com/fanvue/fanv-ui/actions/workflows/ci.yml)
 [![Chromatic](https://github.com/fanvue/fanv-ui/actions/workflows/chromatic.yml/badge.svg)](https://github.com/fanvue/fanv-ui/actions/workflows/chromatic.yml)
 [![npm version](https://img.shields.io/npm/v/@fanvue/ui.svg)](https://www.npmjs.com/package/@fanvue/ui)

package/dist/cjs/components/Alert/Alert.cjs

@@ -34,10 +34,10 @@ const DEFAULT_ICONS = {
   error: /* @__PURE__ */ jsxRuntime.jsx(ErrorCircleIcon.ErrorCircleIcon, {})
 };
 const CLOSE_BUTTON_CLASSES = {
-  info: "hover:bg-info-default active:bg-info-default text-info-default motion-safe:transition-colors motion-safe:duration-150",
-  success: "hover:bg-success-default active:bg-success-default text-success-default motion-safe:transition-colors motion-safe:duration-150",
-  warning: "hover:bg-warning-default active:bg-warning-default text-warning-default motion-safe:transition-colors motion-safe:duration-150",
-  error: "hover:bg-error-default active:bg-error-default text-error-default motion-safe:transition-colors motion-safe:duration-150"
+  info: "hover:bg-info-default/10 active:bg-info-default/20 text-info-default motion-safe:transition-colors motion-safe:duration-150",
+  success: "hover:bg-success-default/10 active:bg-success-default/20 text-success-default motion-safe:transition-colors motion-safe:duration-150",
+  warning: "hover:bg-warning-default/10 active:bg-warning-default/20 text-warning-default motion-safe:transition-colors motion-safe:duration-150",
+  error: "hover:bg-error-default/10 active:bg-error-default/20 text-error-default motion-safe:transition-colors motion-safe:duration-150"
 };
 const Alert = React__namespace.forwardRef(
   ({

package/dist/cjs/components/Alert/Alert.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Alert.cjs","sources":["../../../../src/components/Alert/Alert.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Button } from \"../Button/Button\";\nimport { CheckCircleIcon } from \"../Icons/CheckCircleIcon\";\nimport { CrossIcon } from \"../Icons/CrossIcon\";\nimport { ErrorCircleIcon } from \"../Icons/ErrorCircleIcon\";\nimport { InfoCircleIcon } from \"../Icons/InfoCircleIcon\";\nimport { WarningTriangleIcon } from \"../Icons/WarningTriangleIcon\";\n\n/** Visual style variant of the alert. */\nexport type AlertVariant = \"info\" | \"success\" | \"warning\" | \"error\";\n\nconst DEFAULT_ICONS: Record<AlertVariant, React.ReactNode> = {\n  info: <InfoCircleIcon />,\n  success: <CheckCircleIcon />,\n  warning: <WarningTriangleIcon />,\n  error: <ErrorCircleIcon />,\n};\n\nexport interface AlertProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Visual style variant of the alert. @default \"info\" */\n  variant?: AlertVariant;\n  /** Optional title text displayed in bold above the description. */\n  title?: string;\n  /** Custom icon override. Pass `null` to hide the icon entirely. Each variant shows a default icon when left `undefined`. */\n  icon?: React.ReactNode | null;\n  /** Whether to show the close button. @default false */\n  closable?: boolean;\n  /** Callback fired when the close button is clicked. */\n  onClose?: () => void;\n  /** Accessible label for the close button. @default \"Close alert\" */\n  closeLabel?: string;\n}\n\nconst CLOSE_BUTTON_CLASSES: Record<AlertVariant, string> = {\n  info: \"hover:bg-info-default active:bg-info-default text-info-default motion-safe:transition-colors motion-safe:duration-150\",\n  success:\n    \"hover:bg-success-default active:bg-success-default text-success-default motion-safe:transition-colors motion-safe:duration-150\",\n  warning:\n    \"hover:bg-warning-default active:bg-warning-default text-warning-default motion-safe:transition-colors motion-safe:duration-150\",\n  error:\n    \"hover:bg-error-default active:bg-error-default text-error-default motion-safe:transition-colors motion-safe:duration-150\",\n};\n\n/**\n * Displays a contextual feedback message to the user.\n *\n * Supports `info`, `success`, `warning`, and `error` variants with a default\n * icon per variant, optional title, description, and dismiss button.\n *\n * Each variant renders a default icon automatically. Pass a custom `icon` to\n * override, or `icon={null}` to hide the icon entirely.\n *\n * @example\n * ```tsx\n * <Alert variant=\"success\" title=\"Saved\" closable onClose={handleClose}>\n *   Your changes have been saved.\n * </Alert>\n * ```\n */\nexport const Alert = React.forwardRef<HTMLDivElement, AlertProps>(\n  (\n    {\n      className,\n      variant = \"info\",\n      title,\n      icon,\n      closable = false,\n      onClose,\n      closeLabel = \"Close alert\",\n      children,\n      ...props\n    },\n    ref,\n  ) => {\n    const resolvedIcon = icon === null ? null : (icon ?? DEFAULT_ICONS[variant]);\n\n    return (\n      <div\n        ref={ref}\n        role=\"alert\"\n        data-testid=\"alert\"\n        className={cn(\n          \"grid gap-x-3 rounded-lg p-4 text-sm leading-[18px]\",\n          resolvedIcon && closable && \"grid-cols-[auto_1fr_auto]\",\n          resolvedIcon && !closable && \"grid-cols-[auto_1fr]\",\n          !resolvedIcon && closable && \"grid-cols-[1fr_auto]\",\n          !resolvedIcon && !closable && \"grid-cols-[1fr]\",\n          title && children ? \"items-start\" : \"items-center\",\n          variant === \"info\" && \"bg-info-background text-info-default\",\n          variant === \"success\" && \"bg-success-background text-success-default\",\n          variant === \"warning\" && \"bg-warning-background text-warning-default\",\n          variant === \"error\" && \"bg-error-background text-error-default\",\n          className,\n        )}\n        {...props}\n      >\n        {resolvedIcon && (\n          <span className=\"flex shrink-0 items-start\" aria-hidden=\"true\">\n            {resolvedIcon}\n          </span>\n        )}\n\n        <div className=\"flex min-w-0 flex-col gap-2\">\n          {title && (\n            <div className=\"typography-semibold-body-md text-foreground-default\">{title}</div>\n          )}\n          <div className=\"typography-regular-body-md text-foreground-secondary\">{children}</div>\n        </div>\n\n        {closable && (\n          <Button\n            variant=\"tertiary\"\n            size=\"24\"\n            onClick={onClose}\n            className={cn(\"self-start px-0\", CLOSE_BUTTON_CLASSES[variant])}\n            aria-label={closeLabel}\n          >\n            <CrossIcon />\n          </Button>\n        )}\n      </div>\n    );\n  },\n);\n\nAlert.displayName = \"Alert\";\n"],"names":["InfoCircleIcon","CheckCircleIcon","WarningTriangleIcon","ErrorCircleIcon","React","jsxs","cn","jsx","Button","CrossIcon"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYA,MAAM,gBAAuD;AAAA,EAC3D,qCAAOA,eAAAA,gBAAA,EAAe;AAAA,EACtB,wCAAUC,gBAAAA,iBAAA,EAAgB;AAAA,EAC1B,wCAAUC,oBAAAA,qBAAA,EAAoB;AAAA,EAC9B,sCAAQC,gBAAAA,iBAAA,CAAA,CAAgB;AAC1B;AAiBA,MAAM,uBAAqD;AAAA,EACzD,MAAM;AAAA,EACN,SACE;AAAA,EACF,SACE;AAAA,EACF,OACE;AACJ;AAkBO,MAAM,QAAQC,iBAAM;AAAA,EACzB,CACE;AAAA,IACE;AAAA,IACA,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA,aAAa;AAAA,IACb;AAAA,IACA,GAAG;AAAA,EAAA,GAEL,QACG;AACH,UAAM,eAAe,SAAS,OAAO,OAAQ,QAAQ,cAAc,OAAO;AAE1E,WACEC,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,MAAK;AAAA,QACL,eAAY;AAAA,QACZ,WAAWC,GAAAA;AAAAA,UACT;AAAA,UACA,gBAAgB,YAAY;AAAA,UAC5B,gBAAgB,CAAC,YAAY;AAAA,UAC7B,CAAC,gBAAgB,YAAY;AAAA,UAC7B,CAAC,gBAAgB,CAAC,YAAY;AAAA,UAC9B,SAAS,WAAW,gBAAgB;AAAA,UACpC,YAAY,UAAU;AAAA,UACtB,YAAY,aAAa;AAAA,UACzB,YAAY,aAAa;AAAA,UACzB,YAAY,WAAW;AAAA,UACvB;AAAA,QAAA;AAAA,QAED,GAAG;AAAA,QAEH,UAAA;AAAA,UAAA,+CACE,QAAA,EAAK,WAAU,6BAA4B,eAAY,QACrD,UAAA,cACH;AAAA,UAGFD,2BAAAA,KAAC,OAAA,EAAI,WAAU,+BACZ,UAAA;AAAA,YAAA,SACCE,2BAAAA,IAAC,OAAA,EAAI,WAAU,uDAAuD,UAAA,OAAM;AAAA,YAE9EA,2BAAAA,IAAC,OAAA,EAAI,WAAU,wDAAwD,SAAA,CAAS;AAAA,UAAA,GAClF;AAAA,UAEC,YACCA,2BAAAA;AAAAA,YAACC,OAAAA;AAAAA,YAAA;AAAA,cACC,SAAQ;AAAA,cACR,MAAK;AAAA,cACL,SAAS;AAAA,cACT,WAAWF,GAAAA,GAAG,mBAAmB,qBAAqB,OAAO,CAAC;AAAA,cAC9D,cAAY;AAAA,cAEZ,yCAACG,UAAAA,WAAA,CAAA,CAAU;AAAA,YAAA;AAAA,UAAA;AAAA,QACb;AAAA,MAAA;AAAA,IAAA;AAAA,EAIR;AACF;AAEA,MAAM,cAAc;;"}
+{"version":3,"file":"Alert.cjs","sources":["../../../../src/components/Alert/Alert.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Button } from \"../Button/Button\";\nimport { CheckCircleIcon } from \"../Icons/CheckCircleIcon\";\nimport { CrossIcon } from \"../Icons/CrossIcon\";\nimport { ErrorCircleIcon } from \"../Icons/ErrorCircleIcon\";\nimport { InfoCircleIcon } from \"../Icons/InfoCircleIcon\";\nimport { WarningTriangleIcon } from \"../Icons/WarningTriangleIcon\";\n\n/** Visual style variant of the alert. */\nexport type AlertVariant = \"info\" | \"success\" | \"warning\" | \"error\";\n\nconst DEFAULT_ICONS: Record<AlertVariant, React.ReactNode> = {\n  info: <InfoCircleIcon />,\n  success: <CheckCircleIcon />,\n  warning: <WarningTriangleIcon />,\n  error: <ErrorCircleIcon />,\n};\n\nexport interface AlertProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Visual style variant of the alert. @default \"info\" */\n  variant?: AlertVariant;\n  /** Optional title text displayed in bold above the description. */\n  title?: string;\n  /** Custom icon override. Pass `null` to hide the icon entirely. Each variant shows a default icon when left `undefined`. */\n  icon?: React.ReactNode | null;\n  /** Whether to show the close button. @default false */\n  closable?: boolean;\n  /** Callback fired when the close button is clicked. */\n  onClose?: () => void;\n  /** Accessible label for the close button. @default \"Close alert\" */\n  closeLabel?: string;\n}\n\nconst CLOSE_BUTTON_CLASSES: Record<AlertVariant, string> = {\n  info: \"hover:bg-info-default/10 active:bg-info-default/20 text-info-default motion-safe:transition-colors motion-safe:duration-150\",\n  success:\n    \"hover:bg-success-default/10 active:bg-success-default/20 text-success-default motion-safe:transition-colors motion-safe:duration-150\",\n  warning:\n    \"hover:bg-warning-default/10 active:bg-warning-default/20 text-warning-default motion-safe:transition-colors motion-safe:duration-150\",\n  error:\n    \"hover:bg-error-default/10 active:bg-error-default/20 text-error-default motion-safe:transition-colors motion-safe:duration-150\",\n};\n\n/**\n * Displays a contextual feedback message to the user.\n *\n * Supports `info`, `success`, `warning`, and `error` variants with a default\n * icon per variant, optional title, description, and dismiss button.\n *\n * Each variant renders a default icon automatically. Pass a custom `icon` to\n * override, or `icon={null}` to hide the icon entirely.\n *\n * @example\n * ```tsx\n * <Alert variant=\"success\" title=\"Saved\" closable onClose={handleClose}>\n *   Your changes have been saved.\n * </Alert>\n * ```\n */\nexport const Alert = React.forwardRef<HTMLDivElement, AlertProps>(\n  (\n    {\n      className,\n      variant = \"info\",\n      title,\n      icon,\n      closable = false,\n      onClose,\n      closeLabel = \"Close alert\",\n      children,\n      ...props\n    },\n    ref,\n  ) => {\n    const resolvedIcon = icon === null ? null : (icon ?? DEFAULT_ICONS[variant]);\n\n    return (\n      <div\n        ref={ref}\n        role=\"alert\"\n        data-testid=\"alert\"\n        className={cn(\n          \"grid gap-x-3 rounded-lg p-4 text-sm leading-[18px]\",\n          resolvedIcon && closable && \"grid-cols-[auto_1fr_auto]\",\n          resolvedIcon && !closable && \"grid-cols-[auto_1fr]\",\n          !resolvedIcon && closable && \"grid-cols-[1fr_auto]\",\n          !resolvedIcon && !closable && \"grid-cols-[1fr]\",\n          title && children ? \"items-start\" : \"items-center\",\n          variant === \"info\" && \"bg-info-background text-info-default\",\n          variant === \"success\" && \"bg-success-background text-success-default\",\n          variant === \"warning\" && \"bg-warning-background text-warning-default\",\n          variant === \"error\" && \"bg-error-background text-error-default\",\n          className,\n        )}\n        {...props}\n      >\n        {resolvedIcon && (\n          <span className=\"flex shrink-0 items-start\" aria-hidden=\"true\">\n            {resolvedIcon}\n          </span>\n        )}\n\n        <div className=\"flex min-w-0 flex-col gap-2\">\n          {title && (\n            <div className=\"typography-semibold-body-md text-foreground-default\">{title}</div>\n          )}\n          <div className=\"typography-regular-body-md text-foreground-secondary\">{children}</div>\n        </div>\n\n        {closable && (\n          <Button\n            variant=\"tertiary\"\n            size=\"24\"\n            onClick={onClose}\n            className={cn(\"self-start px-0\", CLOSE_BUTTON_CLASSES[variant])}\n            aria-label={closeLabel}\n          >\n            <CrossIcon />\n          </Button>\n        )}\n      </div>\n    );\n  },\n);\n\nAlert.displayName = \"Alert\";\n"],"names":["InfoCircleIcon","CheckCircleIcon","WarningTriangleIcon","ErrorCircleIcon","React","jsxs","cn","jsx","Button","CrossIcon"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYA,MAAM,gBAAuD;AAAA,EAC3D,qCAAOA,eAAAA,gBAAA,EAAe;AAAA,EACtB,wCAAUC,gBAAAA,iBAAA,EAAgB;AAAA,EAC1B,wCAAUC,oBAAAA,qBAAA,EAAoB;AAAA,EAC9B,sCAAQC,gBAAAA,iBAAA,CAAA,CAAgB;AAC1B;AAiBA,MAAM,uBAAqD;AAAA,EACzD,MAAM;AAAA,EACN,SACE;AAAA,EACF,SACE;AAAA,EACF,OACE;AACJ;AAkBO,MAAM,QAAQC,iBAAM;AAAA,EACzB,CACE;AAAA,IACE;AAAA,IACA,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA,aAAa;AAAA,IACb;AAAA,IACA,GAAG;AAAA,EAAA,GAEL,QACG;AACH,UAAM,eAAe,SAAS,OAAO,OAAQ,QAAQ,cAAc,OAAO;AAE1E,WACEC,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,MAAK;AAAA,QACL,eAAY;AAAA,QACZ,WAAWC,GAAAA;AAAAA,UACT;AAAA,UACA,gBAAgB,YAAY;AAAA,UAC5B,gBAAgB,CAAC,YAAY;AAAA,UAC7B,CAAC,gBAAgB,YAAY;AAAA,UAC7B,CAAC,gBAAgB,CAAC,YAAY;AAAA,UAC9B,SAAS,WAAW,gBAAgB;AAAA,UACpC,YAAY,UAAU;AAAA,UACtB,YAAY,aAAa;AAAA,UACzB,YAAY,aAAa;AAAA,UACzB,YAAY,WAAW;AAAA,UACvB;AAAA,QAAA;AAAA,QAED,GAAG;AAAA,QAEH,UAAA;AAAA,UAAA,+CACE,QAAA,EAAK,WAAU,6BAA4B,eAAY,QACrD,UAAA,cACH;AAAA,UAGFD,2BAAAA,KAAC,OAAA,EAAI,WAAU,+BACZ,UAAA;AAAA,YAAA,SACCE,2BAAAA,IAAC,OAAA,EAAI,WAAU,uDAAuD,UAAA,OAAM;AAAA,YAE9EA,2BAAAA,IAAC,OAAA,EAAI,WAAU,wDAAwD,SAAA,CAAS;AAAA,UAAA,GAClF;AAAA,UAEC,YACCA,2BAAAA;AAAAA,YAACC,OAAAA;AAAAA,YAAA;AAAA,cACC,SAAQ;AAAA,cACR,MAAK;AAAA,cACL,SAAS;AAAA,cACT,WAAWF,GAAAA,GAAG,mBAAmB,qBAAqB,OAAO,CAAC;AAAA,cAC9D,cAAY;AAAA,cAEZ,yCAACG,UAAAA,WAAA,CAAA,CAAU;AAAA,YAAA;AAAA,UAAA;AAAA,QACb;AAAA,MAAA;AAAA,IAAA;AAAA,EAIR;AACF;AAEA,MAAM,cAAc;;"}

package/dist/cjs/components/Icons/CloseIcon.cjs

@@ -32,7 +32,7 @@ const CloseIcon = React__namespace.forwardRef(
         "aria-hidden": "true",
         className: cn.cn("size-6", className),
         ...props,
-        children: /* @__PURE__ */ jsxRuntime.jsx("g", { stroke: "currentColor", strokeLinecap: "round", strokeWidth: "1.5", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m8.466 8.468 7.071 7.071M15.537 8.46l-7.071 7.072" }) })
+        children: /* @__PURE__ */ jsxRuntime.jsx("g", { stroke: "currentColor", strokeLinecap: "round", strokeWidth: "1.5", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M7.003 7.006 17 17.003M17 6.996l-9.997 9.998" }) })
       }
     );
   }

package/dist/cjs/components/Icons/CloseIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"CloseIcon.cjs","sources":["../../../../src/components/Icons/CloseIcon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport type { IconProps } from \"./types\";\n\nexport const CloseIcon = React.forwardRef<SVGSVGElement, IconProps>(\n  ({ className, ...props }, ref) => {\n    return (\n      <svg\n        ref={ref}\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        aria-hidden=\"true\"\n        className={cn(\"size-6\", className)}\n        {...props}\n      >\n        <g stroke=\"currentColor\" strokeLinecap=\"round\" strokeWidth=\"1.5\">\n          <path d=\"m8.466 8.468 7.071 7.071M15.537 8.46l-7.071 7.072\" />\n        </g>\n      </svg>\n    );\n  },\n);\n\nCloseIcon.displayName = \"CloseIcon\";\n"],"names":["React","jsx","cn"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAIO,MAAM,YAAYA,iBAAM;AAAA,EAC7B,CAAC,EAAE,WAAW,GAAG,MAAA,GAAS,QAAQ;AAChC,WACEC,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,eAAY;AAAA,QACZ,WAAWC,GAAAA,GAAG,UAAU,SAAS;AAAA,QAChC,GAAG;AAAA,QAEJ,UAAAD,2BAAAA,IAAC,KAAA,EAAE,QAAO,gBAAe,eAAc,SAAQ,aAAY,OACzD,UAAAA,+BAAC,QAAA,EAAK,GAAE,oDAAA,CAAoD,EAAA,CAC9D;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;AAEA,UAAU,cAAc;;"}
+{"version":3,"file":"CloseIcon.cjs","sources":["../../../../src/components/Icons/CloseIcon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport type { IconProps } from \"./types\";\n\nexport const CloseIcon = React.forwardRef<SVGSVGElement, IconProps>(\n  ({ className, ...props }, ref) => {\n    return (\n      <svg\n        ref={ref}\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        aria-hidden=\"true\"\n        className={cn(\"size-6\", className)}\n        {...props}\n      >\n        <g stroke=\"currentColor\" strokeLinecap=\"round\" strokeWidth=\"1.5\">\n          <path d=\"M7.003 7.006 17 17.003M17 6.996l-9.997 9.998\" />\n        </g>\n      </svg>\n    );\n  },\n);\n\nCloseIcon.displayName = \"CloseIcon\";\n"],"names":["React","jsx","cn"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAIO,MAAM,YAAYA,iBAAM;AAAA,EAC7B,CAAC,EAAE,WAAW,GAAG,MAAA,GAAS,QAAQ;AAChC,WACEC,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,eAAY;AAAA,QACZ,WAAWC,GAAAA,GAAG,UAAU,SAAS;AAAA,QAChC,GAAG;AAAA,QAEJ,UAAAD,2BAAAA,IAAC,KAAA,EAAE,QAAO,gBAAe,eAAc,SAAQ,aAAY,OACzD,UAAAA,+BAAC,QAAA,EAAK,GAAE,+CAAA,CAA+C,EAAA,CACzD;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;AAEA,UAAU,cAAc;;"}

package/dist/cjs/components/Icons/DoubleTickIcon.cjs

@@ -32,17 +32,7 @@ const DoubleTickIcon = React__namespace.forwardRef(
         "aria-hidden": "true",
         className: cn.cn("size-6", className),
         ...props,
-        children: /* @__PURE__ */ jsxRuntime.jsxs("g", { fill: "currentColor", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            "path",
-            {
-              fillRule: "evenodd",
-              d: "M5.22 11.47c.29-.29.77-.29 1.06 0l2.3 2.3.594-.596 1.06 1.06L9.11 15.36a.75.75 0 0 1-1.06 0l-2.83-2.83a.755.755 0 0 1 0-1.06m8.5-2.84c.29-.29.77-.29 1.06 0s.29.77 0 1.06l-2.796 2.795-1.06-1.06z",
-              clipRule: "evenodd"
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12.58 15.58a.75.75 0 0 1-.53-.22l-2.83-2.83a.754.754 0 0 1 0-1.06c.29-.29.77-.29 1.06 0l2.3 2.3 5.14-5.14c.29-.29.77-.29 1.06 0s.29.77 0 1.06l-5.67 5.67a.75.75 0 0 1-.53.22" })
-        ] })
+        children: /* @__PURE__ */ jsxRuntime.jsx("g", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.5", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m8 11.5 5 5L22.5 7M2 11.5l5 5L8.5 15m8-8-4.75 4.75" }) })
       }
     );
   }

package/dist/cjs/components/Icons/DoubleTickIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"DoubleTickIcon.cjs","sources":["../../../../src/components/Icons/DoubleTickIcon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport type { IconProps } from \"./types\";\n\nexport const DoubleTickIcon = React.forwardRef<SVGSVGElement, IconProps>(\n  ({ className, ...props }, ref) => {\n    return (\n      <svg\n        ref={ref}\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        aria-hidden=\"true\"\n        className={cn(\"size-6\", className)}\n        {...props}\n      >\n        <g fill=\"currentColor\">\n          <path\n            fillRule=\"evenodd\"\n            d=\"M5.22 11.47c.29-.29.77-.29 1.06 0l2.3 2.3.594-.596 1.06 1.06L9.11 15.36a.75.75 0 0 1-1.06 0l-2.83-2.83a.755.755 0 0 1 0-1.06m8.5-2.84c.29-.29.77-.29 1.06 0s.29.77 0 1.06l-2.796 2.795-1.06-1.06z\"\n            clipRule=\"evenodd\"\n          />\n          <path d=\"M12.58 15.58a.75.75 0 0 1-.53-.22l-2.83-2.83a.754.754 0 0 1 0-1.06c.29-.29.77-.29 1.06 0l2.3 2.3 5.14-5.14c.29-.29.77-.29 1.06 0s.29.77 0 1.06l-5.67 5.67a.75.75 0 0 1-.53.22\" />\n        </g>\n      </svg>\n    );\n  },\n);\n\nDoubleTickIcon.displayName = \"DoubleTickIcon\";\n"],"names":["React","jsx","cn","jsxs"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAIO,MAAM,iBAAiBA,iBAAM;AAAA,EAClC,CAAC,EAAE,WAAW,GAAG,MAAA,GAAS,QAAQ;AAChC,WACEC,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,eAAY;AAAA,QACZ,WAAWC,GAAAA,GAAG,UAAU,SAAS;AAAA,QAChC,GAAG;AAAA,QAEJ,UAAAC,2BAAAA,KAAC,KAAA,EAAE,MAAK,gBACN,UAAA;AAAA,UAAAF,2BAAAA;AAAAA,YAAC;AAAA,YAAA;AAAA,cACC,UAAS;AAAA,cACT,GAAE;AAAA,cACF,UAAS;AAAA,YAAA;AAAA,UAAA;AAAA,UAEXA,2BAAAA,IAAC,QAAA,EAAK,GAAE,gLAAA,CAAgL;AAAA,QAAA,EAAA,CAC1L;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;AAEA,eAAe,cAAc;;"}
+{"version":3,"file":"DoubleTickIcon.cjs","sources":["../../../../src/components/Icons/DoubleTickIcon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport type { IconProps } from \"./types\";\n\nexport const DoubleTickIcon = React.forwardRef<SVGSVGElement, IconProps>(\n  ({ className, ...props }, ref) => {\n    return (\n      <svg\n        ref={ref}\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        aria-hidden=\"true\"\n        className={cn(\"size-6\", className)}\n        {...props}\n      >\n        <g stroke=\"currentColor\" strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"1.5\">\n          <path d=\"m8 11.5 5 5L22.5 7M2 11.5l5 5L8.5 15m8-8-4.75 4.75\" />\n        </g>\n      </svg>\n    );\n  },\n);\n\nDoubleTickIcon.displayName = \"DoubleTickIcon\";\n"],"names":["React","jsx","cn"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAIO,MAAM,iBAAiBA,iBAAM;AAAA,EAClC,CAAC,EAAE,WAAW,GAAG,MAAA,GAAS,QAAQ;AAChC,WACEC,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,eAAY;AAAA,QACZ,WAAWC,GAAAA,GAAG,UAAU,SAAS;AAAA,QAChC,GAAG;AAAA,QAEJ,UAAAD,2BAAAA,IAAC,KAAA,EAAE,QAAO,gBAAe,eAAc,SAAQ,gBAAe,SAAQ,aAAY,OAChF,UAAAA,2BAAAA,IAAC,QAAA,EAAK,GAAE,sDAAqD,EAAA,CAC/D;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;AAEA,eAAe,cAAc;;"}

package/dist/cjs/components/Icons/TickIcon.cjs

@@ -35,8 +35,11 @@ const TickIcon = React__namespace.forwardRef(
         children: /* @__PURE__ */ jsxRuntime.jsx(
           "path",
           {
-            fill: "currentColor",
-            d: "M10.58 15.58a.75.75 0 0 1-.53-.22l-2.83-2.83a.754.754 0 0 1 0-1.06c.29-.29.77-.29 1.06 0l2.3 2.3 5.14-5.14c.29-.29.77-.29 1.06 0s.29.77 0 1.06l-5.67 5.67a.75.75 0 0 1-.53.22"
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            strokeWidth: "1.5",
+            d: "m5 12 5 5 9.5-9.5"
           }
         )
       }

package/dist/cjs/components/Icons/TickIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TickIcon.cjs","sources":["../../../../src/components/Icons/TickIcon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport type { IconProps } from \"./types\";\n\nexport const TickIcon = React.forwardRef<SVGSVGElement, IconProps>(\n  ({ className, ...props }, ref) => {\n    return (\n      <svg\n        ref={ref}\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        aria-hidden=\"true\"\n        className={cn(\"size-6\", className)}\n        {...props}\n      >\n        <path\n          fill=\"currentColor\"\n          d=\"M10.58 15.58a.75.75 0 0 1-.53-.22l-2.83-2.83a.754.754 0 0 1 0-1.06c.29-.29.77-.29 1.06 0l2.3 2.3 5.14-5.14c.29-.29.77-.29 1.06 0s.29.77 0 1.06l-5.67 5.67a.75.75 0 0 1-.53.22\"\n        />\n      </svg>\n    );\n  },\n);\n\nTickIcon.displayName = \"TickIcon\";\n"],"names":["React","jsx","cn"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAIO,MAAM,WAAWA,iBAAM;AAAA,EAC5B,CAAC,EAAE,WAAW,GAAG,MAAA,GAAS,QAAQ;AAChC,WACEC,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,eAAY;AAAA,QACZ,WAAWC,GAAAA,GAAG,UAAU,SAAS;AAAA,QAChC,GAAG;AAAA,QAEJ,UAAAD,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,GAAE;AAAA,UAAA;AAAA,QAAA;AAAA,MACJ;AAAA,IAAA;AAAA,EAGN;AACF;AAEA,SAAS,cAAc;;"}
+{"version":3,"file":"TickIcon.cjs","sources":["../../../../src/components/Icons/TickIcon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport type { IconProps } from \"./types\";\n\nexport const TickIcon = React.forwardRef<SVGSVGElement, IconProps>(\n  ({ className, ...props }, ref) => {\n    return (\n      <svg\n        ref={ref}\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        aria-hidden=\"true\"\n        className={cn(\"size-6\", className)}\n        {...props}\n      >\n        <path\n          stroke=\"currentColor\"\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n          strokeWidth=\"1.5\"\n          d=\"m5 12 5 5 9.5-9.5\"\n        />\n      </svg>\n    );\n  },\n);\n\nTickIcon.displayName = \"TickIcon\";\n"],"names":["React","jsx","cn"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAIO,MAAM,WAAWA,iBAAM;AAAA,EAC5B,CAAC,EAAE,WAAW,GAAG,MAAA,GAAS,QAAQ;AAChC,WACEC,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,eAAY;AAAA,QACZ,WAAWC,GAAAA,GAAG,UAAU,SAAS;AAAA,QAChC,GAAG;AAAA,QAEJ,UAAAD,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,QAAO;AAAA,YACP,eAAc;AAAA,YACd,gBAAe;AAAA,YACf,aAAY;AAAA,YACZ,GAAE;AAAA,UAAA;AAAA,QAAA;AAAA,MACJ;AAAA,IAAA;AAAA,EAGN;AACF;AAEA,SAAS,cAAc;;"}

package/dist/cjs/components/PasswordField/PasswordField.cjs

@@ -3,8 +3,8 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
-const EyeClosedIcon = require("../Icons/EyeClosedIcon.cjs");
 const EyeIcon = require("../Icons/EyeIcon.cjs");
+const EyeSlashIcon = require("../Icons/EyeSlashIcon.cjs");
 const TextField = require("../TextField/TextField.cjs");
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
@@ -38,7 +38,7 @@ const PasswordField = React__namespace.forwardRef(
         "aria-label": showPassword ? "Hide password" : "Show password",
         tabIndex: -1,
         className: "flex size-5 shrink-0 items-center justify-center text-foreground-secondary transition-colors hover:text-foreground-default focus:outline-none disabled:cursor-not-allowed",
-        children: showPassword ? /* @__PURE__ */ jsxRuntime.jsx(EyeClosedIcon.EyeClosedIcon, {}) : /* @__PURE__ */ jsxRuntime.jsx(EyeIcon.EyeIcon, {})
+        children: showPassword ? /* @__PURE__ */ jsxRuntime.jsx(EyeSlashIcon.EyeSlashIcon, {}) : /* @__PURE__ */ jsxRuntime.jsx(EyeIcon.EyeIcon, {})
       }
     );
     return /* @__PURE__ */ jsxRuntime.jsx(

package/dist/cjs/components/PasswordField/PasswordField.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"PasswordField.cjs","sources":["../../../../src/components/PasswordField/PasswordField.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { EyeClosedIcon } from \"../Icons/EyeClosedIcon\";\nimport { EyeIcon } from \"../Icons/EyeIcon\";\nimport { TextField, type TextFieldProps } from \"../TextField/TextField\";\n\nexport type PasswordFieldSize = \"48\" | \"40\" | \"32\";\n\nexport interface PasswordFieldProps extends Omit<TextFieldProps, \"type\" | \"rightIcon\"> {\n  /** Size variant of the password field */\n  size?: PasswordFieldSize;\n}\n\nexport const PasswordField = React.forwardRef<HTMLInputElement, PasswordFieldProps>(\n  ({ disabled, ...props }, ref) => {\n    const [showPassword, setShowPassword] = React.useState(false);\n\n    const togglePasswordVisibility = () => {\n      setShowPassword((prev) => !prev);\n    };\n\n    const rightIcon = (\n      <button\n        type=\"button\"\n        onClick={togglePasswordVisibility}\n        disabled={disabled}\n        aria-label={showPassword ? \"Hide password\" : \"Show password\"}\n        tabIndex={-1}\n        className=\"flex size-5 shrink-0 items-center justify-center text-foreground-secondary transition-colors hover:text-foreground-default focus:outline-none disabled:cursor-not-allowed\"\n      >\n        {showPassword ? <EyeClosedIcon /> : <EyeIcon />}\n      </button>\n    );\n\n    return (\n      <TextField\n        ref={ref}\n        type={showPassword ? \"text\" : \"password\"}\n        disabled={disabled}\n        rightIcon={rightIcon}\n        aria-label={!props.label ? \"Password field\" : undefined}\n        {...props}\n      />\n    );\n  },\n);\n\nPasswordField.displayName = \"PasswordField\";\n"],"names":["React","jsx","EyeClosedIcon","EyeIcon","TextField"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAYO,MAAM,gBAAgBA,iBAAM;AAAA,EACjC,CAAC,EAAE,UAAU,GAAG,MAAA,GAAS,QAAQ;AAC/B,UAAM,CAAC,cAAc,eAAe,IAAIA,iBAAM,SAAS,KAAK;AAE5D,UAAM,2BAA2B,MAAM;AACrC,sBAAgB,CAAC,SAAS,CAAC,IAAI;AAAA,IACjC;AAEA,UAAM,YACJC,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,SAAS;AAAA,QACT;AAAA,QACA,cAAY,eAAe,kBAAkB;AAAA,QAC7C,UAAU;AAAA,QACV,WAAU;AAAA,QAET,UAAA,eAAeA,+BAACC,cAAAA,eAAA,CAAA,CAAc,mCAAMC,QAAAA,SAAA,CAAA,CAAQ;AAAA,MAAA;AAAA,IAAA;AAIjD,WACEF,2BAAAA;AAAAA,MAACG,UAAAA;AAAAA,MAAA;AAAA,QACC;AAAA,QACA,MAAM,eAAe,SAAS;AAAA,QAC9B;AAAA,QACA;AAAA,QACA,cAAY,CAAC,MAAM,QAAQ,mBAAmB;AAAA,QAC7C,GAAG;AAAA,MAAA;AAAA,IAAA;AAAA,EAGV;AACF;AAEA,cAAc,cAAc;;"}
+{"version":3,"file":"PasswordField.cjs","sources":["../../../../src/components/PasswordField/PasswordField.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { EyeIcon } from \"../Icons/EyeIcon\";\nimport { EyeSlashIcon } from \"../Icons/EyeSlashIcon\";\nimport { TextField, type TextFieldProps } from \"../TextField/TextField\";\n\nexport type PasswordFieldSize = \"48\" | \"40\" | \"32\";\n\nexport interface PasswordFieldProps extends Omit<TextFieldProps, \"type\" | \"rightIcon\"> {\n  /** Size variant of the password field */\n  size?: PasswordFieldSize;\n}\n\nexport const PasswordField = React.forwardRef<HTMLInputElement, PasswordFieldProps>(\n  ({ disabled, ...props }, ref) => {\n    const [showPassword, setShowPassword] = React.useState(false);\n\n    const togglePasswordVisibility = () => {\n      setShowPassword((prev) => !prev);\n    };\n\n    const rightIcon = (\n      <button\n        type=\"button\"\n        onClick={togglePasswordVisibility}\n        disabled={disabled}\n        aria-label={showPassword ? \"Hide password\" : \"Show password\"}\n        tabIndex={-1}\n        className=\"flex size-5 shrink-0 items-center justify-center text-foreground-secondary transition-colors hover:text-foreground-default focus:outline-none disabled:cursor-not-allowed\"\n      >\n        {showPassword ? <EyeSlashIcon /> : <EyeIcon />}\n      </button>\n    );\n\n    return (\n      <TextField\n        ref={ref}\n        type={showPassword ? \"text\" : \"password\"}\n        disabled={disabled}\n        rightIcon={rightIcon}\n        aria-label={!props.label ? \"Password field\" : undefined}\n        {...props}\n      />\n    );\n  },\n);\n\nPasswordField.displayName = \"PasswordField\";\n"],"names":["React","jsx","EyeSlashIcon","EyeIcon","TextField"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAYO,MAAM,gBAAgBA,iBAAM;AAAA,EACjC,CAAC,EAAE,UAAU,GAAG,MAAA,GAAS,QAAQ;AAC/B,UAAM,CAAC,cAAc,eAAe,IAAIA,iBAAM,SAAS,KAAK;AAE5D,UAAM,2BAA2B,MAAM;AACrC,sBAAgB,CAAC,SAAS,CAAC,IAAI;AAAA,IACjC;AAEA,UAAM,YACJC,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,SAAS;AAAA,QACT;AAAA,QACA,cAAY,eAAe,kBAAkB;AAAA,QAC7C,UAAU;AAAA,QACV,WAAU;AAAA,QAET,UAAA,eAAeA,+BAACC,aAAAA,cAAA,CAAA,CAAa,mCAAMC,QAAAA,SAAA,CAAA,CAAQ;AAAA,MAAA;AAAA,IAAA;AAIhD,WACEF,2BAAAA;AAAAA,MAACG,UAAAA;AAAAA,MAAA;AAAA,QACC;AAAA,QACA,MAAM,eAAe,SAAS;AAAA,QAC9B;AAAA,QACA;AAAA,QACA,cAAY,CAAC,MAAM,QAAQ,mBAAmB;AAAA,QAC7C,GAAG;AAAA,MAAA;AAAA,IAAA;AAAA,EAGV;AACF;AAEA,cAAc,cAAc;;"}

package/dist/components/Alert/Alert.mjs

@@ -15,10 +15,10 @@ const DEFAULT_ICONS = {
   error: /* @__PURE__ */ jsx(ErrorCircleIcon, {})
 };
 const CLOSE_BUTTON_CLASSES = {
-  info: "hover:bg-info-default active:bg-info-default text-info-default motion-safe:transition-colors motion-safe:duration-150",
-  success: "hover:bg-success-default active:bg-success-default text-success-default motion-safe:transition-colors motion-safe:duration-150",
-  warning: "hover:bg-warning-default active:bg-warning-default text-warning-default motion-safe:transition-colors motion-safe:duration-150",
-  error: "hover:bg-error-default active:bg-error-default text-error-default motion-safe:transition-colors motion-safe:duration-150"
+  info: "hover:bg-info-default/10 active:bg-info-default/20 text-info-default motion-safe:transition-colors motion-safe:duration-150",
+  success: "hover:bg-success-default/10 active:bg-success-default/20 text-success-default motion-safe:transition-colors motion-safe:duration-150",
+  warning: "hover:bg-warning-default/10 active:bg-warning-default/20 text-warning-default motion-safe:transition-colors motion-safe:duration-150",
+  error: "hover:bg-error-default/10 active:bg-error-default/20 text-error-default motion-safe:transition-colors motion-safe:duration-150"
 };
 const Alert = React.forwardRef(
   ({

package/dist/components/Alert/Alert.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Alert.mjs","sources":["../../../src/components/Alert/Alert.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Button } from \"../Button/Button\";\nimport { CheckCircleIcon } from \"../Icons/CheckCircleIcon\";\nimport { CrossIcon } from \"../Icons/CrossIcon\";\nimport { ErrorCircleIcon } from \"../Icons/ErrorCircleIcon\";\nimport { InfoCircleIcon } from \"../Icons/InfoCircleIcon\";\nimport { WarningTriangleIcon } from \"../Icons/WarningTriangleIcon\";\n\n/** Visual style variant of the alert. */\nexport type AlertVariant = \"info\" | \"success\" | \"warning\" | \"error\";\n\nconst DEFAULT_ICONS: Record<AlertVariant, React.ReactNode> = {\n  info: <InfoCircleIcon />,\n  success: <CheckCircleIcon />,\n  warning: <WarningTriangleIcon />,\n  error: <ErrorCircleIcon />,\n};\n\nexport interface AlertProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Visual style variant of the alert. @default \"info\" */\n  variant?: AlertVariant;\n  /** Optional title text displayed in bold above the description. */\n  title?: string;\n  /** Custom icon override. Pass `null` to hide the icon entirely. Each variant shows a default icon when left `undefined`. */\n  icon?: React.ReactNode | null;\n  /** Whether to show the close button. @default false */\n  closable?: boolean;\n  /** Callback fired when the close button is clicked. */\n  onClose?: () => void;\n  /** Accessible label for the close button. @default \"Close alert\" */\n  closeLabel?: string;\n}\n\nconst CLOSE_BUTTON_CLASSES: Record<AlertVariant, string> = {\n  info: \"hover:bg-info-default active:bg-info-default text-info-default motion-safe:transition-colors motion-safe:duration-150\",\n  success:\n    \"hover:bg-success-default active:bg-success-default text-success-default motion-safe:transition-colors motion-safe:duration-150\",\n  warning:\n    \"hover:bg-warning-default active:bg-warning-default text-warning-default motion-safe:transition-colors motion-safe:duration-150\",\n  error:\n    \"hover:bg-error-default active:bg-error-default text-error-default motion-safe:transition-colors motion-safe:duration-150\",\n};\n\n/**\n * Displays a contextual feedback message to the user.\n *\n * Supports `info`, `success`, `warning`, and `error` variants with a default\n * icon per variant, optional title, description, and dismiss button.\n *\n * Each variant renders a default icon automatically. Pass a custom `icon` to\n * override, or `icon={null}` to hide the icon entirely.\n *\n * @example\n * ```tsx\n * <Alert variant=\"success\" title=\"Saved\" closable onClose={handleClose}>\n *   Your changes have been saved.\n * </Alert>\n * ```\n */\nexport const Alert = React.forwardRef<HTMLDivElement, AlertProps>(\n  (\n    {\n      className,\n      variant = \"info\",\n      title,\n      icon,\n      closable = false,\n      onClose,\n      closeLabel = \"Close alert\",\n      children,\n      ...props\n    },\n    ref,\n  ) => {\n    const resolvedIcon = icon === null ? null : (icon ?? DEFAULT_ICONS[variant]);\n\n    return (\n      <div\n        ref={ref}\n        role=\"alert\"\n        data-testid=\"alert\"\n        className={cn(\n          \"grid gap-x-3 rounded-lg p-4 text-sm leading-[18px]\",\n          resolvedIcon && closable && \"grid-cols-[auto_1fr_auto]\",\n          resolvedIcon && !closable && \"grid-cols-[auto_1fr]\",\n          !resolvedIcon && closable && \"grid-cols-[1fr_auto]\",\n          !resolvedIcon && !closable && \"grid-cols-[1fr]\",\n          title && children ? \"items-start\" : \"items-center\",\n          variant === \"info\" && \"bg-info-background text-info-default\",\n          variant === \"success\" && \"bg-success-background text-success-default\",\n          variant === \"warning\" && \"bg-warning-background text-warning-default\",\n          variant === \"error\" && \"bg-error-background text-error-default\",\n          className,\n        )}\n        {...props}\n      >\n        {resolvedIcon && (\n          <span className=\"flex shrink-0 items-start\" aria-hidden=\"true\">\n            {resolvedIcon}\n          </span>\n        )}\n\n        <div className=\"flex min-w-0 flex-col gap-2\">\n          {title && (\n            <div className=\"typography-semibold-body-md text-foreground-default\">{title}</div>\n          )}\n          <div className=\"typography-regular-body-md text-foreground-secondary\">{children}</div>\n        </div>\n\n        {closable && (\n          <Button\n            variant=\"tertiary\"\n            size=\"24\"\n            onClick={onClose}\n            className={cn(\"self-start px-0\", CLOSE_BUTTON_CLASSES[variant])}\n            aria-label={closeLabel}\n          >\n            <CrossIcon />\n          </Button>\n        )}\n      </div>\n    );\n  },\n);\n\nAlert.displayName = \"Alert\";\n"],"names":[],"mappings":";;;;;;;;;;AAYA,MAAM,gBAAuD;AAAA,EAC3D,0BAAO,gBAAA,EAAe;AAAA,EACtB,6BAAU,iBAAA,EAAgB;AAAA,EAC1B,6BAAU,qBAAA,EAAoB;AAAA,EAC9B,2BAAQ,iBAAA,CAAA,CAAgB;AAC1B;AAiBA,MAAM,uBAAqD;AAAA,EACzD,MAAM;AAAA,EACN,SACE;AAAA,EACF,SACE;AAAA,EACF,OACE;AACJ;AAkBO,MAAM,QAAQ,MAAM;AAAA,EACzB,CACE;AAAA,IACE;AAAA,IACA,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA,aAAa;AAAA,IACb;AAAA,IACA,GAAG;AAAA,EAAA,GAEL,QACG;AACH,UAAM,eAAe,SAAS,OAAO,OAAQ,QAAQ,cAAc,OAAO;AAE1E,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,MAAK;AAAA,QACL,eAAY;AAAA,QACZ,WAAW;AAAA,UACT;AAAA,UACA,gBAAgB,YAAY;AAAA,UAC5B,gBAAgB,CAAC,YAAY;AAAA,UAC7B,CAAC,gBAAgB,YAAY;AAAA,UAC7B,CAAC,gBAAgB,CAAC,YAAY;AAAA,UAC9B,SAAS,WAAW,gBAAgB;AAAA,UACpC,YAAY,UAAU;AAAA,UACtB,YAAY,aAAa;AAAA,UACzB,YAAY,aAAa;AAAA,UACzB,YAAY,WAAW;AAAA,UACvB;AAAA,QAAA;AAAA,QAED,GAAG;AAAA,QAEH,UAAA;AAAA,UAAA,oCACE,QAAA,EAAK,WAAU,6BAA4B,eAAY,QACrD,UAAA,cACH;AAAA,UAGF,qBAAC,OAAA,EAAI,WAAU,+BACZ,UAAA;AAAA,YAAA,SACC,oBAAC,OAAA,EAAI,WAAU,uDAAuD,UAAA,OAAM;AAAA,YAE9E,oBAAC,OAAA,EAAI,WAAU,wDAAwD,SAAA,CAAS;AAAA,UAAA,GAClF;AAAA,UAEC,YACC;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,SAAQ;AAAA,cACR,MAAK;AAAA,cACL,SAAS;AAAA,cACT,WAAW,GAAG,mBAAmB,qBAAqB,OAAO,CAAC;AAAA,cAC9D,cAAY;AAAA,cAEZ,8BAAC,WAAA,CAAA,CAAU;AAAA,YAAA;AAAA,UAAA;AAAA,QACb;AAAA,MAAA;AAAA,IAAA;AAAA,EAIR;AACF;AAEA,MAAM,cAAc;"}
+{"version":3,"file":"Alert.mjs","sources":["../../../src/components/Alert/Alert.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Button } from \"../Button/Button\";\nimport { CheckCircleIcon } from \"../Icons/CheckCircleIcon\";\nimport { CrossIcon } from \"../Icons/CrossIcon\";\nimport { ErrorCircleIcon } from \"../Icons/ErrorCircleIcon\";\nimport { InfoCircleIcon } from \"../Icons/InfoCircleIcon\";\nimport { WarningTriangleIcon } from \"../Icons/WarningTriangleIcon\";\n\n/** Visual style variant of the alert. */\nexport type AlertVariant = \"info\" | \"success\" | \"warning\" | \"error\";\n\nconst DEFAULT_ICONS: Record<AlertVariant, React.ReactNode> = {\n  info: <InfoCircleIcon />,\n  success: <CheckCircleIcon />,\n  warning: <WarningTriangleIcon />,\n  error: <ErrorCircleIcon />,\n};\n\nexport interface AlertProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Visual style variant of the alert. @default \"info\" */\n  variant?: AlertVariant;\n  /** Optional title text displayed in bold above the description. */\n  title?: string;\n  /** Custom icon override. Pass `null` to hide the icon entirely. Each variant shows a default icon when left `undefined`. */\n  icon?: React.ReactNode | null;\n  /** Whether to show the close button. @default false */\n  closable?: boolean;\n  /** Callback fired when the close button is clicked. */\n  onClose?: () => void;\n  /** Accessible label for the close button. @default \"Close alert\" */\n  closeLabel?: string;\n}\n\nconst CLOSE_BUTTON_CLASSES: Record<AlertVariant, string> = {\n  info: \"hover:bg-info-default/10 active:bg-info-default/20 text-info-default motion-safe:transition-colors motion-safe:duration-150\",\n  success:\n    \"hover:bg-success-default/10 active:bg-success-default/20 text-success-default motion-safe:transition-colors motion-safe:duration-150\",\n  warning:\n    \"hover:bg-warning-default/10 active:bg-warning-default/20 text-warning-default motion-safe:transition-colors motion-safe:duration-150\",\n  error:\n    \"hover:bg-error-default/10 active:bg-error-default/20 text-error-default motion-safe:transition-colors motion-safe:duration-150\",\n};\n\n/**\n * Displays a contextual feedback message to the user.\n *\n * Supports `info`, `success`, `warning`, and `error` variants with a default\n * icon per variant, optional title, description, and dismiss button.\n *\n * Each variant renders a default icon automatically. Pass a custom `icon` to\n * override, or `icon={null}` to hide the icon entirely.\n *\n * @example\n * ```tsx\n * <Alert variant=\"success\" title=\"Saved\" closable onClose={handleClose}>\n *   Your changes have been saved.\n * </Alert>\n * ```\n */\nexport const Alert = React.forwardRef<HTMLDivElement, AlertProps>(\n  (\n    {\n      className,\n      variant = \"info\",\n      title,\n      icon,\n      closable = false,\n      onClose,\n      closeLabel = \"Close alert\",\n      children,\n      ...props\n    },\n    ref,\n  ) => {\n    const resolvedIcon = icon === null ? null : (icon ?? DEFAULT_ICONS[variant]);\n\n    return (\n      <div\n        ref={ref}\n        role=\"alert\"\n        data-testid=\"alert\"\n        className={cn(\n          \"grid gap-x-3 rounded-lg p-4 text-sm leading-[18px]\",\n          resolvedIcon && closable && \"grid-cols-[auto_1fr_auto]\",\n          resolvedIcon && !closable && \"grid-cols-[auto_1fr]\",\n          !resolvedIcon && closable && \"grid-cols-[1fr_auto]\",\n          !resolvedIcon && !closable && \"grid-cols-[1fr]\",\n          title && children ? \"items-start\" : \"items-center\",\n          variant === \"info\" && \"bg-info-background text-info-default\",\n          variant === \"success\" && \"bg-success-background text-success-default\",\n          variant === \"warning\" && \"bg-warning-background text-warning-default\",\n          variant === \"error\" && \"bg-error-background text-error-default\",\n          className,\n        )}\n        {...props}\n      >\n        {resolvedIcon && (\n          <span className=\"flex shrink-0 items-start\" aria-hidden=\"true\">\n            {resolvedIcon}\n          </span>\n        )}\n\n        <div className=\"flex min-w-0 flex-col gap-2\">\n          {title && (\n            <div className=\"typography-semibold-body-md text-foreground-default\">{title}</div>\n          )}\n          <div className=\"typography-regular-body-md text-foreground-secondary\">{children}</div>\n        </div>\n\n        {closable && (\n          <Button\n            variant=\"tertiary\"\n            size=\"24\"\n            onClick={onClose}\n            className={cn(\"self-start px-0\", CLOSE_BUTTON_CLASSES[variant])}\n            aria-label={closeLabel}\n          >\n            <CrossIcon />\n          </Button>\n        )}\n      </div>\n    );\n  },\n);\n\nAlert.displayName = \"Alert\";\n"],"names":[],"mappings":";;;;;;;;;;AAYA,MAAM,gBAAuD;AAAA,EAC3D,0BAAO,gBAAA,EAAe;AAAA,EACtB,6BAAU,iBAAA,EAAgB;AAAA,EAC1B,6BAAU,qBAAA,EAAoB;AAAA,EAC9B,2BAAQ,iBAAA,CAAA,CAAgB;AAC1B;AAiBA,MAAM,uBAAqD;AAAA,EACzD,MAAM;AAAA,EACN,SACE;AAAA,EACF,SACE;AAAA,EACF,OACE;AACJ;AAkBO,MAAM,QAAQ,MAAM;AAAA,EACzB,CACE;AAAA,IACE;AAAA,IACA,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA,aAAa;AAAA,IACb;AAAA,IACA,GAAG;AAAA,EAAA,GAEL,QACG;AACH,UAAM,eAAe,SAAS,OAAO,OAAQ,QAAQ,cAAc,OAAO;AAE1E,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,MAAK;AAAA,QACL,eAAY;AAAA,QACZ,WAAW;AAAA,UACT;AAAA,UACA,gBAAgB,YAAY;AAAA,UAC5B,gBAAgB,CAAC,YAAY;AAAA,UAC7B,CAAC,gBAAgB,YAAY;AAAA,UAC7B,CAAC,gBAAgB,CAAC,YAAY;AAAA,UAC9B,SAAS,WAAW,gBAAgB;AAAA,UACpC,YAAY,UAAU;AAAA,UACtB,YAAY,aAAa;AAAA,UACzB,YAAY,aAAa;AAAA,UACzB,YAAY,WAAW;AAAA,UACvB;AAAA,QAAA;AAAA,QAED,GAAG;AAAA,QAEH,UAAA;AAAA,UAAA,oCACE,QAAA,EAAK,WAAU,6BAA4B,eAAY,QACrD,UAAA,cACH;AAAA,UAGF,qBAAC,OAAA,EAAI,WAAU,+BACZ,UAAA;AAAA,YAAA,SACC,oBAAC,OAAA,EAAI,WAAU,uDAAuD,UAAA,OAAM;AAAA,YAE9E,oBAAC,OAAA,EAAI,WAAU,wDAAwD,SAAA,CAAS;AAAA,UAAA,GAClF;AAAA,UAEC,YACC;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,SAAQ;AAAA,cACR,MAAK;AAAA,cACL,SAAS;AAAA,cACT,WAAW,GAAG,mBAAmB,qBAAqB,OAAO,CAAC;AAAA,cAC9D,cAAY;AAAA,cAEZ,8BAAC,WAAA,CAAA,CAAU;AAAA,YAAA;AAAA,UAAA;AAAA,QACb;AAAA,MAAA;AAAA,IAAA;AAAA,EAIR;AACF;AAEA,MAAM,cAAc;"}

package/dist/components/Icons/CloseIcon.mjs

@@ -13,7 +13,7 @@ const CloseIcon = React.forwardRef(
         "aria-hidden": "true",
         className: cn("size-6", className),
         ...props,
-        children: /* @__PURE__ */ jsx("g", { stroke: "currentColor", strokeLinecap: "round", strokeWidth: "1.5", children: /* @__PURE__ */ jsx("path", { d: "m8.466 8.468 7.071 7.071M15.537 8.46l-7.071 7.072" }) })
+        children: /* @__PURE__ */ jsx("g", { stroke: "currentColor", strokeLinecap: "round", strokeWidth: "1.5", children: /* @__PURE__ */ jsx("path", { d: "M7.003 7.006 17 17.003M17 6.996l-9.997 9.998" }) })
       }
     );
   }

package/dist/components/Icons/CloseIcon.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"CloseIcon.mjs","sources":["../../../src/components/Icons/CloseIcon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport type { IconProps } from \"./types\";\n\nexport const CloseIcon = React.forwardRef<SVGSVGElement, IconProps>(\n  ({ className, ...props }, ref) => {\n    return (\n      <svg\n        ref={ref}\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        aria-hidden=\"true\"\n        className={cn(\"size-6\", className)}\n        {...props}\n      >\n        <g stroke=\"currentColor\" strokeLinecap=\"round\" strokeWidth=\"1.5\">\n          <path d=\"m8.466 8.468 7.071 7.071M15.537 8.46l-7.071 7.072\" />\n        </g>\n      </svg>\n    );\n  },\n);\n\nCloseIcon.displayName = \"CloseIcon\";\n"],"names":[],"mappings":";;;;AAIO,MAAM,YAAY,MAAM;AAAA,EAC7B,CAAC,EAAE,WAAW,GAAG,MAAA,GAAS,QAAQ;AAChC,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,eAAY;AAAA,QACZ,WAAW,GAAG,UAAU,SAAS;AAAA,QAChC,GAAG;AAAA,QAEJ,UAAA,oBAAC,KAAA,EAAE,QAAO,gBAAe,eAAc,SAAQ,aAAY,OACzD,UAAA,oBAAC,QAAA,EAAK,GAAE,oDAAA,CAAoD,EAAA,CAC9D;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;AAEA,UAAU,cAAc;"}
+{"version":3,"file":"CloseIcon.mjs","sources":["../../../src/components/Icons/CloseIcon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport type { IconProps } from \"./types\";\n\nexport const CloseIcon = React.forwardRef<SVGSVGElement, IconProps>(\n  ({ className, ...props }, ref) => {\n    return (\n      <svg\n        ref={ref}\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        aria-hidden=\"true\"\n        className={cn(\"size-6\", className)}\n        {...props}\n      >\n        <g stroke=\"currentColor\" strokeLinecap=\"round\" strokeWidth=\"1.5\">\n          <path d=\"M7.003 7.006 17 17.003M17 6.996l-9.997 9.998\" />\n        </g>\n      </svg>\n    );\n  },\n);\n\nCloseIcon.displayName = \"CloseIcon\";\n"],"names":[],"mappings":";;;;AAIO,MAAM,YAAY,MAAM;AAAA,EAC7B,CAAC,EAAE,WAAW,GAAG,MAAA,GAAS,QAAQ;AAChC,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,eAAY;AAAA,QACZ,WAAW,GAAG,UAAU,SAAS;AAAA,QAChC,GAAG;AAAA,QAEJ,UAAA,oBAAC,KAAA,EAAE,QAAO,gBAAe,eAAc,SAAQ,aAAY,OACzD,UAAA,oBAAC,QAAA,EAAK,GAAE,+CAAA,CAA+C,EAAA,CACzD;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;AAEA,UAAU,cAAc;"}

package/dist/components/Icons/DoubleTickIcon.mjs

@@ -1,5 +1,5 @@
 "use client";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { jsx } from "react/jsx-runtime";
 import * as React from "react";
 import { cn } from "../../utils/cn.mjs";
 const DoubleTickIcon = React.forwardRef(
@@ -13,17 +13,7 @@ const DoubleTickIcon = React.forwardRef(
         "aria-hidden": "true",
         className: cn("size-6", className),
         ...props,
-        children: /* @__PURE__ */ jsxs("g", { fill: "currentColor", children: [
-          /* @__PURE__ */ jsx(
-            "path",
-            {
-              fillRule: "evenodd",
-              d: "M5.22 11.47c.29-.29.77-.29 1.06 0l2.3 2.3.594-.596 1.06 1.06L9.11 15.36a.75.75 0 0 1-1.06 0l-2.83-2.83a.755.755 0 0 1 0-1.06m8.5-2.84c.29-.29.77-.29 1.06 0s.29.77 0 1.06l-2.796 2.795-1.06-1.06z",
-              clipRule: "evenodd"
-            }
-          ),
-          /* @__PURE__ */ jsx("path", { d: "M12.58 15.58a.75.75 0 0 1-.53-.22l-2.83-2.83a.754.754 0 0 1 0-1.06c.29-.29.77-.29 1.06 0l2.3 2.3 5.14-5.14c.29-.29.77-.29 1.06 0s.29.77 0 1.06l-5.67 5.67a.75.75 0 0 1-.53.22" })
-        ] })
+        children: /* @__PURE__ */ jsx("g", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.5", children: /* @__PURE__ */ jsx("path", { d: "m8 11.5 5 5L22.5 7M2 11.5l5 5L8.5 15m8-8-4.75 4.75" }) })
       }
     );
   }

package/dist/components/Icons/DoubleTickIcon.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"DoubleTickIcon.mjs","sources":["../../../src/components/Icons/DoubleTickIcon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport type { IconProps } from \"./types\";\n\nexport const DoubleTickIcon = React.forwardRef<SVGSVGElement, IconProps>(\n  ({ className, ...props }, ref) => {\n    return (\n      <svg\n        ref={ref}\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        aria-hidden=\"true\"\n        className={cn(\"size-6\", className)}\n        {...props}\n      >\n        <g fill=\"currentColor\">\n          <path\n            fillRule=\"evenodd\"\n            d=\"M5.22 11.47c.29-.29.77-.29 1.06 0l2.3 2.3.594-.596 1.06 1.06L9.11 15.36a.75.75 0 0 1-1.06 0l-2.83-2.83a.755.755 0 0 1 0-1.06m8.5-2.84c.29-.29.77-.29 1.06 0s.29.77 0 1.06l-2.796 2.795-1.06-1.06z\"\n            clipRule=\"evenodd\"\n          />\n          <path d=\"M12.58 15.58a.75.75 0 0 1-.53-.22l-2.83-2.83a.754.754 0 0 1 0-1.06c.29-.29.77-.29 1.06 0l2.3 2.3 5.14-5.14c.29-.29.77-.29 1.06 0s.29.77 0 1.06l-5.67 5.67a.75.75 0 0 1-.53.22\" />\n        </g>\n      </svg>\n    );\n  },\n);\n\nDoubleTickIcon.displayName = \"DoubleTickIcon\";\n"],"names":[],"mappings":";;;;AAIO,MAAM,iBAAiB,MAAM;AAAA,EAClC,CAAC,EAAE,WAAW,GAAG,MAAA,GAAS,QAAQ;AAChC,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,eAAY;AAAA,QACZ,WAAW,GAAG,UAAU,SAAS;AAAA,QAChC,GAAG;AAAA,QAEJ,UAAA,qBAAC,KAAA,EAAE,MAAK,gBACN,UAAA;AAAA,UAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,UAAS;AAAA,cACT,GAAE;AAAA,cACF,UAAS;AAAA,YAAA;AAAA,UAAA;AAAA,UAEX,oBAAC,QAAA,EAAK,GAAE,gLAAA,CAAgL;AAAA,QAAA,EAAA,CAC1L;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;AAEA,eAAe,cAAc;"}
+{"version":3,"file":"DoubleTickIcon.mjs","sources":["../../../src/components/Icons/DoubleTickIcon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport type { IconProps } from \"./types\";\n\nexport const DoubleTickIcon = React.forwardRef<SVGSVGElement, IconProps>(\n  ({ className, ...props }, ref) => {\n    return (\n      <svg\n        ref={ref}\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        aria-hidden=\"true\"\n        className={cn(\"size-6\", className)}\n        {...props}\n      >\n        <g stroke=\"currentColor\" strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"1.5\">\n          <path d=\"m8 11.5 5 5L22.5 7M2 11.5l5 5L8.5 15m8-8-4.75 4.75\" />\n        </g>\n      </svg>\n    );\n  },\n);\n\nDoubleTickIcon.displayName = \"DoubleTickIcon\";\n"],"names":[],"mappings":";;;;AAIO,MAAM,iBAAiB,MAAM;AAAA,EAClC,CAAC,EAAE,WAAW,GAAG,MAAA,GAAS,QAAQ;AAChC,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,eAAY;AAAA,QACZ,WAAW,GAAG,UAAU,SAAS;AAAA,QAChC,GAAG;AAAA,QAEJ,UAAA,oBAAC,KAAA,EAAE,QAAO,gBAAe,eAAc,SAAQ,gBAAe,SAAQ,aAAY,OAChF,UAAA,oBAAC,QAAA,EAAK,GAAE,sDAAqD,EAAA,CAC/D;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;AAEA,eAAe,cAAc;"}

package/dist/components/Icons/TickIcon.mjs

@@ -16,8 +16,11 @@ const TickIcon = React.forwardRef(
         children: /* @__PURE__ */ jsx(
           "path",
           {
-            fill: "currentColor",
-            d: "M10.58 15.58a.75.75 0 0 1-.53-.22l-2.83-2.83a.754.754 0 0 1 0-1.06c.29-.29.77-.29 1.06 0l2.3 2.3 5.14-5.14c.29-.29.77-.29 1.06 0s.29.77 0 1.06l-5.67 5.67a.75.75 0 0 1-.53.22"
+            stroke: "currentColor",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            strokeWidth: "1.5",
+            d: "m5 12 5 5 9.5-9.5"
           }
         )
       }

package/dist/components/Icons/TickIcon.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"TickIcon.mjs","sources":["../../../src/components/Icons/TickIcon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport type { IconProps } from \"./types\";\n\nexport const TickIcon = React.forwardRef<SVGSVGElement, IconProps>(\n  ({ className, ...props }, ref) => {\n    return (\n      <svg\n        ref={ref}\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        aria-hidden=\"true\"\n        className={cn(\"size-6\", className)}\n        {...props}\n      >\n        <path\n          fill=\"currentColor\"\n          d=\"M10.58 15.58a.75.75 0 0 1-.53-.22l-2.83-2.83a.754.754 0 0 1 0-1.06c.29-.29.77-.29 1.06 0l2.3 2.3 5.14-5.14c.29-.29.77-.29 1.06 0s.29.77 0 1.06l-5.67 5.67a.75.75 0 0 1-.53.22\"\n        />\n      </svg>\n    );\n  },\n);\n\nTickIcon.displayName = \"TickIcon\";\n"],"names":[],"mappings":";;;;AAIO,MAAM,WAAW,MAAM;AAAA,EAC5B,CAAC,EAAE,WAAW,GAAG,MAAA,GAAS,QAAQ;AAChC,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,eAAY;AAAA,QACZ,WAAW,GAAG,UAAU,SAAS;AAAA,QAChC,GAAG;AAAA,QAEJ,UAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,GAAE;AAAA,UAAA;AAAA,QAAA;AAAA,MACJ;AAAA,IAAA;AAAA,EAGN;AACF;AAEA,SAAS,cAAc;"}
+{"version":3,"file":"TickIcon.mjs","sources":["../../../src/components/Icons/TickIcon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport type { IconProps } from \"./types\";\n\nexport const TickIcon = React.forwardRef<SVGSVGElement, IconProps>(\n  ({ className, ...props }, ref) => {\n    return (\n      <svg\n        ref={ref}\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        aria-hidden=\"true\"\n        className={cn(\"size-6\", className)}\n        {...props}\n      >\n        <path\n          stroke=\"currentColor\"\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n          strokeWidth=\"1.5\"\n          d=\"m5 12 5 5 9.5-9.5\"\n        />\n      </svg>\n    );\n  },\n);\n\nTickIcon.displayName = \"TickIcon\";\n"],"names":[],"mappings":";;;;AAIO,MAAM,WAAW,MAAM;AAAA,EAC5B,CAAC,EAAE,WAAW,GAAG,MAAA,GAAS,QAAQ;AAChC,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,eAAY;AAAA,QACZ,WAAW,GAAG,UAAU,SAAS;AAAA,QAChC,GAAG;AAAA,QAEJ,UAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,QAAO;AAAA,YACP,eAAc;AAAA,YACd,gBAAe;AAAA,YACf,aAAY;AAAA,YACZ,GAAE;AAAA,UAAA;AAAA,QAAA;AAAA,MACJ;AAAA,IAAA;AAAA,EAGN;AACF;AAEA,SAAS,cAAc;"}

package/dist/components/PasswordField/PasswordField.mjs

@@ -1,8 +1,8 @@
 "use client";
 import { jsx } from "react/jsx-runtime";
 import * as React from "react";
-import { EyeClosedIcon } from "../Icons/EyeClosedIcon.mjs";
 import { EyeIcon } from "../Icons/EyeIcon.mjs";
+import { EyeSlashIcon } from "../Icons/EyeSlashIcon.mjs";
 import { TextField } from "../TextField/TextField.mjs";
 const PasswordField = React.forwardRef(
   ({ disabled, ...props }, ref) => {
@@ -19,7 +19,7 @@ const PasswordField = React.forwardRef(
         "aria-label": showPassword ? "Hide password" : "Show password",
         tabIndex: -1,
         className: "flex size-5 shrink-0 items-center justify-center text-foreground-secondary transition-colors hover:text-foreground-default focus:outline-none disabled:cursor-not-allowed",
-        children: showPassword ? /* @__PURE__ */ jsx(EyeClosedIcon, {}) : /* @__PURE__ */ jsx(EyeIcon, {})
+        children: showPassword ? /* @__PURE__ */ jsx(EyeSlashIcon, {}) : /* @__PURE__ */ jsx(EyeIcon, {})
       }
     );
     return /* @__PURE__ */ jsx(

package/dist/components/PasswordField/PasswordField.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"PasswordField.mjs","sources":["../../../src/components/PasswordField/PasswordField.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { EyeClosedIcon } from \"../Icons/EyeClosedIcon\";\nimport { EyeIcon } from \"../Icons/EyeIcon\";\nimport { TextField, type TextFieldProps } from \"../TextField/TextField\";\n\nexport type PasswordFieldSize = \"48\" | \"40\" | \"32\";\n\nexport interface PasswordFieldProps extends Omit<TextFieldProps, \"type\" | \"rightIcon\"> {\n  /** Size variant of the password field */\n  size?: PasswordFieldSize;\n}\n\nexport const PasswordField = React.forwardRef<HTMLInputElement, PasswordFieldProps>(\n  ({ disabled, ...props }, ref) => {\n    const [showPassword, setShowPassword] = React.useState(false);\n\n    const togglePasswordVisibility = () => {\n      setShowPassword((prev) => !prev);\n    };\n\n    const rightIcon = (\n      <button\n        type=\"button\"\n        onClick={togglePasswordVisibility}\n        disabled={disabled}\n        aria-label={showPassword ? \"Hide password\" : \"Show password\"}\n        tabIndex={-1}\n        className=\"flex size-5 shrink-0 items-center justify-center text-foreground-secondary transition-colors hover:text-foreground-default focus:outline-none disabled:cursor-not-allowed\"\n      >\n        {showPassword ? <EyeClosedIcon /> : <EyeIcon />}\n      </button>\n    );\n\n    return (\n      <TextField\n        ref={ref}\n        type={showPassword ? \"text\" : \"password\"}\n        disabled={disabled}\n        rightIcon={rightIcon}\n        aria-label={!props.label ? \"Password field\" : undefined}\n        {...props}\n      />\n    );\n  },\n);\n\nPasswordField.displayName = \"PasswordField\";\n"],"names":[],"mappings":";;;;;;AAYO,MAAM,gBAAgB,MAAM;AAAA,EACjC,CAAC,EAAE,UAAU,GAAG,MAAA,GAAS,QAAQ;AAC/B,UAAM,CAAC,cAAc,eAAe,IAAI,MAAM,SAAS,KAAK;AAE5D,UAAM,2BAA2B,MAAM;AACrC,sBAAgB,CAAC,SAAS,CAAC,IAAI;AAAA,IACjC;AAEA,UAAM,YACJ;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,SAAS;AAAA,QACT;AAAA,QACA,cAAY,eAAe,kBAAkB;AAAA,QAC7C,UAAU;AAAA,QACV,WAAU;AAAA,QAET,UAAA,eAAe,oBAAC,eAAA,CAAA,CAAc,wBAAM,SAAA,CAAA,CAAQ;AAAA,MAAA;AAAA,IAAA;AAIjD,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,MAAM,eAAe,SAAS;AAAA,QAC9B;AAAA,QACA;AAAA,QACA,cAAY,CAAC,MAAM,QAAQ,mBAAmB;AAAA,QAC7C,GAAG;AAAA,MAAA;AAAA,IAAA;AAAA,EAGV;AACF;AAEA,cAAc,cAAc;"}
+{"version":3,"file":"PasswordField.mjs","sources":["../../../src/components/PasswordField/PasswordField.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { EyeIcon } from \"../Icons/EyeIcon\";\nimport { EyeSlashIcon } from \"../Icons/EyeSlashIcon\";\nimport { TextField, type TextFieldProps } from \"../TextField/TextField\";\n\nexport type PasswordFieldSize = \"48\" | \"40\" | \"32\";\n\nexport interface PasswordFieldProps extends Omit<TextFieldProps, \"type\" | \"rightIcon\"> {\n  /** Size variant of the password field */\n  size?: PasswordFieldSize;\n}\n\nexport const PasswordField = React.forwardRef<HTMLInputElement, PasswordFieldProps>(\n  ({ disabled, ...props }, ref) => {\n    const [showPassword, setShowPassword] = React.useState(false);\n\n    const togglePasswordVisibility = () => {\n      setShowPassword((prev) => !prev);\n    };\n\n    const rightIcon = (\n      <button\n        type=\"button\"\n        onClick={togglePasswordVisibility}\n        disabled={disabled}\n        aria-label={showPassword ? \"Hide password\" : \"Show password\"}\n        tabIndex={-1}\n        className=\"flex size-5 shrink-0 items-center justify-center text-foreground-secondary transition-colors hover:text-foreground-default focus:outline-none disabled:cursor-not-allowed\"\n      >\n        {showPassword ? <EyeSlashIcon /> : <EyeIcon />}\n      </button>\n    );\n\n    return (\n      <TextField\n        ref={ref}\n        type={showPassword ? \"text\" : \"password\"}\n        disabled={disabled}\n        rightIcon={rightIcon}\n        aria-label={!props.label ? \"Password field\" : undefined}\n        {...props}\n      />\n    );\n  },\n);\n\nPasswordField.displayName = \"PasswordField\";\n"],"names":[],"mappings":";;;;;;AAYO,MAAM,gBAAgB,MAAM;AAAA,EACjC,CAAC,EAAE,UAAU,GAAG,MAAA,GAAS,QAAQ;AAC/B,UAAM,CAAC,cAAc,eAAe,IAAI,MAAM,SAAS,KAAK;AAE5D,UAAM,2BAA2B,MAAM;AACrC,sBAAgB,CAAC,SAAS,CAAC,IAAI;AAAA,IACjC;AAEA,UAAM,YACJ;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,SAAS;AAAA,QACT;AAAA,QACA,cAAY,eAAe,kBAAkB;AAAA,QAC7C,UAAU;AAAA,QACV,WAAU;AAAA,QAET,UAAA,eAAe,oBAAC,cAAA,CAAA,CAAa,wBAAM,SAAA,CAAA,CAAQ;AAAA,MAAA;AAAA,IAAA;AAIhD,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,MAAM,eAAe,SAAS;AAAA,QAC9B;AAAA,QACA;AAAA,QACA,cAAY,CAAC,MAAM,QAAQ,mBAAmB;AAAA,QAC7C,GAAG;AAAA,MAAA;AAAA,IAAA;AAAA,EAGV;AACF;AAEA,cAAc,cAAc;"}

package/dist/styles/theme.css

@@ -7,6 +7,10 @@
     touch-action: manipulation;
   }
 
+  body {
+    -webkit-font-smoothing: antialiased;
+  }
+
   input:-webkit-autofill,
   input:-webkit-autofill:hover,
   input:-webkit-autofill:focus,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fanvue/ui",
-  "version": "1.16.3",
+  "version": "1.16.5",
   "description": "React component library built with Tailwind CSS for Fanvue ecosystem",
   "publishConfig": {
     "registry": "https://registry.npmjs.org",