@hh.ru/magritte-ui-select 12.9.4 → 12.9.6

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.
Files changed (12) hide show
  1. package/SelectBottomSheet.js +1 -1
  2. package/SelectDrop.js +1 -1
  3. package/SelectEmptyHint.js +1 -1
  4. package/SelectError.js +1 -1
  5. package/SelectModal.d.ts +1 -1
  6. package/SelectModal.js +6 -7
  7. package/SelectModal.js.map +1 -1
  8. package/SelectOption.js +1 -1
  9. package/index.css +49 -49
  10. package/index.js +1 -1
  11. package/package.json +19 -19
  12. package/types.d.ts +26 -2
package/SelectBottomSheet.js CHANGED
@@ -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-9-4","selectBottomSheet":"magritte-select-bottom-sheet___1RZDJ_12-9-4","select-bottom-sheet_checkbox":"magritte-select-bottom-sheet_checkbox___hwTgo_12-9-4","selectBottomSheetCheckbox":"magritte-select-bottom-sheet_checkbox___hwTgo_12-9-4","select-bottom-sheet_radio":"magritte-select-bottom-sheet_radio___qvFFV_12-9-4","selectBottomSheetRadio":"magritte-select-bottom-sheet_radio___qvFFV_12-9-4","select-bottom-sheet_without-header":"magritte-select-bottom-sheet_without-header___KOKVh_12-9-4","selectBottomSheetWithoutHeader":"magritte-select-bottom-sheet_without-header___KOKVh_12-9-4","full-screen-placeholder":"magritte-full-screen-placeholder___zPC8k_12-9-4","fullScreenPlaceholder":"magritte-full-screen-placeholder___zPC8k_12-9-4","error-wrapper":"magritte-error-wrapper___P7jYg_12-9-4","errorWrapper":"magritte-error-wrapper___P7jYg_12-9-4"};
28
+ var styles = {"select-bottom-sheet":"magritte-select-bottom-sheet___1RZDJ_12-9-6","selectBottomSheet":"magritte-select-bottom-sheet___1RZDJ_12-9-6","select-bottom-sheet_checkbox":"magritte-select-bottom-sheet_checkbox___hwTgo_12-9-6","selectBottomSheetCheckbox":"magritte-select-bottom-sheet_checkbox___hwTgo_12-9-6","select-bottom-sheet_radio":"magritte-select-bottom-sheet_radio___qvFFV_12-9-6","selectBottomSheetRadio":"magritte-select-bottom-sheet_radio___qvFFV_12-9-6","select-bottom-sheet_without-header":"magritte-select-bottom-sheet_without-header___KOKVh_12-9-6","selectBottomSheetWithoutHeader":"magritte-select-bottom-sheet_without-header___KOKVh_12-9-6","full-screen-placeholder":"magritte-full-screen-placeholder___zPC8k_12-9-6","fullScreenPlaceholder":"magritte-full-screen-placeholder___zPC8k_12-9-6","error-wrapper":"magritte-error-wrapper___P7jYg_12-9-6","errorWrapper":"magritte-error-wrapper___P7jYg_12-9-6"};
29
29
 
30
30
  const SelectOptionDefault = ({ data, input, type, checked, plain, }) => {
31
31
  if (type === 'delimiter') {
package/SelectDrop.js CHANGED
@@ -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-9-4","selectDropContainerWrapper":"magritte-select-drop-container-wrapper___OHM0q_12-9-4","select-drop-container":"magritte-select-drop-container___hee1p_12-9-4","selectDropContainer":"magritte-select-drop-container___hee1p_12-9-4","select-drop-container_plain":"magritte-select-drop-container_plain___766zl_12-9-4","selectDropContainerPlain":"magritte-select-drop-container_plain___766zl_12-9-4","select-drop-container_with-footer":"magritte-select-drop-container_with-footer___6wp-L_12-9-4","selectDropContainerWithFooter":"magritte-select-drop-container_with-footer___6wp-L_12-9-4","select-drop":"magritte-select-drop___jn4O-_12-9-4","selectDrop":"magritte-select-drop___jn4O-_12-9-4","select-drop-header":"magritte-select-drop-header___fMmio_12-9-4","selectDropHeader":"magritte-select-drop-header___fMmio_12-9-4","select-drop_plain":"magritte-select-drop_plain___VL8Fz_12-9-4","selectDropPlain":"magritte-select-drop_plain___VL8Fz_12-9-4","label-option":"magritte-label-option___2N7t9_12-9-4","labelOption":"magritte-label-option___2N7t9_12-9-4","loading":"magritte-loading___AMiuq_12-9-4","hint":"magritte-hint___6qaFl_12-9-4"};
25
+ var styles = {"select-drop-container-wrapper":"magritte-select-drop-container-wrapper___OHM0q_12-9-6","selectDropContainerWrapper":"magritte-select-drop-container-wrapper___OHM0q_12-9-6","select-drop-container":"magritte-select-drop-container___hee1p_12-9-6","selectDropContainer":"magritte-select-drop-container___hee1p_12-9-6","select-drop-container_plain":"magritte-select-drop-container_plain___766zl_12-9-6","selectDropContainerPlain":"magritte-select-drop-container_plain___766zl_12-9-6","select-drop-container_with-footer":"magritte-select-drop-container_with-footer___6wp-L_12-9-6","selectDropContainerWithFooter":"magritte-select-drop-container_with-footer___6wp-L_12-9-6","select-drop":"magritte-select-drop___jn4O-_12-9-6","selectDrop":"magritte-select-drop___jn4O-_12-9-6","select-drop-header":"magritte-select-drop-header___fMmio_12-9-6","selectDropHeader":"magritte-select-drop-header___fMmio_12-9-6","select-drop_plain":"magritte-select-drop_plain___VL8Fz_12-9-6","selectDropPlain":"magritte-select-drop_plain___VL8Fz_12-9-6","label-option":"magritte-label-option___2N7t9_12-9-6","labelOption":"magritte-label-option___2N7t9_12-9-6","loading":"magritte-loading___AMiuq_12-9-6","hint":"magritte-hint___6qaFl_12-9-6"};
26
26
 
27
27
  const SelectOptionDefault = ({ data, input, type, plain, checked, }) => {
28
28
  if (type === 'delimiter') {
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-4","selectEmptyHint":"magritte-select-empty-hint___B39XJ_12-9-4","icon":"magritte-icon___F0GQx_12-9-4","icon-init":"magritte-icon-init___GWK-V_12-9-4","iconInit":"magritte-icon-init___GWK-V_12-9-4","icon-search":"magritte-icon-search___ZsqO-_12-9-4","iconSearch":"magritte-icon-search___ZsqO-_12-9-4"};
9
+ var styles = {"select-empty-hint":"magritte-select-empty-hint___B39XJ_12-9-6","selectEmptyHint":"magritte-select-empty-hint___B39XJ_12-9-6","icon":"magritte-icon___F0GQx_12-9-6","icon-init":"magritte-icon-init___GWK-V_12-9-6","iconInit":"magritte-icon-init___GWK-V_12-9-6","icon-search":"magritte-icon-search___ZsqO-_12-9-6","iconSearch":"magritte-icon-search___ZsqO-_12-9-6"};
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-9-4","errorContainer":"magritte-error-container___t9B5w_12-9-4"};
10
+ var styles = {"error-container":"magritte-error-container___t9B5w_12-9-6","errorContainer":"magritte-error-container___t9B5w_12-9-6"};
11
11
 
12
12
  const SelectError = ({ innerErrorTrls, reload, }) => {
13
13
  const { isMobile } = useBreakpoint();
package/SelectModal.d.ts CHANGED
@@ -1,4 +1,4 @@
1
1
  import { ReactElement } from 'react';
2
2
  import { StaticDataFetcherItem } from '@hh.ru/magritte-common-data-provider';
3
3
  import { SelectModalProps } from '@hh.ru/magritte-ui-select/types';
4
- export declare const SelectModal: <MultipleType extends boolean, DataType extends StaticDataFetcherItem>({ type, name, multiple, applyChangesButton: _applyChangesButton, clearButton: _clearButton, useInitialValuesOnClearAction, loading, renderItem, renderButtonsContainer, visible, optionList, optionsListRef, searchValue, setSearchValue, value: values, onChange, onClose, clearSelectedValuesOrUseInitialValues, isLimitExceeded, plain, searchable, setForcedState, setSelectedValues, emptyOptionsHint, emptyOptionsSearchHint, onApply, onClear, searchInProgress, internalError, reload, innerErrorTrls, optionDataQa, renderAlertOnExitWithoutSaving, initialValuesOnOpening, internalLoading, hasChangesApplyButton, ...modalProps }: SelectModalProps<MultipleType, DataType>) => ReactElement;
4
+ export declare const SelectModal: <MultipleType extends boolean, DataType extends StaticDataFetcherItem>({ type, name, multiple, applyChangesButton: _applyChangesButton, clearButton: _clearButton, useInitialValuesOnClearAction, loading, renderItem, renderButtonsContainer, visible, optionList, optionsListRef, searchValue, setSearchValue, value: values, onChange, onClose, clearSelectedValuesOrUseInitialValues, isLimitExceeded, plain, searchable, setForcedState, setSelectedValues, emptyOptionsHint, emptyOptionsSearchHint, onApply, onClear, searchInProgress, internalError, reload, innerErrorTrls, optionDataQa, renderAlertOnExitWithoutSaving, initialValuesOnOpening, internalLoading, hasChangesApplyButton, title, titleSize, titleAlignment, titleElement, titleMaxLines, titleStyle, titleDescription, titleDescriptionMaxLines, titleDescriptionStyle, ...modalProps }: SelectModalProps<MultipleType, DataType>) => ReactElement;
package/SelectModal.js CHANGED
@@ -9,22 +9,23 @@ import { CrossOutlinedSize24, CheckOutlinedSize24 } from '@hh.ru/magritte-ui-ico
9
9
  import { SearchInput } from '@hh.ru/magritte-ui-input';
10
10
  import { Loader } from '@hh.ru/magritte-ui-loader';
11
11
  import { Modal } from '@hh.ru/magritte-ui-modal';
12
+ import { NavBar } from '@hh.ru/magritte-ui-nav-bar';
12
13
  import { SelectError } from './SelectError.js';
13
14
  import { SelectOption } from './SelectOption.js';
14
15
  import { getChecked } from './getChecked.js';
15
16
  import { isArraysEquals } from './isArraysEquals.js';
17
+ import { Title } from '@hh.ru/magritte-ui-title';
16
18
  import '@hh.ru/magritte-ui-breakpoint';
17
19
  import '@hh.ru/magritte-ui-button';
18
20
  import '@hh.ru/magritte-ui-icon/variants/icon';
19
21
  import '@hh.ru/magritte-ui-spacing';
20
- import '@hh.ru/magritte-ui-title';
21
22
  import '@hh.ru/magritte-ui-typography';
22
23
  import '@hh.ru/magritte-common-keyboard';
23
24
  import '@hh.ru/magritte-common-use-disabled';
24
25
  import '@hh.ru/magritte-ui-checkable-card/CheckableCardElement';
25
26
  import '@hh.ru/magritte-ui-checkbox-radio';
26
27
 
27
- var styles = {"select-modal-wrapper":"magritte-select-modal-wrapper___5BhtC_12-9-4","selectModalWrapper":"magritte-select-modal-wrapper___5BhtC_12-9-4","select-modal":"magritte-select-modal___f9wc6_12-9-4","selectModal":"magritte-select-modal___f9wc6_12-9-4","select-modal_plain":"magritte-select-modal_plain___0rP39_12-9-4","selectModalPlain":"magritte-select-modal_plain___0rP39_12-9-4","label-option":"magritte-label-option___kFAuR_12-9-4","labelOption":"magritte-label-option___kFAuR_12-9-4","layer-full-height":"magritte-layer-full-height___cJX-K_12-9-4","layerFullHeight":"magritte-layer-full-height___cJX-K_12-9-4"};
28
+ var styles = {"select-modal-wrapper":"magritte-select-modal-wrapper___5BhtC_12-9-6","selectModalWrapper":"magritte-select-modal-wrapper___5BhtC_12-9-6","select-modal":"magritte-select-modal___f9wc6_12-9-6","selectModal":"magritte-select-modal___f9wc6_12-9-6","select-modal_plain":"magritte-select-modal_plain___0rP39_12-9-6","selectModalPlain":"magritte-select-modal_plain___0rP39_12-9-6","label-option":"magritte-label-option___kFAuR_12-9-6","labelOption":"magritte-label-option___kFAuR_12-9-6","layer-full-height":"magritte-layer-full-height___cJX-K_12-9-6","layerFullHeight":"magritte-layer-full-height___cJX-K_12-9-6"};
28
29
 
29
30
  const SelectOptionDefault = ({ data, input, type, plain, checked, }) => {
30
31
  if (type === 'delimiter') {
@@ -45,7 +46,7 @@ const RenderButtonsContainerDefault = ({ applyChangesButton, clearButton, isErro
45
46
  }
46
47
  return jsx(ActionBar, { secondaryActions: clearButton, primaryActions: applyChangesButton });
47
48
  };
48
- const SelectModal = ({ type, name, multiple, applyChangesButton: _applyChangesButton, clearButton: _clearButton, useInitialValuesOnClearAction, loading, renderItem = SelectOptionDefault, renderButtonsContainer = RenderButtonsContainerDefault, visible, optionList, optionsListRef, searchValue, setSearchValue, value: values, onChange, onClose, clearSelectedValuesOrUseInitialValues, isLimitExceeded, plain, searchable, setForcedState, setSelectedValues, emptyOptionsHint, emptyOptionsSearchHint, onApply, onClear, searchInProgress, internalError, reload, innerErrorTrls, optionDataQa, renderAlertOnExitWithoutSaving, initialValuesOnOpening, internalLoading, hasChangesApplyButton, ...modalProps }) => {
49
+ const SelectModal = ({ type, name, multiple, applyChangesButton: _applyChangesButton, clearButton: _clearButton, useInitialValuesOnClearAction, loading, renderItem = SelectOptionDefault, renderButtonsContainer = RenderButtonsContainerDefault, visible, optionList, optionsListRef, searchValue, setSearchValue, value: values, onChange, onClose, clearSelectedValuesOrUseInitialValues, isLimitExceeded, plain, searchable, setForcedState, setSelectedValues, emptyOptionsHint, emptyOptionsSearchHint, onApply, onClear, searchInProgress, internalError, reload, innerErrorTrls, optionDataQa, renderAlertOnExitWithoutSaving, initialValuesOnOpening, internalLoading, hasChangesApplyButton, title, titleSize = 'large', titleAlignment = 'left', titleElement = 'h2', titleMaxLines, titleStyle = 'primary', titleDescription, titleDescriptionMaxLines, titleDescriptionStyle = 'primary', ...modalProps }) => {
49
50
  const valuesArr = Array.isArray(values) ? values : [values];
50
51
  const [alertVisible, setAlertVisible] = useState(false);
51
52
  const onCloseAlert = () => setAlertVisible(false);
@@ -133,12 +134,10 @@ const SelectModal = ({ type, name, multiple, applyChangesButton: _applyChangesBu
133
134
  loading,
134
135
  isError: Boolean(internalError && innerErrorTrls),
135
136
  emptyOptionsHintVisible: emptyOptionsHintVisible || emptySearchOptionsHintVisible,
136
- }), options: searchable && (jsx(SearchInput, { clearable: true, size: "medium", value: searchValue, onChange: setSearchValue, "data-qa": "select-modal-search-input", autoComplete: "off", "data-magritte-select-seach-input": true, "aria-label": searchTrl })), onClose: () => {
137
+ }), onClose: () => {
137
138
  setForcedState('focus');
138
139
  onCloseWithAlertCheck?.();
139
- }, actions: [
140
- jsx(CrossOutlinedSize24, { "data-qa": "select-modal-close", onClick: onCloseWithAlertCheck, "aria-label": closeTrl }, "1"),
141
- ], children: jsxs("div", { className: styles.selectModalWrapper, children: [internalError && innerErrorTrls && (jsx("div", { className: styles.layerFullHeight, children: jsx(SelectError, { innerErrorTrls: innerErrorTrls, reload: reload }) })), emptyOptionsHintVisible && jsx("div", { className: styles.layerFullHeight, children: emptyOptionsHint }), emptySearchOptionsHintVisible && (jsx("div", { className: styles.layerFullHeight, children: emptyOptionsSearchHint })), loading && (jsx("div", { className: styles.layerFullHeight, children: jsx(Loader, { size: 24 }) })), optionsVisible && (jsx("div", { className: classnames(styles.selectModal, { [styles.selectModalPlain]: plain }), "data-qa": "magritte-select-option-list", role: 'listbox', children: optionList.map((option) => {
140
+ }, header: jsxs(NavBar, { children: [jsx(NavBar.Pane, { children: jsx(NavBar.Actions, { centered: titleAlignment === 'center', right: jsx(CrossOutlinedSize24, { "data-qa": "select-modal-close", onClick: onCloseWithAlertCheck, "aria-label": closeTrl }), children: title && (jsx(Title, { Element: titleElement, alignment: titleAlignment, maxLines: titleMaxLines, size: titleSize, style: titleStyle, description: titleDescription, descriptionMaxLines: titleDescriptionMaxLines, descriptionStyle: titleDescriptionStyle, children: title })) }) }), searchable && (jsx(NavBar.Pane, { children: jsx(SearchInput, { clearable: true, size: "medium", value: searchValue, onChange: setSearchValue, "data-qa": "select-modal-search-input", autoComplete: "off", "data-magritte-select-seach-input": true, "aria-label": searchTrl }) }))] }), children: jsxs("div", { className: styles.selectModalWrapper, children: [internalError && innerErrorTrls && (jsx("div", { className: styles.layerFullHeight, children: jsx(SelectError, { innerErrorTrls: innerErrorTrls, reload: reload }) })), emptyOptionsHintVisible && jsx("div", { className: styles.layerFullHeight, children: emptyOptionsHint }), emptySearchOptionsHintVisible && (jsx("div", { className: styles.layerFullHeight, children: emptyOptionsSearchHint })), loading && (jsx("div", { className: styles.layerFullHeight, children: jsx(Loader, { size: 24 }) })), optionsVisible && (jsx("div", { className: classnames(styles.selectModal, { [styles.selectModalPlain]: plain }), "data-qa": "magritte-select-option-list", role: 'listbox', children: optionList.map((option) => {
142
141
  const checked = Boolean(option.data && getChecked(option.data, values ?? []));
143
142
  const disabled = !checked && (option.disabled || isLimitExceeded);
144
143
  return (jsx(SelectOption, { name: name, checked: checked, onChange: handleChange, render: renderItem, disabled: disabled, type: option.type || type, plain: !!plain, multiple: multiple, "data-qa": optionDataQa, data: option.data }, option.data.value));
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, 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 clearSelectedValuesOrUseInitialValues,\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 hasChangesApplyButton,\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 && !hasChangesApplyButton) {\n onClose?.();\n }\n setForcedState(null);\n },\n [multiple, onChange, onClose, setForcedState, hasChangesApplyButton]\n );\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 clearSelectedValuesOrUseInitialValues();\n },\n } as Partial<ComponentProps<typeof Button>>);\n const applyChangesButton =\n hasChangesApplyButton &&\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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"}
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 { NavBar } from '@hh.ru/magritte-ui-nav-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 SelectModalProps,\n RenderOptionTypeProps,\n RenderButtonsContainerProps,\n} from '@hh.ru/magritte-ui-select/types';\nimport { Title } from '@hh.ru/magritte-ui-title';\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 clearSelectedValuesOrUseInitialValues,\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 hasChangesApplyButton,\n title,\n titleSize = 'large',\n titleAlignment = 'left',\n titleElement = 'h2',\n titleMaxLines,\n titleStyle = 'primary',\n titleDescription,\n titleDescriptionMaxLines,\n titleDescriptionStyle = 'primary',\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 && !hasChangesApplyButton) {\n onClose?.();\n }\n setForcedState(null);\n },\n [multiple, onChange, onClose, setForcedState, hasChangesApplyButton]\n );\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 clearSelectedValuesOrUseInitialValues();\n },\n } as Partial<ComponentProps<typeof Button>>);\n const applyChangesButton =\n hasChangesApplyButton &&\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 onClose={() => {\n setForcedState('focus');\n onCloseWithAlertCheck?.();\n }}\n header={\n <NavBar>\n <NavBar.Pane>\n <NavBar.Actions\n centered={titleAlignment === 'center'}\n right={\n <CrossOutlinedSize24\n data-qa=\"select-modal-close\"\n onClick={onCloseWithAlertCheck}\n aria-label={closeTrl}\n />\n }\n >\n {title && (\n <Title\n Element={titleElement}\n alignment={titleAlignment}\n maxLines={titleMaxLines}\n size={titleSize}\n style={titleStyle}\n description={titleDescription}\n descriptionMaxLines={titleDescriptionMaxLines}\n descriptionStyle={titleDescriptionStyle}\n >\n {title}\n </Title>\n )}\n </NavBar.Actions>\n </NavBar.Pane>\n {searchable && (\n <NavBar.Pane>\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 </NavBar.Pane>\n )}\n </NavBar>\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-9-4","selectOptionPlain":"magritte-select-option-plain___dfz4a_12-9-4","select-option-plain_active":"magritte-select-option-plain_active___AQSQS_12-9-4","selectOptionPlainActive":"magritte-select-option-plain_active___AQSQS_12-9-4","select-delimiter":"magritte-select-delimiter___WyeR6_12-9-4","selectDelimiter":"magritte-select-delimiter___WyeR6_12-9-4"};
11
+ var styles = {"select-option-plain":"magritte-select-option-plain___dfz4a_12-9-6","selectOptionPlain":"magritte-select-option-plain___dfz4a_12-9-6","select-option-plain_active":"magritte-select-option-plain_active___AQSQS_12-9-6","selectOptionPlainActive":"magritte-select-option-plain_active___AQSQS_12-9-6","select-delimiter":"magritte-select-delimiter___WyeR6_12-9-6","selectDelimiter":"magritte-select-delimiter___WyeR6_12-9-6"};
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-9-4{
1
+ .magritte-error-container___t9B5w_12-9-6{
2
2
  display:flex;
3
3
  flex-direction:column;
4
4
  align-items:center;
@@ -6,104 +6,104 @@
6
6
  justify-content:center;
7
7
  }
8
8
  @media (min-width: 1020px){
9
- body.magritte-old-layout .magritte-error-container___t9B5w_12-9-4{
9
+ body.magritte-old-layout .magritte-error-container___t9B5w_12-9-6{
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-9-4{
15
+ body:not(.magritte-old-layout) .magritte-error-container___t9B5w_12-9-6{
16
16
  min-height:320px;
17
17
  height:auto;
18
18
  }
19
19
  }
20
20
 
21
21
  :root{
22
- --magritte-color-component-input-stroke-state-accent-focused-accessible-v24-7-1:#0070ff7a;
22
+ --magritte-color-component-input-stroke-state-accent-focused-accessible-v24-7-2:#0070ff7a;
23
23
  }
24
- .magritte-select-option-plain___dfz4a_12-9-4{
24
+ .magritte-select-option-plain___dfz4a_12-9-6{
25
25
  border-radius:8px;
26
26
  }
27
- .magritte-select-option-plain___dfz4a_12-9-4.focus-visible{
28
- outline:var(--magritte-color-component-input-stroke-state-accent-focused-accessible-v24-7-1) solid 4px;
27
+ .magritte-select-option-plain___dfz4a_12-9-6.focus-visible{
28
+ outline:var(--magritte-color-component-input-stroke-state-accent-focused-accessible-v24-7-2) solid 4px;
29
29
  }
30
- .magritte-select-option-plain___dfz4a_12-9-4:hover{
30
+ .magritte-select-option-plain___dfz4a_12-9-6:hover{
31
31
  cursor:default;
32
32
  }
33
- .magritte-select-option-plain_active___AQSQS_12-9-4:hover{
33
+ .magritte-select-option-plain_active___AQSQS_12-9-6:hover{
34
34
  cursor:pointer;
35
35
  }
36
- .magritte-select-delimiter___WyeR6_12-9-4{
36
+ .magritte-select-delimiter___WyeR6_12-9-6{
37
37
  padding-left:16px;
38
38
  padding-top:12px;
39
39
  }
40
40
 
41
- .magritte-select-bottom-sheet___1RZDJ_12-9-4{
41
+ .magritte-select-bottom-sheet___1RZDJ_12-9-6{
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-9-4,
48
- .magritte-select-bottom-sheet_radio___qvFFV_12-9-4{
47
+ .magritte-select-bottom-sheet_checkbox___hwTgo_12-9-6,
48
+ .magritte-select-bottom-sheet_radio___qvFFV_12-9-6{
49
49
  gap:12px;
50
50
  }
51
- .magritte-select-bottom-sheet_without-header___KOKVh_12-9-4{
51
+ .magritte-select-bottom-sheet_without-header___KOKVh_12-9-6{
52
52
  padding-top:16px;
53
53
  }
54
- .magritte-full-screen-placeholder___zPC8k_12-9-4{
54
+ .magritte-full-screen-placeholder___zPC8k_12-9-6{
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-9-4{
61
+ .magritte-error-wrapper___P7jYg_12-9-6{
62
62
  height:100%;
63
63
  }
64
64
 
65
- .magritte-select-drop-container-wrapper___OHM0q_12-9-4{
65
+ .magritte-select-drop-container-wrapper___OHM0q_12-9-6{
66
66
  display:flex;
67
67
  flex-direction:column;
68
68
  }
69
- .magritte-select-drop-container___hee1p_12-9-4{
69
+ .magritte-select-drop-container___hee1p_12-9-6{
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-9-4{
75
+ .magritte-select-drop-container_plain___766zl_12-9-6{
76
76
  padding:24px;
77
77
  margin:calc(-1 * 24px);
78
78
  }
79
- .magritte-select-drop-container_with-footer___6wp-L_12-9-4{
79
+ .magritte-select-drop-container_with-footer___6wp-L_12-9-6{
80
80
  margin-bottom:0;
81
81
  padding-bottom:0;
82
82
  }
83
- .magritte-select-drop___jn4O-_12-9-4{
83
+ .magritte-select-drop___jn4O-_12-9-6{
84
84
  display:flex;
85
85
  flex-direction:column;
86
86
  gap:8px;
87
87
  }
88
- .magritte-select-drop-header___fMmio_12-9-4{
88
+ .magritte-select-drop-header___fMmio_12-9-6{
89
89
  display:flex;
90
90
  flex-direction:column;
91
91
  margin-bottom:8px;
92
92
  }
93
- .magritte-select-drop_plain___VL8Fz_12-9-4{
93
+ .magritte-select-drop_plain___VL8Fz_12-9-6{
94
94
  gap:16px;
95
95
  }
96
- .magritte-label-option___2N7t9_12-9-4{
96
+ .magritte-label-option___2N7t9_12-9-6{
97
97
  display:flex;
98
98
  justify-content:center;
99
99
  }
100
- .magritte-loading___AMiuq_12-9-4{
100
+ .magritte-loading___AMiuq_12-9-6{
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-9-4{
106
+ .magritte-hint___6qaFl_12-9-6{
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-9-4{
114
+ .magritte-select-modal-wrapper___5BhtC_12-9-6{
115
115
  display:flex;
116
116
  flex-direction:column;
117
117
  flex-grow:1;
118
118
  }
119
- .magritte-select-modal___f9wc6_12-9-4{
119
+ .magritte-select-modal___f9wc6_12-9-6{
120
120
  display:flex;
121
121
  flex-direction:column;
122
122
  gap:12px;
123
123
  }
124
- .magritte-select-modal_plain___0rP39_12-9-4{
124
+ .magritte-select-modal_plain___0rP39_12-9-6{
125
125
  gap:0;
126
126
  }
127
- .magritte-label-option___kFAuR_12-9-4{
127
+ .magritte-label-option___kFAuR_12-9-6{
128
128
  display:flex;
129
129
  justify-content:center;
130
130
  }
131
- .magritte-layer-full-height___cJX-K_12-9-4{
131
+ .magritte-layer-full-height___cJX-K_12-9-6{
132
132
  display:flex;
133
133
  flex-direction:column;
134
134
  align-items:center;
@@ -138,31 +138,31 @@
138
138
  }
139
139
 
140
140
  :root{
141
- --magritte-color-background-secondary-v24-7-1:#F1F4F9;
142
- --magritte-color-background-accent-secondary-v24-7-1:#EDF6FF;
143
- --magritte-color-icon-tertiary-v24-7-1:#AABBCA;
144
- --magritte-color-icon-accent-v24-7-1:#0070ff;
141
+ --magritte-color-background-secondary-v24-7-2:#F1F4F9;
142
+ --magritte-color-background-accent-secondary-v24-7-2:#EDF6FF;
143
+ --magritte-color-icon-tertiary-v24-7-2:#AABBCA;
144
+ --magritte-color-icon-accent-v24-7-2:#0070ff;
145
145
  }
146
146
 
147
147
  .magritte-night-theme{
148
- --magritte-color-background-secondary-v24-7-1:#303030;
149
- --magritte-color-background-accent-secondary-v24-7-1:#222D3D;
150
- --magritte-color-icon-tertiary-v24-7-1:#767676;
151
- --magritte-color-icon-accent-v24-7-1:#5e9eff;
148
+ --magritte-color-background-secondary-v24-7-2:#303030;
149
+ --magritte-color-background-accent-secondary-v24-7-2:#222D3D;
150
+ --magritte-color-icon-tertiary-v24-7-2:#767676;
151
+ --magritte-color-icon-accent-v24-7-2:#5e9eff;
152
152
  }
153
153
 
154
154
  .magritte-zp-day-theme{
155
- --magritte-color-background-accent-secondary-v24-7-1:#F1F4F7;
156
- --magritte-color-icon-accent-v24-7-1:#7195AF;
155
+ --magritte-color-background-accent-secondary-v24-7-2:#F1F4F7;
156
+ --magritte-color-icon-accent-v24-7-2:#7195AF;
157
157
  }
158
- .magritte-select-empty-hint___B39XJ_12-9-4{
158
+ .magritte-select-empty-hint___B39XJ_12-9-6{
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-9-4{
165
+ .magritte-icon___F0GQx_12-9-6{
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-9-4{
174
- background-color:var(--magritte-color-background-accent-secondary-v24-7-1);
175
- --magritte-ui-icon-color-override:var(--magritte-color-icon-accent-v24-7-1);
173
+ .magritte-icon-init___GWK-V_12-9-6{
174
+ background-color:var(--magritte-color-background-accent-secondary-v24-7-2);
175
+ --magritte-ui-icon-color-override:var(--magritte-color-icon-accent-v24-7-2);
176
176
  }
177
- .magritte-icon-search___ZsqO-_12-9-4{
178
- background-color:var(--magritte-color-background-secondary-v24-7-1);
179
- --magritte-ui-icon-color-override:var(--magritte-color-icon-tertiary-v24-7-1);
177
+ .magritte-icon-search___ZsqO-_12-9-6{
178
+ background-color:var(--magritte-color-background-secondary-v24-7-2);
179
+ --magritte-ui-icon-color-override:var(--magritte-color-icon-tertiary-v24-7-2);
180
180
  }
package/index.js CHANGED
@@ -32,6 +32,7 @@ import './SelectModal.js';
32
32
  import '@hh.ru/magritte-ui-action-bar';
33
33
  import '@hh.ru/magritte-ui-input';
34
34
  import '@hh.ru/magritte-ui-modal';
35
+ import '@hh.ru/magritte-ui-nav-bar';
35
36
  import './isArraysEquals.js';
36
37
  import './useSelectOptionsList.js';
37
38
  import './useSelectSearch.js';
@@ -39,5 +40,4 @@ import '@hh.ru/magritte-common-data-provider';
39
40
  import './useSelectState.js';
40
41
  import '@hh.ru/magritte-ui-trigger';
41
42
  import '@hh.ru/magritte-ui-bottom-sheet';
42
- import '@hh.ru/magritte-ui-nav-bar';
43
43
  //# sourceMappingURL=index.js.map
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hh.ru/magritte-ui-select",
3
- "version": "12.9.4",
3
+ "version": "12.9.6",
4
4
  "main": "index.js",
5
5
  "types": "index.d.ts",
6
6
  "sideEffects": [
@@ -32,25 +32,25 @@
32
32
  "@hh.ru/magritte-common-use-disabled": "1.0.15",
33
33
  "@hh.ru/magritte-common-use-multiple-refs": "1.1.11",
34
34
  "@hh.ru/magritte-common-use-translation": "3.1.0",
35
- "@hh.ru/magritte-design-tokens": "24.7.1",
36
- "@hh.ru/magritte-ui-action-bar": "5.3.31",
37
- "@hh.ru/magritte-ui-bottom-sheet": "9.4.4",
35
+ "@hh.ru/magritte-design-tokens": "24.7.2",
36
+ "@hh.ru/magritte-ui-action-bar": "5.4.0",
37
+ "@hh.ru/magritte-ui-bottom-sheet": "9.4.6",
38
38
  "@hh.ru/magritte-ui-breakpoint": "6.1.1",
39
- "@hh.ru/magritte-ui-button": "7.2.13",
40
- "@hh.ru/magritte-ui-cell": "7.2.26",
41
- "@hh.ru/magritte-ui-checkable-card": "5.0.33",
42
- "@hh.ru/magritte-ui-checkbox-radio": "4.1.22",
43
- "@hh.ru/magritte-ui-drop": "12.3.30",
44
- "@hh.ru/magritte-ui-icon": "14.2.11",
45
- "@hh.ru/magritte-ui-input": "9.4.28",
46
- "@hh.ru/magritte-ui-loader": "3.0.13",
39
+ "@hh.ru/magritte-ui-button": "7.2.14",
40
+ "@hh.ru/magritte-ui-cell": "7.2.27",
41
+ "@hh.ru/magritte-ui-checkable-card": "5.0.34",
42
+ "@hh.ru/magritte-ui-checkbox-radio": "4.1.23",
43
+ "@hh.ru/magritte-ui-drop": "12.3.32",
44
+ "@hh.ru/magritte-ui-icon": "14.2.12",
45
+ "@hh.ru/magritte-ui-input": "9.4.29",
46
+ "@hh.ru/magritte-ui-loader": "3.0.14",
47
47
  "@hh.ru/magritte-ui-mock-component": "1.1.7",
48
- "@hh.ru/magritte-ui-modal": "10.1.34",
49
- "@hh.ru/magritte-ui-nav-bar": "1.5.3",
50
- "@hh.ru/magritte-ui-spacing": "2.1.20",
51
- "@hh.ru/magritte-ui-title": "8.3.1",
52
- "@hh.ru/magritte-ui-trigger": "4.3.22",
53
- "@hh.ru/magritte-ui-typography": "5.3.5"
48
+ "@hh.ru/magritte-ui-modal": "11.0.0",
49
+ "@hh.ru/magritte-ui-nav-bar": "2.0.0",
50
+ "@hh.ru/magritte-ui-spacing": "2.1.21",
51
+ "@hh.ru/magritte-ui-title": "8.3.3",
52
+ "@hh.ru/magritte-ui-trigger": "4.3.23",
53
+ "@hh.ru/magritte-ui-typography": "5.3.6"
54
54
  },
55
- "gitHead": "74e4a3c836283bbb6e15e2686be772f5bbbe9416"
55
+ "gitHead": "c04d157907ffbb3a873f8cd98fb63c4034f93f69"
56
56
  }
package/types.d.ts CHANGED
@@ -3,13 +3,37 @@ import { DataProvider, StaticDataFetcherItem } from '@hh.ru/magritte-common-data
3
3
  import { BottomSheet, BottomSheetHeight } from '@hh.ru/magritte-ui-bottom-sheet';
4
4
  import { Drop } from '@hh.ru/magritte-ui-drop';
5
5
  import { ModalProps } from '@hh.ru/magritte-ui-modal';
6
- import { HeadingElement } from '@hh.ru/magritte-ui-title/types';
6
+ import { HeadingElement, TitleProps } from '@hh.ru/magritte-ui-title/types';
7
7
  import { TriggerProps, Trigger } from '@hh.ru/magritte-ui-trigger';
8
8
  type BottomSheetPropsHelper = Omit<ComponentProps<typeof BottomSheet>, 'children' | 'footer' | 'withContentPaddings' | 'withFooterPaddings' | 'header' | 'allowScrollWhileFocused' | 'keyboardOverlaysFooter' | 'onClose'> & {
9
9
  onClose: VoidFunction;
10
10
  };
11
11
  type DropPropsHelper = Omit<ComponentProps<typeof Drop>, 'placement' | 'children' | 'autoFocusWhenOpened' | 'direction' | 'alignment' | 'role' | 'space' | 'onChange' | 'keyboardNavigationMode' | 'forcePosition' | 'closeByClickOutside' | 'onKeyDownCapture' | 'footer'>;
12
- type ModalPropsHelper = Omit<ModalProps, 'footer' | 'options' | 'actions'>;
12
+ /**
13
+ * Плоский API заголовка модала (как у deprecated Modal). Все поля прокидываются
14
+ * в компонент `Title`, который рендерится в центральном слоте `NavBar.Actions`.
15
+ */
16
+ interface SelectModalHeaderProps {
17
+ /** Текст заголовка */
18
+ title?: TitleProps['children'];
19
+ /** Размер заголовка */
20
+ titleSize?: TitleProps['size'];
21
+ /** Выравнивание заголовка */
22
+ titleAlignment?: TitleProps['alignment'];
23
+ /** Элемент используемый для заголовка */
24
+ titleElement?: TitleProps['Element'];
25
+ /** Максимальное кол-во строк перед обрезкой заголовка многоточием */
26
+ titleMaxLines?: TitleProps['maxLines'];
27
+ /** Цвет заголовка */
28
+ titleStyle?: TitleProps['style'];
29
+ /** Текст подзаголовка */
30
+ titleDescription?: TitleProps['description'];
31
+ /** Максимальное кол-во строк перед обрезкой описания многоточием */
32
+ titleDescriptionMaxLines?: TitleProps['descriptionMaxLines'];
33
+ /** Цвет подзаголовка */
34
+ titleDescriptionStyle?: TitleProps['descriptionStyle'];
35
+ }
36
+ type ModalPropsHelper = Omit<ModalProps, 'footer' | 'header'> & SelectModalHeaderProps;
13
37
  export type TriggerPropsWithRef = ComponentProps<typeof Trigger>;
14
38
  export type TriggerExternalProps = Omit<TriggerProps, 'values' | 'expanded' | 'onChange' | 'onClear' | 'onKeyDown' | 'onBlur' | 'onFocus'>;
15
39
  export type SelectType = 'checkbox' | 'label' | 'radio';