@solibo/solibo-ui 1.0.10 → 1.0.12
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/assets/index10.css +1 -1
- package/dist/assets/index12.css +1 -1
- package/dist/assets/index15.css +1 -1
- package/dist/assets/index17.css +1 -1
- package/dist/assets/index20.css +1 -1
- package/dist/assets/index26.css +1 -1
- package/dist/assets/index28.css +1 -1
- package/dist/assets/index34.css +1 -1
- package/dist/assets/index36.css +1 -1
- package/dist/assets/index38.css +1 -1
- package/dist/assets/index39.css +1 -1
- package/dist/assets/index4.css +1 -1
- package/dist/assets/index41.css +1 -1
- package/dist/assets/index47.css +1 -1
- package/dist/assets/index9.css +1 -1
- package/dist/components/aside/index.cjs +1 -1
- package/dist/components/aside/index.js +18 -18
- package/dist/components/badge/index.cjs +1 -1
- package/dist/components/badge/index.js +37 -37
- package/dist/components/checkbox/index.cjs +1 -1
- package/dist/components/checkbox/index.cjs.map +1 -1
- package/dist/components/checkbox/index.js +1 -1
- package/dist/components/checkbox/index.js.map +1 -1
- package/dist/components/chip/index.cjs +1 -1
- package/dist/components/chip/index.js +7 -7
- package/dist/components/controls/index.cjs +1 -1
- package/dist/components/controls/index.cjs.map +1 -1
- package/dist/components/controls/index.js +20 -20
- package/dist/components/controls/index.js.map +1 -1
- package/dist/components/dialog/index.cjs +1 -1
- package/dist/components/dialog/index.js +38 -38
- package/dist/components/dropdown/index.cjs +1 -1
- package/dist/components/dropdown/index.js +65 -65
- package/dist/components/editor/index.cjs +16 -16
- package/dist/components/editor/index.cjs.map +1 -1
- package/dist/components/editor/index.js +4 -4
- package/dist/components/header/index.cjs +1 -1
- package/dist/components/header/index.js +9 -9
- package/dist/components/icon/index.cjs +1 -1
- package/dist/components/icon/index.js +1 -1
- package/dist/components/input/index.cjs +1 -1
- package/dist/components/input/index.js +2 -2
- package/dist/components/menu/index.cjs +1 -1
- package/dist/components/menu/index.cjs.map +1 -1
- package/dist/components/menu/index.js +67 -59
- package/dist/components/menu/index.js.map +1 -1
- package/dist/components/message/index.cjs +1 -1
- package/dist/components/message/index.js +21 -21
- package/dist/components/nav/index.cjs +1 -1
- package/dist/components/nav/index.js +19 -19
- package/dist/components/popover/index.cjs +1 -1
- package/dist/components/popover/index.cjs.map +1 -1
- package/dist/components/popover/index.js +78 -79
- package/dist/components/popover/index.js.map +1 -1
- package/dist/components/portal/index.cjs +1 -1
- package/dist/components/portal/index.js +15 -15
- package/dist/components/search/index.cjs +1 -1
- package/dist/components/search/index.cjs.map +1 -1
- package/dist/components/search/index.js +75 -45
- package/dist/components/search/index.js.map +1 -1
- package/dist/components/select/index.cjs +1 -1
- package/dist/components/select/index.js +2 -2
- package/dist/components/toasts/index.cjs +1 -1
- package/dist/components/toasts/index.js +4 -4
- package/dist/{icons-BFgf_lJN.js → icons-BIi_mYLy.js} +4 -1
- package/dist/icons-BIi_mYLy.js.map +1 -0
- package/dist/icons-CR-eUx2p.cjs +2 -0
- package/dist/icons-CR-eUx2p.cjs.map +1 -0
- package/dist/index-CWD8Jp0A.cjs +2 -0
- package/dist/{index-CEzqxRIu.cjs.map → index-CWD8Jp0A.cjs.map} +1 -1
- package/dist/{index-C_YiNpZP.js → index-Clex8VE6.js} +2 -2
- package/dist/{index-C_YiNpZP.js.map → index-Clex8VE6.js.map} +1 -1
- package/dist/{index-BPIK2dxs.cjs → index-DVXi-Ryi.cjs} +2 -2
- package/dist/{index-BPIK2dxs.cjs.map → index-DVXi-Ryi.cjs.map} +1 -1
- package/dist/index-yIe5PqD1.js +73 -0
- package/dist/{index-BHgGZxsR.js.map → index-yIe5PqD1.js.map} +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.d.ts +35 -12
- package/dist/index.js +2 -2
- package/dist/tokens.json +1 -1
- package/package.json +1 -1
- package/dist/icons-BFgf_lJN.js.map +0 -1
- package/dist/icons-Dx0NQYLH.cjs +0 -2
- package/dist/icons-Dx0NQYLH.cjs.map +0 -1
- package/dist/index-BHgGZxsR.js +0 -73
- package/dist/index-CEzqxRIu.cjs +0 -2
|
@@ -1,45 +1,45 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import { t as
|
|
1
|
+
import { jsxs as f, jsx as m } from "react/jsx-runtime";
|
|
2
|
+
import { t as p } from "../../classix-DG18itHa.js";
|
|
3
3
|
import { Children as u, isValidElement as _, cloneElement as x } from "react";
|
|
4
4
|
import { Button as y } from "../button/index.js";
|
|
5
|
-
import '../../assets/index36.css';const k = "
|
|
5
|
+
import '../../assets/index36.css';const k = "_controls_j1dk0_13", j = "_inline_j1dk0_35", h = "_fixed_j1dk0_40", o = {
|
|
6
6
|
controls: k,
|
|
7
|
-
default: "
|
|
8
|
-
inline:
|
|
9
|
-
fixed:
|
|
10
|
-
},
|
|
7
|
+
default: "_default_j1dk0_20",
|
|
8
|
+
inline: j,
|
|
9
|
+
fixed: h
|
|
10
|
+
}, B = {
|
|
11
11
|
primary: 3,
|
|
12
12
|
danger: 2,
|
|
13
13
|
secondary: 1,
|
|
14
14
|
tertiary: 0,
|
|
15
15
|
simple: 0
|
|
16
|
-
},
|
|
16
|
+
}, g = {
|
|
17
17
|
default: o.default,
|
|
18
18
|
fixed: o.fixed,
|
|
19
19
|
inline: o.inline
|
|
20
|
-
},
|
|
20
|
+
}, v = (e) => B[e.props.variant ?? "secondary"], N = ({
|
|
21
21
|
children: e,
|
|
22
|
-
className:
|
|
23
|
-
variant:
|
|
24
|
-
...
|
|
22
|
+
className: d,
|
|
23
|
+
variant: s = "default",
|
|
24
|
+
...l
|
|
25
25
|
}) => {
|
|
26
|
-
const
|
|
27
|
-
|
|
28
|
-
_(n) && n.type === y ?
|
|
26
|
+
const i = u.toArray(e), a = [], r = [];
|
|
27
|
+
i.forEach((n) => {
|
|
28
|
+
_(n) && n.type === y ? a.push(n) : r.push(n);
|
|
29
29
|
});
|
|
30
|
-
const
|
|
30
|
+
const c = a.map((n, t) => ({
|
|
31
31
|
button: n,
|
|
32
32
|
index: t,
|
|
33
|
-
rank:
|
|
33
|
+
rank: v(n)
|
|
34
34
|
})).sort((n, t) => n.rank - t.rank || n.index - t.index).map(({
|
|
35
35
|
button: n,
|
|
36
36
|
index: t
|
|
37
37
|
}) => x(n, {
|
|
38
38
|
key: n.key ?? t
|
|
39
39
|
}));
|
|
40
|
-
return
|
|
41
|
-
r && /* @__PURE__ */
|
|
42
|
-
|
|
40
|
+
return i.length === 0 ? null : /* @__PURE__ */ f("div", { "data-dynamic-position": s === "fixed" ? !0 : void 0, className: p(o.controls, g[s], d), ...l, "data-component": "controls", children: [
|
|
41
|
+
r && /* @__PURE__ */ m("span", { children: r }),
|
|
42
|
+
c
|
|
43
43
|
] });
|
|
44
44
|
};
|
|
45
45
|
export {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../src/components/controls/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport { Children, cloneElement, isValidElement } from 'react';\n\nimport { Button, type ButtonProps } from '../button';\nimport styles from './styles.module.css';\n\nconst buttonVariantOrder = {\n primary: 3,\n danger: 2,\n secondary: 1,\n tertiary: 0,\n simple: 0,\n} satisfies Record<NonNullable<ButtonProps['variant']>, number>;\n\nconst variants = {\n default: styles.default,\n fixed: styles.fixed,\n inline: styles.inline,\n};\n\nexport type ControlsProps = React.HTMLAttributes<HTMLDivElement> & {\n children?: React.ReactNode;\n variant?: keyof typeof variants;\n};\n\nconst getButtonRank = (button: React.ReactElement<ButtonProps>) =>\n buttonVariantOrder[button.props.variant ?? 'secondary'];\n\nexport const Controls = ({ children, className, variant = 'default', ...props }: ControlsProps) => {\n const childArray = Children.toArray(children);\n const buttons: React.ReactElement<ButtonProps>[] = [];\n const nonButtons: React.ReactNode[] = [];\n\n childArray.forEach((child) => {\n if (isValidElement<ButtonProps>(child) && child.type === Button) {\n buttons.push(child);\n } else {\n nonButtons.push(child);\n }\n });\n\n const sortedButtons = buttons\n .map((button, index) => ({ button, index, rank: getButtonRank(button) }))\n .sort((a, b) => a.rank - b.rank || a.index - b.index)\n .map(({ button, index }) =>\n cloneElement(button, {\n key: button.key ?? index,\n })\n );\n\n if (childArray.length === 0) {\n return null;\n }\n\n return (\n <div\n className={cx(styles.controls, variants[variant], className)}\n {...props}\n >\n {nonButtons && <span>{nonButtons}</span>}\n {sortedButtons}\n </div>\n );\n};\n"],"names":["buttonVariantOrder","primary","danger","secondary","tertiary","simple","variants","default","styles","fixed","inline","getButtonRank","button","props","variant","Controls","children","className","childArray","Children","toArray","buttons","nonButtons","forEach","child","isValidElement","type","Button","push","sortedButtons","map","index","rank","sort","a","b","cloneElement","key","length","
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/components/controls/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport { Children, cloneElement, isValidElement } from 'react';\n\nimport { Button, type ButtonProps } from '../button';\nimport styles from './styles.module.css';\n\nconst buttonVariantOrder = {\n primary: 3,\n danger: 2,\n secondary: 1,\n tertiary: 0,\n simple: 0,\n} satisfies Record<NonNullable<ButtonProps['variant']>, number>;\n\nconst variants = {\n default: styles.default,\n fixed: styles.fixed,\n inline: styles.inline,\n};\n\nexport type ControlsProps = React.HTMLAttributes<HTMLDivElement> & {\n children?: React.ReactNode;\n variant?: keyof typeof variants;\n};\n\nconst getButtonRank = (button: React.ReactElement<ButtonProps>) =>\n buttonVariantOrder[button.props.variant ?? 'secondary'];\n\nexport const Controls = ({ children, className, variant = 'default', ...props }: ControlsProps) => {\n const childArray = Children.toArray(children);\n const buttons: React.ReactElement<ButtonProps>[] = [];\n const nonButtons: React.ReactNode[] = [];\n\n childArray.forEach((child) => {\n if (isValidElement<ButtonProps>(child) && child.type === Button) {\n buttons.push(child);\n } else {\n nonButtons.push(child);\n }\n });\n\n const sortedButtons = buttons\n .map((button, index) => ({ button, index, rank: getButtonRank(button) }))\n .sort((a, b) => a.rank - b.rank || a.index - b.index)\n .map(({ button, index }) =>\n cloneElement(button, {\n key: button.key ?? index,\n })\n );\n\n if (childArray.length === 0) {\n return null;\n }\n\n return (\n <div\n data-dynamic-position={variant === 'fixed' ? true : undefined}\n className={cx(styles.controls, variants[variant], className)}\n {...props}\n >\n {nonButtons && <span>{nonButtons}</span>}\n {sortedButtons}\n </div>\n );\n};\n"],"names":["buttonVariantOrder","primary","danger","secondary","tertiary","simple","variants","default","styles","fixed","inline","getButtonRank","button","props","variant","Controls","children","className","childArray","Children","toArray","buttons","nonButtons","forEach","child","isValidElement","type","Button","push","sortedButtons","map","index","rank","sort","a","b","cloneElement","key","length","undefined","cx","controls","jsx"],"mappings":";;;;;;;;;GAMMA,IAAqB;AAAA,EACzBC,SAAS;AAAA,EACTC,QAAQ;AAAA,EACRC,WAAW;AAAA,EACXC,UAAU;AAAA,EACVC,QAAQ;AACV,GAEMC,IAAW;AAAA,EACfC,SAASC,EAAOD;AAAAA,EAChBE,OAAOD,EAAOC;AAAAA,EACdC,QAAQF,EAAOE;AACjB,GAOMC,IAAgBA,CAACC,MACrBZ,EAAmBY,EAAOC,MAAMC,WAAW,WAAW,GAE3CC,IAAWA,CAAC;AAAA,EAAEC,UAAAA;AAAAA,EAAUC,WAAAA;AAAAA,EAAWH,SAAAA,IAAU;AAAA,EAAW,GAAGD;AAAqB,MAAM;AACjG,QAAMK,IAAaC,EAASC,QAAQJ,CAAQ,GACtCK,IAA6C,CAAA,GAC7CC,IAAgC,CAAA;AAEtCJ,EAAAA,EAAWK,QAASC,CAAAA,MAAU;AAC5B,IAAIC,EAA4BD,CAAK,KAAKA,EAAME,SAASC,IACvDN,EAAQO,KAAKJ,CAAK,IAElBF,EAAWM,KAAKJ,CAAK;AAAA,EAEzB,CAAC;AAED,QAAMK,IAAgBR,EACnBS,IAAI,CAAClB,GAAQmB,OAAW;AAAA,IAAEnB,QAAAA;AAAAA,IAAQmB,OAAAA;AAAAA,IAAOC,MAAMrB,EAAcC,CAAM;AAAA,EAAA,EAAI,EACvEqB,KAAK,CAACC,GAAGC,MAAMD,EAAEF,OAAOG,EAAEH,QAAQE,EAAEH,QAAQI,EAAEJ,KAAK,EACnDD,IAAI,CAAC;AAAA,IAAElB,QAAAA;AAAAA,IAAQmB,OAAAA;AAAAA,EAAAA,MACdK,EAAaxB,GAAQ;AAAA,IACnByB,KAAKzB,EAAOyB,OAAON;AAAAA,EAAAA,CACpB,CACH;AAEF,SAAIb,EAAWoB,WAAW,IACjB,yBAIN,OAAA,EACC,yBAAuBxB,MAAY,UAAU,KAAOyB,QACpD,WAAWC,EAAGhC,EAAOiC,UAAUnC,EAASQ,CAAO,GAAGG,CAAS,GAC3D,GAAIJ,GAAM,kBAAA,YAETS,UAAAA;AAAAA,IAAAA,KAAc,gBAAAoB,EAAC,UAAMpB,UAAAA,EAAAA,CAAW;AAAA,IAChCO;AAAAA,EAAAA,GACH;AAEJ;"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index38.css');const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index38.css');const e=require("react/jsx-runtime"),p=require("../../classix-5H4IWnMA.cjs"),a=require("react"),h=require("../button/index.cjs"),P=require("../icon/index.cjs"),T="_dialog_1ojxw_3",E="_close_1ojxw_24",F="_structured_1ojxw_32",M="_header_1ojxw_38",S="_content_1ojxw_49",X="_controls_1ojxw_57",Y="_fullscreen_1ojxw_77",s={dialog:T,close:E,structured:F,header:M,content:S,controls:X,fullscreen:Y},w=c=>a.Children.toArray(c).some(o=>a.isValidElement(o)?o.type===h.Button&&o.props.variant==="danger"?!0:w(o.props.children):!1),A=({children:c,className:o,controls:l,fullscreen:f=!1,header:_,onCancel:i,onClick:u,onClose:d,open:n=!1,setOpen:r,...B})=>{const g=a.useRef(null),x=w(l),j=f||_!=null||l!=null;a.useEffect(()=>{const t=g.current;t&&(n&&!t.open?t.showModal():!n&&t.open&&t.close())},[n]);const b=t=>{i==null||i(t),!(t.defaultPrevented||!r)&&(t.preventDefault(),r(!1))},q=t=>{if(u==null||u(t),x||t.defaultPrevented||t.target!==t.currentTarget||!r)return;const{bottom:N,left:R,right:D,top:k}=t.currentTarget.getBoundingClientRect();(t.clientX<R||t.clientX>D||t.clientY<k||t.clientY>N)&&r(!1)},y=t=>{d==null||d(t),n&&(r==null||r(!1))},m=r&&!x?e.jsx(h.Button,{"aria-label":"Close dialog",className:s.close,onClick:()=>r(!1),variant:"simple",children:e.jsx(P.Icon,{name:"x"})}):null;return e.jsx("dialog",{className:p.t(s.dialog,j&&s.structured,f&&s.fullscreen,o),onCancel:b,onClick:q,onClose:y,ref:g,...B,"data-component":"dialog",children:j?e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:s.header,children:[_,m]}),e.jsx("div",{className:s.content,children:c}),l!=null&&e.jsx("div",{className:s.controls,children:l})]}):e.jsxs(e.Fragment,{children:[m,c]})})};exports.Dialog=A;
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|
|
@@ -1,61 +1,61 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import { t as
|
|
3
|
-
import
|
|
4
|
-
import { Button as
|
|
5
|
-
import { Icon as
|
|
6
|
-
import '../../assets/index38.css';const
|
|
7
|
-
dialog:
|
|
8
|
-
close:
|
|
9
|
-
structured:
|
|
10
|
-
header:
|
|
11
|
-
content:
|
|
12
|
-
controls:
|
|
13
|
-
fullscreen:
|
|
14
|
-
},
|
|
15
|
-
children:
|
|
16
|
-
className:
|
|
1
|
+
import { jsx as e, jsxs as u, Fragment as j } from "react/jsx-runtime";
|
|
2
|
+
import { t as T } from "../../classix-DG18itHa.js";
|
|
3
|
+
import w, { useRef as X, useEffect as Y } from "react";
|
|
4
|
+
import { Button as p } from "../button/index.js";
|
|
5
|
+
import { Icon as A } from "../icon/index.js";
|
|
6
|
+
import '../../assets/index38.css';const F = "_dialog_1ojxw_3", I = "_close_1ojxw_24", M = "_structured_1ojxw_32", V = "_header_1ojxw_38", q = "_content_1ojxw_49", z = "_controls_1ojxw_57", G = "_fullscreen_1ojxw_77", l = {
|
|
7
|
+
dialog: F,
|
|
8
|
+
close: I,
|
|
9
|
+
structured: M,
|
|
10
|
+
header: V,
|
|
11
|
+
content: q,
|
|
12
|
+
controls: z,
|
|
13
|
+
fullscreen: G
|
|
14
|
+
}, B = (c) => w.Children.toArray(c).some((o) => w.isValidElement(o) ? o.type === p && o.props.variant === "danger" ? !0 : B(o.props.children) : !1), U = ({
|
|
15
|
+
children: c,
|
|
16
|
+
className: o,
|
|
17
17
|
controls: a,
|
|
18
18
|
fullscreen: f = !1,
|
|
19
19
|
header: _,
|
|
20
|
-
onCancel:
|
|
21
|
-
onClick:
|
|
22
|
-
onClose:
|
|
20
|
+
onCancel: n,
|
|
21
|
+
onClick: i,
|
|
22
|
+
onClose: d,
|
|
23
23
|
open: s = !1,
|
|
24
24
|
setOpen: t,
|
|
25
|
-
...
|
|
25
|
+
...N
|
|
26
26
|
}) => {
|
|
27
|
-
const m =
|
|
28
|
-
|
|
27
|
+
const m = X(null), g = B(a), h = f || _ != null || a != null;
|
|
28
|
+
Y(() => {
|
|
29
29
|
const r = m.current;
|
|
30
30
|
r && (s && !r.open ? r.showModal() : !s && r.open && r.close());
|
|
31
31
|
}, [s]);
|
|
32
32
|
const R = (r) => {
|
|
33
|
-
|
|
33
|
+
n == null || n(r), !(r.defaultPrevented || !t) && (r.preventDefault(), t(!1));
|
|
34
34
|
}, k = (r) => {
|
|
35
|
-
if (
|
|
35
|
+
if (i == null || i(r), g || r.defaultPrevented || r.target !== r.currentTarget || !t) return;
|
|
36
36
|
const {
|
|
37
37
|
bottom: D,
|
|
38
38
|
left: b,
|
|
39
|
-
right:
|
|
40
|
-
top:
|
|
39
|
+
right: E,
|
|
40
|
+
top: P
|
|
41
41
|
} = r.currentTarget.getBoundingClientRect();
|
|
42
|
-
(r.clientX < b || r.clientX >
|
|
42
|
+
(r.clientX < b || r.clientX > E || r.clientY < P || r.clientY > D) && t(!1);
|
|
43
43
|
}, y = (r) => {
|
|
44
|
-
|
|
45
|
-
},
|
|
46
|
-
return /* @__PURE__ */
|
|
47
|
-
/* @__PURE__ */ u("div", { className:
|
|
44
|
+
d == null || d(r), s && (t == null || t(!1));
|
|
45
|
+
}, x = t && !g ? /* @__PURE__ */ e(p, { "aria-label": "Close dialog", className: l.close, onClick: () => t(!1), variant: "simple", children: /* @__PURE__ */ e(A, { name: "x" }) }) : null;
|
|
46
|
+
return /* @__PURE__ */ e("dialog", { className: T(l.dialog, h && l.structured, f && l.fullscreen, o), onCancel: R, onClick: k, onClose: y, ref: m, ...N, "data-component": "dialog", children: h ? /* @__PURE__ */ u(j, { children: [
|
|
47
|
+
/* @__PURE__ */ u("div", { className: l.header, children: [
|
|
48
48
|
_,
|
|
49
|
-
|
|
49
|
+
x
|
|
50
50
|
] }),
|
|
51
|
-
/* @__PURE__ */
|
|
52
|
-
a != null && /* @__PURE__ */
|
|
53
|
-
] }) : /* @__PURE__ */ u(
|
|
54
|
-
|
|
55
|
-
|
|
51
|
+
/* @__PURE__ */ e("div", { className: l.content, children: c }),
|
|
52
|
+
a != null && /* @__PURE__ */ e("div", { className: l.controls, children: a })
|
|
53
|
+
] }) : /* @__PURE__ */ u(j, { children: [
|
|
54
|
+
x,
|
|
55
|
+
c
|
|
56
56
|
] }) });
|
|
57
57
|
};
|
|
58
58
|
export {
|
|
59
|
-
|
|
59
|
+
U as Dialog
|
|
60
60
|
};
|
|
61
61
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index39.css');const s=require("react/jsx-runtime"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index39.css');const s=require("react/jsx-runtime"),E=require("../../classix-5H4IWnMA.cjs"),a=require("react"),F=require("../button/index.cjs"),ce=require("../../icons-CR-eUx2p.cjs"),X=require("../../index-CWD8Jp0A.cjs"),ue=require("../list/index.cjs"),N=require("../../index-DVXi-Ryi.cjs");function V(t){return typeof t=="string"||typeof t=="number"?String(t):Array.isArray(t)?t.map(V).join(" "):a.isValidElement(t)?V(t.props.children):""}function de(t){return a.isValidElement(t)&&t.type==="option"}function pe(t){return a.isValidElement(t)&&t.type==="optgroup"}function fe(t){return a.isValidElement(t)&&t.type===a.Fragment}function me(t){return a.isValidElement(t)&&t.type===N.Select}function W(t,i,r=!1){const l=[];return a.Children.forEach(t,n=>{if(fe(n))l.push(...W(n.props.children,i,r));else if(de(n)){const c=V(n.props.children).trim(),f=n.props.value!=null?String(n.props.value):c;l.push({disabled:r||!!n.props.disabled,groupLabel:i,hidden:!!n.props.hidden,isPlaceholder:!!(n.props.hidden&&f===""),label:n.props.children,selected:!!n.props.selected,text:c,value:f})}else pe(n)&&l.push(...W(n.props.children,n.props.label,r||!!n.props.disabled))}),l}function be(t){const i=t.trim();if(!i)return null;const l=[.../[*?]/.test(i)?i:`*${i}*`].map(n=>n==="*"?".*":n==="?"?".":n.replace(/[|\\{}()[\]^$+.,]/g,"\\$&")).join("");return new RegExp(`^${l}$`,"i")}function _e(t,i){const r=be(i),l=t.filter(n=>!n.hidden&&!n.isPlaceholder);return r?l.filter(n=>r.test([n.groupLabel,n.text,n.value].filter(Boolean).join(" "))):l}function he(t,i){return t.find(r=>r.value===i)??t.find(r=>r.isPlaceholder)??t[0]}function ye(t,i,r){var l,n;return i!=null?String(i):r!=null?String(r):((l=t.find(c=>c.selected))==null?void 0:l.value)??((n=t[0])==null?void 0:n.value)??""}function xe(t){if(me(t)){const{children:i,placeholder:r,...l}=t.props;return{children:s.jsxs(s.Fragment,{children:[r&&s.jsx("option",{hidden:!0,value:"",children:r}),i]}),props:l}}return{children:t.props.children,props:t.props}}const ge="_combobox_1bqyf_3",ve="_dropdown_1bqyf_27",je="_empty_1bqyf_30",qe="_group_1bqyf_31",we="_placeholder_1bqyf_32",Se="_filter_1bqyf_40",Ce="_native_1bqyf_52",Ee="_option_1bqyf_62",Ne="_options_1bqyf_84",Ve="_panel_1bqyf_108",Le="_selected_1bqyf_132",Re="_text_1bqyf_136",$e="_trigger_1bqyf_144",Be="_minimal_1bqyf_180",Ie="_inline_1bqyf_235",De="_label_1bqyf_267",o={combobox:ge,"combobox-input":"_combobox-input_1bqyf_12",dropdown:ve,empty:je,group:qe,placeholder:we,filter:Se,native:Ce,option:Ee,options:Ne,panel:Ve,selected:Le,text:Re,trigger:$e,minimal:Be,inline:Ie,label:De,"inline-field":"_inline-field_1bqyf_273"};function Y(t,i){return{"--icon-svg":ce.iconSVG(t).replace("currentColor",i)}}const Pe=({children:t,className:i,combobox:r=!1,createOption:l,emptyLabel:n="No matches found",label:c,renderOption:f,searchPlaceholder:L="Filter",selectedItems:Z,variant:h="default",...ee})=>{const R=xe(t),{defaultValue:te,onChange:$,value:B,...ne}=R.props,g=N.sanitizeSelectProps(ne),M=a.useRef(null),Q=a.useRef(null),v=a.useId(),z=a.useRef(null),m=a.useRef(null),y=W(R.children),x=B!=null,I=ye(y,B,te),[D,P]=a.useState(()=>I),[u,p]=a.useState(!1),[j,q]=a.useState(""),w=x?String(B):D,O={default:N.resolveColor("--colors-semantic-content-secondary"),white:N.resolveColor("--color-white","white")},T=h==="minimal"?O.white:O.default,S=he(y,w),re=Y("chevron",T),le=Y("search",T),A=_e(y,j),b=j.trim(),C=!!(r&&l&&b&&l.isValid(b)),se=c&&h==="inline"?X.formatInlineLabel(c):c,G=e=>e?(f==null?void 0:f({groupLabel:e.groupLabel,isSelected:e.value===w,label:e.label,text:e.text,value:e.value}))??e.label:"Select an option";a.useEffect(()=>{!x&&!y.some(e=>e.value===D)&&P(I)},[I,D,x,y]),a.useEffect(()=>{var e;if(!u){q("");return}(e=m.current)==null||e.focus()},[u]),a.useEffect(()=>{if(!u)return;const e=d=>{var _;(_=Q.current)!=null&&_.contains(d.target)||p(!1)};return document.addEventListener("mousedown",e),()=>{document.removeEventListener("mousedown",e)}},[u]);const oe=e=>{x||P(e.target.value),$==null||$(e)},k=()=>{var e;p(!1),r||(e=M.current)==null||e.focus()},K=()=>{var e;q(""),p(!0),(e=m.current)==null||e.focus()},H=()=>{!l||!C||(l.onCreate(b),K())},ie=e=>{var U;x||P(e);const d=z.current;if(!d){k();return}const _=(U=Object.getOwnPropertyDescriptor(HTMLSelectElement.prototype,"value"))==null?void 0:U.set;_==null||_.call(d,e),d.dispatchEvent(new Event("change",{bubbles:!0})),r?K():k()},ae=e=>{e.key==="Escape"&&k(),e.key==="Enter"&&e.target===m.current&&C&&(e.preventDefault(),H())},J=s.jsxs("div",{className:E.t(o.dropdown,h==="inline"&&o.inline,h==="minimal"&&o.minimal,i),onKeyDown:ae,ref:Q,...ee,children:[s.jsx("select",{...g,"aria-hidden":"true",className:o.native,onChange:oe,ref:z,tabIndex:-1,value:w,children:R.children}),r?s.jsxs("div",{className:o.combobox,onClick:()=>{var e;return(e=m.current)==null?void 0:e.focus()},children:[Z,s.jsx("input",{"aria-autocomplete":"list","aria-expanded":u,"aria-label":g["aria-label"]??c??L,className:o["combobox-input"],disabled:g.disabled,onChange:e=>{q(e.target.value),p(!0)},onClick:()=>p(!0),onFocus:()=>p(!0),placeholder:L||void 0,ref:m,role:"combobox",type:"text",value:j})]}):s.jsx(F.Button,{"aria-expanded":u,"aria-haspopup":"dialog","aria-labelledby":c?`${v} ${v}-value`:void 0,className:E.t(o.trigger,(S==null?void 0:S.isPlaceholder)&&o.placeholder),"data-open":u?"true":void 0,disabled:g.disabled,onClick:()=>p(e=>!e),ref:M,style:re,variant:"tertiary",children:s.jsx("span",{className:o.text,id:`${v}-value`,children:G(S)})}),u&&s.jsxs("div",{className:o.panel,children:[!r&&s.jsx(X.Input,{"aria-label":"Filter",className:o.filter,icon:"search",onChange:e=>q(e.target.value),placeholder:L,ref:m,style:le,type:"search",value:j}),s.jsxs(ue.List,{"aria-label":"Dropdown",className:o.options,children:[A.map(e=>{const d=e.value===w;return s.jsx("li",{"data-component":"dropdown",children:s.jsxs(F.Button,{"aria-label":d?`${e.text}, selected`:e.text,className:E.t(o.option,d&&o.selected),disabled:e.disabled,onClick:()=>ie(e.value),variant:"tertiary",children:[s.jsx("span",{className:o.text,children:G(e)}),e.groupLabel&&s.jsx("small",{className:o.group,children:e.groupLabel})]})},`${e.groupLabel??"root"}-${e.value}`)}),C&&l&&s.jsx("li",{children:s.jsx(F.Button,{"aria-label":V(l.render(b))||b,className:o.option,onClick:H,variant:"tertiary",children:s.jsx("span",{className:o.text,children:l.render(b)})})}),A.length===0&&!C&&s.jsx("li",{className:o.empty,children:n})]})]})]});return c?s.jsxs("div",{className:E.t(o.label,h==="inline"&&o["inline-field"]),"data-component":"dropdown",children:[s.jsx("span",{id:v,children:se}),J]}):J};exports.Dropdown=Pe;
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|
|
@@ -1,32 +1,32 @@
|
|
|
1
1
|
import { jsxs as p, Fragment as pe, jsx as s } from "react/jsx-runtime";
|
|
2
2
|
import { t as V } from "../../classix-DG18itHa.js";
|
|
3
|
-
import fe, { Children as me, isValidElement as
|
|
4
|
-
import { Button as
|
|
5
|
-
import { i as
|
|
6
|
-
import { f as
|
|
3
|
+
import fe, { Children as me, isValidElement as v, useRef as I, useId as be, useState as W, useEffect as Q } from "react";
|
|
4
|
+
import { Button as z } from "../button/index.js";
|
|
5
|
+
import { i as he } from "../../icons-BIi_mYLy.js";
|
|
6
|
+
import { f as _e, I as ye } from "../../index-yIe5PqD1.js";
|
|
7
7
|
import { List as ge } from "../list/index.js";
|
|
8
|
-
import { S as
|
|
8
|
+
import { S as ve, s as xe, r as ee } from "../../index-Clex8VE6.js";
|
|
9
9
|
import '../../assets/index39.css';function L(t) {
|
|
10
|
-
return typeof t == "string" || typeof t == "number" ? String(t) : Array.isArray(t) ? t.map(L).join(" ") :
|
|
10
|
+
return typeof t == "string" || typeof t == "number" ? String(t) : Array.isArray(t) ? t.map(L).join(" ") : v(t) ? L(t.props.children) : "";
|
|
11
11
|
}
|
|
12
|
-
function
|
|
13
|
-
return
|
|
14
|
-
}
|
|
15
|
-
function je(t) {
|
|
16
|
-
return w(t) && t.type === "optgroup";
|
|
12
|
+
function we(t) {
|
|
13
|
+
return v(t) && t.type === "option";
|
|
17
14
|
}
|
|
18
15
|
function Se(t) {
|
|
19
|
-
return
|
|
16
|
+
return v(t) && t.type === "optgroup";
|
|
17
|
+
}
|
|
18
|
+
function qe(t) {
|
|
19
|
+
return v(t) && t.type === fe.Fragment;
|
|
20
20
|
}
|
|
21
21
|
function Ne(t) {
|
|
22
|
-
return
|
|
22
|
+
return v(t) && t.type === ve;
|
|
23
23
|
}
|
|
24
|
-
function
|
|
24
|
+
function M(t, i, r = !1) {
|
|
25
25
|
const l = [];
|
|
26
26
|
return me.forEach(t, (n) => {
|
|
27
|
-
if (
|
|
28
|
-
l.push(...
|
|
29
|
-
else if (
|
|
27
|
+
if (qe(n))
|
|
28
|
+
l.push(...M(n.props.children, i, r));
|
|
29
|
+
else if (we(n)) {
|
|
30
30
|
const a = L(n.props.children).trim(), f = n.props.value != null ? String(n.props.value) : a;
|
|
31
31
|
l.push({
|
|
32
32
|
disabled: r || !!n.props.disabled,
|
|
@@ -38,7 +38,7 @@ function A(t, i, r = !1) {
|
|
|
38
38
|
text: a,
|
|
39
39
|
value: f
|
|
40
40
|
});
|
|
41
|
-
} else
|
|
41
|
+
} else Se(n) && l.push(...M(n.props.children, n.props.label, r || !!n.props.disabled));
|
|
42
42
|
}), l;
|
|
43
43
|
}
|
|
44
44
|
function Ce(t) {
|
|
@@ -78,29 +78,29 @@ function Le(t) {
|
|
|
78
78
|
props: t.props
|
|
79
79
|
};
|
|
80
80
|
}
|
|
81
|
-
const $e = "
|
|
81
|
+
const $e = "_combobox_1bqyf_3", Be = "_dropdown_1bqyf_27", ke = "_empty_1bqyf_30", De = "_group_1bqyf_31", Pe = "_placeholder_1bqyf_32", Re = "_filter_1bqyf_40", je = "_native_1bqyf_52", Fe = "_option_1bqyf_62", We = "_options_1bqyf_84", Qe = "_panel_1bqyf_108", ze = "_selected_1bqyf_132", Me = "_text_1bqyf_136", Ae = "_trigger_1bqyf_144", Ge = "_minimal_1bqyf_180", Ke = "_inline_1bqyf_235", Oe = "_label_1bqyf_267", o = {
|
|
82
82
|
combobox: $e,
|
|
83
|
-
"combobox-input": "_combobox-
|
|
83
|
+
"combobox-input": "_combobox-input_1bqyf_12",
|
|
84
84
|
dropdown: Be,
|
|
85
85
|
empty: ke,
|
|
86
86
|
group: De,
|
|
87
87
|
placeholder: Pe,
|
|
88
88
|
filter: Re,
|
|
89
|
-
native:
|
|
90
|
-
option:
|
|
91
|
-
options:
|
|
92
|
-
panel:
|
|
93
|
-
selected:
|
|
94
|
-
text:
|
|
95
|
-
trigger:
|
|
96
|
-
minimal:
|
|
97
|
-
inline:
|
|
98
|
-
label:
|
|
99
|
-
"inline-field": "_inline-
|
|
89
|
+
native: je,
|
|
90
|
+
option: Fe,
|
|
91
|
+
options: We,
|
|
92
|
+
panel: Qe,
|
|
93
|
+
selected: ze,
|
|
94
|
+
text: Me,
|
|
95
|
+
trigger: Ae,
|
|
96
|
+
minimal: Ge,
|
|
97
|
+
inline: Ke,
|
|
98
|
+
label: Oe,
|
|
99
|
+
"inline-field": "_inline-field_1bqyf_273"
|
|
100
100
|
};
|
|
101
101
|
function te(t, i) {
|
|
102
102
|
return {
|
|
103
|
-
"--icon-svg":
|
|
103
|
+
"--icon-svg": he(t).replace("currentColor", i)
|
|
104
104
|
};
|
|
105
105
|
}
|
|
106
106
|
const tt = ({
|
|
@@ -113,7 +113,7 @@ const tt = ({
|
|
|
113
113
|
renderOption: f,
|
|
114
114
|
searchPlaceholder: $ = "Filter",
|
|
115
115
|
selectedItems: ne,
|
|
116
|
-
variant:
|
|
116
|
+
variant: _ = "default",
|
|
117
117
|
...re
|
|
118
118
|
}) => {
|
|
119
119
|
const B = Le(t), {
|
|
@@ -121,88 +121,88 @@ const tt = ({
|
|
|
121
121
|
onChange: k,
|
|
122
122
|
value: D,
|
|
123
123
|
...oe
|
|
124
|
-
} = B.props,
|
|
124
|
+
} = B.props, x = xe(oe), A = I(null), G = I(null), w = be(), K = I(null), m = I(null), y = M(B.children), g = D != null, P = Ie(y, D, le), [R, j] = W(() => P), [c, d] = W(!1), [S, q] = W(""), N = g ? String(D) : R, O = {
|
|
125
125
|
default: ee("--colors-semantic-content-secondary"),
|
|
126
126
|
white: ee("--color-white", "white")
|
|
127
|
-
},
|
|
127
|
+
}, T = _ === "minimal" ? O.white : O.default, C = Ve(y, N), ie = te("chevron", T), se = te("search", T), H = Ee(y, S), b = S.trim(), E = !!(r && l && b && l.isValid(b)), ae = a && _ === "inline" ? _e(a) : a, J = (e) => e ? (f == null ? void 0 : f({
|
|
128
128
|
groupLabel: e.groupLabel,
|
|
129
129
|
isSelected: e.value === N,
|
|
130
130
|
label: e.label,
|
|
131
131
|
text: e.text,
|
|
132
132
|
value: e.value
|
|
133
133
|
})) ?? e.label : "Select an option";
|
|
134
|
-
|
|
135
|
-
!g && !
|
|
136
|
-
}, [P, R, g,
|
|
134
|
+
Q(() => {
|
|
135
|
+
!g && !y.some((e) => e.value === R) && j(P);
|
|
136
|
+
}, [P, R, g, y]), Q(() => {
|
|
137
137
|
var e;
|
|
138
138
|
if (!c) {
|
|
139
|
-
|
|
139
|
+
q("");
|
|
140
140
|
return;
|
|
141
141
|
}
|
|
142
142
|
(e = m.current) == null || e.focus();
|
|
143
|
-
}, [c]),
|
|
143
|
+
}, [c]), Q(() => {
|
|
144
144
|
if (!c)
|
|
145
145
|
return;
|
|
146
146
|
const e = (u) => {
|
|
147
|
-
var
|
|
148
|
-
(
|
|
147
|
+
var h;
|
|
148
|
+
(h = G.current) != null && h.contains(u.target) || d(!1);
|
|
149
149
|
};
|
|
150
150
|
return document.addEventListener("mousedown", e), () => {
|
|
151
151
|
document.removeEventListener("mousedown", e);
|
|
152
152
|
};
|
|
153
153
|
}, [c]);
|
|
154
154
|
const ce = (e) => {
|
|
155
|
-
g ||
|
|
156
|
-
},
|
|
155
|
+
g || j(e.target.value), k == null || k(e);
|
|
156
|
+
}, F = () => {
|
|
157
157
|
var e;
|
|
158
|
-
d(!1), r || (e =
|
|
158
|
+
d(!1), r || (e = A.current) == null || e.focus();
|
|
159
159
|
}, U = () => {
|
|
160
160
|
var e;
|
|
161
|
-
|
|
161
|
+
q(""), d(!0), (e = m.current) == null || e.focus();
|
|
162
162
|
}, X = () => {
|
|
163
|
-
!l || !E || (l.onCreate(
|
|
163
|
+
!l || !E || (l.onCreate(b), U());
|
|
164
164
|
}, ue = (e) => {
|
|
165
165
|
var Z;
|
|
166
|
-
g ||
|
|
167
|
-
const u =
|
|
166
|
+
g || j(e);
|
|
167
|
+
const u = K.current;
|
|
168
168
|
if (!u) {
|
|
169
|
-
|
|
169
|
+
F();
|
|
170
170
|
return;
|
|
171
171
|
}
|
|
172
|
-
const
|
|
173
|
-
|
|
172
|
+
const h = (Z = Object.getOwnPropertyDescriptor(HTMLSelectElement.prototype, "value")) == null ? void 0 : Z.set;
|
|
173
|
+
h == null || h.call(u, e), u.dispatchEvent(new Event("change", {
|
|
174
174
|
bubbles: !0
|
|
175
|
-
})), r ? U() :
|
|
175
|
+
})), r ? U() : F();
|
|
176
176
|
}, de = (e) => {
|
|
177
|
-
e.key === "Escape" &&
|
|
178
|
-
}, Y = /* @__PURE__ */ p("div", { className: V(o.dropdown,
|
|
179
|
-
/* @__PURE__ */ s("select", { ...
|
|
177
|
+
e.key === "Escape" && F(), e.key === "Enter" && e.target === m.current && E && (e.preventDefault(), X());
|
|
178
|
+
}, Y = /* @__PURE__ */ p("div", { className: V(o.dropdown, _ === "inline" && o.inline, _ === "minimal" && o.minimal, i), onKeyDown: de, ref: G, ...re, children: [
|
|
179
|
+
/* @__PURE__ */ s("select", { ...x, "aria-hidden": "true", className: o.native, onChange: ce, ref: K, tabIndex: -1, value: N, children: B.children }),
|
|
180
180
|
r ? /* @__PURE__ */ p("div", { className: o.combobox, onClick: () => {
|
|
181
181
|
var e;
|
|
182
182
|
return (e = m.current) == null ? void 0 : e.focus();
|
|
183
183
|
}, children: [
|
|
184
184
|
ne,
|
|
185
|
-
/* @__PURE__ */ s("input", { "aria-autocomplete": "list", "aria-expanded": c, "aria-label":
|
|
186
|
-
|
|
187
|
-
}, onClick: () => d(!0), onFocus: () => d(!0), placeholder: $ || void 0, ref: m, role: "combobox", type: "text", value:
|
|
188
|
-
] }) : /* @__PURE__ */ s(
|
|
185
|
+
/* @__PURE__ */ s("input", { "aria-autocomplete": "list", "aria-expanded": c, "aria-label": x["aria-label"] ?? a ?? $, className: o["combobox-input"], disabled: x.disabled, onChange: (e) => {
|
|
186
|
+
q(e.target.value), d(!0);
|
|
187
|
+
}, onClick: () => d(!0), onFocus: () => d(!0), placeholder: $ || void 0, ref: m, role: "combobox", type: "text", value: S })
|
|
188
|
+
] }) : /* @__PURE__ */ s(z, { "aria-expanded": c, "aria-haspopup": "dialog", "aria-labelledby": a ? `${w} ${w}-value` : void 0, className: V(o.trigger, (C == null ? void 0 : C.isPlaceholder) && o.placeholder), "data-open": c ? "true" : void 0, disabled: x.disabled, onClick: () => d((e) => !e), ref: A, style: ie, variant: "tertiary", children: /* @__PURE__ */ s("span", { className: o.text, id: `${w}-value`, children: J(C) }) }),
|
|
189
189
|
c && /* @__PURE__ */ p("div", { className: o.panel, children: [
|
|
190
|
-
!r && /* @__PURE__ */ s(
|
|
190
|
+
!r && /* @__PURE__ */ s(ye, { "aria-label": "Filter", className: o.filter, icon: "search", onChange: (e) => q(e.target.value), placeholder: $, ref: m, style: se, type: "search", value: S }),
|
|
191
191
|
/* @__PURE__ */ p(ge, { "aria-label": "Dropdown", className: o.options, children: [
|
|
192
192
|
H.map((e) => {
|
|
193
193
|
const u = e.value === N;
|
|
194
|
-
return /* @__PURE__ */ s("li", { "data-component": "dropdown", children: /* @__PURE__ */ p(
|
|
194
|
+
return /* @__PURE__ */ s("li", { "data-component": "dropdown", children: /* @__PURE__ */ p(z, { "aria-label": u ? `${e.text}, selected` : e.text, className: V(o.option, u && o.selected), disabled: e.disabled, onClick: () => ue(e.value), variant: "tertiary", children: [
|
|
195
195
|
/* @__PURE__ */ s("span", { className: o.text, children: J(e) }),
|
|
196
196
|
e.groupLabel && /* @__PURE__ */ s("small", { className: o.group, children: e.groupLabel })
|
|
197
197
|
] }) }, `${e.groupLabel ?? "root"}-${e.value}`);
|
|
198
198
|
}),
|
|
199
|
-
E && l && /* @__PURE__ */ s("li", { children: /* @__PURE__ */ s(
|
|
199
|
+
E && l && /* @__PURE__ */ s("li", { children: /* @__PURE__ */ s(z, { "aria-label": L(l.render(b)) || b, className: o.option, onClick: X, variant: "tertiary", children: /* @__PURE__ */ s("span", { className: o.text, children: l.render(b) }) }) }),
|
|
200
200
|
H.length === 0 && !E && /* @__PURE__ */ s("li", { className: o.empty, children: n })
|
|
201
201
|
] })
|
|
202
202
|
] })
|
|
203
203
|
] });
|
|
204
|
-
return a ? /* @__PURE__ */ p("div", { className: V(o.label,
|
|
205
|
-
/* @__PURE__ */ s("span", { id:
|
|
204
|
+
return a ? /* @__PURE__ */ p("div", { className: V(o.label, _ === "inline" && o["inline-field"]), "data-component": "dropdown", children: [
|
|
205
|
+
/* @__PURE__ */ s("span", { id: w, children: ae }),
|
|
206
206
|
Y
|
|
207
207
|
] }) : Y;
|
|
208
208
|
};
|