xtreme-ui 0.0.94 → 0.0.96

package/dist/components/base/ActionCard/actionCard.module.scss.js

@@ -1,13 +1,13 @@
-const i = "_actionCard_1715r_1", e = "_miniSize_1715r_14", m = "_smallSize_1715r_17", _ = "_mediumSize_1715r_20", a = {
+const i = "_actionCard_114zv_1", e = "_miniSize_114zv_14", z = "_smallSize_114zv_17", m = "_mediumSize_114zv_20", _ = {
   actionCard: i,
   miniSize: e,
-  smallSize: m,
-  mediumSize: _
+  smallSize: z,
+  mediumSize: m
 };
 export {
   i as actionCard,
-  a as default,
-  _ as mediumSize,
+  _ as default,
+  m as mediumSize,
   e as miniSize,
-  m as smallSize
+  z as smallSize
 };

package/dist/components/base/Button/button.module.scss.js

@@ -1,39 +1,39 @@
-const e = "_button_13e5w_1", n = "_label_13e5w_14", _ = "_icon_13e5w_21", i = "_underline_13e5w_25", o = "_primaryType_13e5w_48", r = "_primaryDangerType_13e5w_48", a = "_secondaryType_13e5w_52", y = "_secondaryDangerType_13e5w_52", l = "_linkType_13e5w_56", c = "_linkDangerType_13e5w_56", s = "_miniSize_13e5w_85", t = "_iconOnly_13e5w_96", p = "_defaultSize_13e5w_103", T = "_largeSize_13e5w_121", w = "_loading_13e5w_149", d = "_barberPole_13e5w_1", g = "_spin_13e5w_1", b = {
-  button: e,
-  label: n,
+const n = "_button_1n6xg_1", e = "_label_1n6xg_14", _ = "_icon_1n6xg_21", i = "_underline_1n6xg_25", o = "_primaryType_1n6xg_48", r = "_primaryDangerType_1n6xg_48", a = "_secondaryType_1n6xg_52", y = "_secondaryDangerType_1n6xg_52", g = "_linkType_1n6xg_56", l = "_linkDangerType_1n6xg_56", c = "_miniSize_1n6xg_85", s = "_iconOnly_1n6xg_96", t = "_defaultSize_1n6xg_103", p = "_largeSize_1n6xg_121", x = "_loading_1n6xg_149", T = "_barberPole_1n6xg_1", d = "_spin_1n6xg_1", b = {
+  button: n,
+  label: e,
   icon: _,
   underline: i,
   primaryType: o,
   primaryDangerType: r,
   secondaryType: a,
   secondaryDangerType: y,
-  linkType: l,
-  linkDangerType: c,
-  miniSize: s,
-  iconOnly: t,
-  defaultSize: p,
-  largeSize: T,
-  loading: w,
-  barberPole: d,
-  spin: g
+  linkType: g,
+  linkDangerType: l,
+  miniSize: c,
+  iconOnly: s,
+  defaultSize: t,
+  largeSize: p,
+  loading: x,
+  barberPole: T,
+  spin: d
 };
 export {
-  d as barberPole,
-  e as button,
+  T as barberPole,
+  n as button,
   b as default,
-  p as defaultSize,
+  t as defaultSize,
   _ as icon,
-  t as iconOnly,
-  n as label,
-  T as largeSize,
-  c as linkDangerType,
-  l as linkType,
-  w as loading,
-  s as miniSize,
+  s as iconOnly,
+  e as label,
+  p as largeSize,
+  l as linkDangerType,
+  g as linkType,
+  x as loading,
+  c as miniSize,
   r as primaryDangerType,
   o as primaryType,
   y as secondaryDangerType,
   a as secondaryType,
-  g as spin,
+  d as spin,
   i as underline
 };

package/dist/components/base/ColorPicker/ColorPicker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ColorPicker.d.ts","sourceRoot":"","sources":["../../../../src/components/base/ColorPicker/ColorPicker.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAE5C,eAAO,MAAM,WAAW,8GAiCtB,CAAC"}
+{"version":3,"file":"ColorPicker.d.ts","sourceRoot":"","sources":["../../../../src/components/base/ColorPicker/ColorPicker.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAG5C,eAAO,MAAM,WAAW,8GAkCtB,CAAC"}

package/dist/components/base/ColorPicker/ColorPicker.js

@@ -1,36 +1,38 @@
 "use client";
-import { jsxs as n, jsx as a } from "react/jsx-runtime";
-import { forwardRef as p } from "react";
+import { jsxs as p, jsx as a } from "react/jsx-runtime";
+import { forwardRef as d } from "react";
 import f from "@uiw/react-color-alpha";
-import d from "@uiw/react-color-shade-slider";
-import C from "@uiw/react-color-wheel";
-import N from "clsx";
+import C from "@uiw/react-color-shade-slider";
+import N from "@uiw/react-color-wheel";
+import v from "clsx";
 import e from "./colorPicker.module.scss.js";
-const v = p((l, m) => {
-  const { className: c, shade: t = !0, alpha: h = !0, color: o = { h: 0, s: 0, v: 100, a: 1 }, setColor: s } = l, i = N(e.colorPicker, c);
-  return /* @__PURE__ */ n(
+const l = 180, x = d((m, t) => {
+  const { className: h, shade: c = !0, alpha: i = !0, color: o = { h: 0, s: 0, v: 100, a: 1 }, setColor: s } = m, n = v(e.colorPicker, h);
+  return /* @__PURE__ */ p(
     "div",
     {
-      ref: m,
-      className: i,
+      ref: t,
+      className: n,
       children: [
         /* @__PURE__ */ a(
-          C,
+          N,
           {
             className: e.wheel,
             color: o,
+            width: l,
+            height: l,
             onChange: (r) => s(r.hsva)
           }
         ),
-        t && /* @__PURE__ */ a(
-          d,
+        c && /* @__PURE__ */ a(
+          C,
           {
             className: e.shade,
             hsva: o,
             onChange: ({ v: r }) => s({ ...o, v: r })
           }
         ),
-        h && /* @__PURE__ */ a(
+        i && /* @__PURE__ */ a(
           f,
           {
             className: e.alpha,
@@ -42,7 +44,7 @@ const v = p((l, m) => {
     }
   );
 });
-v.displayName = "ColorPicker";
+x.displayName = "ColorPicker";
 export {
-  v as ColorPicker
+  x as ColorPicker
 };

package/dist/components/base/ColorPicker/colorPicker.module.scss.js

@@ -1,13 +1,13 @@
-const e = "_colorPicker_1lsi0_1", l = "_wheel_1lsi0_6", s = "_shade_1lsi0_10", o = "_alpha_1lsi0_10", _ = {
+const e = "_colorPicker_16j6k_1", o = "_wheel_16j6k_5", _ = "_shade_16j6k_9", a = "_alpha_16j6k_9", c = {
   colorPicker: e,
-  wheel: l,
-  shade: s,
-  alpha: o
+  wheel: o,
+  shade: _,
+  alpha: a
 };
 export {
-  o as alpha,
+  a as alpha,
   e as colorPicker,
-  _ as default,
-  s as shade,
-  l as wheel
+  c as default,
+  _ as shade,
+  o as wheel
 };

package/dist/components/base/ColorPopper/ColorPopper.d.ts

@@ -1,3 +1,12 @@
+import { Ref } from 'react';
 import { TColorPopperProps } from './types';
-export declare const ColorPopper: import('react').ForwardRefExoticComponent<TColorPopperProps & import('react').RefAttributes<HTMLDivElement>>;
+import { AnyColor } from 'colord/types';
+declare function ColorPopperInner<T extends AnyColor = AnyColor>(props: TColorPopperProps<T>, ref: Ref<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+declare namespace ColorPopperInner {
+    var displayName: string;
+}
+export declare const ColorPopper: <T extends AnyColor = AnyColor>(props: TColorPopperProps<T> & {
+    ref?: Ref<HTMLDivElement>;
+}) => ReturnType<typeof ColorPopperInner>;
+export {};
 //# sourceMappingURL=ColorPopper.d.ts.map

package/dist/components/base/ColorPopper/ColorPopper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ColorPopper.d.ts","sourceRoot":"","sources":["../../../../src/components/base/ColorPopper/ColorPopper.tsx"],"names":[],"mappings":"AAsBA,OAAO,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAI5C,eAAO,MAAM,WAAW,8GAuGtB,CAAC"}
+{"version":3,"file":"ColorPopper.d.ts","sourceRoot":"","sources":["../../../../src/components/base/ColorPopper/ColorPopper.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAoD,GAAG,EAAE,MAAM,OAAO,CAAC;AAwB9E,OAAO,oBAAoB,CAAC;AAE5B,OAAO,KAAK,EAAoB,iBAAiB,EAAE,MAAM,SAAS,CAAC;AACnE,OAAO,KAAK,EAAE,QAAQ,EAAoB,MAAM,cAAc,CAAC;AAE/D,iBAAS,gBAAgB,CAAC,CAAC,SAAS,QAAQ,GAAG,QAAQ,EAAG,KAAK,EAAE,iBAAiB,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,GAAG,CAAC,cAAc,CAAC,2CAqO9G;kBArOQ,gBAAgB;;;AAuOzB,eAAO,MAAM,WAAW,EAAmC,CAAC,CAAC,SAAS,QAAQ,GAAG,QAAQ,EACxF,KAAK,EAAE,iBAAiB,CAAC,CAAC,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAA;CAAE,KACvD,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC"}

package/dist/components/base/ColorPopper/ColorPopper.js

@@ -1,94 +1,195 @@
 "use client";
-import { jsxs as f, Fragment as q, jsx as l } from "react/jsx-runtime";
-import { forwardRef as D, useMemo as g, useState as p, useEffect as L } from "react";
-import { useFloating as U, autoUpdate as z, shift as A, flip as B, offset as G, useTransitionStyles as J, useInteractions as K, useClick as Q, useDismiss as V } from "@floating-ui/react";
-import C from "clsx";
-import { colord as t, getFormat as H } from "colord";
-import { ColorPicker as W } from "../ColorPicker/ColorPicker.js";
-import { Icon as X } from "../Icon/Icon.js";
-import { Textfield as Y } from "../Textfield/Textfield.js";
-import "../../../utils/constants/commons.js";
-import { mergeRefs as Z } from "../../../utils/function/mergeRefs.js";
-import h from "./colorPopper.module.scss.js";
-const _ = D((v, y) => {
-  const { className: P, popperClassName: F, placeholder: N = "Color Picker", showReset: R = !0, shade: b, alpha: k, color: s, setColor: o } = v, u = g(() => t(s), []), r = g(() => H(s), [s]), [i, n] = p(t(s).toHsv()), [w, a] = p(t(s).toHex()), [I, d] = p(!1), { refs: x, floatingStyles: S, context: c } = U({
-    open: I,
-    onOpenChange: d,
+import { jsxs as i, Fragment as te, jsx as t } from "react/jsx-runtime";
+import { forwardRef as se, useMemo as M, useState as g, useRef as re, useEffect as I } from "react";
+import { useFloating as le, autoUpdate as ne, shift as ie, flip as ce, offset as ae, useTransitionStyles as he, useInteractions as de, useClick as me, useDismiss as pe } from "@floating-ui/react";
+import B from "clsx";
+import { colord as s, getFormat as fe } from "colord";
+import { ColorPicker as ue } from "../ColorPicker/ColorPicker.js";
+import { Icon as Ce } from "../Icon/Icon.js";
+import { Textfield as ge } from "../Textfield/Textfield.js";
+import { getColorLabel as ye } from "../../../utils/helper/colorHelper.js";
+import { THEME_SCHEME as He } from "../../../utils/constants/theme.js";
+import { mergeRefs as ve } from "../../../utils/function/mergeRefs.js";
+import { Button as w } from "../Button/Button.js";
+/* empty css                 */
+function F(V, L) {
+  const {
+    className: O,
+    popperClassName: j,
+    size: R = "default",
+    placeholder: z = "Color Picker",
+    colorHeading: d = "Pick color",
+    schemeHeading: T,
+    themeScheme: m,
+    setThemeScheme: y,
+    showReset: A = !0,
+    alpha: q,
+    shade: D,
+    swatch: H,
+    color: c,
+    setColor: p
+  } = V, r = M(() => s(c), []), f = M(() => fe(c), [c]), [v, a] = g(r.toHsv()), [u, h] = g(r.toHex()), [U, _] = g(d), x = re(!1), [S, N] = g(!1), { refs: P, floatingStyles: G, context: $ } = le({
+    open: S,
+    onOpenChange: N,
     middleware: [
-      A(),
-      B(),
-      G(({ placement: e }) => e === "bottom" ? 10 : 16)
+      ie({ crossAxis: !0, padding: 18 }),
+      ce(),
+      ae(({ placement: e }) => e === "bottom" ? 10 : 16)
     ],
-    whileElementsMounted: z
-  }), { isMounted: T, styles: E } = J(c, {
+    whileElementsMounted: ne
+  }), { isMounted: J, styles: K } = he($, {
     duration: 200,
-    initial: (e) => ({
+    initial: ({ side: e }) => ({
       opacity: 0,
-      scale: 0.9,
-      translate: (e == null ? void 0 : e.side) === "bottom" ? "0 12px" : "0 -12px"
+      translate: e === "bottom" ? "0px 8px" : "0px -8px"
     })
-  }), { getReferenceProps: M, getFloatingProps: O } = K([
-    Q(c),
-    V(c)
-  ]), j = (e) => {
-    const m = H(e);
-    a(e), m && (m === "hex" && e.length > 6 || m !== "hex") && n(t(e).toHsv());
+  }), { getReferenceProps: b, getFloatingProps: Q } = de([
+    me($),
+    pe($)
+  ]), [k, W, E] = M(() => {
+    const e = s(v), o = e.toHsl(), l = r.toHsl();
+    return [
+      `${Math.round(o.h)} ${Math.round(o.s)}% ${Math.round(o.l)}%`,
+      `${Math.round(l.h)} ${Math.round(l.s)}% ${Math.round(l.l)}%`,
+      e.isLight() ? "black" : "white"
+    ];
+  }, [r, v]), C = (e) => {
+    x.current = !0, f === "rgb" ? p(e.toRgb()) : f === "hex" ? p(e.toHex()) : f === "hsl" ? p(e.toHsl()) : f === "hsv" && p(e.toHsv());
+  }, X = (e) => {
+    h(e);
+    const o = s(e);
+    o.isValid() && (a(o.toHsv()), C(o));
+  }, Y = (e) => {
+    const o = s(e);
+    a(e), h(o.toHex()), C(o);
+  }, Z = (e) => {
+    const o = s(e);
+    a(o.toHsv()), h(o.toHex()), C(o);
+  }, ee = () => {
+    a(r.toHsv()), h(r.toHex()), C(r);
   };
-  return L(() => {
-    const e = t(i);
-    e.isEqual(t(s)) || (r === "rgb" ? o == null || o(e.toRgb()) : r === "hex" ? o == null || o(e.toHex()) : r === "hsl" ? o == null || o(e.toHsl()) : r === "hsv" && (o == null || o(e.toHsv())));
-  }, [s, r, i, o]), /* @__PURE__ */ f(q, { children: [
-    /* @__PURE__ */ l(
-      Y,
+  return I(() => {
+    if (!x.current) {
+      const e = s(c);
+      a(e.toHsv()), h(e.toHex());
+    }
+    x.current = !1;
+  }, [c]), I(() => {
+    _(ye(s(u).toHsl()) ?? d);
+  }, [d, u]), /* @__PURE__ */ i(te, { children: [
+    R === "mini" ? /* @__PURE__ */ t(
+      w,
       {
-        className: C(h.colorInput, P),
-        ref: x.setReference,
-        placeholder: N,
-        icon: "color",
-        value: w,
-        onChange: (e) => j(e.target.value),
-        style: { "--chipColor": t(i).toHex() },
-        onFocus: () => d(!0),
-        ...M()
+        className: "colorButton",
+        ref: P.setReference,
+        size: R,
+        icon: "f53f",
+        iconType: "solid",
+        style: {
+          "--themeColor": k,
+          "--iconColor": E
+        },
+        onClick: () => N(!0),
+        ...b()
+      }
+    ) : /* @__PURE__ */ t(
+      ge,
+      {
+        className: B("colorInput", O),
+        ref: P.setReference,
+        placeholder: z,
+        icon: "f53f",
+        iconType: "solid",
+        active: S,
+        value: u,
+        onChange: (e) => X(e.target.value),
+        style: {
+          "--colorBrandPrimary": k,
+          "--iconColor": E
+        },
+        onFocus: () => N(!0),
+        ...b()
       }
     ),
-    T && /* @__PURE__ */ f(
+    J && /* @__PURE__ */ i(
       "div",
       {
-        ref: Z([y, x.setFloating]),
-        className: C(h.colorPopper, F),
-        style: { ...S, ...E },
-        ...O(),
+        ref: ve([L, P.setFloating]),
+        className: B("xtrColorPopper", j),
+        style: { ...G, ...K, "--colorBrandPrimary": k },
+        ...Q(),
         children: [
-          /* @__PURE__ */ f("div", { className: h.header, children: [
-            /* @__PURE__ */ l("h1", { children: "Choose a color" }),
-            R && /* @__PURE__ */ l(
-              X,
+          T && /* @__PURE__ */ i("div", { className: "themeScheme", children: [
+            /* @__PURE__ */ t("div", { className: "header", children: /* @__PURE__ */ i("div", { className: "heading", children: [
+              /* @__PURE__ */ t("h1", { children: m }),
+              /* @__PURE__ */ t("h1", { children: T })
+            ] }) }),
+            /* @__PURE__ */ t("div", { className: "schemeSelector", children: He.map(({ name: e, icon: o }, l) => /* @__PURE__ */ t(
+              w,
+              {
+                icon: o,
+                iconType: "solid",
+                disabled: m === e,
+                type: m === e ? "primary" : "secondary",
+                style: {
+                  color: m === e ? "hsl(var(--colorBrandPrimary))" : void 0
+                },
+                onClick: () => y == null ? void 0 : y(e)
+              },
+              `ThemeScheme-${e}-${l}`
+            )) })
+          ] }),
+          /* @__PURE__ */ i("div", { className: "header", children: [
+            /* @__PURE__ */ i("div", { className: "heading", children: [
+              /* @__PURE__ */ t("h1", { children: U }),
+              /* @__PURE__ */ t("h1", { children: d })
+            ] }),
+            A && /* @__PURE__ */ t(
+              Ce,
               {
                 code: "f1da",
-                onClick: () => {
-                  n(u.toHsv()), a(u.toHex());
-                }
+                type: "solid",
+                style: { "--colorBrandPrimary": W },
+                onClick: ee
               }
             )
           ] }),
-          /* @__PURE__ */ l(
-            W,
+          H && /* @__PURE__ */ t("div", { className: "swatch", children: H.map((e, o) => {
+            const l = s(u).isEqual(e), n = s(e).toHsl(), oe = `${n.h} ${n.s}% ${n.l}%`;
+            return /* @__PURE__ */ t(
+              w,
+              {
+                className: "swatchItem",
+                icon: "f00c",
+                iconType: "solid",
+                size: "mini",
+                style: {
+                  "--themeColor": oe,
+                  color: l ? "white" : "transparent"
+                },
+                onClick: () => Z(n)
+              },
+              `ThemeColor-${n.h}${n.s}${n.l}-${o}`
+            );
+          }) }),
+          H && /* @__PURE__ */ t("hr", {}),
+          /* @__PURE__ */ t(
+            ue,
             {
-              shade: b,
-              alpha: k,
-              color: i,
-              setColor: (e) => {
-                n(e), a(t(e).toHex());
-              }
+              className: "colorPicker",
+              alpha: q,
+              shade: D,
+              color: v,
+              setColor: Y
             }
           )
         ]
       }
     )
   ] });
-});
-_.displayName = "ColorPopper";
+}
+const Be = se(F);
+F.displayName = "ColorPopper";
 export {
-  _ as ColorPopper
+  Be as ColorPopper
 };

package/dist/components/base/ColorPopper/types.d.ts

@@ -1,12 +1,24 @@
-import { AnyColor } from 'colord';
-export type TColorPopperProps = {
+import { TThemeScheme } from '../../context/Theme/types';
+import { HslColor, RgbColor, HsvColor, RgbaColor, AnyColor } from 'colord';
+export declare enum EColorPopperSize {
+    mini = "mini",
+    default = "default"
+}
+export type ExtractColorType<T> = T extends RgbColor ? RgbColor : T extends RgbaColor ? RgbaColor : T extends HslColor ? HslColor : T extends HsvColor ? HsvColor : AnyColor;
+export type TColorPopperProps<T extends AnyColor = AnyColor> = {
     className?: string;
     popperClassName?: string;
+    size?: keyof typeof EColorPopperSize;
     placeholder?: string;
+    colorHeading?: string;
+    schemeHeading?: string;
+    themeScheme?: TThemeScheme | undefined;
+    setThemeScheme?: (scheme: TThemeScheme | undefined) => void;
     showReset?: boolean;
     alpha?: boolean;
     shade?: boolean;
-    color: AnyColor;
-    setColor: (col: AnyColor) => void;
+    swatch?: T[];
+    color: T;
+    setColor: (col: ExtractColorType<T>) => void;
 };
 //# sourceMappingURL=types.d.ts.map

package/dist/components/base/ColorPopper/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/base/ColorPopper/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,QAAQ,EAAE,MAAM,QAAQ,CAAC;AAEvC,MAAM,MAAM,iBAAiB,GAAG;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,KAAK,EAAE,QAAQ,CAAC;IAChB,QAAQ,EAAE,CAAC,GAAG,EAAE,QAAQ,KAAK,IAAI,CAAC;CAClC,CAAA"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/base/ColorPopper/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,iCAAiC,CAAC;AAE/D,OAAO,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAC;AAEhF,oBAAY,gBAAgB;IAC3B,IAAI,SAAS;IACb,OAAO,YAAY;CACnB;AAED,MAAM,MAAM,gBAAgB,CAAC,CAAC,IAAI,CAAC,SAAS,QAAQ,GACjD,QAAQ,GAAG,CAAC,SAAS,SAAS,GAAG,SAAS,GAAG,CAAC,SAAS,QAAQ,GAC/D,QAAQ,GAAG,CAAC,SAAS,QAAQ,GAAG,QAAQ,GAAG,QAAQ,CAAC;AAEvD,MAAM,MAAM,iBAAiB,CAAC,CAAC,SAAS,QAAQ,GAAG,QAAQ,IAAI;IAC9D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,IAAI,CAAC,EAAE,MAAM,OAAO,gBAAgB,CAAC;IACrC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,YAAY,GAAG,SAAS,CAAC;IACvC,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,YAAY,GAAG,SAAS,KAAK,IAAI,CAAC;IAC5D,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,MAAM,CAAC,EAAE,CAAC,EAAE,CAAC;IACb,KAAK,EAAE,CAAC,CAAC;IACT,QAAQ,EAAE,CAAC,GAAG,EAAE,gBAAgB,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;CAC7C,CAAC"}

package/dist/components/base/Icon/Icon.js

@@ -1,16 +1,16 @@
 "use client";
 import { jsx as p } from "react/jsx-runtime";
-import { forwardRef as l } from "react";
-import a from "clsx";
-import "../../../utils/constants/commons.js";
-import { unicodeToString as f } from "../../../utils/function/string.js";
+import { forwardRef as a } from "react";
+import f from "clsx";
+import "../../../utils/constants/theme.js";
+import { unicodeToString as d } from "../../../utils/function/string.js";
 /* empty css          */
-import { EIconSize as d } from "./types.js";
-const u = l((e, i) => {
-  const { className: n, code: r, type: c = "light", size: o = "default", onClick: t } = e, m = `${typeof o == "number" ? o : d[o]}px`, s = a(
+import { EIconSize as u } from "./types.js";
+const x = a((e, i) => {
+  const { className: n, style: r = {}, code: c, type: m = "light", size: o = "default", onClick: t } = e, s = `${typeof o == "number" ? o : u[o]}px`, l = f(
     "xtrIcon",
     "fontAwesome",
-    c,
+    m,
     t && "iconButton",
     n
   );
@@ -18,15 +18,15 @@ const u = l((e, i) => {
     "i",
     {
       ref: i,
-      className: s,
-      style: { "--iconSize": m },
-      "data-content": f(r),
+      className: l,
+      style: { "--iconSize": s, ...r },
+      "data-content": d(c),
       role: "img",
       onClick: t
     }
   );
 });
-u.displayName = "Icon";
+x.displayName = "Icon";
 export {
-  u as Icon
+  x as Icon
 };

package/dist/components/base/Icon/types.d.ts

@@ -1,5 +1,7 @@
+import { CSSProperties } from 'react';
 export type IIconProps = {
     className?: string;
+    style?: CSSProperties;
     code: string;
     type?: keyof typeof EIconType;
     size?: number | keyof typeof EIconSize;

package/dist/components/base/Icon/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/base/Icon/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,UAAU,GAAG;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,OAAO,SAAS,CAAC;IAC9B,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,OAAO,SAAS,CAAC;IACvC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB,CAAA;AACD,oBAAY,SAAS;IACpB,IAAI,SAAS;IACb,KAAK,UAAU;IACf,OAAO,YAAY;IACnB,KAAK,UAAU;IACf,OAAO,YAAY;IACnB,UAAU,eAAe;IACzB,YAAY,iBAAiB;IAC7B,UAAU,eAAe;IACzB,KAAK,UAAU;CACf;AAED,oBAAY,SAAS;IACpB,IAAI,KAAK;IACT,OAAO,KAAK;IACZ,KAAK,KAAK;CACV"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/base/Icon/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAEtC,MAAM,MAAM,UAAU,GAAG;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,OAAO,SAAS,CAAC;IAC9B,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,OAAO,SAAS,CAAC;IACvC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB,CAAA;AACD,oBAAY,SAAS;IACpB,IAAI,SAAS;IACb,KAAK,UAAU;IACf,OAAO,YAAY;IACnB,KAAK,UAAU;IACf,OAAO,YAAY;IACnB,UAAU,eAAe;IACzB,YAAY,iBAAiB;IAC7B,UAAU,eAAe;IACzB,KAAK,UAAU;CACf;AAED,oBAAY,SAAS;IACpB,IAAI,KAAK;IACT,OAAO,KAAK;IACZ,KAAK,KAAK;CACV"}

package/dist/components/base/ProgressBar/progressbar.module.scss.js

@@ -1,4 +1,4 @@
-const r = "_progressBar_luf46_1", s = "_progress_luf46_1", e = "_intermediate_luf46_31", t = {
+const r = "_progressBar_192yn_1", s = "_progress_192yn_1", e = "_intermediate_192yn_31", t = {
   progressBar: r,
   progress: s,
   intermediate: e

package/dist/components/base/Select/Select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../../src/components/base/Select/Select.tsx"],"names":[],"mappings":"AAOA,OAAO,eAAe,CAAC;AACvB,OAAO,EAAU,YAAY,EAAE,MAAM,SAAS,CAAC;AAE/C,wBAAgB,MAAM,CAAC,CAAC,EAAG,KAAK,EAAE,YAAY,CAAC,CAAC,CAAC,2CAgEhD"}
+{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../../src/components/base/Select/Select.tsx"],"names":[],"mappings":"AAeA,OAAO,eAAe,CAAC;AACvB,OAAO,EAAU,YAAY,EAAE,MAAM,SAAS,CAAC;AAE/C,wBAAgB,MAAM,CAAC,CAAC,EAAG,KAAK,EAAE,YAAY,CAAC,CAAC,CAAC,2CA2EhD"}