@aurora-is-near/intents-swap-widget 3.18.1 → 3.18.2

package/dist/components/Accordion.js

@@ -1,36 +1,36 @@
 import { jsxs as s, jsx as e } from "react/jsx-runtime";
-import { useState as x } from "react";
-import * as a from "lucide-react";
+import { useState as w } from "react";
+import { ChevronLeftW700 as a } from "@material-symbols-svg/react-rounded/icons/chevron-left";
 import { Hr as p } from "./Hr.js";
 import { Card as f } from "./Card.js";
 import { Badge as h } from "./Badge.js";
 import { cn as u } from "../utils/cn.js";
-const j = ({
+const k = ({
   title: r,
-  badge: l,
+  badge: t,
   children: o,
-  isBadgeLoading: n,
-  expandedHeightPx: m,
-  expandedByDefault: i = !1,
+  isBadgeLoading: m,
+  expandedHeightPx: i,
+  expandedByDefault: n = !1,
   className: c
 }) => {
-  const [t, d] = x(i);
+  const [l, d] = w(n);
   return /* @__PURE__ */ s(
     f,
     {
       isClickable: !0,
       className: u("py-sw-lg", c),
-      onClick: () => d((w) => !w),
+      onClick: () => d((x) => !x),
       children: [
         /* @__PURE__ */ s("header", { className: "align-center flex w-full justify-between", children: [
           /* @__PURE__ */ e("span", { className: "gap-sw-xs text-sw-label-md mt-sw-xs flex text-center text-sw-gray-200", children: r }),
-          n ? /* @__PURE__ */ e("div", { className: "ml-auto h-[20px] w-[100px] animate-pulse rounded-full bg-sw-gray-800" }) : l && /* @__PURE__ */ e(h, { children: l }),
-          /* @__PURE__ */ e("button", { type: "button", className: "ml-sw-lg cursor-pointer", children: t ? /* @__PURE__ */ e(a.ChevronUp, { className: "h-sw-2xl w-sw-2xl text-sw-gray-200" }) : /* @__PURE__ */ e(a.ChevronDown, { className: "h-sw-2xl w-sw-2xl text-sw-gray-200" }) })
+          m ? /* @__PURE__ */ e("div", { className: "ml-auto h-[20px] w-[100px] animate-pulse rounded-full bg-sw-gray-800" }) : t && /* @__PURE__ */ e(h, { children: t }),
+          /* @__PURE__ */ e("button", { type: "button", className: "ml-sw-lg cursor-pointer", children: l ? /* @__PURE__ */ e(a, { className: "h-sw-2xl w-sw-2xl text-sw-gray-200 rotate-90" }) : /* @__PURE__ */ e(a, { className: "h-sw-2xl w-sw-2xl text-sw-gray-200 -rotate-90" }) })
         ] }),
         /* @__PURE__ */ s(
           "div",
           {
-            style: { height: t ? m : 0 },
+            style: { height: l ? i : 0 },
             className: "gap-sw-md flex flex-col overflow-hidden transition-all delay-0 duration-300 ease-in-out",
             children: [
               /* @__PURE__ */ e(p, { className: "mt-sw-xl mb-sw-md" }),
@@ -43,6 +43,6 @@ const j = ({
   );
 };
 export {
-  j as Accordion
+  k as Accordion
 };
 //# sourceMappingURL=Accordion.js.map

package/dist/components/Accordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.js","sources":["../../src/components/Accordion.tsx"],"sourcesContent":["import { useState } from 'react';\nimport * as Icons from 'lucide-react';\nimport type { ReactNode } from 'react';\n\nimport { Hr } from './Hr';\nimport { Card } from './Card';\nimport { Badge } from './Badge';\nimport { cn } from '@/utils/cn';\n\ntype Props = {\n  title: ReactNode;\n  badge?: string;\n  isBadgeLoading?: boolean;\n  expandedByDefault?: boolean;\n  children: ReactNode | ReactNode[];\n  expandedHeightPx: number;\n  className?: string;\n};\n\nexport const Accordion = ({\n  title,\n  badge,\n  children,\n  isBadgeLoading,\n  expandedHeightPx,\n  expandedByDefault = false,\n  className,\n}: Props) => {\n  const [isExpanded, setIsExpanded] = useState(expandedByDefault);\n\n  return (\n    <Card\n      isClickable\n      className={cn('py-sw-lg', className)}\n      onClick={() => setIsExpanded((p) => !p)}>\n      <header className=\"align-center flex w-full justify-between\">\n        <span className=\"gap-sw-xs text-sw-label-md mt-sw-xs flex text-center text-sw-gray-200\">\n          {title}\n        </span>\n        {isBadgeLoading ? (\n          <div className=\"ml-auto h-[20px] w-[100px] animate-pulse rounded-full bg-sw-gray-800\" />\n        ) : (\n          badge && <Badge>{badge}</Badge>\n        )}\n        <button type=\"button\" className=\"ml-sw-lg cursor-pointer\">\n          {isExpanded ? (\n            <Icons.ChevronUp className=\"h-sw-2xl w-sw-2xl text-sw-gray-200\" />\n          ) : (\n            <Icons.ChevronDown className=\"h-sw-2xl w-sw-2xl text-sw-gray-200\" />\n          )}\n        </button>\n      </header>\n\n      <div\n        style={{ height: isExpanded ? expandedHeightPx : 0 }} // has to be inline for animation to work\n        className=\"gap-sw-md flex flex-col overflow-hidden transition-all delay-0 duration-300 ease-in-out\">\n        <Hr className=\"mt-sw-xl mb-sw-md\" />\n        {children}\n      </div>\n    </Card>\n  );\n};\n"],"names":["Accordion","title","badge","children","isBadgeLoading","expandedHeightPx","expandedByDefault","className","isExpanded","setIsExpanded","useState","jsxs","Card","cn","p","jsx","Badge","Icons","Hr"],"mappings":";;;;;;;AAmBO,MAAMA,IAAY,CAAC;AAAA,EACxB,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,mBAAAC,IAAoB;AAAA,EACpB,WAAAC;AACF,MAAa;AACX,QAAM,CAACC,GAAYC,CAAa,IAAIC,EAASJ,CAAiB;AAE9D,SACE,gBAAAK;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,aAAW;AAAA,MACX,WAAWC,EAAG,YAAYN,CAAS;AAAA,MACnC,SAAS,MAAME,EAAc,CAACK,MAAM,CAACA,CAAC;AAAA,MACtC,UAAA;AAAA,QAAA,gBAAAH,EAAC,UAAA,EAAO,WAAU,4CAChB,UAAA;AAAA,UAAA,gBAAAI,EAAC,QAAA,EAAK,WAAU,yEACb,UAAAd,GACH;AAAA,UACCG,sBACE,OAAA,EAAI,WAAU,wEAAuE,IAEtFF,KAAS,gBAAAa,EAACC,GAAA,EAAO,UAAAd,EAAA,CAAM;AAAA,UAEzB,gBAAAa,EAAC,YAAO,MAAK,UAAS,WAAU,2BAC7B,UAAAP,sBACES,EAAM,WAAN,EAAgB,WAAU,qCAAA,CAAqC,IAEhE,gBAAAF,EAACE,EAAM,aAAN,EAAkB,WAAU,sCAAqC,EAAA,CAEtE;AAAA,QAAA,GACF;AAAA,QAEA,gBAAAN;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,OAAO,EAAE,QAAQH,IAAaH,IAAmB,EAAA;AAAA,YACjD,WAAU;AAAA,YACV,UAAA;AAAA,cAAA,gBAAAU,EAACG,GAAA,EAAG,WAAU,oBAAA,CAAoB;AAAA,cACjCf;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA;AAAA,MACH;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"Accordion.js","sources":["../../src/components/Accordion.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { ChevronLeftW700 as ChevronLeft } from '@material-symbols-svg/react-rounded/icons/chevron-left';\nimport type { ReactNode } from 'react';\n\nimport { Hr } from './Hr';\nimport { Card } from './Card';\nimport { Badge } from './Badge';\nimport { cn } from '@/utils/cn';\n\ntype Props = {\n  title: ReactNode;\n  badge?: string;\n  isBadgeLoading?: boolean;\n  expandedByDefault?: boolean;\n  children: ReactNode | ReactNode[];\n  expandedHeightPx: number;\n  className?: string;\n};\n\nexport const Accordion = ({\n  title,\n  badge,\n  children,\n  isBadgeLoading,\n  expandedHeightPx,\n  expandedByDefault = false,\n  className,\n}: Props) => {\n  const [isExpanded, setIsExpanded] = useState(expandedByDefault);\n\n  return (\n    <Card\n      isClickable\n      className={cn('py-sw-lg', className)}\n      onClick={() => setIsExpanded((p) => !p)}>\n      <header className=\"align-center flex w-full justify-between\">\n        <span className=\"gap-sw-xs text-sw-label-md mt-sw-xs flex text-center text-sw-gray-200\">\n          {title}\n        </span>\n        {isBadgeLoading ? (\n          <div className=\"ml-auto h-[20px] w-[100px] animate-pulse rounded-full bg-sw-gray-800\" />\n        ) : (\n          badge && <Badge>{badge}</Badge>\n        )}\n        <button type=\"button\" className=\"ml-sw-lg cursor-pointer\">\n          {isExpanded ? (\n            <ChevronLeft className=\"h-sw-2xl w-sw-2xl text-sw-gray-200 rotate-90\" />\n          ) : (\n            <ChevronLeft className=\"h-sw-2xl w-sw-2xl text-sw-gray-200 -rotate-90\" />\n          )}\n        </button>\n      </header>\n\n      <div\n        style={{ height: isExpanded ? expandedHeightPx : 0 }} // has to be inline for animation to work\n        className=\"gap-sw-md flex flex-col overflow-hidden transition-all delay-0 duration-300 ease-in-out\">\n        <Hr className=\"mt-sw-xl mb-sw-md\" />\n        {children}\n      </div>\n    </Card>\n  );\n};\n"],"names":["Accordion","title","badge","children","isBadgeLoading","expandedHeightPx","expandedByDefault","className","isExpanded","setIsExpanded","useState","jsxs","Card","cn","p","jsx","Badge","ChevronLeft","Hr"],"mappings":";;;;;;;AAmBO,MAAMA,IAAY,CAAC;AAAA,EACxB,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,mBAAAC,IAAoB;AAAA,EACpB,WAAAC;AACF,MAAa;AACX,QAAM,CAACC,GAAYC,CAAa,IAAIC,EAASJ,CAAiB;AAE9D,SACE,gBAAAK;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,aAAW;AAAA,MACX,WAAWC,EAAG,YAAYN,CAAS;AAAA,MACnC,SAAS,MAAME,EAAc,CAACK,MAAM,CAACA,CAAC;AAAA,MACtC,UAAA;AAAA,QAAA,gBAAAH,EAAC,UAAA,EAAO,WAAU,4CAChB,UAAA;AAAA,UAAA,gBAAAI,EAAC,QAAA,EAAK,WAAU,yEACb,UAAAd,GACH;AAAA,UACCG,sBACE,OAAA,EAAI,WAAU,wEAAuE,IAEtFF,KAAS,gBAAAa,EAACC,GAAA,EAAO,UAAAd,EAAA,CAAM;AAAA,4BAExB,UAAA,EAAO,MAAK,UAAS,WAAU,2BAC7B,UAAAM,IACC,gBAAAO,EAACE,GAAA,EAAY,WAAU,gDAA+C,IAEtE,gBAAAF,EAACE,GAAA,EAAY,WAAU,iDAAgD,EAAA,CAE3E;AAAA,QAAA,GACF;AAAA,QAEA,gBAAAN;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,OAAO,EAAE,QAAQH,IAAaH,IAAmB,EAAA;AAAA,YACjD,WAAU;AAAA,YACV,UAAA;AAAA,cAAA,gBAAAU,EAACG,GAAA,EAAG,WAAU,oBAAA,CAAoB;AAAA,cACjCf;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA;AAAA,MACH;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/components/Banner.js

@@ -1,43 +1,57 @@
-import { jsxs as a, jsx as e } from "react/jsx-runtime";
-import * as t from "lucide-react";
+import { jsx as e, jsxs as n } from "react/jsx-runtime";
+import { CloseW700 as l } from "@material-symbols-svg/react-rounded/icons/close";
+import { EmergencyW700 as a } from "@material-symbols-svg/react-rounded/icons/emergency";
+import { ErrorFillW700 as u } from "@material-symbols-svg/react-rounded/icons/error";
+import { VerifiedFillW700 as f } from "@material-symbols-svg/react-rounded/icons/verified";
+import { useMemo as p } from "react";
 import { cn as o } from "../utils/cn.js";
-const u = ({
-  variant: s,
-  multiline: r,
-  message: n,
+const j = ({
+  variant: r,
+  multiline: s,
+  message: c,
   className: i,
-  onDismiss: c
+  onDismiss: t
 }) => {
-  const l = s === "success" ? /* @__PURE__ */ e(t.CheckCircle, { size: 16 }) : /* @__PURE__ */ e(t.CircleAlert, { size: 16 });
-  return /* @__PURE__ */ a(
+  const m = p(() => {
+    switch (r) {
+      case "success":
+        return /* @__PURE__ */ e(f, { size: 16 });
+      case "error":
+        return /* @__PURE__ */ e(u, { size: 16 });
+      case "warn":
+      default:
+        return /* @__PURE__ */ e(a, { size: 16 });
+    }
+  }, [r]);
+  return /* @__PURE__ */ n(
     "div",
     {
       className: o(
         "gap-sw-md relative flex items-center",
         {
-          "text-sw-status-error": s === "error",
-          "text-sw-status-warning": s === "warn",
-          "text-sw-status-success": s === "success"
+          "text-sw-status-error": r === "error",
+          "text-sw-status-warning": r === "warn",
+          "text-sw-status-success": r === "success"
         },
         i
       ),
       children: [
-        !r && l,
+        !s && m,
         /* @__PURE__ */ e(
           "span",
           {
             className: o("text-sw-label-sm", {
-              "text-nowrap": !r
+              "text-nowrap": !s
             }),
-            children: n
+            children: c
           }
         ),
-        c && /* @__PURE__ */ e(
+        t && /* @__PURE__ */ e(
           "div",
           {
-            onClick: c,
+            onClick: t,
             className: "ml-auto flex cursor-pointer items-center justify-center transition-all hover:scale-125",
-            children: /* @__PURE__ */ e(t.X, { size: 16, strokeWidth: 2.5 })
+            children: /* @__PURE__ */ e(l, { size: 16 })
           }
         )
       ]
@@ -45,6 +59,6 @@ const u = ({
   );
 };
 export {
-  u as Banner
+  j as Banner
 };
 //# sourceMappingURL=Banner.js.map

package/dist/components/Banner.js.map

@@ -1 +1 @@
-{"version":3,"file":"Banner.js","sources":["../../src/components/Banner.tsx"],"sourcesContent":["import * as Icons from 'lucide-react';\n\nimport { cn } from '@/utils/cn';\n\ntype Props = {\n  message: string;\n  multiline?: boolean;\n  variant: 'error' | 'warn' | 'success';\n  className?: string;\n  onDismiss?: () => void;\n};\n\nexport const Banner = ({\n  variant,\n  multiline,\n  message,\n  className,\n  onDismiss,\n}: Props) => {\n  const icon =\n    variant === 'success' ? (\n      <Icons.CheckCircle size={16} />\n    ) : (\n      <Icons.CircleAlert size={16} />\n    );\n\n  return (\n    <div\n      className={cn(\n        'gap-sw-md relative flex items-center',\n        {\n          'text-sw-status-error': variant === 'error',\n          'text-sw-status-warning': variant === 'warn',\n          'text-sw-status-success': variant === 'success',\n        },\n        className,\n      )}>\n      {!multiline && icon}\n      <span\n        className={cn('text-sw-label-sm', {\n          'text-nowrap': !multiline,\n        })}>\n        {message}\n      </span>\n      {onDismiss && (\n        <div\n          onClick={onDismiss}\n          className=\"ml-auto flex cursor-pointer items-center justify-center transition-all hover:scale-125\">\n          <Icons.X size={16} strokeWidth={2.5} />\n        </div>\n      )}\n    </div>\n  );\n};\n"],"names":["Banner","variant","multiline","message","className","onDismiss","icon","jsx","Icons","jsxs","cn"],"mappings":";;;AAYO,MAAMA,IAAS,CAAC;AAAA,EACrB,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC;AACF,MAAa;AACX,QAAMC,IACJL,MAAY,YACV,gBAAAM,EAACC,EAAM,aAAN,EAAkB,MAAM,GAAA,CAAI,IAE7B,gBAAAD,EAACC,EAAM,aAAN,EAAkB,MAAM,IAAI;AAGjC,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACA;AAAA,UACE,wBAAwBT,MAAY;AAAA,UACpC,0BAA0BA,MAAY;AAAA,UACtC,0BAA0BA,MAAY;AAAA,QAAA;AAAA,QAExCG;AAAA,MAAA;AAAA,MAED,UAAA;AAAA,QAAA,CAACF,KAAaI;AAAA,QACf,gBAAAC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAWG,EAAG,oBAAoB;AAAA,cAChC,eAAe,CAACR;AAAA,YAAA,CACjB;AAAA,YACA,UAAAC;AAAA,UAAA;AAAA,QAAA;AAAA,QAEFE,KACC,gBAAAE;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,SAASF;AAAA,YACT,WAAU;AAAA,YACV,4BAACG,EAAM,GAAN,EAAQ,MAAM,IAAI,aAAa,IAAA,CAAK;AAAA,UAAA;AAAA,QAAA;AAAA,MACvC;AAAA,IAAA;AAAA,EAAA;AAIR;"}
+{"version":3,"file":"Banner.js","sources":["../../src/components/Banner.tsx"],"sourcesContent":["import { CloseW700 as Close } from '@material-symbols-svg/react-rounded/icons/close';\nimport { EmergencyW700 as Emergency } from '@material-symbols-svg/react-rounded/icons/emergency';\nimport { ErrorFillW700 as ErrorFill } from '@material-symbols-svg/react-rounded/icons/error';\nimport { VerifiedFillW700 as VerifiedFill } from '@material-symbols-svg/react-rounded/icons/verified';\nimport { useMemo } from 'react';\n\nimport { cn } from '@/utils/cn';\n\ntype Props = {\n  message: string;\n  multiline?: boolean;\n  variant: 'error' | 'warn' | 'success';\n  className?: string;\n  onDismiss?: () => void;\n};\n\nexport const Banner = ({\n  variant,\n  multiline,\n  message,\n  className,\n  onDismiss,\n}: Props) => {\n  const icon = useMemo(() => {\n    switch (variant) {\n      case 'success':\n        return <VerifiedFill size={16} />;\n      case 'error':\n        return <ErrorFill size={16} />;\n      case 'warn':\n      default:\n        return <Emergency size={16} />;\n    }\n  }, [variant]);\n\n  return (\n    <div\n      className={cn(\n        'gap-sw-md relative flex items-center',\n        {\n          'text-sw-status-error': variant === 'error',\n          'text-sw-status-warning': variant === 'warn',\n          'text-sw-status-success': variant === 'success',\n        },\n        className,\n      )}>\n      {!multiline && icon}\n      <span\n        className={cn('text-sw-label-sm', {\n          'text-nowrap': !multiline,\n        })}>\n        {message}\n      </span>\n      {onDismiss && (\n        <div\n          onClick={onDismiss}\n          className=\"ml-auto flex cursor-pointer items-center justify-center transition-all hover:scale-125\">\n          <Close size={16} />\n        </div>\n      )}\n    </div>\n  );\n};\n"],"names":["Banner","variant","multiline","message","className","onDismiss","icon","useMemo","jsx","VerifiedFill","ErrorFill","Emergency","jsxs","cn","Close"],"mappings":";;;;;;;AAgBO,MAAMA,IAAS,CAAC;AAAA,EACrB,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC;AACF,MAAa;AACX,QAAMC,IAAOC,EAAQ,MAAM;AACzB,YAAQN,GAAA;AAAA,MACN,KAAK;AACH,eAAO,gBAAAO,EAACC,GAAA,EAAa,MAAM,GAAA,CAAI;AAAA,MACjC,KAAK;AACH,eAAO,gBAAAD,EAACE,GAAA,EAAU,MAAM,GAAA,CAAI;AAAA,MAC9B,KAAK;AAAA,MACL;AACE,eAAO,gBAAAF,EAACG,GAAA,EAAU,MAAM,GAAA,CAAI;AAAA,IAAA;AAAA,EAElC,GAAG,CAACV,CAAO,CAAC;AAEZ,SACE,gBAAAW;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACA;AAAA,UACE,wBAAwBZ,MAAY;AAAA,UACpC,0BAA0BA,MAAY;AAAA,UACtC,0BAA0BA,MAAY;AAAA,QAAA;AAAA,QAExCG;AAAA,MAAA;AAAA,MAED,UAAA;AAAA,QAAA,CAACF,KAAaI;AAAA,QACf,gBAAAE;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAWK,EAAG,oBAAoB;AAAA,cAChC,eAAe,CAACX;AAAA,YAAA,CACjB;AAAA,YACA,UAAAC;AAAA,UAAA;AAAA,QAAA;AAAA,QAEFE,KACC,gBAAAG;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,SAASH;AAAA,YACT,WAAU;AAAA,YACV,UAAA,gBAAAG,EAACM,GAAA,EAAM,MAAM,GAAA,CAAI;AAAA,UAAA;AAAA,QAAA;AAAA,MACnB;AAAA,IAAA;AAAA,EAAA;AAIR;"}

package/dist/components/BlockingError.js

@@ -1,39 +1,34 @@
 import { jsx as e, jsxs as s } from "react/jsx-runtime";
-import * as t from "lucide-react";
-import { Button as a } from "./Button.js";
-import { Card as c } from "./Card.js";
-const m = ({ message: r, onClickRetry: l }) => /* @__PURE__ */ e(c, { className: "w-full", children: /* @__PURE__ */ s("div", { className: "gap-sw-4xl py-6xl flex min-h-[200px] flex-col items-center justify-center w-full", children: [
+import { CachedW700 as l } from "@material-symbols-svg/react-rounded/icons/cached";
+import { CloseW700 as a } from "@material-symbols-svg/react-rounded/icons/close";
+import { Button as c } from "./Button.js";
+import { Card as i } from "./Card.js";
+const p = ({ message: t, onClickRetry: r }) => /* @__PURE__ */ e(i, { className: "w-full", children: /* @__PURE__ */ s("div", { className: "gap-sw-4xl py-6xl flex min-h-[200px] flex-col items-center justify-center w-full", children: [
   /* @__PURE__ */ s("div", { className: "gap-sw-xl flex flex-col items-center justify-center", children: [
     /* @__PURE__ */ s("header", { className: "gap-sw-md flex items-center", children: [
-      /* @__PURE__ */ e(
-        t.X,
-        {
-          strokeWidth: 2.5,
-          className: "text-sw-accent-500 h-sw-4xl w-sw-4xl"
-        }
-      ),
+      /* @__PURE__ */ e(a, { className: "text-sw-accent-500 h-sw-4xl w-sw-4xl" }),
       /* @__PURE__ */ e("h3", { className: "text-sw-value-lg text-sw-accent-500", children: "Ooops..." })
     ] }),
     /* @__PURE__ */ s("p", { className: "text-sw-body-md text-center text-sw-gray-100", children: [
-      r,
+      t,
       " ",
       /* @__PURE__ */ e("br", {}),
       " Please try again or contact support."
     ] })
   ] }),
   /* @__PURE__ */ e(
-    a,
+    c,
     {
       size: "md",
       variant: "primary",
-      icon: t.RefreshCcw,
-      onClick: l,
+      icon: l,
+      onClick: r,
       className: "w-fit",
       children: "Try again"
     }
   )
 ] }) });
 export {
-  m as BlockingError
+  p as BlockingError
 };
 //# sourceMappingURL=BlockingError.js.map

package/dist/components/BlockingError.js.map

@@ -1 +1 @@
-{"version":3,"file":"BlockingError.js","sources":["../../src/components/BlockingError.tsx"],"sourcesContent":["import * as Icons from 'lucide-react';\n\nimport { Button } from './Button';\nimport { Card } from './Card';\n\ntype Props = {\n  message: string;\n  onClickRetry: () => void;\n};\n\nexport const BlockingError = ({ message, onClickRetry }: Props) => (\n  <Card className=\"w-full\">\n    <div className=\"gap-sw-4xl py-6xl flex min-h-[200px] flex-col items-center justify-center w-full\">\n      <div className=\"gap-sw-xl flex flex-col items-center justify-center\">\n        <header className=\"gap-sw-md flex items-center\">\n          <Icons.X\n            strokeWidth={2.5}\n            className=\"text-sw-accent-500 h-sw-4xl w-sw-4xl\"\n          />\n          <h3 className=\"text-sw-value-lg text-sw-accent-500\">Ooops...</h3>\n        </header>\n        <p className=\"text-sw-body-md text-center text-sw-gray-100\">\n          {message} <br /> Please try again or contact support.\n        </p>\n      </div>\n      <Button\n        size=\"md\"\n        variant=\"primary\"\n        icon={Icons.RefreshCcw}\n        onClick={onClickRetry}\n        className=\"w-fit\">\n        Try again\n      </Button>\n    </div>\n  </Card>\n);\n"],"names":["BlockingError","message","onClickRetry","jsx","Card","jsxs","Icons","Button"],"mappings":";;;;AAUO,MAAMA,IAAgB,CAAC,EAAE,SAAAC,GAAS,cAAAC,EAAA,MACvC,gBAAAC,EAACC,GAAA,EAAK,WAAU,UACd,UAAA,gBAAAC,EAAC,OAAA,EAAI,WAAU,oFACb,UAAA;AAAA,EAAA,gBAAAA,EAAC,OAAA,EAAI,WAAU,uDACb,UAAA;AAAA,IAAA,gBAAAA,EAAC,UAAA,EAAO,WAAU,+BAChB,UAAA;AAAA,MAAA,gBAAAF;AAAA,QAACG,EAAM;AAAA,QAAN;AAAA,UACC,aAAa;AAAA,UACb,WAAU;AAAA,QAAA;AAAA,MAAA;AAAA,MAEZ,gBAAAH,EAAC,MAAA,EAAG,WAAU,uCAAsC,UAAA,WAAA,CAAQ;AAAA,IAAA,GAC9D;AAAA,IACA,gBAAAE,EAAC,KAAA,EAAE,WAAU,gDACV,UAAA;AAAA,MAAAJ;AAAA,MAAQ;AAAA,wBAAE,MAAA,EAAG;AAAA,MAAE;AAAA,IAAA,EAAA,CAClB;AAAA,EAAA,GACF;AAAA,EACA,gBAAAE;AAAA,IAACI;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,SAAQ;AAAA,MACR,MAAMD,EAAM;AAAA,MACZ,SAASJ;AAAA,MACT,WAAU;AAAA,MAAQ,UAAA;AAAA,IAAA;AAAA,EAAA;AAEpB,EAAA,CACF,EAAA,CACF;"}
+{"version":3,"file":"BlockingError.js","sources":["../../src/components/BlockingError.tsx"],"sourcesContent":["import { CachedW700 as Cached } from '@material-symbols-svg/react-rounded/icons/cached';\nimport { CloseW700 as Close } from '@material-symbols-svg/react-rounded/icons/close';\n\nimport { Button } from './Button';\nimport { Card } from './Card';\n\ntype Props = {\n  message: string;\n  onClickRetry: () => void;\n};\n\nexport const BlockingError = ({ message, onClickRetry }: Props) => (\n  <Card className=\"w-full\">\n    <div className=\"gap-sw-4xl py-6xl flex min-h-[200px] flex-col items-center justify-center w-full\">\n      <div className=\"gap-sw-xl flex flex-col items-center justify-center\">\n        <header className=\"gap-sw-md flex items-center\">\n          <Close className=\"text-sw-accent-500 h-sw-4xl w-sw-4xl\" />\n          <h3 className=\"text-sw-value-lg text-sw-accent-500\">Ooops...</h3>\n        </header>\n        <p className=\"text-sw-body-md text-center text-sw-gray-100\">\n          {message} <br /> Please try again or contact support.\n        </p>\n      </div>\n      <Button\n        size=\"md\"\n        variant=\"primary\"\n        icon={Cached}\n        onClick={onClickRetry}\n        className=\"w-fit\">\n        Try again\n      </Button>\n    </div>\n  </Card>\n);\n"],"names":["BlockingError","message","onClickRetry","jsx","Card","jsxs","Close","Button","Cached"],"mappings":";;;;;AAWO,MAAMA,IAAgB,CAAC,EAAE,SAAAC,GAAS,cAAAC,EAAA,MACvC,gBAAAC,EAACC,GAAA,EAAK,WAAU,UACd,UAAA,gBAAAC,EAAC,OAAA,EAAI,WAAU,oFACb,UAAA;AAAA,EAAA,gBAAAA,EAAC,OAAA,EAAI,WAAU,uDACb,UAAA;AAAA,IAAA,gBAAAA,EAAC,UAAA,EAAO,WAAU,+BAChB,UAAA;AAAA,MAAA,gBAAAF,EAACG,GAAA,EAAM,WAAU,uCAAA,CAAuC;AAAA,MACxD,gBAAAH,EAAC,MAAA,EAAG,WAAU,uCAAsC,UAAA,WAAA,CAAQ;AAAA,IAAA,GAC9D;AAAA,IACA,gBAAAE,EAAC,KAAA,EAAE,WAAU,gDACV,UAAA;AAAA,MAAAJ;AAAA,MAAQ;AAAA,wBAAE,MAAA,EAAG;AAAA,MAAE;AAAA,IAAA,EAAA,CAClB;AAAA,EAAA,GACF;AAAA,EACA,gBAAAE;AAAA,IAACI;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,SAAQ;AAAA,MACR,MAAMC;AAAAA,MACN,SAASN;AAAA,MACT,WAAU;AAAA,MAAQ,UAAA;AAAA,IAAA;AAAA,EAAA;AAEpB,EAAA,CACF,EAAA,CACF;"}

package/dist/components/Button.d.ts

@@ -1,4 +1,4 @@
-import { LucideIcon } from 'lucide-react';
+import { MaterialSymbolsComponent } from '@material-symbols-svg/react';
 type Size = 'sm' | 'md' | 'lg';
 type Variant = 'primary' | 'outlined';
 type State = 'default' | 'loading' | 'disabled' | 'active' | 'error';
@@ -11,7 +11,7 @@ type Props = {
     onClick?: () => void;
     fluid?: boolean;
 } & ({
-    icon: LucideIcon;
+    icon: MaterialSymbolsComponent;
     iconPosition?: 'head' | 'tail';
 } | {
     icon?: never;

package/dist/components/Button.js

@@ -1,6 +1,6 @@
 import { jsx as s, jsxs as w } from "react/jsx-runtime";
 import { Button as g } from "@headlessui/react";
-import * as m from "lucide-react";
+import { ProgressActivityW700 as m } from "@material-symbols-svg/react-rounded/icons/progress-activity";
 import { cn as c } from "../utils/cn.js";
 const e = {
   icon: "h-sw-xl w-sw-xl",
@@ -23,7 +23,7 @@ const e = {
   state: r
 }) => {
   const t = !!n, a = t && r !== "loading" ? n ?? (() => /* @__PURE__ */ s("span", {})) : ({ className: l, ...d }) => /* @__PURE__ */ s(
-    m.Loader,
+    m,
     {
       className: c(e.icon, "animate-spin", l),
       ...d

package/dist/components/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sources":["../../src/components/Button.tsx"],"sourcesContent":["import { Button as UIButton } from '@headlessui/react';\nimport type { LucideIcon, LucideProps } from 'lucide-react';\nimport * as Icons from 'lucide-react';\n\nimport { cn as clsx } from '@/utils/cn';\n\ntype Size = 'sm' | 'md' | 'lg';\ntype Variant = 'primary' | 'outlined';\ntype State = 'default' | 'loading' | 'disabled' | 'active' | 'error';\n\ntype Props = {\n  size: Size;\n  state?: State;\n  variant: Variant;\n  children: React.ReactNode;\n  className?: string;\n  onClick?: () => void;\n  fluid?: boolean;\n} & (\n  | { icon: LucideIcon; iconPosition?: 'head' | 'tail' }\n  | { icon?: never; iconPosition?: never }\n);\n\nconst styles = {\n  icon: 'h-sw-xl w-sw-xl',\n\n  size: (size: Size) => ({\n    'px-sw-xl py-sw-[10px] rounded-sw-sm': size === 'sm',\n    'px-sw-2xl py-sw-sm rounded-sw-md': size === 'md',\n    'px-sw-3xl py-sw-xl rounded-sw-lg': size === 'lg',\n  }),\n\n  width: (fluid?: boolean) => ({\n    'w-full': !fluid,\n  }),\n\n  common: `\n    ring-1 ring-inset ring-transparent\n    transition-all duration-250 ease-in-out\n  `,\n};\n\nconst ButtonChildren = ({\n  icon,\n  iconPosition,\n  children,\n  state,\n}: Pick<Props, 'icon' | 'iconPosition' | 'children' | 'state'>) => {\n  const hasIcon = !!icon;\n  const Icon =\n    hasIcon && state !== 'loading'\n      ? (icon ?? (() => <span />))\n      : ({ className, ...lucidProps }: LucideProps) => (\n          <Icons.Loader\n            className={clsx(styles.icon, 'animate-spin', className)}\n            {...lucidProps}\n          />\n        );\n\n  return (\n    <span className=\"text-sw-label-md flex w-full items-center justify-center gap-sw-lg py-sw-xs\">\n      {(hasIcon && iconPosition !== 'tail') ||\n      (!hasIcon && state === 'loading') ? (\n        <Icon className={styles.icon} />\n      ) : null}\n      {children}\n      {hasIcon && iconPosition === 'tail' && <Icon className={styles.icon} />}\n    </span>\n  );\n};\n\nconst ButtonPrimary = ({\n  size,\n  className,\n  children,\n  state = 'default',\n  onClick,\n  fluid,\n  ...props\n}: Omit<Props, 'variant'>) => {\n  const isDisabled = ['disabled', 'loading', 'error'].includes(state)\n    ? true\n    : undefined;\n\n  return (\n    <UIButton\n      disabled={isDisabled}\n      data-active={state === 'active' ? true : undefined}\n      onClick={() => state === 'default' && onClick?.()}\n      className={clsx(\n        styles.common,\n        styles.width(fluid),\n        styles.size(size),\n        {\n          'bg-transparent text-sw-status-error ring-1 ring-inset ring-sw-status-error':\n            state === 'error',\n          'bg-transparent text-sw-gray-400 ring-1 ring-inset ring-sw-gray-700':\n            state === 'loading' || state === 'disabled',\n          'text-sw-gray-950 bg-sw-accent-500 hover:bg-sw-accent-400 cursor-pointer':\n            ['active', 'default'].includes(state),\n        },\n        className,\n      )}>\n      <ButtonChildren state={state} {...props}>\n        {children}\n      </ButtonChildren>\n    </UIButton>\n  );\n};\n\nconst ButtonOutlined = ({\n  size,\n  className,\n  children,\n  state = 'default',\n  onClick,\n  fluid,\n  ...props\n}: Omit<Props, 'variant'>) => {\n  const isDisabled = ['disabled', 'loading', 'error'].includes(state)\n    ? true\n    : undefined;\n\n  return (\n    <UIButton\n      disabled={isDisabled}\n      data-active={state === 'active' ? true : undefined}\n      onClick={() => state === 'default' && onClick?.()}\n      className={clsx(\n        styles.common,\n        styles.width(fluid),\n        styles.size(size),\n        {\n          'bg-transparent text-sw-status-error ring-1 ring-inset ring-sw-status-error':\n            state === 'error',\n          'bg-transparent text-sw-gray-400 ring-1 ring-inset ring-sw-gray-700':\n            state === 'loading' || state === 'disabled',\n          'bg-transparent text-sw-gray-50 ring-1 ring-inset ring-sw-gray-600 hover:ring-sw-gray-100 cursor-pointer':\n            ['active', 'default'].includes(state),\n        },\n        className,\n      )}>\n      <ButtonChildren state={state} {...props}>\n        {children}\n      </ButtonChildren>\n    </UIButton>\n  );\n};\n\nexport const Button = ({ variant, ...restProps }: Props) => {\n  switch (variant) {\n    case 'outlined':\n      return <ButtonOutlined {...restProps} />;\n    case 'primary':\n    default:\n      return <ButtonPrimary {...restProps} />;\n  }\n};\n"],"names":["styles","size","fluid","ButtonChildren","icon","iconPosition","children","state","hasIcon","Icon","jsx","className","lucidProps","Icons","clsx","jsxs","ButtonPrimary","onClick","props","isDisabled","UIButton","ButtonOutlined","Button","variant","restProps"],"mappings":"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"}
+{"version":3,"file":"Button.js","sources":["../../src/components/Button.tsx"],"sourcesContent":["import { Button as UIButton } from '@headlessui/react';\nimport { ProgressActivityW700 as ProgressActivity } from '@material-symbols-svg/react-rounded/icons/progress-activity';\nimport type {\n  IconProps,\n  MaterialSymbolsComponent,\n} from '@material-symbols-svg/react';\n\nimport { cn as clsx } from '@/utils/cn';\n\ntype Size = 'sm' | 'md' | 'lg';\ntype Variant = 'primary' | 'outlined';\ntype State = 'default' | 'loading' | 'disabled' | 'active' | 'error';\n\ntype Props = {\n  size: Size;\n  state?: State;\n  variant: Variant;\n  children: React.ReactNode;\n  className?: string;\n  onClick?: () => void;\n  fluid?: boolean;\n} & (\n  | { icon: MaterialSymbolsComponent; iconPosition?: 'head' | 'tail' }\n  | { icon?: never; iconPosition?: never }\n);\n\nconst styles = {\n  icon: 'h-sw-xl w-sw-xl',\n\n  size: (size: Size) => ({\n    'px-sw-xl py-sw-[10px] rounded-sw-sm': size === 'sm',\n    'px-sw-2xl py-sw-sm rounded-sw-md': size === 'md',\n    'px-sw-3xl py-sw-xl rounded-sw-lg': size === 'lg',\n  }),\n\n  width: (fluid?: boolean) => ({\n    'w-full': !fluid,\n  }),\n\n  common: `\n    ring-1 ring-inset ring-transparent\n    transition-all duration-250 ease-in-out\n  `,\n};\n\nconst ButtonChildren = ({\n  icon,\n  iconPosition,\n  children,\n  state,\n}: Pick<Props, 'icon' | 'iconPosition' | 'children' | 'state'>) => {\n  const hasIcon = !!icon;\n  const Icon =\n    hasIcon && state !== 'loading'\n      ? (icon ?? (() => <span />))\n      : ({ className, ...iconProps }: IconProps) => (\n          <ProgressActivity\n            className={clsx(styles.icon, 'animate-spin', className)}\n            {...iconProps}\n          />\n        );\n\n  return (\n    <span className=\"text-sw-label-md flex w-full items-center justify-center gap-sw-lg py-sw-xs\">\n      {(hasIcon && iconPosition !== 'tail') ||\n      (!hasIcon && state === 'loading') ? (\n        <Icon className={styles.icon} />\n      ) : null}\n      {children}\n      {hasIcon && iconPosition === 'tail' && <Icon className={styles.icon} />}\n    </span>\n  );\n};\n\nconst ButtonPrimary = ({\n  size,\n  className,\n  children,\n  state = 'default',\n  onClick,\n  fluid,\n  ...props\n}: Omit<Props, 'variant'>) => {\n  const isDisabled = ['disabled', 'loading', 'error'].includes(state)\n    ? true\n    : undefined;\n\n  return (\n    <UIButton\n      disabled={isDisabled}\n      data-active={state === 'active' ? true : undefined}\n      onClick={() => state === 'default' && onClick?.()}\n      className={clsx(\n        styles.common,\n        styles.width(fluid),\n        styles.size(size),\n        {\n          'bg-transparent text-sw-status-error ring-1 ring-inset ring-sw-status-error':\n            state === 'error',\n          'bg-transparent text-sw-gray-400 ring-1 ring-inset ring-sw-gray-700':\n            state === 'loading' || state === 'disabled',\n          'text-sw-gray-950 bg-sw-accent-500 hover:bg-sw-accent-400 cursor-pointer':\n            ['active', 'default'].includes(state),\n        },\n        className,\n      )}>\n      <ButtonChildren state={state} {...props}>\n        {children}\n      </ButtonChildren>\n    </UIButton>\n  );\n};\n\nconst ButtonOutlined = ({\n  size,\n  className,\n  children,\n  state = 'default',\n  onClick,\n  fluid,\n  ...props\n}: Omit<Props, 'variant'>) => {\n  const isDisabled = ['disabled', 'loading', 'error'].includes(state)\n    ? true\n    : undefined;\n\n  return (\n    <UIButton\n      disabled={isDisabled}\n      data-active={state === 'active' ? true : undefined}\n      onClick={() => state === 'default' && onClick?.()}\n      className={clsx(\n        styles.common,\n        styles.width(fluid),\n        styles.size(size),\n        {\n          'bg-transparent text-sw-status-error ring-1 ring-inset ring-sw-status-error':\n            state === 'error',\n          'bg-transparent text-sw-gray-400 ring-1 ring-inset ring-sw-gray-700':\n            state === 'loading' || state === 'disabled',\n          'bg-transparent text-sw-gray-50 ring-1 ring-inset ring-sw-gray-600 hover:ring-sw-gray-100 cursor-pointer':\n            ['active', 'default'].includes(state),\n        },\n        className,\n      )}>\n      <ButtonChildren state={state} {...props}>\n        {children}\n      </ButtonChildren>\n    </UIButton>\n  );\n};\n\nexport const Button = ({ variant, ...restProps }: Props) => {\n  switch (variant) {\n    case 'outlined':\n      return <ButtonOutlined {...restProps} />;\n    case 'primary':\n    default:\n      return <ButtonPrimary {...restProps} />;\n  }\n};\n"],"names":["styles","size","fluid","ButtonChildren","icon","iconPosition","children","state","hasIcon","Icon","jsx","className","iconProps","ProgressActivity","clsx","jsxs","ButtonPrimary","onClick","props","isDisabled","UIButton","ButtonOutlined","Button","variant","restProps"],"mappings":"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"}

package/dist/components/CloseButton.js

@@ -1,22 +1,22 @@
-import { jsx as t } from "react/jsx-runtime";
-import * as e from "lucide-react";
+import { jsx as r } from "react/jsx-runtime";
+import { CloseW700 as e } from "@material-symbols-svg/react-rounded/icons/close";
 import "../constants/chains.js";
 import "viem";
 import "ethers";
 import { cn as s } from "../utils/cn.js";
-const a = ({ className: r, onClick: o }) => /* @__PURE__ */ t(
+const u = ({ className: t, onClick: o }) => /* @__PURE__ */ r(
   "button",
   {
     type: "button",
     className: s(
       "flex cursor-pointer items-center justify-center text-sw-gray-200 transition-colors hover:text-sw-gray-50 p-sw-md w-[34px] h-[34px] rounded-sw-md bg-sw-gray-950 hover:bg-sw-gray-800",
-      r
+      t
     ),
     onClick: o,
-    children: /* @__PURE__ */ t(e.X, { size: 18, strokeWidth: 3 })
+    children: /* @__PURE__ */ r(e, { size: 18 })
   }
 );
 export {
-  a as CloseButton
+  u as CloseButton
 };
 //# sourceMappingURL=CloseButton.js.map

package/dist/components/CloseButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"CloseButton.js","sources":["../../src/components/CloseButton.tsx"],"sourcesContent":["import * as Icons from 'lucide-react';\n\nimport { cn } from '@/utils';\n\ntype Props = {\n  className?: string;\n  onClick: () => void;\n};\n\nexport const CloseButton = ({ className, onClick }: Props) => {\n  return (\n    <button\n      type=\"button\"\n      className={cn(\n        'flex cursor-pointer items-center justify-center text-sw-gray-200 transition-colors hover:text-sw-gray-50 p-sw-md w-[34px] h-[34px] rounded-sw-md bg-sw-gray-950 hover:bg-sw-gray-800',\n        className,\n      )}\n      onClick={onClick}>\n      <Icons.X size={18} strokeWidth={3} />\n    </button>\n  );\n};\n"],"names":["CloseButton","className","onClick","jsx","cn","Icons"],"mappings":";;;;;;AASO,MAAMA,IAAc,CAAC,EAAE,WAAAC,GAAW,SAAAC,QAErC,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,MAAK;AAAA,IACL,WAAWC;AAAA,MACT;AAAA,MACAH;AAAA,IAAA;AAAA,IAEF,SAAAC;AAAA,IACA,4BAACG,EAAM,GAAN,EAAQ,MAAM,IAAI,aAAa,EAAA,CAAG;AAAA,EAAA;AAAA;"}
+{"version":3,"file":"CloseButton.js","sources":["../../src/components/CloseButton.tsx"],"sourcesContent":["import { CloseW700 as Close } from '@material-symbols-svg/react-rounded/icons/close';\n\nimport { cn } from '@/utils';\n\ntype Props = {\n  className?: string;\n  onClick: () => void;\n};\n\nexport const CloseButton = ({ className, onClick }: Props) => {\n  return (\n    <button\n      type=\"button\"\n      className={cn(\n        'flex cursor-pointer items-center justify-center text-sw-gray-200 transition-colors hover:text-sw-gray-50 p-sw-md w-[34px] h-[34px] rounded-sw-md bg-sw-gray-950 hover:bg-sw-gray-800',\n        className,\n      )}\n      onClick={onClick}>\n      <Close size={18} />\n    </button>\n  );\n};\n"],"names":["CloseButton","className","onClick","jsx","cn","Close"],"mappings":";;;;;;AASO,MAAMA,IAAc,CAAC,EAAE,WAAAC,GAAW,SAAAC,QAErC,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,MAAK;AAAA,IACL,WAAWC;AAAA,MACT;AAAA,MACAH;AAAA,IAAA;AAAA,IAEF,SAAAC;AAAA,IACA,UAAA,gBAAAC,EAACE,GAAA,EAAM,MAAM,GAAA,CAAI;AAAA,EAAA;AAAA;"}

package/dist/components/CopyButton.js

@@ -1,16 +1,16 @@
 import { jsx as t } from "react/jsx-runtime";
 import i from "copy-text-to-clipboard";
-import * as r from "lucide-react";
-const a = ({ value: o }) => /* @__PURE__ */ t(
+import { ContentCopyW700 as r } from "@material-symbols-svg/react-rounded/icons/content-copy";
+const c = ({ value: o }) => /* @__PURE__ */ t(
   "button",
   {
     type: "button",
     onClick: () => i(o),
     className: "text-sw-gray-200 hover:text-sw-gray-50 cursor-pointer transition-all duration-300 [transition-timing-function:cubic-bezier(0.175,0.885,0.32,1.275)] active:-translate-y-1 active:scale-x-90 active:scale-y-110",
-    children: /* @__PURE__ */ t(r.Copy, { size: 16 })
+    children: /* @__PURE__ */ t(r, { size: 16 })
   }
 );
 export {
-  a as CopyButton
+  c as CopyButton
 };
 //# sourceMappingURL=CopyButton.js.map

package/dist/components/CopyButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"CopyButton.js","sources":["../../src/components/CopyButton.tsx"],"sourcesContent":["import copy from 'copy-text-to-clipboard';\nimport * as Icons from 'lucide-react';\n\nexport const CopyButton = ({ value }: { value: string }) => (\n  <button\n    type=\"button\"\n    onClick={() => copy(value)}\n    className=\"text-sw-gray-200 hover:text-sw-gray-50 cursor-pointer transition-all duration-300 [transition-timing-function:cubic-bezier(0.175,0.885,0.32,1.275)] active:-translate-y-1 active:scale-x-90 active:scale-y-110\">\n    <Icons.Copy size={16} />\n  </button>\n);\n"],"names":["CopyButton","value","jsx","copy","Icons"],"mappings":";;;AAGO,MAAMA,IAAa,CAAC,EAAE,OAAAC,EAAA,MAC3B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,MAAK;AAAA,IACL,SAAS,MAAMC,EAAKF,CAAK;AAAA,IACzB,WAAU;AAAA,IACV,UAAA,gBAAAC,EAACE,EAAM,MAAN,EAAW,MAAM,GAAA,CAAI;AAAA,EAAA;AACxB;"}
+{"version":3,"file":"CopyButton.js","sources":["../../src/components/CopyButton.tsx"],"sourcesContent":["import copy from 'copy-text-to-clipboard';\nimport { ContentCopyW700 as ContentCopy } from '@material-symbols-svg/react-rounded/icons/content-copy';\n\nexport const CopyButton = ({ value }: { value: string }) => (\n  <button\n    type=\"button\"\n    onClick={() => copy(value)}\n    className=\"text-sw-gray-200 hover:text-sw-gray-50 cursor-pointer transition-all duration-300 [transition-timing-function:cubic-bezier(0.175,0.885,0.32,1.275)] active:-translate-y-1 active:scale-x-90 active:scale-y-110\">\n    <ContentCopy size={16} />\n  </button>\n);\n"],"names":["CopyButton","value","jsx","copy","ContentCopy"],"mappings":";;;AAGO,MAAMA,IAAa,CAAC,EAAE,OAAAC,EAAA,MAC3B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,MAAK;AAAA,IACL,SAAS,MAAMC,EAAKF,CAAK;AAAA,IACzB,WAAU;AAAA,IACV,UAAA,gBAAAC,EAACE,GAAA,EAAY,MAAM,GAAA,CAAI;AAAA,EAAA;AACzB;"}

package/dist/components/DirectionSwitcher.js

@@ -1,27 +1,28 @@
 import { jsx as r } from "react/jsx-runtime";
-import * as s from "lucide-react";
+import { ArrowDownwardW700 as a } from "@material-symbols-svg/react-rounded/icons/arrow-downward";
+import { ProgressActivityW700 as i } from "@material-symbols-svg/react-rounded/icons/progress-activity";
 import { cn as o } from "../utils/cn.js";
-const i = ({
-  isEnabled: t,
-  isLoading: e = !1,
-  onClick: a
+const w = ({
+  isEnabled: e,
+  isLoading: t = !1,
+  onClick: s
 }) => /* @__PURE__ */ r(
   "div",
   {
-    onClick: t && !e ? a : void 0,
+    onClick: e && !t ? s : void 0,
     className: o(
       "bg-sw-gray-950 mt-sw-xs group absolute top-1/2 left-1/2 flex h-[40px] w-[40px] -translate-x-1/2 -translate-y-1/2 items-center justify-center rounded-sw-md text-sw-gray-100 transition-all duration-150",
       {
-        "cursor-pointer hover:scale-110 hover:text-sw-gray-50 hover:bg-sw-gray-700": t && !e
+        "cursor-pointer hover:scale-110 hover:text-sw-gray-50 hover:bg-sw-gray-700": e && !t
       }
     ),
-    children: e ? /* @__PURE__ */ r("div", { className: "group relative inline-block", children: /* @__PURE__ */ r(s.RefreshCw, { className: "h-sw-2xl w-sw-2xl animate-spin opacity-50 text-sw-accent-500" }) }) : /* @__PURE__ */ r("div", { className: "group relative inline-block", children: /* @__PURE__ */ r(
-      s.ArrowDown,
+    children: t ? /* @__PURE__ */ r("div", { className: "group relative inline-block", children: /* @__PURE__ */ r(i, { className: "h-sw-2xl w-sw-2xl animate-spin opacity-50 text-sw-accent-500" }) }) : /* @__PURE__ */ r("div", { className: "group relative inline-block", children: /* @__PURE__ */ r(
+      a,
       {
         className: o(
           "h-sw-2xl w-sw-2xl transition-transform duration-300",
           {
-            "group-hover:rotate-180": t && !e
+            "group-hover:rotate-180": e && !t
           }
         )
       }
@@ -29,6 +30,6 @@ const i = ({
   }
 );
 export {
-  i as DirectionSwitcher
+  w as DirectionSwitcher
 };
 //# sourceMappingURL=DirectionSwitcher.js.map

package/dist/components/DirectionSwitcher.js.map

@@ -1 +1 @@
-{"version":3,"file":"DirectionSwitcher.js","sources":["../../src/components/DirectionSwitcher.tsx"],"sourcesContent":["import * as Icons from 'lucide-react';\n\nimport { cn } from '@/utils/cn';\n\ntype Props = {\n  isEnabled: boolean;\n  isLoading?: boolean;\n  onClick?: () => void;\n};\n\nexport const DirectionSwitcher = ({\n  isEnabled,\n  isLoading = false,\n  onClick,\n}: Props) => {\n  return (\n    <div\n      onClick={isEnabled && !isLoading ? onClick : undefined}\n      className={cn(\n        'bg-sw-gray-950 mt-sw-xs group absolute top-1/2 left-1/2 flex h-[40px] w-[40px] -translate-x-1/2 -translate-y-1/2 items-center justify-center rounded-sw-md text-sw-gray-100 transition-all duration-150',\n        {\n          'cursor-pointer hover:scale-110 hover:text-sw-gray-50 hover:bg-sw-gray-700':\n            isEnabled && !isLoading,\n        },\n      )}>\n      {isLoading ? (\n        <div className=\"group relative inline-block\">\n          <Icons.RefreshCw className=\"h-sw-2xl w-sw-2xl animate-spin opacity-50 text-sw-accent-500\" />\n        </div>\n      ) : (\n        <div className=\"group relative inline-block\">\n          <Icons.ArrowDown\n            className={cn(\n              'h-sw-2xl w-sw-2xl transition-transform duration-300',\n              {\n                'group-hover:rotate-180': isEnabled && !isLoading,\n              },\n            )}\n          />\n        </div>\n      )}\n    </div>\n  );\n};\n"],"names":["DirectionSwitcher","isEnabled","isLoading","onClick","jsx","cn","Icons"],"mappings":";;;AAUO,MAAMA,IAAoB,CAAC;AAAA,EAChC,WAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,SAAAC;AACF,MAEI,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,SAASH,KAAa,CAACC,IAAYC,IAAU;AAAA,IAC7C,WAAWE;AAAA,MACT;AAAA,MACA;AAAA,QACE,6EACEJ,KAAa,CAACC;AAAA,MAAA;AAAA,IAClB;AAAA,IAED,cACC,gBAAAE,EAAC,OAAA,EAAI,WAAU,+BACb,4BAACE,EAAM,WAAN,EAAgB,WAAU,gEAA+D,EAAA,CAC5F,IAEA,gBAAAF,EAAC,OAAA,EAAI,WAAU,+BACb,UAAA,gBAAAA;AAAA,MAACE,EAAM;AAAA,MAAN;AAAA,QACC,WAAWD;AAAA,UACT;AAAA,UACA;AAAA,YACE,0BAA0BJ,KAAa,CAACC;AAAA,UAAA;AAAA,QAC1C;AAAA,MACF;AAAA,IAAA,EACF,CACF;AAAA,EAAA;AAAA;"}
+{"version":3,"file":"DirectionSwitcher.js","sources":["../../src/components/DirectionSwitcher.tsx"],"sourcesContent":["import { ArrowDownwardW700 as ArrowDownward } from '@material-symbols-svg/react-rounded/icons/arrow-downward';\nimport { ProgressActivityW700 as ProgressActivity } from '@material-symbols-svg/react-rounded/icons/progress-activity';\nimport { cn } from '@/utils/cn';\n\ntype Props = {\n  isEnabled: boolean;\n  isLoading?: boolean;\n  onClick?: () => void;\n};\n\nexport const DirectionSwitcher = ({\n  isEnabled,\n  isLoading = false,\n  onClick,\n}: Props) => {\n  return (\n    <div\n      onClick={isEnabled && !isLoading ? onClick : undefined}\n      className={cn(\n        'bg-sw-gray-950 mt-sw-xs group absolute top-1/2 left-1/2 flex h-[40px] w-[40px] -translate-x-1/2 -translate-y-1/2 items-center justify-center rounded-sw-md text-sw-gray-100 transition-all duration-150',\n        {\n          'cursor-pointer hover:scale-110 hover:text-sw-gray-50 hover:bg-sw-gray-700':\n            isEnabled && !isLoading,\n        },\n      )}>\n      {isLoading ? (\n        <div className=\"group relative inline-block\">\n          <ProgressActivity className=\"h-sw-2xl w-sw-2xl animate-spin opacity-50 text-sw-accent-500\" />\n        </div>\n      ) : (\n        <div className=\"group relative inline-block\">\n          <ArrowDownward\n            className={cn(\n              'h-sw-2xl w-sw-2xl transition-transform duration-300',\n              {\n                'group-hover:rotate-180': isEnabled && !isLoading,\n              },\n            )}\n          />\n        </div>\n      )}\n    </div>\n  );\n};\n"],"names":["DirectionSwitcher","isEnabled","isLoading","onClick","jsx","cn","ProgressActivity","ArrowDownward"],"mappings":";;;;AAUO,MAAMA,IAAoB,CAAC;AAAA,EAChC,WAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,SAAAC;AACF,MAEI,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,SAASH,KAAa,CAACC,IAAYC,IAAU;AAAA,IAC7C,WAAWE;AAAA,MACT;AAAA,MACA;AAAA,QACE,6EACEJ,KAAa,CAACC;AAAA,MAAA;AAAA,IAClB;AAAA,IAED,UAAAA,IACC,gBAAAE,EAAC,OAAA,EAAI,WAAU,+BACb,UAAA,gBAAAA,EAACE,GAAA,EAAiB,WAAU,+DAAA,CAA+D,EAAA,CAC7F,IAEA,gBAAAF,EAAC,OAAA,EAAI,WAAU,+BACb,UAAA,gBAAAA;AAAA,MAACG;AAAAA,MAAA;AAAA,QACC,WAAWF;AAAA,UACT;AAAA,UACA;AAAA,YACE,0BAA0BJ,KAAa,CAACC;AAAA,UAAA;AAAA,QAC1C;AAAA,MACF;AAAA,IAAA,EACF,CACF;AAAA,EAAA;AAAA;"}

package/dist/components/Input.d.ts

@@ -1,16 +1,18 @@
+import { MaterialSymbolsComponent } from '@material-symbols-svg/react';
 import { InputProps } from '@headlessui/react';
-import { LucideIcon } from 'lucide-react';
 type State = 'default' | 'disabled' | 'error' | 'fixed';
 export type Props = Omit<InputProps, 'size'> & {
-    icon?: LucideIcon;
+    icon?: MaterialSymbolsComponent;
     defaultValue?: string;
     focusOnMount?: boolean;
+    fontSize?: 'sm' | 'md';
     state?: State;
 };
 export declare const Input: import('react').ForwardRefExoticComponent<Omit<InputProps, "size"> & {
-    icon?: LucideIcon;
+    icon?: MaterialSymbolsComponent;
     defaultValue?: string;
     focusOnMount?: boolean;
+    fontSize?: "sm" | "md";
     state?: State;
 } & {
     children?: import('react').ReactNode | undefined;

package/dist/components/Input.js

@@ -1,9 +1,9 @@
 import { jsx as t, jsxs as m } from "react/jsx-runtime";
-import { forwardRef as F, useRef as j, useImperativeHandle as R, useState as w, useEffect as p, Fragment as B } from "react";
+import { forwardRef as I, useRef as j, useImperativeHandle as R, useState as w, useEffect as p, Fragment as B } from "react";
 import { Input as k } from "@headlessui/react";
-import * as z from "lucide-react";
+import { CloseW700 as z } from "@material-symbols-svg/react-rounded/icons/close";
 import { cn as i } from "../utils/cn.js";
-const X = F(
+const $ = I(
   ({
     state: e = "default",
     defaultValue: r = "",
@@ -16,25 +16,25 @@ const X = F(
   }, h) => {
     const a = j(null);
     R(h, () => a.current);
-    const [s, f] = w(!1), [o, n] = w(r), v = () => f(!0), N = () => f(!1), I = () => {
-      n(""), u?.({
+    const [s, f] = w(!1), [o, l] = w(r), v = () => f(!0), N = () => f(!1), C = () => {
+      l(""), u?.({
         target: { value: "" }
       });
-    }, C = (g) => {
-      n(g.target.value), u?.(g);
+    }, F = (g) => {
+      l(g.target.value), u?.(g);
     };
     p(() => {
-      n(r);
+      l(r);
     }, [r]), p(() => {
       x && a.current?.focus();
     }, []);
-    const l = ["disabled", "fixed"].includes(e);
+    const n = ["disabled", "fixed"].includes(e);
     return /* @__PURE__ */ t(
       k,
       {
         type: "text",
         as: B,
-        disabled: l,
+        disabled: n,
         autoComplete: "off",
         className: i(
           "px-sw-lg py-sw-lg text-sw-label-md rounded-sw-md ring-transparent ring-1 ring-inset data-focus:outline-none transition-colors bg-sw-gray-800",
@@ -57,8 +57,8 @@ const X = F(
               ref: a,
               onBlur: N,
               onFocus: v,
-              onChange: C,
-              disabled: l,
+              onChange: F,
+              disabled: n,
               placeholder: d.placeholder,
               autoComplete: "off",
               className: i("text-sw-label-md mr-auto w-full outline-none", {
@@ -66,7 +66,7 @@ const X = F(
               })
             }
           ),
-          !l && /* @__PURE__ */ m("div", { className: "gap-sw-md relative flex items-center justify-end", children: [
+          !n && /* @__PURE__ */ m("div", { className: "gap-sw-md relative flex items-center justify-end", children: [
             b,
             o ? /* @__PURE__ */ t(
               "button",
@@ -80,8 +80,8 @@ const X = F(
                     "cursor-default text-sw-gray-300": !s
                   }
                 ),
-                onClick: I,
-                children: /* @__PURE__ */ t(z.X, { className: "h-sw-xl w-sw-xl" })
+                onClick: C,
+                children: /* @__PURE__ */ t(z, { className: "h-sw-xl w-sw-xl" })
               }
             ) : null
           ] })
@@ -91,6 +91,6 @@ const X = F(
   }
 );
 export {
-  X as Input
+  $ as Input
 };
 //# sourceMappingURL=Input.js.map

package/dist/components/Input.js.map

@@ -1 +1 @@
-{"version":3,"file":"Input.js","sources":["../../src/components/Input.tsx"],"sourcesContent":["import {\n  forwardRef,\n  Fragment,\n  useEffect,\n  useImperativeHandle,\n  useRef,\n  useState,\n} from 'react';\nimport { Input as UIInput } from '@headlessui/react';\nimport type { InputProps } from '@headlessui/react';\nimport type { PropsWithChildren } from 'react';\nimport type { LucideIcon } from 'lucide-react';\nimport * as Icons from 'lucide-react';\n\nimport { cn } from '@/utils/cn';\n\ntype State = 'default' | 'disabled' | 'error' | 'fixed';\n\nexport type Props = Omit<InputProps, 'size'> & {\n  icon?: LucideIcon;\n  defaultValue?: string;\n  focusOnMount?: boolean;\n  state?: State;\n};\n\nexport const Input = forwardRef<HTMLInputElement, PropsWithChildren<Props>>(\n  (\n    {\n      state = 'default',\n      defaultValue = '',\n      focusOnMount = false,\n      className,\n      onChange,\n      children,\n      icon: Icon,\n      ...inputProps\n    },\n    ref,\n  ) => {\n    const inputRef = useRef<HTMLInputElement>(null);\n\n    useImperativeHandle(ref, () => inputRef.current!);\n\n    const [isFocused, setIsFocused] = useState(false);\n    const [value, setValue] = useState(defaultValue);\n\n    const handleFocus = () => setIsFocused(true);\n    const handleBlur = () => setIsFocused(false);\n    const handleClear = () => {\n      setValue('');\n      onChange?.({\n        target: { value: '' },\n      } as React.ChangeEvent<HTMLInputElement>);\n    };\n\n    const onInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n      setValue(e.target.value);\n      onChange?.(e);\n    };\n\n    useEffect(() => {\n      setValue(defaultValue);\n    }, [defaultValue]);\n\n    useEffect(() => {\n      if (focusOnMount) {\n        inputRef.current?.focus();\n      }\n    }, []);\n\n    const inputDisabled = ['disabled', 'fixed'].includes(state);\n\n    return (\n      <UIInput\n        type=\"text\"\n        as={Fragment}\n        disabled={inputDisabled}\n        autoComplete=\"off\"\n        className={cn(\n          'px-sw-lg py-sw-lg text-sw-label-md rounded-sw-md ring-transparent ring-1 ring-inset data-focus:outline-none transition-colors bg-sw-gray-800',\n          {\n            'text-sw-gray-400 bg-sw-gray-800': state === 'fixed',\n            'text-sw-status-error bg-sw-gray-800': state === 'error',\n            'text-sw-gray-50 bg-sw-gray-700': isFocused && state === 'default',\n            'text-sw-gray-50 hover:bg-sw-gray-700':\n              !isFocused && state === 'default',\n            'cursor-not-allowed bg-sw-gray-800 text-sw-gray-400':\n              state === 'disabled',\n          },\n          className,\n        )}\n        {...inputProps}>\n        {() => (\n          <div className=\"flex items-center justify-between\">\n            {Icon && <Icon size={16} className=\"mr-sw-md text-sw-gray-200\" />}\n            <input\n              value={value}\n              ref={inputRef}\n              onBlur={handleBlur}\n              onFocus={handleFocus}\n              onChange={onInputChange}\n              disabled={inputDisabled}\n              placeholder={inputProps.placeholder}\n              autoComplete=\"off\"\n              className={cn('text-sw-label-md mr-auto w-full outline-none', {\n                'cursor-not-allowed': state === 'disabled',\n              })}\n            />\n            {!inputDisabled && (\n              <div className=\"gap-sw-md relative flex items-center justify-end\">\n                {children}\n                {value ? (\n                  <button\n                    type=\"button\"\n                    className={cn(\n                      'opacity-0 transition-opacity duration-150 ease-in-out hover:text-sw-gray-50',\n                      {\n                        'cursor-pointer opacity-100': !!value,\n                        'cursor-default text-sw-gray-200': isFocused,\n                        'cursor-default text-sw-gray-300': !isFocused,\n                      },\n                    )}\n                    onClick={handleClear}>\n                    <Icons.X className=\"h-sw-xl w-sw-xl\" />\n                  </button>\n                ) : null}\n              </div>\n            )}\n          </div>\n        )}\n      </UIInput>\n    );\n  },\n);\n"],"names":["Input","forwardRef","state","defaultValue","focusOnMount","className","onChange","children","Icon","inputProps","ref","inputRef","useRef","useImperativeHandle","isFocused","setIsFocused","useState","value","setValue","handleFocus","handleBlur","handleClear","onInputChange","e","useEffect","inputDisabled","jsx","UIInput","Fragment","cn","jsxs","Icons"],"mappings":";;;;;AAyBO,MAAMA,IAAQC;AAAA,EACnB,CACE;AAAA,IACE,OAAAC,IAAQ;AAAA,IACR,cAAAC,IAAe;AAAA,IACf,cAAAC,IAAe;AAAA,IACf,WAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,MAAMC;AAAA,IACN,GAAGC;AAAA,EAAA,GAELC,MACG;AACH,UAAMC,IAAWC,EAAyB,IAAI;AAE9C,IAAAC,EAAoBH,GAAK,MAAMC,EAAS,OAAQ;AAEhD,UAAM,CAACG,GAAWC,CAAY,IAAIC,EAAS,EAAK,GAC1C,CAACC,GAAOC,CAAQ,IAAIF,EAASb,CAAY,GAEzCgB,IAAc,MAAMJ,EAAa,EAAI,GACrCK,IAAa,MAAML,EAAa,EAAK,GACrCM,IAAc,MAAM;AACxB,MAAAH,EAAS,EAAE,GACXZ,IAAW;AAAA,QACT,QAAQ,EAAE,OAAO,GAAA;AAAA,MAAG,CACkB;AAAA,IAC1C,GAEMgB,IAAgB,CAACC,MAA2C;AAChE,MAAAL,EAASK,EAAE,OAAO,KAAK,GACvBjB,IAAWiB,CAAC;AAAA,IACd;AAEA,IAAAC,EAAU,MAAM;AACd,MAAAN,EAASf,CAAY;AAAA,IACvB,GAAG,CAACA,CAAY,CAAC,GAEjBqB,EAAU,MAAM;AACd,MAAIpB,KACFO,EAAS,SAAS,MAAA;AAAA,IAEtB,GAAG,CAAA,CAAE;AAEL,UAAMc,IAAgB,CAAC,YAAY,OAAO,EAAE,SAASvB,CAAK;AAE1D,WACE,gBAAAwB;AAAA,MAACC;AAAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,IAAIC;AAAA,QACJ,UAAUH;AAAA,QACV,cAAa;AAAA,QACb,WAAWI;AAAA,UACT;AAAA,UACA;AAAA,YACE,mCAAmC3B,MAAU;AAAA,YAC7C,uCAAuCA,MAAU;AAAA,YACjD,kCAAkCY,KAAaZ,MAAU;AAAA,YACzD,wCACE,CAACY,KAAaZ,MAAU;AAAA,YAC1B,sDACEA,MAAU;AAAA,UAAA;AAAA,UAEdG;AAAA,QAAA;AAAA,QAED,GAAGI;AAAA,QACH,UAAA,MACC,gBAAAqB,EAAC,OAAA,EAAI,WAAU,qCACZ,UAAA;AAAA,UAAAtB,KAAQ,gBAAAkB,EAAClB,GAAA,EAAK,MAAM,IAAI,WAAU,6BAA4B;AAAA,UAC/D,gBAAAkB;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,OAAAT;AAAA,cACA,KAAKN;AAAA,cACL,QAAQS;AAAA,cACR,SAASD;AAAA,cACT,UAAUG;AAAA,cACV,UAAUG;AAAA,cACV,aAAahB,EAAW;AAAA,cACxB,cAAa;AAAA,cACb,WAAWoB,EAAG,gDAAgD;AAAA,gBAC5D,sBAAsB3B,MAAU;AAAA,cAAA,CACjC;AAAA,YAAA;AAAA,UAAA;AAAA,UAEF,CAACuB,KACA,gBAAAK,EAAC,OAAA,EAAI,WAAU,oDACZ,UAAA;AAAA,YAAAvB;AAAA,YACAU,IACC,gBAAAS;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,MAAK;AAAA,gBACL,WAAWG;AAAA,kBACT;AAAA,kBACA;AAAA,oBACE,8BAA8B,CAAC,CAACZ;AAAA,oBAChC,mCAAmCH;AAAA,oBACnC,mCAAmC,CAACA;AAAA,kBAAA;AAAA,gBACtC;AAAA,gBAEF,SAASO;AAAA,gBACT,UAAA,gBAAAK,EAACK,EAAM,GAAN,EAAQ,WAAU,kBAAA,CAAkB;AAAA,cAAA;AAAA,YAAA,IAErC;AAAA,UAAA,EAAA,CACN;AAAA,QAAA,EAAA,CAEJ;AAAA,MAAA;AAAA,IAAA;AAAA,EAIR;AACF;"}
+{"version":3,"file":"Input.js","sources":["../../src/components/Input.tsx"],"sourcesContent":["import {\n  forwardRef,\n  Fragment,\n  useEffect,\n  useImperativeHandle,\n  useRef,\n  useState,\n} from 'react';\nimport { Input as UIInput } from '@headlessui/react';\nimport { CloseW700 as Close } from '@material-symbols-svg/react-rounded/icons/close';\nimport type { MaterialSymbolsComponent } from '@material-symbols-svg/react';\nimport type { InputProps } from '@headlessui/react';\nimport type { PropsWithChildren } from 'react';\n\nimport { cn } from '@/utils/cn';\n\ntype State = 'default' | 'disabled' | 'error' | 'fixed';\n\nexport type Props = Omit<InputProps, 'size'> & {\n  icon?: MaterialSymbolsComponent;\n  defaultValue?: string;\n  focusOnMount?: boolean;\n  fontSize?: 'sm' | 'md';\n  state?: State;\n};\n\nexport const Input = forwardRef<HTMLInputElement, PropsWithChildren<Props>>(\n  (\n    {\n      state = 'default',\n      defaultValue = '',\n      focusOnMount = false,\n      className,\n      onChange,\n      children,\n      icon: Icon,\n      ...inputProps\n    },\n    ref,\n  ) => {\n    const inputRef = useRef<HTMLInputElement>(null);\n\n    useImperativeHandle(ref, () => inputRef.current!);\n\n    const [isFocused, setIsFocused] = useState(false);\n    const [value, setValue] = useState(defaultValue);\n\n    const handleFocus = () => setIsFocused(true);\n    const handleBlur = () => setIsFocused(false);\n    const handleClear = () => {\n      setValue('');\n      onChange?.({\n        target: { value: '' },\n      } as React.ChangeEvent<HTMLInputElement>);\n    };\n\n    const onInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n      setValue(e.target.value);\n      onChange?.(e);\n    };\n\n    useEffect(() => {\n      setValue(defaultValue);\n    }, [defaultValue]);\n\n    useEffect(() => {\n      if (focusOnMount) {\n        inputRef.current?.focus();\n      }\n    }, []);\n\n    const inputDisabled = ['disabled', 'fixed'].includes(state);\n\n    return (\n      <UIInput\n        type=\"text\"\n        as={Fragment}\n        disabled={inputDisabled}\n        autoComplete=\"off\"\n        className={cn(\n          'px-sw-lg py-sw-lg text-sw-label-md rounded-sw-md ring-transparent ring-1 ring-inset data-focus:outline-none transition-colors bg-sw-gray-800',\n          {\n            'text-sw-gray-400 bg-sw-gray-800': state === 'fixed',\n            'text-sw-status-error bg-sw-gray-800': state === 'error',\n            'text-sw-gray-50 bg-sw-gray-700': isFocused && state === 'default',\n            'text-sw-gray-50 hover:bg-sw-gray-700':\n              !isFocused && state === 'default',\n            'cursor-not-allowed bg-sw-gray-800 text-sw-gray-400':\n              state === 'disabled',\n          },\n          className,\n        )}\n        {...inputProps}>\n        {() => (\n          <div className=\"flex items-center justify-between\">\n            {Icon && <Icon size={16} className=\"mr-sw-md text-sw-gray-200\" />}\n            <input\n              value={value}\n              ref={inputRef}\n              onBlur={handleBlur}\n              onFocus={handleFocus}\n              onChange={onInputChange}\n              disabled={inputDisabled}\n              placeholder={inputProps.placeholder}\n              autoComplete=\"off\"\n              className={cn('text-sw-label-md mr-auto w-full outline-none', {\n                'cursor-not-allowed': state === 'disabled',\n              })}\n            />\n            {!inputDisabled && (\n              <div className=\"gap-sw-md relative flex items-center justify-end\">\n                {children}\n                {value ? (\n                  <button\n                    type=\"button\"\n                    className={cn(\n                      'opacity-0 transition-opacity duration-150 ease-in-out hover:text-sw-gray-50',\n                      {\n                        'cursor-pointer opacity-100': !!value,\n                        'cursor-default text-sw-gray-200': isFocused,\n                        'cursor-default text-sw-gray-300': !isFocused,\n                      },\n                    )}\n                    onClick={handleClear}>\n                    <Close className=\"h-sw-xl w-sw-xl\" />\n                  </button>\n                ) : null}\n              </div>\n            )}\n          </div>\n        )}\n      </UIInput>\n    );\n  },\n);\n"],"names":["Input","forwardRef","state","defaultValue","focusOnMount","className","onChange","children","Icon","inputProps","ref","inputRef","useRef","useImperativeHandle","isFocused","setIsFocused","useState","value","setValue","handleFocus","handleBlur","handleClear","onInputChange","e","useEffect","inputDisabled","jsx","UIInput","Fragment","cn","jsxs","Close"],"mappings":";;;;;AA0BO,MAAMA,IAAQC;AAAA,EACnB,CACE;AAAA,IACE,OAAAC,IAAQ;AAAA,IACR,cAAAC,IAAe;AAAA,IACf,cAAAC,IAAe;AAAA,IACf,WAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,MAAMC;AAAA,IACN,GAAGC;AAAA,EAAA,GAELC,MACG;AACH,UAAMC,IAAWC,EAAyB,IAAI;AAE9C,IAAAC,EAAoBH,GAAK,MAAMC,EAAS,OAAQ;AAEhD,UAAM,CAACG,GAAWC,CAAY,IAAIC,EAAS,EAAK,GAC1C,CAACC,GAAOC,CAAQ,IAAIF,EAASb,CAAY,GAEzCgB,IAAc,MAAMJ,EAAa,EAAI,GACrCK,IAAa,MAAML,EAAa,EAAK,GACrCM,IAAc,MAAM;AACxB,MAAAH,EAAS,EAAE,GACXZ,IAAW;AAAA,QACT,QAAQ,EAAE,OAAO,GAAA;AAAA,MAAG,CACkB;AAAA,IAC1C,GAEMgB,IAAgB,CAACC,MAA2C;AAChE,MAAAL,EAASK,EAAE,OAAO,KAAK,GACvBjB,IAAWiB,CAAC;AAAA,IACd;AAEA,IAAAC,EAAU,MAAM;AACd,MAAAN,EAASf,CAAY;AAAA,IACvB,GAAG,CAACA,CAAY,CAAC,GAEjBqB,EAAU,MAAM;AACd,MAAIpB,KACFO,EAAS,SAAS,MAAA;AAAA,IAEtB,GAAG,CAAA,CAAE;AAEL,UAAMc,IAAgB,CAAC,YAAY,OAAO,EAAE,SAASvB,CAAK;AAE1D,WACE,gBAAAwB;AAAA,MAACC;AAAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,IAAIC;AAAA,QACJ,UAAUH;AAAA,QACV,cAAa;AAAA,QACb,WAAWI;AAAA,UACT;AAAA,UACA;AAAA,YACE,mCAAmC3B,MAAU;AAAA,YAC7C,uCAAuCA,MAAU;AAAA,YACjD,kCAAkCY,KAAaZ,MAAU;AAAA,YACzD,wCACE,CAACY,KAAaZ,MAAU;AAAA,YAC1B,sDACEA,MAAU;AAAA,UAAA;AAAA,UAEdG;AAAA,QAAA;AAAA,QAED,GAAGI;AAAA,QACH,UAAA,MACC,gBAAAqB,EAAC,OAAA,EAAI,WAAU,qCACZ,UAAA;AAAA,UAAAtB,KAAQ,gBAAAkB,EAAClB,GAAA,EAAK,MAAM,IAAI,WAAU,6BAA4B;AAAA,UAC/D,gBAAAkB;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,OAAAT;AAAA,cACA,KAAKN;AAAA,cACL,QAAQS;AAAA,cACR,SAASD;AAAA,cACT,UAAUG;AAAA,cACV,UAAUG;AAAA,cACV,aAAahB,EAAW;AAAA,cACxB,cAAa;AAAA,cACb,WAAWoB,EAAG,gDAAgD;AAAA,gBAC5D,sBAAsB3B,MAAU;AAAA,cAAA,CACjC;AAAA,YAAA;AAAA,UAAA;AAAA,UAEF,CAACuB,KACA,gBAAAK,EAAC,OAAA,EAAI,WAAU,oDACZ,UAAA;AAAA,YAAAvB;AAAA,YACAU,IACC,gBAAAS;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,MAAK;AAAA,gBACL,WAAWG;AAAA,kBACT;AAAA,kBACA;AAAA,oBACE,8BAA8B,CAAC,CAACZ;AAAA,oBAChC,mCAAmCH;AAAA,oBACnC,mCAAmC,CAACA;AAAA,kBAAA;AAAA,gBACtC;AAAA,gBAEF,SAASO;AAAA,gBACT,UAAA,gBAAAK,EAACK,GAAA,EAAM,WAAU,kBAAA,CAAkB;AAAA,cAAA;AAAA,YAAA,IAEnC;AAAA,UAAA,EAAA,CACN;AAAA,QAAA,EAAA,CAEJ;AAAA,MAAA;AAAA,IAAA;AAAA,EAIR;AACF;"}