mainstack-design-system 1.17.2 → 1.17.4
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.
- package/dist/mainstack-design-system477.cjs +1 -1
- package/dist/mainstack-design-system477.js +28 -28
- package/dist/mainstack-design-system478.cjs +1 -1
- package/dist/mainstack-design-system478.js +10 -10
- package/dist/mainstack-design-system479.cjs +1 -1
- package/dist/mainstack-design-system479.js +21 -18
- package/package.json +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
2
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),m=require("./index-C8aODXfJ.cjs"),D=require("./index-4R9KShCu.cjs"),n=require("react"),I=require("./mainstack-design-system606.cjs"),y=require("./mainstack-design-system607.cjs"),b=n.forwardRef(({isDisabled:x,isError:C,isMultiSelect:s=!1,isSuccess:d,children:h,value:e,defaultValue:p,inputReadOnly:j,isCreatableSelect:q,options:u=[],isOptionOpen:A,onOptionOpenChange:P,onValueChange:f,onOptionSelect:R},r)=>{const O=n.useRef(null),[t,_]=n.useState(y.parseSelectOptions(u)),[i,v]=m.useControllableState({prop:e,defaultProp:y.mapDefaultValuesToSelectedOption({isMultiSelect:s,defaultValue:p,options:u}),onChange:f}),[E,l]=n.useState(()=>typeof e=="string"?t.map.get(e)?.label||"":typeof p=="string"&&t.map.get(p)?.label||""),[c,g]=m.useControllableState({prop:A,defaultProp:!1,onChange:P}),[T,S]=n.useState("idle");return n.useEffect(()=>{s||Array.isArray(e)||l(t.map.get(e)?.label||"")},[s,t.map,e]),a.jsx(I.SelectContext.Provider,{value:{defaultValue:p,options:t,selectedOption:i,isOptionOpen:c,isDisabled:x,isError:C,isMultiSelect:s,isSuccess:d,inputValue:E,inputReadOnly:j,previousAction:T,isCreatableSelect:q,rootElementRef:O,setOptions:_,setPreviousAction:S,setInputValue:l,setSelectedOption:v,onOptionOpenChange:g,onValueChange:f,onOptionSelect:R},children:a.jsx(D.Popover,{open:c,onOpenChange:o=>{console.log("open",o,c),g(c),i&&!Array.isArray(i)&&!o&&(l(t.map.get(i)?.label||""),S("selection"))},children:a.jsx("div",{ref:o=>{O.current=o,typeof r=="function"?r(o):typeof r=="object"&&r?.current&&(r.current=o)},"data-slot":"select-root",children:h})})})});b.displayName="SelectRoot";exports.SelectRoot=b;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import { jsx as
|
|
2
|
+
import { jsx as c } from "react/jsx-runtime";
|
|
3
3
|
import { u as y } from "./index-437EL2iq.js";
|
|
4
4
|
import { P as I } from "./index-RoCFhqzC.js";
|
|
5
|
-
import { forwardRef as N, useRef as T, useState as
|
|
5
|
+
import { forwardRef as N, useRef as T, useState as a, useEffect as k } from "react";
|
|
6
6
|
import { SelectContext as q } from "./mainstack-design-system606.js";
|
|
7
7
|
import { parseSelectOptions as z, mapDefaultValuesToSelectedOption as B } from "./mainstack-design-system607.js";
|
|
8
8
|
const F = N(
|
|
@@ -12,41 +12,41 @@ const F = N(
|
|
|
12
12
|
isMultiSelect: r = !1,
|
|
13
13
|
isSuccess: A,
|
|
14
14
|
children: C,
|
|
15
|
-
value:
|
|
15
|
+
value: o,
|
|
16
16
|
defaultValue: p,
|
|
17
17
|
inputReadOnly: P,
|
|
18
18
|
isCreatableSelect: S,
|
|
19
|
-
options:
|
|
19
|
+
options: m = [],
|
|
20
20
|
isOptionOpen: x,
|
|
21
21
|
onOptionOpenChange: d,
|
|
22
|
-
onValueChange:
|
|
22
|
+
onValueChange: f,
|
|
23
23
|
onOptionSelect: j
|
|
24
24
|
}, n) => {
|
|
25
|
-
const
|
|
26
|
-
z(
|
|
27
|
-
), [
|
|
28
|
-
prop:
|
|
25
|
+
const O = T(null), [t, E] = a(
|
|
26
|
+
z(m)
|
|
27
|
+
), [s, R] = y({
|
|
28
|
+
prop: o,
|
|
29
29
|
defaultProp: B({
|
|
30
30
|
isMultiSelect: r,
|
|
31
31
|
defaultValue: p,
|
|
32
|
-
options:
|
|
32
|
+
options: m
|
|
33
33
|
}),
|
|
34
|
-
onChange:
|
|
35
|
-
}), [v,
|
|
34
|
+
onChange: f
|
|
35
|
+
}), [v, l] = a(() => typeof o == "string" ? t.map.get(o)?.label || "" : typeof p == "string" && t.map.get(p)?.label || ""), [i, g] = y({
|
|
36
36
|
prop: x,
|
|
37
37
|
defaultProp: !1,
|
|
38
38
|
onChange: d
|
|
39
|
-
}), [D,
|
|
39
|
+
}), [D, u] = a("idle");
|
|
40
40
|
return k(() => {
|
|
41
|
-
r || Array.isArray(
|
|
42
|
-
}, [r,
|
|
41
|
+
r || Array.isArray(o) || l(t.map.get(o)?.label || "");
|
|
42
|
+
}, [r, t.map, o]), /* @__PURE__ */ c(
|
|
43
43
|
q.Provider,
|
|
44
44
|
{
|
|
45
45
|
value: {
|
|
46
46
|
defaultValue: p,
|
|
47
|
-
options:
|
|
48
|
-
selectedOption:
|
|
49
|
-
isOptionOpen:
|
|
47
|
+
options: t,
|
|
48
|
+
selectedOption: s,
|
|
49
|
+
isOptionOpen: i,
|
|
50
50
|
isDisabled: b,
|
|
51
51
|
isError: h,
|
|
52
52
|
isMultiSelect: r,
|
|
@@ -55,27 +55,27 @@ const F = N(
|
|
|
55
55
|
inputReadOnly: P,
|
|
56
56
|
previousAction: D,
|
|
57
57
|
isCreatableSelect: S,
|
|
58
|
-
rootElementRef:
|
|
58
|
+
rootElementRef: O,
|
|
59
59
|
setOptions: E,
|
|
60
|
-
setPreviousAction:
|
|
61
|
-
setInputValue:
|
|
60
|
+
setPreviousAction: u,
|
|
61
|
+
setInputValue: l,
|
|
62
62
|
setSelectedOption: R,
|
|
63
|
-
onOptionOpenChange:
|
|
64
|
-
onValueChange:
|
|
63
|
+
onOptionOpenChange: g,
|
|
64
|
+
onValueChange: f,
|
|
65
65
|
onOptionSelect: j
|
|
66
66
|
},
|
|
67
|
-
children: /* @__PURE__ */
|
|
67
|
+
children: /* @__PURE__ */ c(
|
|
68
68
|
I,
|
|
69
69
|
{
|
|
70
|
-
open:
|
|
70
|
+
open: i,
|
|
71
71
|
onOpenChange: (e) => {
|
|
72
|
-
|
|
72
|
+
console.log("open", e, i), g(i), s && !Array.isArray(s) && !e && (l(t.map.get(s)?.label || ""), u("selection"));
|
|
73
73
|
},
|
|
74
|
-
children: /* @__PURE__ */
|
|
74
|
+
children: /* @__PURE__ */ c(
|
|
75
75
|
"div",
|
|
76
76
|
{
|
|
77
77
|
ref: (e) => {
|
|
78
|
-
|
|
78
|
+
O.current = e, typeof n == "function" ? n(e) : typeof n == "object" && n?.current && (n.current = e);
|
|
79
79
|
},
|
|
80
80
|
"data-slot": "select-root",
|
|
81
81
|
children: C
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),g=require("react"),j=require("./mainstack-design-system450.cjs"),O=require("./mainstack-design-system451.cjs");require("./mainstack-design-system449.cjs");require("./mainstack-design-system366.cjs");const v=require("./mainstack-design-system93.cjs"),N=require("./mainstack-design-system196.cjs");require("./player-CocaNyQC.cjs");const o=require("./utils-s-0cOrOT.cjs"),R=require("./mainstack-design-system606.cjs"),w=require("./index-4R9KShCu.cjs"),d=g.forwardRef(({onClick:
|
|
2
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),g=require("react"),j=require("./mainstack-design-system450.cjs"),O=require("./mainstack-design-system451.cjs");require("./mainstack-design-system449.cjs");require("./mainstack-design-system366.cjs");const v=require("./mainstack-design-system93.cjs"),N=require("./mainstack-design-system196.cjs");require("./player-CocaNyQC.cjs");const o=require("./utils-s-0cOrOT.cjs"),R=require("./mainstack-design-system606.cjs"),w=require("./index-4R9KShCu.cjs"),d=g.forwardRef(({onClick:i,children:u,className:p,onChange:r,...a},m)=>{const{isOptionOpen:s,inputValue:x,inputReadOnly:c,isDisabled:f,isError:I,isSuccess:h,selectedOption:l,isMultiSelect:n,setSelectedOption:q,setPreviousAction:_,setInputValue:b,onOptionOpenChange:y}=R.useSelectContext();return e.jsx(w.PopoverAnchor,{role:"combobox","aria-haspopup":"listbox","aria-expanded":s,"aria-controls":"select-portal","aria-owns":"select-portal",children:e.jsxs(j.InputRoot,{className:o.cn(n&&"mds:h-auto mds:py-10 ",p),children:[e.jsxs("div",{className:o.cn("mds:flex mds:flex-1 mds:h-auto mds:min-h-auto mds:items-center mds:flex-wrap mds:gap-6"),children:[u,e.jsx(O.InputField,{...a,readOnly:c,"data-slot":"select-input-field","data-select-options-opened":s,tabIndex:3,value:x,isError:I,isSuccess:h,disabled:f,className:o.cn(n&&"mds:h-auto mds:min-h-auto"),onChange:t=>{r&&r(t),_("typing"),b(t.currentTarget.value)},onClick:t=>{i&&i(t);const S=t.currentTarget;y(!s),c||S.focus()},ref:m,...a})]}),e.jsxs("div",{className:"mds:flex mds:items-center mds:gap-6",children:[n&&Array.isArray(l)&&l.length>0&&e.jsx(v,{role:"button",variant:"filled",className:"mds:size-20 mds:cursor-pointer mds:text-secondary",onClick:()=>{q([])}}),e.jsx(N,{"data-select-options-opened":s,className:"mds:size-16 mds:transition-transform mds:transition-1000 mds:data-[select-options-opened=true]:rotate-180"})]})]})})});d.displayName="SelectInputField";exports.SelectInputField=d;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import { jsx as
|
|
2
|
+
import { jsx as o, jsxs as r } from "react/jsx-runtime";
|
|
3
3
|
import { forwardRef as N } from "react";
|
|
4
4
|
import { InputRoot as S } from "./mainstack-design-system450.js";
|
|
5
5
|
import { InputField as w } from "./mainstack-design-system451.js";
|
|
@@ -14,7 +14,7 @@ import { d as R } from "./index-RoCFhqzC.js";
|
|
|
14
14
|
const j = N(
|
|
15
15
|
({ onClick: a, children: p, className: c, onChange: n, ...d }, u) => {
|
|
16
16
|
const {
|
|
17
|
-
isOptionOpen:
|
|
17
|
+
isOptionOpen: t,
|
|
18
18
|
inputValue: f,
|
|
19
19
|
inputReadOnly: m,
|
|
20
20
|
isDisabled: h,
|
|
@@ -27,12 +27,12 @@ const j = N(
|
|
|
27
27
|
setInputValue: O,
|
|
28
28
|
onOptionOpenChange: g
|
|
29
29
|
} = F();
|
|
30
|
-
return /* @__PURE__ */
|
|
30
|
+
return /* @__PURE__ */ o(
|
|
31
31
|
R,
|
|
32
32
|
{
|
|
33
33
|
role: "combobox",
|
|
34
34
|
"aria-haspopup": "listbox",
|
|
35
|
-
"aria-expanded":
|
|
35
|
+
"aria-expanded": t,
|
|
36
36
|
"aria-controls": "select-portal",
|
|
37
37
|
"aria-owns": "select-portal",
|
|
38
38
|
children: /* @__PURE__ */ r(
|
|
@@ -48,13 +48,13 @@ const j = N(
|
|
|
48
48
|
),
|
|
49
49
|
children: [
|
|
50
50
|
p,
|
|
51
|
-
/* @__PURE__ */
|
|
51
|
+
/* @__PURE__ */ o(
|
|
52
52
|
w,
|
|
53
53
|
{
|
|
54
54
|
...d,
|
|
55
55
|
readOnly: m,
|
|
56
56
|
"data-slot": "select-input-field",
|
|
57
|
-
"data-select-options-opened":
|
|
57
|
+
"data-select-options-opened": t,
|
|
58
58
|
tabIndex: 3,
|
|
59
59
|
value: f,
|
|
60
60
|
isError: x,
|
|
@@ -67,7 +67,7 @@ const j = N(
|
|
|
67
67
|
onClick: (e) => {
|
|
68
68
|
a && a(e);
|
|
69
69
|
const v = e.currentTarget;
|
|
70
|
-
g(!
|
|
70
|
+
g(!t), m || v.focus();
|
|
71
71
|
},
|
|
72
72
|
ref: u,
|
|
73
73
|
...d
|
|
@@ -77,7 +77,7 @@ const j = N(
|
|
|
77
77
|
}
|
|
78
78
|
),
|
|
79
79
|
/* @__PURE__ */ r("div", { className: "mds:flex mds:items-center mds:gap-6", children: [
|
|
80
|
-
s && Array.isArray(l) && l.length > 0 && /* @__PURE__ */
|
|
80
|
+
s && Array.isArray(l) && l.length > 0 && /* @__PURE__ */ o(
|
|
81
81
|
A,
|
|
82
82
|
{
|
|
83
83
|
role: "button",
|
|
@@ -88,10 +88,10 @@ const j = N(
|
|
|
88
88
|
}
|
|
89
89
|
}
|
|
90
90
|
),
|
|
91
|
-
/* @__PURE__ */
|
|
91
|
+
/* @__PURE__ */ o(
|
|
92
92
|
C,
|
|
93
93
|
{
|
|
94
|
-
"data-select-options-opened":
|
|
94
|
+
"data-select-options-opened": t,
|
|
95
95
|
className: "mds:size-16 mds:transition-transform mds:transition-1000 mds:data-[select-options-opened=true]:rotate-180"
|
|
96
96
|
}
|
|
97
97
|
)
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),r=require("./index-4R9KShCu.cjs"),
|
|
2
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),r=require("./index-4R9KShCu.cjs"),u=require("react"),m=require("./utils-s-0cOrOT.cjs"),f=require("./mainstack-design-system606.cjs"),a=u.forwardRef(({children:i,onWheel:t,onTouchMove:o,className:c,...l},d)=>{const{isOptionOpen:n,onOptionOpenChange:p}=f.useSelectContext();return s.jsx(r.PopoverPortal,{forceMount:!0,children:s.jsx(r.PopoverContent,{"data-slot":"select-portal",role:"listbox",sideOffset:6,"data-select-options-opened":n,className:m.cn(" mds:hidden mds:will-change-transform mds:z-100 mds:data-[state=open]:animate-content-fade-in mds:animate-content-fade-out mds:w-(--radix-popover-trigger-width) ",n&&"mds:block",c),ref:d,onInteractOutside:()=>{p(!1)},onWheel:e=>{e.stopPropagation(),t&&t(e)},onTouchMove:e=>{e.stopPropagation(),o&&o(e)},...l,children:i})})});a.displayName="SelectPortal";exports.SelectPortal=a;
|
|
@@ -1,25 +1,28 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import { jsx as
|
|
3
|
-
import { b as
|
|
4
|
-
import { forwardRef as
|
|
5
|
-
import { c } from "./utils-Z5JtG_Bc.js";
|
|
6
|
-
import { useSelectContext as
|
|
7
|
-
const
|
|
8
|
-
({ children:
|
|
9
|
-
const { isOptionOpen:
|
|
10
|
-
return /* @__PURE__ */
|
|
11
|
-
|
|
2
|
+
import { jsx as r } from "react/jsx-runtime";
|
|
3
|
+
import { b as m, c as l } from "./index-RoCFhqzC.js";
|
|
4
|
+
import { forwardRef as c } from "react";
|
|
5
|
+
import { c as f } from "./utils-Z5JtG_Bc.js";
|
|
6
|
+
import { useSelectContext as P } from "./mainstack-design-system606.js";
|
|
7
|
+
const g = c(
|
|
8
|
+
({ children: n, onWheel: o, onTouchMove: e, className: s, ...i }, p) => {
|
|
9
|
+
const { isOptionOpen: a, onOptionOpenChange: d } = P();
|
|
10
|
+
return /* @__PURE__ */ r(m, { forceMount: !0, children: /* @__PURE__ */ r(
|
|
11
|
+
l,
|
|
12
12
|
{
|
|
13
13
|
"data-slot": "select-portal",
|
|
14
14
|
role: "listbox",
|
|
15
15
|
sideOffset: 6,
|
|
16
|
-
"data-select-options-opened":
|
|
17
|
-
className:
|
|
16
|
+
"data-select-options-opened": a,
|
|
17
|
+
className: f(
|
|
18
18
|
" mds:hidden mds:will-change-transform mds:z-100 mds:data-[state=open]:animate-content-fade-in mds:animate-content-fade-out mds:w-(--radix-popover-trigger-width) ",
|
|
19
|
-
|
|
20
|
-
|
|
19
|
+
a && "mds:block",
|
|
20
|
+
s
|
|
21
21
|
),
|
|
22
|
-
ref:
|
|
22
|
+
ref: p,
|
|
23
|
+
onInteractOutside: () => {
|
|
24
|
+
d(!1);
|
|
25
|
+
},
|
|
23
26
|
onWheel: (t) => {
|
|
24
27
|
t.stopPropagation(), o && o(t);
|
|
25
28
|
},
|
|
@@ -27,12 +30,12 @@ const P = l(
|
|
|
27
30
|
t.stopPropagation(), e && e(t);
|
|
28
31
|
},
|
|
29
32
|
...i,
|
|
30
|
-
children:
|
|
33
|
+
children: n
|
|
31
34
|
}
|
|
32
35
|
) });
|
|
33
36
|
}
|
|
34
37
|
);
|
|
35
|
-
|
|
38
|
+
g.displayName = "SelectPortal";
|
|
36
39
|
export {
|
|
37
|
-
|
|
40
|
+
g as SelectPortal
|
|
38
41
|
};
|