@hh.ru/magritte-ui-select 9.0.11 → 9.0.12

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.
@@ -24,7 +24,7 @@ import '@hh.ru/magritte-ui-typography';
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-bottom-sheet":"magritte-select-bottom-sheet___1RZDJ_9-0-11","selectBottomSheet":"magritte-select-bottom-sheet___1RZDJ_9-0-11","select-bottom-sheet_checkbox":"magritte-select-bottom-sheet_checkbox___hwTgo_9-0-11","selectBottomSheetCheckbox":"magritte-select-bottom-sheet_checkbox___hwTgo_9-0-11","select-bottom-sheet_radio":"magritte-select-bottom-sheet_radio___qvFFV_9-0-11","selectBottomSheetRadio":"magritte-select-bottom-sheet_radio___qvFFV_9-0-11","full-screen-placeholder":"magritte-full-screen-placeholder___zPC8k_9-0-11","fullScreenPlaceholder":"magritte-full-screen-placeholder___zPC8k_9-0-11","error-wrapper":"magritte-error-wrapper___P7jYg_9-0-11","errorWrapper":"magritte-error-wrapper___P7jYg_9-0-11"};
27
+ var styles = {"select-bottom-sheet":"magritte-select-bottom-sheet___1RZDJ_9-0-12","selectBottomSheet":"magritte-select-bottom-sheet___1RZDJ_9-0-12","select-bottom-sheet_checkbox":"magritte-select-bottom-sheet_checkbox___hwTgo_9-0-12","selectBottomSheetCheckbox":"magritte-select-bottom-sheet_checkbox___hwTgo_9-0-12","select-bottom-sheet_radio":"magritte-select-bottom-sheet_radio___qvFFV_9-0-12","selectBottomSheetRadio":"magritte-select-bottom-sheet_radio___qvFFV_9-0-12","full-screen-placeholder":"magritte-full-screen-placeholder___zPC8k_9-0-12","fullScreenPlaceholder":"magritte-full-screen-placeholder___zPC8k_9-0-12","error-wrapper":"magritte-error-wrapper___P7jYg_9-0-12","errorWrapper":"magritte-error-wrapper___P7jYg_9-0-12"};
28
28
 
29
29
  const SelectOptionDefault = ({ data, input, type, }) => {
30
30
  if (type === 'delimiter') {
package/SelectDrop.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import './index.css';
2
- import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
2
+ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
3
3
  import { useRef, useCallback, cloneElement } from 'react';
4
4
  import classnames from 'classnames';
5
5
  import { keyboardMatches, keyboardKeys } from '@hh.ru/magritte-common-keyboard';
@@ -19,7 +19,7 @@ import '@hh.ru/magritte-ui-checkable-card/CheckableCardElement';
19
19
  import '@hh.ru/magritte-ui-checkbox-radio';
20
20
  import '@hh.ru/magritte-ui-icon/icon';
21
21
 
22
- var styles = {"select-drop":"magritte-select-drop___jn4O-_9-0-11","selectDrop":"magritte-select-drop___jn4O-_9-0-11","select-drop-header":"magritte-select-drop-header___fMmio_9-0-11","selectDropHeader":"magritte-select-drop-header___fMmio_9-0-11","select-drop_plain":"magritte-select-drop_plain___VL8Fz_9-0-11","selectDropPlain":"magritte-select-drop_plain___VL8Fz_9-0-11","label-option-plain":"magritte-label-option-plain___BvBH8_9-0-11","labelOptionPlain":"magritte-label-option-plain___BvBH8_9-0-11","loading":"magritte-loading___AMiuq_9-0-11","hint":"magritte-hint___6qaFl_9-0-11"};
22
+ var styles = {"select-drop-container-wrapper":"magritte-select-drop-container-wrapper___OHM0q_9-0-12","selectDropContainerWrapper":"magritte-select-drop-container-wrapper___OHM0q_9-0-12","select-drop-container":"magritte-select-drop-container___hee1p_9-0-12","selectDropContainer":"magritte-select-drop-container___hee1p_9-0-12","select-drop-container_plain":"magritte-select-drop-container_plain___766zl_9-0-12","selectDropContainerPlain":"magritte-select-drop-container_plain___766zl_9-0-12","select-drop":"magritte-select-drop___jn4O-_9-0-12","selectDrop":"magritte-select-drop___jn4O-_9-0-12","select-drop-header":"magritte-select-drop-header___fMmio_9-0-12","selectDropHeader":"magritte-select-drop-header___fMmio_9-0-12","select-drop_plain":"magritte-select-drop_plain___VL8Fz_9-0-12","selectDropPlain":"magritte-select-drop_plain___VL8Fz_9-0-12","label-option-plain":"magritte-label-option-plain___BvBH8_9-0-12","labelOptionPlain":"magritte-label-option-plain___BvBH8_9-0-12","loading":"magritte-loading___AMiuq_9-0-12","hint":"magritte-hint___6qaFl_9-0-12"};
23
23
 
24
24
  const SelectOptionDefault = ({ data, input, type, plain, }) => {
25
25
  if (type === 'delimiter') {
@@ -111,7 +111,7 @@ const SelectDrop = ({ activatorRef, type, name, multiple, applyChangesButton: _a
111
111
  !searchInProgress &&
112
112
  !internalError);
113
113
  const optionsVisible = !loading && !emptySearchOptionsHintVisible && !emptyOptionsHintVisible && !internalError;
114
- return (jsxs(Drop, { ...props, ref: optionsListRef, autoFocusWhenOpened: false, maxWidth: maxWidth, visible: (optionList.length > 0 ||
114
+ return (jsx(Drop, { ...props, ref: optionsListRef, autoFocusWhenOpened: false, maxWidth: maxWidth, visible: (optionList.length > 0 ||
115
115
  forceDropVisibleWithEmptyOptions ||
116
116
  emptyOptionsHintVisible ||
117
117
  emptySearchOptionsHintVisible ||
@@ -123,11 +123,11 @@ const SelectDrop = ({ activatorRef, type, name, multiple, applyChangesButton: _a
123
123
  if (keyboardMatches(event.nativeEvent, [keyboardKeys.Enter, keyboardKeys.Space])) {
124
124
  closedByKeyboardRef.current = true;
125
125
  }
126
- }, widthEqualToActivator: widthEqualToActivator || loading, forcePlacement: true, footer: footer, onAfterExit: onDropClose, onAppear: onDropOpen, children: [internalError && innerErrorTrls && jsx(SelectError, { innerErrorTrls: innerErrorTrls, reload: reload }), emptyOptionsHintVisible && jsx("div", { className: styles.hint, children: emptyOptionsHint }), emptySearchOptionsHintVisible && jsx("div", { className: styles.hint, children: emptyOptionsSearchHint }), loading && (jsx("div", { className: styles.loading, children: jsx(Loader, { size: 24 }) })), optionsVisible && (jsxs(Fragment, { children: [renderContentBefore && (jsx("div", { "data-qa": "magritte-select-header", className: styles.selectDropHeader, children: renderContentBefore({ clearSelectedValuesAndClose, searchValue, setSearchValue }) })), jsx("div", { className: classnames(styles.selectDrop, { [styles.selectDropPlain]: plain }), "data-qa": "magritte-select-option-list", style: { maxHeight: `${maxHeight}px` }, children: optionList.map((option) => {
127
- const checked = Boolean(option.data && getChecked(option.data, values ?? []));
128
- const disabled = !checked && (option.disabled || isLimitExceeded);
129
- return (jsx(SelectOption, { name: name, checked: checked, onChange: handleChange, render: renderItem, disabled: disabled, type: option.type || type, plain: !!plain, isMobile: false, multiple: multiple, "data-qa": optionDataQa, data: option.data }, option.data.value));
130
- }) })] }))] }));
126
+ }, widthEqualToActivator: widthEqualToActivator || loading, forcePlacement: true, footer: footer, onAfterExit: onDropClose, onAppear: onDropOpen, children: jsx("div", { className: styles.selectDropContainerWrapper, style: { maxHeight: `${maxHeight}px` }, children: jsxs("div", { className: classnames(styles.selectDropContainer, { [styles.selectDropContainerPlain]: plain }), children: [internalError && innerErrorTrls && jsx(SelectError, { innerErrorTrls: innerErrorTrls, reload: reload }), emptyOptionsHintVisible && jsx("div", { className: styles.hint, children: emptyOptionsHint }), emptySearchOptionsHintVisible && jsx("div", { className: styles.hint, children: emptyOptionsSearchHint }), loading && (jsx("div", { className: styles.loading, children: jsx(Loader, { size: 24 }) })), optionsVisible && (jsxs(Fragment, { children: [renderContentBefore && (jsx("div", { "data-qa": "magritte-select-header", className: styles.selectDropHeader, children: renderContentBefore({ clearSelectedValuesAndClose, searchValue, setSearchValue }) })), jsx("div", { className: classnames(styles.selectDrop, { [styles.selectDropPlain]: plain }), "data-qa": "magritte-select-option-list", children: optionList.map((option) => {
127
+ const checked = Boolean(option.data && getChecked(option.data, values ?? []));
128
+ const disabled = !checked && (option.disabled || isLimitExceeded);
129
+ return (jsx(SelectOption, { name: name, checked: checked, onChange: handleChange, render: renderItem, disabled: disabled, type: option.type || type, plain: !!plain, isMobile: false, multiple: multiple, "data-qa": optionDataQa, data: option.data }, option.data.value));
130
+ }) })] }))] }) }) }));
131
131
  };
132
132
 
133
133
  export { SelectDrop };
package/SelectDrop.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"SelectDrop.js","sources":["../src/SelectDrop.tsx"],"sourcesContent":["import { useCallback, ReactElement, cloneElement, ComponentProps, ReactNode, useRef, KeyboardEvent } 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 { Button } from '@hh.ru/magritte-ui-button';\nimport { Cell, CellText } from '@hh.ru/magritte-ui-cell';\nimport { Drop } from '@hh.ru/magritte-ui-drop';\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 { OnChangeAction, SelectDropProps, RenderOptionTypeProps, SelectButtons } 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}: 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 if (plain) {\n return <CellText maxLines={1}>{data.text}</CellText>;\n }\n return (\n <Cell Element=\"div\" align=\"center\">\n <div className={styles.labelOptionPlain}>\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 }: SelectButtons): ReactNode => {\n const primaryActions = [applyChangesButton].filter((btn) => btn);\n if (primaryActions.length === 0) {\n return null;\n }\n // заменить на action-bar, когда разберемся с отсутпами\n return <>{applyChangesButton}</>;\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 ...props\n}: SelectDropProps<MultipleType, DataType>): ReactElement => {\n const closedByKeyboardRef = useRef(false);\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 clearButton =\n _clearButton &&\n cloneElement(_clearButton, {\n key: 'clearButton',\n size: 'medium',\n 'data-qa': 'magritte-select-clear-action',\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 onClick: () => {\n setSelectedValues();\n onClose?.();\n onApply?.({ isMobile: false, searchValue });\n },\n } as Partial<ComponentProps<typeof Button>>)) ||\n undefined;\n const footer =\n !loading &&\n needAddChangesButton &&\n renderButtonsContainer({\n applyChangesButton,\n clearButton,\n });\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 <Drop\n {...props}\n ref={optionsListRef}\n autoFocusWhenOpened={false}\n maxWidth={maxWidth}\n visible={\n (optionList.length > 0 ||\n forceDropVisibleWithEmptyOptions ||\n emptyOptionsHintVisible ||\n emptySearchOptionsHintVisible ||\n internalError) &&\n visible\n }\n placement={['bottom-left', 'top-left']}\n activatorRef={activatorRef}\n role={searchable ? 'status' : 'listbox'}\n space={plain ? 600 : 300}\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}\n forcePlacement\n footer={footer}\n onAfterExit={onDropClose}\n onAppear={onDropOpen}\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({ clearSelectedValuesAndClose, searchValue, setSearchValue })}\n </div>\n )}\n <div\n className={classnames(styles.selectDrop, { [styles.selectDropPlain]: plain })}\n data-qa=\"magritte-select-option-list\"\n style={{ maxHeight: `${maxHeight}px` }}\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 isMobile={false}\n multiple={multiple}\n data-qa={optionDataQa}\n data={option.data}\n />\n );\n })}\n </div>\n </>\n )}\n </Drop>\n );\n};\n"],"names":["_jsx","_Fragment","_jsxs"],"mappings":"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"}
1
+ {"version":3,"file":"SelectDrop.js","sources":["../src/SelectDrop.tsx"],"sourcesContent":["import { useCallback, ReactElement, cloneElement, ComponentProps, ReactNode, useRef, KeyboardEvent } 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 { Button } from '@hh.ru/magritte-ui-button';\nimport { Cell, CellText } from '@hh.ru/magritte-ui-cell';\nimport { Drop } from '@hh.ru/magritte-ui-drop';\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 { OnChangeAction, SelectDropProps, RenderOptionTypeProps, SelectButtons } 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}: 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 if (plain) {\n return <CellText maxLines={1}>{data.text}</CellText>;\n }\n return (\n <Cell Element=\"div\" align=\"center\">\n <div className={styles.labelOptionPlain}>\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 }: SelectButtons): ReactNode => {\n const primaryActions = [applyChangesButton].filter((btn) => btn);\n if (primaryActions.length === 0) {\n return null;\n }\n // заменить на action-bar, когда разберемся с отсутпами\n return <>{applyChangesButton}</>;\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 ...props\n}: SelectDropProps<MultipleType, DataType>): ReactElement => {\n const closedByKeyboardRef = useRef(false);\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 clearButton =\n _clearButton &&\n cloneElement(_clearButton, {\n key: 'clearButton',\n size: 'medium',\n 'data-qa': 'magritte-select-clear-action',\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 onClick: () => {\n setSelectedValues();\n onClose?.();\n onApply?.({ isMobile: false, searchValue });\n },\n } as Partial<ComponentProps<typeof Button>>)) ||\n undefined;\n const footer =\n !loading &&\n needAddChangesButton &&\n renderButtonsContainer({\n applyChangesButton,\n clearButton,\n });\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 <Drop\n {...props}\n ref={optionsListRef}\n autoFocusWhenOpened={false}\n maxWidth={maxWidth}\n visible={\n (optionList.length > 0 ||\n forceDropVisibleWithEmptyOptions ||\n emptyOptionsHintVisible ||\n emptySearchOptionsHintVisible ||\n internalError) &&\n visible\n }\n placement={['bottom-left', 'top-left']}\n activatorRef={activatorRef}\n role={searchable ? 'status' : 'listbox'}\n space={plain ? 600 : 300}\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}\n forcePlacement\n footer={footer}\n onAfterExit={onDropClose}\n onAppear={onDropOpen}\n >\n <div className={styles.selectDropContainerWrapper} style={{ maxHeight: `${maxHeight}px` }}>\n <div className={classnames(styles.selectDropContainer, { [styles.selectDropContainerPlain]: plain })}>\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({ clearSelectedValuesAndClose, searchValue, setSearchValue })}\n </div>\n )}\n <div\n className={classnames(styles.selectDrop, { [styles.selectDropPlain]: plain })}\n data-qa=\"magritte-select-option-list\"\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 isMobile={false}\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","_Fragment","_jsxs"],"mappings":"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"}
@@ -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_9-0-11","selectEmptyHint":"magritte-select-empty-hint___B39XJ_9-0-11","icon":"magritte-icon___F0GQx_9-0-11","icon-init":"magritte-icon-init___GWK-V_9-0-11","iconInit":"magritte-icon-init___GWK-V_9-0-11","icon-search":"magritte-icon-search___ZsqO-_9-0-11","iconSearch":"magritte-icon-search___ZsqO-_9-0-11"};
9
+ var styles = {"select-empty-hint":"magritte-select-empty-hint___B39XJ_9-0-12","selectEmptyHint":"magritte-select-empty-hint___B39XJ_9-0-12","icon":"magritte-icon___F0GQx_9-0-12","icon-init":"magritte-icon-init___GWK-V_9-0-12","iconInit":"magritte-icon-init___GWK-V_9-0-12","icon-search":"magritte-icon-search___ZsqO-_9-0-12","iconSearch":"magritte-icon-search___ZsqO-_9-0-12"};
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_9-0-11","errorContainer":"magritte-error-container___t9B5w_9-0-11"};
10
+ var styles = {"error-container":"magritte-error-container___t9B5w_9-0-12","errorContainer":"magritte-error-container___t9B5w_9-0-12"};
11
11
 
12
12
  const SelectError = ({ innerErrorTrls, reload, }) => {
13
13
  const { isMobile } = useBreakpoint();
package/SelectOption.js CHANGED
@@ -9,7 +9,7 @@ import { Radio, Checkbox } from '@hh.ru/magritte-ui-checkbox-radio';
9
9
  import { CheckOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';
10
10
  import { Text } from '@hh.ru/magritte-ui-typography';
11
11
 
12
- var styles = {"select-option-label":"magritte-select-option-label___bYo2l_9-0-11","selectOptionLabel":"magritte-select-option-label___bYo2l_9-0-11","select-option-label_desktop":"magritte-select-option-label_desktop___bceen_9-0-11","selectOptionLabelDesktop":"magritte-select-option-label_desktop___bceen_9-0-11","select-delimiter":"magritte-select-delimiter___WyeR6_9-0-11","selectDelimiter":"magritte-select-delimiter___WyeR6_9-0-11"};
12
+ var styles = {"select-option-label":"magritte-select-option-label___bYo2l_9-0-12","selectOptionLabel":"magritte-select-option-label___bYo2l_9-0-12","select-option-label_desktop":"magritte-select-option-label_desktop___bceen_9-0-12","selectOptionLabelDesktop":"magritte-select-option-label_desktop___bceen_9-0-12","select-delimiter":"magritte-select-delimiter___WyeR6_9-0-12","selectDelimiter":"magritte-select-delimiter___WyeR6_9-0-12"};
13
13
 
14
14
  const CheckableComponent = ({ type, value, checked, name, onChange, 'data-qa': dataQa, }) => {
15
15
  if (type === 'label') {
package/index.css CHANGED
@@ -1,4 +1,4 @@
1
- .magritte-error-container___t9B5w_9-0-11{
1
+ .magritte-error-container___t9B5w_9-0-12{
2
2
  display:flex;
3
3
  flex-direction:column;
4
4
  align-items:center;
@@ -6,26 +6,26 @@
6
6
  justify-content:center;
7
7
  }
8
8
  @media (min-width: 1020px){
9
- body.magritte-old-layout .magritte-error-container___t9B5w_9-0-11{
9
+ body.magritte-old-layout .magritte-error-container___t9B5w_9-0-12{
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_9-0-11{
15
+ body:not(.magritte-old-layout) .magritte-error-container___t9B5w_9-0-12{
16
16
  min-height:320px;
17
17
  height:auto;
18
18
  }
19
19
  }
20
20
 
21
- .magritte-select-option-label___bYo2l_9-0-11{
21
+ .magritte-select-option-label___bYo2l_9-0-12{
22
22
  display:flex;
23
23
  max-height:56px;
24
24
  }
25
- .magritte-select-option-label_desktop___bceen_9-0-11{
25
+ .magritte-select-option-label_desktop___bceen_9-0-12{
26
26
  max-height:24px;
27
27
  }
28
- .magritte-select-delimiter___WyeR6_9-0-11{
28
+ .magritte-select-delimiter___WyeR6_9-0-12{
29
29
  padding-left:16px;
30
30
  padding-top:12px;
31
31
  }
@@ -33,51 +33,69 @@
33
33
  :root{
34
34
  --magritte-static-space-400-v21-1-0:16px;
35
35
  }
36
- .magritte-select-bottom-sheet___1RZDJ_9-0-11{
36
+ .magritte-select-bottom-sheet___1RZDJ_9-0-12{
37
37
  display:flex;
38
38
  flex-direction:column;
39
39
  padding:0 var(--magritte-static-space-400-v21-1-0);
40
40
  padding-bottom:16px;
41
41
  }
42
- .magritte-select-bottom-sheet_checkbox___hwTgo_9-0-11,
43
- .magritte-select-bottom-sheet_radio___qvFFV_9-0-11{
42
+ .magritte-select-bottom-sheet_checkbox___hwTgo_9-0-12,
43
+ .magritte-select-bottom-sheet_radio___qvFFV_9-0-12{
44
44
  gap:12px;
45
45
  }
46
- .magritte-full-screen-placeholder___zPC8k_9-0-11{
46
+ .magritte-full-screen-placeholder___zPC8k_9-0-12{
47
47
  display:flex;
48
48
  flex-direction:column;
49
49
  align-items:center;
50
50
  height:100%;
51
51
  justify-content:center;
52
52
  }
53
- .magritte-error-wrapper___P7jYg_9-0-11{
53
+ .magritte-error-wrapper___P7jYg_9-0-12{
54
54
  height:100%;
55
55
  }
56
56
 
57
- .magritte-select-drop___jn4O-_9-0-11{
57
+ :root{
58
+ --magritte-static-space-300-v21-1-0:12px;
59
+ --magritte-static-space-600-v21-1-0:24px;
60
+ }
61
+ .magritte-select-drop-container-wrapper___OHM0q_9-0-12{
62
+ display:flex;
63
+ flex-direction:column;
64
+ }
65
+ .magritte-select-drop-container___hee1p_9-0-12{
66
+ display:flex;
67
+ flex-direction:column;
68
+ padding:var(--magritte-static-space-300-v21-1-0);
69
+ margin:calc(-1 * var(--magritte-static-space-300-v21-1-0));
70
+ }
71
+ .magritte-select-drop-container_plain___766zl_9-0-12{
72
+ padding:var(--magritte-static-space-600-v21-1-0);
73
+ margin:calc(-1 * var(--magritte-static-space-600-v21-1-0));
74
+ }
75
+ .magritte-select-drop___jn4O-_9-0-12{
58
76
  display:flex;
59
77
  flex-direction:column;
60
78
  gap:8px;
61
79
  }
62
- .magritte-select-drop-header___fMmio_9-0-11{
80
+ .magritte-select-drop-header___fMmio_9-0-12{
63
81
  display:flex;
64
82
  flex-direction:column;
65
83
  margin-bottom:8px;
66
84
  }
67
- .magritte-select-drop_plain___VL8Fz_9-0-11{
85
+ .magritte-select-drop_plain___VL8Fz_9-0-12{
68
86
  gap:16px;
69
87
  }
70
- .magritte-label-option-plain___BvBH8_9-0-11{
88
+ .magritte-label-option-plain___BvBH8_9-0-12{
71
89
  display:flex;
72
90
  justify-content:center;
73
91
  }
74
- .magritte-loading___AMiuq_9-0-11{
92
+ .magritte-loading___AMiuq_9-0-12{
75
93
  display:flex;
76
94
  align-items:center;
77
95
  height:150px;
78
96
  justify-content:center;
79
97
  }
80
- .magritte-hint___6qaFl_9-0-11{
98
+ .magritte-hint___6qaFl_9-0-12{
81
99
  display:flex;
82
100
  flex-direction:column;
83
101
  align-items:center;
@@ -97,14 +115,14 @@
97
115
  --magritte-color-icon-tertiary-v21-1-0:#767676;
98
116
  --magritte-color-icon-accent-v21-1-0:#5e9eff;
99
117
  }
100
- .magritte-select-empty-hint___B39XJ_9-0-11{
118
+ .magritte-select-empty-hint___B39XJ_9-0-12{
101
119
  display:flex;
102
120
  flex-direction:column;
103
121
  justify-content:center;
104
122
  align-content:center;
105
123
  align-items:center;
106
124
  }
107
- .magritte-icon___F0GQx_9-0-11{
125
+ .magritte-icon___F0GQx_9-0-12{
108
126
  display:flex;
109
127
  align-items:center;
110
128
  justify-content:center;
@@ -112,11 +130,11 @@
112
130
  height:48px;
113
131
  border-radius:50%;
114
132
  }
115
- .magritte-icon-init___GWK-V_9-0-11{
133
+ .magritte-icon-init___GWK-V_9-0-12{
116
134
  background-color:var(--magritte-color-background-accent-secondary-v21-1-0);
117
135
  --magritte-ui-icon-color-override:var(--magritte-color-icon-accent-v21-1-0);
118
136
  }
119
- .magritte-icon-search___ZsqO-_9-0-11{
137
+ .magritte-icon-search___ZsqO-_9-0-12{
120
138
  background-color:var(--magritte-color-background-secondary-v21-1-0);
121
139
  --magritte-ui-icon-color-override:var(--magritte-color-icon-tertiary-v21-1-0);
122
140
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hh.ru/magritte-ui-select",
3
- "version": "9.0.11",
3
+ "version": "9.0.12",
4
4
  "main": "index.js",
5
5
  "types": "index.d.ts",
6
6
  "sideEffects": [
@@ -50,5 +50,5 @@
50
50
  "@hh.ru/magritte-ui-trigger": "3.0.20",
51
51
  "@hh.ru/magritte-ui-typography": "3.0.27"
52
52
  },
53
- "gitHead": "97c190cff43cfbf208af71a33794d031673ccf4f"
53
+ "gitHead": "68c895fa66c26a7ec73d11bfa884b960917073ec"
54
54
  }