@vkzstudio/muza-ui 1.0.40 → 1.0.41

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 (26) hide show
  1. package/dist/components/Accordion/Accordion.js +26 -26
  2. package/dist/components/Flex/Flex.d.ts +17 -17
  3. package/dist/components/MultiSelect/MultiSelect.d.ts +2 -0
  4. package/dist/components/MultiSelect/MultiSelect.d.ts.map +1 -1
  5. package/dist/components/MultiSelect/MultiSelect.js +96 -84
  6. package/dist/components/MultiSelect/MultiSelect.stories.d.ts +1 -0
  7. package/dist/components/MultiSelect/MultiSelect.stories.d.ts.map +1 -1
  8. package/dist/components/Select/Select.d.ts +2 -0
  9. package/dist/components/Select/Select.d.ts.map +1 -1
  10. package/dist/components/Select/Select.js +80 -70
  11. package/dist/components/Select/Select.stories.d.ts +1 -0
  12. package/dist/components/Select/Select.stories.d.ts.map +1 -1
  13. package/dist/muza-ui.css +1 -1
  14. package/dist/styles/token-colors.css +27 -3
  15. package/dist/styles/token-sizes.css +286 -62
  16. package/dist/translations/locales/cs.d.ts.map +1 -1
  17. package/dist/translations/locales/cs.js +2 -1
  18. package/dist/translations/locales/en.d.ts.map +1 -1
  19. package/dist/translations/locales/en.js +2 -1
  20. package/dist/translations/locales/sk.d.ts.map +1 -1
  21. package/dist/translations/locales/sk.js +2 -1
  22. package/dist/translations/types.d.ts +2 -0
  23. package/dist/translations/types.d.ts.map +1 -1
  24. package/dist/utils/cn.d.ts.map +1 -1
  25. package/dist/utils/cn.js +135 -17
  26. package/package.json +1 -1
package/dist/components/Accordion/Accordion.js CHANGED
@@ -30,21 +30,21 @@ const v = g("relative w-full transition-colors", {
30
30
  variant: {
31
31
  default: "pt-md",
32
32
  branded: "pt-2xl text-text-brand-def",
33
- settings: "p-comp-accordion-settings-p"
33
+ settings: "p-comp-accordion-settings-p pt-comp-accordion-settings-p-top"
34
34
  }
35
35
  },
36
36
  defaultVariants: { variant: "default" }
37
37
  }), y = d.createContext({
38
38
  variant: "default"
39
- }), u = () => d.useContext(y), l = d.createContext({
39
+ }), m = () => d.useContext(y), l = d.createContext({
40
40
  isStatic: !1
41
41
  }), k = () => d.useContext(l), j = ({
42
42
  className: e,
43
- variant: r,
43
+ variant: o,
44
44
  ...a
45
45
  }) => {
46
- const o = r ?? (a.type === "single" ? "branded" : "default");
47
- return /* @__PURE__ */ t(y.Provider, { value: { variant: o }, children: /* @__PURE__ */ t(
46
+ const r = o ?? (a.type === "single" ? "branded" : "default");
47
+ return /* @__PURE__ */ t(y.Provider, { value: { variant: r }, children: /* @__PURE__ */ t(
48
48
  c.Root,
49
49
  {
50
50
  "data-slot": "accordion",
@@ -54,22 +54,22 @@ const v = g("relative w-full transition-colors", {
54
54
  ) });
55
55
  }, R = ({
56
56
  className: e,
57
- children: r,
57
+ children: o,
58
58
  clickableContent: a = !0,
59
- static: o,
59
+ static: r,
60
60
  value: i,
61
61
  disabled: A,
62
- ...m
62
+ ...u
63
63
  }) => {
64
- const { variant: f } = u(), p = d.useRef(null);
65
- return o ? /* @__PURE__ */ t(l.Provider, { value: { isStatic: !0 }, children: /* @__PURE__ */ t(
64
+ const { variant: f } = m(), p = d.useRef(null);
65
+ return r ? /* @__PURE__ */ t(l.Provider, { value: { isStatic: !0 }, children: /* @__PURE__ */ t(
66
66
  "div",
67
67
  {
68
68
  "data-slot": "accordion-item",
69
69
  "data-state": "open",
70
70
  className: n(v({ variant: f }), e),
71
- ...m,
72
- children: r
71
+ ...u,
72
+ children: o
73
73
  }
74
74
  ) }) : /* @__PURE__ */ t(l.Provider, { value: { isStatic: !1 }, children: /* @__PURE__ */ t(
75
75
  c.Item,
@@ -90,48 +90,48 @@ const v = g("relative w-full transition-colors", {
90
90
  );
91
91
  s && !s.contains(C.target) && s.click();
92
92
  } : void 0,
93
- ...m,
94
- children: r
93
+ ...u,
94
+ children: o
95
95
  }
96
96
  ) });
97
97
  }, z = ({
98
98
  className: e,
99
- children: r,
99
+ children: o,
100
100
  ...a
101
101
  }) => {
102
- const { variant: o } = u(), { isStatic: i } = k();
102
+ const { variant: r } = m(), { isStatic: i } = k();
103
103
  return i ? /* @__PURE__ */ t("div", { className: "flex", ...a, children: /* @__PURE__ */ t(
104
104
  "div",
105
105
  {
106
106
  className: n(
107
- x({ variant: o }),
107
+ x({ variant: r }),
108
108
  "cursor-default",
109
109
  e
110
110
  ),
111
- children: r
111
+ children: o
112
112
  }
113
113
  ) }) : /* @__PURE__ */ t(c.Header, { className: "flex", ...a, children: /* @__PURE__ */ w(
114
114
  c.Trigger,
115
115
  {
116
116
  "data-slot": "accordion-trigger",
117
- className: n(x({ variant: o }), e),
117
+ className: n(x({ variant: r }), e),
118
118
  children: [
119
- r,
119
+ o,
120
120
  /* @__PURE__ */ t(N, { className: "size-comp-accordion-ico-size-md shrink-0 text-comp-select-icon-brand-def transition-transform duration-300 group-data-[disabled]:text-icon-dark-tertiary" })
121
121
  ]
122
122
  }
123
123
  ) });
124
124
  }, H = ({
125
125
  className: e,
126
- children: r,
126
+ children: o,
127
127
  ...a
128
128
  }) => {
129
- const { variant: o } = u(), { isStatic: i } = k();
129
+ const { variant: r } = m(), { isStatic: i } = k();
130
130
  return i ? /* @__PURE__ */ t("div", { "data-slot": "accordion-content", ...a, children: /* @__PURE__ */ t(
131
131
  "div",
132
132
  {
133
- className: n(h({ variant: o }), e),
134
- children: r
133
+ className: n(h({ variant: r }), e),
134
+ children: o
135
135
  }
136
136
  ) }) : /* @__PURE__ */ t(
137
137
  c.Content,
@@ -142,8 +142,8 @@ const v = g("relative w-full transition-colors", {
142
142
  children: /* @__PURE__ */ t(
143
143
  "div",
144
144
  {
145
- className: n(h({ variant: o }), e),
146
- children: r
145
+ className: n(h({ variant: r }), e),
146
+ children: o
147
147
  }
148
148
  )
149
149
  }
package/dist/components/Flex/Flex.d.ts CHANGED
@@ -2,23 +2,23 @@ import { VariantProps } from 'class-variance-authority';
2
2
  import { SpacingProps } from '../../utils/spacing';
3
3
  import * as React from 'react';
4
4
  declare const flexVariants: (props?: ({
5
- gap?: "none" | "3xs" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
6
- gapX?: "none" | "3xs" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
7
- gapY?: "none" | "3xs" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
8
- p?: "none" | "3xs" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
9
- px?: "none" | "3xs" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
10
- py?: "none" | "3xs" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
11
- pt?: "none" | "3xs" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
12
- pr?: "none" | "3xs" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
13
- pb?: "none" | "3xs" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
14
- pl?: "none" | "3xs" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
15
- m?: "none" | "3xs" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
16
- mx?: "none" | "3xs" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
17
- my?: "none" | "3xs" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
18
- mt?: "none" | "3xs" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
19
- mr?: "none" | "3xs" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
20
- mb?: "none" | "3xs" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
21
- ml?: "none" | "3xs" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
5
+ gap?: "none" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "3xs" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
6
+ gapX?: "none" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "3xs" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
7
+ gapY?: "none" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "3xs" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
8
+ p?: "none" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "3xs" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
9
+ px?: "none" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "3xs" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
10
+ py?: "none" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "3xs" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
11
+ pt?: "none" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "3xs" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
12
+ pr?: "none" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "3xs" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
13
+ pb?: "none" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "3xs" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
14
+ pl?: "none" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "3xs" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
15
+ m?: "none" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "3xs" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
16
+ mx?: "none" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "3xs" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
17
+ my?: "none" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "3xs" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
18
+ mt?: "none" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "3xs" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
19
+ mr?: "none" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "3xs" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
20
+ mb?: "none" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "3xs" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
21
+ ml?: "none" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "3xs" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | null | undefined;
22
22
  direction?: "row" | "column" | "row-reverse" | "column-reverse" | null | undefined;
23
23
  wrap?: "wrap" | "nowrap" | "wrap-reverse" | null | undefined;
24
24
  justify?: "end" | "start" | "center" | "between" | "around" | "evenly" | "stretch" | null | undefined;
package/dist/components/MultiSelect/MultiSelect.d.ts CHANGED
@@ -19,6 +19,8 @@ export interface IMultiSelectProps {
19
19
  prefix?: ReactNode;
20
20
  /** Placeholder text shown when no options are selected. @default translations.select.placeholder */
21
21
  placeholder?: string;
22
+ /** Text shown inside the dropdown when `options` is empty. @default translations.select.noOptions */
23
+ emptyMessage?: string;
22
24
  /** Controls height and padding. @default 'base' */
23
25
  size?: 'xs' | 'sm' | 'base' | 'lg';
24
26
  /**
package/dist/components/MultiSelect/MultiSelect.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"MultiSelect.d.ts","sourceRoot":"","sources":["../../../src/components/MultiSelect/MultiSelect.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EACZ,KAAK,SAAS,EAMf,MAAM,OAAO,CAAA;AAgBd;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAChC,6CAA6C;IAC7C,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,yFAAyF;IACzF,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,yDAAyD;IACzD,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,+EAA+E;IAC/E,uBAAuB,CAAC,EAAE,OAAO,CAAA;IACjC,+EAA+E;IAC/E,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,4DAA4D;IAC5D,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,oGAAoG;IACpG,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,mDAAmD;IACnD,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,MAAM,GAAG,IAAI,CAAA;IAClC;;;;;;;;;OASG;IACH,OAAO,EAAE,KAAK,CAAC;QACb,KAAK,EAAE,MAAM,CAAA;QACb,KAAK,EAAE,SAAS,CAAA;QAChB,QAAQ,CAAC,EAAE,OAAO,CAAA;QAClB,IAAI,CAAC,EAAE,SAAS,CAAA;KACjB,CAAC,CAAA;IACF,yDAAyD;IACzD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,kGAAkG;IAClG,sBAAsB,CAAC,EAAE,MAAM,CAAA;IAC/B,8DAA8D;IAC9D,KAAK,CAAC,EAAE,MAAM,EAAE,CAAA;IAChB,uFAAuF;IACvF,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAA;IACpC,6EAA6E;IAC7E,UAAU,CAAC,EAAE,SAAS,CAAA;IACtB,gHAAgH;IAChH,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,gHAAgH;IAChH,gBAAgB,CAAC,EAAE,MAAM,CAAA;CAC1B;AAED,eAAO,MAAM,WAAW,6FAiNvB,CAAA"}
1
+ {"version":3,"file":"MultiSelect.d.ts","sourceRoot":"","sources":["../../../src/components/MultiSelect/MultiSelect.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EACZ,KAAK,SAAS,EAMf,MAAM,OAAO,CAAA;AAgBd;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAChC,6CAA6C;IAC7C,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,yFAAyF;IACzF,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,yDAAyD;IACzD,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,+EAA+E;IAC/E,uBAAuB,CAAC,EAAE,OAAO,CAAA;IACjC,+EAA+E;IAC/E,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,4DAA4D;IAC5D,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,oGAAoG;IACpG,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,qGAAqG;IACrG,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,mDAAmD;IACnD,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,MAAM,GAAG,IAAI,CAAA;IAClC;;;;;;;;;OASG;IACH,OAAO,EAAE,KAAK,CAAC;QACb,KAAK,EAAE,MAAM,CAAA;QACb,KAAK,EAAE,SAAS,CAAA;QAChB,QAAQ,CAAC,EAAE,OAAO,CAAA;QAClB,IAAI,CAAC,EAAE,SAAS,CAAA;KACjB,CAAC,CAAA;IACF,yDAAyD;IACzD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,kGAAkG;IAClG,sBAAsB,CAAC,EAAE,MAAM,CAAA;IAC/B,8DAA8D;IAC9D,KAAK,CAAC,EAAE,MAAM,EAAE,CAAA;IAChB,uFAAuF;IACvF,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAA;IACpC,6EAA6E;IAC7E,UAAU,CAAC,EAAE,SAAS,CAAA;IACtB,gHAAgH;IAChH,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,gHAAgH;IAChH,gBAAgB,CAAC,EAAE,MAAM,CAAA;CAC1B;AAED,eAAO,MAAM,WAAW,6FAkOvB,CAAA"}
package/dist/components/MultiSelect/MultiSelect.js CHANGED
@@ -1,47 +1,48 @@
1
- import { jsx as r, jsxs as u } from "react/jsx-runtime";
2
- import f, { forwardRef as P, useId as _, useMemo as T, useRef as B, useEffect as L } from "react";
3
- import { triggerWrapperVariants as U } from "../Select/utils.js";
4
- import { useMuzaTranslations as G } from "../../translations/TranslationContext.js";
5
- import { Tag as p } from "../Tag/Tag.js";
6
- import { FormField as H } from "../FormField/FormField.js";
7
- import { DropdownMenu as J, DropdownMenuTrigger as K, DropdownMenuContent as Q, DropdownMenuCheckboxItem as X } from "../DropdownMenu/DropdownMenu.js";
8
- import { Typography as Y } from "../Typography/Typography.js";
9
- import { Flex as k } from "../Flex/Flex.js";
10
- import { AltArrowUpOutline as Z } from "@solar-icons/react-perf";
11
- import { cn as ee } from "../../utils/cn.js";
12
- const re = P(
13
- (I, h) => {
14
- const z = G(), {
15
- label: g,
16
- hint: x,
17
- error: b,
18
- options: o,
19
- onChange: i,
20
- value: t,
1
+ import { jsx as t, jsxs as p } from "react/jsx-runtime";
2
+ import u, { forwardRef as L, useId as U, useMemo as k, useRef as G, useEffect as H } from "react";
3
+ import { triggerWrapperVariants as J } from "../Select/utils.js";
4
+ import { useMuzaTranslations as K } from "../../translations/TranslationContext.js";
5
+ import { Tag as f } from "../Tag/Tag.js";
6
+ import { FormField as Q } from "../FormField/FormField.js";
7
+ import { DropdownMenu as X, DropdownMenuTrigger as Y, DropdownMenuContent as Z, DropdownMenuCheckboxItem as ee } from "../DropdownMenu/DropdownMenu.js";
8
+ import { Typography as I } from "../Typography/Typography.js";
9
+ import { Flex as z } from "../Flex/Flex.js";
10
+ import { AltArrowUpOutline as te } from "@solar-icons/react-perf";
11
+ import { cn as re } from "../../utils/cn.js";
12
+ const ne = L(
13
+ (D, h) => {
14
+ const g = K(), {
15
+ label: x,
16
+ hint: b,
17
+ error: w,
18
+ options: i,
19
+ onChange: s,
20
+ value: r,
21
21
  disabled: c,
22
22
  prefix: d,
23
- maxNumberOfVisibleTags: a = 2,
24
- size: D,
23
+ maxNumberOfVisibleTags: o = 2,
24
+ size: O,
25
25
  placeholder: S,
26
- required: w,
27
- disableRequiredAsterisk: W,
28
- labelExtra: j,
29
- infoTooltip: A,
30
- collisionPadding: C
31
- } = I, v = S ?? z.select.placeholder, N = _(), F = g ? `${N}-label` : void 0, O = x ? `${N}-hint` : void 0, y = T(() => new Map(o.map((e) => [e.value, e.label])), [o]), q = T(() => {
32
- const e = t && t.map((n) => y.get(n));
33
- return e != null && e.length ? e.length <= a ? /* @__PURE__ */ r(
34
- k,
26
+ emptyMessage: W,
27
+ required: v,
28
+ disableRequiredAsterisk: j,
29
+ labelExtra: A,
30
+ infoTooltip: C,
31
+ collisionPadding: F
32
+ } = D, y = S ?? g.select.placeholder, q = W ?? g.select.noOptions, N = U(), E = x ? `${N}-label` : void 0, P = b ? `${N}-hint` : void 0, M = k(() => new Map(i.map((e) => [e.value, e.label])), [i]), V = k(() => {
33
+ const e = r && r.map((n) => M.get(n));
34
+ return e != null && e.length ? e.length <= o ? /* @__PURE__ */ t(
35
+ z,
35
36
  {
36
37
  gap: "xs",
37
38
  justify: "start",
38
39
  align: "start",
39
40
  flex: 1,
40
41
  className: "min-w-0",
41
- children: e.map((n, s) => /* @__PURE__ */ r(p, { variant: "info", className: "min-w-[50px] shrink-1", children: n }, s))
42
+ children: e.map((n, a) => /* @__PURE__ */ t(f, { variant: "info", className: "min-w-[50px] shrink-1", children: n }, a))
42
43
  }
43
- ) : /* @__PURE__ */ r(
44
- k,
44
+ ) : /* @__PURE__ */ t(
45
+ z,
45
46
  {
46
47
  gap: "xs",
47
48
  justify: "start",
@@ -49,61 +50,61 @@ const re = P(
49
50
  flex: 1,
50
51
  className: "min-w-0",
51
52
  children: [
52
- ...e.slice(0, a).map((n, s) => /* @__PURE__ */ r(
53
- p,
53
+ ...e.slice(0, o).map((n, a) => /* @__PURE__ */ t(
54
+ f,
54
55
  {
55
56
  variant: "info",
56
57
  className: "min-w-[50px] shrink-1 overflow-hidden",
57
- children: /* @__PURE__ */ r("span", { className: "truncate", children: n })
58
+ children: /* @__PURE__ */ t("span", { className: "truncate", children: n })
58
59
  },
59
- s
60
+ a
60
61
  )),
61
- /* @__PURE__ */ u(p, { variant: "info", children: [
62
- e.length - a,
62
+ /* @__PURE__ */ p(f, { variant: "info", children: [
63
+ e.length - o,
63
64
  "+"
64
65
  ] }, "more")
65
66
  ]
66
67
  }
67
- ) : /* @__PURE__ */ r(
68
- Y,
68
+ ) : /* @__PURE__ */ t(
69
+ I,
69
70
  {
70
71
  size: "input",
71
72
  className: "grow-1 fix-y-text truncate text-left text-comp-select-text-placeholder",
72
73
  weight: "regular",
73
74
  component: "span",
74
- children: v
75
+ children: y
75
76
  }
76
77
  );
77
- }, [t, v, a, y]), [M, E] = f.useState(!1), [R, V] = f.useState(0), m = f.useRef(!1), $ = B(null), l = (typeof h == "function" ? null : h) ?? $;
78
- return L(() => {
78
+ }, [r, y, o, M]), [R, $] = u.useState(!1), [T, _] = u.useState(0), m = u.useRef(!1), B = G(null), l = (typeof h == "function" ? null : h) ?? B;
79
+ return H(() => {
79
80
  const e = () => {
80
- l.current && V(l.current.offsetWidth);
81
+ l.current && _(l.current.offsetWidth);
81
82
  };
82
83
  e();
83
84
  const n = new ResizeObserver(e);
84
85
  return l.current && n.observe(l.current), () => {
85
86
  n.disconnect();
86
87
  };
87
- }, [l]), /* @__PURE__ */ r(
88
- H,
88
+ }, [l]), /* @__PURE__ */ t(
89
+ Q,
89
90
  {
90
- label: g,
91
- hint: x,
92
- error: b,
93
- required: w,
94
- disableRequiredAsterisk: W,
95
- labelId: F,
96
- hintId: O,
97
- labelExtra: j,
98
- infoTooltip: A,
99
- children: /* @__PURE__ */ u(
100
- J,
91
+ label: x,
92
+ hint: b,
93
+ error: w,
94
+ required: v,
95
+ disableRequiredAsterisk: j,
96
+ labelId: E,
97
+ hintId: P,
98
+ labelExtra: A,
99
+ infoTooltip: C,
100
+ children: /* @__PURE__ */ p(
101
+ X,
101
102
  {
102
103
  onOpenChange: (e) => {
103
- E(e);
104
+ $(e);
104
105
  },
105
106
  children: [
106
- /* @__PURE__ */ r(K, { disabled: c, asChild: !0, children: /* @__PURE__ */ r(
107
+ /* @__PURE__ */ t(Y, { disabled: c, asChild: !0, children: /* @__PURE__ */ t(
107
108
  "button",
108
109
  {
109
110
  ref: l,
@@ -111,53 +112,64 @@ const re = P(
111
112
  role: "input",
112
113
  tabIndex: 0,
113
114
  disabled: c,
114
- "aria-required": w,
115
- className: U({
116
- size: D,
117
- error: b,
118
- expanded: M,
119
- hasIcon: !!d || (t == null ? void 0 : t.length) === 0
115
+ "aria-required": v,
116
+ className: J({
117
+ size: O,
118
+ error: w,
119
+ expanded: R,
120
+ hasIcon: !!d || (r == null ? void 0 : r.length) === 0
120
121
  }),
121
- children: /* @__PURE__ */ u("div", { className: "flex min-w-0 flex-1 items-center gap-sm", children: [
122
- d && /* @__PURE__ */ r(
122
+ children: /* @__PURE__ */ p("div", { className: "flex min-w-0 flex-1 items-center gap-sm", children: [
123
+ d && /* @__PURE__ */ t(
123
124
  "span",
124
125
  {
125
126
  className: c ? "text-comp-select-icon-disabled" : "text-comp-select-icon-brand-def",
126
127
  children: d
127
128
  }
128
129
  ),
129
- q,
130
- /* @__PURE__ */ r(
131
- Z,
130
+ V,
131
+ /* @__PURE__ */ t(
132
+ te,
132
133
  {
133
- className: ee(
134
+ className: re(
134
135
  "shrink-0 transition-transform duration-200",
135
- M ? "rotate-0" : "rotate-180"
136
+ R ? "rotate-0" : "rotate-180"
136
137
  )
137
138
  }
138
139
  )
139
140
  ] })
140
141
  }
141
142
  ) }),
142
- /* @__PURE__ */ r(
143
- Q,
143
+ /* @__PURE__ */ t(
144
+ Z,
144
145
  {
145
146
  className: "mt-1",
146
147
  style: {
147
- width: R > 0 ? `${R}px` : void 0
148
+ width: T > 0 ? `${T}px` : void 0
148
149
  },
149
150
  onCloseAutoFocus: (e) => {
150
151
  m.current || e.preventDefault(), m.current = !1;
151
152
  },
152
- collisionPadding: C,
153
- children: o.map((e) => /* @__PURE__ */ r(
154
- X,
153
+ collisionPadding: F,
154
+ children: i.length === 0 ? /* @__PURE__ */ t("div", { className: "px-lg py-md", role: "presentation", children: /* @__PURE__ */ t(
155
+ I,
155
156
  {
156
- checked: t == null ? void 0 : t.includes(e.value),
157
+ component: "span",
158
+ size: "input",
159
+ weight: "regular",
160
+ className: "text-comp-select-text-secondary",
161
+ children: q
162
+ }
163
+ ) }) : i.map((e) => /* @__PURE__ */ t(
164
+ ee,
165
+ {
166
+ checked: r == null ? void 0 : r.includes(e.value),
157
167
  disabled: e.disabled,
158
168
  icon: e.icon,
159
169
  onCheckedChange: (n) => {
160
- n ? i == null || i([...t || [], e.value]) : i == null || i((t || []).filter((s) => s !== e.value)), m.current = !0;
170
+ n ? s == null || s([...r || [], e.value]) : s == null || s(
171
+ (r || []).filter((a) => a !== e.value)
172
+ ), m.current = !0;
161
173
  },
162
174
  children: e.label
163
175
  },
@@ -172,7 +184,7 @@ const re = P(
172
184
  );
173
185
  }
174
186
  );
175
- re.displayName = "MultiSelect";
187
+ ne.displayName = "MultiSelect";
176
188
  export {
177
- re as MultiSelect
189
+ ne as MultiSelect
178
190
  };
package/dist/components/MultiSelect/MultiSelect.stories.d.ts CHANGED
@@ -15,4 +15,5 @@ export declare const ManyOptions: Story;
15
15
  export declare const WithLongLabels: Story;
16
16
  export declare const WithIconsInOptions: Story;
17
17
  export declare const WithDisabledOptions: Story;
18
+ export declare const NoOptions: Story;
18
19
  //# sourceMappingURL=MultiSelect.stories.d.ts.map
package/dist/components/MultiSelect/MultiSelect.stories.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"MultiSelect.stories.d.ts","sourceRoot":"","sources":["../../../src/components/MultiSelect/MultiSelect.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAQ3D,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAqB3C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,WAAW,CAsHlC,CAAA;AAED,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAsBlC,eAAO,MAAM,OAAO,EAAE,KAerB,CAAA;AAED,eAAO,MAAM,gBAAgB,EAAE,KAmB9B,CAAA;AAED,eAAO,MAAM,SAAS,EAAE,KAkBvB,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAgBtB,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KA4DtB,CAAA;AAED,eAAO,MAAM,WAAW,EAAE,KAoBzB,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAqB5B,CAAA;AAED,eAAO,MAAM,UAAU,EAAE,KAgBxB,CAAA;AAED,eAAO,MAAM,WAAW,EAAE,KAuBzB,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KA2C5B,CAAA;AAED,eAAO,MAAM,kBAAkB,EAAE,KAoDhC,CAAA;AAED,eAAO,MAAM,mBAAmB,EAAE,KAkCjC,CAAA"}
1
+ {"version":3,"file":"MultiSelect.stories.d.ts","sourceRoot":"","sources":["../../../src/components/MultiSelect/MultiSelect.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAQ3D,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAqB3C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,WAAW,CA4HlC,CAAA;AAED,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAsBlC,eAAO,MAAM,OAAO,EAAE,KAerB,CAAA;AAED,eAAO,MAAM,gBAAgB,EAAE,KAmB9B,CAAA;AAED,eAAO,MAAM,SAAS,EAAE,KAkBvB,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAgBtB,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KA4DtB,CAAA;AAED,eAAO,MAAM,WAAW,EAAE,KAoBzB,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAqB5B,CAAA;AAED,eAAO,MAAM,UAAU,EAAE,KAgBxB,CAAA;AAED,eAAO,MAAM,WAAW,EAAE,KAuBzB,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KA2C5B,CAAA;AAED,eAAO,MAAM,kBAAkB,EAAE,KAoDhC,CAAA;AAED,eAAO,MAAM,mBAAmB,EAAE,KAkCjC,CAAA;AAED,eAAO,MAAM,SAAS,EAAE,KAqBvB,CAAA"}
package/dist/components/Select/Select.d.ts CHANGED
@@ -17,6 +17,8 @@ export interface ISelectProps {
17
17
  prefix?: ReactNode;
18
18
  /** Text shown when no option is selected. @default translations.select.placeholder */
19
19
  placeholder?: string;
20
+ /** Text shown inside the dropdown when `options` is empty. @default translations.select.noOptions */
21
+ emptyMessage?: string;
20
22
  /** Controls trigger height and padding. @default 'base' */
21
23
  size?: 'xs' | 'sm' | 'base' | 'lg';
22
24
  /**
package/dist/components/Select/Select.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../src/components/Select/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EACZ,KAAK,SAAS,EAMf,MAAM,OAAO,CAAA;AAed,uDAAuD;AACvD,MAAM,WAAW,YAAY;IAC3B,qDAAqD;IACrD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,2FAA2F;IAC3F,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,gFAAgF;IAChF,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,mCAAmC;IACnC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,+EAA+E;IAC/E,uBAAuB,CAAC,EAAE,OAAO,CAAA;IACjC,kDAAkD;IAClD,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,2DAA2D;IAC3D,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,sFAAsF;IACtF,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,2DAA2D;IAC3D,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,MAAM,GAAG,IAAI,CAAA;IAClC;;;;;;;;;;OAUG;IACH,OAAO,EAAE,KAAK,CAAC;QACb,KAAK,EAAE,MAAM,CAAA;QACb,KAAK,EAAE,SAAS,CAAA;QAChB,QAAQ,CAAC,EAAE,OAAO,CAAA;QAClB,IAAI,CAAC,EAAE,SAAS,CAAA;KACjB,CAAC,CAAA;IACF,wEAAwE;IACxE,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,6CAA6C;IAC7C,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,4EAA4E;IAC5E,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAClC,8EAA8E;IAC9E,4BAA4B,CAAC,EAAE,OAAO,CAAA;IACtC,gHAAgH;IAChH,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,6EAA6E;IAC7E,UAAU,CAAC,EAAE,SAAS,CAAA;IACtB,gHAAgH;IAChH,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB;AAED,eAAO,MAAM,MAAM,wFA0LlB,CAAA"}
1
+ {"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../src/components/Select/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EACZ,KAAK,SAAS,EAMf,MAAM,OAAO,CAAA;AAed,uDAAuD;AACvD,MAAM,WAAW,YAAY;IAC3B,qDAAqD;IACrD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,2FAA2F;IAC3F,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,gFAAgF;IAChF,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,mCAAmC;IACnC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,+EAA+E;IAC/E,uBAAuB,CAAC,EAAE,OAAO,CAAA;IACjC,kDAAkD;IAClD,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,2DAA2D;IAC3D,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,sFAAsF;IACtF,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,qGAAqG;IACrG,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,2DAA2D;IAC3D,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,MAAM,GAAG,IAAI,CAAA;IAClC;;;;;;;;;;OAUG;IACH,OAAO,EAAE,KAAK,CAAC;QACb,KAAK,EAAE,MAAM,CAAA;QACb,KAAK,EAAE,SAAS,CAAA;QAChB,QAAQ,CAAC,EAAE,OAAO,CAAA;QAClB,IAAI,CAAC,EAAE,SAAS,CAAA;KACjB,CAAC,CAAA;IACF,wEAAwE;IACxE,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,6CAA6C;IAC7C,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,4EAA4E;IAC5E,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAClC,8EAA8E;IAC9E,4BAA4B,CAAC,EAAE,OAAO,CAAA;IACtC,gHAAgH;IAChH,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,6EAA6E;IAC7E,UAAU,CAAC,EAAE,SAAS,CAAA;IACtB,gHAAgH;IAChH,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB;AAED,eAAO,MAAM,MAAM,wFAyMlB,CAAA"}