xtreme-ui 0.0.93 → 0.0.95

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/Avatar/Avatar.js

@@ -1,52 +1,53 @@
 "use client";
 import { jsx as i } from "react/jsx-runtime";
-import { forwardRef as E, useState as c, useMemo as S, useEffect as z } from "react";
+import { forwardRef as z, useState as c, useEffect as E } from "react";
 import C from "clsx";
-import { FACE_ICONS as d } from "../../../utils/constants/iconCollection.js";
-import { readImageFile as M, readImageSrc as F } from "../../../utils/helper/imageHelper.js";
-import { Icon as L } from "../Icon/Icon.js";
+import { FACE_ICONS as m } from "../../../utils/constants/iconCollection.js";
+import { readImageFile as F, readImageSrc as L } from "../../../utils/helper/imageHelper.js";
+import { Icon as b } from "../Icon/Icon.js";
 /* empty css            */
-import { EAvatarSize as _ } from "./types.js";
-const b = E((g, h) => {
-  const { className: u, src: a, file: o, alt: v, placeholderIcon: A, size: l = "default", onClick: I } = g, [m, n] = c(), [y, t] = c(!!a || !!o), [f, r] = c(!1), N = S(() => d.happy[Math.floor(Math.random() * d.happy.length)], []), p = typeof l == "number" ? l : _[l], x = C(
+import { EAvatarSize as M } from "./types.js";
+const R = z((h, g) => {
+  const { className: u, src: a, file: o, alt: v, placeholderIcon: y, size: l = "default", onClick: I } = h, [n, f] = c(), [x, A] = c(m.happy[0]), [N, t] = c(!!a || !!o), [p, r] = c(!1), d = typeof l == "number" ? l : M[l], S = C(
     "xtrAvatar",
     u,
-    y && "loading",
-    f && "error"
+    N && "loading",
+    p && "error"
   ), s = (e) => {
-    e && setTimeout(() => n(e), 300), setTimeout(() => t(!1), 1e3);
+    e && setTimeout(() => f(e), 300), setTimeout(() => t(!1), 1e3);
   };
-  return z(() => {
+  return E(() => {
+    A(m.happy[Math.floor(Math.random() * m.happy.length)]);
     try {
-      o ? (t(!0), r(!1), M(o).then((e) => s(e)).catch((e) => {
+      o ? (t(!0), r(!1), F(o).then((e) => s(e)).catch((e) => {
         console.log(e), t(!1), r(!0);
-      })) : a ? (t(!0), r(!1), F(a).then((e) => s(e)).catch((e) => {
+      })) : a ? (t(!0), r(!1), L(a).then((e) => s(e)).catch((e) => {
         console.log(e, a), t(!1), r(!0);
-      })) : (n(void 0), s());
+      })) : (f(void 0), s());
     } catch {
       s();
     }
   }, [a, o]), /* @__PURE__ */ i(
     "div",
     {
-      ref: h,
-      className: x,
-      style: { "--avatarSize": p + "px" },
+      ref: g,
+      className: S,
+      style: { "--avatarSize": d + "px" },
       onClick: I,
       role: "img",
-      children: m ? /* @__PURE__ */ i("img", { className: "image", src: m, alt: v }) : /* @__PURE__ */ i(
-        L,
+      children: n ? /* @__PURE__ */ i("img", { className: "image", src: n, alt: v }) : /* @__PURE__ */ i(
+        b,
         {
           className: "placeholder",
           type: "solid",
-          size: 8 + p / 4,
-          code: f ? "e1b7" : A ?? N
+          size: 8 + d / 4,
+          code: p ? "e1b7" : y ?? x
         }
       )
     }
   );
 });
-b.displayName = "Avatar";
+R.displayName = "Avatar";
 export {
-  b as Avatar
+  R as Avatar
 };

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/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;AAqB9E,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,2CA+H9G;kBA/HQ,gBAAgB;;;AAiIzB,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,115 @@
 "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 u, Fragment as z, jsx as c } from "react/jsx-runtime";
+import { forwardRef as A, useMemo as h, useState as C, useRef as G, useEffect as J } from "react";
+import { useFloating as K, autoUpdate as Q, shift as W, flip as X, offset as Y, useTransitionStyles as Z, useInteractions as _, useClick as oo, useDismiss as eo } from "@floating-ui/react";
+import P from "clsx";
+import { colord as s, getFormat as to } from "colord";
+import { ColorPicker as ro } from "../ColorPicker/ColorPicker.js";
+import { Icon as so } from "../Icon/Icon.js";
+import { Textfield as no } from "../Textfield/Textfield.js";
+import "../../../utils/constants/theme.js";
+import { mergeRefs as lo } from "../../../utils/function/mergeRefs.js";
+/* empty css                 */
+function y(v, R) {
+  const {
+    className: k,
+    popperClassName: F,
+    placeholder: I = "Color Picker",
+    showReset: M = !0,
+    alpha: N,
+    shade: b,
+    color: t,
+    setColor: n
+  } = v, r = h(() => s(t), []), l = h(() => to(t), [t]), [p, a] = C(r.toHsv()), [w, i] = C(r.toHex()), f = G(!1), [S, g] = C(!1), { refs: x, floatingStyles: T, context: m } = K({
+    open: S,
+    onOpenChange: g,
     middleware: [
-      A(),
-      B(),
-      G(({ placement: e }) => e === "bottom" ? 10 : 16)
+      W({ padding: 18 }),
+      X(),
+      Y(({ placement: o }) => o === "bottom" ? 10 : 16)
     ],
-    whileElementsMounted: z
-  }), { isMounted: T, styles: E } = J(c, {
+    whileElementsMounted: Q
+  }), { isMounted: O, styles: V } = Z(m, {
     duration: 200,
-    initial: (e) => ({
+    initial: ({ side: o }) => ({
       opacity: 0,
       scale: 0.9,
-      translate: (e == null ? void 0 : e.side) === "bottom" ? "0 12px" : "0 -12px"
+      translate: o === "bottom" ? "0 12px" : "0 -12px"
     })
-  }), { 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: $, getFloatingProps: j } = _([
+    oo(m),
+    eo(m)
+  ]);
+  J(() => {
+    if (!f.current) {
+      const o = s(t);
+      a(o.toHsv()), i(o.toHex());
+    }
+    f.current = !1;
+  }, [t]);
+  const [H, B] = h(() => {
+    const o = s(p), { h: e, s: U, l: q } = o.toHsl();
+    return [`${Math.round(e)} ${Math.round(U)}% ${Math.round(q)}%`, o.isLight() ? "black" : "white"];
+  }, [p]), d = (o) => {
+    f.current = !0, l === "rgb" ? n(o.toRgb()) : l === "hex" ? n(o.toHex()) : l === "hsl" ? n(o.toHsl()) : l === "hsv" && n(o.toHsv());
+  }, E = (o) => {
+    i(o);
+    const e = s(o);
+    e.isValid() && (a(e.toHsv()), d(e));
+  }, L = (o) => {
+    a(o);
+    const e = s(o);
+    i(e.toHex()), d(e);
+  }, D = () => {
+    const o = r.toHsv();
+    a(o), i(r.toHex()), d(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 /* @__PURE__ */ u(z, { children: [
+    /* @__PURE__ */ c(
+      no,
       {
-        className: C(h.colorInput, P),
+        className: P("colorInput", k),
         ref: x.setReference,
-        placeholder: N,
-        icon: "color",
+        placeholder: I,
+        icon: "f53f",
         value: w,
-        onChange: (e) => j(e.target.value),
-        style: { "--chipColor": t(i).toHex() },
-        onFocus: () => d(!0),
-        ...M()
+        onChange: (o) => E(o.target.value),
+        style: {
+          "--colorBrandPrimary": H,
+          "--iconColor": B
+        },
+        onFocus: () => g(!0),
+        ...$()
       }
     ),
-    T && /* @__PURE__ */ f(
+    O && /* @__PURE__ */ u(
       "div",
       {
-        ref: Z([y, x.setFloating]),
-        className: C(h.colorPopper, F),
-        style: { ...S, ...E },
-        ...O(),
+        ref: lo([R, x.setFloating]),
+        className: P("xtrColorPopper", F),
+        style: { ...T, ...V, "--colorBrandPrimary": H },
+        ...j(),
         children: [
-          /* @__PURE__ */ f("div", { className: h.header, children: [
-            /* @__PURE__ */ l("h1", { children: "Choose a color" }),
-            R && /* @__PURE__ */ l(
-              X,
-              {
-                code: "f1da",
-                onClick: () => {
-                  n(u.toHsv()), a(u.toHex());
-                }
-              }
-            )
+          /* @__PURE__ */ u("div", { className: "header", children: [
+            /* @__PURE__ */ c("h1", { children: "Choose a color" }),
+            M && /* @__PURE__ */ c(so, { code: "f1da", onClick: D })
           ] }),
-          /* @__PURE__ */ l(
-            W,
+          /* @__PURE__ */ c(
+            ro,
             {
+              alpha: N,
               shade: b,
-              alpha: k,
-              color: i,
-              setColor: (e) => {
-                n(e), a(t(e).toHex());
-              }
+              color: p,
+              setColor: L
             }
           )
         ]
       }
     )
   ] });
-});
-_.displayName = "ColorPopper";
+}
+const Ho = A(y);
+y.displayName = "ColorPopper";
 export {
-  _ as ColorPopper
+  Ho as ColorPopper
 };

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

@@ -1,12 +1,13 @@
-import { AnyColor } from 'colord';
-export type TColorPopperProps = {
+import { HslColor, RgbColor, HsvColor, RgbaColor, AnyColor } from 'colord';
+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;
     placeholder?: string;
     showReset?: boolean;
     alpha?: boolean;
     shade?: boolean;
-    color: AnyColor;
-    setColor: (col: AnyColor) => void;
+    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,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAC;AAEhF,MAAM,MAAM,gBAAgB,CAAC,CAAC,IAAI,CAAC,SAAS,QAAQ,GACjD,QAAQ,GACR,CAAC,SAAS,SAAS,GACnB,SAAS,GACT,CAAC,SAAS,QAAQ,GAClB,QAAQ,GACR,CAAC,SAAS,QAAQ,GAClB,QAAQ,GACR,QAAQ,CAAC;AAEZ,MAAM,MAAM,iBAAiB,CAAC,CAAC,SAAS,QAAQ,GAAG,QAAQ,IAAI;IAC9D,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,CAAC,CAAC;IACT,QAAQ,EAAE,CAAC,GAAG,EAAE,gBAAgB,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;CAC7C,CAAC"}

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

@@ -2,7 +2,7 @@
 import { jsx as p } from "react/jsx-runtime";
 import { forwardRef as l } from "react";
 import a from "clsx";
-import "../../../utils/constants/commons.js";
+import "../../../utils/constants/theme.js";
 import { unicodeToString as f } from "../../../utils/function/string.js";
 /* empty css          */
 import { EIconSize as d } from "./types.js";

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"}

package/dist/components/base/Select/Select.js

@@ -1,65 +1,74 @@
 "use client";
-import { jsxs as M, jsx as c } from "react/jsx-runtime";
-import { useState as I, useMemo as O } from "react";
-import j from "clsx";
-import y from "react-select";
-import { Icon as z } from "../Icon/Icon.js";
+import { jsxs as I, jsx as c } from "react/jsx-runtime";
+import { useState as O, useMemo as j } from "react";
+import y from "clsx";
+import z from "react-select";
+import { isEqual as d } from "../../../utils/function/common.js";
+import { Icon as H } from "../Icon/Icon.js";
 /* empty css            */
-function $(m) {
+function $(h) {
   const {
-    className: d,
-    multi: s = !1,
-    placeholder: l = "Select an option",
-    noOptionsMessage: f,
-    icon: o,
-    size: n = "default",
-    iconType: u = "regular",
-    clearable: h = !0,
-    searchable: r = !0,
-    disabled: S = !1,
-    loading: x = !1,
-    options: a,
+    className: S,
+    multi: l = !1,
+    placeholder: a = "Select an option",
+    noOptionsMessage: v,
+    icon: n,
+    size: i = "default",
+    iconType: x = "regular",
+    clearable: g = !0,
+    searchable: m = !0,
+    disabled: C = !1,
+    loading: b = !1,
+    options: o,
     value: t,
-    onChange: g
-  } = m, [i, p] = I(!1), v = O(
-    () => a.find((e) => e.value === t),
-    [a, t]
-  ), C = j(
+    onChange: p
+  } = h, [u, f] = O(!1), N = j(() => {
+    if (l) {
+      const e = t ?? [];
+      return o.filter((s) => e.some((r) => d(s.value, r)));
+    } else
+      return o.find((e) => d(e.value, t)) || null;
+  }, [l, o, t]), M = y(
     "xtrSelectWrapper",
-    n && `${n}Size`,
-    s ? "multi" : "single",
-    o && "withIcon",
+    i && `${i}Size`,
+    l ? "multi" : "single",
+    n && "withIcon",
     !!t && "withValue",
-    i && "open",
-    !r && "noSearch",
-    d
+    u && "open",
+    !m && "noSearch",
+    S
   );
-  return /* @__PURE__ */ M("div", { className: C, children: [
+  return /* @__PURE__ */ I("div", { className: M, children: [
     /* @__PURE__ */ c(
-      y,
+      z,
       {
         className: "xtrSelect",
         classNamePrefix: "xtrSelect",
-        isMulti: s,
-        menuIsOpen: i,
-        onMenuOpen: () => p(!0),
-        onMenuClose: () => p(!1),
-        noOptionsMessage: f,
-        placeholder: l,
-        isClearable: h,
-        isSearchable: r,
-        isDisabled: S,
-        isLoading: x,
-        options: a,
-        value: v,
+        isMulti: l,
+        menuIsOpen: u,
+        onMenuOpen: () => f(!0),
+        onMenuClose: () => f(!1),
+        noOptionsMessage: v,
+        placeholder: a,
+        isClearable: g,
+        isSearchable: m,
+        isDisabled: C,
+        isLoading: b,
+        options: o,
+        value: N,
         onChange: (e) => {
-          const b = s ? e == null ? void 0 : e.map(({ value: N }) => N) : e == null ? void 0 : e.value;
-          g(b);
+          if (l) {
+            const s = (e == null ? void 0 : e.map((r) => r.value)) ?? [];
+            p(s);
+          } else {
+            const s = (e == null ? void 0 : e.value) ?? null;
+            p(s);
+          }
         }
       }
     ),
-    l && !s && /* @__PURE__ */ c("p", { className: "placeholder", children: l }),
-    o && /* @__PURE__ */ c(z, { className: "xtrSelectIcon", code: o, type: u })
+    a && !l && /* @__PURE__ */ c("p", { className: "placeholder", children: a }),
+    n && /* @__PURE__ */ c(H, { className: "xtrSelectIcon", code: n, type: x })
   ] });
 }
 export {

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

@@ -24,11 +24,16 @@ type TCommonProps<T> = {
     loading?: boolean;
     options: Option<T>[];
 };
-type SingleProps<T> = TCommonProps<T> & {
+export type SingleProps<T> = TCommonProps<T> & {
     multi?: false;
-    value?: T;
-    onChange: (value: T) => void;
+    value?: T | undefined;
+    onChange: (value: T | undefined) => void;
 };
-export type TSelectProps<T> = SingleProps<T>;
+export type MultiProps<T> = TCommonProps<T> & {
+    multi: true;
+    value?: T[];
+    onChange: (value: T[]) => void;
+};
+export type TSelectProps<T> = SingleProps<T> | MultiProps<T>;
 export {};
 //# sourceMappingURL=types.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/base/Select/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAE1C,oBAAY,WAAW;IACtB,IAAI,SAAS;IACb,OAAO,YAAY;IACnB,KAAK,UAAU;CACf;AAED,MAAM,MAAM,MAAM,CAAC,CAAC,IAAI;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,CAAC,CAAA;CAAE,CAAC;AACpD,KAAK,YAAY,CAAC,CAAC,IAAI;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB,CAAC,EAAE,CAAC,GAAG,EAAE;QAAE,UAAU,EAAE,MAAM,CAAA;KAAE,KAAK,SAAS,CAAC;IAC9D,IAAI,CAAC,EAAE,MAAM,OAAO,WAAW,CAAC;IAChC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,OAAO,SAAS,CAAC;IAClC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC;CACrB,CAAC;AACF,KAAK,WAAW,CAAC,CAAC,IAAI,YAAY,CAAC,CAAC,CAAC,GAAG;IACvC,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,KAAK,CAAC,EAAE,CAAC,CAAC;IACV,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;CAC7B,CAAC;AAQF,MAAM,MAAM,YAAY,CAAC,CAAC,IAAI,WAAW,CAAC,CAAC,CAAC,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/base/Select/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAE1C,oBAAY,WAAW;IACrB,IAAI,SAAS;IACb,OAAO,YAAY;IACnB,KAAK,UAAU;CAChB;AAED,MAAM,MAAM,MAAM,CAAC,CAAC,IAAI;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,CAAC,CAAA;CAAE,CAAC;AAEpD,KAAK,YAAY,CAAC,CAAC,IAAI;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB,CAAC,EAAE,CAAC,GAAG,EAAE;QAAE,UAAU,EAAE,MAAM,CAAA;KAAE,KAAK,SAAS,CAAC;IAC9D,IAAI,CAAC,EAAE,MAAM,OAAO,WAAW,CAAC;IAChC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,OAAO,SAAS,CAAC;IAClC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,WAAW,CAAC,CAAC,IAAI,YAAY,CAAC,CAAC,CAAC,GAAG;IAC7C,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,KAAK,CAAC,EAAE,CAAC,GAAG,SAAS,CAAC;IACtB,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,GAAG,SAAS,KAAK,IAAI,CAAC;CAC1C,CAAC;AAEF,MAAM,MAAM,UAAU,CAAC,CAAC,IAAI,YAAY,CAAC,CAAC,CAAC,GAAG;IAC5C,KAAK,EAAE,IAAI,CAAC;IACZ,KAAK,CAAC,EAAE,CAAC,EAAE,CAAC;IACZ,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC;CAChC,CAAC;AAEF,MAAM,MAAM,YAAY,CAAC,CAAC,IAAI,WAAW,CAAC,CAAC,CAAC,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC"}

package/dist/components/base/Textfield/textfield.module.scss.js

@@ -1,23 +1,23 @@
-const n = "_textfield_1l1n6_1", t = "_icon_1l1n6_29", e = "_dialCode_1l1n6_39", _ = "_input_1l1n6_60", l = "_placeholder_1l1n6_79", o = "_withIcon_1l1n6_94", a = "_textarea_1l1n6_104", c = "_phone_1l1n6_114", s = "_hasValue_1l1n6_120", i = {
-  textfield: n,
-  icon: t,
-  dialCode: e,
+const e = "_textfield_zn0ed_1", n = "_icon_zn0ed_29", t = "_dialCode_zn0ed_39", _ = "_input_zn0ed_60", o = "_placeholder_zn0ed_79", d = "_withIcon_zn0ed_94", a = "_textarea_zn0ed_104", c = "_phone_zn0ed_114", l = "_hasValue_zn0ed_120", s = {
+  textfield: e,
+  icon: n,
+  dialCode: t,
   input: _,
-  placeholder: l,
-  withIcon: o,
+  placeholder: o,
+  withIcon: d,
   textarea: a,
   phone: c,
-  hasValue: s
+  hasValue: l
 };
 export {
-  i as default,
-  e as dialCode,
-  s as hasValue,
-  t as icon,
+  s as default,
+  t as dialCode,
+  l as hasValue,
+  n as icon,
   _ as input,
   c as phone,
-  l as placeholder,
+  o as placeholder,
   a as textarea,
-  n as textfield,
-  o as withIcon
+  e as textfield,
+  d as withIcon
 };

package/dist/components/context/Theme/ThemeContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeContext.d.ts","sourceRoot":"","sources":["../../../../src/components/context/Theme/ThemeContext.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAe,iBAAiB,EAAE,mBAAmB,EAAgB,MAAM,SAAS,CAAC;AAS5F,QAAA,MAAM,YAAY,4CAA8B,CAAC;AACjD,QAAA,MAAM,aAAa,GAAI,cAAc,mBAAmB,4CA8BvD,CAAC;AAEF,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,CAAC"}
+{"version":3,"file":"ThemeContext.d.ts","sourceRoot":"","sources":["../../../../src/components/context/Theme/ThemeContext.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAe,iBAAiB,EAAE,mBAAmB,EAAgB,MAAM,SAAS,CAAC;AAS5F,QAAA,MAAM,YAAY,4CAA8B,CAAC;AACjD,QAAA,MAAM,aAAa,GAAI,cAAc,mBAAmB,4CAoCvD,CAAC;AAEF,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,CAAC"}