@moneyforward/mfui-components 3.25.1 → 3.26.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/dist/src/DateTimeSelection/DatePicker/DatePickerCalendar/DatePickerCalendar.js +5 -3
- package/dist/src/DateTimeSelection/shared/BasePicker/BasePicker.d.ts +1 -1
- package/dist/src/DateTimeSelection/shared/BasePicker/BasePicker.js +7 -7
- package/dist/src/DateTimeSelection/shared/BasePicker/BasePicker.types.d.ts +11 -0
- package/dist/src/MultipleSelectBox/MultipleSelectBox.js +31 -23
- package/dist/src/SelectBox/SelectBox.js +25 -17
- package/package.json +1 -1
|
@@ -53,9 +53,11 @@ export function DatePickerCalendar({ value, onChange, minDate, maxDate, checkDis
|
|
|
53
53
|
setViewingValue(newDate);
|
|
54
54
|
}, [setViewingValue, viewingValue]);
|
|
55
55
|
const { isPrevYearDisabled, isNextYearDisabled } = useMemo(() => ({
|
|
56
|
-
isPrevYearDisabled: viewingValue.getFullYear() <= MINIMUM_VIEWABLE_YEAR
|
|
57
|
-
|
|
58
|
-
|
|
56
|
+
isPrevYearDisabled: viewingValue.getFullYear() <= MINIMUM_VIEWABLE_YEAR ||
|
|
57
|
+
(minDate ? viewingValue.getFullYear() <= minDate.getFullYear() : false),
|
|
58
|
+
isNextYearDisabled: viewingValue.getFullYear() >= MAXIMUM_VIEWABLE_YEAR ||
|
|
59
|
+
(maxDate ? viewingValue.getFullYear() >= maxDate.getFullYear() : false),
|
|
60
|
+
}), [viewingValue, minDate, maxDate]);
|
|
59
61
|
const { isPrevMonthDisabled, isNextMonthDisabled } = useMemo(() => {
|
|
60
62
|
const firstDayOfMonth = new Date(viewingValue.getFullYear(), viewingValue.getMonth(), 1);
|
|
61
63
|
const firstDayOfNextMonth = new Date(viewingValue.getFullYear(), viewingValue.getMonth() + 1, 1);
|
|
@@ -4,4 +4,4 @@ import { type BasePickerProps } from './BasePicker.types';
|
|
|
4
4
|
* This component uses the composition component of the TextBox component. Please refer to the TextBox documentation for their usage.
|
|
5
5
|
* This component extends the props of TextBox component.
|
|
6
6
|
*/
|
|
7
|
-
export declare function BasePicker({ targetDOMNode, enableAutoUnmount, open, onOpenStateChanged, disableAutoOpen, format, baseFormat, customFormatValue, value, defaultValue, onChange, calendarIconButtonProps, renderPopoverContent, onBlur, allowedPlacements, enableViewportConstraint, calendarLocale, disabled, ...textBoxProps }: BasePickerProps): import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
export declare function BasePicker({ targetDOMNode, enableAutoUnmount, open, onOpenStateChanged, disableAutoOpen, format, baseFormat, customFormatValue, value, defaultValue, initialViewingDate, onChange, calendarIconButtonProps, renderPopoverContent, onBlur, allowedPlacements, enableViewportConstraint, calendarLocale, disabled, ...textBoxProps }: BasePickerProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -18,7 +18,7 @@ import { getBasePickerLabel } from './constants';
|
|
|
18
18
|
* This component uses the composition component of the TextBox component. Please refer to the TextBox documentation for their usage.
|
|
19
19
|
* This component extends the props of TextBox component.
|
|
20
20
|
*/
|
|
21
|
-
export function BasePicker({ targetDOMNode, enableAutoUnmount = true, open = false, onOpenStateChanged, disableAutoOpen = false, format = 'YYYY/MM/DD', baseFormat = 'YYYY-MM-DD', customFormatValue, value, defaultValue, onChange, calendarIconButtonProps, renderPopoverContent, onBlur, allowedPlacements, enableViewportConstraint, calendarLocale = 'ja', disabled, ...textBoxProps }) {
|
|
21
|
+
export function BasePicker({ targetDOMNode, enableAutoUnmount = true, open = false, onOpenStateChanged, disableAutoOpen = false, format = 'YYYY/MM/DD', baseFormat = 'YYYY-MM-DD', customFormatValue, value, defaultValue, initialViewingDate, onChange, calendarIconButtonProps, renderPopoverContent, onBlur, allowedPlacements, enableViewportConstraint, calendarLocale = 'ja', disabled, ...textBoxProps }) {
|
|
22
22
|
const textBoxRef = useRef(null);
|
|
23
23
|
const basePickerPopoverWrapperRef = useRef(null);
|
|
24
24
|
const triggerRef = useRef(null);
|
|
@@ -76,7 +76,7 @@ export function BasePicker({ targetDOMNode, enableAutoUnmount = true, open = fal
|
|
|
76
76
|
}
|
|
77
77
|
openPopover(event);
|
|
78
78
|
}, [textBoxProps.wrapperProps, textBoxRef]);
|
|
79
|
-
return (_jsx(BasePickerProvider, { initialViewingValue: value ?? defaultValue, value: value, internalValue: inputValueProps.value, format: format, baseFormat: baseFormat, children: _jsx(InternalPopover, { renderTrigger: ({ setTriggerRef, togglePopover, openPopover, handleTriggerKeyDown, handleTriggerBlur }) => (_jsx(TextBox, { ref: textBoxRef, ...inputValueProps, touchDeviceReadOnly: true, suffixSlot: _jsx(IconButton, { size: textBoxProps.textBoxSize === 'small' ? 'small' : 'default', "aria-label": calendarIconButtonProps?.['aria-label'] ?? calendarIconLabel, "data-active": shouldCalendarIconActive, "data-mfui-content": "calendar-icon-button", disabled: disabled, onClick: togglePopover, onBlur: handleTriggerBlur, children: _jsx(Calendar, {}) }), disabled: disabled, ...textBoxProps, wrapperProps: {
|
|
79
|
+
return (_jsx(BasePickerProvider, { initialViewingValue: value ?? defaultValue ?? initialViewingDate, value: value, internalValue: inputValueProps.value, format: format, baseFormat: baseFormat, children: _jsx(InternalPopover, { renderTrigger: ({ setTriggerRef, togglePopover, openPopover, handleTriggerKeyDown, handleTriggerBlur }) => (_jsx(TextBox, { ref: textBoxRef, ...inputValueProps, touchDeviceReadOnly: true, suffixSlot: _jsx(IconButton, { size: textBoxProps.textBoxSize === 'small' ? 'small' : 'default', "aria-label": calendarIconButtonProps?.['aria-label'] ?? calendarIconLabel, "data-active": shouldCalendarIconActive, "data-mfui-content": "calendar-icon-button", disabled: disabled, onClick: togglePopover, onBlur: handleTriggerBlur, children: _jsx(Calendar, {}) }), disabled: disabled, ...textBoxProps, wrapperProps: {
|
|
80
80
|
...textBoxProps.wrapperProps,
|
|
81
81
|
ref: mergeRefs(setTriggerRef, triggerRef, textBoxProps.wrapperProps?.ref),
|
|
82
82
|
onKeyDown: (event) => {
|
|
@@ -93,7 +93,7 @@ export function BasePicker({ targetDOMNode, enableAutoUnmount = true, open = fal
|
|
|
93
93
|
inputValueProps.onBlur(event);
|
|
94
94
|
// Then call the Popover's smart blur detection
|
|
95
95
|
handleTriggerBlur(event);
|
|
96
|
-
} })), open: isBasePickerOpen, targetDOMNode: targetDOMNode, enableAutoUnmount: enableAutoUnmount, minWidth: "min-content", value: value, defaultValue: defaultValue, baseFormat: baseFormat, renderPopoverContent: renderPopoverContent, textBoxRef: textBoxRef, triggerRef: triggerRef, basePickerPopoverWrapperRef: basePickerPopoverWrapperRef, handleOnKeyDown: handleOnKeyDown, pickerPopoverProps: pickerPopoverProps, allowedPlacements: allowedPlacements, enableViewportConstraint: enableViewportConstraint, onOpenStateChanged: toggleBasePicker, onBlur: onBlur }) }));
|
|
96
|
+
} })), open: isBasePickerOpen, targetDOMNode: targetDOMNode, enableAutoUnmount: enableAutoUnmount, minWidth: "min-content", value: value, defaultValue: defaultValue, initialViewingDate: initialViewingDate, baseFormat: baseFormat, renderPopoverContent: renderPopoverContent, textBoxRef: textBoxRef, triggerRef: triggerRef, basePickerPopoverWrapperRef: basePickerPopoverWrapperRef, handleOnKeyDown: handleOnKeyDown, pickerPopoverProps: pickerPopoverProps, allowedPlacements: allowedPlacements, enableViewportConstraint: enableViewportConstraint, onOpenStateChanged: toggleBasePicker, onBlur: onBlur }) }));
|
|
97
97
|
}
|
|
98
98
|
/**
|
|
99
99
|
* Internal Popover component that needs access to BasePickerContext.
|
|
@@ -101,7 +101,7 @@ export function BasePicker({ targetDOMNode, enableAutoUnmount = true, open = fal
|
|
|
101
101
|
* which requires being within a BasePickerProvider. Creating it as an internal
|
|
102
102
|
* component ensures proper context access while keeping the logic encapsulated.
|
|
103
103
|
*/
|
|
104
|
-
function InternalPopover({ value, defaultValue, textBoxRef, triggerRef, baseFormat = 'YYYY-MM-DD', renderPopoverContent, basePickerPopoverWrapperRef, handleOnKeyDown, pickerPopoverProps, onOpenStateChanged, allowedPlacements, enableViewportConstraint, ...popoverProps }) {
|
|
104
|
+
function InternalPopover({ value, defaultValue, initialViewingDate, textBoxRef, triggerRef, baseFormat = 'YYYY-MM-DD', renderPopoverContent, basePickerPopoverWrapperRef, handleOnKeyDown, pickerPopoverProps, onOpenStateChanged, allowedPlacements, enableViewportConstraint, ...popoverProps }) {
|
|
105
105
|
// Always call the hook at the top level to ensure consistent hook order
|
|
106
106
|
const { viewingValue, setViewingValue, setPendingFocusDate } = useBasePickerContext();
|
|
107
107
|
const handlePopoverOpen = useCallback((event) => {
|
|
@@ -119,8 +119,8 @@ function InternalPopover({ value, defaultValue, textBoxRef, triggerRef, baseForm
|
|
|
119
119
|
!isClickOnClearButton;
|
|
120
120
|
if (isClickOnTextBox || isClickOnWrapper)
|
|
121
121
|
return;
|
|
122
|
-
// Get the date to focus on
|
|
123
|
-
const dateToFocus = dayjs(value ?? defaultValue ?? new Date())
|
|
122
|
+
// Get the date to focus on: selected value → initialViewingDate → today
|
|
123
|
+
const dateToFocus = dayjs(value ?? defaultValue ?? initialViewingDate ?? new Date())
|
|
124
124
|
.startOf('day')
|
|
125
125
|
.toDate();
|
|
126
126
|
const formattedDate = dayjs(dateToFocus).format(baseFormat);
|
|
@@ -128,7 +128,7 @@ function InternalPopover({ value, defaultValue, textBoxRef, triggerRef, baseForm
|
|
|
128
128
|
setViewingValue(dayjs(dateToFocus).startOf('month').startOf('day').toDate());
|
|
129
129
|
// Set the pending focus date to ensure proper focus after month change
|
|
130
130
|
setPendingFocusDate(formattedDate);
|
|
131
|
-
}, [textBoxRef, triggerRef, value, defaultValue, baseFormat, setViewingValue, setPendingFocusDate]);
|
|
131
|
+
}, [textBoxRef, triggerRef, value, defaultValue, initialViewingDate, baseFormat, setViewingValue, setPendingFocusDate]);
|
|
132
132
|
return (_jsx(Popover, { enableAutomaticPortalTargetResolution: true, enableViewportConstraint: enableViewportConstraint ?? false, enableAutoFocusOnPopover: false, ...popoverProps, renderContent: () => (_jsx("div", { ref: basePickerPopoverWrapperRef, className: "mfui-BasePicker__popoverWrapper", onKeyDown: handleOnKeyDown, children: renderPopoverContent({
|
|
133
133
|
viewingValue,
|
|
134
134
|
setViewingValue,
|
|
@@ -97,6 +97,17 @@ export type BasePickerProps = {
|
|
|
97
97
|
* @default 'ja'
|
|
98
98
|
*/
|
|
99
99
|
calendarLocale?: 'ja' | 'en';
|
|
100
|
+
/**
|
|
101
|
+
* The initial date the calendar view is centered on when the picker is opened without a selected value.
|
|
102
|
+
* Useful when `minDate` is in the future — without this, the calendar would open showing today
|
|
103
|
+
* even though all visible dates are disabled.
|
|
104
|
+
*
|
|
105
|
+
* When `value` or `defaultValue` is set, this prop is ignored because the calendar always
|
|
106
|
+
* navigates to the selected date's month.
|
|
107
|
+
*
|
|
108
|
+
* @default undefined (falls back to today)
|
|
109
|
+
*/
|
|
110
|
+
initialViewingDate?: Date;
|
|
100
111
|
/**
|
|
101
112
|
* Custom render function for the popover content. This is required to make BasePicker truly generic.
|
|
102
113
|
*
|
|
@@ -295,10 +295,15 @@ placeholder, emptyMessage, disabled, invalid, targetDOMNode, name, onChange, val
|
|
|
295
295
|
tabbableOptionIndex,
|
|
296
296
|
]);
|
|
297
297
|
// Render infinite scroll error message with retry button
|
|
298
|
-
const renderInfiniteScrollError = useCallback((
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
298
|
+
const renderInfiniteScrollError = useCallback((as = 'li') => {
|
|
299
|
+
if (!infiniteScrollError)
|
|
300
|
+
return null;
|
|
301
|
+
const Tag = as;
|
|
302
|
+
return (_jsxs(Tag, { className: cx(classes.infiniteScrollError, 'mfui-MultipleSelectBox__infiniteScrollError'), role: "alert", children: [_jsxs("div", { className: cx(classes.infiniteScrollErrorMessage, 'mfui-MultipleSelectBox__infiniteScrollErrorMessage'), "aria-live": "polite", children: [_jsx(Error, { "aria-hidden": true, className: cx(classes.infiniteScrollErrorIcon, 'mfui-MultipleSelectBox__infiniteScrollErrorIcon') }), _jsx(Typography, { variant: "body", children: infiniteScrollErrorMessage })] }), _jsx("div", { className: cx(classes.infiniteScrollErrorButton, 'mfui-MultipleSelectBox__infiniteScrollErrorButton'), children: _jsx(Button, { size: "small", onClick: (event) => {
|
|
303
|
+
event.stopPropagation();
|
|
304
|
+
retryInfiniteScroll();
|
|
305
|
+
}, children: infiniteScrollRetryButtonText }) })] }));
|
|
306
|
+
}, [
|
|
302
307
|
infiniteScrollError,
|
|
303
308
|
classes.infiniteScrollError,
|
|
304
309
|
classes.infiniteScrollErrorIcon,
|
|
@@ -317,26 +322,29 @@ placeholder, emptyMessage, disabled, invalid, targetDOMNode, name, onChange, val
|
|
|
317
322
|
: (selectedCountProps?.render?.(localSelectedValuesSet.size) ??
|
|
318
323
|
`${String(localSelectedValuesSet.size)}件選択中`) })) : null;
|
|
319
324
|
const applyControlsNode = enableApplyControls ? (_jsxs(HStack, { gap: "horizontal.0-1of2", children: [_jsx(Button, { ref: cancelButtonRef, size: "small", priority: "secondary", onClick: handleCancelButtonClick, children: cancelButtonProps?.label ?? 'キャンセル' }), _jsx(Button, { ref: applyButtonRef, size: "small", priority: "primary", onClick: handleApplyButtonClick, children: applyButtonProps?.label ?? '適用' })] })) : null;
|
|
320
|
-
const optionsNode = (
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
325
|
+
const optionsNode = (_jsxs("div", { ref: scrollWrapperRef, className: cx(classes.scrollWrapper, 'mfui-MultipleSelectBox__scrollWrapper'), onScroll: enableInfiniteScroll ? handleInfiniteScroll : undefined, children: [_jsx("ul", { ref: listBoxRef, role: "listbox", id: listBoxId, className: cx(classes.listBox, 'mfui-MultipleSelectBox__listBox'), tabIndex: -1, style: isVirtualized && totalSize > 0
|
|
326
|
+
? {
|
|
327
|
+
height: `${String(totalSize)}px`,
|
|
328
|
+
position: 'relative',
|
|
329
|
+
}
|
|
330
|
+
: undefined, children: loading
|
|
331
|
+
? Array.from({ length: SKELETON_ITEM_COUNT }).map((_, index) => (_jsx("li", { className: cx(classes.skeletonItem, 'mfui-MultipleSelectBox__skeletonItem'), children: _jsx(Skeleton, {}) }, index)))
|
|
332
|
+
: isVirtualized && virtualItems.length > 0
|
|
333
|
+
? renderVirtualizedItems()
|
|
334
|
+
: filteredOptions.length > 0
|
|
335
|
+
? [
|
|
336
|
+
...renderNonVirtualizedItems(),
|
|
337
|
+
!isVirtualized && renderInfiniteScrollLoading(),
|
|
338
|
+
!isVirtualized && renderInfiniteScrollError(),
|
|
339
|
+
].filter(Boolean)
|
|
340
|
+
: [
|
|
341
|
+
_jsx("li", { className: cx(classes.emptyMessage, 'mfui-MultipleSelectBox__emptyMessage'), children: _jsx(Typography, { variant: "body", children: enableSearchOptions && searchText && notFoundMessage
|
|
336
342
|
? notFoundMessage
|
|
337
|
-
:
|
|
338
|
-
|
|
339
|
-
|
|
343
|
+
: options.length > 0
|
|
344
|
+
? notFoundMessage
|
|
345
|
+
: emptyMessage }) }, "empty"),
|
|
346
|
+
!isVirtualized && renderInfiniteScrollError(),
|
|
347
|
+
].filter(Boolean) }), isVirtualized ? renderInfiniteScrollLoading() : null, isVirtualized ? renderInfiniteScrollError('div') : null] }));
|
|
340
348
|
const createOptionAreaNode = isCreateOptionVisible ? (_jsxs("div", { className: cx(classes.createOptionArea, 'mfui-MultipleSelectBox__createOptionArea'), children: [_jsxs("button", { "data-mfui-content": "create-new-option", type: "button", className: cx(classes.createOptionButton, 'mfui-MultipleSelectBox__createOptionButton'), disabled: isCreating, onClick: handleCreateOption, children: [_jsx(Add, { "aria-hidden": true }), createOptionProps?.renderLabel?.(searchText.trim()) ?? (_jsxs(_Fragment, { children: [_jsx(Typography, { variant: "strongBody", children: searchText.trim() }), _jsx(Typography, { variant: "body", children: "\u3092\u8FFD\u52A0" })] }))] }), createError ? (_jsx("div", { className: cx(classes.createOptionErrorMessage, 'mfui-MultipleSelectBox__createOptionErrorMessage'), children: _jsx(HelpMessage, { messageType: "error", children: createOptionProps?.renderErrorMessage?.(searchText.trim()) ??
|
|
341
349
|
`${searchText.trim()}を追加できませんでした。` }) })) : null] })) : null;
|
|
342
350
|
return (_jsx(Popover, { renderTrigger: ({ setTriggerRef, togglePopover, handleTriggerKeyDown, handleTriggerBlur }) => (_jsx(MultipleSelectBoxTrigger, { ref: triggerRef, wrapperRef: setTriggerRef, selectedOptions: localSelectedOptions, id: id, disabled: disabled, triggerProps: triggerProps, triggerWrapperProps: triggerWrapperProps, name: name,
|
|
@@ -284,10 +284,15 @@ export const SelectBox = forwardRef((props, ref) => {
|
|
|
284
284
|
? notFoundMessage
|
|
285
285
|
: emptyMessage }) }, "empty-message")), [classes.emptyMessage, enableSearchOptions, searchText, notFoundMessage, options.length, emptyMessage]);
|
|
286
286
|
// Render infinite scroll error message with retry button
|
|
287
|
-
const renderInfiniteScrollError = useCallback((
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
287
|
+
const renderInfiniteScrollError = useCallback((as = 'li') => {
|
|
288
|
+
if (!infiniteScrollError)
|
|
289
|
+
return null;
|
|
290
|
+
const Tag = as;
|
|
291
|
+
return (_jsxs(Tag, { className: cx(classes.infiniteScrollError, 'mfui-SelectBox__infiniteScrollError'), role: "alert", children: [_jsxs("div", { className: cx(classes.infiniteScrollErrorMessage, 'mfui-SelectBox__infiniteScrollErrorMessage'), "aria-live": "polite", children: [_jsx(Error, { "aria-hidden": true, className: cx(classes.infiniteScrollErrorIcon, 'mfui-SelectBox__infiniteScrollErrorIcon') }), _jsx(Typography, { variant: "body", children: infiniteScrollErrorMessage })] }), _jsx("div", { className: cx(classes.infiniteScrollErrorButton, 'mfui-SelectBox__infiniteScrollErrorButton'), children: _jsx(Button, { size: "small", onClick: (event) => {
|
|
292
|
+
event.stopPropagation();
|
|
293
|
+
retryInfiniteScroll();
|
|
294
|
+
}, children: infiniteScrollRetryButtonText }) })] }, "infinite-scroll-error"));
|
|
295
|
+
}, [
|
|
291
296
|
infiniteScrollError,
|
|
292
297
|
classes.infiniteScrollError,
|
|
293
298
|
classes.infiniteScrollErrorIcon,
|
|
@@ -299,19 +304,22 @@ export const SelectBox = forwardRef((props, ref) => {
|
|
|
299
304
|
]);
|
|
300
305
|
// Render infinite scroll loading indicator
|
|
301
306
|
const renderInfiniteScrollLoading = useCallback(() => isInfiniteScrollLoading && enableInfiniteScroll ? (_jsx("div", { className: cx(classes.infiniteScrollLoading, 'mfui-SelectBox__infiniteScrollLoading'), children: _jsx(ProgressIndicator, {}) }, "infinite-scroll-loading")) : null, [isInfiniteScrollLoading, enableInfiniteScroll, classes.infiniteScrollLoading]);
|
|
302
|
-
const optionsNode = (
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
307
|
+
const optionsNode = (_jsxs("div", { ref: scrollWrapperRef, className: cx(classes.scrollWrapper, 'mfui-SelectBox__scrollWrapper'), onScroll: enableInfiniteScroll ? handleInfiniteScroll : undefined, children: [_jsx("ul", { role: "listbox", id: listBoxId, className: cx(classes.listBox, 'mfui-SelectBox__listBox'), tabIndex: -1, style: isVirtualized
|
|
308
|
+
? {
|
|
309
|
+
height: `${String(totalSize)}px`,
|
|
310
|
+
position: 'relative',
|
|
311
|
+
}
|
|
312
|
+
: undefined, children: loading
|
|
313
|
+
? Array.from({ length: SKELETON_ITEM_COUNT }).map((_, index) => (_jsx("li", { className: cx(classes.skeletonItem, 'mfui-SelectBox__skeletonItem'), children: _jsx(Skeleton, {}) }, index)))
|
|
314
|
+
: isVirtualized && virtualItems.length > 0
|
|
315
|
+
? renderVirtualizedItems()
|
|
316
|
+
: filteredOptions.length > 0
|
|
317
|
+
? [
|
|
318
|
+
...renderNonVirtualizedItems(),
|
|
319
|
+
!isVirtualized && renderInfiniteScrollLoading(),
|
|
320
|
+
!isVirtualized && renderInfiniteScrollError(),
|
|
321
|
+
].filter(Boolean)
|
|
322
|
+
: [renderEmptyMessage(), !isVirtualized && renderInfiniteScrollError()].filter(Boolean) }), isVirtualized ? renderInfiniteScrollLoading() : null, isVirtualized ? renderInfiniteScrollError('div') : null] }));
|
|
315
323
|
const handleClearValue = () => {
|
|
316
324
|
setLocalSelectedOption(null);
|
|
317
325
|
onChange?.(null);
|