@hh.ru/magritte-ui-select 12.6.11 → 12.7.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/SelectBottomSheet.js +4 -2
- package/SelectBottomSheet.js.map +1 -1
- package/SelectDrop.d.ts +2 -3
- package/SelectDrop.js +4 -2
- package/SelectDrop.js.map +1 -1
- package/SelectEmptyHint.js +1 -1
- package/SelectError.js +1 -1
- package/SelectModal.js +4 -2
- package/SelectModal.js.map +1 -1
- package/SelectOption.js +1 -1
- package/index.css +33 -33
- package/package.json +2 -3
- package/types.d.ts +3 -4
package/SelectBottomSheet.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import './index.css';
|
|
2
2
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
3
|
-
import { useState, useRef, cloneElement, useCallback } from 'react';
|
|
3
|
+
import { useState, useRef, isValidElement, cloneElement, useCallback } from 'react';
|
|
4
4
|
import classnames from 'classnames';
|
|
5
5
|
import { keyboardMatch, keyboardKeys } from '@hh.ru/magritte-common-keyboard';
|
|
6
6
|
import { useTranslation } from '@hh.ru/magritte-common-use-translation';
|
|
@@ -25,7 +25,7 @@ import '@hh.ru/magritte-common-use-disabled';
|
|
|
25
25
|
import '@hh.ru/magritte-ui-checkable-card/CheckableCardElement';
|
|
26
26
|
import '@hh.ru/magritte-ui-checkbox-radio';
|
|
27
27
|
|
|
28
|
-
var styles = {"select-bottom-sheet":"magritte-select-bottom-sheet___1RZDJ_12-
|
|
28
|
+
var styles = {"select-bottom-sheet":"magritte-select-bottom-sheet___1RZDJ_12-7-0","selectBottomSheet":"magritte-select-bottom-sheet___1RZDJ_12-7-0","select-bottom-sheet_checkbox":"magritte-select-bottom-sheet_checkbox___hwTgo_12-7-0","selectBottomSheetCheckbox":"magritte-select-bottom-sheet_checkbox___hwTgo_12-7-0","select-bottom-sheet_radio":"magritte-select-bottom-sheet_radio___qvFFV_12-7-0","selectBottomSheetRadio":"magritte-select-bottom-sheet_radio___qvFFV_12-7-0","select-bottom-sheet_without-header":"magritte-select-bottom-sheet_without-header___KOKVh_12-7-0","selectBottomSheetWithoutHeader":"magritte-select-bottom-sheet_without-header___KOKVh_12-7-0","full-screen-placeholder":"magritte-full-screen-placeholder___zPC8k_12-7-0","fullScreenPlaceholder":"magritte-full-screen-placeholder___zPC8k_12-7-0","error-wrapper":"magritte-error-wrapper___P7jYg_12-7-0","errorWrapper":"magritte-error-wrapper___P7jYg_12-7-0"};
|
|
29
29
|
|
|
30
30
|
const SelectOptionDefault = ({ data, input, type, checked, plain, }) => {
|
|
31
31
|
if (type === 'delimiter') {
|
|
@@ -76,6 +76,7 @@ const SelectBottomSheet = ({ id, type, name, multiple, clearButton: _clearButton
|
|
|
76
76
|
const applyTrl = useTranslation('Select', 'apply');
|
|
77
77
|
const clearTrl = useTranslation('Select', 'clear');
|
|
78
78
|
const clearButton = _clearButton &&
|
|
79
|
+
isValidElement(_clearButton) &&
|
|
79
80
|
cloneElement(_clearButton, {
|
|
80
81
|
key: 'clearButton',
|
|
81
82
|
size: 'medium',
|
|
@@ -94,6 +95,7 @@ const SelectBottomSheet = ({ id, type, name, multiple, clearButton: _clearButton
|
|
|
94
95
|
});
|
|
95
96
|
const needAddChangesButton = multiple && _applyChangesButton;
|
|
96
97
|
const applyChangesButton = needAddChangesButton &&
|
|
98
|
+
isValidElement(_applyChangesButton) &&
|
|
97
99
|
cloneElement(_applyChangesButton, {
|
|
98
100
|
key: 'applyChangesButton',
|
|
99
101
|
size: 'medium',
|
package/SelectBottomSheet.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectBottomSheet.js","sources":["src/SelectBottomSheet.tsx"],"sourcesContent":["import { ComponentProps, ReactElement, ReactNode, cloneElement, useCallback, useRef, useState } from 'react';\nimport classnames from 'classnames';\n\nimport { StaticDataFetcherItem } from '@hh.ru/magritte-common-data-provider';\nimport { keyboardKeys, keyboardMatch } from '@hh.ru/magritte-common-keyboard';\nimport { useTranslation } from '@hh.ru/magritte-common-use-translation';\nimport { ActionBar } from '@hh.ru/magritte-ui-action-bar';\nimport { BottomSheet, BottomSheetFooter } from '@hh.ru/magritte-ui-bottom-sheet';\nimport { Button } from '@hh.ru/magritte-ui-button';\nimport { ButtonElement } from '@hh.ru/magritte-ui-button-stack';\nimport { Cell, CellText } from '@hh.ru/magritte-ui-cell';\nimport {\n ArrowPathClockwiseOutlinedSize24,\n CrossOutlinedSize24,\n CheckOutlinedSize24,\n} from '@hh.ru/magritte-ui-icon/icon';\nimport { SearchInput } from '@hh.ru/magritte-ui-input';\nimport { Loader } from '@hh.ru/magritte-ui-loader';\nimport { NavigationBar } from '@hh.ru/magritte-ui-navigation-bar';\nimport { SelectError } from '@hh.ru/magritte-ui-select/SelectError';\nimport { SelectOption } from '@hh.ru/magritte-ui-select/SelectOption';\nimport { getChecked } from '@hh.ru/magritte-ui-select/getChecked';\nimport { isArraysEquals } from '@hh.ru/magritte-ui-select/isArraysEquals';\nimport {\n OnChangeAction,\n SelectBottomSheetProps,\n RenderOptionTypeProps,\n RenderHeaderProps,\n RenderButtonsContainerProps,\n} from '@hh.ru/magritte-ui-select/types';\n\nimport styles from './select-bottom-sheet.less';\n\nconst SelectOptionDefault = <DataType extends StaticDataFetcherItem>({\n data,\n input,\n type,\n checked,\n plain,\n}: RenderOptionTypeProps<DataType>): ReactElement => {\n if (type === 'delimiter') {\n return (\n <CellText maxLines={1} style=\"secondary\">\n {data.text}\n </CellText>\n );\n }\n if (type === 'label') {\n return (\n <Cell Element=\"div\" right={checked && plain ? <CheckOutlinedSize24 /> : undefined} vertPadding>\n <CellText maxLines={1}>{data.text}</CellText>\n </Cell>\n );\n }\n return (\n <Cell Element=\"div\" align=\"center\" right={input}>\n <CellText maxLines={1}>{data.text}</CellText>\n </Cell>\n );\n};\n\nconst RenderButtonsContainerDefault = ({\n clearButton,\n applyChangesButton,\n loading,\n}: RenderButtonsContainerProps): ReactNode => {\n if ((!clearButton && !applyChangesButton) || loading) {\n return null;\n }\n const primaryActions = [clearButton, applyChangesButton].filter(Boolean);\n return <ActionBar primaryActions={primaryActions as ButtonElement[]} />;\n};\n\nexport const RenderHeaderDefault = ({\n onCloseBottomSheet,\n searchValue,\n setSearchValue,\n searchable,\n headerTitle,\n onSearchSubmit,\n optionsCount,\n onCloseBottomSheetWithUpdateValues,\n searchTrl,\n closeTrl,\n}: RenderHeaderProps): ReactNode => {\n return (\n <NavigationBar\n title={headerTitle}\n right={\n <CrossOutlinedSize24\n onClick={onCloseBottomSheet}\n data-qa=\"select-bottom-sheet-navigation-close\"\n aria-label={closeTrl}\n />\n }\n options={\n searchable && (\n <SearchInput\n clearable\n size=\"medium\"\n value={searchValue}\n onChange={setSearchValue}\n onKeyDown={(event) => {\n if (onSearchSubmit && keyboardMatch(event.nativeEvent, keyboardKeys.Enter)) {\n onSearchSubmit(\n event,\n onCloseBottomSheet,\n optionsCount,\n onCloseBottomSheetWithUpdateValues\n );\n }\n }}\n data-qa=\"bottom-sheet-navigation-input\"\n autoComplete=\"off\"\n aria-label={searchTrl}\n data-magritte-select-seach-input\n />\n )\n }\n />\n );\n};\n\nexport const SelectBottomSheet = <MultipleType extends boolean, DataType extends StaticDataFetcherItem>({\n id,\n type,\n name,\n multiple,\n clearButton: _clearButton,\n applyChangesButton: _applyChangesButton,\n useInitialValuesOnClearAction,\n loading,\n error,\n renderHeader = RenderHeaderDefault,\n renderItem = SelectOptionDefault,\n renderButtonsContainer = RenderButtonsContainerDefault,\n renderAlertOnExitWithoutSaving,\n headerTitle,\n onClose,\n visible,\n optionList,\n optionsListRef,\n searchValue,\n setSearchValue,\n searchable,\n value: values,\n onChange,\n clearSelectedValues,\n setInitialValues,\n isLimitExceeded,\n initialValuesOnOpening,\n setSelectedValues,\n onBottomSheetOpen,\n onBottomSheetClose,\n onSearchSubmit,\n onApply,\n onClear,\n emptyOptionsHint,\n emptyOptionsSearchHint,\n searchInProgress,\n internalError,\n reload,\n innerErrorTrls,\n optionDataQa,\n ...props\n}: SelectBottomSheetProps<MultipleType, DataType>): ReactElement => {\n const valuesArr = Array.isArray(values) ? values : [values];\n const [alertVisible, setAlertVisible] = useState(false);\n const showAlertOnExitWithoutSaving = Boolean(renderAlertOnExitWithoutSaving);\n const showErrorPlaceholder = Boolean(error);\n const cancelCloseFuncRef = useRef<VoidFunction | null>(null);\n\n const onCloseWithAlertCheck = (cancelCloseFunc: VoidFunction | null) => {\n if (showAlertOnExitWithoutSaving && multiple) {\n const haveUnsavingChanges = !isArraysEquals<string>(\n initialValuesOnOpening.current?.map((item) => item.value) ?? [],\n // eslint-disable-next-line no-nested-ternary\n Array.isArray(values) ? values.map((item) => item.value) : values ? [values.value] : []\n );\n if (haveUnsavingChanges) {\n cancelCloseFuncRef.current = cancelCloseFunc;\n setAlertVisible(true);\n } else {\n onClose();\n }\n } else {\n onClose();\n }\n };\n\n const applyTrl = useTranslation('Select', 'apply');\n const clearTrl = useTranslation('Select', 'clear');\n const clearButton =\n _clearButton &&\n cloneElement(_clearButton, {\n key: 'clearButton',\n size: 'medium',\n 'data-qa': 'magritte-select-clear-action-on-xs',\n 'aria-label': _clearButton.props['aria-label'] || clearTrl,\n onClick: () => {\n if (useInitialValuesOnClearAction) {\n setInitialValues();\n } else {\n clearSelectedValues();\n }\n onClose();\n onClear?.();\n },\n } as Partial<ComponentProps<typeof Button>>);\n\n const needAddChangesButton = multiple && _applyChangesButton;\n const applyChangesButton =\n needAddChangesButton &&\n cloneElement(_applyChangesButton, {\n key: 'applyChangesButton',\n size: 'medium',\n 'data-qa': 'magritte-select-apply-on-xs',\n 'aria-label': _applyChangesButton.props['aria-label'] || applyTrl,\n onClick: () => {\n setSelectedValues();\n onClose();\n onApply?.({\n isMobile: true,\n searchValue,\n optionsCount: optionList.length,\n selectedOptionsCount: valuesArr.length,\n });\n },\n } as Partial<ComponentProps<typeof Button>>);\n\n const handleChange: OnChangeAction<DataType> = useCallback(\n (...args) => {\n if (!multiple) {\n onClose();\n }\n onChange(...args);\n },\n [multiple, onChange, onClose]\n );\n\n const emptyOptionsHintVisible =\n optionList.length === 0 &&\n !searchValue &&\n !!emptyOptionsHint &&\n !loading &&\n !showErrorPlaceholder &&\n !searchInProgress &&\n !internalError;\n\n const emptyOptionsSearchHintVisible =\n optionList.length === 0 &&\n searchValue &&\n !!emptyOptionsSearchHint &&\n !loading &&\n !showErrorPlaceholder &&\n !searchInProgress &&\n !internalError;\n\n const footer = !showErrorPlaceholder ? (\n renderButtonsContainer({\n clearButton,\n applyChangesButton,\n searchValue,\n optionsCount: optionList.length,\n loading,\n isError: Boolean(internalError && innerErrorTrls),\n emptyOptionsHintVisible: Boolean(emptyOptionsHintVisible || emptyOptionsSearchHintVisible),\n })\n ) : (\n <BottomSheetFooter>{error && error.resetButton}</BottomSheetFooter>\n );\n\n const onCloseBottomSheetWithUpdateValues = () => {\n setSelectedValues();\n onCloseWithAlertCheck(null);\n };\n\n const optionsVisible =\n !loading &&\n !emptyOptionsSearchHintVisible &&\n !emptyOptionsHintVisible &&\n !internalError &&\n !showErrorPlaceholder;\n\n const searchTrl = useTranslation('Select', 'search');\n const closeTrl = useTranslation('Select', 'close');\n const header = renderHeader({\n onCloseBottomSheet: () => onCloseWithAlertCheck(null),\n searchValue,\n setSearchValue,\n searchable,\n headerTitle,\n onSearchSubmit,\n optionsCount: optionList.length,\n onCloseBottomSheetWithUpdateValues,\n searchTrl,\n closeTrl,\n });\n const haveHeader = Boolean(header);\n\n return (\n <>\n <BottomSheet\n {...props}\n id={id}\n ref={optionsListRef}\n allowScrollWhileFocused\n keyboardOverlaysFooter={false}\n visible={visible}\n showDivider={'with-scroll'}\n withContentPaddings={showErrorPlaceholder}\n header={header}\n onClose={onCloseWithAlertCheck}\n footer={\n internalError && innerErrorTrls ? (\n <BottomSheetFooter>\n <Button\n mode=\"primary\"\n style=\"accent\"\n size=\"medium\"\n onClick={reload}\n stretched\n icon={<ArrowPathClockwiseOutlinedSize24 />}\n >\n {innerErrorTrls.reloadButton}\n </Button>\n </BottomSheetFooter>\n ) : (\n footer\n )\n }\n onAppear={onBottomSheetOpen}\n onAfterExit={onBottomSheetClose}\n >\n {internalError && innerErrorTrls && <SelectError innerErrorTrls={innerErrorTrls} reload={reload} />}\n {emptyOptionsSearchHintVisible && (\n <div className={styles.fullScreenPlaceholder}>{emptyOptionsSearchHint}</div>\n )}\n {emptyOptionsHintVisible && <div className={styles.fullScreenPlaceholder}>{emptyOptionsHint}</div>}\n {loading && !showErrorPlaceholder && (\n <div className={styles.fullScreenPlaceholder}>\n <Loader size={24} />\n </div>\n )}\n {showErrorPlaceholder && <div className={styles.errorWrapper}>{error && error.placeholder}</div>}\n {optionsVisible && (\n <div\n role={'listbox'}\n className={classnames(styles.selectBottomSheet, styles[`select-bottom-sheet_${type}`], {\n [styles.selectBottomSheetWithoutHeader]: !haveHeader,\n })}\n data-qa=\"magritte-select-option-list-on-xs\"\n >\n {optionList.map(({ disabled: _disabled, type: optionType, ...option }) => {\n const checked = Boolean(option.data && getChecked<DataType>(option.data, values ?? []));\n const disabled = !checked && (_disabled || isLimitExceeded);\n return (\n <SelectOption\n key={option.data.value}\n name={name}\n checked={checked}\n onChange={handleChange}\n render={renderItem}\n disabled={disabled}\n type={optionType || type}\n plain={type === 'label'}\n multiple={multiple}\n data-qa={optionDataQa}\n isMobile\n {...option}\n />\n );\n })}\n </div>\n )}\n </BottomSheet>\n {renderAlertOnExitWithoutSaving?.({\n alertVisible,\n onCloseAlert: () => {\n cancelCloseFuncRef.current?.();\n cancelCloseFuncRef.current = null;\n setAlertVisible(false);\n },\n onClosePickerAndAlert: () => {\n cancelCloseFuncRef.current = null;\n setAlertVisible(false);\n onClose();\n },\n })}\n </>\n );\n};\n"],"names":["_jsx","_jsxs"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"SelectBottomSheet.js","sources":["src/SelectBottomSheet.tsx"],"sourcesContent":["import {\n ComponentProps,\n ReactElement,\n ReactNode,\n cloneElement,\n useCallback,\n useRef,\n useState,\n isValidElement,\n} from 'react';\nimport classnames from 'classnames';\n\nimport { StaticDataFetcherItem } from '@hh.ru/magritte-common-data-provider';\nimport { keyboardKeys, keyboardMatch } from '@hh.ru/magritte-common-keyboard';\nimport { useTranslation } from '@hh.ru/magritte-common-use-translation';\nimport { ActionBar } from '@hh.ru/magritte-ui-action-bar';\nimport { BottomSheet, BottomSheetFooter } from '@hh.ru/magritte-ui-bottom-sheet';\nimport { Button } from '@hh.ru/magritte-ui-button';\nimport { Cell, CellText } from '@hh.ru/magritte-ui-cell';\nimport {\n ArrowPathClockwiseOutlinedSize24,\n CrossOutlinedSize24,\n CheckOutlinedSize24,\n} from '@hh.ru/magritte-ui-icon/icon';\nimport { SearchInput } from '@hh.ru/magritte-ui-input';\nimport { Loader } from '@hh.ru/magritte-ui-loader';\nimport { NavigationBar } from '@hh.ru/magritte-ui-navigation-bar';\nimport { SelectError } from '@hh.ru/magritte-ui-select/SelectError';\nimport { SelectOption } from '@hh.ru/magritte-ui-select/SelectOption';\nimport { getChecked } from '@hh.ru/magritte-ui-select/getChecked';\nimport { isArraysEquals } from '@hh.ru/magritte-ui-select/isArraysEquals';\nimport {\n OnChangeAction,\n SelectBottomSheetProps,\n RenderOptionTypeProps,\n RenderHeaderProps,\n RenderButtonsContainerProps,\n} from '@hh.ru/magritte-ui-select/types';\n\nimport styles from './select-bottom-sheet.less';\n\nconst SelectOptionDefault = <DataType extends StaticDataFetcherItem>({\n data,\n input,\n type,\n checked,\n plain,\n}: RenderOptionTypeProps<DataType>): ReactElement => {\n if (type === 'delimiter') {\n return (\n <CellText maxLines={1} style=\"secondary\">\n {data.text}\n </CellText>\n );\n }\n if (type === 'label') {\n return (\n <Cell Element=\"div\" right={checked && plain ? <CheckOutlinedSize24 /> : undefined} vertPadding>\n <CellText maxLines={1}>{data.text}</CellText>\n </Cell>\n );\n }\n return (\n <Cell Element=\"div\" align=\"center\" right={input}>\n <CellText maxLines={1}>{data.text}</CellText>\n </Cell>\n );\n};\n\nconst RenderButtonsContainerDefault = ({\n clearButton,\n applyChangesButton,\n loading,\n}: RenderButtonsContainerProps): ReactNode => {\n if ((!clearButton && !applyChangesButton) || loading) {\n return null;\n }\n const primaryActions = [clearButton, applyChangesButton].filter(Boolean);\n return <ActionBar primaryActions={primaryActions} />;\n};\n\nexport const RenderHeaderDefault = ({\n onCloseBottomSheet,\n searchValue,\n setSearchValue,\n searchable,\n headerTitle,\n onSearchSubmit,\n optionsCount,\n onCloseBottomSheetWithUpdateValues,\n searchTrl,\n closeTrl,\n}: RenderHeaderProps): ReactNode => {\n return (\n <NavigationBar\n title={headerTitle}\n right={\n <CrossOutlinedSize24\n onClick={onCloseBottomSheet}\n data-qa=\"select-bottom-sheet-navigation-close\"\n aria-label={closeTrl}\n />\n }\n options={\n searchable && (\n <SearchInput\n clearable\n size=\"medium\"\n value={searchValue}\n onChange={setSearchValue}\n onKeyDown={(event) => {\n if (onSearchSubmit && keyboardMatch(event.nativeEvent, keyboardKeys.Enter)) {\n onSearchSubmit(\n event,\n onCloseBottomSheet,\n optionsCount,\n onCloseBottomSheetWithUpdateValues\n );\n }\n }}\n data-qa=\"bottom-sheet-navigation-input\"\n autoComplete=\"off\"\n aria-label={searchTrl}\n data-magritte-select-seach-input\n />\n )\n }\n />\n );\n};\n\nexport const SelectBottomSheet = <MultipleType extends boolean, DataType extends StaticDataFetcherItem>({\n id,\n type,\n name,\n multiple,\n clearButton: _clearButton,\n applyChangesButton: _applyChangesButton,\n useInitialValuesOnClearAction,\n loading,\n error,\n renderHeader = RenderHeaderDefault,\n renderItem = SelectOptionDefault,\n renderButtonsContainer = RenderButtonsContainerDefault,\n renderAlertOnExitWithoutSaving,\n headerTitle,\n onClose,\n visible,\n optionList,\n optionsListRef,\n searchValue,\n setSearchValue,\n searchable,\n value: values,\n onChange,\n clearSelectedValues,\n setInitialValues,\n isLimitExceeded,\n initialValuesOnOpening,\n setSelectedValues,\n onBottomSheetOpen,\n onBottomSheetClose,\n onSearchSubmit,\n onApply,\n onClear,\n emptyOptionsHint,\n emptyOptionsSearchHint,\n searchInProgress,\n internalError,\n reload,\n innerErrorTrls,\n optionDataQa,\n ...props\n}: SelectBottomSheetProps<MultipleType, DataType>): ReactElement => {\n const valuesArr = Array.isArray(values) ? values : [values];\n const [alertVisible, setAlertVisible] = useState(false);\n const showAlertOnExitWithoutSaving = Boolean(renderAlertOnExitWithoutSaving);\n const showErrorPlaceholder = Boolean(error);\n const cancelCloseFuncRef = useRef<VoidFunction | null>(null);\n\n const onCloseWithAlertCheck = (cancelCloseFunc: VoidFunction | null) => {\n if (showAlertOnExitWithoutSaving && multiple) {\n const haveUnsavingChanges = !isArraysEquals<string>(\n initialValuesOnOpening.current?.map((item) => item.value) ?? [],\n // eslint-disable-next-line no-nested-ternary\n Array.isArray(values) ? values.map((item) => item.value) : values ? [values.value] : []\n );\n if (haveUnsavingChanges) {\n cancelCloseFuncRef.current = cancelCloseFunc;\n setAlertVisible(true);\n } else {\n onClose();\n }\n } else {\n onClose();\n }\n };\n\n const applyTrl = useTranslation('Select', 'apply');\n const clearTrl = useTranslation('Select', 'clear');\n const clearButton =\n _clearButton &&\n isValidElement<ComponentProps<typeof Button>>(_clearButton) &&\n cloneElement(_clearButton, {\n key: 'clearButton',\n size: 'medium',\n 'data-qa': 'magritte-select-clear-action-on-xs',\n 'aria-label': _clearButton.props['aria-label'] || clearTrl,\n onClick: () => {\n if (useInitialValuesOnClearAction) {\n setInitialValues();\n } else {\n clearSelectedValues();\n }\n onClose();\n onClear?.();\n },\n } as Partial<ComponentProps<typeof Button>>);\n\n const needAddChangesButton = multiple && _applyChangesButton;\n const applyChangesButton =\n needAddChangesButton &&\n isValidElement<ComponentProps<typeof Button>>(_applyChangesButton) &&\n cloneElement(_applyChangesButton, {\n key: 'applyChangesButton',\n size: 'medium',\n 'data-qa': 'magritte-select-apply-on-xs',\n 'aria-label': _applyChangesButton.props['aria-label'] || applyTrl,\n onClick: () => {\n setSelectedValues();\n onClose();\n onApply?.({\n isMobile: true,\n searchValue,\n optionsCount: optionList.length,\n selectedOptionsCount: valuesArr.length,\n });\n },\n } as Partial<ComponentProps<typeof Button>>);\n\n const handleChange: OnChangeAction<DataType> = useCallback(\n (...args) => {\n if (!multiple) {\n onClose();\n }\n onChange(...args);\n },\n [multiple, onChange, onClose]\n );\n\n const emptyOptionsHintVisible =\n optionList.length === 0 &&\n !searchValue &&\n !!emptyOptionsHint &&\n !loading &&\n !showErrorPlaceholder &&\n !searchInProgress &&\n !internalError;\n\n const emptyOptionsSearchHintVisible =\n optionList.length === 0 &&\n searchValue &&\n !!emptyOptionsSearchHint &&\n !loading &&\n !showErrorPlaceholder &&\n !searchInProgress &&\n !internalError;\n\n const footer = !showErrorPlaceholder ? (\n renderButtonsContainer({\n clearButton,\n applyChangesButton,\n searchValue,\n optionsCount: optionList.length,\n loading,\n isError: Boolean(internalError && innerErrorTrls),\n emptyOptionsHintVisible: Boolean(emptyOptionsHintVisible || emptyOptionsSearchHintVisible),\n })\n ) : (\n <BottomSheetFooter>{error && error.resetButton}</BottomSheetFooter>\n );\n\n const onCloseBottomSheetWithUpdateValues = () => {\n setSelectedValues();\n onCloseWithAlertCheck(null);\n };\n\n const optionsVisible =\n !loading &&\n !emptyOptionsSearchHintVisible &&\n !emptyOptionsHintVisible &&\n !internalError &&\n !showErrorPlaceholder;\n\n const searchTrl = useTranslation('Select', 'search');\n const closeTrl = useTranslation('Select', 'close');\n const header = renderHeader({\n onCloseBottomSheet: () => onCloseWithAlertCheck(null),\n searchValue,\n setSearchValue,\n searchable,\n headerTitle,\n onSearchSubmit,\n optionsCount: optionList.length,\n onCloseBottomSheetWithUpdateValues,\n searchTrl,\n closeTrl,\n });\n const haveHeader = Boolean(header);\n\n return (\n <>\n <BottomSheet\n {...props}\n id={id}\n ref={optionsListRef}\n allowScrollWhileFocused\n keyboardOverlaysFooter={false}\n visible={visible}\n showDivider={'with-scroll'}\n withContentPaddings={showErrorPlaceholder}\n header={header}\n onClose={onCloseWithAlertCheck}\n footer={\n internalError && innerErrorTrls ? (\n <BottomSheetFooter>\n <Button\n mode=\"primary\"\n style=\"accent\"\n size=\"medium\"\n onClick={reload}\n stretched\n icon={<ArrowPathClockwiseOutlinedSize24 />}\n >\n {innerErrorTrls.reloadButton}\n </Button>\n </BottomSheetFooter>\n ) : (\n footer\n )\n }\n onAppear={onBottomSheetOpen}\n onAfterExit={onBottomSheetClose}\n >\n {internalError && innerErrorTrls && <SelectError innerErrorTrls={innerErrorTrls} reload={reload} />}\n {emptyOptionsSearchHintVisible && (\n <div className={styles.fullScreenPlaceholder}>{emptyOptionsSearchHint}</div>\n )}\n {emptyOptionsHintVisible && <div className={styles.fullScreenPlaceholder}>{emptyOptionsHint}</div>}\n {loading && !showErrorPlaceholder && (\n <div className={styles.fullScreenPlaceholder}>\n <Loader size={24} />\n </div>\n )}\n {showErrorPlaceholder && <div className={styles.errorWrapper}>{error && error.placeholder}</div>}\n {optionsVisible && (\n <div\n role={'listbox'}\n className={classnames(styles.selectBottomSheet, styles[`select-bottom-sheet_${type}`], {\n [styles.selectBottomSheetWithoutHeader]: !haveHeader,\n })}\n data-qa=\"magritte-select-option-list-on-xs\"\n >\n {optionList.map(({ disabled: _disabled, type: optionType, ...option }) => {\n const checked = Boolean(option.data && getChecked<DataType>(option.data, values ?? []));\n const disabled = !checked && (_disabled || isLimitExceeded);\n return (\n <SelectOption\n key={option.data.value}\n name={name}\n checked={checked}\n onChange={handleChange}\n render={renderItem}\n disabled={disabled}\n type={optionType || type}\n plain={type === 'label'}\n multiple={multiple}\n data-qa={optionDataQa}\n isMobile\n {...option}\n />\n );\n })}\n </div>\n )}\n </BottomSheet>\n {renderAlertOnExitWithoutSaving?.({\n alertVisible,\n onCloseAlert: () => {\n cancelCloseFuncRef.current?.();\n cancelCloseFuncRef.current = null;\n setAlertVisible(false);\n },\n onClosePickerAndAlert: () => {\n cancelCloseFuncRef.current = null;\n setAlertVisible(false);\n onClose();\n },\n })}\n </>\n );\n};\n"],"names":["_jsx","_jsxs"],"mappings":"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"}
|
package/SelectDrop.d.ts
CHANGED
|
@@ -1,7 +1,6 @@
|
|
|
1
|
-
import { type ReactElement } from 'react';
|
|
1
|
+
import { type ReactNode, type ReactElement } from 'react';
|
|
2
2
|
import { StaticDataFetcherItem } from '@hh.ru/magritte-common-data-provider';
|
|
3
|
-
import { ButtonElement } from '@hh.ru/magritte-ui-button-stack';
|
|
4
3
|
import { DropRole } from '@hh.ru/magritte-ui-drop';
|
|
5
4
|
import { SelectDropProps } from '@hh.ru/magritte-ui-select/types';
|
|
6
|
-
export declare const getDropRole: (clearButton
|
|
5
|
+
export declare const getDropRole: (clearButton?: ReactNode, applyChangesButton?: ReactNode, multiple?: boolean) => DropRole;
|
|
7
6
|
export declare const SelectDrop: <MultipleType extends boolean, DataType extends StaticDataFetcherItem>({ activatorRef, type, name, multiple, applyChangesButton: _applyChangesButton, clearButton: _clearButton, useInitialValuesOnClearAction, loading, renderItem, renderButtonsContainer, visible, optionList, optionsListRef, searchValue, setSearchValue, maxWidth, value: values, onChange, onClose, clearSelectedValues, setInitialValues, isLimitExceeded, plain, searchable, widthEqualToActivator, forceDropVisibleWithEmptyOptions, renderContentBefore, setForcedState, setSelectedValues, maxHeight, onDropClose, onDropOpen, emptyOptionsHint, emptyOptionsSearchHint, onApply, onClear, searchInProgress, internalError, reload, innerErrorTrls, optionDataQa, dropWidth, id, ...props }: SelectDropProps<MultipleType, DataType>) => ReactElement;
|
package/SelectDrop.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import './index.css';
|
|
2
2
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
3
|
-
import { useRef, useId, useCallback, cloneElement } from 'react';
|
|
3
|
+
import { useRef, useId, useCallback, isValidElement, cloneElement } from 'react';
|
|
4
4
|
import classnames from 'classnames';
|
|
5
5
|
import { keyboardMatches, keyboardKeys } from '@hh.ru/magritte-common-keyboard';
|
|
6
6
|
import { useTranslation } from '@hh.ru/magritte-common-use-translation';
|
|
@@ -22,7 +22,7 @@ import '@hh.ru/magritte-common-use-disabled';
|
|
|
22
22
|
import '@hh.ru/magritte-ui-checkable-card/CheckableCardElement';
|
|
23
23
|
import '@hh.ru/magritte-ui-checkbox-radio';
|
|
24
24
|
|
|
25
|
-
var styles = {"select-drop-container-wrapper":"magritte-select-drop-container-wrapper___OHM0q_12-
|
|
25
|
+
var styles = {"select-drop-container-wrapper":"magritte-select-drop-container-wrapper___OHM0q_12-7-0","selectDropContainerWrapper":"magritte-select-drop-container-wrapper___OHM0q_12-7-0","select-drop-container":"magritte-select-drop-container___hee1p_12-7-0","selectDropContainer":"magritte-select-drop-container___hee1p_12-7-0","select-drop-container_plain":"magritte-select-drop-container_plain___766zl_12-7-0","selectDropContainerPlain":"magritte-select-drop-container_plain___766zl_12-7-0","select-drop-container_with-footer":"magritte-select-drop-container_with-footer___6wp-L_12-7-0","selectDropContainerWithFooter":"magritte-select-drop-container_with-footer___6wp-L_12-7-0","select-drop":"magritte-select-drop___jn4O-_12-7-0","selectDrop":"magritte-select-drop___jn4O-_12-7-0","select-drop-header":"magritte-select-drop-header___fMmio_12-7-0","selectDropHeader":"magritte-select-drop-header___fMmio_12-7-0","select-drop_plain":"magritte-select-drop_plain___VL8Fz_12-7-0","selectDropPlain":"magritte-select-drop_plain___VL8Fz_12-7-0","label-option":"magritte-label-option___2N7t9_12-7-0","labelOption":"magritte-label-option___2N7t9_12-7-0","loading":"magritte-loading___AMiuq_12-7-0","hint":"magritte-hint___6qaFl_12-7-0"};
|
|
26
26
|
|
|
27
27
|
const SelectOptionDefault = ({ data, input, type, plain, checked, }) => {
|
|
28
28
|
if (type === 'delimiter') {
|
|
@@ -77,6 +77,7 @@ const SelectDrop = ({ activatorRef, type, name, multiple, applyChangesButton: _a
|
|
|
77
77
|
const applyTrl = useTranslation('Select', 'apply');
|
|
78
78
|
const clearTrl = useTranslation('Select', 'clear');
|
|
79
79
|
const clearButton = _clearButton &&
|
|
80
|
+
isValidElement(_clearButton) &&
|
|
80
81
|
cloneElement(_clearButton, {
|
|
81
82
|
key: 'clearButton',
|
|
82
83
|
size: 'medium',
|
|
@@ -89,6 +90,7 @@ const SelectDrop = ({ activatorRef, type, name, multiple, applyChangesButton: _a
|
|
|
89
90
|
});
|
|
90
91
|
const needAddChangesButton = multiple && _applyChangesButton;
|
|
91
92
|
const applyChangesButton = needAddChangesButton &&
|
|
93
|
+
isValidElement(_applyChangesButton) &&
|
|
92
94
|
cloneElement(_applyChangesButton, {
|
|
93
95
|
key: 'applyChangesButton',
|
|
94
96
|
size: 'medium',
|
package/SelectDrop.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectDrop.js","sources":["src/SelectDrop.tsx"],"sourcesContent":["import {\n useCallback,\n cloneElement,\n useRef,\n type ComponentProps,\n type ReactNode,\n type ReactElement,\n type KeyboardEvent,\n useId,\n} from 'react';\nimport classnames from 'classnames';\n\nimport { StaticDataFetcherItem } from '@hh.ru/magritte-common-data-provider';\nimport { keyboardKeys, keyboardMatches } from '@hh.ru/magritte-common-keyboard';\nimport { useTranslation } from '@hh.ru/magritte-common-use-translation';\nimport { ActionBar } from '@hh.ru/magritte-ui-action-bar/ActionBar';\nimport { Button } from '@hh.ru/magritte-ui-button';\nimport { ButtonElement } from '@hh.ru/magritte-ui-button-stack';\nimport { Cell, CellText } from '@hh.ru/magritte-ui-cell';\nimport { Drop, DropRole } from '@hh.ru/magritte-ui-drop';\nimport { CheckOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';\nimport { Loader } from '@hh.ru/magritte-ui-loader';\nimport { SelectError } from '@hh.ru/magritte-ui-select/SelectError';\nimport { SelectOption } from '@hh.ru/magritte-ui-select/SelectOption';\nimport { getChecked } from '@hh.ru/magritte-ui-select/getChecked';\nimport {\n OnChangeAction,\n SelectDropProps,\n RenderOptionTypeProps,\n RenderButtonsContainerProps,\n} from '@hh.ru/magritte-ui-select/types';\n\nimport styles from './select-drop.less';\n\nconst SelectOptionDefault = <DataType extends StaticDataFetcherItem>({\n data,\n input,\n type,\n plain,\n checked,\n}: RenderOptionTypeProps<DataType>): ReactElement => {\n if (type === 'delimiter') {\n return (\n <CellText maxLines={1} style=\"secondary\">\n {data.text}\n </CellText>\n );\n }\n if (type === 'label') {\n return (\n <Cell Element=\"div\" right={checked && plain ? <CheckOutlinedSize24 /> : undefined}>\n <div className={classnames({ [styles.labelOption]: !plain })}>\n <CellText maxLines={1}>{data.text}</CellText>\n </div>\n </Cell>\n );\n }\n return (\n <Cell Element=\"div\" align=\"center\" left={input}>\n <CellText maxLines={1}>{data.text}</CellText>\n </Cell>\n );\n};\n\nconst RenderButtonsContainerDefault = ({ applyChangesButton, loading }: RenderButtonsContainerProps): ReactNode => {\n if (loading || !applyChangesButton) {\n return null;\n }\n return <ActionBar primaryActions={applyChangesButton} />;\n};\n\nexport const getDropRole = (\n clearButton: ButtonElement | undefined,\n applyChangesButton: ButtonElement | undefined,\n multiple: boolean | undefined\n): DropRole => {\n const needAddChangesButton = multiple && Boolean(applyChangesButton);\n const hasAnyButton = Boolean(clearButton) || needAddChangesButton;\n return hasAnyButton ? 'dialog' : 'listbox';\n};\n\nexport const SelectDrop = <MultipleType extends boolean, DataType extends StaticDataFetcherItem>({\n activatorRef,\n type,\n name,\n multiple,\n applyChangesButton: _applyChangesButton,\n clearButton: _clearButton,\n useInitialValuesOnClearAction,\n loading,\n renderItem = SelectOptionDefault,\n renderButtonsContainer = RenderButtonsContainerDefault,\n visible,\n optionList,\n optionsListRef,\n searchValue,\n setSearchValue,\n maxWidth,\n value: values,\n onChange,\n onClose,\n clearSelectedValues,\n setInitialValues,\n isLimitExceeded,\n plain,\n searchable,\n widthEqualToActivator,\n forceDropVisibleWithEmptyOptions,\n renderContentBefore,\n setForcedState,\n setSelectedValues,\n maxHeight,\n onDropClose,\n onDropOpen,\n emptyOptionsHint,\n emptyOptionsSearchHint,\n onApply,\n onClear,\n searchInProgress,\n internalError,\n reload,\n innerErrorTrls,\n optionDataQa,\n dropWidth,\n id,\n ...props\n}: SelectDropProps<MultipleType, DataType>): ReactElement => {\n const closedByKeyboardRef = useRef(false);\n const listId = useId();\n const valuesArr = Array.isArray(values) ? values : [values];\n const handleChange: OnChangeAction<DataType> = useCallback(\n (newValue, needToPut) => {\n onChange(newValue, needToPut);\n\n if (!multiple) {\n onClose?.();\n }\n\n if (!multiple && closedByKeyboardRef.current) {\n closedByKeyboardRef.current = false;\n setForcedState('focus');\n return;\n }\n\n if (multiple && searchValue) {\n setForcedState('focusAndSelect');\n return;\n }\n closedByKeyboardRef.current = false;\n setForcedState(null);\n },\n [multiple, onChange, onClose, searchValue, setForcedState]\n );\n\n const clearSelectedValuesAndClose = () => {\n if (useInitialValuesOnClearAction) {\n setInitialValues();\n } else {\n clearSelectedValues();\n }\n onClose?.();\n };\n const applyTrl = useTranslation('Select', 'apply');\n const clearTrl = useTranslation('Select', 'clear');\n const clearButton =\n _clearButton &&\n cloneElement(_clearButton, {\n key: 'clearButton',\n size: 'medium',\n 'data-qa': 'magritte-select-clear-action',\n 'aria-label': _clearButton.props['aria-label'] || clearTrl,\n onClick: () => {\n clearSelectedValuesAndClose();\n onClear?.();\n },\n } as Partial<ComponentProps<typeof Button>>);\n const needAddChangesButton = multiple && _applyChangesButton;\n const applyChangesButton =\n needAddChangesButton &&\n cloneElement(_applyChangesButton, {\n key: 'applyChangesButton',\n size: 'medium',\n 'data-qa': 'magritte-select-apply',\n 'aria-label': _applyChangesButton.props['aria-label'] || applyTrl,\n onClick: () => {\n setSelectedValues();\n onClose?.();\n onApply?.({\n isMobile: false,\n searchValue,\n optionsCount: optionList.length,\n selectedOptionsCount: valuesArr.length,\n });\n },\n } as Partial<ComponentProps<typeof Button>>);\n\n const emptyOptionsHintVisible =\n optionList.length === 0 &&\n !searchValue &&\n !!emptyOptionsHint &&\n !loading &&\n !searchInProgress &&\n !internalError;\n const emptySearchOptionsHintVisible = !!(\n optionList.length === 0 &&\n searchValue &&\n !!emptyOptionsSearchHint &&\n !loading &&\n !searchInProgress &&\n !internalError\n );\n\n const optionsVisible = !loading && !emptySearchOptionsHintVisible && !emptyOptionsHintVisible && !internalError;\n const footer = renderButtonsContainer({\n applyChangesButton,\n clearButton,\n searchValue,\n optionsCount: optionList.length,\n loading,\n isError: Boolean(internalError && innerErrorTrls),\n emptyOptionsHintVisible: emptyOptionsHintVisible || emptySearchOptionsHintVisible,\n });\n const haveFooter = Boolean(footer);\n\n const dropRole = getDropRole(_clearButton, _applyChangesButton, multiple);\n const dropA11YProps = dropRole === 'listbox' ? { 'aria-owns': listId, 'aria-multiselectable': multiple } : {};\n const listA11YProps = dropRole === 'dialog' ? { role: 'listbox', 'aria-multiselectable': multiple } : {};\n\n return (\n <Drop\n {...props}\n ref={optionsListRef}\n autoFocusWhenOpened={false}\n maxWidth={maxWidth}\n width={dropWidth}\n visible={\n (optionList.length > 0 ||\n forceDropVisibleWithEmptyOptions ||\n emptyOptionsHintVisible ||\n emptySearchOptionsHintVisible ||\n internalError) &&\n visible\n }\n placement={['bottom-left', 'top-left', 'bottom-right', 'top-right']}\n activatorRef={activatorRef}\n padding={plain ? 24 : 12}\n keyboardNavigationMode=\"list\"\n onClose={() => {\n setForcedState('focus');\n onClose?.();\n }}\n closeByClickOutside={false}\n onKeyDownCapture={(event: KeyboardEvent) => {\n if (keyboardMatches(event.nativeEvent, [keyboardKeys.Enter, keyboardKeys.Space])) {\n closedByKeyboardRef.current = true;\n }\n }}\n widthEqualToActivator={widthEqualToActivator || (loading && dropWidth === undefined)}\n forcePlacement\n footer={footer}\n onAfterExit={onDropClose}\n onAppear={onDropOpen}\n returnFocusOnClose={false}\n id={id}\n role={dropRole}\n {...dropA11YProps}\n >\n <div className={styles.selectDropContainerWrapper} style={{ maxHeight: `${maxHeight}px` }}>\n <div\n className={classnames(\n styles.selectDropContainer,\n { [styles.selectDropContainerPlain]: plain },\n { [styles.selectDropContainerWithFooter]: haveFooter }\n )}\n >\n {internalError && innerErrorTrls && <SelectError innerErrorTrls={innerErrorTrls} reload={reload} />}\n {emptyOptionsHintVisible && <div className={styles.hint}>{emptyOptionsHint}</div>}\n {emptySearchOptionsHintVisible && <div className={styles.hint}>{emptyOptionsSearchHint}</div>}\n {loading && (\n <div className={styles.loading}>\n <Loader size={24} />\n </div>\n )}\n {optionsVisible && (\n <>\n {renderContentBefore && (\n <div data-qa=\"magritte-select-header\" className={styles.selectDropHeader}>\n {renderContentBefore({\n clearSelectedValuesAndClose,\n searchValue,\n setSearchValue,\n optionsCount: optionList.length,\n })}\n </div>\n )}\n <div\n id={listId}\n className={classnames(styles.selectDrop, { [styles.selectDropPlain]: plain })}\n data-qa=\"magritte-select-option-list\"\n {...listA11YProps}\n >\n {optionList.map((option) => {\n const checked = Boolean(option.data && getChecked(option.data, values ?? []));\n const disabled = !checked && (option.disabled || isLimitExceeded);\n return (\n <SelectOption\n key={option.data.value}\n name={name}\n checked={checked}\n onChange={handleChange}\n render={renderItem}\n disabled={disabled}\n type={option.type || type}\n plain={!!plain}\n multiple={multiple}\n data-qa={optionDataQa}\n data={option.data}\n />\n );\n })}\n </div>\n </>\n )}\n </div>\n </div>\n </Drop>\n );\n};\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"SelectDrop.js","sources":["src/SelectDrop.tsx"],"sourcesContent":["import {\n useCallback,\n cloneElement,\n useRef,\n type ComponentProps,\n type ReactNode,\n type ReactElement,\n type KeyboardEvent,\n useId,\n isValidElement,\n} from 'react';\nimport classnames from 'classnames';\n\nimport { StaticDataFetcherItem } from '@hh.ru/magritte-common-data-provider';\nimport { keyboardKeys, keyboardMatches } from '@hh.ru/magritte-common-keyboard';\nimport { useTranslation } from '@hh.ru/magritte-common-use-translation';\nimport { ActionBar } from '@hh.ru/magritte-ui-action-bar/ActionBar';\nimport { Button } from '@hh.ru/magritte-ui-button';\nimport { Cell, CellText } from '@hh.ru/magritte-ui-cell';\nimport { Drop, DropRole } from '@hh.ru/magritte-ui-drop';\nimport { CheckOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';\nimport { Loader } from '@hh.ru/magritte-ui-loader';\nimport { SelectError } from '@hh.ru/magritte-ui-select/SelectError';\nimport { SelectOption } from '@hh.ru/magritte-ui-select/SelectOption';\nimport { getChecked } from '@hh.ru/magritte-ui-select/getChecked';\nimport {\n OnChangeAction,\n SelectDropProps,\n RenderOptionTypeProps,\n RenderButtonsContainerProps,\n} from '@hh.ru/magritte-ui-select/types';\n\nimport styles from './select-drop.less';\n\nconst SelectOptionDefault = <DataType extends StaticDataFetcherItem>({\n data,\n input,\n type,\n plain,\n checked,\n}: RenderOptionTypeProps<DataType>): ReactElement => {\n if (type === 'delimiter') {\n return (\n <CellText maxLines={1} style=\"secondary\">\n {data.text}\n </CellText>\n );\n }\n if (type === 'label') {\n return (\n <Cell Element=\"div\" right={checked && plain ? <CheckOutlinedSize24 /> : undefined}>\n <div className={classnames({ [styles.labelOption]: !plain })}>\n <CellText maxLines={1}>{data.text}</CellText>\n </div>\n </Cell>\n );\n }\n return (\n <Cell Element=\"div\" align=\"center\" left={input}>\n <CellText maxLines={1}>{data.text}</CellText>\n </Cell>\n );\n};\n\nconst RenderButtonsContainerDefault = ({ applyChangesButton, loading }: RenderButtonsContainerProps): ReactNode => {\n if (loading || !applyChangesButton) {\n return null;\n }\n return <ActionBar primaryActions={applyChangesButton} />;\n};\n\nexport const getDropRole = (clearButton?: ReactNode, applyChangesButton?: ReactNode, multiple?: boolean): DropRole => {\n const needAddChangesButton = multiple && Boolean(applyChangesButton);\n const hasAnyButton = Boolean(clearButton) || needAddChangesButton;\n return hasAnyButton ? 'dialog' : 'listbox';\n};\n\nexport const SelectDrop = <MultipleType extends boolean, DataType extends StaticDataFetcherItem>({\n activatorRef,\n type,\n name,\n multiple,\n applyChangesButton: _applyChangesButton,\n clearButton: _clearButton,\n useInitialValuesOnClearAction,\n loading,\n renderItem = SelectOptionDefault,\n renderButtonsContainer = RenderButtonsContainerDefault,\n visible,\n optionList,\n optionsListRef,\n searchValue,\n setSearchValue,\n maxWidth,\n value: values,\n onChange,\n onClose,\n clearSelectedValues,\n setInitialValues,\n isLimitExceeded,\n plain,\n searchable,\n widthEqualToActivator,\n forceDropVisibleWithEmptyOptions,\n renderContentBefore,\n setForcedState,\n setSelectedValues,\n maxHeight,\n onDropClose,\n onDropOpen,\n emptyOptionsHint,\n emptyOptionsSearchHint,\n onApply,\n onClear,\n searchInProgress,\n internalError,\n reload,\n innerErrorTrls,\n optionDataQa,\n dropWidth,\n id,\n ...props\n}: SelectDropProps<MultipleType, DataType>): ReactElement => {\n const closedByKeyboardRef = useRef(false);\n const listId = useId();\n const valuesArr = Array.isArray(values) ? values : [values];\n const handleChange: OnChangeAction<DataType> = useCallback(\n (newValue, needToPut) => {\n onChange(newValue, needToPut);\n\n if (!multiple) {\n onClose?.();\n }\n\n if (!multiple && closedByKeyboardRef.current) {\n closedByKeyboardRef.current = false;\n setForcedState('focus');\n return;\n }\n\n if (multiple && searchValue) {\n setForcedState('focusAndSelect');\n return;\n }\n closedByKeyboardRef.current = false;\n setForcedState(null);\n },\n [multiple, onChange, onClose, searchValue, setForcedState]\n );\n\n const clearSelectedValuesAndClose = () => {\n if (useInitialValuesOnClearAction) {\n setInitialValues();\n } else {\n clearSelectedValues();\n }\n onClose?.();\n };\n const applyTrl = useTranslation('Select', 'apply');\n const clearTrl = useTranslation('Select', 'clear');\n const clearButton =\n _clearButton &&\n isValidElement<ComponentProps<typeof Button>>(_clearButton) &&\n cloneElement(_clearButton, {\n key: 'clearButton',\n size: 'medium',\n 'data-qa': 'magritte-select-clear-action',\n 'aria-label': _clearButton.props['aria-label'] || clearTrl,\n onClick: () => {\n clearSelectedValuesAndClose();\n onClear?.();\n },\n } as Partial<ComponentProps<typeof Button>>);\n const needAddChangesButton = multiple && _applyChangesButton;\n const applyChangesButton =\n needAddChangesButton &&\n isValidElement<ComponentProps<typeof Button>>(_applyChangesButton) &&\n cloneElement(_applyChangesButton, {\n key: 'applyChangesButton',\n size: 'medium',\n 'data-qa': 'magritte-select-apply',\n 'aria-label': _applyChangesButton.props['aria-label'] || applyTrl,\n onClick: () => {\n setSelectedValues();\n onClose?.();\n onApply?.({\n isMobile: false,\n searchValue,\n optionsCount: optionList.length,\n selectedOptionsCount: valuesArr.length,\n });\n },\n } as Partial<ComponentProps<typeof Button>>);\n\n const emptyOptionsHintVisible =\n optionList.length === 0 &&\n !searchValue &&\n !!emptyOptionsHint &&\n !loading &&\n !searchInProgress &&\n !internalError;\n const emptySearchOptionsHintVisible = !!(\n optionList.length === 0 &&\n searchValue &&\n !!emptyOptionsSearchHint &&\n !loading &&\n !searchInProgress &&\n !internalError\n );\n\n const optionsVisible = !loading && !emptySearchOptionsHintVisible && !emptyOptionsHintVisible && !internalError;\n const footer = renderButtonsContainer({\n applyChangesButton,\n clearButton,\n searchValue,\n optionsCount: optionList.length,\n loading,\n isError: Boolean(internalError && innerErrorTrls),\n emptyOptionsHintVisible: emptyOptionsHintVisible || emptySearchOptionsHintVisible,\n });\n const haveFooter = Boolean(footer);\n\n const dropRole = getDropRole(_clearButton, _applyChangesButton, multiple);\n const dropA11YProps = dropRole === 'listbox' ? { 'aria-owns': listId, 'aria-multiselectable': multiple } : {};\n const listA11YProps = dropRole === 'dialog' ? { role: 'listbox', 'aria-multiselectable': multiple } : {};\n\n return (\n <Drop\n {...props}\n ref={optionsListRef}\n autoFocusWhenOpened={false}\n maxWidth={maxWidth}\n width={dropWidth}\n visible={\n (optionList.length > 0 ||\n forceDropVisibleWithEmptyOptions ||\n emptyOptionsHintVisible ||\n emptySearchOptionsHintVisible ||\n internalError) &&\n visible\n }\n placement={['bottom-left', 'top-left', 'bottom-right', 'top-right']}\n activatorRef={activatorRef}\n padding={plain ? 24 : 12}\n keyboardNavigationMode=\"list\"\n onClose={() => {\n setForcedState('focus');\n onClose?.();\n }}\n closeByClickOutside={false}\n onKeyDownCapture={(event: KeyboardEvent) => {\n if (keyboardMatches(event.nativeEvent, [keyboardKeys.Enter, keyboardKeys.Space])) {\n closedByKeyboardRef.current = true;\n }\n }}\n widthEqualToActivator={widthEqualToActivator || (loading && dropWidth === undefined)}\n forcePlacement\n footer={footer}\n onAfterExit={onDropClose}\n onAppear={onDropOpen}\n returnFocusOnClose={false}\n id={id}\n role={dropRole}\n {...dropA11YProps}\n >\n <div className={styles.selectDropContainerWrapper} style={{ maxHeight: `${maxHeight}px` }}>\n <div\n className={classnames(\n styles.selectDropContainer,\n { [styles.selectDropContainerPlain]: plain },\n { [styles.selectDropContainerWithFooter]: haveFooter }\n )}\n >\n {internalError && innerErrorTrls && <SelectError innerErrorTrls={innerErrorTrls} reload={reload} />}\n {emptyOptionsHintVisible && <div className={styles.hint}>{emptyOptionsHint}</div>}\n {emptySearchOptionsHintVisible && <div className={styles.hint}>{emptyOptionsSearchHint}</div>}\n {loading && (\n <div className={styles.loading}>\n <Loader size={24} />\n </div>\n )}\n {optionsVisible && (\n <>\n {renderContentBefore && (\n <div data-qa=\"magritte-select-header\" className={styles.selectDropHeader}>\n {renderContentBefore({\n clearSelectedValuesAndClose,\n searchValue,\n setSearchValue,\n optionsCount: optionList.length,\n })}\n </div>\n )}\n <div\n id={listId}\n className={classnames(styles.selectDrop, { [styles.selectDropPlain]: plain })}\n data-qa=\"magritte-select-option-list\"\n {...listA11YProps}\n >\n {optionList.map((option) => {\n const checked = Boolean(option.data && getChecked(option.data, values ?? []));\n const disabled = !checked && (option.disabled || isLimitExceeded);\n return (\n <SelectOption\n key={option.data.value}\n name={name}\n checked={checked}\n onChange={handleChange}\n render={renderItem}\n disabled={disabled}\n type={option.type || type}\n plain={!!plain}\n multiple={multiple}\n data-qa={optionDataQa}\n data={option.data}\n />\n );\n })}\n </div>\n </>\n )}\n </div>\n </div>\n </Drop>\n );\n};\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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"}
|
package/SelectEmptyHint.js
CHANGED
|
@@ -6,7 +6,7 @@ import { VSpacing } from '@hh.ru/magritte-ui-spacing';
|
|
|
6
6
|
import { Title } from '@hh.ru/magritte-ui-title';
|
|
7
7
|
import { Text } from '@hh.ru/magritte-ui-typography';
|
|
8
8
|
|
|
9
|
-
var styles = {"select-empty-hint":"magritte-select-empty-hint___B39XJ_12-
|
|
9
|
+
var styles = {"select-empty-hint":"magritte-select-empty-hint___B39XJ_12-7-0","selectEmptyHint":"magritte-select-empty-hint___B39XJ_12-7-0","icon":"magritte-icon___F0GQx_12-7-0","icon-init":"magritte-icon-init___GWK-V_12-7-0","iconInit":"magritte-icon-init___GWK-V_12-7-0","icon-search":"magritte-icon-search___ZsqO-_12-7-0","iconSearch":"magritte-icon-search___ZsqO-_12-7-0"};
|
|
10
10
|
|
|
11
11
|
const SelectEmptyHint = ({ title, titleElement, description, type }) => {
|
|
12
12
|
return (jsxs("div", { className: styles.selectEmptyHint, children: [type === 'init' && (jsx("div", { className: classnames(styles.icon, styles.iconInit), children: jsx(MagnifierOutlinedSize24, {}) })), type === 'emptySearch' && (jsx("div", { className: classnames(styles.icon, styles.iconSearch), children: jsx(EmojiHalfsadOutlinedSize24, {}) })), jsx(VSpacing, { default: 32 }), jsx(Title, { Element: titleElement, size: "small", children: title }), jsx(VSpacing, { default: 8 }), Boolean(description) && (jsx(Text, { typography: "paragraph-2-regular", style: "secondary", children: description }))] }));
|
package/SelectError.js
CHANGED
|
@@ -7,7 +7,7 @@ import { VSpacing } from '@hh.ru/magritte-ui-spacing';
|
|
|
7
7
|
import { Title } from '@hh.ru/magritte-ui-title';
|
|
8
8
|
import { Text } from '@hh.ru/magritte-ui-typography';
|
|
9
9
|
|
|
10
|
-
var styles = {"error-container":"magritte-error-container___t9B5w_12-
|
|
10
|
+
var styles = {"error-container":"magritte-error-container___t9B5w_12-7-0","errorContainer":"magritte-error-container___t9B5w_12-7-0"};
|
|
11
11
|
|
|
12
12
|
const SelectError = ({ innerErrorTrls, reload, }) => {
|
|
13
13
|
const { isMobile } = useBreakpoint();
|
package/SelectModal.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import './index.css';
|
|
2
2
|
import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
|
|
3
|
-
import { useState, useCallback, cloneElement } from 'react';
|
|
3
|
+
import { useState, useCallback, isValidElement, cloneElement } from 'react';
|
|
4
4
|
import classnames from 'classnames';
|
|
5
5
|
import { useTranslation } from '@hh.ru/magritte-common-use-translation';
|
|
6
6
|
import { ActionBar } from '@hh.ru/magritte-ui-action-bar';
|
|
@@ -24,7 +24,7 @@ import '@hh.ru/magritte-common-use-disabled';
|
|
|
24
24
|
import '@hh.ru/magritte-ui-checkable-card/CheckableCardElement';
|
|
25
25
|
import '@hh.ru/magritte-ui-checkbox-radio';
|
|
26
26
|
|
|
27
|
-
var styles = {"select-modal-wrapper":"magritte-select-modal-wrapper___5BhtC_12-
|
|
27
|
+
var styles = {"select-modal-wrapper":"magritte-select-modal-wrapper___5BhtC_12-7-0","selectModalWrapper":"magritte-select-modal-wrapper___5BhtC_12-7-0","select-modal":"magritte-select-modal___f9wc6_12-7-0","selectModal":"magritte-select-modal___f9wc6_12-7-0","select-modal_plain":"magritte-select-modal_plain___0rP39_12-7-0","selectModalPlain":"magritte-select-modal_plain___0rP39_12-7-0","label-option":"magritte-label-option___kFAuR_12-7-0","labelOption":"magritte-label-option___kFAuR_12-7-0","layer-full-height":"magritte-layer-full-height___cJX-K_12-7-0","layerFullHeight":"magritte-layer-full-height___cJX-K_12-7-0"};
|
|
28
28
|
|
|
29
29
|
const SelectOptionDefault = ({ data, input, type, plain, checked, }) => {
|
|
30
30
|
if (type === 'delimiter') {
|
|
@@ -91,6 +91,7 @@ const SelectModal = ({ type, name, multiple, applyChangesButton: _applyChangesBu
|
|
|
91
91
|
onClose?.();
|
|
92
92
|
};
|
|
93
93
|
const clearButton = _clearButton &&
|
|
94
|
+
isValidElement(_clearButton) &&
|
|
94
95
|
cloneElement(_clearButton, {
|
|
95
96
|
key: 'clearButton',
|
|
96
97
|
size: 'medium',
|
|
@@ -104,6 +105,7 @@ const SelectModal = ({ type, name, multiple, applyChangesButton: _applyChangesBu
|
|
|
104
105
|
});
|
|
105
106
|
const needAddChangesButton = multiple && _applyChangesButton;
|
|
106
107
|
const applyChangesButton = needAddChangesButton &&
|
|
108
|
+
isValidElement(_applyChangesButton) &&
|
|
107
109
|
cloneElement(_applyChangesButton, {
|
|
108
110
|
key: 'applyChangesButton',
|
|
109
111
|
size: 'medium',
|
package/SelectModal.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectModal.js","sources":["src/SelectModal.tsx"],"sourcesContent":["import { useCallback, ReactElement, cloneElement, ComponentProps, ReactNode, useState } from 'react';\nimport classnames from 'classnames';\n\nimport { StaticDataFetcherItem } from '@hh.ru/magritte-common-data-provider';\nimport { useTranslation } from '@hh.ru/magritte-common-use-translation';\nimport { ActionBar } from '@hh.ru/magritte-ui-action-bar';\nimport { Button } from '@hh.ru/magritte-ui-button';\nimport { Cell, CellText } from '@hh.ru/magritte-ui-cell';\nimport { CrossOutlinedSize24, CheckOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';\nimport { SearchInput } from '@hh.ru/magritte-ui-input';\nimport { Loader } from '@hh.ru/magritte-ui-loader';\nimport { Modal } from '@hh.ru/magritte-ui-modal';\nimport { SelectError } from '@hh.ru/magritte-ui-select/SelectError';\nimport { SelectOption } from '@hh.ru/magritte-ui-select/SelectOption';\nimport { getChecked } from '@hh.ru/magritte-ui-select/getChecked';\nimport { isArraysEquals } from '@hh.ru/magritte-ui-select/isArraysEquals';\nimport {\n OnChangeAction,\n SelectModalProps,\n RenderOptionTypeProps,\n RenderButtonsContainerProps,\n} from '@hh.ru/magritte-ui-select/types';\n\nimport styles from './select-modal.less';\n\nconst SelectOptionDefault = <DataType extends StaticDataFetcherItem>({\n data,\n input,\n type,\n plain,\n checked,\n}: RenderOptionTypeProps<DataType>): ReactElement => {\n if (type === 'delimiter') {\n return (\n <CellText maxLines={1} style=\"secondary\">\n {data.text}\n </CellText>\n );\n }\n if (type === 'label') {\n return (\n <Cell\n Element=\"div\"\n right={checked && plain ? <CheckOutlinedSize24 /> : undefined}\n vertPadding={plain}\n showDivider={plain}\n >\n <div className={classnames({ [styles.labelOption]: !plain })}>\n <CellText maxLines={1}>{data.text}</CellText>\n </div>\n </Cell>\n );\n }\n return (\n <Cell Element=\"div\" align=\"center\" left={input} vertPadding={plain} showDivider={plain}>\n <CellText maxLines={1}>{data.text}</CellText>\n </Cell>\n );\n};\n\nconst RenderButtonsContainerDefault = ({\n applyChangesButton,\n clearButton,\n isError,\n emptyOptionsHintVisible,\n}: RenderButtonsContainerProps): ReactNode => {\n if (isError || emptyOptionsHintVisible) {\n return null;\n }\n const primaryActions = [applyChangesButton, clearButton].filter((btn) => btn);\n if (primaryActions.length === 0) {\n return null;\n }\n return <ActionBar secondaryActions={clearButton} primaryActions={applyChangesButton} />;\n};\n\nexport const SelectModal = <MultipleType extends boolean, DataType extends StaticDataFetcherItem>({\n type,\n name,\n multiple,\n applyChangesButton: _applyChangesButton,\n clearButton: _clearButton,\n useInitialValuesOnClearAction,\n loading,\n renderItem = SelectOptionDefault,\n renderButtonsContainer = RenderButtonsContainerDefault,\n visible,\n optionList,\n optionsListRef,\n searchValue,\n setSearchValue,\n value: values,\n onChange,\n onClose,\n clearSelectedValues,\n setInitialValues,\n isLimitExceeded,\n plain,\n searchable,\n setForcedState,\n setSelectedValues,\n emptyOptionsHint,\n emptyOptionsSearchHint,\n onApply,\n onClear,\n searchInProgress,\n internalError,\n reload,\n innerErrorTrls,\n optionDataQa,\n renderAlertOnExitWithoutSaving,\n initialValuesOnOpening,\n internalLoading,\n ...modalProps\n}: SelectModalProps<MultipleType, DataType>): ReactElement => {\n const valuesArr = Array.isArray(values) ? values : [values];\n const [alertVisible, setAlertVisible] = useState(false);\n const onCloseAlert = () => setAlertVisible(false);\n const showAlertOnExitWithoutSaving = Boolean(renderAlertOnExitWithoutSaving);\n const applyTrl = useTranslation('Select', 'apply');\n const clearTrl = useTranslation('Select', 'clear');\n const searchTrl = useTranslation('Select', 'search');\n const closeTrl = useTranslation('Select', 'close');\n\n const onCloseWithAlertCheck = () => {\n if (showAlertOnExitWithoutSaving && multiple) {\n // eslint-disable-next-line no-nested-ternary\n const currentValues = Array.isArray(values)\n ? values.map((item) => item.value)\n : values\n ? [values.value]\n : [];\n const haveUnsavingChanges = !isArraysEquals<string>(\n initialValuesOnOpening.current?.map((item) => item.value) ?? [],\n currentValues\n );\n if (haveUnsavingChanges) {\n setAlertVisible(true);\n } else {\n onClose?.();\n }\n } else {\n onClose?.();\n }\n };\n\n const handleChange: OnChangeAction<DataType> = useCallback(\n (newValue, needToPut) => {\n onChange(newValue, needToPut);\n if (!multiple) {\n onClose?.();\n }\n setForcedState(null);\n },\n [multiple, onChange, onClose, setForcedState]\n );\n\n const clearSelectedValuesAndClose = () => {\n if (useInitialValuesOnClearAction) {\n setInitialValues();\n } else {\n clearSelectedValues();\n }\n onClose?.();\n };\n const clearButton =\n _clearButton &&\n cloneElement(_clearButton, {\n key: 'clearButton',\n size: 'medium',\n 'data-qa': 'magritte-select-clear-action',\n disabled: loading,\n 'aria-label': _clearButton.props['aria-label'] || clearTrl,\n onClick: () => {\n clearSelectedValuesAndClose();\n onClear?.();\n },\n } as Partial<ComponentProps<typeof Button>>);\n const needAddChangesButton = multiple && _applyChangesButton;\n const applyChangesButton =\n needAddChangesButton &&\n cloneElement(_applyChangesButton, {\n key: 'applyChangesButton',\n size: 'medium',\n 'data-qa': 'magritte-select-apply',\n disabled: loading,\n 'aria-label': _applyChangesButton.props['aria-label'] || applyTrl,\n onClick: () => {\n setSelectedValues();\n onClose?.();\n onApply?.({\n isMobile: false,\n searchValue,\n optionsCount: optionList.length,\n selectedOptionsCount: valuesArr.length,\n });\n },\n } as Partial<ComponentProps<typeof Button>>);\n\n const emptyOptionsHintVisible =\n optionList.length === 0 &&\n !searchValue &&\n !!emptyOptionsHint &&\n !loading &&\n !searchInProgress &&\n !internalError;\n const emptySearchOptionsHintVisible = !!(\n optionList.length === 0 &&\n searchValue &&\n !!emptyOptionsSearchHint &&\n !loading &&\n !searchInProgress &&\n !internalError\n );\n\n const optionsVisible = !loading && !emptySearchOptionsHintVisible && !emptyOptionsHintVisible && !internalError;\n\n return (\n <>\n <Modal\n {...modalProps}\n size={modalProps?.size || 'small'}\n height={searchable ? 'full-screen' : modalProps?.height}\n ref={optionsListRef}\n visible={visible}\n footer={renderButtonsContainer({\n applyChangesButton,\n clearButton,\n searchValue,\n optionsCount: optionList.length,\n loading,\n isError: Boolean(internalError && innerErrorTrls),\n emptyOptionsHintVisible: emptyOptionsHintVisible || emptySearchOptionsHintVisible,\n })}\n options={\n searchable && (\n <SearchInput\n clearable\n size=\"medium\"\n value={searchValue}\n onChange={setSearchValue}\n data-qa=\"select-modal-search-input\"\n autoComplete=\"off\"\n data-magritte-select-seach-input\n aria-label={searchTrl}\n />\n )\n }\n onClose={() => {\n setForcedState('focus');\n onCloseWithAlertCheck?.();\n }}\n actions={[\n <CrossOutlinedSize24\n key=\"1\"\n data-qa=\"select-modal-close\"\n onClick={onCloseWithAlertCheck}\n aria-label={closeTrl}\n />,\n ]}\n >\n <div className={styles.selectModalWrapper}>\n {internalError && innerErrorTrls && (\n <div className={styles.layerFullHeight}>\n <SelectError innerErrorTrls={innerErrorTrls} reload={reload} />\n </div>\n )}\n {emptyOptionsHintVisible && <div className={styles.layerFullHeight}>{emptyOptionsHint}</div>}\n {emptySearchOptionsHintVisible && (\n <div className={styles.layerFullHeight}>{emptyOptionsSearchHint}</div>\n )}\n {loading && (\n <div className={styles.layerFullHeight}>\n <Loader size={24} />\n </div>\n )}\n {optionsVisible && (\n <div\n className={classnames(styles.selectModal, { [styles.selectModalPlain]: plain })}\n data-qa=\"magritte-select-option-list\"\n role={'listbox'}\n >\n {optionList.map((option) => {\n const checked = Boolean(option.data && getChecked(option.data, values ?? []));\n const disabled = !checked && (option.disabled || isLimitExceeded);\n return (\n <SelectOption\n key={option.data.value}\n name={name}\n checked={checked}\n onChange={handleChange}\n render={renderItem}\n disabled={disabled}\n type={option.type || type}\n plain={!!plain}\n multiple={multiple}\n data-qa={optionDataQa}\n data={option.data}\n />\n );\n })}\n </div>\n )}\n </div>\n </Modal>\n {renderAlertOnExitWithoutSaving?.({\n alertVisible,\n onCloseAlert,\n onClosePickerAndAlert: () => {\n onCloseAlert();\n onClose?.();\n },\n })}\n </>\n );\n};\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"SelectModal.js","sources":["src/SelectModal.tsx"],"sourcesContent":["import { useCallback, ReactElement, cloneElement, ComponentProps, ReactNode, useState, isValidElement } from 'react';\nimport classnames from 'classnames';\n\nimport { StaticDataFetcherItem } from '@hh.ru/magritte-common-data-provider';\nimport { useTranslation } from '@hh.ru/magritte-common-use-translation';\nimport { ActionBar } from '@hh.ru/magritte-ui-action-bar';\nimport { Button } from '@hh.ru/magritte-ui-button';\nimport { Cell, CellText } from '@hh.ru/magritte-ui-cell';\nimport { CrossOutlinedSize24, CheckOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';\nimport { SearchInput } from '@hh.ru/magritte-ui-input';\nimport { Loader } from '@hh.ru/magritte-ui-loader';\nimport { Modal } from '@hh.ru/magritte-ui-modal';\nimport { SelectError } from '@hh.ru/magritte-ui-select/SelectError';\nimport { SelectOption } from '@hh.ru/magritte-ui-select/SelectOption';\nimport { getChecked } from '@hh.ru/magritte-ui-select/getChecked';\nimport { isArraysEquals } from '@hh.ru/magritte-ui-select/isArraysEquals';\nimport {\n OnChangeAction,\n SelectModalProps,\n RenderOptionTypeProps,\n RenderButtonsContainerProps,\n} from '@hh.ru/magritte-ui-select/types';\n\nimport styles from './select-modal.less';\n\nconst SelectOptionDefault = <DataType extends StaticDataFetcherItem>({\n data,\n input,\n type,\n plain,\n checked,\n}: RenderOptionTypeProps<DataType>): ReactElement => {\n if (type === 'delimiter') {\n return (\n <CellText maxLines={1} style=\"secondary\">\n {data.text}\n </CellText>\n );\n }\n if (type === 'label') {\n return (\n <Cell\n Element=\"div\"\n right={checked && plain ? <CheckOutlinedSize24 /> : undefined}\n vertPadding={plain}\n showDivider={plain}\n >\n <div className={classnames({ [styles.labelOption]: !plain })}>\n <CellText maxLines={1}>{data.text}</CellText>\n </div>\n </Cell>\n );\n }\n return (\n <Cell Element=\"div\" align=\"center\" left={input} vertPadding={plain} showDivider={plain}>\n <CellText maxLines={1}>{data.text}</CellText>\n </Cell>\n );\n};\n\nconst RenderButtonsContainerDefault = ({\n applyChangesButton,\n clearButton,\n isError,\n emptyOptionsHintVisible,\n}: RenderButtonsContainerProps): ReactNode => {\n if (isError || emptyOptionsHintVisible) {\n return null;\n }\n const primaryActions = [applyChangesButton, clearButton].filter((btn) => btn);\n if (primaryActions.length === 0) {\n return null;\n }\n return <ActionBar secondaryActions={clearButton} primaryActions={applyChangesButton} />;\n};\n\nexport const SelectModal = <MultipleType extends boolean, DataType extends StaticDataFetcherItem>({\n type,\n name,\n multiple,\n applyChangesButton: _applyChangesButton,\n clearButton: _clearButton,\n useInitialValuesOnClearAction,\n loading,\n renderItem = SelectOptionDefault,\n renderButtonsContainer = RenderButtonsContainerDefault,\n visible,\n optionList,\n optionsListRef,\n searchValue,\n setSearchValue,\n value: values,\n onChange,\n onClose,\n clearSelectedValues,\n setInitialValues,\n isLimitExceeded,\n plain,\n searchable,\n setForcedState,\n setSelectedValues,\n emptyOptionsHint,\n emptyOptionsSearchHint,\n onApply,\n onClear,\n searchInProgress,\n internalError,\n reload,\n innerErrorTrls,\n optionDataQa,\n renderAlertOnExitWithoutSaving,\n initialValuesOnOpening,\n internalLoading,\n ...modalProps\n}: SelectModalProps<MultipleType, DataType>): ReactElement => {\n const valuesArr = Array.isArray(values) ? values : [values];\n const [alertVisible, setAlertVisible] = useState(false);\n const onCloseAlert = () => setAlertVisible(false);\n const showAlertOnExitWithoutSaving = Boolean(renderAlertOnExitWithoutSaving);\n const applyTrl = useTranslation('Select', 'apply');\n const clearTrl = useTranslation('Select', 'clear');\n const searchTrl = useTranslation('Select', 'search');\n const closeTrl = useTranslation('Select', 'close');\n\n const onCloseWithAlertCheck = () => {\n if (showAlertOnExitWithoutSaving && multiple) {\n // eslint-disable-next-line no-nested-ternary\n const currentValues = Array.isArray(values)\n ? values.map((item) => item.value)\n : values\n ? [values.value]\n : [];\n const haveUnsavingChanges = !isArraysEquals<string>(\n initialValuesOnOpening.current?.map((item) => item.value) ?? [],\n currentValues\n );\n if (haveUnsavingChanges) {\n setAlertVisible(true);\n } else {\n onClose?.();\n }\n } else {\n onClose?.();\n }\n };\n\n const handleChange: OnChangeAction<DataType> = useCallback(\n (newValue, needToPut) => {\n onChange(newValue, needToPut);\n if (!multiple) {\n onClose?.();\n }\n setForcedState(null);\n },\n [multiple, onChange, onClose, setForcedState]\n );\n\n const clearSelectedValuesAndClose = () => {\n if (useInitialValuesOnClearAction) {\n setInitialValues();\n } else {\n clearSelectedValues();\n }\n onClose?.();\n };\n const clearButton =\n _clearButton &&\n isValidElement<ComponentProps<typeof Button>>(_clearButton) &&\n cloneElement(_clearButton, {\n key: 'clearButton',\n size: 'medium',\n 'data-qa': 'magritte-select-clear-action',\n disabled: loading,\n 'aria-label': _clearButton.props['aria-label'] || clearTrl,\n onClick: () => {\n clearSelectedValuesAndClose();\n onClear?.();\n },\n } as Partial<ComponentProps<typeof Button>>);\n const needAddChangesButton = multiple && _applyChangesButton;\n const applyChangesButton =\n needAddChangesButton &&\n isValidElement<ComponentProps<typeof Button>>(_applyChangesButton) &&\n cloneElement(_applyChangesButton, {\n key: 'applyChangesButton',\n size: 'medium',\n 'data-qa': 'magritte-select-apply',\n disabled: loading,\n 'aria-label': _applyChangesButton.props['aria-label'] || applyTrl,\n onClick: () => {\n setSelectedValues();\n onClose?.();\n onApply?.({\n isMobile: false,\n searchValue,\n optionsCount: optionList.length,\n selectedOptionsCount: valuesArr.length,\n });\n },\n } as Partial<ComponentProps<typeof Button>>);\n\n const emptyOptionsHintVisible =\n optionList.length === 0 &&\n !searchValue &&\n !!emptyOptionsHint &&\n !loading &&\n !searchInProgress &&\n !internalError;\n const emptySearchOptionsHintVisible = !!(\n optionList.length === 0 &&\n searchValue &&\n !!emptyOptionsSearchHint &&\n !loading &&\n !searchInProgress &&\n !internalError\n );\n\n const optionsVisible = !loading && !emptySearchOptionsHintVisible && !emptyOptionsHintVisible && !internalError;\n\n return (\n <>\n <Modal\n {...modalProps}\n size={modalProps?.size || 'small'}\n height={searchable ? 'full-screen' : modalProps?.height}\n ref={optionsListRef}\n visible={visible}\n footer={renderButtonsContainer({\n applyChangesButton,\n clearButton,\n searchValue,\n optionsCount: optionList.length,\n loading,\n isError: Boolean(internalError && innerErrorTrls),\n emptyOptionsHintVisible: emptyOptionsHintVisible || emptySearchOptionsHintVisible,\n })}\n options={\n searchable && (\n <SearchInput\n clearable\n size=\"medium\"\n value={searchValue}\n onChange={setSearchValue}\n data-qa=\"select-modal-search-input\"\n autoComplete=\"off\"\n data-magritte-select-seach-input\n aria-label={searchTrl}\n />\n )\n }\n onClose={() => {\n setForcedState('focus');\n onCloseWithAlertCheck?.();\n }}\n actions={[\n <CrossOutlinedSize24\n key=\"1\"\n data-qa=\"select-modal-close\"\n onClick={onCloseWithAlertCheck}\n aria-label={closeTrl}\n />,\n ]}\n >\n <div className={styles.selectModalWrapper}>\n {internalError && innerErrorTrls && (\n <div className={styles.layerFullHeight}>\n <SelectError innerErrorTrls={innerErrorTrls} reload={reload} />\n </div>\n )}\n {emptyOptionsHintVisible && <div className={styles.layerFullHeight}>{emptyOptionsHint}</div>}\n {emptySearchOptionsHintVisible && (\n <div className={styles.layerFullHeight}>{emptyOptionsSearchHint}</div>\n )}\n {loading && (\n <div className={styles.layerFullHeight}>\n <Loader size={24} />\n </div>\n )}\n {optionsVisible && (\n <div\n className={classnames(styles.selectModal, { [styles.selectModalPlain]: plain })}\n data-qa=\"magritte-select-option-list\"\n role={'listbox'}\n >\n {optionList.map((option) => {\n const checked = Boolean(option.data && getChecked(option.data, values ?? []));\n const disabled = !checked && (option.disabled || isLimitExceeded);\n return (\n <SelectOption\n key={option.data.value}\n name={name}\n checked={checked}\n onChange={handleChange}\n render={renderItem}\n disabled={disabled}\n type={option.type || type}\n plain={!!plain}\n multiple={multiple}\n data-qa={optionDataQa}\n data={option.data}\n />\n );\n })}\n </div>\n )}\n </div>\n </Modal>\n {renderAlertOnExitWithoutSaving?.({\n alertVisible,\n onCloseAlert,\n onClosePickerAndAlert: () => {\n onCloseAlert();\n onClose?.();\n },\n })}\n </>\n );\n};\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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"}
|
package/SelectOption.js
CHANGED
|
@@ -8,7 +8,7 @@ import { CheckableCardElement } from '@hh.ru/magritte-ui-checkable-card/Checkabl
|
|
|
8
8
|
import { Radio, Checkbox } from '@hh.ru/magritte-ui-checkbox-radio';
|
|
9
9
|
import { Text } from '@hh.ru/magritte-ui-typography';
|
|
10
10
|
|
|
11
|
-
var styles = {"select-option-plain":"magritte-select-option-plain___dfz4a_12-
|
|
11
|
+
var styles = {"select-option-plain":"magritte-select-option-plain___dfz4a_12-7-0","selectOptionPlain":"magritte-select-option-plain___dfz4a_12-7-0","select-option-plain_active":"magritte-select-option-plain_active___AQSQS_12-7-0","selectOptionPlainActive":"magritte-select-option-plain_active___AQSQS_12-7-0","select-delimiter":"magritte-select-delimiter___WyeR6_12-7-0","selectDelimiter":"magritte-select-delimiter___WyeR6_12-7-0"};
|
|
12
12
|
|
|
13
13
|
const CheckableComponent = ({ type, value, checked, name, onChange, 'data-qa': dataQa, }) => {
|
|
14
14
|
if (type === 'label') {
|
package/index.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
.magritte-error-container___t9B5w_12-
|
|
1
|
+
.magritte-error-container___t9B5w_12-7-0{
|
|
2
2
|
display:flex;
|
|
3
3
|
flex-direction:column;
|
|
4
4
|
align-items:center;
|
|
@@ -6,13 +6,13 @@
|
|
|
6
6
|
justify-content:center;
|
|
7
7
|
}
|
|
8
8
|
@media (min-width: 1020px){
|
|
9
|
-
body.magritte-old-layout .magritte-error-container___t9B5w_12-
|
|
9
|
+
body.magritte-old-layout .magritte-error-container___t9B5w_12-7-0{
|
|
10
10
|
min-height:320px;
|
|
11
11
|
height:auto;
|
|
12
12
|
}
|
|
13
13
|
}
|
|
14
14
|
@media (min-width: 1024px){
|
|
15
|
-
body:not(.magritte-old-layout) .magritte-error-container___t9B5w_12-
|
|
15
|
+
body:not(.magritte-old-layout) .magritte-error-container___t9B5w_12-7-0{
|
|
16
16
|
min-height:320px;
|
|
17
17
|
height:auto;
|
|
18
18
|
}
|
|
@@ -21,89 +21,89 @@
|
|
|
21
21
|
:root{
|
|
22
22
|
--magritte-color-component-input-stroke-state-accent-focused-accessible-v24-5-0:#0070ff7a;
|
|
23
23
|
}
|
|
24
|
-
.magritte-select-option-plain___dfz4a_12-
|
|
24
|
+
.magritte-select-option-plain___dfz4a_12-7-0{
|
|
25
25
|
border-radius:8px;
|
|
26
26
|
}
|
|
27
|
-
.magritte-select-option-plain___dfz4a_12-
|
|
27
|
+
.magritte-select-option-plain___dfz4a_12-7-0.focus-visible{
|
|
28
28
|
outline:var(--magritte-color-component-input-stroke-state-accent-focused-accessible-v24-5-0) solid 4px;
|
|
29
29
|
}
|
|
30
|
-
.magritte-select-option-plain___dfz4a_12-
|
|
30
|
+
.magritte-select-option-plain___dfz4a_12-7-0:hover{
|
|
31
31
|
cursor:default;
|
|
32
32
|
}
|
|
33
|
-
.magritte-select-option-plain_active___AQSQS_12-
|
|
33
|
+
.magritte-select-option-plain_active___AQSQS_12-7-0:hover{
|
|
34
34
|
cursor:pointer;
|
|
35
35
|
}
|
|
36
|
-
.magritte-select-delimiter___WyeR6_12-
|
|
36
|
+
.magritte-select-delimiter___WyeR6_12-7-0{
|
|
37
37
|
padding-left:16px;
|
|
38
38
|
padding-top:12px;
|
|
39
39
|
}
|
|
40
40
|
|
|
41
|
-
.magritte-select-bottom-sheet___1RZDJ_12-
|
|
41
|
+
.magritte-select-bottom-sheet___1RZDJ_12-7-0{
|
|
42
42
|
display:flex;
|
|
43
43
|
flex-direction:column;
|
|
44
44
|
padding:0 16px;
|
|
45
45
|
padding-bottom:16px;
|
|
46
46
|
}
|
|
47
|
-
.magritte-select-bottom-sheet_checkbox___hwTgo_12-
|
|
48
|
-
.magritte-select-bottom-sheet_radio___qvFFV_12-
|
|
47
|
+
.magritte-select-bottom-sheet_checkbox___hwTgo_12-7-0,
|
|
48
|
+
.magritte-select-bottom-sheet_radio___qvFFV_12-7-0{
|
|
49
49
|
gap:12px;
|
|
50
50
|
}
|
|
51
|
-
.magritte-select-bottom-sheet_without-header___KOKVh_12-
|
|
51
|
+
.magritte-select-bottom-sheet_without-header___KOKVh_12-7-0{
|
|
52
52
|
padding-top:16px;
|
|
53
53
|
}
|
|
54
|
-
.magritte-full-screen-placeholder___zPC8k_12-
|
|
54
|
+
.magritte-full-screen-placeholder___zPC8k_12-7-0{
|
|
55
55
|
display:flex;
|
|
56
56
|
flex-direction:column;
|
|
57
57
|
align-items:center;
|
|
58
58
|
height:100%;
|
|
59
59
|
justify-content:center;
|
|
60
60
|
}
|
|
61
|
-
.magritte-error-wrapper___P7jYg_12-
|
|
61
|
+
.magritte-error-wrapper___P7jYg_12-7-0{
|
|
62
62
|
height:100%;
|
|
63
63
|
}
|
|
64
64
|
|
|
65
|
-
.magritte-select-drop-container-wrapper___OHM0q_12-
|
|
65
|
+
.magritte-select-drop-container-wrapper___OHM0q_12-7-0{
|
|
66
66
|
display:flex;
|
|
67
67
|
flex-direction:column;
|
|
68
68
|
}
|
|
69
|
-
.magritte-select-drop-container___hee1p_12-
|
|
69
|
+
.magritte-select-drop-container___hee1p_12-7-0{
|
|
70
70
|
display:flex;
|
|
71
71
|
flex-direction:column;
|
|
72
72
|
padding:12px;
|
|
73
73
|
margin:calc(-1 * 12px);
|
|
74
74
|
}
|
|
75
|
-
.magritte-select-drop-container_plain___766zl_12-
|
|
75
|
+
.magritte-select-drop-container_plain___766zl_12-7-0{
|
|
76
76
|
padding:24px;
|
|
77
77
|
margin:calc(-1 * 24px);
|
|
78
78
|
}
|
|
79
|
-
.magritte-select-drop-container_with-footer___6wp-L_12-
|
|
79
|
+
.magritte-select-drop-container_with-footer___6wp-L_12-7-0{
|
|
80
80
|
margin-bottom:0;
|
|
81
81
|
padding-bottom:0;
|
|
82
82
|
}
|
|
83
|
-
.magritte-select-drop___jn4O-_12-
|
|
83
|
+
.magritte-select-drop___jn4O-_12-7-0{
|
|
84
84
|
display:flex;
|
|
85
85
|
flex-direction:column;
|
|
86
86
|
gap:8px;
|
|
87
87
|
}
|
|
88
|
-
.magritte-select-drop-header___fMmio_12-
|
|
88
|
+
.magritte-select-drop-header___fMmio_12-7-0{
|
|
89
89
|
display:flex;
|
|
90
90
|
flex-direction:column;
|
|
91
91
|
margin-bottom:8px;
|
|
92
92
|
}
|
|
93
|
-
.magritte-select-drop_plain___VL8Fz_12-
|
|
93
|
+
.magritte-select-drop_plain___VL8Fz_12-7-0{
|
|
94
94
|
gap:16px;
|
|
95
95
|
}
|
|
96
|
-
.magritte-label-option___2N7t9_12-
|
|
96
|
+
.magritte-label-option___2N7t9_12-7-0{
|
|
97
97
|
display:flex;
|
|
98
98
|
justify-content:center;
|
|
99
99
|
}
|
|
100
|
-
.magritte-loading___AMiuq_12-
|
|
100
|
+
.magritte-loading___AMiuq_12-7-0{
|
|
101
101
|
display:flex;
|
|
102
102
|
align-items:center;
|
|
103
103
|
height:150px;
|
|
104
104
|
justify-content:center;
|
|
105
105
|
}
|
|
106
|
-
.magritte-hint___6qaFl_12-
|
|
106
|
+
.magritte-hint___6qaFl_12-7-0{
|
|
107
107
|
display:flex;
|
|
108
108
|
flex-direction:column;
|
|
109
109
|
align-items:center;
|
|
@@ -111,24 +111,24 @@
|
|
|
111
111
|
justify-content:center;
|
|
112
112
|
}
|
|
113
113
|
|
|
114
|
-
.magritte-select-modal-wrapper___5BhtC_12-
|
|
114
|
+
.magritte-select-modal-wrapper___5BhtC_12-7-0{
|
|
115
115
|
display:flex;
|
|
116
116
|
flex-direction:column;
|
|
117
117
|
flex-grow:1;
|
|
118
118
|
}
|
|
119
|
-
.magritte-select-modal___f9wc6_12-
|
|
119
|
+
.magritte-select-modal___f9wc6_12-7-0{
|
|
120
120
|
display:flex;
|
|
121
121
|
flex-direction:column;
|
|
122
122
|
gap:12px;
|
|
123
123
|
}
|
|
124
|
-
.magritte-select-modal_plain___0rP39_12-
|
|
124
|
+
.magritte-select-modal_plain___0rP39_12-7-0{
|
|
125
125
|
gap:0;
|
|
126
126
|
}
|
|
127
|
-
.magritte-label-option___kFAuR_12-
|
|
127
|
+
.magritte-label-option___kFAuR_12-7-0{
|
|
128
128
|
display:flex;
|
|
129
129
|
justify-content:center;
|
|
130
130
|
}
|
|
131
|
-
.magritte-layer-full-height___cJX-K_12-
|
|
131
|
+
.magritte-layer-full-height___cJX-K_12-7-0{
|
|
132
132
|
display:flex;
|
|
133
133
|
flex-direction:column;
|
|
134
134
|
align-items:center;
|
|
@@ -155,14 +155,14 @@
|
|
|
155
155
|
--magritte-color-background-accent-secondary-v24-5-0:#F1F4F7;
|
|
156
156
|
--magritte-color-icon-accent-v24-5-0:#7195AF;
|
|
157
157
|
}
|
|
158
|
-
.magritte-select-empty-hint___B39XJ_12-
|
|
158
|
+
.magritte-select-empty-hint___B39XJ_12-7-0{
|
|
159
159
|
display:flex;
|
|
160
160
|
flex-direction:column;
|
|
161
161
|
justify-content:center;
|
|
162
162
|
align-content:center;
|
|
163
163
|
align-items:center;
|
|
164
164
|
}
|
|
165
|
-
.magritte-icon___F0GQx_12-
|
|
165
|
+
.magritte-icon___F0GQx_12-7-0{
|
|
166
166
|
display:flex;
|
|
167
167
|
align-items:center;
|
|
168
168
|
justify-content:center;
|
|
@@ -170,11 +170,11 @@
|
|
|
170
170
|
height:48px;
|
|
171
171
|
border-radius:50%;
|
|
172
172
|
}
|
|
173
|
-
.magritte-icon-init___GWK-V_12-
|
|
173
|
+
.magritte-icon-init___GWK-V_12-7-0{
|
|
174
174
|
background-color:var(--magritte-color-background-accent-secondary-v24-5-0);
|
|
175
175
|
--magritte-ui-icon-color-override:var(--magritte-color-icon-accent-v24-5-0);
|
|
176
176
|
}
|
|
177
|
-
.magritte-icon-search___ZsqO-_12-
|
|
177
|
+
.magritte-icon-search___ZsqO-_12-7-0{
|
|
178
178
|
background-color:var(--magritte-color-background-secondary-v24-5-0);
|
|
179
179
|
--magritte-ui-icon-color-override:var(--magritte-color-icon-tertiary-v24-5-0);
|
|
180
180
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@hh.ru/magritte-ui-select",
|
|
3
|
-
"version": "12.
|
|
3
|
+
"version": "12.7.0",
|
|
4
4
|
"main": "index.js",
|
|
5
5
|
"types": "index.d.ts",
|
|
6
6
|
"sideEffects": [
|
|
@@ -37,7 +37,6 @@
|
|
|
37
37
|
"@hh.ru/magritte-ui-bottom-sheet": "9.3.11",
|
|
38
38
|
"@hh.ru/magritte-ui-breakpoint": "6.0.8",
|
|
39
39
|
"@hh.ru/magritte-ui-button": "7.2.0",
|
|
40
|
-
"@hh.ru/magritte-ui-button-stack": "3.0.8",
|
|
41
40
|
"@hh.ru/magritte-ui-cell": "7.2.12",
|
|
42
41
|
"@hh.ru/magritte-ui-checkable-card": "5.0.17",
|
|
43
42
|
"@hh.ru/magritte-ui-checkbox-radio": "4.1.10",
|
|
@@ -53,5 +52,5 @@
|
|
|
53
52
|
"@hh.ru/magritte-ui-trigger": "4.3.4",
|
|
54
53
|
"@hh.ru/magritte-ui-typography": "5.0.1"
|
|
55
54
|
},
|
|
56
|
-
"gitHead": "
|
|
55
|
+
"gitHead": "39bc57d1e73f03a4a6dd01e6a313f819d2922fe3"
|
|
57
56
|
}
|
package/types.d.ts
CHANGED
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { ComponentProps, ReactElement, ReactNode, Dispatch, SetStateAction, RefObject, RefCallback, KeyboardEvent, Ref } from 'react';
|
|
2
2
|
import { DataProvider, StaticDataFetcherItem } from '@hh.ru/magritte-common-data-provider';
|
|
3
3
|
import { BottomSheet, BottomSheetHeight } from '@hh.ru/magritte-ui-bottom-sheet';
|
|
4
|
-
import { ButtonElement } from '@hh.ru/magritte-ui-button-stack';
|
|
5
4
|
import { Drop } from '@hh.ru/magritte-ui-drop';
|
|
6
5
|
import { ModalProps } from '@hh.ru/magritte-ui-modal';
|
|
7
6
|
import { HeadingElement } from '@hh.ru/magritte-ui-title/types';
|
|
@@ -51,9 +50,9 @@ export interface CheckableComponentProps<DataType extends StaticDataFetcherItem>
|
|
|
51
50
|
}
|
|
52
51
|
export interface SelectButtons {
|
|
53
52
|
/** Кнопка сброса values */
|
|
54
|
-
clearButton?:
|
|
53
|
+
clearButton?: ReactNode;
|
|
55
54
|
/** Кнопка применения values */
|
|
56
|
-
applyChangesButton?:
|
|
55
|
+
applyChangesButton?: ReactNode;
|
|
57
56
|
}
|
|
58
57
|
interface RenderButtonsContainerPropsHelper {
|
|
59
58
|
loading?: boolean;
|
|
@@ -206,7 +205,7 @@ type ErrorState = {
|
|
|
206
205
|
/** Текст сообщения об ошибке */
|
|
207
206
|
placeholder: ReactNode;
|
|
208
207
|
/** Кнопка перезагрузки при ошибке */
|
|
209
|
-
resetButton:
|
|
208
|
+
resetButton: ReactNode;
|
|
210
209
|
};
|
|
211
210
|
type ExternalSelectBottomSheetProps = {
|
|
212
211
|
/** Состояние ошибки */
|