@codecademy/gamut 72.2.3-alpha.e393cd.0 → 72.2.3-alpha.e8c7ae.0
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/agent-tools/skills/gamut-forms/SKILL.md +0 -16
- package/dist/Alert/elements.d.ts +2 -2
- package/dist/Anchor/index.d.ts +19 -9
- package/dist/Anchor/index.js +9 -6
- package/dist/BarChart/BarRow/elements.d.ts +47 -45
- package/dist/BarChart/utils/hooks.d.ts +2 -2
- package/dist/BarChart/utils/hooks.js +3 -1
- package/dist/Box/GridBox.d.ts +1 -0
- package/dist/Box/GridBox.js +1 -1
- package/dist/Box/props.d.ts +1 -1
- package/dist/Breadcrumbs/index.d.ts +5 -5
- package/dist/Breadcrumbs/index.js +2 -2
- package/dist/Button/CTAButton.d.ts +2 -2
- package/dist/Button/FillButton.d.ts +4 -4
- package/dist/Button/IconButton.d.ts +4 -4
- package/dist/Button/StrokeButton.d.ts +4 -4
- package/dist/Button/TextButton.d.ts +4 -4
- package/dist/Button/shared/InlineIconButton.d.ts +2 -2
- package/dist/Button/shared/styles.d.ts +3 -3
- package/dist/Button/shared/types.d.ts +1 -1
- package/dist/ButtonBase/ButtonBase.d.ts +9 -4
- package/dist/ButtonBase/ButtonBase.js +11 -4
- package/dist/Card/elements.d.ts +109 -103
- package/dist/Card/styles.d.ts +8 -8
- package/dist/Coachmark/index.d.ts +1 -1
- package/dist/ConnectedForm/ConnectedForm.d.ts +1 -1
- package/dist/ConnectedForm/ConnectedFormGroup.js +3 -2
- package/dist/ConnectedForm/utils.d.ts +1 -1
- package/dist/ConnectedForm/utils.js +1 -1
- package/dist/DatePicker/DatePickerInput/index.d.ts +1 -1
- package/dist/Disclosure/elements.d.ts +18 -12
- package/dist/FeatureShimmer/index.js +1 -1
- package/dist/Form/SelectDropdown/SelectDropdown.js +19 -36
- package/dist/Form/SelectDropdown/elements/constants.d.ts +8 -0
- package/dist/Form/SelectDropdown/elements/constants.js +9 -1
- package/dist/Form/SelectDropdown/elements/containers.d.ts +2 -6
- package/dist/Form/SelectDropdown/elements/containers.js +2 -18
- package/dist/Form/SelectDropdown/elements/controls.d.ts +5 -0
- package/dist/Form/SelectDropdown/elements/controls.js +70 -2
- package/dist/Form/SelectDropdown/elements/multi-value.js +2 -2
- package/dist/Form/SelectDropdown/elements/options.d.ts +0 -1
- package/dist/Form/SelectDropdown/elements/options.js +2 -5
- package/dist/Form/SelectDropdown/styles.js +10 -28
- package/dist/Form/SelectDropdown/types/component-props.d.ts +6 -54
- package/dist/Form/SelectDropdown/types/internal.d.ts +2 -2
- package/dist/Form/SelectDropdown/types/styles.d.ts +0 -4
- package/dist/Form/SelectDropdown/utils.d.ts +1 -7
- package/dist/Form/SelectDropdown/utils.js +2 -17
- package/dist/Form/elements/Form.d.ts +15 -15
- package/dist/Form/elements/FormGroup.d.ts +1 -1
- package/dist/Form/styles/Checkbox-styles.d.ts +1 -1
- package/dist/GridForm/GridFormButtons/index.d.ts +4 -4
- package/dist/List/ListProvider.d.ts +1 -1
- package/dist/List/elements.d.ts +44 -42
- package/dist/Menu/MenuItem.js +10 -6
- package/dist/Menu/elements.d.ts +2 -2
- package/dist/Modals/Dialog.js +6 -2
- package/dist/Modals/Modal.js +5 -2
- package/dist/Modals/elements.d.ts +1 -1
- package/dist/Pagination/AnimatedPaginationButtons.d.ts +31 -29
- package/dist/Pagination/EllipsisButton.d.ts +2 -2
- package/dist/Pagination/PaginationButton.d.ts +6 -6
- package/dist/Pagination/utils.d.ts +31 -29
- package/dist/Pagination/utils.js +14 -11
- package/dist/Popover/Popover.js +6 -6
- package/dist/Popover/types.d.ts +4 -3
- package/dist/PopoverContainer/PopoverContainer.js +9 -9
- package/dist/PopoverContainer/hooks.d.ts +16 -4
- package/dist/PopoverContainer/hooks.js +50 -27
- package/dist/PopoverContainer/types.d.ts +2 -1
- package/dist/Tabs/TabButton.d.ts +2 -2
- package/dist/Tabs/TabNavLink.d.ts +2 -2
- package/dist/Tag/elements.d.ts +14 -8
- package/dist/Tip/InfoTip/InfoTipButton.d.ts +4 -4
- package/dist/Tip/PreviewTip/elements.d.ts +12 -6
- package/dist/Tip/__tests__/helpers.d.ts +1 -1
- package/dist/Tip/shared/FloatingTip.js +2 -2
- package/dist/Tip/shared/types.d.ts +2 -2
- package/dist/Tip/shared/utils.js +1 -1
- package/dist/utils/nullish.d.ts +10 -0
- package/dist/utils/nullish.js +11 -0
- package/dist/utils/react.js +4 -2
- package/package.json +10 -10
- package/agent-tools/skills/gamut-select-dropdown/SKILL.md +0 -236
|
@@ -17,7 +17,7 @@ const Shimmer = /*#__PURE__*/_styled(BaseContainer, {
|
|
|
17
17
|
left: '-100%',
|
|
18
18
|
top: 0,
|
|
19
19
|
bg: 'white-400'
|
|
20
|
-
}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
20
|
+
}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9GZWF0dXJlU2hpbW1lci9pbmRleC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBT2dCIiwiZmlsZSI6Ii4uLy4uL3NyYy9GZWF0dXJlU2hpbW1lci9pbmRleC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBjc3MgfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1zdHlsZXMnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgbW90aW9uLCB1c2VSZWR1Y2VkTW90aW9uIH0gZnJvbSAnZnJhbWVyLW1vdGlvbic7XG5cbmltcG9ydCB7IEJveCwgQm94UHJvcHMgfSBmcm9tICcuLi9Cb3gnO1xuXG5jb25zdCBCYXNlQ29udGFpbmVyID0gbW90aW9uLmNyZWF0ZShCb3gpO1xuY29uc3QgU2hpbW1lciA9IHN0eWxlZChCYXNlQ29udGFpbmVyKShcbiAgY3NzKHtcbiAgICBoZWlnaHQ6ICcxNTAlJyxcbiAgICB3aWR0aDogJ2NhbGMoMTAwJSAvIDkpJyxcbiAgICBwb3NpdGlvbjogJ2Fic29sdXRlJyxcbiAgICB0cmFuc2Zvcm06ICdyb3RhdGUoMzBkZWcpJyxcbiAgICB0cmFuc2Zvcm1PcmlnaW46ICd0b3AgcmlnaHQnLFxuICAgIGZpbHRlcjogJ2JsdXIoMjVweCknLFxuICAgIGxlZnQ6ICctMTAwJScsXG4gICAgdG9wOiAwLFxuICAgIGJnOiAnd2hpdGUtNDAwJyxcbiAgfSlcbik7XG5cbmNvbnN0IGJveFZhcmlhbnRzID0ge1xuICBpblZpZXc6IHtcbiAgICBiYWNrZ3JvdW5kQ29sb3I6ICdyZ2JhKDAsIDAsIDAsIDApJyxcbiAgICBib3JkZXJDb2xvcjogJ3JnYmEoMCwgMCwgMCwgMCknLFxuICAgIHRyYW5zaXRpb246IHtcbiAgICAgIGVhc2U6ICdlYXNlT3V0JyBhcyBjb25zdCxcbiAgICAgIGR1cmF0aW9uOiAwLjMsXG4gICAgICBkZWxheTogNCxcbiAgICB9LFxuICB9LFxufTtcblxuY29uc3Qgc2hpbW1lclZhcmlhbnRzID0ge1xuICBpblZpZXc6IHtcbiAgICBsZWZ0OiAnMTIwJScsIC8vIGV4dHJhICUgdG8gYWNjb3VudCBmb3Igcm90YXRpb25cbiAgICBiYWNrZ3JvdW5kQ29sb3I6ICdyZ2JhKDAsIDAsIDAsIDApJyxcbiAgICB0cmFuc2l0aW9uOiB7XG4gICAgICBsZWZ0OiB7XG4gICAgICAgIGVhc2U6ICdlYXNlSW5PdXQnIGFzIGNvbnN0LFxuICAgICAgICBkdXJhdGlvbjogMixcbiAgICAgICAgZGVsYXk6IDIsXG4gICAgICB9LFxuICAgICAgYmFja2dyb3VuZENvbG9yOiB7XG4gICAgICAgIGVhc2U6ICdlYXNlT3V0JyBhcyBjb25zdCxcbiAgICAgICAgZHVyYXRpb246IDEsXG4gICAgICAgIGRlbGF5OiA0LFxuICAgICAgfSxcbiAgICB9LFxuICB9LFxufTtcblxuZXhwb3J0IGNvbnN0IEZlYXR1cmVTaGltbWVyOiBSZWFjdC5GQzxPbWl0PEJveFByb3BzLCAncmVmJz4+ID0gKHtcbiAgY2hpbGRyZW4sXG4gIC4uLnJlc3Rcbn0pID0+IHtcbiAgY29uc3Qgc2hvdWxkUmVkdWNlTW90aW9uID0gdXNlUmVkdWNlZE1vdGlvbigpO1xuICByZXR1cm4gKFxuICAgIDxCb3ggey4uLnJlc3R9PlxuICAgICAge3Nob3VsZFJlZHVjZU1vdGlvbiA/IChcbiAgICAgICAgY2hpbGRyZW5cbiAgICAgICkgOiAoXG4gICAgICAgIDxCYXNlQ29udGFpbmVyXG4gICAgICAgICAgYmc9XCJiYWNrZ3JvdW5kLXNlbGVjdGVkXCJcbiAgICAgICAgICBib3JkZXI9ezF9XG4gICAgICAgICAgYm9yZGVyQ29sb3I9XCJib3JkZXItdGVydGlhcnlcIlxuICAgICAgICAgIGJvcmRlclJhZGl1cz17cmVzdD8uYm9yZGVyUmFkaXVzfVxuICAgICAgICAgIGhlaWdodD17MX1cbiAgICAgICAgICBvdmVyZmxvdz1cImhpZGRlblwiXG4gICAgICAgICAgcG9zaXRpb249XCJyZWxhdGl2ZVwiXG4gICAgICAgICAgdmFyaWFudHM9e2JveFZhcmlhbnRzfVxuICAgICAgICAgIHZpZXdwb3J0PXt7IG9uY2U6IHRydWUgfX1cbiAgICAgICAgICB3aGlsZUluVmlldz1cImluVmlld1wiXG4gICAgICAgICAgd2lkdGg9ezF9XG4gICAgICAgID5cbiAgICAgICAgICA8U2hpbW1lclxuICAgICAgICAgICAgZGF0YS10ZXN0aWQ9XCJmZWF0dXJlLXNoaW1tZXJcIlxuICAgICAgICAgICAgdmFyaWFudHM9e3NoaW1tZXJWYXJpYW50c31cbiAgICAgICAgICAgIHZpZXdwb3J0PXt7IG9uY2U6IHRydWUgfX1cbiAgICAgICAgICAvPlxuICAgICAgICAgIHtjaGlsZHJlbn1cbiAgICAgICAgPC9CYXNlQ29udGFpbmVyPlxuICAgICAgKX1cbiAgICA8L0JveD5cbiAgKTtcbn07XG4iXX0= */");
|
|
21
21
|
const boxVariants = {
|
|
22
22
|
inView: {
|
|
23
23
|
backgroundColor: 'rgba(0, 0, 0, 0)',
|
|
@@ -4,7 +4,7 @@ import * as React from 'react';
|
|
|
4
4
|
import { parseOptions } from '../utils';
|
|
5
5
|
import { AbbreviatedSingleValue, CustomContainer, CustomInput, CustomValueContainer, DropdownButton, formatGroupLabel, formatOptionLabel, IconOption, MultiValueRemoveButton, MultiValueWithColorMode, onFocus, RemoveAllButton, SelectDropdownContext, TypedReactSelect } from './elements';
|
|
6
6
|
import { getMemoizedStyles } from './styles';
|
|
7
|
-
import { filterValueFromOptions,
|
|
7
|
+
import { filterValueFromOptions, isMultipleSelectProps, isOptionsGrouped, isSingleSelectProps, removeValueFromSelectedOptions } from './utils';
|
|
8
8
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
9
9
|
const defaultProps = {
|
|
10
10
|
name: undefined,
|
|
@@ -73,30 +73,22 @@ export const SelectDropdown = ({
|
|
|
73
73
|
disabled,
|
|
74
74
|
dropdownWidth,
|
|
75
75
|
error,
|
|
76
|
-
formatCreateLabel = inputValue => `Add "${inputValue}"`,
|
|
77
76
|
id,
|
|
78
77
|
inputProps,
|
|
79
78
|
inputWidth,
|
|
80
|
-
|
|
81
|
-
isSearchable: isSearchableProp = false,
|
|
82
|
-
isValidNewOption,
|
|
79
|
+
isSearchable = false,
|
|
83
80
|
menuAlignment = 'left',
|
|
84
81
|
multiple,
|
|
85
82
|
name,
|
|
86
83
|
onChange,
|
|
87
|
-
onCreateOption,
|
|
88
|
-
onInputChange,
|
|
89
84
|
options,
|
|
90
85
|
placeholder = 'Select an option',
|
|
91
86
|
shownOptionsLimit = 6,
|
|
92
87
|
size,
|
|
93
|
-
validationMessage,
|
|
94
88
|
value,
|
|
95
89
|
zIndex,
|
|
96
90
|
...rest
|
|
97
91
|
}) => {
|
|
98
|
-
// isSearchable is forced true when isCreatable is true (CreatableSelect requires a text input)
|
|
99
|
-
const isSearchable = isCreatable || isSearchableProp;
|
|
100
92
|
const rawInputId = useId();
|
|
101
93
|
const inputId = name ?? `${id}-select-dropdown-${rawInputId}`;
|
|
102
94
|
const [activated, setActivated] = useState(false);
|
|
@@ -134,41 +126,39 @@ export const SelectDropdown = ({
|
|
|
134
126
|
// To keep this efficient for non-multiSelect
|
|
135
127
|
filterValueFromOptions(selectOptions, value, isOptionsGrouped(selectOptions)));
|
|
136
128
|
|
|
137
|
-
//
|
|
138
|
-
// Uncontrolled multi (`value` undefined or '') keeps selection in local state.
|
|
129
|
+
// If the caller changes the initial value, let's update our value to match.
|
|
139
130
|
useEffect(() => {
|
|
140
|
-
if (!multiple || !Array.isArray(value)) return;
|
|
141
131
|
const newMultiValues = filterValueFromOptions(selectOptions, value, isOptionsGrouped(selectOptions));
|
|
142
132
|
if (newMultiValues !== multiValues) setMultiValues(newMultiValues);
|
|
143
133
|
|
|
134
|
+
//
|
|
144
135
|
// We only update this when our passed in options or value changes, not multiValues.
|
|
145
136
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
146
|
-
}, [options, value
|
|
147
|
-
const changeHandler = useCallback(
|
|
137
|
+
}, [options, value]);
|
|
138
|
+
const changeHandler = useCallback(optionEvent => {
|
|
148
139
|
setActivated(true);
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
onCreateOption?.(createdValue);
|
|
153
|
-
}
|
|
154
|
-
}
|
|
140
|
+
|
|
141
|
+
// We have to do this because the version of typescript we have doesn't have the transitivity of these type guards yet. But, we will soon!
|
|
142
|
+
// Should probably come with: https://codecademy.atlassian.net/browse/GM-354
|
|
155
143
|
const onChangeProps = {
|
|
156
144
|
onChange,
|
|
157
145
|
multiple
|
|
158
146
|
};
|
|
159
|
-
const forwardedMeta = actionMeta.action === 'create-option' ? actionMeta : {
|
|
160
|
-
action: onChangeAction,
|
|
161
|
-
option: isMultipleSelectProps(onChangeProps) ? undefined : optionEvent
|
|
162
|
-
};
|
|
163
147
|
if (isSingleSelectProps(onChangeProps)) {
|
|
164
148
|
const singleOptionEvent = optionEvent;
|
|
165
|
-
onChangeProps.onChange?.(singleOptionEvent,
|
|
149
|
+
onChangeProps.onChange?.(singleOptionEvent, {
|
|
150
|
+
action: onChangeAction,
|
|
151
|
+
option: singleOptionEvent
|
|
152
|
+
});
|
|
166
153
|
}
|
|
167
154
|
if (isMultipleSelectProps(onChangeProps)) {
|
|
168
155
|
setMultiValues(optionEvent);
|
|
169
|
-
onChangeProps.onChange?.(optionEvent,
|
|
156
|
+
onChangeProps.onChange?.(optionEvent, {
|
|
157
|
+
action: onChangeAction,
|
|
158
|
+
option: undefined // At the moment this isn't used, but when multi select is built for real, boom (https://codecademy.atlassian.net/browse/GM-354)
|
|
159
|
+
});
|
|
170
160
|
}
|
|
171
|
-
}, [onChange, multiple
|
|
161
|
+
}, [onChange, multiple]);
|
|
172
162
|
const keyPressHandler = e => {
|
|
173
163
|
if (multiple && e.key === 'Enter' && currentFocusedValue && multiValues) {
|
|
174
164
|
const newMultiValues = removeValueFromSelectedOptions(multiValues, currentFocusedValue);
|
|
@@ -178,8 +168,6 @@ export const SelectDropdown = ({
|
|
|
178
168
|
removeAllButtonRef.current.focus();
|
|
179
169
|
}
|
|
180
170
|
};
|
|
181
|
-
const noOptionsMessage = validationMessage === undefined ? undefined // fall back to react-select default ("No options")
|
|
182
|
-
: typeof validationMessage === 'function' ? validationMessage : () => validationMessage;
|
|
183
171
|
const theme = useTheme();
|
|
184
172
|
const memoizedStyles = useMemo(() => {
|
|
185
173
|
return getMemoizedStyles(theme, zIndex);
|
|
@@ -200,7 +188,6 @@ export const SelectDropdown = ({
|
|
|
200
188
|
},
|
|
201
189
|
dropdownWidth: dropdownWidth,
|
|
202
190
|
error: Boolean(error),
|
|
203
|
-
formatCreateLabel: formatCreateLabel,
|
|
204
191
|
formatGroupLabel: formatGroupLabel,
|
|
205
192
|
formatOptionLabel: formatOptionLabel,
|
|
206
193
|
id: id || rest.htmlFor || rawInputId,
|
|
@@ -209,15 +196,12 @@ export const SelectDropdown = ({
|
|
|
209
196
|
...inputProps
|
|
210
197
|
},
|
|
211
198
|
inputWidth: inputWidth,
|
|
212
|
-
isCreatable: isCreatable,
|
|
213
199
|
isDisabled: disabled,
|
|
214
200
|
isMulti: multiple,
|
|
215
|
-
isOptionDisabled: option => option.disabled,
|
|
201
|
+
isOptionDisabled: option => option.disabled ?? false,
|
|
216
202
|
isSearchable: isSearchable,
|
|
217
|
-
isValidNewOption: isValidNewOption,
|
|
218
203
|
menuAlignment: menuAlignment,
|
|
219
204
|
name: name,
|
|
220
|
-
noOptionsMessage: noOptionsMessage,
|
|
221
205
|
options: selectOptions,
|
|
222
206
|
placeholder: placeholder,
|
|
223
207
|
selectRef: selectInputRef,
|
|
@@ -226,7 +210,6 @@ export const SelectDropdown = ({
|
|
|
226
210
|
styles: memoizedStyles,
|
|
227
211
|
value: multiple ? multiValues : parsedValue,
|
|
228
212
|
onChange: changeHandler,
|
|
229
|
-
onInputChange: onInputChange,
|
|
230
213
|
onKeyDown: multiple ? e => keyPressHandler(e) : undefined,
|
|
231
214
|
...rest
|
|
232
215
|
})
|
|
@@ -15,6 +15,14 @@ export declare const indicatorIcons: {
|
|
|
15
15
|
size: number;
|
|
16
16
|
icon: import("react").ForwardRefExoticComponent<import("@codecademy/gamut-icons").GamutIconProps & import("react").RefAttributes<SVGSVGElement>>;
|
|
17
17
|
};
|
|
18
|
+
smallSearchable: {
|
|
19
|
+
size: number;
|
|
20
|
+
icon: import("react").ForwardRefExoticComponent<import("@codecademy/gamut-icons").GamutIconProps & import("react").RefAttributes<SVGSVGElement>>;
|
|
21
|
+
};
|
|
22
|
+
mediumSearchable: {
|
|
23
|
+
size: number;
|
|
24
|
+
icon: import("react").ForwardRefExoticComponent<import("@codecademy/gamut-icons").GamutIconProps & import("react").RefAttributes<SVGSVGElement>>;
|
|
25
|
+
};
|
|
18
26
|
smallRemove: {
|
|
19
27
|
size: number;
|
|
20
28
|
icon: import("react").ForwardRefExoticComponent<import("@codecademy/gamut-icons").GamutIconProps & import("react").RefAttributes<SVGSVGElement>>;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ArrowChevronDownIcon, CloseIcon, MiniChevronDownIcon, MiniDeleteIcon } from '@codecademy/gamut-icons';
|
|
1
|
+
import { ArrowChevronDownIcon, CloseIcon, MiniChevronDownIcon, MiniDeleteIcon, SearchIcon } from '@codecademy/gamut-icons';
|
|
2
2
|
export const iconSize = {
|
|
3
3
|
small: 12,
|
|
4
4
|
medium: 16
|
|
@@ -16,6 +16,14 @@ export const indicatorIcons = {
|
|
|
16
16
|
size: iconSize.medium,
|
|
17
17
|
icon: ArrowChevronDownIcon
|
|
18
18
|
},
|
|
19
|
+
smallSearchable: {
|
|
20
|
+
size: iconSize.small,
|
|
21
|
+
icon: SearchIcon
|
|
22
|
+
},
|
|
23
|
+
mediumSearchable: {
|
|
24
|
+
size: iconSize.medium,
|
|
25
|
+
icon: SearchIcon
|
|
26
|
+
},
|
|
19
27
|
smallRemove: {
|
|
20
28
|
size: iconSize.small,
|
|
21
29
|
icon: MiniDeleteIcon
|
|
@@ -24,10 +24,6 @@ export declare const CustomValueContainer: ({ ...rest }: CustomSelectComponentPr
|
|
|
24
24
|
export declare const CustomInput: ({ ...rest }: CustomSelectComponentProps<typeof SelectDropdownElements.Input>) => import("react/jsx-runtime").JSX.Element;
|
|
25
25
|
/**
|
|
26
26
|
* Typed wrapper around react-select component.
|
|
27
|
-
*
|
|
28
|
-
* Creatable-only props (formatCreateLabel, isValidNewOption) are stripped from
|
|
29
|
-
* the non-creatable path so they don't reach ReactSelect. `onCreateOption` is
|
|
30
|
-
* handled in SelectDropdown's changeHandler — do not pass it to CreatableSelect
|
|
31
|
-
* or react-select will skip onChange on create.
|
|
27
|
+
* Provides type safety for the underlying react-select implementation.
|
|
32
28
|
*/
|
|
33
|
-
export declare function TypedReactSelect<OptionType, IsMulti extends boolean = false, GroupType extends GroupBase<OptionType> = GroupBase<OptionType>>({ selectRef,
|
|
29
|
+
export declare function TypedReactSelect<OptionType, IsMulti extends boolean = false, GroupType extends GroupBase<OptionType> = GroupBase<OptionType>>({ selectRef, ...props }: Props<OptionType, IsMulti, GroupType> & TypedReactSelectProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { createContext, useLayoutEffect } from 'react';
|
|
2
2
|
import ReactSelect, { components as SelectDropdownElements } from 'react-select';
|
|
3
|
-
import CreatableSelect from 'react-select/creatable';
|
|
4
3
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
5
4
|
/**
|
|
6
5
|
* React context for sharing state between SelectDropdown components.
|
|
@@ -62,7 +61,7 @@ export const CustomValueContainer = ({
|
|
|
62
61
|
} = rest.selectProps;
|
|
63
62
|
if (inputId) {
|
|
64
63
|
const inputElement = document.getElementById(inputId);
|
|
65
|
-
if (inputElement
|
|
64
|
+
if (inputElement?.getAttribute('role') === 'combobox') {
|
|
66
65
|
Object.entries(comboboxProps).forEach(([key, value]) => {
|
|
67
66
|
inputElement.setAttribute(key, value);
|
|
68
67
|
});
|
|
@@ -117,27 +116,12 @@ export const CustomInput = ({
|
|
|
117
116
|
|
|
118
117
|
/**
|
|
119
118
|
* Typed wrapper around react-select component.
|
|
120
|
-
*
|
|
121
|
-
* Creatable-only props (formatCreateLabel, isValidNewOption) are stripped from
|
|
122
|
-
* the non-creatable path so they don't reach ReactSelect. `onCreateOption` is
|
|
123
|
-
* handled in SelectDropdown's changeHandler — do not pass it to CreatableSelect
|
|
124
|
-
* or react-select will skip onChange on create.
|
|
119
|
+
* Provides type safety for the underlying react-select implementation.
|
|
125
120
|
*/
|
|
126
121
|
export function TypedReactSelect({
|
|
127
122
|
selectRef,
|
|
128
|
-
isCreatable,
|
|
129
|
-
formatCreateLabel,
|
|
130
|
-
isValidNewOption,
|
|
131
123
|
...props
|
|
132
124
|
}) {
|
|
133
|
-
if (isCreatable) {
|
|
134
|
-
return /*#__PURE__*/_jsx(CreatableSelect, {
|
|
135
|
-
...props,
|
|
136
|
-
formatCreateLabel: formatCreateLabel,
|
|
137
|
-
isValidNewOption: isValidNewOption,
|
|
138
|
-
ref: selectRef
|
|
139
|
-
});
|
|
140
|
-
}
|
|
141
125
|
return /*#__PURE__*/_jsx(ReactSelect, {
|
|
142
126
|
...props,
|
|
143
127
|
ref: selectRef
|
|
@@ -13,3 +13,8 @@ export declare const onFocus: AriaOnFocus<ExtendedOption>;
|
|
|
13
13
|
* The icon type depends on whether the select is searchable or not.
|
|
14
14
|
*/
|
|
15
15
|
export declare const DropdownButton: (props: SizedIndicatorProps) => import("react/jsx-runtime").JSX.Element;
|
|
16
|
+
/**
|
|
17
|
+
* Custom remove all button for multi-select mode.
|
|
18
|
+
* Provides keyboard navigation and accessible removal of all selected values.
|
|
19
|
+
*/
|
|
20
|
+
export declare const RemoveAllButton: (props: SizedIndicatorProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,5 +1,9 @@
|
|
|
1
|
+
import _styled from "@emotion/styled/base";
|
|
2
|
+
import { css, theme } from '@codecademy/gamut-styles';
|
|
3
|
+
import { useContext } from 'react';
|
|
1
4
|
import { components as SelectDropdownElements } from 'react-select';
|
|
2
5
|
import { indicatorIcons } from './constants';
|
|
6
|
+
import { SelectDropdownContext } from './containers';
|
|
3
7
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
4
8
|
const {
|
|
5
9
|
DropdownIndicator
|
|
@@ -32,13 +36,15 @@ export const onFocus = ({
|
|
|
32
36
|
*/
|
|
33
37
|
export const DropdownButton = props => {
|
|
34
38
|
const {
|
|
35
|
-
size
|
|
39
|
+
size,
|
|
40
|
+
isSearchable
|
|
36
41
|
} = props.selectProps;
|
|
37
42
|
const color = props.isDisabled ? 'text-disabled' : 'text';
|
|
38
43
|
const iconSize = size ?? 'medium';
|
|
44
|
+
const iconType = isSearchable ? 'Searchable' : 'Chevron';
|
|
39
45
|
const {
|
|
40
46
|
...iconProps
|
|
41
|
-
} = indicatorIcons[`${iconSize}
|
|
47
|
+
} = indicatorIcons[`${iconSize}${iconType}`];
|
|
42
48
|
const {
|
|
43
49
|
icon: IndicatorIcon
|
|
44
50
|
} = iconProps;
|
|
@@ -49,4 +55,66 @@ export const DropdownButton = props => {
|
|
|
49
55
|
color: color
|
|
50
56
|
})
|
|
51
57
|
});
|
|
58
|
+
};
|
|
59
|
+
const CustomStyledRemoveAllDiv = /*#__PURE__*/_styled('div', {
|
|
60
|
+
target: "e1xkmr70",
|
|
61
|
+
label: "CustomStyledRemoveAllDiv"
|
|
62
|
+
})(css({
|
|
63
|
+
'&:focus': {
|
|
64
|
+
outline: `2px solid ${theme.colors.primary}`
|
|
65
|
+
},
|
|
66
|
+
'&:focus-visible': {
|
|
67
|
+
outline: `2px solid ${theme.colors.primary}`
|
|
68
|
+
}
|
|
69
|
+
}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9Gb3JtL1NlbGVjdERyb3Bkb3duL2VsZW1lbnRzL2NvbnRyb2xzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFxRGlDIiwiZmlsZSI6Ii4uLy4uLy4uLy4uL3NyYy9Gb3JtL1NlbGVjdERyb3Bkb3duL2VsZW1lbnRzL2NvbnRyb2xzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcywgdGhlbWUgfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1zdHlsZXMnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgS2V5Ym9hcmRFdmVudCwgdXNlQ29udGV4dCB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7XG4gIEFyaWFPbkZvY3VzLFxuICBjb21wb25lbnRzIGFzIFNlbGVjdERyb3Bkb3duRWxlbWVudHMsXG59IGZyb20gJ3JlYWN0LXNlbGVjdCc7XG5cbmltcG9ydCB7IEV4dGVuZGVkT3B0aW9uLCBTaXplZEluZGljYXRvclByb3BzIH0gZnJvbSAnLi4vdHlwZXMnO1xuaW1wb3J0IHsgaW5kaWNhdG9ySWNvbnMgfSBmcm9tICcuL2NvbnN0YW50cyc7XG5pbXBvcnQgeyBTZWxlY3REcm9wZG93bkNvbnRleHQgfSBmcm9tICcuL2NvbnRhaW5lcnMnO1xuXG5jb25zdCB7IERyb3Bkb3duSW5kaWNhdG9yIH0gPSBTZWxlY3REcm9wZG93bkVsZW1lbnRzO1xuXG4vKipcbiAqIEdlbmVyYXRlcyBhY2Nlc3NpYmxlIGZvY3VzIG1lc3NhZ2VzIGZvciBzY3JlZW4gcmVhZGVycy5cbiAqIFByb3ZpZGVzIGRldGFpbGVkIGluZm9ybWF0aW9uIGFib3V0IHRoZSBjdXJyZW50bHkgZm9jdXNlZCBvcHRpb24uXG4gKlxuICogQHBhcmFtIHBhcmFtcyAtIE9iamVjdCBjb250YWluaW5nIHRoZSBmb2N1c2VkIG9wdGlvbiBkZXRhaWxzXG4gKiBAcmV0dXJucyBGb3JtYXR0ZWQgYWNjZXNzaWJpbGl0eSBtZXNzYWdlXG4gKi9cbmV4cG9ydCBjb25zdCBvbkZvY3VzOiBBcmlhT25Gb2N1czxFeHRlbmRlZE9wdGlvbj4gPSAoe1xuICBmb2N1c2VkOiB7IGxhYmVsLCBzdWJ0aXRsZSwgcmlnaHRMYWJlbCwgZGlzYWJsZWQgfSxcbn0pID0+IHtcbiAgY29uc3QgZm9ybWF0dGVkU3VidGl0bGUgPSBgLCAke3N1YnRpdGxlfWA7XG4gIGNvbnN0IGZvcm1hdHRlZFJpZ2h0TGFiZWwgPSBgLCAke3JpZ2h0TGFiZWx9YDtcblxuICBjb25zdCBtc2cgPSBgWW91IGFyZSBjdXJyZW50bHkgZm9jdXNlZCBvbiBvcHRpb24gJHtsYWJlbH0ke1xuICAgIHN1YnRpdGxlID8gZm9ybWF0dGVkU3VidGl0bGUgOiAnJ1xuICB9ICR7cmlnaHRMYWJlbCA/IGZvcm1hdHRlZFJpZ2h0TGFiZWwgOiAnJ30ke2Rpc2FibGVkID8gJywgZGlzYWJsZWQnIDogJyd9YDtcblxuICByZXR1cm4gbXNnO1xufTtcblxuLyoqXG4gKiBDdXN0b20gZHJvcGRvd24gaW5kaWNhdG9yIHRoYXQgc2hvd3MgZWl0aGVyIGEgY2hldnJvbiBvciBzZWFyY2ggaWNvbi5cbiAqIFRoZSBpY29uIHR5cGUgZGVwZW5kcyBvbiB3aGV0aGVyIHRoZSBzZWxlY3QgaXMgc2VhcmNoYWJsZSBvciBub3QuXG4gKi9cbmV4cG9ydCBjb25zdCBEcm9wZG93bkJ1dHRvbiA9IChwcm9wczogU2l6ZWRJbmRpY2F0b3JQcm9wcykgPT4ge1xuICBjb25zdCB7IHNpemUsIGlzU2VhcmNoYWJsZSB9ID0gcHJvcHMuc2VsZWN0UHJvcHM7XG4gIGNvbnN0IGNvbG9yID0gcHJvcHMuaXNEaXNhYmxlZCA/ICd0ZXh0LWRpc2FibGVkJyA6ICd0ZXh0JztcbiAgY29uc3QgaWNvblNpemUgPSBzaXplID8/ICdtZWRpdW0nO1xuICBjb25zdCBpY29uVHlwZSA9IGlzU2VhcmNoYWJsZSA/ICdTZWFyY2hhYmxlJyA6ICdDaGV2cm9uJztcbiAgY29uc3QgeyAuLi5pY29uUHJvcHMgfSA9IGluZGljYXRvckljb25zW2Ake2ljb25TaXplfSR7aWNvblR5cGV9YF07XG4gIGNvbnN0IHsgaWNvbjogSW5kaWNhdG9ySWNvbiB9ID0gaWNvblByb3BzO1xuXG4gIHJldHVybiAoXG4gICAgPERyb3Bkb3duSW5kaWNhdG9yIHsuLi5wcm9wc30+XG4gICAgICA8SW5kaWNhdG9ySWNvbiB7Li4uaWNvblByb3BzfSBjb2xvcj17Y29sb3J9IC8+XG4gICAgPC9Ecm9wZG93bkluZGljYXRvcj5cbiAgKTtcbn07XG5cbmNvbnN0IEN1c3RvbVN0eWxlZFJlbW92ZUFsbERpdiA9IHN0eWxlZCgnZGl2JykoXG4gIGNzcyh7XG4gICAgJyY6Zm9jdXMnOiB7XG4gICAgICBvdXRsaW5lOiBgMnB4IHNvbGlkICR7dGhlbWUuY29sb3JzLnByaW1hcnl9YCxcbiAgICB9LFxuICAgICcmOmZvY3VzLXZpc2libGUnOiB7XG4gICAgICBvdXRsaW5lOiBgMnB4IHNvbGlkICR7dGhlbWUuY29sb3JzLnByaW1hcnl9YCxcbiAgICB9LFxuICB9KVxuKTtcblxuLyoqXG4gKiBDdXN0b20gcmVtb3ZlIGFsbCBidXR0b24gZm9yIG11bHRpLXNlbGVjdCBtb2RlLlxuICogUHJvdmlkZXMga2V5Ym9hcmQgbmF2aWdhdGlvbiBhbmQgYWNjZXNzaWJsZSByZW1vdmFsIG9mIGFsbCBzZWxlY3RlZCB2YWx1ZXMuXG4gKi9cbmV4cG9ydCBjb25zdCBSZW1vdmVBbGxCdXR0b24gPSAocHJvcHM6IFNpemVkSW5kaWNhdG9yUHJvcHMpID0+IHtcbiAgY29uc3Qge1xuICAgIGdldFN0eWxlcyxcbiAgICBpbm5lclByb3BzOiB7IC4uLnJlc3RJbm5lclByb3BzIH0sXG4gICAgc2VsZWN0UHJvcHM6IHsgc2l6ZSB9LFxuICB9ID0gcHJvcHM7XG5cbiAgY29uc3QgeyByZW1vdmVBbGxCdXR0b25SZWYsIHNlbGVjdElucHV0UmVmIH0gPSB1c2VDb250ZXh0KFxuICAgIFNlbGVjdERyb3Bkb3duQ29udGV4dFxuICApO1xuXG4gIGNvbnN0IGljb25TaXplID0gc2l6ZSA/PyAnbWVkaXVtJztcbiAgY29uc3QgeyAuLi5pY29uUHJvcHMgfSA9IGluZGljYXRvckljb25zW2Ake2ljb25TaXplfVJlbW92ZWBdO1xuICBjb25zdCB7IGljb246IEluZGljYXRvckljb24gfSA9IGljb25Qcm9wcztcblxuICBjb25zdCBvbktleVByZXNzID0gKGU6IEtleWJvYXJkRXZlbnQ8SFRNTERpdkVsZW1lbnQ+KSA9PiB7XG4gICAgaWYgKGUua2V5ID09PSAnRW50ZXInICYmIHJlc3RJbm5lclByb3BzLm9uTW91c2VEb3duKSB7XG4gICAgICByZXN0SW5uZXJQcm9wcy5vbk1vdXNlRG93bihlIGFzIGFueSk7XG4gICAgfVxuXG4gICAgaWYgKFxuICAgICAgc2VsZWN0SW5wdXRSZWY/LmN1cnJlbnQgJiZcbiAgICAgIChlLmtleSA9PT0gJ0Fycm93UmlnaHQnIHx8IGUua2V5ID09PSAnQXJyb3dMZWZ0JyB8fCBlLmtleSA9PT0gJ0Fycm93RG93bicpXG4gICAgKSB7XG4gICAgICBzZWxlY3RJbnB1dFJlZi5jdXJyZW50LmZvY3VzKCk7XG4gICAgfVxuICB9O1xuXG4gIGNvbnN0IHN0eWxlID0gZ2V0U3R5bGVzKCdjbGVhckluZGljYXRvcicsIHByb3BzKSBhcyBSZWFjdC5DU1NQcm9wZXJ0aWVzO1xuXG4gIHJldHVybiAoXG4gICAgPEN1c3RvbVN0eWxlZFJlbW92ZUFsbERpdlxuICAgICAgYXJpYS1sYWJlbD1cIlJlbW92ZSBhbGwgc2VsZWN0ZWRcIlxuICAgICAgcm9sZT1cImJ1dHRvblwiXG4gICAgICB0YWJJbmRleD17MH1cbiAgICAgIHsuLi5yZXN0SW5uZXJQcm9wc31cbiAgICAgIHJlZj17cmVtb3ZlQWxsQnV0dG9uUmVmIGFzIFJlYWN0LlJlZjxIVE1MRGl2RWxlbWVudD59XG4gICAgICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgZ2FtdXQvbm8taW5saW5lLXN0eWxlXG4gICAgICBzdHlsZT17c3R5bGV9XG4gICAgICBvbktleURvd249e29uS2V5UHJlc3N9XG4gICAgPlxuICAgICAgPEluZGljYXRvckljb24gey4uLmljb25Qcm9wc30gY29sb3I9XCJ0ZXh0XCIgLz5cbiAgICA8L0N1c3RvbVN0eWxlZFJlbW92ZUFsbERpdj5cbiAgKTtcbn07XG4iXX0= */");
|
|
70
|
+
|
|
71
|
+
/**
|
|
72
|
+
* Custom remove all button for multi-select mode.
|
|
73
|
+
* Provides keyboard navigation and accessible removal of all selected values.
|
|
74
|
+
*/
|
|
75
|
+
export const RemoveAllButton = props => {
|
|
76
|
+
const {
|
|
77
|
+
getStyles,
|
|
78
|
+
innerProps: {
|
|
79
|
+
...restInnerProps
|
|
80
|
+
},
|
|
81
|
+
selectProps: {
|
|
82
|
+
size
|
|
83
|
+
}
|
|
84
|
+
} = props;
|
|
85
|
+
const {
|
|
86
|
+
removeAllButtonRef,
|
|
87
|
+
selectInputRef
|
|
88
|
+
} = useContext(SelectDropdownContext);
|
|
89
|
+
const iconSize = size ?? 'medium';
|
|
90
|
+
const {
|
|
91
|
+
...iconProps
|
|
92
|
+
} = indicatorIcons[`${iconSize}Remove`];
|
|
93
|
+
const {
|
|
94
|
+
icon: IndicatorIcon
|
|
95
|
+
} = iconProps;
|
|
96
|
+
const onKeyPress = e => {
|
|
97
|
+
if (e.key === 'Enter' && restInnerProps.onMouseDown) {
|
|
98
|
+
restInnerProps.onMouseDown(e);
|
|
99
|
+
}
|
|
100
|
+
if (selectInputRef?.current && (e.key === 'ArrowRight' || e.key === 'ArrowLeft' || e.key === 'ArrowDown')) {
|
|
101
|
+
selectInputRef.current.focus();
|
|
102
|
+
}
|
|
103
|
+
};
|
|
104
|
+
const style = getStyles('clearIndicator', props);
|
|
105
|
+
return /*#__PURE__*/_jsx(CustomStyledRemoveAllDiv, {
|
|
106
|
+
"aria-label": "Remove all selected",
|
|
107
|
+
role: "button",
|
|
108
|
+
tabIndex: 0,
|
|
109
|
+
...restInnerProps,
|
|
110
|
+
ref: removeAllButtonRef
|
|
111
|
+
// eslint-disable-next-line gamut/no-inline-style
|
|
112
|
+
,
|
|
113
|
+
style: style,
|
|
114
|
+
onKeyDown: onKeyPress,
|
|
115
|
+
children: /*#__PURE__*/_jsx(IndicatorIcon, {
|
|
116
|
+
...iconProps,
|
|
117
|
+
color: "text"
|
|
118
|
+
})
|
|
119
|
+
});
|
|
52
120
|
};
|
|
@@ -75,7 +75,7 @@ const CustomStyledRemoveAllDiv = /*#__PURE__*/_styled('div', {
|
|
|
75
75
|
'&:focus-visible': {
|
|
76
76
|
outline: `2px solid ${theme.colors.primary}`
|
|
77
77
|
}
|
|
78
|
-
}, ";label:CustomStyledRemoveAllDiv;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9Gb3JtL1NlbGVjdERyb3Bkb3duL2VsZW1lbnRzL211bHRpLXZhbHVlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE2RUUiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL0Zvcm0vU2VsZWN0RHJvcGRvd24vZWxlbWVudHMvbXVsdGktdmFsdWUudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgTWluaURlbGV0ZUljb24gfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1pY29ucyc7XG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LXN0eWxlcyc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBLZXlib2FyZEV2ZW50LCB1c2VDb250ZXh0IH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0IHtcbiAgY29tcG9uZW50cyBhcyBTZWxlY3REcm9wZG93bkVsZW1lbnRzLFxuICBHcm91cEJhc2UsXG4gIE11bHRpVmFsdWVQcm9wcyxcbiAgTXVsdGlWYWx1ZVJlbW92ZVByb3BzLFxufSBmcm9tICdyZWFjdC1zZWxlY3QnO1xuXG5pbXBvcnQgeyBFeHRlbmRlZE9wdGlvbiwgU2l6ZWRJbmRpY2F0b3JQcm9wcyB9IGZyb20gJy4uL3R5cGVzJztcbmltcG9ydCB7IGluZGljYXRvckljb25zIH0gZnJvbSAnLi9jb25zdGFudHMnO1xuaW1wb3J0IHsgU2VsZWN0RHJvcGRvd25Db250ZXh0IH0gZnJvbSAnLi9jb250YWluZXJzJztcblxuY29uc3QgeyBNdWx0aVZhbHVlLCBNdWx0aVZhbHVlUmVtb3ZlIH0gPSBTZWxlY3REcm9wZG93bkVsZW1lbnRzO1xuXG4vKipcbiAqIEN1c3RvbSBtdWx0aS12YWx1ZSBjb21wb25lbnQgdGhhdCBtYW5hZ2VzIGZvY3VzIHN0YXRlIGZvciBrZXlib2FyZCBuYXZpZ2F0aW9uLlxuICogVHJhY2tzIHdoaWNoIG11bHRpLXZhbHVlIGlzIGN1cnJlbnRseSBmb2N1c2VkIGFuZCB1cGRhdGVzIHRoZSBjb250ZXh0IGFjY29yZGluZ2x5LlxuICovXG5leHBvcnQgY29uc3QgTXVsdGlWYWx1ZVdpdGhDb2xvck1vZGUgPSAoXG4gIHByb3BzOiBNdWx0aVZhbHVlUHJvcHM8RXh0ZW5kZWRPcHRpb24sIHRydWUsIEdyb3VwQmFzZTxFeHRlbmRlZE9wdGlvbj4+XG4pID0+IHtcbiAgY29uc3QgeyBjdXJyZW50Rm9jdXNlZFZhbHVlLCBzZXRDdXJyZW50Rm9jdXNlZFZhbHVlIH0gPSB1c2VDb250ZXh0KFxuICAgIFNlbGVjdERyb3Bkb3duQ29udGV4dFxuICApO1xuXG4gIGNvbnN0IHsgZGF0YSB9ID0gcHJvcHM7XG5cbiAgY29uc3QgeyB2YWx1ZSwgbGFiZWwgfSA9IGRhdGE7XG5cbiAgaWYgKFxuICAgIHByb3BzLmlzRm9jdXNlZCAmJlxuICAgIHNldEN1cnJlbnRGb2N1c2VkVmFsdWUgJiZcbiAgICBjdXJyZW50Rm9jdXNlZFZhbHVlICE9PSB2YWx1ZVxuICApIHtcbiAgICBzZXRDdXJyZW50Rm9jdXNlZFZhbHVlKHZhbHVlKTtcbiAgfVxuXG4gIGlmIChcbiAgICAhcHJvcHMuaXNGb2N1c2VkICYmXG4gICAgc2V0Q3VycmVudEZvY3VzZWRWYWx1ZSAmJlxuICAgIGN1cnJlbnRGb2N1c2VkVmFsdWUgPT09IHZhbHVlXG4gICkge1xuICAgIHNldEN1cnJlbnRGb2N1c2VkVmFsdWUodW5kZWZpbmVkKTtcbiAgfVxuICBjb25zdCBkaXNwbGF5VGV4dCA9IGRhdGE/LmFiYnJldmlhdGlvbiA/IGRhdGEuYWJicmV2aWF0aW9uIDogbGFiZWwgfHwgJyc7XG5cbiAgcmV0dXJuIDxNdWx0aVZhbHVlIHsuLi5wcm9wc30+e2Rpc3BsYXlUZXh0fTwvTXVsdGlWYWx1ZT47XG59O1xuXG4vKipcbiAqIEN1c3RvbSByZW1vdmUgYnV0dG9uIGZvciBtdWx0aS12YWx1ZSBpdGVtcy5cbiAqIFByb3ZpZGVzIGFjY2Vzc2libGUgcmVtb3ZhbCBmdW5jdGlvbmFsaXR5IHdpdGggcHJvcGVyIEFSSUEgbGFiZWxzLlxuICovXG5leHBvcnQgY29uc3QgTXVsdGlWYWx1ZVJlbW92ZUJ1dHRvbiA9IChcbiAgcHJvcHM6IE11bHRpVmFsdWVSZW1vdmVQcm9wczxFeHRlbmRlZE9wdGlvbiwgdHJ1ZSwgR3JvdXBCYXNlPEV4dGVuZGVkT3B0aW9uPj5cbikgPT4ge1xuICBjb25zdCB7IGxhYmVsIH0gPSBwcm9wcz8uZGF0YSA/PyB7IGxhYmVsOiAnJyB9O1xuXG4gIHByb3BzLmlubmVyUHJvcHNbJ2FyaWEtbGFiZWwnXSA9IGBSZW1vdmUgJHtsYWJlbH1gO1xuXG4gIHJldHVybiAoXG4gICAgPE11bHRpVmFsdWVSZW1vdmUgey4uLnByb3BzfT5cbiAgICAgIDxNaW5pRGVsZXRlSWNvbiBzaXplPXsxMn0gLz5cbiAgICA8L011bHRpVmFsdWVSZW1vdmU+XG4gICk7XG59O1xuXG4vKipcbiAqIEN1c3RvbSByZW1vdmUgYWxsIGJ1dHRvbiBmb3IgbXVsdGktc2VsZWN0IG1vZGUuXG4gKiBQcm92aWRlcyBrZXlib2FyZCBuYXZpZ2F0aW9uIGFuZCBhY2Nlc3NpYmxlIHJlbW92YWwgb2YgYWxsIHNlbGVjdGVkIHZhbHVlcy5cbiAqL1xuXG5jb25zdCBDdXN0b21TdHlsZWRSZW1vdmVBbGxEaXYgPSBzdHlsZWQoJ2RpdicpKFxuICBjc3Moe1xuICAgICcmOmZvY3VzJzoge1xuICAgICAgb3V0bGluZTogYDJweCBzb2xpZCAke3RoZW1lLmNvbG9ycy5wcmltYXJ5fWAsXG4gICAgfSxcbiAgICAnJjpmb2N1cy12aXNpYmxlJzoge1xuICAgICAgb3V0bGluZTogYDJweCBzb2xpZCAke3RoZW1lLmNvbG9ycy5wcmltYXJ5fWAsXG4gICAgfSxcbiAgfSlcbik7XG5cbmV4cG9ydCBjb25zdCBSZW1vdmVBbGxCdXR0b24gPSAocHJvcHM6IFNpemVkSW5kaWNhdG9yUHJvcHMpID0+IHtcbiAgY29uc3Qge1xuICAgIGdldFN0eWxlcyxcbiAgICBpbm5lclByb3BzOiB7IC4uLnJlc3RJbm5lclByb3BzIH0sXG4gICAgc2VsZWN0UHJvcHM6IHsgc2l6ZSB9LFxuICB9ID0gcHJvcHM7XG5cbiAgY29uc3QgeyByZW1vdmVBbGxCdXR0b25SZWYsIHNlbGVjdElucHV0UmVmIH0gPSB1c2VDb250ZXh0KFxuICAgIFNlbGVjdERyb3Bkb3duQ29udGV4dFxuICApO1xuXG4gIGNvbnN0IGljb25TaXplID0gc2l6ZSA/PyAnbWVkaXVtJztcbiAgY29uc3QgeyAuLi5pY29uUHJvcHMgfSA9IGluZGljYXRvckljb25zW2Ake2ljb25TaXplfVJlbW92ZWBdO1xuICBjb25zdCB7IGljb246IEluZGljYXRvckljb24gfSA9IGljb25Qcm9wcztcblxuICBjb25zdCBvbktleVByZXNzID0gKGU6IEtleWJvYXJkRXZlbnQ8SFRNTERpdkVsZW1lbnQ+KSA9PiB7XG4gICAgaWYgKGUua2V5ID09PSAnRW50ZXInICYmIHJlc3RJbm5lclByb3BzLm9uTW91c2VEb3duKSB7XG4gICAgICByZXN0SW5uZXJQcm9wcy5vbk1vdXNlRG93bihlIGFzIGFueSk7XG4gICAgfVxuXG4gICAgaWYgKFxuICAgICAgc2VsZWN0SW5wdXRSZWY/LmN1cnJlbnQgJiZcbiAgICAgIChlLmtleSA9PT0gJ0Fycm93UmlnaHQnIHx8IGUua2V5ID09PSAnQXJyb3dMZWZ0JyB8fCBlLmtleSA9PT0gJ0Fycm93RG93bicpXG4gICAgKSB7XG4gICAgICBzZWxlY3RJbnB1dFJlZj8uY3VycmVudC5mb2N1cygpO1xuICAgIH1cbiAgfTtcblxuICBjb25zdCBzdHlsZSA9IGdldFN0eWxlcygnY2xlYXJJbmRpY2F0b3InLCBwcm9wcykgYXMgUmVhY3QuQ1NTUHJvcGVydGllcztcblxuICByZXR1cm4gKFxuICAgIDxDdXN0b21TdHlsZWRSZW1vdmVBbGxEaXZcbiAgICAgIGFyaWEtbGFiZWw9XCJSZW1vdmUgYWxsIHNlbGVjdGVkXCJcbiAgICAgIHJvbGU9XCJidXR0b25cIlxuICAgICAgdGFiSW5kZXg9ezB9XG4gICAgICB7Li4ucmVzdElubmVyUHJvcHN9XG4gICAgICByZWY9e3JlbW92ZUFsbEJ1dHRvblJlZn1cbiAgICAgIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBnYW11dC9uby1pbmxpbmUtc3R5bGVcbiAgICAgIHN0eWxlPXtzdHlsZX1cbiAgICAgIG9uS2V5RG93bj17b25LZXlQcmVzc31cbiAgICA+XG4gICAgICA8SW5kaWNhdG9ySWNvbiB7Li4uaWNvblByb3BzfSBjb2xvcj1cInRleHRcIiAvPlxuICAgIDwvQ3VzdG9tU3R5bGVkUmVtb3ZlQWxsRGl2PlxuICApO1xufTtcbiJdfQ== */")), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9Gb3JtL1NlbGVjdERyb3Bkb3duL2VsZW1lbnRzL211bHRpLXZhbHVlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE0RWlDIiwiZmlsZSI6Ii4uLy4uLy4uLy4uL3NyYy9Gb3JtL1NlbGVjdERyb3Bkb3duL2VsZW1lbnRzL211bHRpLXZhbHVlLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IE1pbmlEZWxldGVJY29uIH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQtaWNvbnMnO1xuaW1wb3J0IHsgdGhlbWUgfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1zdHlsZXMnO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgS2V5Ym9hcmRFdmVudCwgdXNlQ29udGV4dCB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7XG4gIGNvbXBvbmVudHMgYXMgU2VsZWN0RHJvcGRvd25FbGVtZW50cyxcbiAgR3JvdXBCYXNlLFxuICBNdWx0aVZhbHVlUHJvcHMsXG4gIE11bHRpVmFsdWVSZW1vdmVQcm9wcyxcbn0gZnJvbSAncmVhY3Qtc2VsZWN0JztcblxuaW1wb3J0IHsgRXh0ZW5kZWRPcHRpb24sIFNpemVkSW5kaWNhdG9yUHJvcHMgfSBmcm9tICcuLi90eXBlcyc7XG5pbXBvcnQgeyBpbmRpY2F0b3JJY29ucyB9IGZyb20gJy4vY29uc3RhbnRzJztcbmltcG9ydCB7IFNlbGVjdERyb3Bkb3duQ29udGV4dCB9IGZyb20gJy4vY29udGFpbmVycyc7XG5cbmNvbnN0IHsgTXVsdGlWYWx1ZSwgTXVsdGlWYWx1ZVJlbW92ZSB9ID0gU2VsZWN0RHJvcGRvd25FbGVtZW50cztcblxuLyoqXG4gKiBDdXN0b20gbXVsdGktdmFsdWUgY29tcG9uZW50IHRoYXQgbWFuYWdlcyBmb2N1cyBzdGF0ZSBmb3Iga2V5Ym9hcmQgbmF2aWdhdGlvbi5cbiAqIFRyYWNrcyB3aGljaCBtdWx0aS12YWx1ZSBpcyBjdXJyZW50bHkgZm9jdXNlZCBhbmQgdXBkYXRlcyB0aGUgY29udGV4dCBhY2NvcmRpbmdseS5cbiAqL1xuZXhwb3J0IGNvbnN0IE11bHRpVmFsdWVXaXRoQ29sb3JNb2RlID0gKFxuICBwcm9wczogTXVsdGlWYWx1ZVByb3BzPEV4dGVuZGVkT3B0aW9uLCB0cnVlLCBHcm91cEJhc2U8RXh0ZW5kZWRPcHRpb24+PlxuKSA9PiB7XG4gIGNvbnN0IHsgY3VycmVudEZvY3VzZWRWYWx1ZSwgc2V0Q3VycmVudEZvY3VzZWRWYWx1ZSB9ID0gdXNlQ29udGV4dChcbiAgICBTZWxlY3REcm9wZG93bkNvbnRleHRcbiAgKTtcblxuICBjb25zdCB7IGRhdGEgfSA9IHByb3BzO1xuXG4gIGNvbnN0IHsgdmFsdWUsIGxhYmVsIH0gPSBkYXRhO1xuXG4gIGlmIChcbiAgICBwcm9wcy5pc0ZvY3VzZWQgJiZcbiAgICBzZXRDdXJyZW50Rm9jdXNlZFZhbHVlICYmXG4gICAgY3VycmVudEZvY3VzZWRWYWx1ZSAhPT0gdmFsdWVcbiAgKSB7XG4gICAgc2V0Q3VycmVudEZvY3VzZWRWYWx1ZSh2YWx1ZSk7XG4gIH1cblxuICBpZiAoXG4gICAgIXByb3BzLmlzRm9jdXNlZCAmJlxuICAgIHNldEN1cnJlbnRGb2N1c2VkVmFsdWUgJiZcbiAgICBjdXJyZW50Rm9jdXNlZFZhbHVlID09PSB2YWx1ZVxuICApIHtcbiAgICBzZXRDdXJyZW50Rm9jdXNlZFZhbHVlKHVuZGVmaW5lZCk7XG4gIH1cbiAgY29uc3QgZGlzcGxheVRleHQgPSBkYXRhPy5hYmJyZXZpYXRpb24gPyBkYXRhLmFiYnJldmlhdGlvbiA6IGxhYmVsIHx8ICcnO1xuXG4gIHJldHVybiA8TXVsdGlWYWx1ZSB7Li4ucHJvcHN9PntkaXNwbGF5VGV4dH08L011bHRpVmFsdWU+O1xufTtcblxuLyoqXG4gKiBDdXN0b20gcmVtb3ZlIGJ1dHRvbiBmb3IgbXVsdGktdmFsdWUgaXRlbXMuXG4gKiBQcm92aWRlcyBhY2Nlc3NpYmxlIHJlbW92YWwgZnVuY3Rpb25hbGl0eSB3aXRoIHByb3BlciBBUklBIGxhYmVscy5cbiAqL1xuZXhwb3J0IGNvbnN0IE11bHRpVmFsdWVSZW1vdmVCdXR0b24gPSAoXG4gIHByb3BzOiBNdWx0aVZhbHVlUmVtb3ZlUHJvcHM8RXh0ZW5kZWRPcHRpb24sIHRydWUsIEdyb3VwQmFzZTxFeHRlbmRlZE9wdGlvbj4+XG4pID0+IHtcbiAgY29uc3QgeyBsYWJlbCB9ID0gcHJvcHM/LmRhdGEgPz8geyBsYWJlbDogJycgfTtcblxuICBwcm9wcy5pbm5lclByb3BzWydhcmlhLWxhYmVsJ10gPSBgUmVtb3ZlICR7bGFiZWx9YDtcblxuICByZXR1cm4gKFxuICAgIDxNdWx0aVZhbHVlUmVtb3ZlIHsuLi5wcm9wc30+XG4gICAgICA8TWluaURlbGV0ZUljb24gc2l6ZT17MTJ9IC8+XG4gICAgPC9NdWx0aVZhbHVlUmVtb3ZlPlxuICApO1xufTtcblxuLyoqXG4gKiBDdXN0b20gcmVtb3ZlIGFsbCBidXR0b24gZm9yIG11bHRpLXNlbGVjdCBtb2RlLlxuICogUHJvdmlkZXMga2V5Ym9hcmQgbmF2aWdhdGlvbiBhbmQgYWNjZXNzaWJsZSByZW1vdmFsIG9mIGFsbCBzZWxlY3RlZCB2YWx1ZXMuXG4gKi9cblxuY29uc3QgQ3VzdG9tU3R5bGVkUmVtb3ZlQWxsRGl2ID0gc3R5bGVkKCdkaXYnKShcbiAgY3NzKHtcbiAgICAnJjpmb2N1cyc6IHtcbiAgICAgIG91dGxpbmU6IGAycHggc29saWQgJHt0aGVtZS5jb2xvcnMucHJpbWFyeX1gLFxuICAgIH0sXG4gICAgJyY6Zm9jdXMtdmlzaWJsZSc6IHtcbiAgICAgIG91dGxpbmU6IGAycHggc29saWQgJHt0aGVtZS5jb2xvcnMucHJpbWFyeX1gLFxuICAgIH0sXG4gIH0pXG4pO1xuXG5leHBvcnQgY29uc3QgUmVtb3ZlQWxsQnV0dG9uID0gKHByb3BzOiBTaXplZEluZGljYXRvclByb3BzKSA9PiB7XG4gIGNvbnN0IHtcbiAgICBnZXRTdHlsZXMsXG4gICAgaW5uZXJQcm9wczogeyAuLi5yZXN0SW5uZXJQcm9wcyB9LFxuICAgIHNlbGVjdFByb3BzOiB7IHNpemUgfSxcbiAgfSA9IHByb3BzO1xuXG4gIGNvbnN0IHsgcmVtb3ZlQWxsQnV0dG9uUmVmLCBzZWxlY3RJbnB1dFJlZiB9ID0gdXNlQ29udGV4dChcbiAgICBTZWxlY3REcm9wZG93bkNvbnRleHRcbiAgKTtcblxuICBjb25zdCBpY29uU2l6ZSA9IHNpemUgPz8gJ21lZGl1bSc7XG4gIGNvbnN0IHsgLi4uaWNvblByb3BzIH0gPSBpbmRpY2F0b3JJY29uc1tgJHtpY29uU2l6ZX1SZW1vdmVgXTtcbiAgY29uc3QgeyBpY29uOiBJbmRpY2F0b3JJY29uIH0gPSBpY29uUHJvcHM7XG5cbiAgY29uc3Qgb25LZXlQcmVzcyA9IChlOiBLZXlib2FyZEV2ZW50PEhUTUxEaXZFbGVtZW50PikgPT4ge1xuICAgIGlmIChlLmtleSA9PT0gJ0VudGVyJyAmJiByZXN0SW5uZXJQcm9wcy5vbk1vdXNlRG93bikge1xuICAgICAgcmVzdElubmVyUHJvcHMub25Nb3VzZURvd24oZSBhcyBhbnkpO1xuICAgIH1cblxuICAgIGlmIChcbiAgICAgIHNlbGVjdElucHV0UmVmPy5jdXJyZW50ICYmXG4gICAgICAoZS5rZXkgPT09ICdBcnJvd1JpZ2h0JyB8fCBlLmtleSA9PT0gJ0Fycm93TGVmdCcgfHwgZS5rZXkgPT09ICdBcnJvd0Rvd24nKVxuICAgICkge1xuICAgICAgc2VsZWN0SW5wdXRSZWY/LmN1cnJlbnQuZm9jdXMoKTtcbiAgICB9XG4gIH07XG5cbiAgY29uc3Qgc3R5bGUgPSBnZXRTdHlsZXMoJ2NsZWFySW5kaWNhdG9yJywgcHJvcHMpIGFzIFJlYWN0LkNTU1Byb3BlcnRpZXM7XG5cbiAgcmV0dXJuIChcbiAgICA8Q3VzdG9tU3R5bGVkUmVtb3ZlQWxsRGl2XG4gICAgICBhcmlhLWxhYmVsPVwiUmVtb3ZlIGFsbCBzZWxlY3RlZFwiXG4gICAgICByb2xlPVwiYnV0dG9uXCJcbiAgICAgIHRhYkluZGV4PXswfVxuICAgICAgey4uLnJlc3RJbm5lclByb3BzfVxuICAgICAgcmVmPXtyZW1vdmVBbGxCdXR0b25SZWZ9XG4gICAgICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgZ2FtdXQvbm8taW5saW5lLXN0eWxlXG4gICAgICBzdHlsZT17c3R5bGV9XG4gICAgICBvbktleURvd249e29uS2V5UHJlc3N9XG4gICAgPlxuICAgICAgPEluZGljYXRvckljb24gey4uLmljb25Qcm9wc30gY29sb3I9XCJ0ZXh0XCIgLz5cbiAgICA8L0N1c3RvbVN0eWxlZFJlbW92ZUFsbERpdj5cbiAgKTtcbn07XG4iXX0= */");
|
|
78
|
+
}, ";label:CustomStyledRemoveAllDiv;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9Gb3JtL1NlbGVjdERyb3Bkb3duL2VsZW1lbnRzL211bHRpLXZhbHVlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE2RUUiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL0Zvcm0vU2VsZWN0RHJvcGRvd24vZWxlbWVudHMvbXVsdGktdmFsdWUudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgTWluaURlbGV0ZUljb24gfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1pY29ucyc7XG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LXN0eWxlcyc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBLZXlib2FyZEV2ZW50LCB1c2VDb250ZXh0IH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0IHtcbiAgY29tcG9uZW50cyBhcyBTZWxlY3REcm9wZG93bkVsZW1lbnRzLFxuICBHcm91cEJhc2UsXG4gIE11bHRpVmFsdWVQcm9wcyxcbiAgTXVsdGlWYWx1ZVJlbW92ZVByb3BzLFxufSBmcm9tICdyZWFjdC1zZWxlY3QnO1xuXG5pbXBvcnQgeyBFeHRlbmRlZE9wdGlvbiwgU2l6ZWRJbmRpY2F0b3JQcm9wcyB9IGZyb20gJy4uL3R5cGVzJztcbmltcG9ydCB7IGluZGljYXRvckljb25zIH0gZnJvbSAnLi9jb25zdGFudHMnO1xuaW1wb3J0IHsgU2VsZWN0RHJvcGRvd25Db250ZXh0IH0gZnJvbSAnLi9jb250YWluZXJzJztcblxuY29uc3QgeyBNdWx0aVZhbHVlLCBNdWx0aVZhbHVlUmVtb3ZlIH0gPSBTZWxlY3REcm9wZG93bkVsZW1lbnRzO1xuXG4vKipcbiAqIEN1c3RvbSBtdWx0aS12YWx1ZSBjb21wb25lbnQgdGhhdCBtYW5hZ2VzIGZvY3VzIHN0YXRlIGZvciBrZXlib2FyZCBuYXZpZ2F0aW9uLlxuICogVHJhY2tzIHdoaWNoIG11bHRpLXZhbHVlIGlzIGN1cnJlbnRseSBmb2N1c2VkIGFuZCB1cGRhdGVzIHRoZSBjb250ZXh0IGFjY29yZGluZ2x5LlxuICovXG5leHBvcnQgY29uc3QgTXVsdGlWYWx1ZVdpdGhDb2xvck1vZGUgPSAoXG4gIHByb3BzOiBNdWx0aVZhbHVlUHJvcHM8RXh0ZW5kZWRPcHRpb24sIHRydWUsIEdyb3VwQmFzZTxFeHRlbmRlZE9wdGlvbj4+XG4pID0+IHtcbiAgY29uc3QgeyBjdXJyZW50Rm9jdXNlZFZhbHVlLCBzZXRDdXJyZW50Rm9jdXNlZFZhbHVlIH0gPSB1c2VDb250ZXh0KFxuICAgIFNlbGVjdERyb3Bkb3duQ29udGV4dFxuICApO1xuXG4gIGNvbnN0IHsgZGF0YSB9ID0gcHJvcHM7XG5cbiAgY29uc3QgeyB2YWx1ZSwgbGFiZWwgfSA9IGRhdGE7XG5cbiAgaWYgKFxuICAgIHByb3BzLmlzRm9jdXNlZCAmJlxuICAgIHNldEN1cnJlbnRGb2N1c2VkVmFsdWUgJiZcbiAgICBjdXJyZW50Rm9jdXNlZFZhbHVlICE9PSB2YWx1ZVxuICApIHtcbiAgICBzZXRDdXJyZW50Rm9jdXNlZFZhbHVlKHZhbHVlKTtcbiAgfVxuXG4gIGlmIChcbiAgICAhcHJvcHMuaXNGb2N1c2VkICYmXG4gICAgc2V0Q3VycmVudEZvY3VzZWRWYWx1ZSAmJlxuICAgIGN1cnJlbnRGb2N1c2VkVmFsdWUgPT09IHZhbHVlXG4gICkge1xuICAgIHNldEN1cnJlbnRGb2N1c2VkVmFsdWUodW5kZWZpbmVkKTtcbiAgfVxuICBjb25zdCBkaXNwbGF5VGV4dCA9IGRhdGE/LmFiYnJldmlhdGlvbiA/IGRhdGEuYWJicmV2aWF0aW9uIDogbGFiZWwgfHwgJyc7XG5cbiAgcmV0dXJuIDxNdWx0aVZhbHVlIHsuLi5wcm9wc30+e2Rpc3BsYXlUZXh0fTwvTXVsdGlWYWx1ZT47XG59O1xuXG4vKipcbiAqIEN1c3RvbSByZW1vdmUgYnV0dG9uIGZvciBtdWx0aS12YWx1ZSBpdGVtcy5cbiAqIFByb3ZpZGVzIGFjY2Vzc2libGUgcmVtb3ZhbCBmdW5jdGlvbmFsaXR5IHdpdGggcHJvcGVyIEFSSUEgbGFiZWxzLlxuICovXG5leHBvcnQgY29uc3QgTXVsdGlWYWx1ZVJlbW92ZUJ1dHRvbiA9IChcbiAgcHJvcHM6IE11bHRpVmFsdWVSZW1vdmVQcm9wczxFeHRlbmRlZE9wdGlvbiwgdHJ1ZSwgR3JvdXBCYXNlPEV4dGVuZGVkT3B0aW9uPj5cbikgPT4ge1xuICBjb25zdCB7IGxhYmVsIH0gPSBwcm9wcz8uZGF0YSA/PyB7IGxhYmVsOiAnJyB9O1xuXG4gIHByb3BzLmlubmVyUHJvcHNbJ2FyaWEtbGFiZWwnXSA9IGBSZW1vdmUgJHtsYWJlbH1gO1xuXG4gIHJldHVybiAoXG4gICAgPE11bHRpVmFsdWVSZW1vdmUgey4uLnByb3BzfT5cbiAgICAgIDxNaW5pRGVsZXRlSWNvbiBzaXplPXsxMn0gLz5cbiAgICA8L011bHRpVmFsdWVSZW1vdmU+XG4gICk7XG59O1xuXG4vKipcbiAqIEN1c3RvbSByZW1vdmUgYWxsIGJ1dHRvbiBmb3IgbXVsdGktc2VsZWN0IG1vZGUuXG4gKiBQcm92aWRlcyBrZXlib2FyZCBuYXZpZ2F0aW9uIGFuZCBhY2Nlc3NpYmxlIHJlbW92YWwgb2YgYWxsIHNlbGVjdGVkIHZhbHVlcy5cbiAqL1xuXG5jb25zdCBDdXN0b21TdHlsZWRSZW1vdmVBbGxEaXYgPSBzdHlsZWQoJ2RpdicpKFxuICBjc3Moe1xuICAgICcmOmZvY3VzJzoge1xuICAgICAgb3V0bGluZTogYDJweCBzb2xpZCAke3RoZW1lLmNvbG9ycy5wcmltYXJ5fWAsXG4gICAgfSxcbiAgICAnJjpmb2N1cy12aXNpYmxlJzoge1xuICAgICAgb3V0bGluZTogYDJweCBzb2xpZCAke3RoZW1lLmNvbG9ycy5wcmltYXJ5fWAsXG4gICAgfSxcbiAgfSlcbik7XG5cbmV4cG9ydCBjb25zdCBSZW1vdmVBbGxCdXR0b24gPSAocHJvcHM6IFNpemVkSW5kaWNhdG9yUHJvcHMpID0+IHtcbiAgY29uc3Qge1xuICAgIGdldFN0eWxlcyxcbiAgICBpbm5lclByb3BzOiB7IC4uLnJlc3RJbm5lclByb3BzIH0sXG4gICAgc2VsZWN0UHJvcHM6IHsgc2l6ZSB9LFxuICB9ID0gcHJvcHM7XG5cbiAgY29uc3QgeyByZW1vdmVBbGxCdXR0b25SZWYsIHNlbGVjdElucHV0UmVmIH0gPSB1c2VDb250ZXh0KFxuICAgIFNlbGVjdERyb3Bkb3duQ29udGV4dFxuICApO1xuXG4gIGNvbnN0IGljb25TaXplID0gc2l6ZSA/PyAnbWVkaXVtJztcbiAgY29uc3QgeyAuLi5pY29uUHJvcHMgfSA9IGluZGljYXRvckljb25zW2Ake2ljb25TaXplfVJlbW92ZWBdO1xuICBjb25zdCB7IGljb246IEluZGljYXRvckljb24gfSA9IGljb25Qcm9wcztcblxuICBjb25zdCBvbktleVByZXNzID0gKGU6IEtleWJvYXJkRXZlbnQ8SFRNTERpdkVsZW1lbnQ+KSA9PiB7XG4gICAgaWYgKGUua2V5ID09PSAnRW50ZXInICYmIHJlc3RJbm5lclByb3BzLm9uTW91c2VEb3duKSB7XG4gICAgICByZXN0SW5uZXJQcm9wcy5vbk1vdXNlRG93bihlIGFzIGFueSk7XG4gICAgfVxuXG4gICAgaWYgKFxuICAgICAgc2VsZWN0SW5wdXRSZWY/LmN1cnJlbnQgJiZcbiAgICAgIChlLmtleSA9PT0gJ0Fycm93UmlnaHQnIHx8IGUua2V5ID09PSAnQXJyb3dMZWZ0JyB8fCBlLmtleSA9PT0gJ0Fycm93RG93bicpXG4gICAgKSB7XG4gICAgICBzZWxlY3RJbnB1dFJlZi5jdXJyZW50LmZvY3VzKCk7XG4gICAgfVxuICB9O1xuXG4gIGNvbnN0IHN0eWxlID0gZ2V0U3R5bGVzKCdjbGVhckluZGljYXRvcicsIHByb3BzKSBhcyBSZWFjdC5DU1NQcm9wZXJ0aWVzO1xuXG4gIHJldHVybiAoXG4gICAgPEN1c3RvbVN0eWxlZFJlbW92ZUFsbERpdlxuICAgICAgYXJpYS1sYWJlbD1cIlJlbW92ZSBhbGwgc2VsZWN0ZWRcIlxuICAgICAgcm9sZT1cImJ1dHRvblwiXG4gICAgICB0YWJJbmRleD17MH1cbiAgICAgIHsuLi5yZXN0SW5uZXJQcm9wc31cbiAgICAgIHJlZj17cmVtb3ZlQWxsQnV0dG9uUmVmIGFzIFJlYWN0LlJlZjxIVE1MRGl2RWxlbWVudD59XG4gICAgICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgZ2FtdXQvbm8taW5saW5lLXN0eWxlXG4gICAgICBzdHlsZT17c3R5bGV9XG4gICAgICBvbktleURvd249e29uS2V5UHJlc3N9XG4gICAgPlxuICAgICAgPEluZGljYXRvckljb24gey4uLmljb25Qcm9wc30gY29sb3I9XCJ0ZXh0XCIgLz5cbiAgICA8L0N1c3RvbVN0eWxlZFJlbW92ZUFsbERpdj5cbiAgKTtcbn07XG4iXX0= */")), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9Gb3JtL1NlbGVjdERyb3Bkb3duL2VsZW1lbnRzL211bHRpLXZhbHVlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE0RWlDIiwiZmlsZSI6Ii4uLy4uLy4uLy4uL3NyYy9Gb3JtL1NlbGVjdERyb3Bkb3duL2VsZW1lbnRzL211bHRpLXZhbHVlLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IE1pbmlEZWxldGVJY29uIH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQtaWNvbnMnO1xuaW1wb3J0IHsgdGhlbWUgfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1zdHlsZXMnO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgS2V5Ym9hcmRFdmVudCwgdXNlQ29udGV4dCB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7XG4gIGNvbXBvbmVudHMgYXMgU2VsZWN0RHJvcGRvd25FbGVtZW50cyxcbiAgR3JvdXBCYXNlLFxuICBNdWx0aVZhbHVlUHJvcHMsXG4gIE11bHRpVmFsdWVSZW1vdmVQcm9wcyxcbn0gZnJvbSAncmVhY3Qtc2VsZWN0JztcblxuaW1wb3J0IHsgRXh0ZW5kZWRPcHRpb24sIFNpemVkSW5kaWNhdG9yUHJvcHMgfSBmcm9tICcuLi90eXBlcyc7XG5pbXBvcnQgeyBpbmRpY2F0b3JJY29ucyB9IGZyb20gJy4vY29uc3RhbnRzJztcbmltcG9ydCB7IFNlbGVjdERyb3Bkb3duQ29udGV4dCB9IGZyb20gJy4vY29udGFpbmVycyc7XG5cbmNvbnN0IHsgTXVsdGlWYWx1ZSwgTXVsdGlWYWx1ZVJlbW92ZSB9ID0gU2VsZWN0RHJvcGRvd25FbGVtZW50cztcblxuLyoqXG4gKiBDdXN0b20gbXVsdGktdmFsdWUgY29tcG9uZW50IHRoYXQgbWFuYWdlcyBmb2N1cyBzdGF0ZSBmb3Iga2V5Ym9hcmQgbmF2aWdhdGlvbi5cbiAqIFRyYWNrcyB3aGljaCBtdWx0aS12YWx1ZSBpcyBjdXJyZW50bHkgZm9jdXNlZCBhbmQgdXBkYXRlcyB0aGUgY29udGV4dCBhY2NvcmRpbmdseS5cbiAqL1xuZXhwb3J0IGNvbnN0IE11bHRpVmFsdWVXaXRoQ29sb3JNb2RlID0gKFxuICBwcm9wczogTXVsdGlWYWx1ZVByb3BzPEV4dGVuZGVkT3B0aW9uLCB0cnVlLCBHcm91cEJhc2U8RXh0ZW5kZWRPcHRpb24+PlxuKSA9PiB7XG4gIGNvbnN0IHsgY3VycmVudEZvY3VzZWRWYWx1ZSwgc2V0Q3VycmVudEZvY3VzZWRWYWx1ZSB9ID0gdXNlQ29udGV4dChcbiAgICBTZWxlY3REcm9wZG93bkNvbnRleHRcbiAgKTtcblxuICBjb25zdCB7IGRhdGEgfSA9IHByb3BzO1xuXG4gIGNvbnN0IHsgdmFsdWUsIGxhYmVsIH0gPSBkYXRhO1xuXG4gIGlmIChcbiAgICBwcm9wcy5pc0ZvY3VzZWQgJiZcbiAgICBzZXRDdXJyZW50Rm9jdXNlZFZhbHVlICYmXG4gICAgY3VycmVudEZvY3VzZWRWYWx1ZSAhPT0gdmFsdWVcbiAgKSB7XG4gICAgc2V0Q3VycmVudEZvY3VzZWRWYWx1ZSh2YWx1ZSk7XG4gIH1cblxuICBpZiAoXG4gICAgIXByb3BzLmlzRm9jdXNlZCAmJlxuICAgIHNldEN1cnJlbnRGb2N1c2VkVmFsdWUgJiZcbiAgICBjdXJyZW50Rm9jdXNlZFZhbHVlID09PSB2YWx1ZVxuICApIHtcbiAgICBzZXRDdXJyZW50Rm9jdXNlZFZhbHVlKHVuZGVmaW5lZCk7XG4gIH1cbiAgY29uc3QgZGlzcGxheVRleHQgPSBkYXRhPy5hYmJyZXZpYXRpb24gPyBkYXRhLmFiYnJldmlhdGlvbiA6IGxhYmVsIHx8ICcnO1xuXG4gIHJldHVybiA8TXVsdGlWYWx1ZSB7Li4ucHJvcHN9PntkaXNwbGF5VGV4dH08L011bHRpVmFsdWU+O1xufTtcblxuLyoqXG4gKiBDdXN0b20gcmVtb3ZlIGJ1dHRvbiBmb3IgbXVsdGktdmFsdWUgaXRlbXMuXG4gKiBQcm92aWRlcyBhY2Nlc3NpYmxlIHJlbW92YWwgZnVuY3Rpb25hbGl0eSB3aXRoIHByb3BlciBBUklBIGxhYmVscy5cbiAqL1xuZXhwb3J0IGNvbnN0IE11bHRpVmFsdWVSZW1vdmVCdXR0b24gPSAoXG4gIHByb3BzOiBNdWx0aVZhbHVlUmVtb3ZlUHJvcHM8RXh0ZW5kZWRPcHRpb24sIHRydWUsIEdyb3VwQmFzZTxFeHRlbmRlZE9wdGlvbj4+XG4pID0+IHtcbiAgY29uc3QgeyBsYWJlbCB9ID0gcHJvcHM/LmRhdGEgPz8geyBsYWJlbDogJycgfTtcblxuICBwcm9wcy5pbm5lclByb3BzWydhcmlhLWxhYmVsJ10gPSBgUmVtb3ZlICR7bGFiZWx9YDtcblxuICByZXR1cm4gKFxuICAgIDxNdWx0aVZhbHVlUmVtb3ZlIHsuLi5wcm9wc30+XG4gICAgICA8TWluaURlbGV0ZUljb24gc2l6ZT17MTJ9IC8+XG4gICAgPC9NdWx0aVZhbHVlUmVtb3ZlPlxuICApO1xufTtcblxuLyoqXG4gKiBDdXN0b20gcmVtb3ZlIGFsbCBidXR0b24gZm9yIG11bHRpLXNlbGVjdCBtb2RlLlxuICogUHJvdmlkZXMga2V5Ym9hcmQgbmF2aWdhdGlvbiBhbmQgYWNjZXNzaWJsZSByZW1vdmFsIG9mIGFsbCBzZWxlY3RlZCB2YWx1ZXMuXG4gKi9cblxuY29uc3QgQ3VzdG9tU3R5bGVkUmVtb3ZlQWxsRGl2ID0gc3R5bGVkKCdkaXYnKShcbiAgY3NzKHtcbiAgICAnJjpmb2N1cyc6IHtcbiAgICAgIG91dGxpbmU6IGAycHggc29saWQgJHt0aGVtZS5jb2xvcnMucHJpbWFyeX1gLFxuICAgIH0sXG4gICAgJyY6Zm9jdXMtdmlzaWJsZSc6IHtcbiAgICAgIG91dGxpbmU6IGAycHggc29saWQgJHt0aGVtZS5jb2xvcnMucHJpbWFyeX1gLFxuICAgIH0sXG4gIH0pXG4pO1xuXG5leHBvcnQgY29uc3QgUmVtb3ZlQWxsQnV0dG9uID0gKHByb3BzOiBTaXplZEluZGljYXRvclByb3BzKSA9PiB7XG4gIGNvbnN0IHtcbiAgICBnZXRTdHlsZXMsXG4gICAgaW5uZXJQcm9wczogeyAuLi5yZXN0SW5uZXJQcm9wcyB9LFxuICAgIHNlbGVjdFByb3BzOiB7IHNpemUgfSxcbiAgfSA9IHByb3BzO1xuXG4gIGNvbnN0IHsgcmVtb3ZlQWxsQnV0dG9uUmVmLCBzZWxlY3RJbnB1dFJlZiB9ID0gdXNlQ29udGV4dChcbiAgICBTZWxlY3REcm9wZG93bkNvbnRleHRcbiAgKTtcblxuICBjb25zdCBpY29uU2l6ZSA9IHNpemUgPz8gJ21lZGl1bSc7XG4gIGNvbnN0IHsgLi4uaWNvblByb3BzIH0gPSBpbmRpY2F0b3JJY29uc1tgJHtpY29uU2l6ZX1SZW1vdmVgXTtcbiAgY29uc3QgeyBpY29uOiBJbmRpY2F0b3JJY29uIH0gPSBpY29uUHJvcHM7XG5cbiAgY29uc3Qgb25LZXlQcmVzcyA9IChlOiBLZXlib2FyZEV2ZW50PEhUTUxEaXZFbGVtZW50PikgPT4ge1xuICAgIGlmIChlLmtleSA9PT0gJ0VudGVyJyAmJiByZXN0SW5uZXJQcm9wcy5vbk1vdXNlRG93bikge1xuICAgICAgcmVzdElubmVyUHJvcHMub25Nb3VzZURvd24oZSBhcyBhbnkpO1xuICAgIH1cblxuICAgIGlmIChcbiAgICAgIHNlbGVjdElucHV0UmVmPy5jdXJyZW50ICYmXG4gICAgICAoZS5rZXkgPT09ICdBcnJvd1JpZ2h0JyB8fCBlLmtleSA9PT0gJ0Fycm93TGVmdCcgfHwgZS5rZXkgPT09ICdBcnJvd0Rvd24nKVxuICAgICkge1xuICAgICAgc2VsZWN0SW5wdXRSZWYuY3VycmVudC5mb2N1cygpO1xuICAgIH1cbiAgfTtcblxuICBjb25zdCBzdHlsZSA9IGdldFN0eWxlcygnY2xlYXJJbmRpY2F0b3InLCBwcm9wcykgYXMgUmVhY3QuQ1NTUHJvcGVydGllcztcblxuICByZXR1cm4gKFxuICAgIDxDdXN0b21TdHlsZWRSZW1vdmVBbGxEaXZcbiAgICAgIGFyaWEtbGFiZWw9XCJSZW1vdmUgYWxsIHNlbGVjdGVkXCJcbiAgICAgIHJvbGU9XCJidXR0b25cIlxuICAgICAgdGFiSW5kZXg9ezB9XG4gICAgICB7Li4ucmVzdElubmVyUHJvcHN9XG4gICAgICByZWY9e3JlbW92ZUFsbEJ1dHRvblJlZiBhcyBSZWFjdC5SZWY8SFRNTERpdkVsZW1lbnQ+fVxuICAgICAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIGdhbXV0L25vLWlubGluZS1zdHlsZVxuICAgICAgc3R5bGU9e3N0eWxlfVxuICAgICAgb25LZXlEb3duPXtvbktleVByZXNzfVxuICAgID5cbiAgICAgIDxJbmRpY2F0b3JJY29uIHsuLi5pY29uUHJvcHN9IGNvbG9yPVwidGV4dFwiIC8+XG4gICAgPC9DdXN0b21TdHlsZWRSZW1vdmVBbGxEaXY+XG4gICk7XG59O1xuIl19 */");
|
|
79
79
|
export const RemoveAllButton = props => {
|
|
80
80
|
const {
|
|
81
81
|
getStyles,
|
|
@@ -102,7 +102,7 @@ export const RemoveAllButton = props => {
|
|
|
102
102
|
restInnerProps.onMouseDown(e);
|
|
103
103
|
}
|
|
104
104
|
if (selectInputRef?.current && (e.key === 'ArrowRight' || e.key === 'ArrowLeft' || e.key === 'ArrowDown')) {
|
|
105
|
-
selectInputRef
|
|
105
|
+
selectInputRef.current.focus();
|
|
106
106
|
}
|
|
107
107
|
};
|
|
108
108
|
const style = getStyles('clearIndicator', props);
|
|
@@ -3,7 +3,6 @@ import { CustomSelectComponentProps, ExtendedOption, SelectDropdownGroup } from
|
|
|
3
3
|
/**
|
|
4
4
|
* Custom option component that displays a check icon for selected items.
|
|
5
5
|
* Also manages ARIA attributes for accessibility.
|
|
6
|
-
* Skips the check icon for react-select/creatable's "Add" row (__isNew__).
|
|
7
6
|
*/
|
|
8
7
|
export declare const IconOption: ({ children, ...rest }: CustomSelectComponentProps<typeof SelectDropdownElements.Option>) => import("react/jsx-runtime").JSX.Element;
|
|
9
8
|
/**
|
|
@@ -44,7 +44,6 @@ const IconOptionLabel = ({
|
|
|
44
44
|
/**
|
|
45
45
|
* Custom option component that displays a check icon for selected items.
|
|
46
46
|
* Also manages ARIA attributes for accessibility.
|
|
47
|
-
* Skips the check icon for react-select/creatable's "Add" row (__isNew__).
|
|
48
47
|
*/
|
|
49
48
|
export const IconOption = ({
|
|
50
49
|
children,
|
|
@@ -55,17 +54,15 @@ export const IconOption = ({
|
|
|
55
54
|
} = rest.selectProps;
|
|
56
55
|
const {
|
|
57
56
|
isFocused,
|
|
58
|
-
innerProps
|
|
59
|
-
data
|
|
57
|
+
innerProps
|
|
60
58
|
} = rest;
|
|
61
|
-
const isNew = data?.__isNew__;
|
|
62
59
|
return /*#__PURE__*/_jsxs(SelectDropdownElements.Option, {
|
|
63
60
|
...rest,
|
|
64
61
|
innerProps: {
|
|
65
62
|
...innerProps,
|
|
66
63
|
'aria-selected': isFocused
|
|
67
64
|
},
|
|
68
|
-
children: [children,
|
|
65
|
+
children: [children, rest?.isSelected && /*#__PURE__*/_jsx(CheckIcon, {
|
|
69
66
|
size: selectedIconSize[size ?? 'medium']
|
|
70
67
|
})]
|
|
71
68
|
});
|
|
@@ -62,7 +62,7 @@ const textColor = css({
|
|
|
62
62
|
color: 'text'
|
|
63
63
|
});
|
|
64
64
|
const placeholderColor = css({
|
|
65
|
-
color: 'text-
|
|
65
|
+
color: 'text-disabled'
|
|
66
66
|
});
|
|
67
67
|
export const getMemoizedStyles = (theme, zIndex) => {
|
|
68
68
|
return {
|
|
@@ -137,8 +137,6 @@ export const getMemoizedStyles = (theme, zIndex) => {
|
|
|
137
137
|
error: state.selectProps.error,
|
|
138
138
|
theme
|
|
139
139
|
}),
|
|
140
|
-
// Drop react-select's default menu drop shadow; the border above defines the edge.
|
|
141
|
-
boxShadow: 'none',
|
|
142
140
|
...(dropdownWidth ? {
|
|
143
141
|
minWidth: dropdownWidth,
|
|
144
142
|
width: dropdownWidth
|
|
@@ -196,32 +194,16 @@ export const getMemoizedStyles = (theme, zIndex) => {
|
|
|
196
194
|
backgroundColor: theme.colors['secondary-hover']
|
|
197
195
|
}
|
|
198
196
|
}),
|
|
199
|
-
|
|
200
|
-
...
|
|
201
|
-
|
|
197
|
+
option: (provided, state) => ({
|
|
198
|
+
...getOptionBackground(state.isSelected, state.isFocused)({
|
|
199
|
+
theme
|
|
200
|
+
}),
|
|
201
|
+
alignItems: 'center',
|
|
202
|
+
color: state.isDisabled ? 'text-disabled' : 'default',
|
|
203
|
+
cursor: state.isDisabled ? 'not-allowed' : 'pointer',
|
|
204
|
+
display: 'flex',
|
|
205
|
+
padding: state.selectProps.size === 'small' ? '3px 14px' : '11px 14px'
|
|
202
206
|
}),
|
|
203
|
-
option: (provided, state) => {
|
|
204
|
-
const isNew = state.data?.__isNew__;
|
|
205
|
-
const isSmall = state.selectProps.size === 'small';
|
|
206
|
-
return {
|
|
207
|
-
...getOptionBackground(state.isSelected, state.isFocused)({
|
|
208
|
-
theme
|
|
209
|
-
}),
|
|
210
|
-
alignItems: 'center',
|
|
211
|
-
color: state.isDisabled ? theme.colors['text-disabled'] : isNew ? theme.colors.primary : theme.colors.text,
|
|
212
|
-
cursor: state.isDisabled ? 'not-allowed' : 'pointer',
|
|
213
|
-
display: 'flex',
|
|
214
|
-
padding: isSmall ? '3px 14px' : '11px 14px',
|
|
215
|
-
...(isNew && {
|
|
216
|
-
// Gradient creates the 1px divider line at the top edge of the option background
|
|
217
|
-
backgroundImage: `linear-gradient(${theme.colors['text-disabled']} 1px, transparent 1px)`,
|
|
218
|
-
backgroundPosition: '0 0',
|
|
219
|
-
backgroundRepeat: 'no-repeat',
|
|
220
|
-
backgroundSize: '100% 1px',
|
|
221
|
-
paddingTop: isSmall ? '11px' : '19px'
|
|
222
|
-
})
|
|
223
|
-
};
|
|
224
|
-
},
|
|
225
207
|
placeholder: provided => ({
|
|
226
208
|
...provided,
|
|
227
209
|
...placeholderColor({
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { Ref, SelectHTMLAttributes } from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import { Props as NamedProps } from 'react-select';
|
|
3
3
|
import { SelectComponentProps } from '../../inputs/Select';
|
|
4
4
|
import { OptionStrict, SelectDropdownGroup, SelectDropdownOptions } from './options';
|
|
5
5
|
import { ReactSelectAdditionalProps, SelectDropdownSizes, SharedProps } from './styles';
|
|
@@ -28,7 +28,7 @@ export type SelectDropdownBaseProps = Omit<SelectComponentProps, 'onChange' | 'd
|
|
|
28
28
|
* Core props interface that defines the essential properties for SelectDropdown.
|
|
29
29
|
* This interface combines base props with react-select props and HTML select attributes.
|
|
30
30
|
*/
|
|
31
|
-
export interface SelectDropdownCoreProps extends SelectDropdownBaseProps, Omit<NamedProps<OptionStrict, boolean>, 'formatOptionLabel' | 'isDisabled' | 'value' | 'options' | 'components' | 'styles' | 'theme' | 'onChange' | 'multiple'
|
|
31
|
+
export interface SelectDropdownCoreProps extends SelectDropdownBaseProps, Omit<NamedProps<OptionStrict, boolean>, 'formatOptionLabel' | 'isDisabled' | 'value' | 'options' | 'components' | 'styles' | 'theme' | 'onChange' | 'multiple'>, Pick<SelectHTMLAttributes<HTMLSelectElement>, 'value' | 'disabled' | 'onClick'>, SharedProps {
|
|
32
32
|
/** Required name attribute for the select input */
|
|
33
33
|
name: string;
|
|
34
34
|
/** Placeholder text shown when no option is selected.
|
|
@@ -38,39 +38,6 @@ export interface SelectDropdownCoreProps extends SelectDropdownBaseProps, Omit<N
|
|
|
38
38
|
placeholder?: string;
|
|
39
39
|
/** Array of options or option groups to display in the dropdown */
|
|
40
40
|
options?: SelectDropdownOptions | SelectDropdownGroup[];
|
|
41
|
-
/**
|
|
42
|
-
* Allows users to create new options by typing a value not in the options list.
|
|
43
|
-
* When true, isSearchable is automatically set to true.
|
|
44
|
-
* Pair with onCreateOption to persist new options.
|
|
45
|
-
*/
|
|
46
|
-
isCreatable?: boolean;
|
|
47
|
-
/**
|
|
48
|
-
* Called when the user confirms a new option via the "Add" row.
|
|
49
|
-
* Convenience callback for persisting the new value to your `options` list.
|
|
50
|
-
* Selection updates are delivered through `onChange` with `action: 'create-option'`.
|
|
51
|
-
*/
|
|
52
|
-
onCreateOption?: (inputValue: string) => void;
|
|
53
|
-
/**
|
|
54
|
-
* Customises the label shown in the "Add" row.
|
|
55
|
-
* Defaults to: (inputValue) => `Add "${inputValue}"`.
|
|
56
|
-
*/
|
|
57
|
-
formatCreateLabel?: (inputValue: string) => React.ReactNode;
|
|
58
|
-
/**
|
|
59
|
-
* Controls when the "Add" row is visible.
|
|
60
|
-
* Receives the current input, selected values, and all options.
|
|
61
|
-
* Defaults to react-select's built-in logic (hidden when input matches an existing option label).
|
|
62
|
-
* Use cases: minimum-length gating, pattern validation, case-insensitive dedup, max-items cap.
|
|
63
|
-
*/
|
|
64
|
-
isValidNewOption?: (inputValue: string, value: OptionsType<OptionStrict>, options: OptionsType<OptionStrict>) => boolean;
|
|
65
|
-
/**
|
|
66
|
-
* Customizes the message shown inside the dropdown menu when no option matches
|
|
67
|
-
* the current input (react-select's "No options" state). Useful for surfacing
|
|
68
|
-
* validation/error text directly in the dropdown. Accepts a node, or a function
|
|
69
|
-
* receiving the current input value.
|
|
70
|
-
*/
|
|
71
|
-
validationMessage?: React.ReactNode | ((obj: {
|
|
72
|
-
inputValue: string;
|
|
73
|
-
}) => React.ReactNode);
|
|
74
41
|
}
|
|
75
42
|
/**
|
|
76
43
|
* Props for single-select mode.
|
|
@@ -92,23 +59,11 @@ export interface MultiSelectDropdownProps extends SelectDropdownCoreProps {
|
|
|
92
59
|
/** Callback fired when the selected values change */
|
|
93
60
|
onChange?: NamedProps<OptionStrict, true>['onChange'];
|
|
94
61
|
}
|
|
95
|
-
/**
|
|
96
|
-
* Enforces that isSearchable cannot be false when isCreatable is true.
|
|
97
|
-
* Creatable mode requires the search input so users can type new option values.
|
|
98
|
-
*/
|
|
99
|
-
type CreatableConstraint = {
|
|
100
|
-
isCreatable?: false | undefined;
|
|
101
|
-
isSearchable?: boolean;
|
|
102
|
-
} | {
|
|
103
|
-
isCreatable: true;
|
|
104
|
-
isSearchable?: true;
|
|
105
|
-
};
|
|
106
62
|
/**
|
|
107
63
|
* Union type for all SelectDropdown prop variants.
|
|
108
|
-
* Supports both single and multi-select modes through discriminated union
|
|
109
|
-
* intersected with CreatableConstraint to enforce isSearchable compatibility.
|
|
64
|
+
* Supports both single and multi-select modes through discriminated union.
|
|
110
65
|
*/
|
|
111
|
-
export type SelectDropdownProps =
|
|
66
|
+
export type SelectDropdownProps = SingleSelectDropdownProps | MultiSelectDropdownProps;
|
|
112
67
|
/**
|
|
113
68
|
* Base interface for onChange-related props.
|
|
114
69
|
* Used internally for type checking and prop validation.
|
|
@@ -121,12 +76,9 @@ export interface BaseOnChangeProps {
|
|
|
121
76
|
}
|
|
122
77
|
/**
|
|
123
78
|
* Props for the typed React Select component wrapper.
|
|
124
|
-
* Extends ReactSelectAdditionalProps with an optional ref
|
|
79
|
+
* Extends ReactSelectAdditionalProps with an optional ref.
|
|
125
80
|
*/
|
|
126
|
-
export interface TypedReactSelectProps extends ReactSelectAdditionalProps
|
|
81
|
+
export interface TypedReactSelectProps extends ReactSelectAdditionalProps {
|
|
127
82
|
/** Optional ref to the underlying react-select component */
|
|
128
83
|
selectRef?: Ref<any>;
|
|
129
|
-
/** When true, renders CreatableSelect instead of ReactSelect */
|
|
130
|
-
isCreatable?: boolean;
|
|
131
84
|
}
|
|
132
|
-
export {};
|
|
@@ -11,10 +11,10 @@ export type InternalSelectProps = {
|
|
|
11
11
|
selectProps: Pick<SharedProps, 'inputProps'> & SelectDropdownSizes;
|
|
12
12
|
};
|
|
13
13
|
/**
|
|
14
|
-
* Ref type for programmatic focus management.
|
|
14
|
+
* Ref type for programmatic focus management (internal refs from useRef).
|
|
15
15
|
* Used for managing focus on select input and remove all button.
|
|
16
16
|
*/
|
|
17
|
-
export type ProgramaticFocusRef = React.
|
|
17
|
+
export type ProgramaticFocusRef = React.RefObject<HTMLDivElement | null>;
|
|
18
18
|
/**
|
|
19
19
|
* Context value for SelectDropdown internal state management.
|
|
20
20
|
* Provides access to focus state and refs for keyboard navigation.
|