@smwb/ui-solid 0.7.0 → 0.8.1
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/styles/less/components/confirmDialog/confirmDialog.entry.css +1 -0
- package/dist/components/clickAwayListener/clickAwayListener.js +12 -8
- package/dist/components/clickAwayListener/clickAwayListener.js.map +1 -1
- package/dist/components/dataDisplay/treeView/treeView.d.ts +5 -1
- package/dist/components/dataDisplay/treeView/treeView.js +60 -50
- package/dist/components/dataDisplay/treeView/treeView.js.map +1 -1
- package/dist/components/feedBack/confirmDialog/confirmDialog.d.ts +27 -0
- package/dist/components/feedBack/confirmDialog/confirmDialog.js +108 -0
- package/dist/components/feedBack/confirmDialog/confirmDialog.js.map +1 -0
- package/dist/components/feedBack/confirmDialog/index.d.ts +2 -0
- package/dist/components/feedBack/modal/modal.js +49 -48
- package/dist/components/feedBack/modal/modal.js.map +1 -1
- package/dist/components/inputs/datePicker/datePicker.js +22 -22
- package/dist/components/inputs/datePicker/datePicker.js.map +1 -1
- package/dist/components/inputs/dateTimePicker/dateTimePicker.js +21 -21
- package/dist/components/inputs/dateTimePicker/dateTimePicker.js.map +1 -1
- package/dist/components/inputs/selectField/dropdownMenu.js +1 -0
- package/dist/components/inputs/selectField/dropdownMenu.js.map +1 -1
- package/dist/components/inputs/timePicker/timePicker.js +16 -16
- package/dist/components/inputs/timePicker/timePicker.js.map +1 -1
- package/dist/components/layout/sheet/sheet.js +95 -92
- package/dist/components/layout/sheet/sheet.js.map +1 -1
- package/dist/headless/components/clickAwayListener/clickAwayListener.js +12 -8
- package/dist/headless/components/clickAwayListener/clickAwayListener.js.map +1 -1
- package/dist/headless/components/dataDisplay/treeView/treeView.js +60 -50
- package/dist/headless/components/dataDisplay/treeView/treeView.js.map +1 -1
- package/dist/headless/components/feedBack/confirmDialog/confirmDialog.js +107 -0
- package/dist/headless/components/feedBack/confirmDialog/confirmDialog.js.map +1 -0
- package/dist/headless/components/feedBack/modal/modal.js +49 -48
- package/dist/headless/components/feedBack/modal/modal.js.map +1 -1
- package/dist/headless/components/inputs/datePicker/datePicker.js +19 -19
- package/dist/headless/components/inputs/datePicker/datePicker.js.map +1 -1
- package/dist/headless/components/inputs/dateTimePicker/dateTimePicker.js +21 -21
- package/dist/headless/components/inputs/dateTimePicker/dateTimePicker.js.map +1 -1
- package/dist/headless/components/inputs/selectField/dropdownMenu.js +1 -0
- package/dist/headless/components/inputs/selectField/dropdownMenu.js.map +1 -1
- package/dist/headless/components/inputs/timePicker/timePicker.js +16 -16
- package/dist/headless/components/inputs/timePicker/timePicker.js.map +1 -1
- package/dist/headless/components/layout/sheet/sheet.js +95 -92
- package/dist/headless/components/layout/sheet/sheet.js.map +1 -1
- package/dist/headless/index.js +201 -199
- package/dist/headless/index.js.map +1 -1
- package/dist/headless/primitives/overlayLayer.js +11 -0
- package/dist/headless/primitives/overlayLayer.js.map +1 -0
- package/dist/headless/source/components/clickAwayListener/clickAwayListener.jsx +2 -0
- package/dist/headless/source/components/clickAwayListener/clickAwayListener.jsx.map +1 -1
- package/dist/headless/source/components/dataDisplay/treeView/treeView.jsx +10 -2
- package/dist/headless/source/components/dataDisplay/treeView/treeView.jsx.map +1 -1
- package/dist/headless/source/components/feedBack/confirmDialog/confirmDialog.jsx +76 -0
- package/dist/headless/source/components/feedBack/confirmDialog/confirmDialog.jsx.map +1 -0
- package/dist/headless/source/components/feedBack/confirmDialog/index.js +5 -0
- package/dist/headless/source/components/feedBack/confirmDialog/index.js.map +7 -0
- package/dist/headless/source/components/feedBack/modal/modal.jsx +5 -1
- package/dist/headless/source/components/feedBack/modal/modal.jsx.map +1 -1
- package/dist/headless/source/components/inputs/datePicker/datePicker.jsx +1 -0
- package/dist/headless/source/components/inputs/datePicker/datePicker.jsx.map +1 -1
- package/dist/headless/source/components/inputs/dateTimePicker/dateTimePicker.jsx +1 -0
- package/dist/headless/source/components/inputs/dateTimePicker/dateTimePicker.jsx.map +1 -1
- package/dist/headless/source/components/inputs/selectField/dropdownMenu.jsx +1 -0
- package/dist/headless/source/components/inputs/selectField/dropdownMenu.jsx.map +1 -1
- package/dist/headless/source/components/inputs/timePicker/timePicker.jsx +1 -0
- package/dist/headless/source/components/inputs/timePicker/timePicker.jsx.map +1 -1
- package/dist/headless/source/components/layout/sheet/sheet.jsx +13 -3
- package/dist/headless/source/components/layout/sheet/sheet.jsx.map +1 -1
- package/dist/headless/source/index.js +2 -0
- package/dist/headless/source/index.js.map +2 -2
- package/dist/headless/source/primitives/overlayLayer.js +18 -0
- package/dist/headless/source/primitives/overlayLayer.js.map +7 -0
- package/dist/index.d.ts +2 -0
- package/dist/index.js +201 -199
- package/dist/index.js.map +1 -1
- package/dist/primitives/overlayLayer.d.ts +13 -0
- package/dist/primitives/overlayLayer.js +11 -0
- package/dist/primitives/overlayLayer.js.map +1 -0
- package/dist/source/components/clickAwayListener/clickAwayListener.jsx +2 -0
- package/dist/source/components/clickAwayListener/clickAwayListener.jsx.map +1 -1
- package/dist/source/components/dataDisplay/treeView/treeView.jsx +10 -2
- package/dist/source/components/dataDisplay/treeView/treeView.jsx.map +1 -1
- package/dist/source/components/feedBack/confirmDialog/confirmDialog.jsx +77 -0
- package/dist/source/components/feedBack/confirmDialog/confirmDialog.jsx.map +1 -0
- package/dist/source/components/feedBack/confirmDialog/index.js +5 -0
- package/dist/source/components/feedBack/confirmDialog/index.js.map +7 -0
- package/dist/source/components/feedBack/modal/modal.jsx +5 -1
- package/dist/source/components/feedBack/modal/modal.jsx.map +1 -1
- package/dist/source/components/inputs/datePicker/datePicker.jsx +1 -0
- package/dist/source/components/inputs/datePicker/datePicker.jsx.map +1 -1
- package/dist/source/components/inputs/dateTimePicker/dateTimePicker.jsx +1 -0
- package/dist/source/components/inputs/dateTimePicker/dateTimePicker.jsx.map +1 -1
- package/dist/source/components/inputs/selectField/dropdownMenu.jsx +1 -0
- package/dist/source/components/inputs/selectField/dropdownMenu.jsx.map +1 -1
- package/dist/source/components/inputs/timePicker/timePicker.jsx +1 -0
- package/dist/source/components/inputs/timePicker/timePicker.jsx.map +1 -1
- package/dist/source/components/layout/sheet/sheet.jsx +13 -3
- package/dist/source/components/layout/sheet/sheet.jsx.map +1 -1
- package/dist/source/index.js +2 -0
- package/dist/source/index.js.map +2 -2
- package/dist/source/primitives/overlayLayer.js +18 -0
- package/dist/source/primitives/overlayLayer.js.map +7 -0
- package/package.json +11 -5
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.smwb-confirm-dialog__body{display:flex;flex-direction:column;gap:8px;min-width:280px}
|
|
@@ -1,12 +1,13 @@
|
|
|
1
1
|
import { memo as f } from "solid-js/web";
|
|
2
2
|
import { mergeProps as E, children as v, onMount as h, onCleanup as s, createEffect as p } from "solid-js";
|
|
3
|
+
import { isEventInForeignOverlay as g } from "../../primitives/overlayLayer.js";
|
|
3
4
|
function a(o) {
|
|
4
5
|
return o.substring(2).toLowerCase();
|
|
5
6
|
}
|
|
6
7
|
function L(o, n) {
|
|
7
8
|
return n.documentElement.clientWidth < o.clientX || n.documentElement.clientHeight < o.clientY;
|
|
8
9
|
}
|
|
9
|
-
function
|
|
10
|
+
function T(o) {
|
|
10
11
|
const n = E({
|
|
11
12
|
mouseEvent: "onMouseUp",
|
|
12
13
|
touchEvent: "onTouchEnd",
|
|
@@ -15,16 +16,16 @@ function A(o) {
|
|
|
15
16
|
const e = m(), t = Array.isArray(e) ? e.find((c) => c instanceof Element) : e;
|
|
16
17
|
return t instanceof Element ? t : void 0;
|
|
17
18
|
};
|
|
18
|
-
let
|
|
19
|
+
let u = !1, i = !1;
|
|
19
20
|
h(() => {
|
|
20
21
|
const e = setTimeout(() => {
|
|
21
|
-
|
|
22
|
+
u = !0;
|
|
22
23
|
}, 0);
|
|
23
24
|
s(() => clearTimeout(e));
|
|
24
25
|
});
|
|
25
26
|
const r = (e) => {
|
|
26
27
|
const t = l();
|
|
27
|
-
if (!n.enabled || !
|
|
28
|
+
if (!n.enabled || !u || !t || "clientX" in e && L(e, document))
|
|
28
29
|
return;
|
|
29
30
|
if (i) {
|
|
30
31
|
i = !1;
|
|
@@ -34,10 +35,13 @@ function A(o) {
|
|
|
34
35
|
if (e.composedPath)
|
|
35
36
|
c = e.composedPath().indexOf(t) > -1;
|
|
36
37
|
else {
|
|
37
|
-
const
|
|
38
|
-
c = !document.documentElement.contains(
|
|
38
|
+
const d = e.target;
|
|
39
|
+
c = !document.documentElement.contains(d) || t.contains(d);
|
|
40
|
+
}
|
|
41
|
+
if (!c) {
|
|
42
|
+
if (g(e, t)) return;
|
|
43
|
+
n.onClickAway(e);
|
|
39
44
|
}
|
|
40
|
-
c || n.onClickAway(e);
|
|
41
45
|
};
|
|
42
46
|
return p(() => {
|
|
43
47
|
const e = () => {
|
|
@@ -56,6 +60,6 @@ function A(o) {
|
|
|
56
60
|
}), f(m);
|
|
57
61
|
}
|
|
58
62
|
export {
|
|
59
|
-
|
|
63
|
+
T as ClickAwayListener
|
|
60
64
|
};
|
|
61
65
|
//# sourceMappingURL=clickAwayListener.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"clickAwayListener.js","sources":["../../../src/components/clickAwayListener/clickAwayListener.tsx"],"sourcesContent":["import { type JSX, children as resolveChildren, createEffect, mergeProps, onCleanup, onMount } from \"solid-js\";\n\ntype ClickAwayMouseEventHandler = \"onClick\" | \"onMouseDown\" | \"onMouseUp\" | \"onPointerDown\" | \"onPointerUp\";\ntype ClickAwayTouchEventHandler = \"onTouchStart\" | \"onTouchEnd\";\n\ntype MappedEvent = \"click\" | \"mousedown\" | \"mouseup\" | \"touchstart\" | \"touchend\" | \"pointerdown\" | \"pointerup\";\n\nfunction mapEventPropToEvent(eventProp: ClickAwayMouseEventHandler | ClickAwayTouchEventHandler): MappedEvent {\n return eventProp.substring(2).toLowerCase() as MappedEvent;\n}\n\nfunction clickedRootScrollbar(event: MouseEvent, doc: Document): boolean {\n return doc.documentElement.clientWidth < event.clientX || doc.documentElement.clientHeight < event.clientY;\n}\n\nexport interface ClickAwayListenerProps {\n children: JSX.Element;\n mouseEvent?: ClickAwayMouseEventHandler | false;\n onClickAway: (event: MouseEvent | TouchEvent) => void;\n touchEvent?: ClickAwayTouchEventHandler | false;\n /** When false, the listener is inert without unmounting the child. */\n enabled?: boolean;\n}\n\n/**\n * Solid redesign of MUI's ClickAwayListener. React's version cloned the child\n * to inject a ref + synthetic handlers; Solid resolves the child to its DOM\n * node and uses `composedPath`/`contains` containment checks against document\n * listeners — no element cloning.\n */\nexport function ClickAwayListener(props: ClickAwayListenerProps): JSX.Element {\n const merged = mergeProps(\n { mouseEvent: \"onMouseUp\" as ClickAwayMouseEventHandler, touchEvent: \"onTouchEnd\" as ClickAwayTouchEventHandler, enabled: true },\n props\n );\n const resolved = resolveChildren(() => merged.children);\n\n const getNode = (): Element | undefined => {\n const c = resolved();\n const el = Array.isArray(c) ? c.find((x) => x instanceof Element) : c;\n return el instanceof Element ? el : undefined;\n };\n\n let activated = false;\n let moved = false;\n\n onMount(() => {\n // Defer activation a tick so the opening interaction doesn't immediately\n // trigger a click-away (see facebook/react#20074).\n const timer = setTimeout(() => {\n activated = true;\n }, 0);\n onCleanup(() => clearTimeout(timer));\n });\n\n const handleClickAway = (event: MouseEvent | TouchEvent): void => {\n const node = getNode();\n if (!merged.enabled || !activated || !node || (\"clientX\" in event && clickedRootScrollbar(event, document))) {\n return;\n }\n if (moved) {\n moved = false;\n return;\n }\n let insideDOM: boolean;\n if (event.composedPath) {\n insideDOM = event.composedPath().indexOf(node) > -1;\n } else {\n const target = event.target as HTMLElement;\n insideDOM = !document.documentElement.contains(target) || node.contains(target);\n }\n if (!insideDOM) {\n merged.onClickAway(event);\n }\n };\n\n createEffect(() => {\n const handleTouchMove = (): void => {\n moved = true;\n };\n if (merged.touchEvent !== false) {\n const mapped = mapEventPropToEvent(merged.touchEvent);\n document.addEventListener(mapped, handleClickAway as EventListener);\n document.addEventListener(\"touchmove\", handleTouchMove);\n onCleanup(() => {\n document.removeEventListener(mapped, handleClickAway as EventListener);\n document.removeEventListener(\"touchmove\", handleTouchMove);\n });\n }\n if (merged.mouseEvent !== false) {\n const mapped = mapEventPropToEvent(merged.mouseEvent);\n document.addEventListener(mapped, handleClickAway as EventListener);\n onCleanup(() => document.removeEventListener(mapped, handleClickAway as EventListener));\n }\n });\n\n return <>{resolved()}</>;\n}\n\nexport default ClickAwayListener;\n"],"names":["mapEventPropToEvent","eventProp","substring","toLowerCase","clickedRootScrollbar","event","doc","documentElement","clientWidth","clientX","clientHeight","clientY","ClickAwayListener","props","merged","mergeProps","mouseEvent","touchEvent","enabled","resolved","resolveChildren","children","getNode","c","el","Array","isArray","find","x","Element","undefined","activated","moved","onMount","timer","setTimeout","onCleanup","clearTimeout","handleClickAway","node","document","insideDOM","composedPath","indexOf","target","contains","onClickAway","createEffect","handleTouchMove","mapped","addEventListener","removeEventListener","_$memo"],"mappings":"
|
|
1
|
+
{"version":3,"file":"clickAwayListener.js","sources":["../../../src/components/clickAwayListener/clickAwayListener.tsx"],"sourcesContent":["import { type JSX, children as resolveChildren, createEffect, mergeProps, onCleanup, onMount } from \"solid-js\";\nimport { isEventInForeignOverlay } from \"../../primitives/overlayLayer\";\n\ntype ClickAwayMouseEventHandler = \"onClick\" | \"onMouseDown\" | \"onMouseUp\" | \"onPointerDown\" | \"onPointerUp\";\ntype ClickAwayTouchEventHandler = \"onTouchStart\" | \"onTouchEnd\";\n\ntype MappedEvent = \"click\" | \"mousedown\" | \"mouseup\" | \"touchstart\" | \"touchend\" | \"pointerdown\" | \"pointerup\";\n\nfunction mapEventPropToEvent(eventProp: ClickAwayMouseEventHandler | ClickAwayTouchEventHandler): MappedEvent {\n return eventProp.substring(2).toLowerCase() as MappedEvent;\n}\n\nfunction clickedRootScrollbar(event: MouseEvent, doc: Document): boolean {\n return doc.documentElement.clientWidth < event.clientX || doc.documentElement.clientHeight < event.clientY;\n}\n\nexport interface ClickAwayListenerProps {\n children: JSX.Element;\n mouseEvent?: ClickAwayMouseEventHandler | false;\n onClickAway: (event: MouseEvent | TouchEvent) => void;\n touchEvent?: ClickAwayTouchEventHandler | false;\n /** When false, the listener is inert without unmounting the child. */\n enabled?: boolean;\n}\n\n/**\n * Solid redesign of MUI's ClickAwayListener. React's version cloned the child\n * to inject a ref + synthetic handlers; Solid resolves the child to its DOM\n * node and uses `composedPath`/`contains` containment checks against document\n * listeners — no element cloning.\n */\nexport function ClickAwayListener(props: ClickAwayListenerProps): JSX.Element {\n const merged = mergeProps(\n { mouseEvent: \"onMouseUp\" as ClickAwayMouseEventHandler, touchEvent: \"onTouchEnd\" as ClickAwayTouchEventHandler, enabled: true },\n props\n );\n const resolved = resolveChildren(() => merged.children);\n\n const getNode = (): Element | undefined => {\n const c = resolved();\n const el = Array.isArray(c) ? c.find((x) => x instanceof Element) : c;\n return el instanceof Element ? el : undefined;\n };\n\n let activated = false;\n let moved = false;\n\n onMount(() => {\n // Defer activation a tick so the opening interaction doesn't immediately\n // trigger a click-away (see facebook/react#20074).\n const timer = setTimeout(() => {\n activated = true;\n }, 0);\n onCleanup(() => clearTimeout(timer));\n });\n\n const handleClickAway = (event: MouseEvent | TouchEvent): void => {\n const node = getNode();\n if (!merged.enabled || !activated || !node || (\"clientX\" in event && clickedRootScrollbar(event, document))) {\n return;\n }\n if (moved) {\n moved = false;\n return;\n }\n let insideDOM: boolean;\n if (event.composedPath) {\n insideDOM = event.composedPath().indexOf(node) > -1;\n } else {\n const target = event.target as HTMLElement;\n insideDOM = !document.documentElement.contains(target) || node.contains(target);\n }\n if (!insideDOM) {\n // Interactions inside a portaled overlay layer above the child (modal,\n // dropdown, picker…) are not \"away\" from the child.\n if (isEventInForeignOverlay(event, node)) return;\n merged.onClickAway(event);\n }\n };\n\n createEffect(() => {\n const handleTouchMove = (): void => {\n moved = true;\n };\n if (merged.touchEvent !== false) {\n const mapped = mapEventPropToEvent(merged.touchEvent);\n document.addEventListener(mapped, handleClickAway as EventListener);\n document.addEventListener(\"touchmove\", handleTouchMove);\n onCleanup(() => {\n document.removeEventListener(mapped, handleClickAway as EventListener);\n document.removeEventListener(\"touchmove\", handleTouchMove);\n });\n }\n if (merged.mouseEvent !== false) {\n const mapped = mapEventPropToEvent(merged.mouseEvent);\n document.addEventListener(mapped, handleClickAway as EventListener);\n onCleanup(() => document.removeEventListener(mapped, handleClickAway as EventListener));\n }\n });\n\n return <>{resolved()}</>;\n}\n\nexport default ClickAwayListener;\n"],"names":["mapEventPropToEvent","eventProp","substring","toLowerCase","clickedRootScrollbar","event","doc","documentElement","clientWidth","clientX","clientHeight","clientY","ClickAwayListener","props","merged","mergeProps","mouseEvent","touchEvent","enabled","resolved","resolveChildren","children","getNode","c","el","Array","isArray","find","x","Element","undefined","activated","moved","onMount","timer","setTimeout","onCleanup","clearTimeout","handleClickAway","node","document","insideDOM","composedPath","indexOf","target","contains","isEventInForeignOverlay","onClickAway","createEffect","handleTouchMove","mapped","addEventListener","removeEventListener","_$memo"],"mappings":";;;AAQA,SAASA,EAAoBC,GAAiF;AAC5G,SAAOA,EAAUC,UAAU,CAAC,EAAEC,YAAAA;AAChC;AAEA,SAASC,EAAqBC,GAAmBC,GAAwB;AACvE,SAAOA,EAAIC,gBAAgBC,cAAcH,EAAMI,WAAWH,EAAIC,gBAAgBG,eAAeL,EAAMM;AACrG;AAiBO,SAASC,EAAkBC,GAA4C;AAC5E,QAAMC,IAASC,EACb;AAAA,IAAEC,YAAY;AAAA,IAA2CC,YAAY;AAAA,IAA4CC,SAAS;AAAA,EAAA,GAC1HL,CACF,GACMM,IAAWC,EAAgB,MAAMN,EAAOO,QAAQ,GAEhDC,IAAUA,MAA2B;AACzC,UAAMC,IAAIJ,EAAAA,GACJK,IAAKC,MAAMC,QAAQH,CAAC,IAAIA,EAAEI,KAAMC,CAAAA,MAAMA,aAAaC,OAAO,IAAIN;AACpE,WAAOC,aAAcK,UAAUL,IAAKM;AAAAA,EACtC;AAEA,MAAIC,IAAY,IACZC,IAAQ;AAEZC,EAAAA,EAAQ,MAAM;AAGZ,UAAMC,IAAQC,WAAW,MAAM;AAC7BJ,MAAAA,IAAY;AAAA,IACd,GAAG,CAAC;AACJK,IAAAA,EAAU,MAAMC,aAAaH,CAAK,CAAC;AAAA,EACrC,CAAC;AAED,QAAMI,IAAkBA,CAACjC,MAAyC;AAChE,UAAMkC,IAAOjB,EAAAA;AACb,QAAI,CAACR,EAAOI,WAAW,CAACa,KAAa,CAACQ,KAAS,aAAalC,KAASD,EAAqBC,GAAOmC,QAAQ;AACvG;AAEF,QAAIR,GAAO;AACTA,MAAAA,IAAQ;AACR;AAAA,IACF;AACA,QAAIS;AACJ,QAAIpC,EAAMqC;AACRD,MAAAA,IAAYpC,EAAMqC,aAAAA,EAAeC,QAAQJ,CAAI,IAAI;AAAA,SAC5C;AACL,YAAMK,IAASvC,EAAMuC;AACrBH,MAAAA,IAAY,CAACD,SAASjC,gBAAgBsC,SAASD,CAAM,KAAKL,EAAKM,SAASD,CAAM;AAAA,IAChF;AACA,QAAI,CAACH,GAAW;AAGd,UAAIK,EAAwBzC,GAAOkC,CAAI,EAAG;AAC1CzB,MAAAA,EAAOiC,YAAY1C,CAAK;AAAA,IAC1B;AAAA,EACF;AAEA2C,SAAAA,EAAa,MAAM;AACjB,UAAMC,IAAkBA,MAAY;AAClCjB,MAAAA,IAAQ;AAAA,IACV;AACA,QAAIlB,EAAOG,eAAe,IAAO;AAC/B,YAAMiC,IAASlD,EAAoBc,EAAOG,UAAU;AACpDuB,eAASW,iBAAiBD,GAAQZ,CAAgC,GAClEE,SAASW,iBAAiB,aAAaF,CAAe,GACtDb,EAAU,MAAM;AACdI,iBAASY,oBAAoBF,GAAQZ,CAAgC,GACrEE,SAASY,oBAAoB,aAAaH,CAAe;AAAA,MAC3D,CAAC;AAAA,IACH;AACA,QAAInC,EAAOE,eAAe,IAAO;AAC/B,YAAMkC,IAASlD,EAAoBc,EAAOE,UAAU;AACpDwB,eAASW,iBAAiBD,GAAQZ,CAAgC,GAClEF,EAAU,MAAMI,SAASY,oBAAoBF,GAAQZ,CAAgC,CAAC;AAAA,IACxF;AAAA,EACF,CAAC,GAEDe,EAAUlC,CAAQ;AACpB;"}
|
|
@@ -20,7 +20,11 @@ export interface TreeViewProps extends Omit<JSX.HTMLAttributes<HTMLDivElement>,
|
|
|
20
20
|
onExpandedChange?: (expanded: string[]) => void;
|
|
21
21
|
selected?: string[];
|
|
22
22
|
defaultSelected?: string[];
|
|
23
|
-
|
|
23
|
+
/** Reports the full selection plus, for user toggles, the node that just changed. */
|
|
24
|
+
onSelectedChange?: (selected: string[], changed?: {
|
|
25
|
+
id: string;
|
|
26
|
+
selected: boolean;
|
|
27
|
+
}) => void;
|
|
24
28
|
selectable?: boolean;
|
|
25
29
|
checkboxes?: boolean;
|
|
26
30
|
renderLabel?: (item: ITreeNodeItem, nodeId: string) => JSX.Element;
|
|
@@ -1,34 +1,34 @@
|
|
|
1
|
-
import { createComponent as s, use as
|
|
1
|
+
import { createComponent as s, use as D, spread as R, mergeProps as F, insert as g, template as _, effect as S, setAttribute as E, memo as y, className as K, delegateEvents as j } from "solid-js/web";
|
|
2
2
|
import '../../../assets/styles/less/components/treeView/treeView.entry.css';/* empty css */
|
|
3
|
-
import { mergeProps as
|
|
3
|
+
import { mergeProps as q, splitProps as B, createSignal as P, For as V, createContext as G, useContext as H, Show as L } from "solid-js";
|
|
4
4
|
import z from "clsx";
|
|
5
|
-
import { createControllableState as
|
|
6
|
-
import { mergeRefs as
|
|
7
|
-
import { Icon as
|
|
8
|
-
var
|
|
9
|
-
const A =
|
|
5
|
+
import { createControllableState as O } from "../../../primitives/createControllableState.js";
|
|
6
|
+
import { mergeRefs as J } from "../../../primitives/mergeRefs.js";
|
|
7
|
+
import { Icon as T } from "../../base/icon/icon.js";
|
|
8
|
+
var M = /* @__PURE__ */ _("<input type=checkbox class=smwb-tree__node__checkbox>"), Q = /* @__PURE__ */ _("<div role=group>"), U = /* @__PURE__ */ _("<div role=treeitem><span class=smwb-tree__node__content tabindex=0 role=button><span class=smwb-tree__node__label>"), W = /* @__PURE__ */ _("<div class=smwb-tree__node__loading role=status>Загрузка…"), X = /* @__PURE__ */ _("<div>"), Y = /* @__PURE__ */ _("<div class=smwb-tree__wrapper role=presentation>");
|
|
9
|
+
const A = G();
|
|
10
10
|
function N(o) {
|
|
11
|
-
const n =
|
|
11
|
+
const n = H(A), e = () => o.item.id ?? o.path, h = () => o.item.children ?? n.loadedChildren()[e()], $ = () => n.hasLoader && (!!o.item.hasChildren || !!n.loadedChildren()[e()]), c = () => !!h() && (h()?.length ?? 0) > 0 || $(), f = () => n.expandedIds().includes(e()), m = () => n.selectedIds().includes(e()), I = () => n.loadingIds().includes(e()), x = () => {
|
|
12
12
|
c() && (f() || n.ensureLoaded(o.item, e()), n.toggleExpanded(e())), n.selectable && n.toggleSelected(e());
|
|
13
|
-
},
|
|
13
|
+
}, p = (a) => {
|
|
14
14
|
a.key === "Enter" || a.key === " " ? (a.preventDefault(), x()) : a.key === "ArrowRight" && c() ? (n.ensureLoaded(o.item, e()), n.setOpen(e(), !0)) : a.key === "ArrowLeft" && c() && n.setOpen(e(), !1);
|
|
15
15
|
};
|
|
16
16
|
return (() => {
|
|
17
|
-
var a =
|
|
18
|
-
return
|
|
17
|
+
var a = U(), b = a.firstChild, k = b.firstChild;
|
|
18
|
+
return b.$$keydown = p, b.$$click = x, g(b, s(L, {
|
|
19
19
|
get when() {
|
|
20
20
|
return n.checkboxes;
|
|
21
21
|
},
|
|
22
22
|
get children() {
|
|
23
|
-
var r =
|
|
24
|
-
return r.addEventListener("change", () => n.toggleSelected(e())), r.$$click = (u) => u.stopPropagation(),
|
|
23
|
+
var r = M();
|
|
24
|
+
return r.addEventListener("change", () => n.toggleSelected(e())), r.$$click = (u) => u.stopPropagation(), S(() => E(r, "aria-label", o.item.label)), S(() => r.checked = m()), r;
|
|
25
25
|
}
|
|
26
|
-
}),
|
|
26
|
+
}), k), g(k, s(L, {
|
|
27
27
|
get when() {
|
|
28
28
|
return c();
|
|
29
29
|
},
|
|
30
30
|
get fallback() {
|
|
31
|
-
return s(
|
|
31
|
+
return s(T, {
|
|
32
32
|
get name() {
|
|
33
33
|
return n.listIcon;
|
|
34
34
|
},
|
|
@@ -36,50 +36,50 @@ function N(o) {
|
|
|
36
36
|
});
|
|
37
37
|
},
|
|
38
38
|
get children() {
|
|
39
|
-
return s(
|
|
39
|
+
return s(T, {
|
|
40
40
|
get name() {
|
|
41
|
-
return
|
|
41
|
+
return y(() => !!f())() ? n.nodeIcon.opened ?? "folder_open" : n.nodeIcon.closed ?? "folder";
|
|
42
42
|
},
|
|
43
43
|
fill: 1,
|
|
44
44
|
size: 20
|
|
45
45
|
});
|
|
46
46
|
}
|
|
47
|
-
}), null), g(
|
|
48
|
-
var r =
|
|
47
|
+
}), null), g(k, (() => {
|
|
48
|
+
var r = y(() => !!n.renderLabel);
|
|
49
49
|
return () => r() ? n.renderLabel(o.item, e()) : o.item.label;
|
|
50
|
-
})(), null), g(a, s(
|
|
50
|
+
})(), null), g(a, s(L, {
|
|
51
51
|
get when() {
|
|
52
|
-
return
|
|
52
|
+
return y(() => !!c())() && f();
|
|
53
53
|
},
|
|
54
54
|
get children() {
|
|
55
|
-
var r =
|
|
56
|
-
return g(r, s(
|
|
55
|
+
var r = Q();
|
|
56
|
+
return g(r, s(L, {
|
|
57
57
|
get when() {
|
|
58
|
-
return !(
|
|
58
|
+
return !(I() && !h());
|
|
59
59
|
},
|
|
60
60
|
get fallback() {
|
|
61
|
-
return
|
|
61
|
+
return W();
|
|
62
62
|
},
|
|
63
63
|
get children() {
|
|
64
64
|
return s(V, {
|
|
65
65
|
get each() {
|
|
66
66
|
return h() ?? [];
|
|
67
67
|
},
|
|
68
|
-
children: (u,
|
|
68
|
+
children: (u, C) => s(N, {
|
|
69
69
|
item: u,
|
|
70
70
|
get path() {
|
|
71
|
-
return `${o.path}.${
|
|
71
|
+
return `${o.path}.${C()}`;
|
|
72
72
|
}
|
|
73
73
|
})
|
|
74
74
|
});
|
|
75
75
|
}
|
|
76
76
|
})), r;
|
|
77
77
|
}
|
|
78
|
-
}), null),
|
|
78
|
+
}), null), S((r) => {
|
|
79
79
|
var u = z("smwb-tree__node", {
|
|
80
80
|
"smwb-tree__node_selected": m()
|
|
81
|
-
}),
|
|
82
|
-
return u !== r.e &&
|
|
81
|
+
}), C = c() ? f() : void 0, w = n.selectable || n.checkboxes ? m() : void 0;
|
|
82
|
+
return u !== r.e && K(a, r.e = u), C !== r.t && E(a, "aria-expanded", r.t = C), w !== r.a && E(a, "aria-selected", r.a = w), r;
|
|
83
83
|
}, {
|
|
84
84
|
e: void 0,
|
|
85
85
|
t: void 0,
|
|
@@ -87,8 +87,8 @@ function N(o) {
|
|
|
87
87
|
}), a;
|
|
88
88
|
})();
|
|
89
89
|
}
|
|
90
|
-
function
|
|
91
|
-
const n =
|
|
90
|
+
function ae(o) {
|
|
91
|
+
const n = q({
|
|
92
92
|
listIcon: "draft",
|
|
93
93
|
nodeIcon: {
|
|
94
94
|
closed: "folder",
|
|
@@ -99,27 +99,37 @@ function de(o) {
|
|
|
99
99
|
defaultSelected: [],
|
|
100
100
|
selectable: !1,
|
|
101
101
|
checkboxes: !1
|
|
102
|
-
}, o), [e, h] =
|
|
102
|
+
}, o), [e, h] = B(n, ["class", "listIcon", "nodeIcon", "data", "expanded", "defaultExpanded", "onExpandedChange", "selected", "defaultSelected", "onSelectedChange", "selectable", "checkboxes", "renderLabel", "loadChildren", "ref"]), [$, c] = P({}), [f, m] = P([]), [I, x] = O({
|
|
103
103
|
value: () => e.expanded,
|
|
104
104
|
defaultValue: e.defaultExpanded,
|
|
105
105
|
onChange: (t) => e.onExpandedChange?.(t)
|
|
106
|
-
})
|
|
106
|
+
});
|
|
107
|
+
let p;
|
|
108
|
+
const [a, b] = O({
|
|
107
109
|
value: () => e.selected,
|
|
108
110
|
defaultValue: e.defaultSelected,
|
|
109
|
-
onChange: (t) =>
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
111
|
+
onChange: (t) => {
|
|
112
|
+
const l = p;
|
|
113
|
+
p = void 0, e.onSelectedChange?.(t, l);
|
|
114
|
+
}
|
|
115
|
+
}), w = {
|
|
116
|
+
expandedIds: I,
|
|
117
|
+
selectedIds: a,
|
|
118
|
+
loadedChildren: $,
|
|
114
119
|
loadingIds: f,
|
|
115
120
|
toggleExpanded: (t) => x((l) => l.includes(t) ? l.filter((d) => d !== t) : [...l, t]),
|
|
116
121
|
setOpen: (t, l) => x((d) => {
|
|
117
122
|
const i = d.includes(t);
|
|
118
|
-
return l && !i ? [...d, t] : !l && i ? d.filter((
|
|
123
|
+
return l && !i ? [...d, t] : !l && i ? d.filter((v) => v !== t) : d;
|
|
119
124
|
}),
|
|
120
|
-
toggleSelected: (t) =>
|
|
125
|
+
toggleSelected: (t) => {
|
|
126
|
+
p = {
|
|
127
|
+
id: t,
|
|
128
|
+
selected: !a().includes(t)
|
|
129
|
+
}, b((l) => l.includes(t) ? l.filter((d) => d !== t) : [...l, t]);
|
|
130
|
+
},
|
|
121
131
|
ensureLoaded: (t, l) => {
|
|
122
|
-
!e.loadChildren ||
|
|
132
|
+
!e.loadChildren || $()[l] || t.children && t.children.length > 0 || (m((d) => d.includes(l) ? d : [...d, l]), e.loadChildren(t, l).then((d) => c((i) => ({
|
|
123
133
|
...i,
|
|
124
134
|
[l]: d
|
|
125
135
|
}))).finally(() => m((d) => d.filter((i) => i !== l))));
|
|
@@ -144,10 +154,10 @@ function de(o) {
|
|
|
144
154
|
}
|
|
145
155
|
};
|
|
146
156
|
return s(A.Provider, {
|
|
147
|
-
value:
|
|
157
|
+
value: w,
|
|
148
158
|
get children() {
|
|
149
|
-
var t =
|
|
150
|
-
return typeof l == "function" &&
|
|
159
|
+
var t = X(), l = J(e.ref);
|
|
160
|
+
return typeof l == "function" && D(l, t), R(t, F(h, {
|
|
151
161
|
"data-testid": "tree-view",
|
|
152
162
|
role: "tree",
|
|
153
163
|
get class() {
|
|
@@ -158,20 +168,20 @@ function de(o) {
|
|
|
158
168
|
return e.data;
|
|
159
169
|
},
|
|
160
170
|
children: (d, i) => (() => {
|
|
161
|
-
var
|
|
162
|
-
return g(
|
|
171
|
+
var v = Y();
|
|
172
|
+
return g(v, s(N, {
|
|
163
173
|
item: d,
|
|
164
174
|
get path() {
|
|
165
175
|
return `${i()}`;
|
|
166
176
|
}
|
|
167
|
-
})),
|
|
177
|
+
})), v;
|
|
168
178
|
})()
|
|
169
179
|
})), t;
|
|
170
180
|
}
|
|
171
181
|
});
|
|
172
182
|
}
|
|
173
|
-
|
|
183
|
+
j(["click", "keydown"]);
|
|
174
184
|
export {
|
|
175
|
-
|
|
185
|
+
ae as TreeView
|
|
176
186
|
};
|
|
177
187
|
//# sourceMappingURL=treeView.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"treeView.js","sources":["../../../../src/components/dataDisplay/treeView/treeView.tsx"],"sourcesContent":["import { type Accessor, type JSX, For, Show, createContext, createSignal, mergeProps, splitProps, useContext } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Icon } from \"../../base/icon\";\nimport { createControllableState } from \"../../../primitives/createControllableState\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface ITreeNodeItem {\n /** Stable identifier. Falls back to the positional path when omitted. */\n id?: string;\n label: string;\n children?: ITreeNodeItem[];\n /** Hint that the node is expandable even before its children are loaded. */\n hasChildren?: boolean;\n}\n\nexport interface TreeViewProps extends Omit<JSX.HTMLAttributes<HTMLDivElement>, \"onSelect\"> {\n nodeIcon?: { opened?: string; closed?: string };\n listIcon?: string;\n data: ITreeNodeItem[];\n expanded?: string[];\n defaultExpanded?: string[];\n onExpandedChange?: (expanded: string[]) => void;\n selected?: string[];\n defaultSelected?: string[];\n onSelectedChange?: (selected: string[]) => void;\n selectable?: boolean;\n checkboxes?: boolean;\n renderLabel?: (item: ITreeNodeItem, nodeId: string) => JSX.Element;\n loadChildren?: (item: ITreeNodeItem, nodeId: string) => Promise<ITreeNodeItem[]>;\n ref?: Ref<HTMLDivElement>;\n}\n\ninterface TreeContextValue {\n expandedIds: Accessor<string[]>;\n selectedIds: Accessor<string[]>;\n loadedChildren: Accessor<Record<string, ITreeNodeItem[]>>;\n loadingIds: Accessor<string[]>;\n toggleExpanded: (id: string) => void;\n setOpen: (id: string, open: boolean) => void;\n toggleSelected: (id: string) => void;\n ensureLoaded: (item: ITreeNodeItem, nodeId: string) => void;\n selectable: boolean;\n checkboxes: boolean;\n nodeIcon: { opened?: string; closed?: string };\n listIcon: string;\n renderLabel: ((item: ITreeNodeItem, nodeId: string) => JSX.Element) | undefined;\n hasLoader: boolean;\n}\n\nconst TreeContext = createContext<TreeContextValue>();\n\nfunction TreeNode(props: { item: ITreeNodeItem; path: string }): JSX.Element {\n const ctx = useContext(TreeContext)!;\n const nodeId = (): string => props.item.id ?? props.path;\n const resolvedChildren = (): ITreeNodeItem[] | undefined => props.item.children ?? ctx.loadedChildren()[nodeId()];\n const isLazy = (): boolean => ctx.hasLoader && (!!props.item.hasChildren || !!ctx.loadedChildren()[nodeId()]);\n const hasChildNodes = (): boolean => (!!resolvedChildren() && (resolvedChildren()?.length ?? 0) > 0) || isLazy();\n const isOpen = (): boolean => ctx.expandedIds().includes(nodeId());\n const isSelected = (): boolean => ctx.selectedIds().includes(nodeId());\n const isLoading = (): boolean => ctx.loadingIds().includes(nodeId());\n\n const onLabelClick = (): void => {\n if (hasChildNodes()) {\n if (!isOpen()) ctx.ensureLoaded(props.item, nodeId());\n ctx.toggleExpanded(nodeId());\n }\n if (ctx.selectable) ctx.toggleSelected(nodeId());\n };\n\n const onKeyDown: JSX.EventHandler<HTMLSpanElement, KeyboardEvent> = (event) => {\n if (event.key === \"Enter\" || event.key === \" \") {\n event.preventDefault();\n onLabelClick();\n } else if (event.key === \"ArrowRight\" && hasChildNodes()) {\n ctx.ensureLoaded(props.item, nodeId());\n ctx.setOpen(nodeId(), true);\n } else if (event.key === \"ArrowLeft\" && hasChildNodes()) {\n ctx.setOpen(nodeId(), false);\n }\n };\n\n return (\n <div\n class={cn(\"smwb-tree__node\", { \"smwb-tree__node_selected\": isSelected() })}\n role=\"treeitem\"\n aria-expanded={hasChildNodes() ? isOpen() : undefined}\n aria-selected={ctx.selectable || ctx.checkboxes ? isSelected() : undefined}\n >\n <span class=\"smwb-tree__node__content\" onClick={onLabelClick} onKeyDown={onKeyDown} tabindex={0} role=\"button\">\n <Show when={ctx.checkboxes}>\n <input\n type=\"checkbox\"\n class=\"smwb-tree__node__checkbox\"\n checked={isSelected()}\n onClick={(e) => e.stopPropagation()}\n onChange={() => ctx.toggleSelected(nodeId())}\n aria-label={props.item.label}\n />\n </Show>\n <span class=\"smwb-tree__node__label\">\n <Show when={hasChildNodes()} fallback={<Icon name={ctx.listIcon} size={20} />}>\n <Icon name={isOpen() ? ctx.nodeIcon.opened ?? \"folder_open\" : ctx.nodeIcon.closed ?? \"folder\"} fill={1} size={20} />\n </Show>\n {ctx.renderLabel ? ctx.renderLabel(props.item, nodeId()) : props.item.label}\n </span>\n </span>\n <Show when={hasChildNodes() && isOpen()}>\n <div role=\"group\">\n <Show\n when={!(isLoading() && !resolvedChildren())}\n fallback={\n <div class=\"smwb-tree__node__loading\" role=\"status\">\n Загрузка…\n </div>\n }\n >\n <For each={resolvedChildren() ?? []}>\n {(child, idx) => <TreeNode item={child} path={`${props.path}.${idx()}`} />}\n </For>\n </Show>\n </div>\n </Show>\n </div>\n );\n}\n\nexport function TreeView(props: TreeViewProps): JSX.Element {\n const merged = mergeProps(\n {\n listIcon: \"draft\",\n nodeIcon: { closed: \"folder\", opened: \"folder_open\" } as { opened?: string; closed?: string },\n data: [] as ITreeNodeItem[],\n defaultExpanded: [] as string[],\n defaultSelected: [] as string[],\n selectable: false,\n checkboxes: false,\n },\n props\n );\n const [local, rest] = splitProps(merged, [\n \"class\",\n \"listIcon\",\n \"nodeIcon\",\n \"data\",\n \"expanded\",\n \"defaultExpanded\",\n \"onExpandedChange\",\n \"selected\",\n \"defaultSelected\",\n \"onSelectedChange\",\n \"selectable\",\n \"checkboxes\",\n \"renderLabel\",\n \"loadChildren\",\n \"ref\",\n ]);\n\n const [loadedChildren, setLoadedChildren] = createSignal<Record<string, ITreeNodeItem[]>>({});\n const [loadingIds, setLoadingIds] = createSignal<string[]>([]);\n const [expandedIds, setExpandedIds] = createControllableState<string[]>({\n value: () => local.expanded,\n defaultValue: local.defaultExpanded,\n onChange: (next) => local.onExpandedChange?.(next),\n });\n const [selectedIds, setSelectedIds] = createControllableState<string[]>({\n value: () => local.selected,\n defaultValue: local.defaultSelected,\n onChange: (next) => local.onSelectedChange?.(next),\n });\n\n const toggleExpanded = (id: string): void =>\n setExpandedIds((prev) => (prev.includes(id) ? prev.filter((x) => x !== id) : [...prev, id]));\n\n const setOpen = (id: string, open: boolean): void =>\n setExpandedIds((prev) => {\n const has = prev.includes(id);\n if (open && !has) return [...prev, id];\n if (!open && has) return prev.filter((x) => x !== id);\n return prev;\n });\n\n const toggleSelected = (id: string): void =>\n setSelectedIds((prev) => (prev.includes(id) ? prev.filter((x) => x !== id) : [...prev, id]));\n\n const ensureLoaded = (item: ITreeNodeItem, nodeId: string): void => {\n if (!local.loadChildren || loadedChildren()[nodeId] || (item.children && item.children.length > 0)) return;\n setLoadingIds((prev) => (prev.includes(nodeId) ? prev : [...prev, nodeId]));\n void local\n .loadChildren(item, nodeId)\n .then((children) => setLoadedChildren((prev) => ({ ...prev, [nodeId]: children })))\n .finally(() => setLoadingIds((prev) => prev.filter((x) => x !== nodeId)));\n };\n\n const contextValue: TreeContextValue = {\n expandedIds,\n selectedIds,\n loadedChildren,\n loadingIds,\n toggleExpanded,\n setOpen,\n toggleSelected,\n ensureLoaded,\n get selectable() {\n return local.selectable;\n },\n get checkboxes() {\n return local.checkboxes;\n },\n get nodeIcon() {\n return local.nodeIcon;\n },\n get listIcon() {\n return local.listIcon;\n },\n get renderLabel() {\n return local.renderLabel;\n },\n get hasLoader() {\n return !!local.loadChildren;\n },\n };\n\n return (\n <TreeContext.Provider value={contextValue}>\n <div {...rest} data-testid=\"tree-view\" ref={mergeRefs(local.ref)} role=\"tree\" class={cn(\"smwb-tree\", local.class)}>\n <For each={local.data}>\n {(node, idx) => (\n <div class=\"smwb-tree__wrapper\" role=\"presentation\">\n <TreeNode item={node} path={`${idx()}`} />\n </div>\n )}\n </For>\n </div>\n </TreeContext.Provider>\n );\n}\n\nexport default TreeView;\n"],"names":["TreeContext","createContext","TreeNode","props","ctx","useContext","nodeId","item","id","path","resolvedChildren","children","loadedChildren","isLazy","hasLoader","hasChildren","hasChildNodes","length","isOpen","expandedIds","includes","isSelected","selectedIds","isLoading","loadingIds","onLabelClick","ensureLoaded","toggleExpanded","selectable","toggleSelected","onKeyDown","event","key","preventDefault","setOpen","_el$","_tmpl$3","_el$2","firstChild","_el$4","$$keydown","$$click","_$insert","_$createComponent","Show","when","checkboxes","_el$3","_tmpl$","addEventListener","e","stopPropagation","_$effect","_$setAttribute","label","checked","fallback","Icon","name","listIcon","size","_$memo","nodeIcon","opened","closed","fill","_c$","renderLabel","_el$5","_tmpl$2","_tmpl$4","For","each","child","idx","_p$","_v$","cn","_v$2","undefined","_v$3","_$className","t","a","TreeView","merged","mergeProps","data","defaultExpanded","defaultSelected","local","rest","splitProps","setLoadedChildren","createSignal","setLoadingIds","setExpandedIds","createControllableState","value","expanded","defaultValue","onChange","next","onExpandedChange","setSelectedIds","selected","onSelectedChange","contextValue","prev","filter","x","open","has","loadChildren","then","finally","Provider","_el$7","_tmpl$5","_ref$","mergeRefs","ref","_$use","_$spread","_$mergeProps","class","node","_el$8","_tmpl$6","_$delegateEvents"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"treeView.js","sources":["../../../../src/components/dataDisplay/treeView/treeView.tsx"],"sourcesContent":["import { type Accessor, type JSX, For, Show, createContext, createSignal, mergeProps, splitProps, useContext } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Icon } from \"../../base/icon\";\nimport { createControllableState } from \"../../../primitives/createControllableState\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface ITreeNodeItem {\n /** Stable identifier. Falls back to the positional path when omitted. */\n id?: string;\n label: string;\n children?: ITreeNodeItem[];\n /** Hint that the node is expandable even before its children are loaded. */\n hasChildren?: boolean;\n}\n\nexport interface TreeViewProps extends Omit<JSX.HTMLAttributes<HTMLDivElement>, \"onSelect\"> {\n nodeIcon?: { opened?: string; closed?: string };\n listIcon?: string;\n data: ITreeNodeItem[];\n expanded?: string[];\n defaultExpanded?: string[];\n onExpandedChange?: (expanded: string[]) => void;\n selected?: string[];\n defaultSelected?: string[];\n /** Reports the full selection plus, for user toggles, the node that just changed. */\n onSelectedChange?: (selected: string[], changed?: { id: string; selected: boolean }) => void;\n selectable?: boolean;\n checkboxes?: boolean;\n renderLabel?: (item: ITreeNodeItem, nodeId: string) => JSX.Element;\n loadChildren?: (item: ITreeNodeItem, nodeId: string) => Promise<ITreeNodeItem[]>;\n ref?: Ref<HTMLDivElement>;\n}\n\ninterface TreeContextValue {\n expandedIds: Accessor<string[]>;\n selectedIds: Accessor<string[]>;\n loadedChildren: Accessor<Record<string, ITreeNodeItem[]>>;\n loadingIds: Accessor<string[]>;\n toggleExpanded: (id: string) => void;\n setOpen: (id: string, open: boolean) => void;\n toggleSelected: (id: string) => void;\n ensureLoaded: (item: ITreeNodeItem, nodeId: string) => void;\n selectable: boolean;\n checkboxes: boolean;\n nodeIcon: { opened?: string; closed?: string };\n listIcon: string;\n renderLabel: ((item: ITreeNodeItem, nodeId: string) => JSX.Element) | undefined;\n hasLoader: boolean;\n}\n\nconst TreeContext = createContext<TreeContextValue>();\n\nfunction TreeNode(props: { item: ITreeNodeItem; path: string }): JSX.Element {\n const ctx = useContext(TreeContext)!;\n const nodeId = (): string => props.item.id ?? props.path;\n const resolvedChildren = (): ITreeNodeItem[] | undefined => props.item.children ?? ctx.loadedChildren()[nodeId()];\n const isLazy = (): boolean => ctx.hasLoader && (!!props.item.hasChildren || !!ctx.loadedChildren()[nodeId()]);\n const hasChildNodes = (): boolean => (!!resolvedChildren() && (resolvedChildren()?.length ?? 0) > 0) || isLazy();\n const isOpen = (): boolean => ctx.expandedIds().includes(nodeId());\n const isSelected = (): boolean => ctx.selectedIds().includes(nodeId());\n const isLoading = (): boolean => ctx.loadingIds().includes(nodeId());\n\n const onLabelClick = (): void => {\n if (hasChildNodes()) {\n if (!isOpen()) ctx.ensureLoaded(props.item, nodeId());\n ctx.toggleExpanded(nodeId());\n }\n if (ctx.selectable) ctx.toggleSelected(nodeId());\n };\n\n const onKeyDown: JSX.EventHandler<HTMLSpanElement, KeyboardEvent> = (event) => {\n if (event.key === \"Enter\" || event.key === \" \") {\n event.preventDefault();\n onLabelClick();\n } else if (event.key === \"ArrowRight\" && hasChildNodes()) {\n ctx.ensureLoaded(props.item, nodeId());\n ctx.setOpen(nodeId(), true);\n } else if (event.key === \"ArrowLeft\" && hasChildNodes()) {\n ctx.setOpen(nodeId(), false);\n }\n };\n\n return (\n <div\n class={cn(\"smwb-tree__node\", { \"smwb-tree__node_selected\": isSelected() })}\n role=\"treeitem\"\n aria-expanded={hasChildNodes() ? isOpen() : undefined}\n aria-selected={ctx.selectable || ctx.checkboxes ? isSelected() : undefined}\n >\n <span class=\"smwb-tree__node__content\" onClick={onLabelClick} onKeyDown={onKeyDown} tabindex={0} role=\"button\">\n <Show when={ctx.checkboxes}>\n <input\n type=\"checkbox\"\n class=\"smwb-tree__node__checkbox\"\n checked={isSelected()}\n onClick={(e) => e.stopPropagation()}\n onChange={() => ctx.toggleSelected(nodeId())}\n aria-label={props.item.label}\n />\n </Show>\n <span class=\"smwb-tree__node__label\">\n <Show when={hasChildNodes()} fallback={<Icon name={ctx.listIcon} size={20} />}>\n <Icon name={isOpen() ? ctx.nodeIcon.opened ?? \"folder_open\" : ctx.nodeIcon.closed ?? \"folder\"} fill={1} size={20} />\n </Show>\n {ctx.renderLabel ? ctx.renderLabel(props.item, nodeId()) : props.item.label}\n </span>\n </span>\n <Show when={hasChildNodes() && isOpen()}>\n <div role=\"group\">\n <Show\n when={!(isLoading() && !resolvedChildren())}\n fallback={\n <div class=\"smwb-tree__node__loading\" role=\"status\">\n Загрузка…\n </div>\n }\n >\n <For each={resolvedChildren() ?? []}>\n {(child, idx) => <TreeNode item={child} path={`${props.path}.${idx()}`} />}\n </For>\n </Show>\n </div>\n </Show>\n </div>\n );\n}\n\nexport function TreeView(props: TreeViewProps): JSX.Element {\n const merged = mergeProps(\n {\n listIcon: \"draft\",\n nodeIcon: { closed: \"folder\", opened: \"folder_open\" } as { opened?: string; closed?: string },\n data: [] as ITreeNodeItem[],\n defaultExpanded: [] as string[],\n defaultSelected: [] as string[],\n selectable: false,\n checkboxes: false,\n },\n props\n );\n const [local, rest] = splitProps(merged, [\n \"class\",\n \"listIcon\",\n \"nodeIcon\",\n \"data\",\n \"expanded\",\n \"defaultExpanded\",\n \"onExpandedChange\",\n \"selected\",\n \"defaultSelected\",\n \"onSelectedChange\",\n \"selectable\",\n \"checkboxes\",\n \"renderLabel\",\n \"loadChildren\",\n \"ref\",\n ]);\n\n const [loadedChildren, setLoadedChildren] = createSignal<Record<string, ITreeNodeItem[]>>({});\n const [loadingIds, setLoadingIds] = createSignal<string[]>([]);\n const [expandedIds, setExpandedIds] = createControllableState<string[]>({\n value: () => local.expanded,\n defaultValue: local.defaultExpanded,\n onChange: (next) => local.onExpandedChange?.(next),\n });\n let lastToggled: { id: string; selected: boolean } | undefined;\n const [selectedIds, setSelectedIds] = createControllableState<string[]>({\n value: () => local.selected,\n defaultValue: local.defaultSelected,\n onChange: (next) => {\n // createControllableState calls onChange synchronously from the setter,\n // so lastToggled still refers to the toggle that caused this change.\n const changed = lastToggled;\n lastToggled = undefined;\n local.onSelectedChange?.(next, changed);\n },\n });\n\n const toggleExpanded = (id: string): void =>\n setExpandedIds((prev) => (prev.includes(id) ? prev.filter((x) => x !== id) : [...prev, id]));\n\n const setOpen = (id: string, open: boolean): void =>\n setExpandedIds((prev) => {\n const has = prev.includes(id);\n if (open && !has) return [...prev, id];\n if (!open && has) return prev.filter((x) => x !== id);\n return prev;\n });\n\n const toggleSelected = (id: string): void => {\n lastToggled = { id, selected: !selectedIds().includes(id) };\n setSelectedIds((prev) => (prev.includes(id) ? prev.filter((x) => x !== id) : [...prev, id]));\n };\n\n const ensureLoaded = (item: ITreeNodeItem, nodeId: string): void => {\n if (!local.loadChildren || loadedChildren()[nodeId] || (item.children && item.children.length > 0)) return;\n setLoadingIds((prev) => (prev.includes(nodeId) ? prev : [...prev, nodeId]));\n void local\n .loadChildren(item, nodeId)\n .then((children) => setLoadedChildren((prev) => ({ ...prev, [nodeId]: children })))\n .finally(() => setLoadingIds((prev) => prev.filter((x) => x !== nodeId)));\n };\n\n const contextValue: TreeContextValue = {\n expandedIds,\n selectedIds,\n loadedChildren,\n loadingIds,\n toggleExpanded,\n setOpen,\n toggleSelected,\n ensureLoaded,\n get selectable() {\n return local.selectable;\n },\n get checkboxes() {\n return local.checkboxes;\n },\n get nodeIcon() {\n return local.nodeIcon;\n },\n get listIcon() {\n return local.listIcon;\n },\n get renderLabel() {\n return local.renderLabel;\n },\n get hasLoader() {\n return !!local.loadChildren;\n },\n };\n\n return (\n <TreeContext.Provider value={contextValue}>\n <div {...rest} data-testid=\"tree-view\" ref={mergeRefs(local.ref)} role=\"tree\" class={cn(\"smwb-tree\", local.class)}>\n <For each={local.data}>\n {(node, idx) => (\n <div class=\"smwb-tree__wrapper\" role=\"presentation\">\n <TreeNode item={node} path={`${idx()}`} />\n </div>\n )}\n </For>\n </div>\n </TreeContext.Provider>\n );\n}\n\nexport default TreeView;\n"],"names":["TreeContext","createContext","TreeNode","props","ctx","useContext","nodeId","item","id","path","resolvedChildren","children","loadedChildren","isLazy","hasLoader","hasChildren","hasChildNodes","length","isOpen","expandedIds","includes","isSelected","selectedIds","isLoading","loadingIds","onLabelClick","ensureLoaded","toggleExpanded","selectable","toggleSelected","onKeyDown","event","key","preventDefault","setOpen","_el$","_tmpl$3","_el$2","firstChild","_el$4","$$keydown","$$click","_$insert","_$createComponent","Show","when","checkboxes","_el$3","_tmpl$","addEventListener","e","stopPropagation","_$effect","_$setAttribute","label","checked","fallback","Icon","name","listIcon","size","_$memo","nodeIcon","opened","closed","fill","_c$","renderLabel","_el$5","_tmpl$2","_tmpl$4","For","each","child","idx","_p$","_v$","cn","_v$2","undefined","_v$3","_$className","t","a","TreeView","merged","mergeProps","data","defaultExpanded","defaultSelected","local","rest","splitProps","setLoadedChildren","createSignal","setLoadingIds","setExpandedIds","createControllableState","value","expanded","defaultValue","onChange","next","onExpandedChange","lastToggled","setSelectedIds","selected","changed","onSelectedChange","contextValue","prev","filter","x","open","has","loadChildren","then","finally","Provider","_el$7","_tmpl$5","_ref$","mergeRefs","ref","_$use","_$spread","_$mergeProps","class","node","_el$8","_tmpl$6","_$delegateEvents"],"mappings":"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"}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { type JSX } from "solid-js";
|
|
2
|
+
export interface ConfirmDialogProps {
|
|
3
|
+
open: boolean;
|
|
4
|
+
title: string;
|
|
5
|
+
/** The subject of the action, shown emphasised on its own line (e.g. the asset name). */
|
|
6
|
+
subject?: string;
|
|
7
|
+
/** A secondary explanatory line (e.g. "can't be undone"). */
|
|
8
|
+
message?: string;
|
|
9
|
+
confirmLabel: string;
|
|
10
|
+
cancelLabel?: string;
|
|
11
|
+
/** Style the confirm button as destructive (red). */
|
|
12
|
+
danger?: boolean;
|
|
13
|
+
/** Disable the actions + gate Esc/outside-click while a confirm is in flight. */
|
|
14
|
+
busy?: boolean;
|
|
15
|
+
onConfirm: () => void;
|
|
16
|
+
onCancel: () => void;
|
|
17
|
+
class?: string;
|
|
18
|
+
}
|
|
19
|
+
/**
|
|
20
|
+
* An alert/confirm dialog built on {@link Modal}: a title, an optional emphasised subject + secondary
|
|
21
|
+
* message, and Cancel / Confirm actions. `role="alertdialog"` with the subject + message wired to
|
|
22
|
+
* `aria-describedby` so a screen reader announces the consequence, not just the title. While `busy`,
|
|
23
|
+
* Escape + outside-click are gated and the buttons disabled. Pure presentation — the caller owns the
|
|
24
|
+
* open state and the confirm/cancel handlers (and supplies localised labels).
|
|
25
|
+
*/
|
|
26
|
+
export declare function ConfirmDialog(props: ConfirmDialogProps): JSX.Element;
|
|
27
|
+
export default ConfirmDialog;
|
|
@@ -0,0 +1,108 @@
|
|
|
1
|
+
import { createComponent as r, mergeProps as d, insert as l, effect as g, className as b, template as p } from "solid-js/web";
|
|
2
|
+
import '../../../assets/styles/less/components/confirmDialog/confirmDialog.entry.css';/* empty css */
|
|
3
|
+
import { splitProps as f, createUniqueId as i, Show as c } from "solid-js";
|
|
4
|
+
import y from "clsx";
|
|
5
|
+
import { Modal as n } from "../modal/modal.js";
|
|
6
|
+
import { Typography as s } from "../../dataDisplay/typography/typography.js";
|
|
7
|
+
import { Button as m } from "../../inputs/button/button.js";
|
|
8
|
+
var C = /* @__PURE__ */ p("<div>");
|
|
9
|
+
function z(u) {
|
|
10
|
+
const [e] = f(u, ["open", "title", "subject", "message", "confirmLabel", "cancelLabel", "danger", "busy", "onConfirm", "onCancel", "class"]), o = i(), a = i();
|
|
11
|
+
return r(n, d({
|
|
12
|
+
get open() {
|
|
13
|
+
return e.open;
|
|
14
|
+
},
|
|
15
|
+
onClose: () => e.onCancel(),
|
|
16
|
+
size: "small",
|
|
17
|
+
role: "alertdialog",
|
|
18
|
+
backdrop: "dark",
|
|
19
|
+
get closeOnEsc() {
|
|
20
|
+
return !e.busy;
|
|
21
|
+
},
|
|
22
|
+
get closeOnOutsideClick() {
|
|
23
|
+
return !e.busy;
|
|
24
|
+
},
|
|
25
|
+
get "aria-label"() {
|
|
26
|
+
return e.title;
|
|
27
|
+
}
|
|
28
|
+
}, () => {
|
|
29
|
+
const t = [e.subject ? o : "", e.message ? a : ""].filter(Boolean).join(" ");
|
|
30
|
+
return t ? {
|
|
31
|
+
"aria-describedby": t
|
|
32
|
+
} : {};
|
|
33
|
+
}, {
|
|
34
|
+
get children() {
|
|
35
|
+
return [r(n.Header, {
|
|
36
|
+
get children() {
|
|
37
|
+
return e.title;
|
|
38
|
+
}
|
|
39
|
+
}), r(n.Content, {
|
|
40
|
+
get children() {
|
|
41
|
+
var t = C();
|
|
42
|
+
return l(t, r(c, {
|
|
43
|
+
get when() {
|
|
44
|
+
return e.subject;
|
|
45
|
+
},
|
|
46
|
+
get children() {
|
|
47
|
+
return r(s, {
|
|
48
|
+
id: o,
|
|
49
|
+
variant: "body2",
|
|
50
|
+
color: "textPrimary",
|
|
51
|
+
component: "span",
|
|
52
|
+
get children() {
|
|
53
|
+
return e.subject;
|
|
54
|
+
}
|
|
55
|
+
});
|
|
56
|
+
}
|
|
57
|
+
}), null), l(t, r(c, {
|
|
58
|
+
get when() {
|
|
59
|
+
return e.message;
|
|
60
|
+
},
|
|
61
|
+
get children() {
|
|
62
|
+
return r(s, {
|
|
63
|
+
id: a,
|
|
64
|
+
variant: "caption",
|
|
65
|
+
color: "textSecondary",
|
|
66
|
+
component: "span",
|
|
67
|
+
get children() {
|
|
68
|
+
return e.message;
|
|
69
|
+
}
|
|
70
|
+
});
|
|
71
|
+
}
|
|
72
|
+
}), null), g(() => b(t, y("smwb-confirm-dialog__body", e.class))), t;
|
|
73
|
+
}
|
|
74
|
+
}), r(n.Footer, {
|
|
75
|
+
get children() {
|
|
76
|
+
return [r(m, {
|
|
77
|
+
variant: "text",
|
|
78
|
+
size: "small",
|
|
79
|
+
get disabled() {
|
|
80
|
+
return !!e.busy;
|
|
81
|
+
},
|
|
82
|
+
onClick: () => e.onCancel(),
|
|
83
|
+
get label() {
|
|
84
|
+
return e.cancelLabel ?? "Cancel";
|
|
85
|
+
}
|
|
86
|
+
}), r(m, {
|
|
87
|
+
variant: "contained",
|
|
88
|
+
size: "small",
|
|
89
|
+
get color() {
|
|
90
|
+
return e.danger ? "error" : "primary";
|
|
91
|
+
},
|
|
92
|
+
get disabled() {
|
|
93
|
+
return !!e.busy;
|
|
94
|
+
},
|
|
95
|
+
onClick: () => e.onConfirm(),
|
|
96
|
+
get label() {
|
|
97
|
+
return e.confirmLabel;
|
|
98
|
+
}
|
|
99
|
+
})];
|
|
100
|
+
}
|
|
101
|
+
})];
|
|
102
|
+
}
|
|
103
|
+
}));
|
|
104
|
+
}
|
|
105
|
+
export {
|
|
106
|
+
z as ConfirmDialog
|
|
107
|
+
};
|
|
108
|
+
//# sourceMappingURL=confirmDialog.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"confirmDialog.js","sources":["../../../../src/components/feedBack/confirmDialog/confirmDialog.tsx"],"sourcesContent":["import { type JSX, Show, splitProps, createUniqueId } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Modal } from \"../modal\";\nimport { Button } from \"../../inputs/button\";\nimport { Typography } from \"../../dataDisplay/typography\";\n\nexport interface ConfirmDialogProps {\n open: boolean;\n title: string;\n /** The subject of the action, shown emphasised on its own line (e.g. the asset name). */\n subject?: string;\n /** A secondary explanatory line (e.g. \"can't be undone\"). */\n message?: string;\n confirmLabel: string;\n cancelLabel?: string;\n /** Style the confirm button as destructive (red). */\n danger?: boolean;\n /** Disable the actions + gate Esc/outside-click while a confirm is in flight. */\n busy?: boolean;\n onConfirm: () => void;\n onCancel: () => void;\n class?: string;\n}\n\n/**\n * An alert/confirm dialog built on {@link Modal}: a title, an optional emphasised subject + secondary\n * message, and Cancel / Confirm actions. `role=\"alertdialog\"` with the subject + message wired to\n * `aria-describedby` so a screen reader announces the consequence, not just the title. While `busy`,\n * Escape + outside-click are gated and the buttons disabled. Pure presentation — the caller owns the\n * open state and the confirm/cancel handlers (and supplies localised labels).\n */\nexport function ConfirmDialog(props: ConfirmDialogProps): JSX.Element {\n const [local] = splitProps(props, [\n \"open\",\n \"title\",\n \"subject\",\n \"message\",\n \"confirmLabel\",\n \"cancelLabel\",\n \"danger\",\n \"busy\",\n \"onConfirm\",\n \"onCancel\",\n \"class\",\n ]);\n const subjectId = createUniqueId();\n const messageId = createUniqueId();\n // Only include aria-describedby when there's something to describe (the lib's exactOptionalPropertyTypes\n // forbids passing an explicit `undefined` to Modal's optional prop, so spread a precisely-typed object).\n const ariaDescribed = (): { \"aria-describedby\"?: string } => {\n const ids = [local.subject ? subjectId : \"\", local.message ? messageId : \"\"].filter(Boolean).join(\" \");\n return ids ? { \"aria-describedby\": ids } : {};\n };\n\n return (\n <Modal\n open={local.open}\n onClose={() => local.onCancel()}\n size=\"small\"\n role=\"alertdialog\"\n backdrop=\"dark\"\n closeOnEsc={!local.busy}\n closeOnOutsideClick={!local.busy}\n aria-label={local.title}\n {...ariaDescribed()}\n >\n <Modal.Header>{local.title}</Modal.Header>\n <Modal.Content>\n <div class={cn(\"smwb-confirm-dialog__body\", local.class)}>\n <Show when={local.subject}>\n <Typography id={subjectId} variant=\"body2\" color=\"textPrimary\" component=\"span\">\n {local.subject}\n </Typography>\n </Show>\n <Show when={local.message}>\n <Typography id={messageId} variant=\"caption\" color=\"textSecondary\" component=\"span\">\n {local.message}\n </Typography>\n </Show>\n </div>\n </Modal.Content>\n <Modal.Footer>\n <Button\n variant=\"text\"\n size=\"small\"\n disabled={!!local.busy}\n onClick={() => local.onCancel()}\n label={local.cancelLabel ?? \"Cancel\"}\n />\n <Button\n variant=\"contained\"\n size=\"small\"\n color={local.danger ? \"error\" : \"primary\"}\n disabled={!!local.busy}\n onClick={() => local.onConfirm()}\n label={local.confirmLabel}\n />\n </Modal.Footer>\n </Modal>\n );\n}\n\nexport default ConfirmDialog;\n"],"names":["ConfirmDialog","props","local","splitProps","subjectId","createUniqueId","messageId","_$createComponent","Modal","_$mergeProps","open","onClose","onCancel","size","role","backdrop","closeOnEsc","busy","closeOnOutsideClick","title","ariaDescribed","ids","subject","message","filter","Boolean","join","children","Header","Content","_el$","_tmpl$","_$insert","Show","when","Typography","id","variant","color","component","_$effect","_$className","cn","class","Footer","Button","disabled","onClick","label","cancelLabel","danger","onConfirm","confirmLabel"],"mappings":"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"}
|