xtreme-ui 0.0.94 → 0.0.95

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (51) hide show
  1. package/dist/components/base/ActionCard/actionCard.module.scss.js +6 -6
  2. package/dist/components/base/Button/button.module.scss.js +23 -23
  3. package/dist/components/base/ColorPopper/ColorPopper.d.ts +10 -1
  4. package/dist/components/base/ColorPopper/ColorPopper.d.ts.map +1 -1
  5. package/dist/components/base/ColorPopper/ColorPopper.js +88 -67
  6. package/dist/components/base/ColorPopper/types.d.ts +5 -4
  7. package/dist/components/base/ColorPopper/types.d.ts.map +1 -1
  8. package/dist/components/base/Icon/Icon.js +1 -1
  9. package/dist/components/base/ProgressBar/progressbar.module.scss.js +1 -1
  10. package/dist/components/base/Select/Select.d.ts.map +1 -1
  11. package/dist/components/base/Select/Select.js +56 -47
  12. package/dist/components/base/Select/types.d.ts +9 -4
  13. package/dist/components/base/Select/types.d.ts.map +1 -1
  14. package/dist/components/base/Textfield/textfield.module.scss.js +14 -14
  15. package/dist/components/context/Theme/ThemeContext.d.ts.map +1 -1
  16. package/dist/components/context/Theme/ThemeContext.js +19 -14
  17. package/dist/components/context/Theme/types.d.ts +12 -17
  18. package/dist/components/context/Theme/types.d.ts.map +1 -1
  19. package/dist/components/context/Theme/types.js +4 -8
  20. package/dist/components/layout/Navigation/navigation.module.scss.js +9 -9
  21. package/dist/components/layout/Sider/sider.module.scss.js +6 -6
  22. package/dist/components/layout/ThemePicker/ThemePicker.d.ts.map +1 -1
  23. package/dist/components/layout/ThemePicker/ThemePicker.js +37 -38
  24. package/dist/components/layout/ThemePicker/themePicker.module.scss.js +28 -28
  25. package/dist/components/layout/ThemeSelect/ThemeSelect.d.ts +3 -0
  26. package/dist/components/layout/ThemeSelect/ThemeSelect.d.ts.map +1 -0
  27. package/dist/components/layout/ThemeSelect/types.d.ts +10 -0
  28. package/dist/components/layout/ThemeSelect/types.d.ts.map +1 -0
  29. package/dist/components/layout/ThemeSwitch/ThemeSwitch.d.ts.map +1 -1
  30. package/dist/components/layout/ThemeSwitch/ThemeSwitch.js +40 -40
  31. package/dist/index.js +97 -95
  32. package/dist/utils/constants/theme.d.ts +19 -0
  33. package/dist/utils/constants/theme.d.ts.map +1 -0
  34. package/dist/utils/constants/theme.js +29 -0
  35. package/dist/utils/function/common.d.ts +2 -0
  36. package/dist/utils/function/common.d.ts.map +1 -0
  37. package/dist/utils/function/common.js +4 -0
  38. package/dist/utils/helper/colorHelper.d.ts +5 -0
  39. package/dist/utils/helper/colorHelper.d.ts.map +1 -0
  40. package/dist/utils/helper/colorHelper.js +24 -0
  41. package/dist/utils/helper/themeController.d.ts +2 -1
  42. package/dist/utils/helper/themeController.d.ts.map +1 -1
  43. package/dist/utils/helper/themeController.js +32 -13
  44. package/dist/utils/index.d.ts +1 -1
  45. package/dist/utils/index.d.ts.map +1 -1
  46. package/dist/xtreme-ui.css +1 -1
  47. package/package.json +4 -1
  48. package/dist/components/base/ColorPopper/colorPopper.module.scss.js +0 -11
  49. package/dist/utils/constants/commons.d.ts +0 -18
  50. package/dist/utils/constants/commons.d.ts.map +0 -1
  51. package/dist/utils/constants/commons.js +0 -15
@@ -1,13 +1,13 @@
1
- const i = "_actionCard_1715r_1", e = "_miniSize_1715r_14", m = "_smallSize_1715r_17", _ = "_mediumSize_1715r_20", a = {
1
+ const i = "_actionCard_114zv_1", e = "_miniSize_114zv_14", z = "_smallSize_114zv_17", m = "_mediumSize_114zv_20", _ = {
2
2
  actionCard: i,
3
3
  miniSize: e,
4
- smallSize: m,
5
- mediumSize: _
4
+ smallSize: z,
5
+ mediumSize: m
6
6
  };
7
7
  export {
8
8
  i as actionCard,
9
- a as default,
10
- _ as mediumSize,
9
+ _ as default,
10
+ m as mediumSize,
11
11
  e as miniSize,
12
- m as smallSize
12
+ z as smallSize
13
13
  };
@@ -1,39 +1,39 @@
1
- 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 = {
2
- button: e,
3
- label: n,
1
+ 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 = {
2
+ button: n,
3
+ label: e,
4
4
  icon: _,
5
5
  underline: i,
6
6
  primaryType: o,
7
7
  primaryDangerType: r,
8
8
  secondaryType: a,
9
9
  secondaryDangerType: y,
10
- linkType: l,
11
- linkDangerType: c,
12
- miniSize: s,
13
- iconOnly: t,
14
- defaultSize: p,
15
- largeSize: T,
16
- loading: w,
17
- barberPole: d,
18
- spin: g
10
+ linkType: g,
11
+ linkDangerType: l,
12
+ miniSize: c,
13
+ iconOnly: s,
14
+ defaultSize: t,
15
+ largeSize: p,
16
+ loading: x,
17
+ barberPole: T,
18
+ spin: d
19
19
  };
20
20
  export {
21
- d as barberPole,
22
- e as button,
21
+ T as barberPole,
22
+ n as button,
23
23
  b as default,
24
- p as defaultSize,
24
+ t as defaultSize,
25
25
  _ as icon,
26
- t as iconOnly,
27
- n as label,
28
- T as largeSize,
29
- c as linkDangerType,
30
- l as linkType,
31
- w as loading,
32
- s as miniSize,
26
+ s as iconOnly,
27
+ e as label,
28
+ p as largeSize,
29
+ l as linkDangerType,
30
+ g as linkType,
31
+ x as loading,
32
+ c as miniSize,
33
33
  r as primaryDangerType,
34
34
  o as primaryType,
35
35
  y as secondaryDangerType,
36
36
  a as secondaryType,
37
- g as spin,
37
+ d as spin,
38
38
  i as underline
39
39
  };
@@ -1,3 +1,12 @@
1
+ import { Ref } from 'react';
1
2
  import { TColorPopperProps } from './types';
2
- export declare const ColorPopper: import('react').ForwardRefExoticComponent<TColorPopperProps & import('react').RefAttributes<HTMLDivElement>>;
3
+ import { AnyColor } from 'colord/types';
4
+ declare function ColorPopperInner<T extends AnyColor = AnyColor>(props: TColorPopperProps<T>, ref: Ref<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
5
+ declare namespace ColorPopperInner {
6
+ var displayName: string;
7
+ }
8
+ export declare const ColorPopper: <T extends AnyColor = AnyColor>(props: TColorPopperProps<T> & {
9
+ ref?: Ref<HTMLDivElement>;
10
+ }) => ReturnType<typeof ColorPopperInner>;
11
+ export {};
3
12
  //# sourceMappingURL=ColorPopper.d.ts.map
@@ -1 +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"}
1
+ {"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"}
@@ -1,94 +1,115 @@
1
1
  "use client";
2
- import { jsxs as f, Fragment as q, jsx as l } from "react/jsx-runtime";
3
- import { forwardRef as D, useMemo as g, useState as p, useEffect as L } from "react";
4
- 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";
5
- import C from "clsx";
6
- import { colord as t, getFormat as H } from "colord";
7
- import { ColorPicker as W } from "../ColorPicker/ColorPicker.js";
8
- import { Icon as X } from "../Icon/Icon.js";
9
- import { Textfield as Y } from "../Textfield/Textfield.js";
10
- import "../../../utils/constants/commons.js";
11
- import { mergeRefs as Z } from "../../../utils/function/mergeRefs.js";
12
- import h from "./colorPopper.module.scss.js";
13
- const _ = D((v, y) => {
14
- 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({
15
- open: I,
16
- onOpenChange: d,
2
+ import { jsxs as u, Fragment as z, jsx as c } from "react/jsx-runtime";
3
+ import { forwardRef as A, useMemo as h, useState as C, useRef as G, useEffect as J } from "react";
4
+ 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";
5
+ import P from "clsx";
6
+ import { colord as s, getFormat as to } from "colord";
7
+ import { ColorPicker as ro } from "../ColorPicker/ColorPicker.js";
8
+ import { Icon as so } from "../Icon/Icon.js";
9
+ import { Textfield as no } from "../Textfield/Textfield.js";
10
+ import "../../../utils/constants/theme.js";
11
+ import { mergeRefs as lo } from "../../../utils/function/mergeRefs.js";
12
+ /* empty css */
13
+ function y(v, R) {
14
+ const {
15
+ className: k,
16
+ popperClassName: F,
17
+ placeholder: I = "Color Picker",
18
+ showReset: M = !0,
19
+ alpha: N,
20
+ shade: b,
21
+ color: t,
22
+ setColor: n
23
+ } = 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({
24
+ open: S,
25
+ onOpenChange: g,
17
26
  middleware: [
18
- A(),
19
- B(),
20
- G(({ placement: e }) => e === "bottom" ? 10 : 16)
27
+ W({ padding: 18 }),
28
+ X(),
29
+ Y(({ placement: o }) => o === "bottom" ? 10 : 16)
21
30
  ],
22
- whileElementsMounted: z
23
- }), { isMounted: T, styles: E } = J(c, {
31
+ whileElementsMounted: Q
32
+ }), { isMounted: O, styles: V } = Z(m, {
24
33
  duration: 200,
25
- initial: (e) => ({
34
+ initial: ({ side: o }) => ({
26
35
  opacity: 0,
27
36
  scale: 0.9,
28
- translate: (e == null ? void 0 : e.side) === "bottom" ? "0 12px" : "0 -12px"
37
+ translate: o === "bottom" ? "0 12px" : "0 -12px"
29
38
  })
30
- }), { getReferenceProps: M, getFloatingProps: O } = K([
31
- Q(c),
32
- V(c)
33
- ]), j = (e) => {
34
- const m = H(e);
35
- a(e), m && (m === "hex" && e.length > 6 || m !== "hex") && n(t(e).toHsv());
39
+ }), { getReferenceProps: $, getFloatingProps: j } = _([
40
+ oo(m),
41
+ eo(m)
42
+ ]);
43
+ J(() => {
44
+ if (!f.current) {
45
+ const o = s(t);
46
+ a(o.toHsv()), i(o.toHex());
47
+ }
48
+ f.current = !1;
49
+ }, [t]);
50
+ const [H, B] = h(() => {
51
+ const o = s(p), { h: e, s: U, l: q } = o.toHsl();
52
+ return [`${Math.round(e)} ${Math.round(U)}% ${Math.round(q)}%`, o.isLight() ? "black" : "white"];
53
+ }, [p]), d = (o) => {
54
+ f.current = !0, l === "rgb" ? n(o.toRgb()) : l === "hex" ? n(o.toHex()) : l === "hsl" ? n(o.toHsl()) : l === "hsv" && n(o.toHsv());
55
+ }, E = (o) => {
56
+ i(o);
57
+ const e = s(o);
58
+ e.isValid() && (a(e.toHsv()), d(e));
59
+ }, L = (o) => {
60
+ a(o);
61
+ const e = s(o);
62
+ i(e.toHex()), d(e);
63
+ }, D = () => {
64
+ const o = r.toHsv();
65
+ a(o), i(r.toHex()), d(r);
36
66
  };
37
- return L(() => {
38
- const e = t(i);
39
- 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())));
40
- }, [s, r, i, o]), /* @__PURE__ */ f(q, { children: [
41
- /* @__PURE__ */ l(
42
- Y,
67
+ return /* @__PURE__ */ u(z, { children: [
68
+ /* @__PURE__ */ c(
69
+ no,
43
70
  {
44
- className: C(h.colorInput, P),
71
+ className: P("colorInput", k),
45
72
  ref: x.setReference,
46
- placeholder: N,
47
- icon: "color",
73
+ placeholder: I,
74
+ icon: "f53f",
48
75
  value: w,
49
- onChange: (e) => j(e.target.value),
50
- style: { "--chipColor": t(i).toHex() },
51
- onFocus: () => d(!0),
52
- ...M()
76
+ onChange: (o) => E(o.target.value),
77
+ style: {
78
+ "--colorBrandPrimary": H,
79
+ "--iconColor": B
80
+ },
81
+ onFocus: () => g(!0),
82
+ ...$()
53
83
  }
54
84
  ),
55
- T && /* @__PURE__ */ f(
85
+ O && /* @__PURE__ */ u(
56
86
  "div",
57
87
  {
58
- ref: Z([y, x.setFloating]),
59
- className: C(h.colorPopper, F),
60
- style: { ...S, ...E },
61
- ...O(),
88
+ ref: lo([R, x.setFloating]),
89
+ className: P("xtrColorPopper", F),
90
+ style: { ...T, ...V, "--colorBrandPrimary": H },
91
+ ...j(),
62
92
  children: [
63
- /* @__PURE__ */ f("div", { className: h.header, children: [
64
- /* @__PURE__ */ l("h1", { children: "Choose a color" }),
65
- R && /* @__PURE__ */ l(
66
- X,
67
- {
68
- code: "f1da",
69
- onClick: () => {
70
- n(u.toHsv()), a(u.toHex());
71
- }
72
- }
73
- )
93
+ /* @__PURE__ */ u("div", { className: "header", children: [
94
+ /* @__PURE__ */ c("h1", { children: "Choose a color" }),
95
+ M && /* @__PURE__ */ c(so, { code: "f1da", onClick: D })
74
96
  ] }),
75
- /* @__PURE__ */ l(
76
- W,
97
+ /* @__PURE__ */ c(
98
+ ro,
77
99
  {
100
+ alpha: N,
78
101
  shade: b,
79
- alpha: k,
80
- color: i,
81
- setColor: (e) => {
82
- n(e), a(t(e).toHex());
83
- }
102
+ color: p,
103
+ setColor: L
84
104
  }
85
105
  )
86
106
  ]
87
107
  }
88
108
  )
89
109
  ] });
90
- });
91
- _.displayName = "ColorPopper";
110
+ }
111
+ const Ho = A(y);
112
+ y.displayName = "ColorPopper";
92
113
  export {
93
- _ as ColorPopper
114
+ Ho as ColorPopper
94
115
  };
@@ -1,12 +1,13 @@
1
- import { AnyColor } from 'colord';
2
- export type TColorPopperProps = {
1
+ import { HslColor, RgbColor, HsvColor, RgbaColor, AnyColor } from 'colord';
2
+ export type ExtractColorType<T> = T extends RgbColor ? RgbColor : T extends RgbaColor ? RgbaColor : T extends HslColor ? HslColor : T extends HsvColor ? HsvColor : AnyColor;
3
+ export type TColorPopperProps<T extends AnyColor = AnyColor> = {
3
4
  className?: string;
4
5
  popperClassName?: string;
5
6
  placeholder?: string;
6
7
  showReset?: boolean;
7
8
  alpha?: boolean;
8
9
  shade?: boolean;
9
- color: AnyColor;
10
- setColor: (col: AnyColor) => void;
10
+ color: T;
11
+ setColor: (col: ExtractColorType<T>) => void;
11
12
  };
12
13
  //# sourceMappingURL=types.d.ts.map
@@ -1 +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"}
1
+ {"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"}
@@ -2,7 +2,7 @@
2
2
  import { jsx as p } from "react/jsx-runtime";
3
3
  import { forwardRef as l } from "react";
4
4
  import a from "clsx";
5
- import "../../../utils/constants/commons.js";
5
+ import "../../../utils/constants/theme.js";
6
6
  import { unicodeToString as f } from "../../../utils/function/string.js";
7
7
  /* empty css */
8
8
  import { EIconSize as d } from "./types.js";
@@ -1,4 +1,4 @@
1
- const r = "_progressBar_luf46_1", s = "_progress_luf46_1", e = "_intermediate_luf46_31", t = {
1
+ const r = "_progressBar_192yn_1", s = "_progress_192yn_1", e = "_intermediate_192yn_31", t = {
2
2
  progressBar: r,
3
3
  progress: s,
4
4
  intermediate: e
@@ -1 +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"}
1
+ {"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"}
@@ -1,65 +1,74 @@
1
1
  "use client";
2
- import { jsxs as M, jsx as c } from "react/jsx-runtime";
3
- import { useState as I, useMemo as O } from "react";
4
- import j from "clsx";
5
- import y from "react-select";
6
- import { Icon as z } from "../Icon/Icon.js";
2
+ import { jsxs as I, jsx as c } from "react/jsx-runtime";
3
+ import { useState as O, useMemo as j } from "react";
4
+ import y from "clsx";
5
+ import z from "react-select";
6
+ import { isEqual as d } from "../../../utils/function/common.js";
7
+ import { Icon as H } from "../Icon/Icon.js";
7
8
  /* empty css */
8
- function $(m) {
9
+ function $(h) {
9
10
  const {
10
- className: d,
11
- multi: s = !1,
12
- placeholder: l = "Select an option",
13
- noOptionsMessage: f,
14
- icon: o,
15
- size: n = "default",
16
- iconType: u = "regular",
17
- clearable: h = !0,
18
- searchable: r = !0,
19
- disabled: S = !1,
20
- loading: x = !1,
21
- options: a,
11
+ className: S,
12
+ multi: l = !1,
13
+ placeholder: a = "Select an option",
14
+ noOptionsMessage: v,
15
+ icon: n,
16
+ size: i = "default",
17
+ iconType: x = "regular",
18
+ clearable: g = !0,
19
+ searchable: m = !0,
20
+ disabled: C = !1,
21
+ loading: b = !1,
22
+ options: o,
22
23
  value: t,
23
- onChange: g
24
- } = m, [i, p] = I(!1), v = O(
25
- () => a.find((e) => e.value === t),
26
- [a, t]
27
- ), C = j(
24
+ onChange: p
25
+ } = h, [u, f] = O(!1), N = j(() => {
26
+ if (l) {
27
+ const e = t ?? [];
28
+ return o.filter((s) => e.some((r) => d(s.value, r)));
29
+ } else
30
+ return o.find((e) => d(e.value, t)) || null;
31
+ }, [l, o, t]), M = y(
28
32
  "xtrSelectWrapper",
29
- n && `${n}Size`,
30
- s ? "multi" : "single",
31
- o && "withIcon",
33
+ i && `${i}Size`,
34
+ l ? "multi" : "single",
35
+ n && "withIcon",
32
36
  !!t && "withValue",
33
- i && "open",
34
- !r && "noSearch",
35
- d
37
+ u && "open",
38
+ !m && "noSearch",
39
+ S
36
40
  );
37
- return /* @__PURE__ */ M("div", { className: C, children: [
41
+ return /* @__PURE__ */ I("div", { className: M, children: [
38
42
  /* @__PURE__ */ c(
39
- y,
43
+ z,
40
44
  {
41
45
  className: "xtrSelect",
42
46
  classNamePrefix: "xtrSelect",
43
- isMulti: s,
44
- menuIsOpen: i,
45
- onMenuOpen: () => p(!0),
46
- onMenuClose: () => p(!1),
47
- noOptionsMessage: f,
48
- placeholder: l,
49
- isClearable: h,
50
- isSearchable: r,
51
- isDisabled: S,
52
- isLoading: x,
53
- options: a,
54
- value: v,
47
+ isMulti: l,
48
+ menuIsOpen: u,
49
+ onMenuOpen: () => f(!0),
50
+ onMenuClose: () => f(!1),
51
+ noOptionsMessage: v,
52
+ placeholder: a,
53
+ isClearable: g,
54
+ isSearchable: m,
55
+ isDisabled: C,
56
+ isLoading: b,
57
+ options: o,
58
+ value: N,
55
59
  onChange: (e) => {
56
- const b = s ? e == null ? void 0 : e.map(({ value: N }) => N) : e == null ? void 0 : e.value;
57
- g(b);
60
+ if (l) {
61
+ const s = (e == null ? void 0 : e.map((r) => r.value)) ?? [];
62
+ p(s);
63
+ } else {
64
+ const s = (e == null ? void 0 : e.value) ?? null;
65
+ p(s);
66
+ }
58
67
  }
59
68
  }
60
69
  ),
61
- l && !s && /* @__PURE__ */ c("p", { className: "placeholder", children: l }),
62
- o && /* @__PURE__ */ c(z, { className: "xtrSelectIcon", code: o, type: u })
70
+ a && !l && /* @__PURE__ */ c("p", { className: "placeholder", children: a }),
71
+ n && /* @__PURE__ */ c(H, { className: "xtrSelectIcon", code: n, type: x })
63
72
  ] });
64
73
  }
65
74
  export {
@@ -24,11 +24,16 @@ type TCommonProps<T> = {
24
24
  loading?: boolean;
25
25
  options: Option<T>[];
26
26
  };
27
- type SingleProps<T> = TCommonProps<T> & {
27
+ export type SingleProps<T> = TCommonProps<T> & {
28
28
  multi?: false;
29
- value?: T;
30
- onChange: (value: T) => void;
29
+ value?: T | undefined;
30
+ onChange: (value: T | undefined) => void;
31
31
  };
32
- export type TSelectProps<T> = SingleProps<T>;
32
+ export type MultiProps<T> = TCommonProps<T> & {
33
+ multi: true;
34
+ value?: T[];
35
+ onChange: (value: T[]) => void;
36
+ };
37
+ export type TSelectProps<T> = SingleProps<T> | MultiProps<T>;
33
38
  export {};
34
39
  //# sourceMappingURL=types.d.ts.map
@@ -1 +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"}
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;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"}
@@ -1,23 +1,23 @@
1
- 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 = {
2
- textfield: n,
3
- icon: t,
4
- dialCode: e,
1
+ 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 = {
2
+ textfield: e,
3
+ icon: n,
4
+ dialCode: t,
5
5
  input: _,
6
- placeholder: l,
7
- withIcon: o,
6
+ placeholder: o,
7
+ withIcon: d,
8
8
  textarea: a,
9
9
  phone: c,
10
- hasValue: s
10
+ hasValue: l
11
11
  };
12
12
  export {
13
- i as default,
14
- e as dialCode,
15
- s as hasValue,
16
- t as icon,
13
+ s as default,
14
+ t as dialCode,
15
+ l as hasValue,
16
+ n as icon,
17
17
  _ as input,
18
18
  c as phone,
19
- l as placeholder,
19
+ o as placeholder,
20
20
  a as textarea,
21
- n as textfield,
22
- o as withIcon
21
+ e as textfield,
22
+ d as withIcon
23
23
  };
@@ -1 +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"}
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,4CAoCvD,CAAC;AAEF,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,CAAC"}
@@ -1,22 +1,27 @@
1
1
  "use client";
2
- import { jsx as i } from "react/jsx-runtime";
3
- import { createContext as S, useState as n, useEffect as s } from "react";
4
- import { STORAGE as e } from "../../../utils/constants/commons.js";
5
- const h = {
2
+ import { jsx as d } from "react/jsx-runtime";
3
+ import { createContext as i, useState as n, useEffect as h } from "react";
4
+ import { STORAGE as t, defaultColorPreset as u } from "../../../utils/constants/theme.js";
5
+ const c = {
6
6
  themeScheme: void 0,
7
7
  setThemeScheme: () => null,
8
8
  themeColor: void 0,
9
9
  setThemeColor: () => null
10
- }, d = S(h), A = ({ children: u }) => {
11
- const [t, l] = n(h.themeScheme), [o, c] = n(h.themeColor);
12
- return s(() => {
13
- let m = localStorage.getItem(e.themeScheme), r = localStorage.getItem(e.themeColor);
14
- m || (m = (document == null ? void 0 : document.documentElement.getAttribute(e.themeSchemeAttr)) ?? void 0), r || (r = (document == null ? void 0 : document.documentElement.getAttribute(e.themeColorAttr)) ?? void 0), m && l(m), r && c(r);
15
- }, []), s(() => {
16
- !t || !o || (document.documentElement.setAttribute(e.themeSchemeAttr, t), document.documentElement.setAttribute(e.themeColorAttr, o), localStorage.setItem(e.themeScheme, t), localStorage.setItem(e.themeColor, o));
17
- }, [t, o]), /* @__PURE__ */ i(d.Provider, { value: { themeScheme: t, setThemeScheme: l, themeColor: o, setThemeColor: c }, children: u });
10
+ }, a = i(c), y = ({ children: S }) => {
11
+ const [o, l] = n(c.themeScheme), [e, s] = n(c.themeColor);
12
+ return h(() => {
13
+ let m = localStorage.getItem(t.themeScheme), r;
14
+ try {
15
+ r = JSON.parse(localStorage.getItem(t.themeColor) || "null") || u;
16
+ } catch {
17
+ r = u;
18
+ }
19
+ m || (m = (document == null ? void 0 : document.documentElement.getAttribute(t.themeSchemeAttr)) ?? void 0), m && l(m), r && s(r);
20
+ }, []), h(() => {
21
+ !o || !e || (document.documentElement.setAttribute(t.themeSchemeAttr, o), document.documentElement.style.setProperty("--H", `${e == null ? void 0 : e.h}`), document.documentElement.style.setProperty("--S", `${e == null ? void 0 : e.s}%`), document.documentElement.style.setProperty("--L", `${e == null ? void 0 : e.l}%`), localStorage.setItem(t.themeScheme, o), localStorage.setItem(t.themeColor, JSON.stringify(e)));
22
+ }, [o, e]), /* @__PURE__ */ d(a.Provider, { value: { themeScheme: o, setThemeScheme: l, themeColor: e, setThemeColor: s }, children: S });
18
23
  };
19
24
  export {
20
- d as ThemeContext,
21
- A as ThemeProvider
25
+ a as ThemeContext,
26
+ y as ThemeProvider
22
27
  };
@@ -1,9 +1,9 @@
1
1
  import { ReactNode } from 'react';
2
2
  export type TThemeInitialType = {
3
- themeScheme: TThemeScheme;
4
- setThemeScheme: (scheme: TThemeScheme) => void;
5
- themeColor: TThemeColor;
6
- setThemeColor: (color: TThemeColor) => void;
3
+ themeScheme: TThemeScheme | undefined;
4
+ setThemeScheme: (scheme: TThemeScheme | undefined) => void;
5
+ themeColor: TThemeColor | undefined;
6
+ setThemeColor: (color: TThemeColor | undefined) => void;
7
7
  };
8
8
  export type TThemeProviderProps = {
9
9
  children?: ReactNode;
@@ -11,18 +11,13 @@ export type TThemeProviderProps = {
11
11
  export declare enum EThemeScheme {
12
12
  light = "light",
13
13
  dark = "dark",
14
- system = "system"
14
+ auto = "auto"
15
15
  }
16
- export type TThemeScheme = keyof typeof EThemeScheme | undefined;
17
- export declare const defaultScheme = EThemeScheme.system;
18
- export declare enum EThemeColor {
19
- red = "red",
20
- pink = "pink",
21
- orange = "orange",
22
- green = "green",
23
- blue = "blue",
24
- violet = "violet"
25
- }
26
- export type TThemeColor = keyof typeof EThemeColor | undefined;
27
- export declare const defaultColor = EThemeColor.violet;
16
+ export type TThemeScheme = keyof typeof EThemeScheme;
17
+ export declare const defaultScheme = EThemeScheme.auto;
18
+ export type TThemeColor = {
19
+ h: number;
20
+ s: number;
21
+ l: number;
22
+ };
28
23
  //# sourceMappingURL=types.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/context/Theme/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,MAAM,MAAM,iBAAiB,GAAG;IAC/B,WAAW,EAAE,YAAY,CAAC;IAC1B,cAAc,EAAE,CAAC,MAAM,EAAE,YAAY,KAAK,IAAI,CAAC;IAC/C,UAAU,EAAE,WAAW,CAAC;IACxB,aAAa,EAAE,CAAC,KAAK,EAAE,WAAW,KAAK,IAAI,CAAC;CAC5C,CAAA;AACD,MAAM,MAAM,mBAAmB,GAAG;IAC9B,QAAQ,CAAC,EAAE,SAAS,CAAA;CACvB,CAAA;AAED,oBAAY,YAAY;IACvB,KAAK,UAAU;IACf,IAAI,SAAS;IACb,MAAM,WAAW;CACjB;AACD,MAAM,MAAM,YAAY,GAAG,MAAM,OAAO,YAAY,GAAG,SAAS,CAAC;AACjE,eAAO,MAAM,aAAa,sBAAsB,CAAC;AAEjD,oBAAY,WAAW;IACtB,GAAG,QAAQ;IACX,IAAI,SAAS;IACb,MAAM,WAAW;IACjB,KAAK,UAAU;IACf,IAAI,SAAS;IACb,MAAM,WAAW;CACjB;AACD,MAAM,MAAM,WAAW,GAAG,MAAM,OAAO,WAAW,GAAG,SAAS,CAAC;AAC/D,eAAO,MAAM,YAAY,qBAAqB,CAAC"}
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/context/Theme/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,MAAM,MAAM,iBAAiB,GAAG;IAC/B,WAAW,EAAE,YAAY,GAAG,SAAS,CAAC;IACtC,cAAc,EAAE,CAAC,MAAM,EAAE,YAAY,GAAG,SAAS,KAAK,IAAI,CAAC;IAC3D,UAAU,EAAE,WAAW,GAAG,SAAS,CAAC;IACpC,aAAa,EAAE,CAAC,KAAK,EAAE,WAAW,GAAG,SAAS,KAAK,IAAI,CAAC;CACxD,CAAC;AACF,MAAM,MAAM,mBAAmB,GAAG;IACjC,QAAQ,CAAC,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,oBAAY,YAAY;IACvB,KAAK,UAAU;IACf,IAAI,SAAS;IACb,IAAI,SAAS;CACb;AACD,MAAM,MAAM,YAAY,GAAG,MAAM,OAAO,YAAY,CAAC;AACrD,eAAO,MAAM,aAAa,oBAAoB,CAAC;AAE/C,MAAM,MAAM,WAAW,GAAG;IACzB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACV,CAAC"}