@gooddata/sdk-ui-kit 11.12.0-alpha.3 → 11.12.0-alpha.5
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/UiAsyncTable/UiAsyncTable/UiAsyncTableToolbar.js +1 -3
- package/esm/@ui/UiAsyncTable/UiAsyncTable/UiAsyncTableToolbar.js.map +1 -1
- package/esm/@ui/UiTabs/defaultComponents/DefaultUiTabsContainer.d.ts.map +1 -1
- package/esm/@ui/UiTabs/defaultComponents/DefaultUiTabsContainer.js +8 -12
- package/esm/@ui/UiTabs/defaultComponents/DefaultUiTabsContainer.js.map +1 -1
- package/esm/@ui/UiTabs/defaultComponents/DefaultUiTabsTab.d.ts +1 -1
- package/esm/@ui/UiTabs/defaultComponents/DefaultUiTabsTab.d.ts.map +1 -1
- package/esm/@ui/UiTabs/defaultComponents/DefaultUiTabsTab.js +7 -5
- package/esm/@ui/UiTabs/defaultComponents/DefaultUiTabsTab.js.map +1 -1
- package/esm/@ui/UiTabs/defaultComponents/DefaultUiTabsTabActions.d.ts.map +1 -1
- package/esm/@ui/UiTabs/defaultComponents/DefaultUiTabsTabActions.js +9 -1
- package/esm/@ui/UiTabs/defaultComponents/DefaultUiTabsTabActions.js.map +1 -1
- package/esm/@ui/UiTabs/types.d.ts +5 -2
- package/esm/@ui/UiTabs/types.d.ts.map +1 -1
- package/esm/@ui/UiTabs/useTabsKeyboardNavigation.d.ts +20 -0
- package/esm/@ui/UiTabs/useTabsKeyboardNavigation.d.ts.map +1 -0
- package/esm/@ui/UiTabs/useTabsKeyboardNavigation.js +64 -0
- package/esm/@ui/UiTabs/useTabsKeyboardNavigation.js.map +1 -0
- package/esm/Dropdown/DropdownInvertableSelect.d.ts +5 -1
- package/esm/Dropdown/DropdownInvertableSelect.d.ts.map +1 -1
- package/esm/Dropdown/DropdownInvertableSelect.js +2 -2
- package/esm/Dropdown/DropdownInvertableSelect.js.map +1 -1
- package/esm/FilterGroupItem/FilterGroupItem.d.ts +95 -0
- package/esm/FilterGroupItem/FilterGroupItem.d.ts.map +1 -0
- package/esm/FilterGroupItem/FilterGroupItem.js +31 -0
- package/esm/FilterGroupItem/FilterGroupItem.js.map +1 -0
- package/esm/FilterGroupItem/index.d.ts +3 -0
- package/esm/FilterGroupItem/index.d.ts.map +1 -0
- package/esm/FilterGroupItem/index.js +3 -0
- package/esm/FilterGroupItem/index.js.map +1 -0
- package/esm/List/InvertableSelect/InvertableSelectItem.d.ts +8 -1
- package/esm/List/InvertableSelect/InvertableSelectItem.d.ts.map +1 -1
- package/esm/List/InvertableSelect/InvertableSelectItem.js +2 -2
- package/esm/List/InvertableSelect/InvertableSelectItem.js.map +1 -1
- package/esm/List/InvertableSelect/index.d.ts +1 -1
- package/esm/List/InvertableSelect/index.d.ts.map +1 -1
- package/esm/List/InvertableSelect/index.js +1 -0
- package/esm/List/InvertableSelect/index.js.map +1 -1
- package/esm/List/index.d.ts +1 -1
- package/esm/List/index.d.ts.map +1 -1
- package/esm/List/index.js.map +1 -1
- package/esm/Overlay/Overlay.d.ts.map +1 -1
- package/esm/Overlay/Overlay.js +12 -10
- package/esm/Overlay/Overlay.js.map +1 -1
- package/esm/index.d.ts +1 -0
- package/esm/index.d.ts.map +1 -1
- package/esm/index.js +1 -0
- package/esm/index.js.map +1 -1
- package/esm/sdk-ui-kit.d.ts +107 -3
- package/package.json +11 -11
- package/src/FilterGroupItem/FilterGroupItem.scss +134 -0
- package/styles/css/main.css +111 -0
- package/styles/css/main.css.map +1 -1
- package/styles/scss/main.scss +1 -0
|
@@ -21,7 +21,6 @@ export function UiAsyncTableToolbar(props) {
|
|
|
21
21
|
const useAsyncTableToolbar = ({ filters, isFiltersTooLarge, bulkActions, selectedItemIds, setSelectedItemIds, totalItemsCount, items, variant, isMobileView, width, onSearch, renderToolbarCustomElement, accessibilityConfig, }) => {
|
|
22
22
|
const intl = useIntl();
|
|
23
23
|
const { searchValue, setSearchValue } = useAsyncTableSearch(onSearch);
|
|
24
|
-
const isSmall = variant === "small";
|
|
25
24
|
const handleCheckboxChange = useCallback(() => {
|
|
26
25
|
setSelectedItemIds(selectedItemIds?.length === 0 ? items.map((item) => item.id) : []);
|
|
27
26
|
}, [selectedItemIds, items, setSelectedItemIds]);
|
|
@@ -42,14 +41,13 @@ const useAsyncTableToolbar = ({ filters, isFiltersTooLarge, bulkActions, selecte
|
|
|
42
41
|
totalCount: totalItemsCount,
|
|
43
42
|
});
|
|
44
43
|
const tooltipMessage = intl.formatMessage(messages["selectAll"]);
|
|
45
|
-
if (bulkActions
|
|
44
|
+
if (bulkActions) {
|
|
46
45
|
return (_jsxs("div", { className: e("toolbar-bulk-actions", { "mobile-view": isMobileView }), children: [_jsxs("div", { className: e("toolbar-checkbox-section"), children: [_jsx(UiTooltip, { anchor: _jsx(UiAsyncTableCheckbox, { onChange: handleCheckboxChange, checked: isCheckboxChecked, indeterminate: isCheckboxIndeterminate, disabled: isCheckboxDisabled, ariaLabel: checkboxAriaLabel, header: true }), triggerBy: ["hover", "focus"], content: tooltipMessage }), _jsx("div", { id: ASYNC_TABLE_SELECTED_COUNT_ID, className: e("toolbar-selected-count"), children: selectedMessage })] }), selectedItemIds?.length > 0 ? (_jsx(UiAsyncTableBulkActions, { bulkActions: bulkActions })) : null] }));
|
|
47
46
|
}
|
|
48
47
|
return null;
|
|
49
48
|
}, [
|
|
50
49
|
bulkActions,
|
|
51
50
|
selectedItemIds,
|
|
52
|
-
isSmall,
|
|
53
51
|
isMobileView,
|
|
54
52
|
totalItemsCount,
|
|
55
53
|
intl,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"UiAsyncTableToolbar.js","sourceRoot":"","sources":["../../../../src/@ui/UiAsyncTable/UiAsyncTable/UiAsyncTableToolbar.tsx"],"names":[],"mappings":";AAAA,gCAAgC;AAEhC,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAE7C,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAErC,OAAO,EAAE,2BAA2B,EAAE,6BAA6B,EAAE,MAAM,gBAAgB,CAAC;AAC5F,OAAO,EAAE,uBAAuB,EAAE,MAAM,8BAA8B,CAAC;AACvE,OAAO,EAAE,oBAAoB,EAAE,MAAM,2BAA2B,CAAC;AACjE,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAC/C,OAAO,EAAE,2BAA2B,EAAE,MAAM,kEAAkE,CAAC;AAC/G,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,CAAC,EAAE,MAAM,qBAAqB,CAAC;AACxC,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAEzC,OAAO,EAAE,mBAAmB,EAAE,MAAM,2BAA2B,CAAC;AAEhE,MAAM,UAAU,mBAAmB,CAA2B,KAAkC;IAC5F,MAAM,EAAE,UAAU,EAAE,iBAAiB,EAAE,aAAa,EAAE,mBAAmB,EAAE,GAAG,oBAAoB,CAAC,KAAK,CAAC,CAAC;IAE1G,MAAM,EAAE,YAAY,EAAE,OAAO,EAAE,GAAG,KAAK,CAAC;IACxC,MAAM,OAAO,GAAG,OAAO,KAAK,OAAO,CAAC;IAEpC,OAAO,UAAU,CAAC,CAAC,CAAC,CAChB,eAAK,SAAS,EAAE,CAAC,CAAC,SAAS,CAAC,aACxB,eAAK,SAAS,EAAE,CAAC,CAAC,aAAa,EAAE,EAAE,aAAa,EAAE,YAAY,EAAE,CAAC,aAC5D,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,iBAAiB,EAAE,EACpC,aAAa,EAAE,EACf,mBAAmB,EAAE,IACpB,EACL,OAAO,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC,CAAC,CAAC,IAAI,IACnC,CACT,CAAC,CAAC,CAAC,IAAI,CAAC;AACb,CAAC;AAED,MAAM,oBAAoB,GAAG,CAA2B,EACpD,OAAO,EACP,iBAAiB,EACjB,WAAW,EACX,eAAe,EACf,kBAAkB,EAClB,eAAe,EACf,KAAK,EACL,OAAO,EACP,YAAY,EACZ,KAAK,EACL,QAAQ,EACR,0BAA0B,EAC1B,mBAAmB,GACO,EAAE,EAAE;IAC9B,MAAM,IAAI,GAAG,OAAO,EAAE,CAAC;IACvB,MAAM,EAAE,WAAW,EAAE,cAAc,EAAE,GAAG,mBAAmB,CAAC,QAAQ,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"UiAsyncTableToolbar.js","sourceRoot":"","sources":["../../../../src/@ui/UiAsyncTable/UiAsyncTable/UiAsyncTableToolbar.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DefaultUiTabsContainer.d.ts","sourceRoot":"","sources":["../../../../src/@ui/UiTabs/defaultComponents/DefaultUiTabsContainer.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"DefaultUiTabsContainer.d.ts","sourceRoot":"","sources":["../../../../src/@ui/UiTabs/defaultComponents/DefaultUiTabsContainer.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAM7C,OAAO,EAAU,oBAAoB,EAAE,MAAM,aAAa,CAAC;AAG3D;;GAEG;AACH,wBAAgB,sBAAsB,CAClC,SAAS,SAAS,MAAM,CAAC,GAAG,EAAE,GAAG,CAAC,GAAG,WAAW,EAChD,eAAe,SAAS,MAAM,CAAC,GAAG,EAAE,GAAG,CAAC,GAAG,WAAW,EACxD,MAAM,EAAE,oBAAoB,CAAC,WAAW,EAAE,SAAS,EAAE,eAAe,CAAC,2CA8FtE"}
|
|
@@ -3,10 +3,10 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
3
3
|
import { useCallback, useEffect } from "react";
|
|
4
4
|
import { useCombineRefs } from "@gooddata/sdk-ui";
|
|
5
5
|
import { useFocusWithinContainer } from "../../hooks/useFocusWithinContainer.js";
|
|
6
|
-
import { useListWithActionsKeyboardNavigation } from "../../hooks/useListWithActionsKeyboardNavigation.js";
|
|
7
6
|
import { ScopedIdStore, useScopedIdStoreValue } from "../../hooks/useScopedId.js";
|
|
8
7
|
import { UiTabsBem } from "../bem.js";
|
|
9
8
|
import { getTypedUiTabsContextStore } from "../context.js";
|
|
9
|
+
import { useTabsKeyboardNavigation } from "../useTabsKeyboardNavigation.js";
|
|
10
10
|
/**
|
|
11
11
|
* @internal
|
|
12
12
|
*/
|
|
@@ -24,21 +24,16 @@ export function DefaultUiTabsContainer(_props) {
|
|
|
24
24
|
"disableBottomBorder",
|
|
25
25
|
"isOverflowing",
|
|
26
26
|
]);
|
|
27
|
-
const handleSelectTab = useCallback((tab) =>
|
|
27
|
+
const handleSelectTab = useCallback((tab) => {
|
|
28
28
|
onTabSelect(tab);
|
|
29
29
|
}, [onTabSelect]);
|
|
30
|
-
const {
|
|
30
|
+
const { onKeyDown, focusedItem } = useTabsKeyboardNavigation({
|
|
31
31
|
items: tabs,
|
|
32
|
-
|
|
33
|
-
actionHandlers: {
|
|
34
|
-
selectItem: handleSelectTab,
|
|
35
|
-
selectTabActions: () => undefined,
|
|
36
|
-
},
|
|
37
|
-
isSimple: true,
|
|
32
|
+
onSelect: handleSelectTab,
|
|
38
33
|
focusedIndex: tabs.findIndex((t) => t.id === selectedTabId) ?? 0,
|
|
39
34
|
});
|
|
40
35
|
const scopedIdStoreValue = useScopedIdStoreValue((item) => item?.id);
|
|
41
|
-
const { containerRef: focusContainerRef } = useFocusWithinContainer(scopedIdStoreValue.makeId({ item: focusedItem, specifier:
|
|
36
|
+
const { containerRef: focusContainerRef } = useFocusWithinContainer(scopedIdStoreValue.makeId({ item: focusedItem, specifier: "tab" }) ?? "");
|
|
42
37
|
const focusedItemContainerId = scopedIdStoreValue.makeId({
|
|
43
38
|
item: focusedItem,
|
|
44
39
|
specifier: "tab-scroll-target",
|
|
@@ -48,10 +43,11 @@ export function DefaultUiTabsContainer(_props) {
|
|
|
48
43
|
.getElementById(focusedItemContainerId)
|
|
49
44
|
?.scrollIntoView({ block: "nearest", inline: "nearest", behavior: "smooth" });
|
|
50
45
|
}, [focusedItemContainerId, selectedTabId, isOverflowing]);
|
|
51
|
-
return (_jsxs("div", { className: UiTabsBem.b({ size, overflow: true, "disable-border": disableBottomBorder }), children: [_jsx("div", { className: UiTabsBem.e("container"), ref: useCombineRefs(resizeContainerRef, focusContainerRef), onKeyDown:
|
|
46
|
+
return (_jsxs("div", { className: UiTabsBem.b({ size, overflow: true, "disable-border": disableBottomBorder }), children: [_jsx("div", { className: UiTabsBem.e("container"), ref: useCombineRefs(resizeContainerRef, focusContainerRef), onKeyDown: onKeyDown, id: scopedIdStoreValue.containerId, tabIndex: -1, "aria-label": accessibilityConfig?.ariaLabel, "aria-labelledby": accessibilityConfig?.ariaLabelledBy, "aria-describedby": accessibilityConfig?.ariaDescribedBy, "aria-expanded": accessibilityConfig?.ariaExpanded, role: accessibilityConfig?.role, children: _jsx(ScopedIdStore, { value: scopedIdStoreValue, children: tabs.map((tab) => {
|
|
52
47
|
const isSelected = selectedTabId === tab.id;
|
|
53
48
|
const onSelect = () => onTabSelect(tab);
|
|
54
|
-
|
|
49
|
+
const isFocused = focusedItem === tab;
|
|
50
|
+
return (_jsx(Tab, { tab: tab, isSelected: isSelected, isFocused: isFocused, onSelect: onSelect }, tab.id));
|
|
55
51
|
}) }) }), _jsx(AllTabs, {})] }));
|
|
56
52
|
}
|
|
57
53
|
//# sourceMappingURL=DefaultUiTabsContainer.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DefaultUiTabsContainer.js","sourceRoot":"","sources":["../../../../src/@ui/UiTabs/defaultComponents/DefaultUiTabsContainer.tsx"],"names":[],"mappings":";AAAA,gCAAgC;AAEhC,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE/C,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAGlD,OAAO,EAAE,uBAAuB,EAAE,MAAM,wCAAwC,CAAC;AACjF,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"DefaultUiTabsContainer.js","sourceRoot":"","sources":["../../../../src/@ui/UiTabs/defaultComponents/DefaultUiTabsContainer.tsx"],"names":[],"mappings":"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"}
|
|
@@ -3,5 +3,5 @@ import { IUiTabComponentProps } from "../types.js";
|
|
|
3
3
|
/**
|
|
4
4
|
* @internal
|
|
5
5
|
*/
|
|
6
|
-
export declare function DefaultUiTabsTab<TTabProps extends Record<any, any> = EmptyObject, TTabActionProps extends Record<any, any> = EmptyObject>({ tab, isSelected, onSelect,
|
|
6
|
+
export declare function DefaultUiTabsTab<TTabProps extends Record<any, any> = EmptyObject, TTabActionProps extends Record<any, any> = EmptyObject>({ tab, isSelected, onSelect, isFocused }: IUiTabComponentProps<"Tab", TTabProps, TTabActionProps>): import("react/jsx-runtime").JSX.Element;
|
|
7
7
|
//# sourceMappingURL=DefaultUiTabsTab.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DefaultUiTabsTab.d.ts","sourceRoot":"","sources":["../../../../src/@ui/UiTabs/defaultComponents/DefaultUiTabsTab.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,WAAW,EAAe,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"DefaultUiTabsTab.d.ts","sourceRoot":"","sources":["../../../../src/@ui/UiTabs/defaultComponents/DefaultUiTabsTab.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,WAAW,EAAe,MAAM,gBAAgB,CAAC;AAM1D,OAAO,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAC;AAEnD;;GAEG;AACH,wBAAgB,gBAAgB,CAC5B,SAAS,SAAS,MAAM,CAAC,GAAG,EAAE,GAAG,CAAC,GAAG,WAAW,EAChD,eAAe,SAAS,MAAM,CAAC,GAAG,EAAE,GAAG,CAAC,GAAG,WAAW,EACxD,EAAE,GAAG,EAAE,UAAU,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,oBAAoB,CAAC,KAAK,EAAE,SAAS,EAAE,eAAe,CAAC,2CA4ElG"}
|
|
@@ -2,7 +2,6 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
2
2
|
// (C) 2025 GoodData Corporation
|
|
3
3
|
import { useCallback, useState } from "react";
|
|
4
4
|
import { stringUtils } from "@gooddata/util";
|
|
5
|
-
import { SELECT_ITEM_ACTION } from "../../hooks/useListWithActionsKeyboardNavigation.js";
|
|
6
5
|
import { ScopedIdStore } from "../../hooks/useScopedId.js";
|
|
7
6
|
import { UiTooltip } from "../../UiTooltip/UiTooltip.js";
|
|
8
7
|
import { UiTabsBem } from "../bem.js";
|
|
@@ -10,7 +9,7 @@ import { getTypedUiTabsContextStore } from "../context.js";
|
|
|
10
9
|
/**
|
|
11
10
|
* @internal
|
|
12
11
|
*/
|
|
13
|
-
export function DefaultUiTabsTab({ tab, isSelected, onSelect,
|
|
12
|
+
export function DefaultUiTabsTab({ tab, isSelected, onSelect, isFocused }) {
|
|
14
13
|
const store = getTypedUiTabsContextStore();
|
|
15
14
|
const { accessibilityConfig, TabValue, TabActions, maxLabelLength } = store.useContextStoreValues([
|
|
16
15
|
"accessibilityConfig",
|
|
@@ -22,12 +21,15 @@ export function DefaultUiTabsTab({ tab, isSelected, onSelect, focusedAction }) {
|
|
|
22
21
|
const isOverflowing = tab.label.length > maxLabelLength;
|
|
23
22
|
const [isActionsOpen, setIsActionsOpen] = useState(false);
|
|
24
23
|
const handleToggleActionsOpen = useCallback((desiredState) => setIsActionsOpen((wasOpen) => desiredState ?? !wasOpen), [setIsActionsOpen]);
|
|
25
|
-
|
|
24
|
+
// When this tab is focused, both tab button and actions are tabbable (tabIndex=0)
|
|
25
|
+
// This allows natural Tab key navigation from tab button to actions button
|
|
26
|
+
const tabIndex = isFocused ? 0 : -1;
|
|
27
|
+
const tabButton = (_jsx("button", { className: UiTabsBem.e("item", { selected: isSelected }), onClick: onSelect, role: accessibilityConfig?.tabRole, "aria-selected": isSelected, "aria-label": tab.label, tabIndex: tabIndex, id: makeId?.({ item: tab, specifier: "tab" }), "data-testid": `s-tab-${stringUtils.simplifyText(tab.label)}`, children: _jsx(TabValue, { tab: tab, isSelected: isSelected, location: "tabs" }) }));
|
|
26
28
|
return (_jsxs("div", { className: UiTabsBem.e("tab-wrapper", {
|
|
27
29
|
selected: isSelected,
|
|
28
30
|
variant: tab.variant ?? "default",
|
|
29
|
-
focused:
|
|
31
|
+
focused: isFocused,
|
|
30
32
|
"actions-open": isActionsOpen,
|
|
31
|
-
}), children: [_jsx("div", { className: UiTabsBem.e("tab-scroll-target"), id: makeId?.({ item: tab, specifier: "tab-scroll-target" }) }), isOverflowing ? (_jsx(UiTooltip, { anchor: tabButton, content: tab.label, triggerBy: ["hover", "focus"], arrowPlacement: "top", optimalPlacement: true }, tab.id)) : (tabButton), _jsx("div", { className: UiTabsBem.e("tabs-actions"), children: _jsx(TabActions, { tab: tab, location: "tabs", id: makeId?.({ item: tab, specifier: "selectTabActions" }), tabIndex:
|
|
33
|
+
}), children: [_jsx("div", { className: UiTabsBem.e("tab-scroll-target"), id: makeId?.({ item: tab, specifier: "tab-scroll-target" }) }), isOverflowing ? (_jsx(UiTooltip, { anchor: tabButton, content: tab.label, triggerBy: ["hover", "focus"], arrowPlacement: "top", optimalPlacement: true }, tab.id)) : (tabButton), _jsx("div", { className: UiTabsBem.e("tabs-actions"), id: makeId?.({ item: tab, specifier: "actions" }), children: _jsx(TabActions, { tab: tab, location: "tabs", id: makeId?.({ item: tab, specifier: "selectTabActions" }), tabIndex: tabIndex, isOpen: isActionsOpen, onToggleOpen: handleToggleActionsOpen }) })] }));
|
|
32
34
|
}
|
|
33
35
|
//# sourceMappingURL=DefaultUiTabsTab.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DefaultUiTabsTab.js","sourceRoot":"","sources":["../../../../src/@ui/UiTabs/defaultComponents/DefaultUiTabsTab.tsx"],"names":[],"mappings":";AAAA,gCAAgC;AAEhC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE9C,OAAO,EAAe,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE1D,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"DefaultUiTabsTab.js","sourceRoot":"","sources":["../../../../src/@ui/UiTabs/defaultComponents/DefaultUiTabsTab.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DefaultUiTabsTabActions.d.ts","sourceRoot":"","sources":["../../../../src/@ui/UiTabs/defaultComponents/DefaultUiTabsTabActions.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAS7C,OAAO,EAAgB,oBAAoB,EAAE,MAAM,aAAa,CAAC;AASjE;;GAEG;AACH,wBAAgB,uBAAuB,CACnC,SAAS,SAAS,MAAM,CAAC,GAAG,EAAE,GAAG,CAAC,GAAG,WAAW,EAChD,eAAe,SAAS,MAAM,CAAC,GAAG,EAAE,GAAG,CAAC,GAAG,WAAW,EACxD,EACE,GAAG,EACH,QAAQ,EACR,EAAE,EACF,QAAQ,EACR,MAAM,EACN,YAAY,GACf,EAAE,oBAAoB,CAAC,YAAY,EAAE,SAAS,EAAE,eAAe,CAAC,
|
|
1
|
+
{"version":3,"file":"DefaultUiTabsTabActions.d.ts","sourceRoot":"","sources":["../../../../src/@ui/UiTabs/defaultComponents/DefaultUiTabsTabActions.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAS7C,OAAO,EAAgB,oBAAoB,EAAE,MAAM,aAAa,CAAC;AASjE;;GAEG;AACH,wBAAgB,uBAAuB,CACnC,SAAS,SAAS,MAAM,CAAC,GAAG,EAAE,GAAG,CAAC,GAAG,WAAW,EAChD,eAAe,SAAS,MAAM,CAAC,GAAG,EAAE,GAAG,CAAC,GAAG,WAAW,EACxD,EACE,GAAG,EACH,QAAQ,EACR,EAAE,EACF,QAAQ,EACR,MAAM,EACN,YAAY,GACf,EAAE,oBAAoB,CAAC,YAAY,EAAE,SAAS,EAAE,eAAe,CAAC,2CA+GhE"}
|
|
@@ -17,6 +17,7 @@ export function DefaultUiTabsTabActions({ tab, location, id, tabIndex, isOpen, o
|
|
|
17
17
|
"onActionTriggered",
|
|
18
18
|
]);
|
|
19
19
|
const tabElementId = useScopedId(tab, "tab-scroll-target");
|
|
20
|
+
const tabActionsId = useScopedId(tab, "actions");
|
|
20
21
|
const menuItems = useMemo(() => tab.actions?.map((action) => {
|
|
21
22
|
return isSeparator(action)
|
|
22
23
|
? action
|
|
@@ -44,11 +45,18 @@ export function DefaultUiTabsTabActions({ tab, location, id, tabIndex, isOpen, o
|
|
|
44
45
|
block: "nearest",
|
|
45
46
|
behavior: "instant",
|
|
46
47
|
});
|
|
48
|
+
// The second scrollIntoView is needed to make sure the actions end up visible
|
|
49
|
+
// if the tab is larger than the tablist element. This can happen for very long names.
|
|
50
|
+
document.getElementById(tabActionsId)?.scrollIntoView({
|
|
51
|
+
inline: "nearest",
|
|
52
|
+
block: "nearest",
|
|
53
|
+
behavior: "instant",
|
|
54
|
+
});
|
|
47
55
|
}, 50);
|
|
48
56
|
}),
|
|
49
57
|
},
|
|
50
58
|
};
|
|
51
|
-
}) ?? [], [tab, onActionTriggered, location, tabElementId,
|
|
59
|
+
}) ?? [], [tab, onActionTriggered, location, onToggleOpen, tabElementId, tabActionsId]);
|
|
52
60
|
const handleItemSelected = useCallback((item) => {
|
|
53
61
|
if (item.type !== "interactive") {
|
|
54
62
|
return;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DefaultUiTabsTabActions.js","sourceRoot":"","sources":["../../../../src/@ui/UiTabs/defaultComponents/DefaultUiTabsTabActions.tsx"],"names":[],"mappings":";AAAA,gCAAgC;AAEhC,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAI7C,OAAO,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAC;AACtD,OAAO,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,iEAAiE,CAAC;AAE9F,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAChD,OAAO,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AACtC,OAAO,EAAE,0BAA0B,EAAE,MAAM,eAAe,CAAC;AAU3D;;GAEG;AACH,MAAM,UAAU,uBAAuB,CAGrC,EACE,GAAG,EACH,QAAQ,EACR,EAAE,EACF,QAAQ,EACR,MAAM,EACN,YAAY,GACiD;IAC7D,MAAM,KAAK,GAAG,0BAA0B,EAA8B,CAAC;IACvE,MAAM,EAAE,gBAAgB,EAAE,iBAAiB,EAAE,GAAG,KAAK,CAAC,qBAAqB,CAAC;QACxE,kBAAkB;QAClB,mBAAmB;KACtB,CAAC,CAAC;IAEH,MAAM,YAAY,GAAG,WAAW,CAAC,GAAG,EAAE,mBAAmB,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"DefaultUiTabsTabActions.js","sourceRoot":"","sources":["../../../../src/@ui/UiTabs/defaultComponents/DefaultUiTabsTabActions.tsx"],"names":[],"mappings":"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"}
|
|
@@ -3,7 +3,6 @@ import { EmptyObject } from "@gooddata/util";
|
|
|
3
3
|
import { IDropdownButtonRenderProps } from "../../Dropdown/index.js";
|
|
4
4
|
import { IAccessibilityConfigBase } from "../../typings/accessibility.js";
|
|
5
5
|
import { SizeLarge, SizeMedium, SizeSmall } from "../@types/size.js";
|
|
6
|
-
import { SELECT_ITEM_ACTION } from "../hooks/useListWithActionsKeyboardNavigation.js";
|
|
7
6
|
import { separatorStaticItem } from "../UiListbox/defaults/DefaultUiListboxStaticItemComponent.js";
|
|
8
7
|
/**
|
|
9
8
|
* @internal
|
|
@@ -51,7 +50,11 @@ export type IUiTabComponents<TTabProps extends Record<any, any> = EmptyObject, T
|
|
|
51
50
|
tab: IUiTab<TTabProps, TTabActionProps>;
|
|
52
51
|
isSelected: boolean;
|
|
53
52
|
onSelect: () => void;
|
|
54
|
-
|
|
53
|
+
/**
|
|
54
|
+
* Whether this tab is the currently focused tab in keyboard navigation.
|
|
55
|
+
* When true, the tab button and its actions button become tabbable (tabIndex=0).
|
|
56
|
+
*/
|
|
57
|
+
isFocused?: boolean;
|
|
55
58
|
}>;
|
|
56
59
|
TabValue: ComponentType<{
|
|
57
60
|
tab: IUiTab<TTabProps, TTabActionProps>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/@ui/UiTabs/types.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,aAAa,EAAE,cAAc,EAAE,SAAS,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEzG,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE7C,OAAO,EAAE,0BAA0B,EAAE,MAAM,yBAAyB,CAAC;AACrE,OAAO,EAAE,wBAAwB,EAAE,MAAM,gCAAgC,CAAC;AAC1E,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AACrE,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/@ui/UiTabs/types.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Simple keyboard navigation hook for horizontal tabs.
|
|
3
|
+
* - ArrowLeft/ArrowRight (or ArrowUp/ArrowDown): Navigate between tabs
|
|
4
|
+
* - Home/End: Jump to first/last tab
|
|
5
|
+
* - Enter/Space: Select the focused tab
|
|
6
|
+
* - Tab key works naturally to move to actions button when focused
|
|
7
|
+
*
|
|
8
|
+
* @internal
|
|
9
|
+
*/
|
|
10
|
+
export declare function useTabsKeyboardNavigation<Item>({ items, onSelect, focusedIndex: focusedIndexProp, }: {
|
|
11
|
+
items: Item[];
|
|
12
|
+
onSelect: (item: Item) => void;
|
|
13
|
+
focusedIndex?: number;
|
|
14
|
+
}): {
|
|
15
|
+
onKeyDown: (event: import("react").KeyboardEvent<Element>) => void;
|
|
16
|
+
focusedItem: Item;
|
|
17
|
+
focusedIndex: number;
|
|
18
|
+
setFocusedIndex: import("react").Dispatch<import("react").SetStateAction<number>>;
|
|
19
|
+
};
|
|
20
|
+
//# sourceMappingURL=useTabsKeyboardNavigation.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useTabsKeyboardNavigation.d.ts","sourceRoot":"","sources":["../../../src/@ui/UiTabs/useTabsKeyboardNavigation.ts"],"names":[],"mappings":"AAQA;;;;;;;;GAQG;AACH,wBAAgB,yBAAyB,CAAC,IAAI,EAAE,EAC5C,KAAK,EACL,QAAQ,EACR,YAAY,EAAE,gBAAgB,GACjC,EAAE;IACC,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,QAAQ,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IAC/B,YAAY,CAAC,EAAE,MAAM,CAAC;CACzB;;;;;EA+DA"}
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
// (C) 2025 GoodData Corporation
|
|
2
|
+
import { useEffect, useMemo, useState } from "react";
|
|
3
|
+
import { useAutoupdateRef } from "@gooddata/sdk-ui";
|
|
4
|
+
import { makeTabsKeyboardNavigation } from "../@utils/keyboardNavigation.js";
|
|
5
|
+
/**
|
|
6
|
+
* Simple keyboard navigation hook for horizontal tabs.
|
|
7
|
+
* - ArrowLeft/ArrowRight (or ArrowUp/ArrowDown): Navigate between tabs
|
|
8
|
+
* - Home/End: Jump to first/last tab
|
|
9
|
+
* - Enter/Space: Select the focused tab
|
|
10
|
+
* - Tab key works naturally to move to actions button when focused
|
|
11
|
+
*
|
|
12
|
+
* @internal
|
|
13
|
+
*/
|
|
14
|
+
export function useTabsKeyboardNavigation({ items, onSelect, focusedIndex: focusedIndexProp, }) {
|
|
15
|
+
const [focusedIndex, setFocusedIndex] = useState(focusedIndexProp ?? 0);
|
|
16
|
+
useEffect(() => {
|
|
17
|
+
if (focusedIndexProp !== undefined) {
|
|
18
|
+
setFocusedIndex(focusedIndexProp);
|
|
19
|
+
}
|
|
20
|
+
}, [focusedIndexProp]);
|
|
21
|
+
// If the items change and we're suddenly focusing on a nonexistent item
|
|
22
|
+
if (focusedIndex > items.length - 1) {
|
|
23
|
+
setFocusedIndex(Math.max(0, items.length - 1));
|
|
24
|
+
}
|
|
25
|
+
const focusedItem = items[focusedIndex];
|
|
26
|
+
const depsRef = useAutoupdateRef({
|
|
27
|
+
items,
|
|
28
|
+
focusedIndex,
|
|
29
|
+
focusedItem,
|
|
30
|
+
onSelect,
|
|
31
|
+
setFocusedIndex,
|
|
32
|
+
});
|
|
33
|
+
const onKeyDown = useMemo(() => makeTabsKeyboardNavigation({
|
|
34
|
+
onFocusPrevious: () => {
|
|
35
|
+
const { setFocusedIndex, items } = depsRef.current;
|
|
36
|
+
setFocusedIndex((currentIndex) => currentIndex === 0 ? items.length - 1 : currentIndex - 1);
|
|
37
|
+
},
|
|
38
|
+
onFocusNext: () => {
|
|
39
|
+
const { setFocusedIndex, items } = depsRef.current;
|
|
40
|
+
setFocusedIndex((currentIndex) => currentIndex === items.length - 1 ? 0 : currentIndex + 1);
|
|
41
|
+
},
|
|
42
|
+
onFocusFirst: () => {
|
|
43
|
+
const { setFocusedIndex } = depsRef.current;
|
|
44
|
+
setFocusedIndex(0);
|
|
45
|
+
},
|
|
46
|
+
onFocusLast: () => {
|
|
47
|
+
const { setFocusedIndex, items } = depsRef.current;
|
|
48
|
+
setFocusedIndex(items.length - 1);
|
|
49
|
+
},
|
|
50
|
+
onSelect: () => {
|
|
51
|
+
const { focusedItem, onSelect } = depsRef.current;
|
|
52
|
+
if (focusedItem) {
|
|
53
|
+
onSelect(focusedItem);
|
|
54
|
+
}
|
|
55
|
+
},
|
|
56
|
+
}), [depsRef]);
|
|
57
|
+
return {
|
|
58
|
+
onKeyDown,
|
|
59
|
+
focusedItem,
|
|
60
|
+
focusedIndex,
|
|
61
|
+
setFocusedIndex,
|
|
62
|
+
};
|
|
63
|
+
}
|
|
64
|
+
//# sourceMappingURL=useTabsKeyboardNavigation.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useTabsKeyboardNavigation.js","sourceRoot":"","sources":["../../../src/@ui/UiTabs/useTabsKeyboardNavigation.ts"],"names":[],"mappings":"AAAA,gCAAgC;AAEhC,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAErD,OAAO,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AAEpD,OAAO,EAAE,0BAA0B,EAAE,MAAM,iCAAiC,CAAC;AAE7E;;;;;;;;GAQG;AACH,MAAM,UAAU,yBAAyB,CAAO,EAC5C,KAAK,EACL,QAAQ,EACR,YAAY,EAAE,gBAAgB,GAKjC;IACG,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAS,gBAAgB,IAAI,CAAC,CAAC,CAAC;IAEhF,SAAS,CAAC,GAAG,EAAE;QACX,IAAI,gBAAgB,KAAK,SAAS,EAAE,CAAC;YACjC,eAAe,CAAC,gBAAgB,CAAC,CAAC;QACtC,CAAC;IACL,CAAC,EAAE,CAAC,gBAAgB,CAAC,CAAC,CAAC;IAEvB,wEAAwE;IACxE,IAAI,YAAY,GAAG,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;QAClC,eAAe,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC;IACnD,CAAC;IAED,MAAM,WAAW,GAAG,KAAK,CAAC,YAAY,CAAC,CAAC;IAExC,MAAM,OAAO,GAAG,gBAAgB,CAAC;QAC7B,KAAK;QACL,YAAY;QACZ,WAAW;QACX,QAAQ;QACR,eAAe;KAClB,CAAC,CAAC;IAEH,MAAM,SAAS,GAAG,OAAO,CACrB,GAAG,EAAE,CACD,0BAA0B,CAAC;QACvB,eAAe,EAAE,GAAG,EAAE;YAClB,MAAM,EAAE,eAAe,EAAE,KAAK,EAAE,GAAG,OAAO,CAAC,OAAO,CAAC;YACnD,eAAe,CAAC,CAAC,YAAY,EAAE,EAAE,CAC7B,YAAY,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,YAAY,GAAG,CAAC,CAC3D,CAAC;QACN,CAAC;QACD,WAAW,EAAE,GAAG,EAAE;YACd,MAAM,EAAE,eAAe,EAAE,KAAK,EAAE,GAAG,OAAO,CAAC,OAAO,CAAC;YACnD,eAAe,CAAC,CAAC,YAAY,EAAE,EAAE,CAC7B,YAAY,KAAK,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,YAAY,GAAG,CAAC,CAC3D,CAAC;QACN,CAAC;QACD,YAAY,EAAE,GAAG,EAAE;YACf,MAAM,EAAE,eAAe,EAAE,GAAG,OAAO,CAAC,OAAO,CAAC;YAC5C,eAAe,CAAC,CAAC,CAAC,CAAC;QACvB,CAAC;QACD,WAAW,EAAE,GAAG,EAAE;YACd,MAAM,EAAE,eAAe,EAAE,KAAK,EAAE,GAAG,OAAO,CAAC,OAAO,CAAC;YACnD,eAAe,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;QACtC,CAAC;QACD,QAAQ,EAAE,GAAG,EAAE;YACX,MAAM,EAAE,WAAW,EAAE,QAAQ,EAAE,GAAG,OAAO,CAAC,OAAO,CAAC;YAClD,IAAI,WAAW,EAAE,CAAC;gBACd,QAAQ,CAAC,WAAW,CAAC,CAAC;YAC1B,CAAC;QACL,CAAC;KACJ,CAAC,EACN,CAAC,OAAO,CAAC,CACZ,CAAC;IAEF,OAAO;QACH,SAAS;QACT,WAAW;QACX,YAAY;QACZ,eAAe;KAClB,CAAC;AACN,CAAC"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { ReactElement, ReactNode } from "react";
|
|
2
2
|
import { type IDropdownBodyRenderProps, type IDropdownButtonRenderProps } from "../Dropdown/Dropdown.js";
|
|
3
|
-
import { IInvertableSelectRenderItemProps, type IInvertableSelectRenderNoDataProps, type IInvertableSelectRenderSearchBarProps, type IInvertableSelectRenderStatusBarProps } from "../List/InvertableSelect/InvertableSelect.js";
|
|
3
|
+
import { IInvertableSelectRenderActionsProps, IInvertableSelectRenderItemProps, type IInvertableSelectRenderNoDataProps, type IInvertableSelectRenderSearchBarProps, type IInvertableSelectRenderStatusBarProps } from "../List/InvertableSelect/InvertableSelect.js";
|
|
4
4
|
import { OverlayPositionType } from "../typings/overlay.js";
|
|
5
5
|
import type { IAlignPoint } from "../typings/positioning.js";
|
|
6
6
|
/**
|
|
@@ -83,6 +83,10 @@ export interface IDropdownInvertableSelectProps<T> {
|
|
|
83
83
|
* Render function for the item.
|
|
84
84
|
*/
|
|
85
85
|
renderItem?: (props: IInvertableSelectRenderItemProps<T>) => ReactElement;
|
|
86
|
+
/**
|
|
87
|
+
* Render function for list actions
|
|
88
|
+
*/
|
|
89
|
+
renderListActions?: (props: IInvertableSelectRenderActionsProps) => ReactElement;
|
|
86
90
|
/**
|
|
87
91
|
* Overlay position type.
|
|
88
92
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownInvertableSelect.d.ts","sourceRoot":"","sources":["../../src/Dropdown/DropdownInvertableSelect.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,YAAY,EAAE,SAAS,EAAqB,MAAM,OAAO,CAAC;AAMnE,OAAO,EAEH,KAAK,wBAAwB,EAC7B,KAAK,0BAA0B,EAClC,MAAM,yBAAyB,CAAC;AACjC,OAAO,EACH,gCAAgC,EAChC,KAAK,kCAAkC,EACvC,KAAK,qCAAqC,EAC1C,KAAK,qCAAqC,EAE7C,MAAM,8CAA8C,CAAC;AAGtD,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AAE7D;;GAEG;AACH,MAAM,WAAW,8BAA8B,CAAC,CAAC;IAC7C;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,OAAO,EAAE,CAAC,EAAE,CAAC;IAEb;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB;;OAEG;IACH,YAAY,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,CAAC;IAElC;;OAEG;IACH,UAAU,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,CAAC;IAEhC;;OAEG;IACH,QAAQ,EAAE,CAAC,aAAa,EAAE,CAAC,EAAE,EAAE,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;IAE5D;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,WAAW,CAAC,EAAE,WAAW,EAAE,CAAC;IAE5B;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,EAAE,CAAC;IAEnB;;OAEG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAE5B;;OAEG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAE7B;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB;;OAEG;IACH,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,qCAAqC,CAAC,CAAC,CAAC,KAAK,YAAY,CAAC;IAEpF;;OAEG;IACH,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,qCAAqC,KAAK,YAAY,CAAC;IAEjF;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,kCAAkC,KAAK,YAAY,CAAC;IAE3E;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,0BAA0B,KAAK,SAAS,CAAC;IAEhE;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,wBAAwB,KAAK,YAAY,CAAC;IAElE;;OAEG;IACH,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,gCAAgC,CAAC,CAAC,CAAC,KAAK,YAAY,CAAC;IAE1E;;OAEG;IACH,mBAAmB,CAAC,EAAE,mBAAmB,CAAC;IAE1C;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IAEpB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;CAC3B;AAWD;;GAEG;AACH,wBAAgB,wBAAwB,CAAC,CAAC,EAAE,KAAK,EAAE,8BAA8B,CAAC,CAAC,CAAC,
|
|
1
|
+
{"version":3,"file":"DropdownInvertableSelect.d.ts","sourceRoot":"","sources":["../../src/Dropdown/DropdownInvertableSelect.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,YAAY,EAAE,SAAS,EAAqB,MAAM,OAAO,CAAC;AAMnE,OAAO,EAEH,KAAK,wBAAwB,EAC7B,KAAK,0BAA0B,EAClC,MAAM,yBAAyB,CAAC;AACjC,OAAO,EACH,mCAAmC,EACnC,gCAAgC,EAChC,KAAK,kCAAkC,EACvC,KAAK,qCAAqC,EAC1C,KAAK,qCAAqC,EAE7C,MAAM,8CAA8C,CAAC;AAGtD,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AAE7D;;GAEG;AACH,MAAM,WAAW,8BAA8B,CAAC,CAAC;IAC7C;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,OAAO,EAAE,CAAC,EAAE,CAAC;IAEb;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB;;OAEG;IACH,YAAY,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,CAAC;IAElC;;OAEG;IACH,UAAU,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,CAAC;IAEhC;;OAEG;IACH,QAAQ,EAAE,CAAC,aAAa,EAAE,CAAC,EAAE,EAAE,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;IAE5D;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,WAAW,CAAC,EAAE,WAAW,EAAE,CAAC;IAE5B;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,EAAE,CAAC;IAEnB;;OAEG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAE5B;;OAEG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAE7B;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB;;OAEG;IACH,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,qCAAqC,CAAC,CAAC,CAAC,KAAK,YAAY,CAAC;IAEpF;;OAEG;IACH,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,qCAAqC,KAAK,YAAY,CAAC;IAEjF;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,kCAAkC,KAAK,YAAY,CAAC;IAE3E;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,0BAA0B,KAAK,SAAS,CAAC;IAEhE;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,wBAAwB,KAAK,YAAY,CAAC;IAElE;;OAEG;IACH,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,gCAAgC,CAAC,CAAC,CAAC,KAAK,YAAY,CAAC;IAE1E;;OAEG;IACH,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,mCAAmC,KAAK,YAAY,CAAC;IAEjF;;OAEG;IACH,mBAAmB,CAAC,EAAE,mBAAmB,CAAC;IAE1C;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IAEpB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;CAC3B;AAWD;;GAEG;AACH,wBAAgB,wBAAwB,CAAC,CAAC,EAAE,KAAK,EAAE,8BAA8B,CAAC,CAAC,CAAC,2CA4InF;AAED,MAAM,WAAW,qCAAqC;IAClD,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,eAAe,CAAC,EAAE,OAAO,CAAC;CAC7B"}
|
|
@@ -20,7 +20,7 @@ const messages = defineMessages({
|
|
|
20
20
|
* @internal
|
|
21
21
|
*/
|
|
22
22
|
export function DropdownInvertableSelect(props) {
|
|
23
|
-
const { title, options, onChange, onOpen, onClose, closeOnEscape, className, bodyClassName, width = 240, alignPoints, getItemTitle, getItemKey, initialValue, initialIsInverted, initialSearchString, overlayPositionType, header, renderStatusBar, renderSearchBar, renderNoData, renderActions, renderItem, } = props;
|
|
23
|
+
const { title, options, onChange, onOpen, onClose, closeOnEscape, className, bodyClassName, width = 240, alignPoints, getItemTitle, getItemKey, initialValue, initialIsInverted, initialSearchString, overlayPositionType, header, renderStatusBar, renderSearchBar, renderNoData, renderActions, renderItem, renderListActions, } = props;
|
|
24
24
|
const [searchString, setSearchString] = useState(initialSearchString ?? "");
|
|
25
25
|
const [committedSelection, setCommitedSelection] = useState(initialValue ?? []);
|
|
26
26
|
const [committedIsInverted, setCommitedIsInverted] = useState(initialIsInverted ?? true);
|
|
@@ -64,7 +64,7 @@ export function DropdownInvertableSelect(props) {
|
|
|
64
64
|
const { closeDropdown } = bodyProps;
|
|
65
65
|
const isEmptySelection = !isInverted && selection.length === 0;
|
|
66
66
|
const isSelectionEqual = isEqual(selection, committedSelection) && isInverted === committedIsInverted;
|
|
67
|
-
return (_jsxs(_Fragment, { children: [header, _jsx(InvertableSelect, { width: width, className: bodyClassName, items: filteredOptions, getItemTitle: getItemTitle, getItemKey: getItemKey, isInverted: isInverted, searchString: searchString, onSearch: onSearch, selectedItems: selection, onSelect: onSelect, renderStatusBar: renderStatusBar, renderSearchBar: renderSearchBar, renderNoData: renderNoData, renderItem: renderItem, totalItemsCount: filteredOptions.length }), renderActions?.(bodyProps) ?? (_jsx(DropdownInvertableSelectActions, { onApply: () => {
|
|
67
|
+
return (_jsxs(_Fragment, { children: [header, _jsx(InvertableSelect, { width: width, className: bodyClassName, items: filteredOptions, getItemTitle: getItemTitle, getItemKey: getItemKey, isInverted: isInverted, searchString: searchString, onSearch: onSearch, selectedItems: selection, onSelect: onSelect, renderStatusBar: renderStatusBar, renderSearchBar: renderSearchBar, renderNoData: renderNoData, renderItem: renderItem, renderActions: renderListActions, totalItemsCount: filteredOptions.length }), renderActions?.(bodyProps) ?? (_jsx(DropdownInvertableSelectActions, { onApply: () => {
|
|
68
68
|
onApply();
|
|
69
69
|
closeDropdown();
|
|
70
70
|
}, onCancel: () => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownInvertableSelect.js","sourceRoot":"","sources":["../../src/Dropdown/DropdownInvertableSelect.tsx"],"names":[],"mappings":";AAAA,qCAAqC;AAErC,OAAO,EAA2B,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEnE,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,cAAc,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAErD,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EACH,QAAQ,GAGX,MAAM,yBAAyB,CAAC;AACjC,OAAO,
|
|
1
|
+
{"version":3,"file":"DropdownInvertableSelect.js","sourceRoot":"","sources":["../../src/Dropdown/DropdownInvertableSelect.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,95 @@
|
|
|
1
|
+
import { MutableRefObject, ReactNode } from "react";
|
|
2
|
+
/**
|
|
3
|
+
* @internal
|
|
4
|
+
*/
|
|
5
|
+
export interface IFilterGroupItemProps {
|
|
6
|
+
/**
|
|
7
|
+
* Title of the filter group item.
|
|
8
|
+
*
|
|
9
|
+
* @beta
|
|
10
|
+
*/
|
|
11
|
+
title?: string;
|
|
12
|
+
/**
|
|
13
|
+
* subtitle of the filter group item.
|
|
14
|
+
*
|
|
15
|
+
* @beta
|
|
16
|
+
*/
|
|
17
|
+
subtitle?: string;
|
|
18
|
+
/**
|
|
19
|
+
* Selected items count
|
|
20
|
+
*
|
|
21
|
+
* @remarks
|
|
22
|
+
* - If value is 0 for {@link @gooddata/sdk-model#IPositiveAttributeFilter} means NONE items are selected
|
|
23
|
+
*
|
|
24
|
+
* - If value is 0 for {@link @gooddata/sdk-model#INegativeAttributeFilter} means ALL items are selected
|
|
25
|
+
*
|
|
26
|
+
* @beta
|
|
27
|
+
*/
|
|
28
|
+
selectedItemsCount?: number;
|
|
29
|
+
/**
|
|
30
|
+
*
|
|
31
|
+
* @beta
|
|
32
|
+
*/
|
|
33
|
+
showSelectionCount?: boolean;
|
|
34
|
+
/**
|
|
35
|
+
* If true, the Filter group item is opened and renders its opened look.
|
|
36
|
+
*
|
|
37
|
+
* @beta
|
|
38
|
+
*/
|
|
39
|
+
isOpen?: boolean;
|
|
40
|
+
/**
|
|
41
|
+
* If true, the Filter group item component renders in loading state.
|
|
42
|
+
*
|
|
43
|
+
* @beta
|
|
44
|
+
*/
|
|
45
|
+
isLoading?: boolean;
|
|
46
|
+
/**
|
|
47
|
+
* If true, all the initialization has finished.
|
|
48
|
+
*
|
|
49
|
+
* @beta
|
|
50
|
+
*/
|
|
51
|
+
isLoaded?: boolean;
|
|
52
|
+
/**
|
|
53
|
+
* Icon shown within the FilterGroupItem infront of the title.
|
|
54
|
+
*
|
|
55
|
+
* @beta
|
|
56
|
+
*/
|
|
57
|
+
icon?: ReactNode;
|
|
58
|
+
/**
|
|
59
|
+
* Allows adding content to the button after the title.
|
|
60
|
+
*
|
|
61
|
+
* @alpha
|
|
62
|
+
*/
|
|
63
|
+
titleExtension?: ReactNode;
|
|
64
|
+
/**
|
|
65
|
+
* Callback to open or close filter.
|
|
66
|
+
*
|
|
67
|
+
* @beta
|
|
68
|
+
*/
|
|
69
|
+
onClick?: () => void;
|
|
70
|
+
isError?: boolean;
|
|
71
|
+
/**
|
|
72
|
+
* Ref to the filter group item component.
|
|
73
|
+
*
|
|
74
|
+
* @beta
|
|
75
|
+
*/
|
|
76
|
+
buttonRef?: MutableRefObject<HTMLElement>;
|
|
77
|
+
/**
|
|
78
|
+
* Id to link the dropdown body. Mainly for accessibility purposes.
|
|
79
|
+
*
|
|
80
|
+
* @beta
|
|
81
|
+
*/
|
|
82
|
+
dropdownId?: string;
|
|
83
|
+
}
|
|
84
|
+
export declare const ALIGN_POINT: {
|
|
85
|
+
align: string;
|
|
86
|
+
offset: {
|
|
87
|
+
x: number;
|
|
88
|
+
y: number;
|
|
89
|
+
};
|
|
90
|
+
}[];
|
|
91
|
+
/**
|
|
92
|
+
* @internal
|
|
93
|
+
*/
|
|
94
|
+
export declare function FilterGroupItem({ title, subtitle, selectedItemsCount, showSelectionCount, isOpen, isLoading, isLoaded, isError, icon, titleExtension, onClick, buttonRef, dropdownId, }: IFilterGroupItemProps): import("react/jsx-runtime").JSX.Element;
|
|
95
|
+
//# sourceMappingURL=FilterGroupItem.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FilterGroupItem.d.ts","sourceRoot":"","sources":["../../src/FilterGroupItem/FilterGroupItem.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,gBAAgB,EAAE,SAAS,EAAa,MAAM,OAAO,CAAC;AAW/D;;GAEG;AACH,MAAM,WAAW,qBAAqB;IAClC;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;;;;;;;;OASG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAE5B;;;OAGG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAE7B;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;OAIG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB;;;;OAIG;IACH,cAAc,CAAC,EAAE,SAAS,CAAC;IAE3B;;;;OAIG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB;;;;OAIG;IACH,SAAS,CAAC,EAAE,gBAAgB,CAAC,WAAW,CAAC,CAAC;IAE1C;;;;OAIG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,eAAO,MAAM,WAAW;;;;;;GAIvB,CAAC;AAEF;;GAEG;AACH,wBAAgB,eAAe,CAAC,EAC5B,KAAK,EACL,QAAQ,EACR,kBAAkB,EAClB,kBAAkB,EAClB,MAAM,EACN,SAAS,EACT,QAAQ,EACR,OAAO,EACP,IAAI,EACJ,cAAc,EACd,OAAO,EACP,SAAS,EACT,UAAU,GACb,EAAE,qBAAqB,2CAkEvB"}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import cx from "classnames";
|
|
3
|
+
import { useIntl } from "react-intl";
|
|
4
|
+
import { stringUtils } from "@gooddata/util";
|
|
5
|
+
import { UiIcon } from "../@ui/UiIcon/UiIcon.js";
|
|
6
|
+
import { ShortenedText } from "../ShortenedText/ShortenedText.js";
|
|
7
|
+
import { useIdPrefixed } from "../utils/useId.js";
|
|
8
|
+
export const ALIGN_POINT = [
|
|
9
|
+
{ align: "tc bc", offset: { x: 0, y: -2 } },
|
|
10
|
+
{ align: "cc tc", offset: { x: 0, y: 10 } },
|
|
11
|
+
{ align: "bl tr", offset: { x: -2, y: -8 } },
|
|
12
|
+
];
|
|
13
|
+
/**
|
|
14
|
+
* @internal
|
|
15
|
+
*/
|
|
16
|
+
export function FilterGroupItem({ title, subtitle, selectedItemsCount, showSelectionCount, isOpen, isLoading, isLoaded, isError, icon, titleExtension, onClick, buttonRef, dropdownId, }) {
|
|
17
|
+
const intl = useIntl();
|
|
18
|
+
let buttonTitle = title;
|
|
19
|
+
let buttonSubtitle = subtitle;
|
|
20
|
+
if (isLoading) {
|
|
21
|
+
buttonTitle = title ?? intl.formatMessage({ id: "loading" });
|
|
22
|
+
buttonSubtitle = intl.formatMessage({ id: "loading" });
|
|
23
|
+
}
|
|
24
|
+
const tooltipId = useIdPrefixed("filter-group-item-locked-tooltip");
|
|
25
|
+
return (_jsxs("div", { className: cx("gd-filter-group-item", {
|
|
26
|
+
"gd-message error": isError,
|
|
27
|
+
"gd-is-active": isOpen,
|
|
28
|
+
"gd-is-loaded": isLoaded,
|
|
29
|
+
}), "aria-haspopup": "dialog", "aria-expanded": isOpen, "aria-describedby": tooltipId, onClick: onClick, "aria-controls": isOpen ? dropdownId : undefined, role: "button", tabIndex: 0, ref: buttonRef, "data-testid": `s-filter-group-item-${stringUtils.simplifyText(title ?? null)}`, children: [isError || icon ? (_jsx("div", { className: "gd-filter-group-item-icon", children: isError ? _jsx(UiIcon, { type: "crossCircle", size: 12, color: "currentColor" }) : icon })) : null, _jsxs("div", { className: "gd-filter-group-item-body", children: [_jsxs("div", { className: "gd-filter-group-item-content", children: [_jsxs("div", { className: "gd-filter-group-item-title-content", children: [_jsx("div", { className: "gd-filter-group-item-title", children: _jsx(ShortenedText, { tooltipAlignPoints: ALIGN_POINT, "data-testid": "s-filter-group-item-title", children: `${buttonTitle}` }) }), titleExtension] }), _jsxs("div", { className: "gd-filter-group-item-subtitle", children: [_jsx("span", { className: "gd-filter-group-item-selected-items", "data-testid": "s-filter-group-item-subtitle", children: buttonSubtitle }), showSelectionCount && isLoaded ? (_jsx("span", { className: "gd-filter-group-item-selected-items-count", children: `(${selectedItemsCount})` })) : null] })] }), _jsx("div", { className: "gd-filter-group-item-chevron", children: _jsx(UiIcon, { type: "navigateRight", size: 14 }) })] })] }));
|
|
30
|
+
}
|
|
31
|
+
//# sourceMappingURL=FilterGroupItem.js.map
|