@gooddata/sdk-ui-kit 11.53.0-alpha.0 → 11.53.0-alpha.2
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/UiConfigEditor/ConfigEditorToolbar.d.ts +26 -0
- package/esm/@ui/UiConfigEditor/ConfigEditorToolbar.d.ts.map +1 -0
- package/esm/@ui/UiConfigEditor/ConfigEditorToolbar.js +38 -0
- package/esm/@ui/UiConfigEditor/UiConfigEditor.d.ts +20 -0
- package/esm/@ui/UiConfigEditor/UiConfigEditor.d.ts.map +1 -0
- package/esm/@ui/UiConfigEditor/UiConfigEditor.js +229 -0
- package/esm/@ui/UiConfigEditor/configEditorGrammars.d.ts +15 -0
- package/esm/@ui/UiConfigEditor/configEditorGrammars.d.ts.map +1 -0
- package/esm/@ui/UiConfigEditor/configEditorGrammars.js +50 -0
- package/esm/@ui/UiConfigEditor/configEditorHighlighting.d.ts +6 -0
- package/esm/@ui/UiConfigEditor/configEditorHighlighting.d.ts.map +1 -0
- package/esm/@ui/UiConfigEditor/configEditorHighlighting.js +31 -0
- package/esm/@ui/UiConfigEditor/configEditorLanguage.d.ts +43 -0
- package/esm/@ui/UiConfigEditor/configEditorLanguage.d.ts.map +1 -0
- package/esm/@ui/UiConfigEditor/configEditorLanguage.js +179 -0
- package/esm/@ui/UiConfigEditor/types.d.ts +135 -0
- package/esm/@ui/UiConfigEditor/types.d.ts.map +1 -0
- package/esm/@ui/UiConfigEditor/types.js +2 -0
- package/esm/@ui/UiMenu/components/defaults/DefaultUiMenuHeader.d.ts.map +1 -1
- package/esm/@ui/UiMenu/components/defaults/DefaultUiMenuHeader.js +5 -2
- package/esm/@ui/UiPagedVirtualList/UiPagedVirtualList.d.ts.map +1 -1
- package/esm/@ui/UiPagedVirtualList/UiPagedVirtualList.js +3 -0
- package/esm/@ui/UiSubmenuHeader/UiSubmenuHeader.d.ts +2 -2
- package/esm/@ui/UiSubmenuHeader/UiSubmenuHeader.d.ts.map +1 -1
- package/esm/@ui/UiSubmenuHeader/UiSubmenuHeader.js +1 -0
- package/esm/@ui/hooks/useVirtualizerRectObserver.d.ts +12 -0
- package/esm/@ui/hooks/useVirtualizerRectObserver.d.ts.map +1 -0
- package/esm/@ui/hooks/useVirtualizerRectObserver.js +34 -0
- package/esm/Datepicker/Datepicker.d.ts +2 -4
- package/esm/Datepicker/Datepicker.d.ts.map +1 -1
- package/esm/Datepicker/Datepicker.js +4 -6
- package/esm/Dialog/StylingEditorDialog/StylingEditorDialog.d.ts +13 -0
- package/esm/Dialog/StylingEditorDialog/StylingEditorDialog.d.ts.map +1 -1
- package/esm/Dialog/StylingEditorDialog/StylingEditorDialog.js +19 -4
- package/esm/Dropdown/DropdownList.d.ts +7 -1
- package/esm/Dropdown/DropdownList.d.ts.map +1 -1
- package/esm/Dropdown/DropdownList.js +3 -2
- package/esm/FlexDimensions/FlexDimensions.d.ts +2 -20
- package/esm/FlexDimensions/FlexDimensions.d.ts.map +1 -1
- package/esm/FlexDimensions/FlexDimensions.js +33 -54
- package/esm/FlexDimensions/typings.d.ts +8 -0
- package/esm/FlexDimensions/typings.d.ts.map +1 -1
- package/esm/FlexDimensions/typings.js +1 -1
- package/esm/Form/Input.d.ts +2 -33
- package/esm/Form/Input.d.ts.map +1 -1
- package/esm/Form/Input.js +30 -35
- package/esm/Form/InputPure.d.ts +40 -50
- package/esm/Form/InputPure.d.ts.map +1 -1
- package/esm/Form/InputPure.js +111 -121
- package/esm/Form/InputWithNumberFormat.d.ts.map +1 -1
- package/esm/Header/Header.d.ts +1 -1
- package/esm/Header/Header.d.ts.map +1 -1
- package/esm/Header/Header.js +4 -3
- package/esm/Header/WorkspacePickerHomeFooter.d.ts +1 -3
- package/esm/Header/WorkspacePickerHomeFooter.d.ts.map +1 -1
- package/esm/Header/WorkspacePickerHomeFooter.js +6 -6
- package/esm/Header/typings.d.ts +0 -2
- package/esm/Header/typings.d.ts.map +1 -1
- package/esm/List/DateDatasetsListItem.d.ts.map +1 -1
- package/esm/List/DateDatasetsListItem.js +1 -2
- package/esm/List/LegacyList.d.ts.map +1 -1
- package/esm/List/LegacyList.js +2 -20
- package/esm/List/List.d.ts.map +1 -1
- package/esm/List/List.js +2 -20
- package/esm/List/ListItem.d.ts +2 -0
- package/esm/List/ListItem.d.ts.map +1 -1
- package/esm/List/ListItem.js +2 -2
- package/esm/ParameterControl/AllowedValuesParameterControlDropdown.d.ts +22 -0
- package/esm/ParameterControl/AllowedValuesParameterControlDropdown.d.ts.map +1 -0
- package/esm/ParameterControl/AllowedValuesParameterControlDropdown.js +38 -0
- package/esm/ParameterControl/ParameterControl.d.ts +3 -2
- package/esm/ParameterControl/ParameterControl.d.ts.map +1 -1
- package/esm/ParameterControl/ParameterControl.js +9 -5
- package/esm/ShortenedText/ShortenedText.d.ts +10 -14
- package/esm/ShortenedText/ShortenedText.d.ts.map +1 -1
- package/esm/ShortenedText/ShortenedText.js +85 -96
- package/esm/index.d.ts +8 -4
- package/esm/index.d.ts.map +1 -1
- package/esm/index.js +3 -2
- package/esm/sdk-ui-kit.d.ts +264 -170
- package/esm/syntaxHighlightingInput/SyntaxHighlightingInput.d.ts +7 -1
- package/esm/syntaxHighlightingInput/SyntaxHighlightingInput.d.ts.map +1 -1
- package/esm/syntaxHighlightingInput/SyntaxHighlightingInput.js +2 -1
- package/esm/syntaxHighlightingInput/hooks/useChangeHandler.d.ts.map +1 -1
- package/esm/syntaxHighlightingInput/hooks/useChangeHandler.js +9 -2
- package/esm/syntaxHighlightingInput/hooks/useCodemirror.d.ts +4 -1
- package/esm/syntaxHighlightingInput/hooks/useCodemirror.d.ts.map +1 -1
- package/esm/syntaxHighlightingInput/hooks/useCodemirror.js +2 -2
- package/esm/syntaxHighlightingInput/hooks/useCodemirrorChange.d.ts +12 -1
- package/esm/syntaxHighlightingInput/hooks/useCodemirrorChange.d.ts.map +1 -1
- package/esm/syntaxHighlightingInput/hooks/useCodemirrorChange.js +10 -8
- package/esm/syntaxHighlightingInput/hooks/useCodemirrorEditable.d.ts.map +1 -1
- package/esm/syntaxHighlightingInput/hooks/useCodemirrorEditable.js +11 -4
- package/esm/syntaxHighlightingInput/hooks/useCodemirrorKeymap.d.ts +1 -1
- package/esm/syntaxHighlightingInput/hooks/useCodemirrorKeymap.d.ts.map +1 -1
- package/esm/syntaxHighlightingInput/hooks/useCodemirrorKeymap.js +26 -22
- package/esm/syntaxHighlightingInput/syntaxErrorLinter.d.ts +24 -0
- package/esm/syntaxHighlightingInput/syntaxErrorLinter.d.ts.map +1 -0
- package/esm/syntaxHighlightingInput/syntaxErrorLinter.js +49 -0
- package/package.json +13 -11
- package/src/@ui/UiConfigEditor/UiConfigEditor.scss +169 -0
- package/src/@ui/UiMenu/UiMenu.scss +6 -0
- package/src/@ui/UiSubmenuHeader/UiSubmenuHeader.scss +15 -0
- package/src/@ui/index.scss +1 -0
- package/src/ParameterControl/ParameterControl.scss +10 -0
- package/styles/css/list.css +11 -0
- package/styles/css/list.css.map +1 -1
- package/styles/css/main.css +150 -1
- package/styles/css/main.css.map +1 -1
- package/styles/css/menu.css +11 -0
- package/styles/css/menu.css.map +1 -1
- package/styles/css/stylingEditorDialog.css +5 -0
- package/styles/css/stylingEditorDialog.css.map +1 -1
- package/styles/css/syntaxHighlightingInput.css +1 -1
- package/styles/css/syntaxHighlightingInput.css.map +1 -1
- package/styles/scss/list.scss +17 -0
- package/styles/scss/stylingEditorDialog.scss +8 -0
- package/styles/scss/syntaxHighlightingInput.scss +5 -2
- package/esm/syntaxHighlightingInput/YamlEditor.d.ts +0 -35
- package/esm/syntaxHighlightingInput/YamlEditor.d.ts.map +0 -1
- package/esm/syntaxHighlightingInput/YamlEditor.js +0 -32
- package/esm/syntaxHighlightingInput/yamlSyntaxLinter.d.ts +0 -12
- package/esm/syntaxHighlightingInput/yamlSyntaxLinter.d.ts.map +0 -1
- package/esm/syntaxHighlightingInput/yamlSyntaxLinter.js +0 -32
package/esm/Form/InputPure.js
CHANGED
|
@@ -1,163 +1,153 @@
|
|
|
1
1
|
import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
// (C) 2020-2026 GoodData Corporation
|
|
3
|
-
import {
|
|
3
|
+
import { forwardRef, useEffect, useImperativeHandle, useRef, } from "react";
|
|
4
4
|
import cx from "classnames";
|
|
5
5
|
import { v4 as uuid } from "uuid";
|
|
6
6
|
import { UiIconButton } from "../@ui/UiIconButton/UiIconButton.js";
|
|
7
7
|
import { ENUM_KEY_CODE } from "../typings/utilities.js";
|
|
8
8
|
import { runAutofocus } from "./focus.js";
|
|
9
9
|
/**
|
|
10
|
+
* Defaults shared with the `Input` wrapper, which re-exposes them as its own `defaultProps`.
|
|
11
|
+
* Keep in sync with the destructuring defaults in {@link InputPure}.
|
|
12
|
+
*
|
|
10
13
|
* @internal
|
|
11
14
|
*/
|
|
12
|
-
export
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
15
|
+
export const inputPureDefaultProps = {
|
|
16
|
+
autofocus: false,
|
|
17
|
+
className: "",
|
|
18
|
+
clearOnEsc: false,
|
|
19
|
+
disabled: false,
|
|
20
|
+
hasError: false,
|
|
21
|
+
hasWarning: false,
|
|
22
|
+
isSearch: false,
|
|
23
|
+
isSmall: false,
|
|
24
|
+
maxlength: 255,
|
|
25
|
+
onChange: (..._args) => { },
|
|
26
|
+
onEscKeyPress: (..._args) => { },
|
|
27
|
+
onEnterKeyPress: (..._args) => { },
|
|
28
|
+
onBlur: (..._args) => { },
|
|
29
|
+
onFocus: (..._args) => { },
|
|
30
|
+
placeholder: "",
|
|
31
|
+
prefix: "",
|
|
32
|
+
readonly: false,
|
|
33
|
+
suffix: "",
|
|
34
|
+
label: "",
|
|
35
|
+
labelPositionTop: false,
|
|
36
|
+
value: "",
|
|
37
|
+
};
|
|
38
|
+
/**
|
|
39
|
+
* @internal
|
|
40
|
+
*/
|
|
41
|
+
export const InputPure = forwardRef(function InputPure(props, ref) {
|
|
42
|
+
const { accessibilityConfig, autocomplete, autofocus = false, className = "", clearOnEsc = false, dataTestId, disabled = false, hasError = false, hasWarning = false, iconButton, iconButtonLabel, id, isSearch = false, isSmall = false, label = "", labelPositionTop = false, maxlength = 255, name, onBlur = (..._args) => { }, onChange = (..._args) => { }, onEnterKeyPress = (..._args) => { }, onEscKeyPress = (..._args) => { }, onFocus = (..._args) => { }, onIconButtonClick, onKeyDown, placeholder = "", prefix = "", readonly = false, required, suffix = "", type, value = "", } = props;
|
|
43
|
+
const inputRef = useRef(null);
|
|
44
|
+
const autofocusDispatcher = useRef(() => { });
|
|
45
|
+
const a11yIdBase = useRef(uuid()).current;
|
|
46
|
+
useEffect(() => {
|
|
47
|
+
autofocusDispatcher.current = runAutofocus(inputRef.current, autofocus);
|
|
48
|
+
// read through the ref rather than closing over the disposer: `onClear` may have replaced it
|
|
49
|
+
// with a newer autofocus loop, and that is the one which has to be cancelled here
|
|
50
|
+
return () => autofocusDispatcher.current();
|
|
51
|
+
}, [autofocus]);
|
|
52
|
+
useImperativeHandle(ref, () => ({
|
|
53
|
+
get inputNodeRef() {
|
|
54
|
+
return inputRef.current;
|
|
55
|
+
},
|
|
56
|
+
focus(options) {
|
|
57
|
+
inputRef.current?.focus(options);
|
|
58
|
+
},
|
|
59
|
+
}), []);
|
|
60
|
+
const handleChange = (e) => {
|
|
61
|
+
onChange(e.target.value, e);
|
|
38
62
|
};
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
}
|
|
43
|
-
componentWillUnmount() {
|
|
44
|
-
this.autofocusDispatcher();
|
|
45
|
-
}
|
|
46
|
-
componentDidUpdate(prevProps) {
|
|
47
|
-
if (prevProps.autofocus !== this.props.autofocus) {
|
|
48
|
-
this.autofocusDispatcher();
|
|
49
|
-
this.autofocusDispatcher = runAutofocus(this.inputNodeRef, this.props.autofocus ?? false);
|
|
50
|
-
}
|
|
51
|
-
}
|
|
52
|
-
onChange = (e) => {
|
|
53
|
-
this.props.onChange?.(e.target.value, e);
|
|
63
|
+
const onClear = (e) => {
|
|
64
|
+
onChange("", e);
|
|
65
|
+
autofocusDispatcher.current = runAutofocus(inputRef.current, true);
|
|
54
66
|
};
|
|
55
|
-
onKeyPress = (e) => {
|
|
67
|
+
const onKeyPress = (e) => {
|
|
56
68
|
switch (e.keyCode) {
|
|
57
69
|
case ENUM_KEY_CODE.KEY_CODE_ESCAPE:
|
|
58
|
-
if (
|
|
70
|
+
if (clearOnEsc) {
|
|
59
71
|
e.stopPropagation();
|
|
60
|
-
|
|
72
|
+
onClear();
|
|
61
73
|
}
|
|
62
|
-
|
|
74
|
+
onEscKeyPress(e);
|
|
63
75
|
break;
|
|
64
76
|
case ENUM_KEY_CODE.KEY_CODE_ENTER:
|
|
65
|
-
|
|
77
|
+
onEnterKeyPress();
|
|
66
78
|
break;
|
|
67
79
|
default:
|
|
68
80
|
break;
|
|
69
81
|
}
|
|
70
82
|
};
|
|
71
|
-
|
|
72
|
-
this.props.onChange?.("", e);
|
|
73
|
-
this.autofocusDispatcher = runAutofocus(this.inputNodeRef, true);
|
|
74
|
-
};
|
|
75
|
-
getLabelClassNames(className) {
|
|
83
|
+
const getLabelClassNames = (classNames) => {
|
|
76
84
|
return cx({
|
|
77
85
|
"gd-input": true,
|
|
78
|
-
"gd-input-small":
|
|
79
|
-
"gd-input-search":
|
|
80
|
-
"gd-input-with-prefix": !!
|
|
81
|
-
"gd-input-with-suffix": !!
|
|
82
|
-
"gd-input-with-icon-button": !!
|
|
83
|
-
"gd-input-with-label": !!
|
|
84
|
-
"gd-input-label-top":
|
|
85
|
-
"has-error":
|
|
86
|
-
"has-warning":
|
|
87
|
-
"is-disabled":
|
|
88
|
-
},
|
|
89
|
-
}
|
|
90
|
-
getInputClassNames() {
|
|
86
|
+
"gd-input-small": isSmall,
|
|
87
|
+
"gd-input-search": isSearch,
|
|
88
|
+
"gd-input-with-prefix": !!prefix,
|
|
89
|
+
"gd-input-with-suffix": !!suffix,
|
|
90
|
+
"gd-input-with-icon-button": !!iconButton,
|
|
91
|
+
"gd-input-with-label": !!label,
|
|
92
|
+
"gd-input-label-top": labelPositionTop,
|
|
93
|
+
"has-error": hasError,
|
|
94
|
+
"has-warning": hasWarning,
|
|
95
|
+
"is-disabled": disabled,
|
|
96
|
+
}, classNames);
|
|
97
|
+
};
|
|
98
|
+
const getInputClassNames = () => {
|
|
91
99
|
return cx({
|
|
92
100
|
"gd-input-field": true,
|
|
93
|
-
"gd-input-field-small":
|
|
101
|
+
"gd-input-field-small": isSmall,
|
|
94
102
|
});
|
|
95
|
-
}
|
|
96
|
-
getA11yIdBase()
|
|
97
|
-
|
|
98
|
-
}
|
|
99
|
-
|
|
100
|
-
return
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
}
|
|
113
|
-
|
|
114
|
-
return
|
|
115
|
-
}
|
|
116
|
-
renderSearch(isSearch) {
|
|
117
|
-
return isSearch ? _jsx("span", { className: "gd-input-icon gd-icon-search" }) : false;
|
|
118
|
-
}
|
|
119
|
-
renderClearIcon(clearOnEsc) {
|
|
120
|
-
return clearOnEsc && this.props.value.length > 0 ? (_jsx("button", { type: "button", className: "gd-input-icon-clear gd-icon-clear s-input-clear", "aria-label": "Input clear", onClick: (e) => {
|
|
103
|
+
};
|
|
104
|
+
const getA11yIdBase = () => id ?? a11yIdBase;
|
|
105
|
+
const getPrefixA11yId = () => `${getA11yIdBase()}-a11y-prefix`;
|
|
106
|
+
const getSuffixA11yId = () => `${getA11yIdBase()}-a11y-suffix`;
|
|
107
|
+
const renderPrefix = (prefixValue, ariaLabel) => {
|
|
108
|
+
return prefixValue ? (_jsxs(_Fragment, { children: [
|
|
109
|
+
_jsx("span", { className: "gd-input-prefix", "aria-hidden": "true", children: prefixValue }), ariaLabel ? (_jsx("span", { className: "sr-only", id: getPrefixA11yId(), children: ariaLabel })) : null] })) : (false);
|
|
110
|
+
};
|
|
111
|
+
const renderSuffix = (suffixValue, ariaLabel) => {
|
|
112
|
+
return suffixValue ? (_jsxs(_Fragment, { children: [
|
|
113
|
+
_jsx("span", { className: "gd-input-suffix", "aria-hidden": "true", children: suffixValue }), ariaLabel ? (_jsx("span", { className: "sr-only", id: getSuffixA11yId(), children: ariaLabel })) : null] })) : (false);
|
|
114
|
+
};
|
|
115
|
+
const renderLabel = (labelValue, htmlFor) => {
|
|
116
|
+
return labelValue ? (_jsx("label", { htmlFor: htmlFor, className: "gd-input-label", children: labelValue })) : (false);
|
|
117
|
+
};
|
|
118
|
+
const renderSearch = (isSearchValue) => {
|
|
119
|
+
return isSearchValue ? _jsx("span", { className: "gd-input-icon gd-icon-search" }) : false;
|
|
120
|
+
};
|
|
121
|
+
const renderClearIcon = (clearOnEscValue) => {
|
|
122
|
+
return clearOnEscValue && value.length > 0 ? (_jsx("button", { type: "button", className: "gd-input-icon-clear gd-icon-clear s-input-clear", "aria-label": "Input clear", onClick: (e) => {
|
|
121
123
|
// react events use delegation and don't bubble, click on clear needs to be kept local
|
|
122
124
|
// to avoid handling by overlay close handler and others
|
|
123
125
|
e.stopPropagation();
|
|
124
|
-
|
|
126
|
+
onClear();
|
|
125
127
|
} })) : (false);
|
|
126
|
-
}
|
|
127
|
-
renderIconButton(
|
|
128
|
-
return
|
|
129
|
-
ariaLabel:
|
|
128
|
+
};
|
|
129
|
+
const renderIconButton = (iconButtonValue, iconButtonLabelValue, onIconButtonClickValue) => {
|
|
130
|
+
return iconButtonValue ? (_jsx("span", { className: "gd-input-icon-button", children: _jsx(UiIconButton, { icon: iconButtonValue, label: iconButtonLabelValue, size: "medium", variant: "tertiary", onClick: onIconButtonClickValue, accessibilityConfig: {
|
|
131
|
+
ariaLabel: iconButtonLabelValue,
|
|
130
132
|
} }) })) : (false);
|
|
131
|
-
}
|
|
132
|
-
getAriaDescribedBy() {
|
|
133
|
-
const { prefix, suffix, accessibilityConfig } = this.props;
|
|
133
|
+
};
|
|
134
|
+
const getAriaDescribedBy = () => {
|
|
134
135
|
const describedBy = [
|
|
135
|
-
prefix && accessibilityConfig?.prefixAriaLabel ?
|
|
136
|
-
suffix && accessibilityConfig?.suffixAriaLabel ?
|
|
136
|
+
prefix && accessibilityConfig?.prefixAriaLabel ? getPrefixA11yId() : undefined,
|
|
137
|
+
suffix && accessibilityConfig?.suffixAriaLabel ? getSuffixA11yId() : undefined,
|
|
137
138
|
accessibilityConfig?.ariaDescribedBy,
|
|
138
139
|
]
|
|
139
140
|
.filter(Boolean)
|
|
140
141
|
.join(" ")
|
|
141
142
|
.trim();
|
|
142
143
|
return describedBy.length ? describedBy : undefined;
|
|
143
|
-
}
|
|
144
|
-
renderInput() {
|
|
145
|
-
const { clearOnEsc, disabled, isSearch, placeholder, prefix, readonly, suffix, maxlength, value, onBlur, onFocus, name, type, required, accessibilityConfig, autocomplete, iconButton, iconButtonLabel, onIconButtonClick, dataTestId, } = this.props;
|
|
144
|
+
};
|
|
145
|
+
const renderInput = () => {
|
|
146
146
|
return (_jsxs("div", { className: "gd-input-wrapper", children: [
|
|
147
|
-
_jsx("input", { ref: (
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
render() {
|
|
152
|
-
const { className, label } = this.props;
|
|
153
|
-
if (label) {
|
|
154
|
-
return (_jsxs("div", { className: this.getLabelClassNames(className ?? ""), children: [this.renderLabel(label, this.getA11yIdBase()), this.renderInput()] }));
|
|
155
|
-
}
|
|
156
|
-
return _jsx("div", { className: this.getLabelClassNames(className ?? ""), children: this.renderInput() });
|
|
157
|
-
}
|
|
158
|
-
focus(options) {
|
|
159
|
-
if (this.inputNodeRef) {
|
|
160
|
-
this.inputNodeRef.focus(options);
|
|
161
|
-
}
|
|
147
|
+
_jsx("input", { ref: inputRef, type: type ?? "text", id: getA11yIdBase(), name: name, required: required, className: getInputClassNames(), disabled: disabled, maxLength: maxlength, onChange: handleChange, onBlur: onBlur, onFocus: onFocus, onKeyDown: onKeyDown ?? onKeyPress, placeholder: placeholder, readOnly: readonly, value: value, role: accessibilityConfig?.role, "aria-label": accessibilityConfig?.ariaLabel ?? undefined, "aria-describedby": getAriaDescribedBy(), "aria-labelledby": accessibilityConfig?.ariaLabelledBy, "aria-expanded": accessibilityConfig?.ariaExpanded, "aria-controls": accessibilityConfig?.ariaControls, "aria-activedescendant": accessibilityConfig?.ariaActiveDescendant, "aria-readonly": readonly || undefined, "aria-autocomplete": accessibilityConfig?.ariaAutocomplete, "aria-invalid": accessibilityConfig?.ariaInvalid, autoComplete: isSearch ? "off" : autocomplete, "data-testid": dataTestId }), renderSearch(isSearch), renderClearIcon(clearOnEsc), renderPrefix(prefix, accessibilityConfig?.prefixAriaLabel), renderSuffix(suffix, accessibilityConfig?.suffixAriaLabel), renderIconButton(iconButton, iconButtonLabel ?? "", onIconButtonClick)] }));
|
|
148
|
+
};
|
|
149
|
+
if (label) {
|
|
150
|
+
return (_jsxs("div", { className: getLabelClassNames(className), children: [renderLabel(label, getA11yIdBase()), renderInput()] }));
|
|
162
151
|
}
|
|
163
|
-
}
|
|
152
|
+
return _jsx("div", { className: getLabelClassNames(className), children: renderInput() });
|
|
153
|
+
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InputWithNumberFormat.d.ts","sourceRoot":"","sources":["../../src/Form/InputWithNumberFormat.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,WAAW,EAAsD,MAAM,OAAO,CAAC;AAI7F,OAAO,
|
|
1
|
+
{"version":3,"file":"InputWithNumberFormat.d.ts","sourceRoot":"","sources":["../../src/Form/InputWithNumberFormat.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,WAAW,EAAsD,MAAM,OAAO,CAAC;AAI7F,OAAO,EAAyB,KAAK,eAAe,EAAa,MAAM,gBAAgB,CAAC;AAExF,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,cAAc,CAAC;AAmD/C;;GAEG;AACH,MAAM,WAAW,8BAA8B;IAC3C,UAAU,CAAC,EAAE,UAAU,CAAC;CAC3B;AAED;;GAEG;AAEH,MAAM,WAAW,2BAA2B;IACxC,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,OAAO,CAAC;CACtB;AAED;;GAEG;AAEH,MAAM,WAAW,2BACb,SAAQ,8BAA8B,EAAE,IAAI,CAAC,eAAe,EAAE,UAAU,CAAC;IACzE,qGAAqG;IACrG,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,EAAE,CAAC,CAAC,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;CAChF;AAUD;;GAEG;AACH,eAAO,MAAM,qBAAqB,mEAsEhC,CAAC"}
|
package/esm/Header/Header.d.ts
CHANGED
|
@@ -2,5 +2,5 @@ import { type IAppHeaderProps } from "./typings.js";
|
|
|
2
2
|
/**
|
|
3
3
|
* @internal
|
|
4
4
|
*/
|
|
5
|
-
export declare
|
|
5
|
+
export declare function AppHeader({ logoHref, accountMenuItems, helpMenuItems, menuItemsGroups, search, notificationsPanel, workspacePicker, isAccessibilityCompliant, logoUrl, logoTitle, organizationName, className, activeColor, headerColor, headerTextColor, documentationUrl, expiredDate, showUpsellButton, onUpsellButtonClick, badges, showStaticHelpMenu, userName, helpMenuDropdownAlignPoints: helpDropdownAlign, disableHelpDropdown, onHelpClick, helpRedirectUrl, showChatItem, isChatOpen, onChatItemClick, onLogoClick, onMenuItemClick }: IAppHeaderProps): import("react/jsx-runtime").JSX.Element;
|
|
6
6
|
//# sourceMappingURL=Header.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Header.d.ts","sourceRoot":"","sources":["../../src/Header/Header.tsx"],"names":[],"mappings":"AA2BA,OAAO,EAAE,KAAK,eAAe,EAA8C,MAAM,cAAc,CAAC;AAyBhG;;GAEG;AACH,
|
|
1
|
+
{"version":3,"file":"Header.d.ts","sourceRoot":"","sources":["../../src/Header/Header.tsx"],"names":[],"mappings":"AA2BA,OAAO,EAAE,KAAK,eAAe,EAA8C,MAAM,cAAc,CAAC;AAyBhG;;GAEG;AACH,wBAAgB,SAAS,CAAC,EACtB,QAAc,EACd,gBAAqB,EACrB,aAAkB,EAClB,eAAoB,EACpB,MAAM,EACN,kBAAkB,EAClB,eAAe,EACf,wBAAwB,EACxB,OAAO,EACP,SAAS,EACT,gBAAgB,EAChB,SAAS,EACT,WAAW,EACX,WAAW,EACX,eAAe,EACf,gBAAgB,EAChB,WAAW,EACX,gBAAgB,EAChB,mBAAmB,EACnB,MAAM,EACN,kBAAkB,EAClB,QAAQ,EACR,2BAA2B,EAAE,iBAAiB,EAC9C,mBAAmB,EACnB,WAAW,EACX,eAAe,EACf,YAAY,EACZ,UAAU,EACV,eAAe,EACf,WAAW,EACX,eAAe,EAClB,EAAE,eAAe,2CAsiBjB"}
|
package/esm/Header/Header.js
CHANGED
|
@@ -6,7 +6,7 @@ import { differenceInCalendarDays, differenceInMonths, format } from "date-fns";
|
|
|
6
6
|
import { debounce } from "lodash-es";
|
|
7
7
|
import { FormattedMessage, defineMessage, defineMessages, useIntl } from "react-intl";
|
|
8
8
|
import { v4 as uuid } from "uuid";
|
|
9
|
-
import {
|
|
9
|
+
import { useTheme } from "@gooddata/sdk-ui-theme-provider";
|
|
10
10
|
import { Icon } from "../Icon/Icon.js";
|
|
11
11
|
import { Overlay } from "../Overlay/Overlay.js";
|
|
12
12
|
import { Typography } from "../Typography/Typography.js";
|
|
@@ -42,8 +42,9 @@ const HEADER_HELP_MENU_ITEM_ID = defineMessage({ id: "gs.header.help" }).id;
|
|
|
42
42
|
/**
|
|
43
43
|
* @internal
|
|
44
44
|
*/
|
|
45
|
-
export
|
|
45
|
+
export function AppHeader({ logoHref = "/", accountMenuItems = [], helpMenuItems = [], menuItemsGroups = [], search, notificationsPanel, workspacePicker, isAccessibilityCompliant, logoUrl, logoTitle, organizationName, className, activeColor, headerColor, headerTextColor, documentationUrl, expiredDate, showUpsellButton, onUpsellButtonClick, badges, showStaticHelpMenu, userName, helpMenuDropdownAlignPoints: helpDropdownAlign, disableHelpDropdown, onHelpClick, helpRedirectUrl, showChatItem, isChatOpen, onChatItemClick, onLogoClick, onMenuItemClick, }) {
|
|
46
46
|
const intl = useIntl();
|
|
47
|
+
const theme = useTheme();
|
|
47
48
|
const [state, setState] = useState({
|
|
48
49
|
childrenWidth: 0,
|
|
49
50
|
guid: `header-${uuid()}`,
|
|
@@ -360,4 +361,4 @@ export const AppHeader = withTheme(function AppHeader({ logoHref = "/", accountM
|
|
|
360
361
|
return (_jsxs("header", { ref: nodeRef, "aria-label": intl.formatMessage({ id: "gs.header.accessibility.label" }), className: cx("gd-header", state.guid, className), children: [isAccessibilityCompliant
|
|
361
362
|
? renderAccessibilityLogo(logoLinkClassName, organizationName ?? "")
|
|
362
363
|
: renderLogo(logoLinkClassName), workspacePicker, state.responsiveMode ? renderMobileNav() : renderStandardNav()] }));
|
|
363
|
-
}
|
|
364
|
+
}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { type MouseEvent, type ReactNode } from "react";
|
|
2
|
-
import { type ITheme } from "@gooddata/sdk-model";
|
|
3
2
|
/**
|
|
4
3
|
* @internal
|
|
5
4
|
*/
|
|
@@ -7,11 +6,10 @@ export interface IWorkspacePickerHomeFooterProps {
|
|
|
7
6
|
href?: string;
|
|
8
7
|
onClick?: (e: MouseEvent<HTMLAnchorElement>) => void;
|
|
9
8
|
className?: string;
|
|
10
|
-
theme?: ITheme;
|
|
11
9
|
children?: ReactNode;
|
|
12
10
|
}
|
|
13
11
|
/**
|
|
14
12
|
* @internal
|
|
15
13
|
*/
|
|
16
|
-
export declare
|
|
14
|
+
export declare function WorkspacePickerHomeFooter({ children, className, href, onClick }: IWorkspacePickerHomeFooterProps): import("react/jsx-runtime").JSX.Element;
|
|
17
15
|
//# sourceMappingURL=WorkspacePickerHomeFooter.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"WorkspacePickerHomeFooter.d.ts","sourceRoot":"","sources":["../../src/Header/WorkspacePickerHomeFooter.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,UAAU,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"WorkspacePickerHomeFooter.d.ts","sourceRoot":"","sources":["../../src/Header/WorkspacePickerHomeFooter.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,UAAU,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AASxD;;GAEG;AACH,MAAM,WAAW,+BAA+B;IAC5C,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IACrD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACxB;AAED;;GAEG;AACH,wBAAgB,yBAAyB,CAAC,EACtC,QAAQ,EACR,SAAS,EACT,IAAI,EACJ,OAAO,EACV,EAAE,+BAA+B,2CA0BjC"}
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import cx from "classnames";
|
|
3
3
|
import { useIntl } from "react-intl";
|
|
4
|
-
import {
|
|
4
|
+
import { useTheme } from "@gooddata/sdk-ui-theme-provider";
|
|
5
5
|
import { Icon } from "../Icon/Icon.js";
|
|
6
|
-
|
|
6
|
+
/**
|
|
7
|
+
* @internal
|
|
8
|
+
*/
|
|
9
|
+
export function WorkspacePickerHomeFooter({ children, className, href, onClick, }) {
|
|
7
10
|
const intl = useIntl();
|
|
11
|
+
const theme = useTheme();
|
|
8
12
|
const mergedClassNames = cx("gd-workspace-picker-home-footer", className);
|
|
9
13
|
const HomeIcon = Icon["Home"];
|
|
10
14
|
return (_jsxs("a", { className: mergedClassNames, "data-testid": "s-workspace-picker-home-footer", href: href, onClick: onClick, tabIndex: 0, "aria-label": intl.formatMessage({ id: "gs.header.href.accessibility" }), children: [
|
|
11
15
|
_jsx(HomeIcon, { className: "gd-icon-home", width: 20, height: 20, color: theme?.palette?.complementary?.c7, ariaHidden: true }), children] }));
|
|
12
16
|
}
|
|
13
|
-
/**
|
|
14
|
-
* @internal
|
|
15
|
-
*/
|
|
16
|
-
export const WorkspacePickerHomeFooter = withTheme(WorkspacePickerHomeFooterComponent);
|
package/esm/Header/typings.d.ts
CHANGED
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { type KeyboardEvent, type MouseEvent, type ReactNode } from "react";
|
|
2
|
-
import { type ITheme } from "@gooddata/sdk-model";
|
|
3
2
|
import { type HelpMenuDropdownAlignPoints } from "../typings/positioning.js";
|
|
4
3
|
/**
|
|
5
4
|
* @internal
|
|
@@ -44,7 +43,6 @@ export interface IAppHeaderProps {
|
|
|
44
43
|
helpMenuDropdownAlignPoints?: HelpMenuDropdownAlignPoints;
|
|
45
44
|
showStaticHelpMenu?: boolean;
|
|
46
45
|
helpRedirectUrl?: string;
|
|
47
|
-
theme?: ITheme;
|
|
48
46
|
showUpsellButton?: boolean;
|
|
49
47
|
onUpsellButtonClick?: (e: MouseEvent) => void;
|
|
50
48
|
search?: ReactNode;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"typings.d.ts","sourceRoot":"","sources":["../../src/Header/typings.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,UAAU,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAE5E,OAAO,EAAE,KAAK,
|
|
1
|
+
{"version":3,"file":"typings.d.ts","sourceRoot":"","sources":["../../src/Header/typings.ts"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateDatasetsListItem.d.ts","sourceRoot":"","sources":["../../src/List/DateDatasetsListItem.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,UAAU,EAAqB,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"DateDatasetsListItem.d.ts","sourceRoot":"","sources":["../../src/List/DateDatasetsListItem.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,UAAU,EAAqB,MAAM,OAAO,CAAC;AAQ3D;;GAEG;AACH,eAAO,MAAM,gCAAgC,wCAAwC,CAAC;AAEtF;;GAEG;AACH,MAAM,WAAW,0BAA0B;IACvC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;CACpD;AAED;;GAEG;AACH,wBAAgB,oBAAoB,CAAC,EACjC,EAAE,EACF,KAAK,EACL,QAAQ,EACR,UAAU,EACV,WAAW,EACX,KAAK,EACL,OAAO,EACV,EAAE,0BAA0B,2CAoC5B"}
|
|
@@ -2,7 +2,6 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
2
2
|
// (C) 2007-2026 GoodData Corporation
|
|
3
3
|
import { useEffect, useRef } from "react";
|
|
4
4
|
import cx from "classnames";
|
|
5
|
-
import { FormattedMessage } from "react-intl";
|
|
6
5
|
import { simplifyText } from "@gooddata/util";
|
|
7
6
|
import { ShortenedText } from "../ShortenedText/ShortenedText.js";
|
|
8
7
|
/**
|
|
@@ -22,7 +21,7 @@ export function DateDatasetsListItem({ id, title, isHeader, isSelected, isUnrela
|
|
|
22
21
|
}
|
|
23
22
|
}, [width]);
|
|
24
23
|
if (isHeader) {
|
|
25
|
-
return
|
|
24
|
+
return _jsx("div", { className: "gd-list-item gd-list-item-header", children: title });
|
|
26
25
|
}
|
|
27
26
|
const classNames = cx(DATE_DATASET_LIST_ITEM_CLASSNAME, `s-${id}`, `s-${simplifyText(title ?? "")}`, {
|
|
28
27
|
"is-selected": isSelected,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LegacyList.d.ts","sourceRoot":"","sources":["../../src/List/LegacyList.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEH,KAAK,YAAY,EAOpB,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"LegacyList.d.ts","sourceRoot":"","sources":["../../src/List/LegacyList.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEH,KAAK,YAAY,EAOpB,MAAM,OAAO,CAAC;AAOf,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,WAAW,CAAC;AAUhD;;GAEG;AACH,MAAM,WAAW,gBAAgB;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IAGnB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,UAAU,EAAE,GAAG,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,MAAM,CAAC;IACnB,gBAAgB,CAAC,EAAE,MAAM,MAAM,CAAC;IAChC,QAAQ,CAAC,EAAE,cAAc,CAAC;IAC1B,aAAa,CAAC,EAAE,cAAc,CAAC;IAC/B,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;IAC/B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,OAAO,EAAE,YAAY,CAAC,GAAG,CAAC,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB;AAED;;GAEG;AACH,MAAM,WAAW,gBAAgB;IAC7B,QAAQ,EAAE,MAAM,CAAC;CACpB;AAED;;;GAGG;AACH,wBAAgB,UAAU,CAAC,EACvB,SAAc,EACd,QAAmB,EACnB,aAAwB,EACxB,QAAmB,EACnB,KAAW,EACX,MAAY,EACZ,UAAe,EACf,gBAAkD,EAClD,gBAAwB,EACxB,UAAU,EACV,OAAO,EACV,EAAE,gBAAgB,2CAiJlB"}
|
package/esm/List/LegacyList.js
CHANGED
|
@@ -3,6 +3,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
3
3
|
import { cloneElement, useCallback, useEffect, useMemo, useRef, } from "react";
|
|
4
4
|
import { useVirtualizer } from "@tanstack/react-virtual";
|
|
5
5
|
import cx from "classnames";
|
|
6
|
+
import { useVirtualizerRectObserver } from "../@ui/hooks/useVirtualizerRectObserver.js";
|
|
6
7
|
// it configures max number of records due to
|
|
7
8
|
// inefficiency with virtual memory allocation
|
|
8
9
|
// that causes application crash (TNT-787)
|
|
@@ -17,26 +18,7 @@ export function LegacyList({ className = "", onScroll = () => { }, onScrollStart
|
|
|
17
18
|
const scrollContainerRef = useRef(null);
|
|
18
19
|
const rowsCount = Math.min(dataSource.rowsCount, MAX_NUMBER_OF_ROWS);
|
|
19
20
|
const estimateSize = useCallback(() => (itemHeightGetter ? itemHeightGetter() : itemHeight), [itemHeightGetter, itemHeight]);
|
|
20
|
-
|
|
21
|
-
// measurement when the DOM has no layout (e.g. jsdom in tests). Keeps virtualization correct
|
|
22
|
-
// without depending on layout being available.
|
|
23
|
-
const observeElementRect = useCallback((_instance, cb) => {
|
|
24
|
-
const el = scrollContainerRef.current;
|
|
25
|
-
if (!el) {
|
|
26
|
-
return undefined;
|
|
27
|
-
}
|
|
28
|
-
const report = () => {
|
|
29
|
-
const rect = el.getBoundingClientRect();
|
|
30
|
-
cb({ width: rect.width || width, height: rect.height || height });
|
|
31
|
-
};
|
|
32
|
-
report();
|
|
33
|
-
if (typeof ResizeObserver === "undefined") {
|
|
34
|
-
return undefined;
|
|
35
|
-
}
|
|
36
|
-
const resizeObserver = new ResizeObserver(report);
|
|
37
|
-
resizeObserver.observe(el);
|
|
38
|
-
return () => resizeObserver.disconnect();
|
|
39
|
-
}, [width, height]);
|
|
21
|
+
const observeElementRect = useVirtualizerRectObserver(scrollContainerRef, height);
|
|
40
22
|
const rowVirtualizer = useVirtualizer({
|
|
41
23
|
count: rowsCount,
|
|
42
24
|
getScrollElement: () => scrollContainerRef.current,
|
package/esm/List/List.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"List.d.ts","sourceRoot":"","sources":["../../src/List/List.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEH,KAAK,YAAY,EAMpB,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"List.d.ts","sourceRoot":"","sources":["../../src/List/List.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEH,KAAK,YAAY,EAMpB,MAAM,OAAO,CAAC;AAMf,OAAO,EAAE,KAAK,wBAAwB,EAAE,MAAM,6BAA6B,CAAC;AAU5E,eAAO,MAAM,uBAAuB,KAAK,CAAC;AAC1C,eAAO,MAAM,mBAAmB,KAAK,CAAC;AAEtC;;GAEG;AACH,MAAM,WAAW,UAAU,CAAC,CAAC;IACzB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,SAAS,CAAC,EAAE,MAAM,CAAC;IAGnB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAE3B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,KAAK,CAAC,EAAE,CAAC,EAAE,CAAC;IACZ,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAC7C,UAAU,EAAE,CAAC,KAAK,EAAE,oBAAoB,CAAC,CAAC,CAAC,KAAK,YAAY,CAAC;IAC7D,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,CAAC;IAEtC,YAAY,CAAC,EAAE,CAAC,CAAC;IACjB,eAAe,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC;IACzB,aAAa,CAAC,EAAE,cAAc,CAAC;IAC/B,WAAW,CAAC,EAAE,cAAc,CAAC;IAE7B,mBAAmB,CAAC,EAAE,IAAI,CAAC,wBAAwB,EAAE,gBAAgB,GAAG,MAAM,CAAC,CAAC;CACnF;AAED;;GAEG;AACH,MAAM,WAAW,oBAAoB,CAAC,CAAC;IACnC,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,CAAC,CAAC;IACR,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;GAEG;AACH,MAAM,MAAM,cAAc,GAAG,CAAC,qBAAqB,EAAE,MAAM,EAAE,mBAAmB,EAAE,MAAM,KAAK,IAAI,CAAC;AAElG;;GAEG;AACH,wBAAgB,IAAI,CAAC,CAAC,EAAE,EACpB,EAAE,EACF,SAAc,EAEd,KAAW,EACX,MAAM,EACN,SAAS,EAET,KAAU,EACV,UAAyB,EACzB,UAAgC,EAChC,gBAA+D,EAC/D,oBAA8C,EAC9C,UAAU,EAEV,aAAa,EACb,WAAW,EAEX,YAAY,EACZ,eAAe,EAEf,mBAAmB,EACtB,EAAE,UAAU,CAAC,CAAC,CAAC,GAAG,YAAY,CAyJ9B"}
|
package/esm/List/List.js
CHANGED
|
@@ -3,6 +3,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
3
3
|
import { useCallback, useEffect, useMemo, useRef, } from "react";
|
|
4
4
|
import { useVirtualizer } from "@tanstack/react-virtual";
|
|
5
5
|
import cx from "classnames";
|
|
6
|
+
import { useVirtualizerRectObserver } from "../@ui/hooks/useVirtualizerRectObserver.js";
|
|
6
7
|
// it configures max number of records due to
|
|
7
8
|
// inefficiency with virtual memory allocation
|
|
8
9
|
// that causes application crash (TNT-787)
|
|
@@ -24,26 +25,7 @@ export function List({ id, className = "", width = 200, height, maxHeight, items
|
|
|
24
25
|
// the visible viewport height; the list is prop-sized so this is deterministic
|
|
25
26
|
const viewportHeight = maxHeight ? Math.min(maxHeight, listHeight) : listHeight;
|
|
26
27
|
const estimateSize = useCallback((index) => (itemHeightGetter ? itemHeightGetter(index) : itemHeight), [itemHeightGetter, itemHeight]);
|
|
27
|
-
|
|
28
|
-
// measurement when the DOM has no layout (e.g. jsdom in tests). Keeps virtualization correct
|
|
29
|
-
// without depending on layout being available.
|
|
30
|
-
const observeElementRect = useCallback((_instance, cb) => {
|
|
31
|
-
const el = scrollContainerRef.current;
|
|
32
|
-
if (!el) {
|
|
33
|
-
return undefined;
|
|
34
|
-
}
|
|
35
|
-
const report = () => {
|
|
36
|
-
const rect = el.getBoundingClientRect();
|
|
37
|
-
cb({ width: rect.width || width, height: rect.height || viewportHeight });
|
|
38
|
-
};
|
|
39
|
-
report();
|
|
40
|
-
if (typeof ResizeObserver === "undefined") {
|
|
41
|
-
return undefined;
|
|
42
|
-
}
|
|
43
|
-
const resizeObserver = new ResizeObserver(report);
|
|
44
|
-
resizeObserver.observe(el);
|
|
45
|
-
return () => resizeObserver.disconnect();
|
|
46
|
-
}, [width, viewportHeight]);
|
|
28
|
+
const observeElementRect = useVirtualizerRectObserver(scrollContainerRef, viewportHeight);
|
|
47
29
|
const rowVirtualizer = useVirtualizer({
|
|
48
30
|
count: rowsCount,
|
|
49
31
|
getScrollElement: () => scrollContainerRef.current,
|
package/esm/List/ListItem.d.ts
CHANGED
|
@@ -9,6 +9,8 @@ export type SingleSelectListItemType = "header" | "separator";
|
|
|
9
9
|
*/
|
|
10
10
|
export interface ISingleSelectListItemProps {
|
|
11
11
|
title?: string;
|
|
12
|
+
/** Rendered right after the title, e.g. a "(Default)" marker. */
|
|
13
|
+
suffix?: ReactNode;
|
|
12
14
|
icon?: string | ReactNode;
|
|
13
15
|
type?: SingleSelectListItemType;
|
|
14
16
|
className?: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListItem.d.ts","sourceRoot":"","sources":["../../src/List/ListItem.tsx"],"names":[],"mappings":"AAEA,OAAO,EACH,KAAK,EAAE,EACP,KAAK,UAAU,EACf,KAAK,SAAS,EAOjB,MAAM,OAAO,CAAC;AAQf,OAAO,EAAE,KAAK,wBAAwB,EAAE,MAAM,6BAA6B,CAAC;AAI5E;;GAEG;AACH,MAAM,MAAM,wBAAwB,GAAG,QAAQ,GAAG,WAAW,CAAC;AAE9D;;GAEG;AACH,MAAM,WAAW,0BAA0B;IACvC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,IAAI,CAAC,EAAE,wBAAwB,CAAC;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,mBAAmB,CAAC,EAAE,wBAAwB,CAAC;IAC/C,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC;IAC/B;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAE/B,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,GAAG,SAAS,GAAG,EAAE,KAAK,SAAS,CAAC;IAC5D,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,GAAG,SAAS,GAAG,EAAE,KAAK,SAAS,CAAC;IAE5D,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAC/C,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IACnD,UAAU,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAClD,2DAA2D;IAC3D,UAAU,CAAC,EAAE,MAAM,CAAC;CACvB;AA8DD;;GAEG;AACH,eAAO,MAAM,oBAAoB,
|
|
1
|
+
{"version":3,"file":"ListItem.d.ts","sourceRoot":"","sources":["../../src/List/ListItem.tsx"],"names":[],"mappings":"AAEA,OAAO,EACH,KAAK,EAAE,EACP,KAAK,UAAU,EACf,KAAK,SAAS,EAOjB,MAAM,OAAO,CAAC;AAQf,OAAO,EAAE,KAAK,wBAAwB,EAAE,MAAM,6BAA6B,CAAC;AAI5E;;GAEG;AACH,MAAM,MAAM,wBAAwB,GAAG,QAAQ,GAAG,WAAW,CAAC;AAE9D;;GAEG;AACH,MAAM,WAAW,0BAA0B;IACvC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,iEAAiE;IACjE,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,IAAI,CAAC,EAAE,wBAAwB,CAAC;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,mBAAmB,CAAC,EAAE,wBAAwB,CAAC;IAC/C,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC;IAC/B;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAE/B,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,GAAG,SAAS,GAAG,EAAE,KAAK,SAAS,CAAC;IAC5D,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,GAAG,SAAS,GAAG,EAAE,KAAK,SAAS,CAAC;IAE5D,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAC/C,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IACnD,UAAU,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAClD,2DAA2D;IAC3D,UAAU,CAAC,EAAE,MAAM,CAAC;CACvB;AA8DD;;GAEG;AACH,eAAO,MAAM,oBAAoB,2IA8J/B,CAAC"}
|
package/esm/List/ListItem.js
CHANGED
|
@@ -27,7 +27,7 @@ const ButtonElement = forwardRef(function ButtonElement({ children, ...props },
|
|
|
27
27
|
* @internal
|
|
28
28
|
*/
|
|
29
29
|
export const SingleSelectListItem = forwardRef(function SingleSelectListItem(props, ref) {
|
|
30
|
-
const { title, icon, type, className, info, variant = "default", eventsOnBubble = false, hideDelayBubble, isSelected, isFocused, isMenu, elementType = "div", iconRenderer, infoRenderer, } = props;
|
|
30
|
+
const { title, suffix, icon, type, className, info, variant = "default", eventsOnBubble = false, hideDelayBubble, isSelected, isFocused, isMenu, elementType = "div", iconRenderer, infoRenderer, } = props;
|
|
31
31
|
const [isOverflowed, setIsOverflowed] = useState(false);
|
|
32
32
|
const titleRef = useRef(null);
|
|
33
33
|
const checkOverflow = useCallback(() => {
|
|
@@ -85,7 +85,7 @@ export const SingleSelectListItem = forwardRef(function SingleSelectListItem(pro
|
|
|
85
85
|
_jsx("div", { className: "inlineBubbleHelp" }), _jsx(Bubble, { className: "bubble-primary", alignPoints: [{ align: "cr cl" }], arrowOffsets: { "cr cl": [15, 0] }, children: info })
|
|
86
86
|
] }) }));
|
|
87
87
|
};
|
|
88
|
-
const children = (_jsxs(_Fragment, { children: [iconRenderer ? iconRenderer(icon) : renderIcon(icon), renderTitle(), infoRenderer ? infoRenderer(info) : renderInfo()] }));
|
|
88
|
+
const children = (_jsxs(_Fragment, { children: [iconRenderer ? iconRenderer(icon) : renderIcon(icon), renderTitle(), suffix ? _jsx("span", { className: "gd-list-item-suffix", children: suffix }) : null, infoRenderer ? infoRenderer(info) : renderInfo()] }));
|
|
89
89
|
if (type === "separator" || type === "header") {
|
|
90
90
|
return (_jsx(DivElement, { ref: ref, ...props, className: cx("gd-list-item", {
|
|
91
91
|
"gd-list-item-separator s-list-separator": type === "separator",
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { type IParameterAllowedValue } from "@gooddata/sdk-model";
|
|
2
|
+
import { type IDropdownBodyRenderProps } from "../Dropdown/Dropdown.js";
|
|
3
|
+
/**
|
|
4
|
+
* @internal
|
|
5
|
+
*/
|
|
6
|
+
export interface IAllowedValuesParameterControlDropdownProps {
|
|
7
|
+
name: string;
|
|
8
|
+
value: string;
|
|
9
|
+
defaultValue: string;
|
|
10
|
+
allowedValues: IParameterAllowedValue[];
|
|
11
|
+
ariaAttributes?: IDropdownBodyRenderProps["ariaAttributes"];
|
|
12
|
+
onApply: (value: string) => void;
|
|
13
|
+
onCancel: () => void;
|
|
14
|
+
}
|
|
15
|
+
/**
|
|
16
|
+
* Dropdown panel for picking a string parameter value out of its allowed values. Renders effective
|
|
17
|
+
* titles only and applies on click — there is no draft, hence no Apply/Cancel.
|
|
18
|
+
*
|
|
19
|
+
* @internal
|
|
20
|
+
*/
|
|
21
|
+
export declare function AllowedValuesParameterControlDropdown({ name, value, defaultValue, allowedValues, ariaAttributes, onApply, onCancel }: IAllowedValuesParameterControlDropdownProps): import("react/jsx-runtime").JSX.Element;
|
|
22
|
+
//# sourceMappingURL=AllowedValuesParameterControlDropdown.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AllowedValuesParameterControlDropdown.d.ts","sourceRoot":"","sources":["../../src/ParameterControl/AllowedValuesParameterControlDropdown.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,KAAK,sBAAsB,EAAiC,MAAM,qBAAqB,CAAC;AAGjG,OAAO,EAAE,KAAK,wBAAwB,EAAE,MAAM,yBAAyB,CAAC;AAcxE;;GAEG;AACH,MAAM,WAAW,2CAA2C;IACxD,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,sBAAsB,EAAE,CAAC;IACxC,cAAc,CAAC,EAAE,wBAAwB,CAAC,gBAAgB,CAAC,CAAC;IAC5D,OAAO,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,QAAQ,EAAE,MAAM,IAAI,CAAC;CACxB;AAED;;;;;GAKG;AACH,wBAAgB,qCAAqC,CAAC,EAClD,IAAI,EACJ,KAAK,EACL,YAAY,EACZ,aAAa,EACb,cAAc,EACd,OAAO,EACP,QAAQ,EACX,EAAE,2CAA2C,2CAuC7C"}
|