@gooddata/sdk-ui-kit 10.35.0-alpha.34 → 10.35.0-alpha.36
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/esm/@ui/UiListbox/UiListbox.d.ts +1 -1
- package/esm/@ui/UiListbox/UiListbox.d.ts.map +1 -1
- package/esm/@ui/UiListbox/UiListbox.js +17 -9
- package/esm/@ui/UiListbox/UiListbox.js.map +1 -1
- package/esm/@ui/UiListbox/types.d.ts +6 -2
- package/esm/@ui/UiListbox/types.d.ts.map +1 -1
- package/esm/@ui/UiTreeview/UITreeviewItem.d.ts +23 -0
- package/esm/@ui/UiTreeview/UITreeviewItem.d.ts.map +1 -0
- package/esm/@ui/UiTreeview/UITreeviewItem.js +40 -0
- package/esm/@ui/UiTreeview/UITreeviewItem.js.map +1 -0
- package/esm/@ui/UiTreeview/UiTreeview.d.ts +21 -0
- package/esm/@ui/UiTreeview/UiTreeview.d.ts.map +1 -0
- package/esm/@ui/UiTreeview/UiTreeview.js +185 -0
- package/esm/@ui/UiTreeview/UiTreeview.js.map +1 -0
- package/esm/@ui/UiTreeview/UiTreeviewRoot.d.ts +17 -0
- package/esm/@ui/UiTreeview/UiTreeviewRoot.d.ts.map +1 -0
- package/esm/@ui/UiTreeview/UiTreeviewRoot.js +12 -0
- package/esm/@ui/UiTreeview/UiTreeviewRoot.js.map +1 -0
- package/esm/@ui/UiTreeview/defaults/DefaultUiTreeViewItemComponent.d.ts +7 -0
- package/esm/@ui/UiTreeview/defaults/DefaultUiTreeViewItemComponent.d.ts.map +1 -0
- package/esm/@ui/UiTreeview/defaults/DefaultUiTreeViewItemComponent.js +24 -0
- package/esm/@ui/UiTreeview/defaults/DefaultUiTreeViewItemComponent.js.map +1 -0
- package/esm/@ui/UiTreeview/treeviewBem.d.ts +2 -0
- package/esm/@ui/UiTreeview/treeviewBem.d.ts.map +1 -0
- package/esm/@ui/UiTreeview/treeviewBem.js +4 -0
- package/esm/@ui/UiTreeview/treeviewBem.js.map +1 -0
- package/esm/@ui/UiTreeview/types.d.ts +144 -0
- package/esm/@ui/UiTreeview/types.d.ts.map +1 -0
- package/esm/@ui/UiTreeview/types.js +3 -0
- package/esm/@ui/UiTreeview/types.js.map +1 -0
- package/esm/@ui/UiTreeview/utils.d.ts +31 -0
- package/esm/@ui/UiTreeview/utils.d.ts.map +1 -0
- package/esm/@ui/UiTreeview/utils.js +176 -0
- package/esm/@ui/UiTreeview/utils.js.map +1 -0
- package/esm/index.d.ts +3 -0
- package/esm/index.d.ts.map +1 -1
- package/esm/index.js +2 -0
- package/esm/index.js.map +1 -1
- package/esm/sdk-ui-kit.d.ts +189 -3
- package/package.json +8 -8
- package/src/@ui/UiTreeview/UiTreeview.scss +116 -0
- package/src/@ui/index.scss +1 -0
- package/styles/css/main.css +95 -0
- package/styles/css/main.css.map +1 -1
|
@@ -7,5 +7,5 @@ import { UiListboxProps } from "./types.js";
|
|
|
7
7
|
*
|
|
8
8
|
* @internal
|
|
9
9
|
*/
|
|
10
|
-
export declare function UiListbox<InteractiveItemData, StaticItemData>({ items, dataTestId, itemDataTestId, maxWidth, maxHeight, onSelect, onClose, onUnhandledKeyDown, selectedItemId, InteractiveItemComponent, StaticItemComponent, shouldKeyboardActionPreventDefault, shouldKeyboardActionStopPropagation, shouldCloseOnSelect, isDisabledFocusable, isCompact, ariaAttributes, }: UiListboxProps<InteractiveItemData, StaticItemData>): React.ReactNode;
|
|
10
|
+
export declare function UiListbox<InteractiveItemData, StaticItemData>({ items, dataTestId, itemDataTestId, width, maxWidth, maxHeight, onSelect, onClose, onUnhandledKeyDown, selectedItemId, InteractiveItemComponent, StaticItemComponent, shouldKeyboardActionPreventDefault, shouldKeyboardActionStopPropagation, shouldCloseOnSelect, isDisabledFocusable, isCompact, ariaAttributes, }: UiListboxProps<InteractiveItemData, StaticItemData>): React.ReactNode;
|
|
11
11
|
//# sourceMappingURL=UiListbox.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"UiListbox.d.ts","sourceRoot":"","sources":["../../../src/@ui/UiListbox/UiListbox.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,EAAgE,cAAc,EAAE,MAAM,YAAY,CAAC;AAG1G;;;;;;GAMG;AACH,wBAAgB,SAAS,CAAC,mBAAmB,EAAE,cAAc,EAAE,EAC3D,KAAK,EAEL,UAAU,EACV,cAAc,EACd,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,OAAO,EACP,kBAAyC,EAEzC,cAAc,EAEd,wBAAmE,EACnE,mBAAyD,EAEzD,kCAAkC,EAClC,mCAAmC,EACnC,mBAA0B,EAC1B,mBAA2B,EAC3B,SAAiB,EAEjB,cAAc,GACjB,EAAE,cAAc,CAAC,mBAAmB,EAAE,cAAc,CAAC,GAAG,KAAK,CAAC,SAAS,
|
|
1
|
+
{"version":3,"file":"UiListbox.d.ts","sourceRoot":"","sources":["../../../src/@ui/UiListbox/UiListbox.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,EAAgE,cAAc,EAAE,MAAM,YAAY,CAAC;AAG1G;;;;;;GAMG;AACH,wBAAgB,SAAS,CAAC,mBAAmB,EAAE,cAAc,EAAE,EAC3D,KAAK,EAEL,UAAU,EACV,cAAc,EACd,KAAK,EACL,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,OAAO,EACP,kBAAyC,EAEzC,cAAc,EAEd,wBAAmE,EACnE,mBAAyD,EAEzD,kCAAkC,EAClC,mCAAmC,EACnC,mBAA0B,EAC1B,mBAA2B,EAC3B,SAAiB,EAEjB,cAAc,GACjB,EAAE,cAAc,CAAC,mBAAmB,EAAE,cAAc,CAAC,GAAG,KAAK,CAAC,SAAS,CAwLvE"}
|
|
@@ -13,7 +13,7 @@ import { DefaultUiListboxStaticItemComponent } from "./defaults/DefaultUiListbox
|
|
|
13
13
|
*
|
|
14
14
|
* @internal
|
|
15
15
|
*/
|
|
16
|
-
export function UiListbox({ items, dataTestId, itemDataTestId, maxWidth, maxHeight, onSelect, onClose, onUnhandledKeyDown = firstCharacterSearch, selectedItemId, InteractiveItemComponent = DefaultUiListboxInteractiveItemComponent, StaticItemComponent = DefaultUiListboxStaticItemComponent, shouldKeyboardActionPreventDefault, shouldKeyboardActionStopPropagation, shouldCloseOnSelect = true, isDisabledFocusable = false, isCompact = false, ariaAttributes, }) {
|
|
16
|
+
export function UiListbox({ items, dataTestId, itemDataTestId, width, maxWidth, maxHeight, onSelect, onClose, onUnhandledKeyDown = firstCharacterSearch, selectedItemId, InteractiveItemComponent = DefaultUiListboxInteractiveItemComponent, StaticItemComponent = DefaultUiListboxStaticItemComponent, shouldKeyboardActionPreventDefault, shouldKeyboardActionStopPropagation, shouldCloseOnSelect = true, isDisabledFocusable = false, isCompact = false, ariaAttributes, }) {
|
|
17
17
|
const isItemFocusable = React.useCallback((item) => {
|
|
18
18
|
if (!item || item.type !== "interactive") {
|
|
19
19
|
return false;
|
|
@@ -44,11 +44,11 @@ export function UiListbox({ items, dataTestId, itemDataTestId, maxWidth, maxHeig
|
|
|
44
44
|
}
|
|
45
45
|
focusedItemNode.scrollIntoView({ block: "nearest" });
|
|
46
46
|
}, [focusedItemNode]);
|
|
47
|
-
const handleSelectItem = React.useCallback((item) => {
|
|
47
|
+
const handleSelectItem = React.useCallback((item, mods) => {
|
|
48
48
|
if (!item || item.isDisabled) {
|
|
49
49
|
return;
|
|
50
50
|
}
|
|
51
|
-
onSelect?.(item);
|
|
51
|
+
onSelect?.(item, mods ?? {});
|
|
52
52
|
shouldCloseOnSelect && onClose?.();
|
|
53
53
|
}, [onClose, onSelect, shouldCloseOnSelect]);
|
|
54
54
|
const contextRef = useAutoupdateRef({
|
|
@@ -97,8 +97,13 @@ export function UiListbox({ items, dataTestId, itemDataTestId, maxWidth, maxHeig
|
|
|
97
97
|
}
|
|
98
98
|
setFocusedIndex(undefined);
|
|
99
99
|
},
|
|
100
|
-
onSelect: () => {
|
|
101
|
-
focusedItem && focusedItem.type === "interactive"
|
|
100
|
+
onSelect: (e) => {
|
|
101
|
+
if (focusedItem && focusedItem.type === "interactive") {
|
|
102
|
+
handleSelectItem(focusedItem, {
|
|
103
|
+
type: "keyboard",
|
|
104
|
+
newTab: e.ctrlKey || e.metaKey,
|
|
105
|
+
});
|
|
106
|
+
}
|
|
102
107
|
},
|
|
103
108
|
onClose,
|
|
104
109
|
onUnhandledKeyDown: (event) => {
|
|
@@ -118,10 +123,13 @@ export function UiListbox({ items, dataTestId, itemDataTestId, maxWidth, maxHeig
|
|
|
118
123
|
shouldKeyboardActionPreventDefault,
|
|
119
124
|
shouldKeyboardActionStopPropagation,
|
|
120
125
|
]);
|
|
121
|
-
return (React.createElement("div", { className: b(), style: { maxWidth, maxHeight }, "data-testid": dataTestId },
|
|
122
|
-
React.createElement("ul", { className: e("items"), tabIndex: 0, onKeyDown: handleKeyDown, "aria-activedescendant": makeItemId(ariaAttributes.id, focusedItem), ...ariaAttributes, role: "listbox" }, items.map((item, index) => item.type === "interactive" ? (React.createElement("li", { key: item.id, ref: (el) => (itemRefs.current[index] = el), role: "option", "aria-selected": item.id === selectedItemId, "aria-disabled": item.isDisabled,
|
|
123
|
-
React.createElement(InteractiveItemComponent, { onSelect: () => {
|
|
124
|
-
handleSelectItem(item
|
|
126
|
+
return (React.createElement("div", { className: b(), style: { width, maxWidth, maxHeight }, "data-testid": dataTestId },
|
|
127
|
+
React.createElement("ul", { className: e("items"), tabIndex: 0, onKeyDown: handleKeyDown, "aria-activedescendant": makeItemId(ariaAttributes.id, focusedItem), ...ariaAttributes, role: "listbox" }, items.map((item, index) => item.type === "interactive" ? (React.createElement("li", { key: item.id, ref: (el) => (itemRefs.current[index] = el), id: makeItemId(ariaAttributes.id, item), role: "option", "aria-selected": item.id === selectedItemId, "aria-disabled": item.isDisabled, "data-testid": itemDataTestId },
|
|
128
|
+
React.createElement(InteractiveItemComponent, { onSelect: (e) => {
|
|
129
|
+
handleSelectItem(item, {
|
|
130
|
+
type: "mouse",
|
|
131
|
+
newTab: e.ctrlKey || e.metaKey || e.button === 1,
|
|
132
|
+
});
|
|
125
133
|
}, item: item, isFocused: index === focusedIndex, isSelected: item.id === selectedItemId, isCompact: isCompact }))) : (React.createElement("li", { key: item.id ?? index, ref: (el) => (itemRefs.current[index] = el), "data-testid": itemDataTestId },
|
|
126
134
|
React.createElement(StaticItemComponent, { item: item })))))));
|
|
127
135
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"UiListbox.js","sourceRoot":"","sources":["../../../src/@ui/UiListbox/UiListbox.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"UiListbox.js","sourceRoot":"","sources":["../../../src/@ui/UiListbox/UiListbox.tsx"],"names":[],"mappings":"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"}
|
|
@@ -33,7 +33,7 @@ export interface UiListboxInteractiveItemProps<T> {
|
|
|
33
33
|
isFocused: boolean;
|
|
34
34
|
isSelected: boolean;
|
|
35
35
|
isCompact: boolean;
|
|
36
|
-
onSelect: () => void;
|
|
36
|
+
onSelect: (e: React.MouseEvent) => void;
|
|
37
37
|
}
|
|
38
38
|
/**
|
|
39
39
|
* @internal
|
|
@@ -65,9 +65,13 @@ export interface UiListboxProps<InteractiveItemData, StaticItemData = React.Reac
|
|
|
65
65
|
items: IUiListboxItem<InteractiveItemData, StaticItemData>[];
|
|
66
66
|
dataTestId?: string;
|
|
67
67
|
itemDataTestId?: string;
|
|
68
|
+
width?: number;
|
|
68
69
|
maxWidth?: number;
|
|
69
70
|
maxHeight?: number;
|
|
70
|
-
onSelect?: (item: IUiListboxInteractiveItem<InteractiveItemData
|
|
71
|
+
onSelect?: (item: IUiListboxInteractiveItem<InteractiveItemData>, mods: {
|
|
72
|
+
type?: "mouse" | "keyboard";
|
|
73
|
+
newTab?: boolean;
|
|
74
|
+
}) => void;
|
|
71
75
|
onClose?: () => void;
|
|
72
76
|
onUnhandledKeyDown?: (event: React.KeyboardEvent, context: IUiListboxContext<InteractiveItemData, StaticItemData>) => void;
|
|
73
77
|
selectedItemId?: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/@ui/UiListbox/types.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,wBAAwB,EAAE,MAAM,yBAAyB,CAAC;AACnE,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE7C;;GAEG;AACH,MAAM,WAAW,oBAAoB,CAAC,CAAC;IACnC,IAAI,EAAE,QAAQ,CAAC;IACf,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,CAAC,CAAC;CACX;AAED;;GAEG;AACH,MAAM,WAAW,yBAAyB,CAAC,CAAC;IACxC,IAAI,EAAE,aAAa,CAAC;IACpB,EAAE,EAAE,MAAM,CAAC;IACX,WAAW,EAAE,MAAM,CAAC;IACpB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,IAAI,EAAE,CAAC,CAAC;IACR,OAAO,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;GAEG;AACH,MAAM,MAAM,cAAc,CAAC,mBAAmB,EAAE,cAAc,GAAG,KAAK,CAAC,SAAS,IAC1E,oBAAoB,CAAC,cAAc,CAAC,GACpC,yBAAyB,CAAC,mBAAmB,CAAC,CAAC;AAErD;;GAEG;AACH,MAAM,WAAW,6BAA6B,CAAC,CAAC;IAC5C,IAAI,EAAE,yBAAyB,CAAC,CAAC,CAAC,CAAC;IAEnC,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,EAAE,OAAO,CAAC;IACpB,SAAS,EAAE,OAAO,CAAC;IAEnB,QAAQ,EAAE,
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/@ui/UiListbox/types.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import type { UiStaticTreeView, LevelTypesUnion, IUiTreeviewItemProps } from "./types.js";
|
|
3
|
+
import { itemsState } from "./utils.js";
|
|
4
|
+
/**
|
|
5
|
+
* @internal
|
|
6
|
+
*/
|
|
7
|
+
interface UITreeviewItemProps<Levels extends [], Level> {
|
|
8
|
+
path: number[];
|
|
9
|
+
item: UiStaticTreeView<Level | LevelTypesUnion<Levels>>;
|
|
10
|
+
getState: ReturnType<typeof itemsState>;
|
|
11
|
+
focusedItem?: UiStaticTreeView<Level>;
|
|
12
|
+
selectedItemId?: string;
|
|
13
|
+
itemDataTestId?: string;
|
|
14
|
+
isCompact?: boolean;
|
|
15
|
+
onSelectHandle: (e: React.MouseEvent | React.KeyboardEvent, path: number[], item: UiStaticTreeView<Level | LevelTypesUnion<Levels>>) => void;
|
|
16
|
+
ItemComponent: React.ComponentType<IUiTreeviewItemProps<Level | LevelTypesUnion<Levels>>>;
|
|
17
|
+
}
|
|
18
|
+
/**
|
|
19
|
+
* @internal
|
|
20
|
+
*/
|
|
21
|
+
export declare function UITreeviewItem<Levels extends [], Level>(props: UITreeviewItemProps<Levels, Level>): React.JSX.Element;
|
|
22
|
+
export {};
|
|
23
|
+
//# sourceMappingURL=UITreeviewItem.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"UITreeviewItem.d.ts","sourceRoot":"","sources":["../../../src/@ui/UiTreeview/UITreeviewItem.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAG3C,OAAO,KAAK,EAAE,gBAAgB,EAAE,eAAe,EAAE,oBAAoB,EAAE,MAAM,YAAY,CAAC;AAC1F,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAExC;;GAEG;AACH,UAAU,mBAAmB,CAAC,MAAM,SAAS,EAAE,EAAE,KAAK;IAClD,IAAI,EAAE,MAAM,EAAE,CAAC;IACf,IAAI,EAAE,gBAAgB,CAAC,KAAK,GAAG,eAAe,CAAC,MAAM,CAAC,CAAC,CAAC;IACxD,QAAQ,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;IACxC,WAAW,CAAC,EAAE,gBAAgB,CAAC,KAAK,CAAC,CAAC;IACtC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,EAAE,CACZ,CAAC,EAAE,KAAK,CAAC,UAAU,GAAG,KAAK,CAAC,aAAa,EACzC,IAAI,EAAE,MAAM,EAAE,EACd,IAAI,EAAE,gBAAgB,CAAC,KAAK,GAAG,eAAe,CAAC,MAAM,CAAC,CAAC,KACtD,IAAI,CAAC;IACV,aAAa,EAAE,KAAK,CAAC,aAAa,CAAC,oBAAoB,CAAC,KAAK,GAAG,eAAe,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;CAC7F;AAED;;GAEG;AACH,wBAAgB,cAAc,CAAC,MAAM,SAAS,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,mBAAmB,CAAC,MAAM,EAAE,KAAK,CAAC,qBAyFjG"}
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
// (C) 2025 GoodData Corporation
|
|
2
|
+
import React, { useCallback } from "react";
|
|
3
|
+
import { e } from "./treeviewBem.js";
|
|
4
|
+
/**
|
|
5
|
+
* @internal
|
|
6
|
+
*/
|
|
7
|
+
export function UITreeviewItem(props) {
|
|
8
|
+
const { getState, focusedItem, selectedItemId, itemDataTestId, onSelectHandle, ItemComponent, isCompact, } = props;
|
|
9
|
+
const [state, setState] = getState(props.path);
|
|
10
|
+
const { item, children } = props.item;
|
|
11
|
+
const level = props.path.length;
|
|
12
|
+
const isFocused = item === focusedItem.item;
|
|
13
|
+
const isSelected = item.id === selectedItemId;
|
|
14
|
+
const isExpanded = state.expanded;
|
|
15
|
+
const onToggleHandle = useCallback((e, expanded) => {
|
|
16
|
+
setState({
|
|
17
|
+
...state,
|
|
18
|
+
expanded,
|
|
19
|
+
});
|
|
20
|
+
e.stopPropagation();
|
|
21
|
+
e.preventDefault();
|
|
22
|
+
}, [setState, state]);
|
|
23
|
+
const onInnerSelectHandle = useCallback((e) => {
|
|
24
|
+
onSelectHandle(e, props.path, props.item);
|
|
25
|
+
}, [props.item, props.path, onSelectHandle]);
|
|
26
|
+
return (React.createElement("div", { className: e("treeitem") },
|
|
27
|
+
React.createElement("div", { className: e("treeitem__container"), "data-testid": itemDataTestId, role: "treeitem", "aria-level": level, "aria-expanded": isExpanded ? "true" : "false", "aria-selected": isSelected ? "true" : "false", "aria-disabled": item.isDisabled ? "true" : "false" },
|
|
28
|
+
React.createElement(ItemComponent, { item: item, type: children?.length ? "group" : "leaf", isCompact: isCompact, isFocused: isFocused, isSelected: isSelected, isExpanded: isExpanded, level: level, onSelect: onInnerSelectHandle, onToggle: onToggleHandle, defaultStyle: defineVariables(level), defaultClassName: e("item", {
|
|
29
|
+
isFocused,
|
|
30
|
+
isSelected,
|
|
31
|
+
isCompact,
|
|
32
|
+
isExpanded,
|
|
33
|
+
isDisabled: !!item.isDisabled,
|
|
34
|
+
}) })),
|
|
35
|
+
children?.length && isExpanded ? (React.createElement("div", { role: "group", className: e("treeitem__children") }, children.map((child, i) => (React.createElement(UITreeviewItem, { ItemComponent: ItemComponent, onSelectHandle: onSelectHandle, getState: getState, focusedItem: focusedItem, selectedItemId: selectedItemId, itemDataTestId: itemDataTestId, isCompact: isCompact, item: child, key: i, path: [...props.path, i] }))))) : null));
|
|
36
|
+
}
|
|
37
|
+
function defineVariables(level) {
|
|
38
|
+
return { "--ui-treeview-item-level": level };
|
|
39
|
+
}
|
|
40
|
+
//# sourceMappingURL=UITreeviewItem.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"UITreeviewItem.js","sourceRoot":"","sources":["../../../src/@ui/UiTreeview/UITreeviewItem.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { IUiLeveledTreeViewProps, IUiStaticTreeViewProps } from "./types.js";
|
|
3
|
+
/**
|
|
4
|
+
* An accessible treeview component with static data that can be navigated by keyboard.
|
|
5
|
+
* This is component for tree where all items are same type.
|
|
6
|
+
* Usable in a <Dropdown /> component.
|
|
7
|
+
* Should implement https://www.w3.org/WAI/ARIA/apg/patterns/treeview/
|
|
8
|
+
*
|
|
9
|
+
* @internal
|
|
10
|
+
*/
|
|
11
|
+
export declare function UiStaticTreeview<Level>(props: IUiStaticTreeViewProps<Level>): React.JSX.Element;
|
|
12
|
+
/**
|
|
13
|
+
* An accessible treeview component with static data that can be navigated by keyboard.
|
|
14
|
+
* This is component for tree where on each level items have different types.
|
|
15
|
+
* Usable in a <Dropdown /> component.
|
|
16
|
+
* Should implement https://www.w3.org/WAI/ARIA/apg/patterns/treeview/
|
|
17
|
+
*
|
|
18
|
+
* @internal
|
|
19
|
+
*/
|
|
20
|
+
export declare function UiLeveledTreeview<Levels extends unknown[]>(props: IUiLeveledTreeViewProps<Levels>): React.JSX.Element;
|
|
21
|
+
//# sourceMappingURL=UiTreeview.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"UiTreeview.d.ts","sourceRoot":"","sources":["../../../src/@ui/UiTreeview/UiTreeview.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4D,MAAM,OAAO,CAAC;AAQjF,OAAO,EACH,uBAAuB,EACvB,sBAAsB,EAMzB,MAAM,YAAY,CAAC;AAapB;;;;;;;GAOG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,KAAK,EAAE,sBAAsB,CAAC,KAAK,CAAC,qBAE3E;AAED;;;;;;;GAOG;AACH,wBAAgB,iBAAiB,CAAC,MAAM,SAAS,OAAO,EAAE,EAAE,KAAK,EAAE,uBAAuB,CAAC,MAAM,CAAC,qBAEjG"}
|
|
@@ -0,0 +1,185 @@
|
|
|
1
|
+
// (C) 2025 GoodData Corporation
|
|
2
|
+
import React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
|
|
3
|
+
import noop from "lodash/noop.js";
|
|
4
|
+
import { useAutoupdateRef } from "@gooddata/sdk-ui";
|
|
5
|
+
import { makeMenuKeyboardNavigation } from "../@utils/keyboardNavigation.js";
|
|
6
|
+
import { DefaultUiTreeViewItemComponent } from "./defaults/DefaultUiTreeViewItemComponent.js";
|
|
7
|
+
import { b } from "./treeviewBem.js";
|
|
8
|
+
import { findPath, getItemOnFocusedPath, getRefOnFocusedPath, getParentPathIndex, getNextPathIndex, getPrevPathIndex, itemsState, } from "./utils.js";
|
|
9
|
+
import { UiTreeviewRoot } from "./UiTreeviewRoot.js";
|
|
10
|
+
import { UITreeviewItem } from "./UITreeviewItem.js";
|
|
11
|
+
/**
|
|
12
|
+
* An accessible treeview component with static data that can be navigated by keyboard.
|
|
13
|
+
* This is component for tree where all items are same type.
|
|
14
|
+
* Usable in a <Dropdown /> component.
|
|
15
|
+
* Should implement https://www.w3.org/WAI/ARIA/apg/patterns/treeview/
|
|
16
|
+
*
|
|
17
|
+
* @internal
|
|
18
|
+
*/
|
|
19
|
+
export function UiStaticTreeview(props) {
|
|
20
|
+
return React.createElement(UiTreeview, { ...props });
|
|
21
|
+
}
|
|
22
|
+
/**
|
|
23
|
+
* An accessible treeview component with static data that can be navigated by keyboard.
|
|
24
|
+
* This is component for tree where on each level items have different types.
|
|
25
|
+
* Usable in a <Dropdown /> component.
|
|
26
|
+
* Should implement https://www.w3.org/WAI/ARIA/apg/patterns/treeview/
|
|
27
|
+
*
|
|
28
|
+
* @internal
|
|
29
|
+
*/
|
|
30
|
+
export function UiLeveledTreeview(props) {
|
|
31
|
+
return React.createElement(UiTreeview, { ...props });
|
|
32
|
+
}
|
|
33
|
+
function UiTreeview({ items, selectionMode = "groups-and-leafs", expandedMode = "default-expanded", dataTestId, itemDataTestId, width, maxWidth, maxHeight, onSelect, onClose, onUnhandledKeyDown = noop, selectedItemId, ItemComponent = DefaultUiTreeViewItemComponent, shouldKeyboardActionPreventDefault, shouldKeyboardActionStopPropagation, shouldCloseOnSelect = true, isDisabledFocusable = false, isCompact = false, ariaAttributes, }) {
|
|
34
|
+
const itemsRef = useRef([]);
|
|
35
|
+
const getState = itemsState(useState({}), {
|
|
36
|
+
expanded: expandedMode === "default-expanded",
|
|
37
|
+
});
|
|
38
|
+
const isItemFocusable = useCallback((item) => {
|
|
39
|
+
if (!item) {
|
|
40
|
+
return false;
|
|
41
|
+
}
|
|
42
|
+
return isDisabledFocusable || !item.item.isDisabled;
|
|
43
|
+
}, [isDisabledFocusable]);
|
|
44
|
+
const [focusedPath, setFocusedPath] = useState(() => findPath(items, selectedItemId, isItemFocusable));
|
|
45
|
+
const focusedItem = getItemOnFocusedPath(items, focusedPath);
|
|
46
|
+
// Scroll focused item into view
|
|
47
|
+
const focusedItemNode = getRefOnFocusedPath(itemsRef.current, focusedPath);
|
|
48
|
+
useEffect(() => {
|
|
49
|
+
focusedItemNode?.item.scrollIntoView({ block: "nearest" });
|
|
50
|
+
}, [focusedItemNode]);
|
|
51
|
+
const onSelectHandle = useCallback((e, path, item) => {
|
|
52
|
+
if (!item || item.item.isDisabled) {
|
|
53
|
+
return;
|
|
54
|
+
}
|
|
55
|
+
function doSelect() {
|
|
56
|
+
if (e.nativeEvent instanceof KeyboardEvent) {
|
|
57
|
+
onSelect?.(item.item.data, {
|
|
58
|
+
type: "keyboard",
|
|
59
|
+
newTab: e.ctrlKey || e.metaKey,
|
|
60
|
+
});
|
|
61
|
+
}
|
|
62
|
+
else {
|
|
63
|
+
onSelect?.(item.item.data, {
|
|
64
|
+
type: "mouse",
|
|
65
|
+
newTab: e.ctrlKey || e.metaKey || e.nativeEvent.button === 1,
|
|
66
|
+
});
|
|
67
|
+
}
|
|
68
|
+
shouldCloseOnSelect && onClose?.();
|
|
69
|
+
}
|
|
70
|
+
switch (selectionMode) {
|
|
71
|
+
case "groups-and-leafs":
|
|
72
|
+
doSelect();
|
|
73
|
+
break;
|
|
74
|
+
case "groups-only":
|
|
75
|
+
// Group has children even if there are empty
|
|
76
|
+
if (item.children) {
|
|
77
|
+
doSelect();
|
|
78
|
+
}
|
|
79
|
+
break;
|
|
80
|
+
case "leafs-only": {
|
|
81
|
+
// Leaf has no children
|
|
82
|
+
if (!item.children) {
|
|
83
|
+
doSelect();
|
|
84
|
+
return;
|
|
85
|
+
}
|
|
86
|
+
// Toggle group is leaf-only selection mode
|
|
87
|
+
const [state, setState] = getState(path);
|
|
88
|
+
setState({
|
|
89
|
+
...state,
|
|
90
|
+
expanded: !state.expanded,
|
|
91
|
+
});
|
|
92
|
+
break;
|
|
93
|
+
}
|
|
94
|
+
}
|
|
95
|
+
}, [getState, onClose, onSelect, selectionMode, shouldCloseOnSelect]);
|
|
96
|
+
const contextRef = useAutoupdateRef({
|
|
97
|
+
itemsRef,
|
|
98
|
+
items,
|
|
99
|
+
onClose,
|
|
100
|
+
selectedItemId,
|
|
101
|
+
onSelect: onSelectHandle,
|
|
102
|
+
isItemFocusable,
|
|
103
|
+
setFocusedPath,
|
|
104
|
+
});
|
|
105
|
+
const handleKeyDown = useMemo(() => makeMenuKeyboardNavigation({
|
|
106
|
+
onFocusPrevious: () => {
|
|
107
|
+
setFocusedPath((prevPath) => {
|
|
108
|
+
return getPrevPathIndex(items, getState, prevPath, isItemFocusable);
|
|
109
|
+
});
|
|
110
|
+
},
|
|
111
|
+
onFocusNext: () => {
|
|
112
|
+
setFocusedPath((prevPath) => {
|
|
113
|
+
return getNextPathIndex(items, getState, prevPath, isItemFocusable);
|
|
114
|
+
});
|
|
115
|
+
},
|
|
116
|
+
onFocusFirst: () => {
|
|
117
|
+
setFocusedPath(() => {
|
|
118
|
+
return getPrevPathIndex(items, getState, [], isItemFocusable);
|
|
119
|
+
});
|
|
120
|
+
},
|
|
121
|
+
onFocusLast: () => {
|
|
122
|
+
setFocusedPath(() => {
|
|
123
|
+
return getNextPathIndex(items, getState, [], isItemFocusable);
|
|
124
|
+
});
|
|
125
|
+
},
|
|
126
|
+
onEnterLevel: () => {
|
|
127
|
+
const [state, setState] = getState(focusedPath);
|
|
128
|
+
if (!focusedItem.children?.length) {
|
|
129
|
+
return;
|
|
130
|
+
}
|
|
131
|
+
if (state.expanded) {
|
|
132
|
+
setFocusedPath((prevPath) => {
|
|
133
|
+
return getNextPathIndex(items, getState, prevPath, isItemFocusable);
|
|
134
|
+
});
|
|
135
|
+
}
|
|
136
|
+
else {
|
|
137
|
+
setState({
|
|
138
|
+
...state,
|
|
139
|
+
expanded: true,
|
|
140
|
+
});
|
|
141
|
+
}
|
|
142
|
+
},
|
|
143
|
+
onLeaveLevel: () => {
|
|
144
|
+
const [state, setState] = getState(focusedPath);
|
|
145
|
+
if (!focusedItem.children?.length || !state.expanded) {
|
|
146
|
+
setFocusedPath((prevPath) => {
|
|
147
|
+
return getParentPathIndex(items, getState, prevPath, isItemFocusable);
|
|
148
|
+
});
|
|
149
|
+
}
|
|
150
|
+
else {
|
|
151
|
+
setState({
|
|
152
|
+
...state,
|
|
153
|
+
expanded: false,
|
|
154
|
+
});
|
|
155
|
+
}
|
|
156
|
+
},
|
|
157
|
+
onSelect: (e) => {
|
|
158
|
+
if (focusedItem) {
|
|
159
|
+
onSelectHandle(e, focusedPath, focusedItem);
|
|
160
|
+
}
|
|
161
|
+
},
|
|
162
|
+
onClose,
|
|
163
|
+
onUnhandledKeyDown: (event) => {
|
|
164
|
+
onUnhandledKeyDown(event, contextRef.current);
|
|
165
|
+
},
|
|
166
|
+
}, {
|
|
167
|
+
shouldPreventDefault: shouldKeyboardActionPreventDefault,
|
|
168
|
+
shouldStopPropagation: shouldKeyboardActionStopPropagation,
|
|
169
|
+
}), [
|
|
170
|
+
contextRef,
|
|
171
|
+
focusedItem,
|
|
172
|
+
focusedPath,
|
|
173
|
+
getState,
|
|
174
|
+
isItemFocusable,
|
|
175
|
+
items,
|
|
176
|
+
onClose,
|
|
177
|
+
onSelectHandle,
|
|
178
|
+
onUnhandledKeyDown,
|
|
179
|
+
shouldKeyboardActionPreventDefault,
|
|
180
|
+
shouldKeyboardActionStopPropagation,
|
|
181
|
+
]);
|
|
182
|
+
return (React.createElement("div", { className: b(), style: { width, maxWidth, maxHeight }, "data-testid": dataTestId },
|
|
183
|
+
React.createElement(UiTreeviewRoot, { handleKeyDown: handleKeyDown, ariaAttributes: ariaAttributes, focusedItem: focusedItem }, items.map((item, index) => (React.createElement(UITreeviewItem, { ItemComponent: ItemComponent, onSelectHandle: onSelectHandle, getState: getState, focusedItem: focusedItem, selectedItemId: selectedItemId, itemDataTestId: itemDataTestId, isCompact: isCompact, item: item, key: index, path: [index] }))))));
|
|
184
|
+
}
|
|
185
|
+
//# sourceMappingURL=UiTreeview.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"UiTreeview.js","sourceRoot":"","sources":["../../../src/@ui/UiTreeview/UiTreeview.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import type { UiStaticTreeView, UiTreeviewAriaAttributes } from "./types.js";
|
|
3
|
+
/**
|
|
4
|
+
* @internal
|
|
5
|
+
*/
|
|
6
|
+
interface UiTreeviewRootProps {
|
|
7
|
+
children?: React.ReactNode;
|
|
8
|
+
focusedItem?: UiStaticTreeView<unknown>;
|
|
9
|
+
handleKeyDown: (event: React.KeyboardEvent) => void;
|
|
10
|
+
ariaAttributes: UiTreeviewAriaAttributes;
|
|
11
|
+
}
|
|
12
|
+
/**
|
|
13
|
+
* @internal
|
|
14
|
+
*/
|
|
15
|
+
export declare function UiTreeviewRoot(props: UiTreeviewRootProps): React.JSX.Element;
|
|
16
|
+
export {};
|
|
17
|
+
//# sourceMappingURL=UiTreeviewRoot.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"UiTreeviewRoot.d.ts","sourceRoot":"","sources":["../../../src/@ui/UiTreeview/UiTreeviewRoot.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,KAAK,EAAE,gBAAgB,EAAE,wBAAwB,EAAE,MAAM,YAAY,CAAC;AAG7E;;GAEG;AACH,UAAU,mBAAmB;IACzB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,WAAW,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IACxC,aAAa,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,aAAa,KAAK,IAAI,CAAC;IACpD,cAAc,EAAE,wBAAwB,CAAC;CAC5C;AAED;;GAEG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,qBAcxD"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
// (C) 2025 GoodData Corporation
|
|
2
|
+
import React from "react";
|
|
3
|
+
import { e } from "./treeviewBem.js";
|
|
4
|
+
import { makeItemId } from "./utils.js";
|
|
5
|
+
/**
|
|
6
|
+
* @internal
|
|
7
|
+
*/
|
|
8
|
+
export function UiTreeviewRoot(props) {
|
|
9
|
+
const { handleKeyDown, children, ariaAttributes, focusedItem } = props;
|
|
10
|
+
return (React.createElement("div", { className: e("root"), tabIndex: 0, onKeyDown: handleKeyDown, role: "tree", "aria-activedescendant": makeItemId(ariaAttributes.id, focusedItem), ...ariaAttributes }, children));
|
|
11
|
+
}
|
|
12
|
+
//# sourceMappingURL=UiTreeviewRoot.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"UiTreeviewRoot.js","sourceRoot":"","sources":["../../../src/@ui/UiTreeview/UiTreeviewRoot.tsx"],"names":[],"mappings":"AAAA,gCAAgC;AAEhC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,CAAC,EAAE,MAAM,kBAAkB,CAAC;AAErC,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAYxC;;GAEG;AACH,MAAM,UAAU,cAAc,CAAC,KAA0B;IACrD,MAAM,EAAE,aAAa,EAAE,QAAQ,EAAE,cAAc,EAAE,WAAW,EAAE,GAAG,KAAK,CAAC;IACvE,OAAO,CACH,6BACI,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EACpB,QAAQ,EAAE,CAAC,EACX,SAAS,EAAE,aAAa,EACxB,IAAI,EAAC,MAAM,2BACY,UAAU,CAAC,cAAc,CAAC,EAAE,EAAE,WAAW,CAAC,KAC7D,cAAc,IAEjB,QAAQ,CACP,CACT,CAAC;AACN,CAAC"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { IUiTreeviewItemProps } from "../types.js";
|
|
3
|
+
/**
|
|
4
|
+
* @internal
|
|
5
|
+
*/
|
|
6
|
+
export declare function DefaultUiTreeViewItemComponent<Level>({ item, type, defaultClassName, defaultStyle, isExpanded, onToggle, onSelect, }: IUiTreeviewItemProps<Level>): React.ReactNode;
|
|
7
|
+
//# sourceMappingURL=DefaultUiTreeViewItemComponent.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DefaultUiTreeViewItemComponent.d.ts","sourceRoot":"","sources":["../../../../src/@ui/UiTreeview/defaults/DefaultUiTreeViewItemComponent.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAC;AAMnD;;GAEG;AACH,wBAAgB,8BAA8B,CAAC,KAAK,EAAE,EAClD,IAAI,EACJ,IAAI,EACJ,gBAAgB,EAChB,YAAY,EACZ,UAAU,EACV,QAAQ,EACR,QAAQ,GACX,EAAE,oBAAoB,CAAC,KAAK,CAAC,GAAG,KAAK,CAAC,SAAS,CA2C/C"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
// (C) 2025 GoodData Corporation
|
|
2
|
+
import React from "react";
|
|
3
|
+
import { UiIcon } from "../../UiIcon/UiIcon.js";
|
|
4
|
+
import { e } from "../treeviewBem.js";
|
|
5
|
+
import { ShortenedText } from "../../../ShortenedText/index.js";
|
|
6
|
+
import { UiTooltip } from "../../UiTooltip/UiTooltip.js";
|
|
7
|
+
/**
|
|
8
|
+
* @internal
|
|
9
|
+
*/
|
|
10
|
+
export function DefaultUiTreeViewItemComponent({ item, type, defaultClassName, defaultStyle, isExpanded, onToggle, onSelect, }) {
|
|
11
|
+
return (React.createElement("div", { style: defaultStyle, className: defaultClassName, onClick: item.isDisabled ? undefined : onSelect },
|
|
12
|
+
type === "group" ? (React.createElement("div", { className: e("item__item-arrow"), onClick: (e) => {
|
|
13
|
+
onToggle(e, !isExpanded);
|
|
14
|
+
e.stopPropagation();
|
|
15
|
+
e.preventDefault();
|
|
16
|
+
} },
|
|
17
|
+
React.createElement(UiIcon, { type: "navigateRight", size: 16, color: "complementary-7" }))) : null,
|
|
18
|
+
item.icon ? (React.createElement("div", { className: e("item__item-icon") },
|
|
19
|
+
React.createElement(UiIcon, { type: item.icon, size: 16, color: "complementary-7" }))) : null,
|
|
20
|
+
React.createElement(ShortenedText, { className: e("item__item-title"), ellipsisPosition: "end" }, item.stringTitle),
|
|
21
|
+
item.tooltip ? (React.createElement(UiTooltip, { anchor: React.createElement("div", { className: e("item__item-explanation") },
|
|
22
|
+
React.createElement(UiIcon, { type: "question", size: 14, color: "complementary-7" })), content: item.tooltip, triggerBy: ["hover", "focus"], arrowPlacement: "left", optimalPlacement: true, width: 200 })) : null));
|
|
23
|
+
}
|
|
24
|
+
//# sourceMappingURL=DefaultUiTreeViewItemComponent.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DefaultUiTreeViewItemComponent.js","sourceRoot":"","sources":["../../../../src/@ui/UiTreeview/defaults/DefaultUiTreeViewItemComponent.tsx"],"names":[],"mappings":"AAAA,gCAAgC;AAEhC,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAChD,OAAO,EAAE,CAAC,EAAE,MAAM,mBAAmB,CAAC;AACtC,OAAO,EAAE,aAAa,EAAE,MAAM,iCAAiC,CAAC;AAChE,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAEzD;;GAEG;AACH,MAAM,UAAU,8BAA8B,CAAQ,EAClD,IAAI,EACJ,IAAI,EACJ,gBAAgB,EAChB,YAAY,EACZ,UAAU,EACV,QAAQ,EACR,QAAQ,GACkB;IAC1B,OAAO,CACH,6BACI,KAAK,EAAE,YAAY,EACnB,SAAS,EAAE,gBAAgB,EAC3B,OAAO,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ;QAE9C,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,CAChB,6BACI,SAAS,EAAE,CAAC,CAAC,kBAAkB,CAAC,EAChC,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;gBACX,QAAQ,CAAC,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC;gBACzB,CAAC,CAAC,eAAe,EAAE,CAAC;gBACpB,CAAC,CAAC,cAAc,EAAE,CAAC;YACvB,CAAC;YAED,oBAAC,MAAM,IAAC,IAAI,EAAC,eAAe,EAAC,IAAI,EAAE,EAAE,EAAE,KAAK,EAAC,iBAAiB,GAAG,CAC/D,CACT,CAAC,CAAC,CAAC,IAAI;QACP,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CACT,6BAAK,SAAS,EAAE,CAAC,CAAC,iBAAiB,CAAC;YAChC,oBAAC,MAAM,IAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,EAAE,EAAE,KAAK,EAAC,iBAAiB,GAAG,CAC3D,CACT,CAAC,CAAC,CAAC,IAAI;QACR,oBAAC,aAAa,IAAC,SAAS,EAAE,CAAC,CAAC,kBAAkB,CAAC,EAAE,gBAAgB,EAAE,KAAK,IACnE,IAAI,CAAC,WAAW,CACL;QACf,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CACZ,oBAAC,SAAS,IACN,MAAM,EACF,6BAAK,SAAS,EAAE,CAAC,CAAC,wBAAwB,CAAC;gBACvC,oBAAC,MAAM,IAAC,IAAI,EAAC,UAAU,EAAC,IAAI,EAAE,EAAE,EAAE,KAAK,EAAC,iBAAiB,GAAG,CAC1D,EAEV,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,SAAS,EAAE,CAAC,OAAO,EAAE,OAAO,CAAC,EAC7B,cAAc,EAAC,MAAM,EACrB,gBAAgB,EAAE,IAAI,EACtB,KAAK,EAAE,GAAG,GACZ,CACL,CAAC,CAAC,CAAC,IAAI,CACN,CACT,CAAC;AACN,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"treeviewBem.d.ts","sourceRoot":"","sources":["../../../src/@ui/UiTreeview/treeviewBem.ts"],"names":[],"mappings":"AAGA,eAAO,MAAQ,CAAC,6DAAE,CAAC,4EAA8B,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"treeviewBem.js","sourceRoot":"","sources":["../../../src/@ui/UiTreeview/treeviewBem.ts"],"names":[],"mappings":"AAAA,gCAAgC;AAChC,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AAEvC,MAAM,CAAC,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,GAAG,CAAC,oBAAoB,CAAC,CAAC"}
|