@hh.ru/magritte-ui-chips-trigger 3.2.1 → 3.2.3

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 (10) hide show
  1. package/ChipsTrigger.js +4 -4
  2. package/ChipsTrigger.js.map +1 -1
  3. package/index.css +33 -30
  4. package/index.d.ts +1 -0
  5. package/index.js +1 -0
  6. package/index.js.map +1 -1
  7. package/index.mock.d.ts +5 -0
  8. package/index.mock.js +40 -0
  9. package/index.mock.js.map +1 -0
  10. package/package.json +4 -3
package/ChipsTrigger.js CHANGED
@@ -10,7 +10,7 @@ import { FormHelper } from '@hh.ru/magritte-ui-form-helper';
10
10
  import { ChevronDownOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';
11
11
  import { useFocus } from '@hh.ru/magritte-ui-input/useFocus';
12
12
 
13
- var styles = {"root":"magritte-root___-zVdz_3-2-1","focused":"magritte-focused___0Uzyu_3-2-1","invalid":"magritte-invalid___tVzQV_3-2-1","disabled":"magritte-disabled___UeqcV_3-2-1","label":"magritte-label___j7Trt_3-2-1","focus-visible":"magritte-focus-visible___ifvAP_3-2-1","focusVisible":"magritte-focus-visible___ifvAP_3-2-1","large":"magritte-large___JIrIy_3-2-1","field":"magritte-field___rlEmn_3-2-1","icon":"magritte-icon___fDMiz_3-2-1","scrollable-area":"magritte-scrollable-area___-xMF2_3-2-1","scrollableArea":"magritte-scrollable-area___-xMF2_3-2-1","medium":"magritte-medium___Xk-XB_3-2-1","chips-and-input":"magritte-chips-and-input___qg-Ba_3-2-1","chipsAndInput":"magritte-chips-and-input___qg-Ba_3-2-1","field-input":"magritte-field-input___04Cag_3-2-1","fieldInput":"magritte-field-input___04Cag_3-2-1","label-wrapper":"magritte-label-wrapper___De7Bm_3-2-1","labelWrapper":"magritte-label-wrapper___De7Bm_3-2-1","icon_expanded":"magritte-icon_expanded___RaOT-_3-2-1","iconExpanded":"magritte-icon_expanded___RaOT-_3-2-1"};
13
+ var styles = {"root":"magritte-root___-zVdz_3-2-3","focused":"magritte-focused___0Uzyu_3-2-3","invalid":"magritte-invalid___tVzQV_3-2-3","disabled":"magritte-disabled___UeqcV_3-2-3","label":"magritte-label___j7Trt_3-2-3","focus-visible":"magritte-focus-visible___ifvAP_3-2-3","focusVisible":"magritte-focus-visible___ifvAP_3-2-3","large":"magritte-large___JIrIy_3-2-3","field":"magritte-field___rlEmn_3-2-3","icon":"magritte-icon___fDMiz_3-2-3","scrollable-area":"magritte-scrollable-area___-xMF2_3-2-3","scrollableArea":"magritte-scrollable-area___-xMF2_3-2-3","medium":"magritte-medium___Xk-XB_3-2-3","chips-and-input":"magritte-chips-and-input___qg-Ba_3-2-3","chipsAndInput":"magritte-chips-and-input___qg-Ba_3-2-3","field-input":"magritte-field-input___04Cag_3-2-3","fieldInput":"magritte-field-input___04Cag_3-2-3","label-wrapper":"magritte-label-wrapper___De7Bm_3-2-3","labelWrapper":"magritte-label-wrapper___De7Bm_3-2-3","icon_expanded":"magritte-icon_expanded___RaOT-_3-2-3","iconExpanded":"magritte-icon_expanded___RaOT-_3-2-3","custom-chip-wrapper":"magritte-custom-chip-wrapper___a9kJ6_3-2-3","customChipWrapper":"magritte-custom-chip-wrapper___a9kJ6_3-2-3"};
14
14
 
15
15
  const focusOnLastChip = (event, chipsContainer, input) => {
16
16
  if (!chipsContainer || !input) {
@@ -130,9 +130,9 @@ const ChipsTrigger = forwardRef(({ size = 'large', placeholder, disabled, expand
130
130
  stateRef.current.hadFocusWhenClicked = false;
131
131
  stateRef.current.wasExpandedWhenClicked = false;
132
132
  }, tabIndex: disabled ? -1 : 0, "data-qa": dataQa, children: [jsx("div", { style: scrollableAreaStyle, className: styles.scrollableArea, children: jsxs("div", { ref: chipsContainerRef, className: styles.chipsAndInput, children: [state.chips.map((chip, index) => {
133
- return (jsx(CustomChip, { Element: "button", size: "small", disabled: disabled, onDelete: () => {
134
- deleteHandler(index);
135
- }, dataQaWrapper: `chips-trigger-chip-${chip.value}`, children: chip.label ?? chip.value }, `${chip.value}-${index}`));
133
+ return (jsx("div", { className: styles.customChipWrapper, onMouseDown: (event) => event.preventDefault(), children: jsx(CustomChip, { Element: "button", size: "small", disabled: disabled, onDelete: () => {
134
+ deleteHandler(index);
135
+ }, dataQaWrapper: `chips-trigger-chip-${chip.value}`, deleteOnly: true, children: chip.label ?? chip.value }) }, `${chip.value}-${index}`));
136
136
  }), jsxs("div", { className: styles.field, children: [jsx("input", { ref: inputRefCallback, className: styles.fieldInput, type: "text", disabled: disabled, value: state.value, onKeyDown: keyDownHandler, onFocus: focusHandler, onBlur: blurHandler, onChange: changeHandler, "data-qa": "chips-trigger-input", readOnly: isMobile }), showLabel && (jsx("div", { className: styles.labelWrapper, children: jsx("label", { className: styles.label, children: placeholder }) }))] })] }) }), jsx("div", { className: classnames(styles.icon, {
137
137
  [styles.iconExpanded]: expanded || externalExpanded,
138
138
  }), children: jsx(ChevronDownOutlinedSize24, {}) })] }), jsx(FormHelper, { description: description, errorMessage: errorMessage, disabled: disabled, invalid: invalid })] }));
package/ChipsTrigger.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ChipsTrigger.js","sources":["../src/ChipsTrigger.tsx"],"sourcesContent":["import {\n forwardRef,\n InputHTMLAttributes,\n useState,\n useCallback,\n KeyboardEventHandler,\n useRef,\n SyntheticEvent,\n useEffect,\n} from 'react';\nimport classnames from 'classnames';\n\nimport { findNextFocusableElement, keyboardKeys, keyboardMatch } from '@hh.ru/magritte-common-keyboard';\nimport { useMultipleRefs } from '@hh.ru/magritte-common-use-multiple-refs';\nimport { useBreakpoint } from '@hh.ru/magritte-ui-breakpoint';\nimport { CustomChip } from '@hh.ru/magritte-ui-chips';\nimport { ChipsTriggerProps } from '@hh.ru/magritte-ui-chips-trigger/types';\nimport { FormHelper } from '@hh.ru/magritte-ui-form-helper';\nimport { ChevronDownOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';\nimport { useFocus } from '@hh.ru/magritte-ui-input/useFocus';\n\nimport styles from './chips-trigger.less';\n\nconst focusOnLastChip = (event: SyntheticEvent, chipsContainer: HTMLElement | null, input: HTMLElement | null) => {\n if (!chipsContainer || !input) {\n return;\n }\n const nextFocusableElement = findNextFocusableElement(chipsContainer, input, 'left', 'list');\n if (nextFocusableElement !== null) {\n event.preventDefault();\n nextFocusableElement.focus();\n }\n};\n\ntype State = {\n hadFocusWhenClicked: boolean;\n wasExpandedWhenClicked: boolean;\n};\n\nexport const ChipsTrigger = forwardRef<\n HTMLInputElement,\n ChipsTriggerProps & Omit<InputHTMLAttributes<HTMLInputElement>, keyof ChipsTriggerProps>\n>(\n (\n {\n size = 'large',\n placeholder,\n disabled,\n expanded: externalExpanded,\n toggleExpanded: toggleExternalExpanded,\n state,\n invalid,\n maxHeight,\n description,\n errorMessage,\n wrapperRef,\n onChange,\n onFocus,\n onBlur,\n onKeyDown,\n onChangeInput: onChangeInputExternal,\n allowArbitraryValues = true,\n 'data-qa': dataQa = 'chips-trigger',\n },\n ref\n ) => {\n const { isMobile } = useBreakpoint();\n const [expanded, setExpanded] = useState(false);\n const [isFocusVisible, setFocusVisible] = useState(false);\n const stateRef = useRef<State>({ hadFocusWhenClicked: false, wasExpandedWhenClicked: false });\n\n const chipsRootRef = useRef<HTMLDivElement>(null);\n const chipsRootRefCallback = useMultipleRefs(wrapperRef, chipsRootRef);\n const chipsContainerRef = useRef<HTMLDivElement>(null);\n const inputRef = useRef<HTMLInputElement>(null);\n const inputRefCallback = useMultipleRefs(ref, inputRef);\n const showLabel = state.value === '' && state.chips.length === 0 && placeholder !== '';\n\n const onChangeInput = useCallback(\n (value: string) => {\n onChange({\n value,\n chips: state.chips,\n event: { type: 'change', modifier: 'keyboard' },\n });\n onChangeInputExternal?.(value);\n },\n [state.chips, onChange, onChangeInputExternal]\n );\n const { changeHandler, focusHandler, blurHandler, isFocused } = useFocus(onChangeInput, onFocus, onBlur);\n\n useEffect(() => {\n if (inputRef.current) {\n setFocusVisible(isFocused && inputRef.current.classList.contains('focus-visible'));\n }\n }, [isFocused]);\n\n const deleteHandler = useCallback(\n (index: number) => {\n const deletedChip = state.chips.splice(index, 1);\n onChange({\n value: state.value,\n chips: [...state.chips],\n event: { type: 'remove', modifier: 'cross', element: deletedChip?.[0] },\n });\n // не теряем фокус с инпута\n inputRef.current?.focus();\n },\n [onChange, state.chips, state.value]\n );\n\n const keyDownHandler = useCallback<KeyboardEventHandler>(\n (event) => {\n // создаем новый чипс и затираем текстовый инпут\n if (allowArbitraryValues && keyboardMatch(event.nativeEvent, keyboardKeys.Enter)) {\n if (state.value.length === 0) {\n return;\n }\n onChange({\n value: '',\n chips: [...state.chips, { value: state.value }],\n event: { type: 'add', modifier: 'enter' },\n });\n onChangeInputExternal?.('');\n }\n // удаляем последний созданный чипс\n if (state.value === '' && keyboardMatch(event.nativeEvent, keyboardKeys.Backspace)) {\n if (state.chips.length === 0) {\n return;\n }\n const deletedChip = state.chips.pop();\n onChange({\n value: state.value,\n chips: [...state.chips],\n event: { type: 'remove', modifier: 'backspace', element: deletedChip },\n });\n }\n // пытаемся найти ближайший чипс для фокуса\n if (state.value === '' && keyboardMatch(event.nativeEvent, keyboardKeys.ArrowLeft)) {\n focusOnLastChip(event, chipsContainerRef.current, inputRef.current);\n }\n },\n [allowArbitraryValues, onChange, onChangeInputExternal, state]\n );\n\n // при выставлении высоты учитваем падинги\n // иначе высота будет больше значения свойства\n const scrollableAreaStyle = maxHeight\n ? { maxHeight: `${maxHeight - (size === 'medium' ? 16 : 24)}px` }\n : undefined;\n\n return (\n <div>\n <div\n ref={chipsRootRefCallback}\n className={classnames(styles.root, styles[size], {\n [styles.focused]: isFocused,\n [styles.focusVisible]: isFocusVisible,\n [styles.disabled]: !!disabled,\n [styles.invalid]: !!invalid,\n })}\n onFocus={() => {\n if (disabled) {\n return;\n }\n if (!inputRef.current) {\n return;\n }\n setExpanded(true);\n // добавляем .focus() еще и тут\n // чтобы не сбрасывать фокус во время клика по chip\n // или по клику на враппер\n if (document.activeElement === chipsRootRef.current) {\n inputRef.current.focus();\n }\n }}\n onBlur={(event) => {\n stateRef.current.hadFocusWhenClicked &&=\n event.relatedTarget === chipsRootRef.current || event.relatedTarget === inputRef.current;\n setExpanded(false);\n }}\n onKeyDown={onKeyDown}\n onMouseDown={() => {\n // при повторном клике по инпуту в фокусе нужно закрыть дроп\n // при этом клик может прийтись на обертку, из-за чего инпут поймает blur и повторный фокус\n // что усложняет проверку того, что инпут уже был в фокусе в момент клика\n // поэтому в цепочке mouseDown -> blur -> focus -> click храним флаг, что фокус не вышел за пределы компонента\n stateRef.current.hadFocusWhenClicked = document.activeElement === inputRef.current;\n stateRef.current.wasExpandedWhenClicked = !!externalExpanded;\n }}\n onClick={() => {\n if (\n stateRef.current.hadFocusWhenClicked &&\n stateRef.current.wasExpandedWhenClicked === externalExpanded\n ) {\n toggleExternalExpanded?.();\n }\n stateRef.current.hadFocusWhenClicked = false;\n stateRef.current.wasExpandedWhenClicked = false;\n }}\n tabIndex={disabled ? -1 : 0}\n data-qa={dataQa}\n >\n <div style={scrollableAreaStyle} className={styles.scrollableArea}>\n <div ref={chipsContainerRef} className={styles.chipsAndInput}>\n {state.chips.map((chip, index) => {\n return (\n <CustomChip\n Element=\"button\"\n key={`${chip.value}-${index}`}\n size=\"small\"\n disabled={disabled}\n onDelete={() => {\n deleteHandler(index);\n }}\n dataQaWrapper={`chips-trigger-chip-${chip.value}`}\n >\n {chip.label ?? chip.value}\n </CustomChip>\n );\n })}\n <div className={styles.field}>\n <input\n ref={inputRefCallback}\n className={styles.fieldInput}\n type=\"text\"\n disabled={disabled}\n value={state.value}\n onKeyDown={keyDownHandler}\n onFocus={focusHandler}\n onBlur={blurHandler}\n onChange={changeHandler}\n data-qa=\"chips-trigger-input\"\n readOnly={isMobile}\n />\n {showLabel && (\n <div className={styles.labelWrapper}>\n <label className={styles.label}>{placeholder}</label>\n </div>\n )}\n </div>\n </div>\n </div>\n <div\n className={classnames(styles.icon, {\n [styles.iconExpanded]: expanded || externalExpanded,\n })}\n >\n <ChevronDownOutlinedSize24 />\n </div>\n </div>\n <FormHelper\n description={description}\n errorMessage={errorMessage}\n disabled={disabled}\n invalid={invalid}\n />\n </div>\n );\n }\n);\n\nChipsTrigger.displayName = 'ChipsTrigger';\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;;;;;;;AAuBA,MAAM,eAAe,GAAG,CAAC,KAAqB,EAAE,cAAkC,EAAE,KAAyB,KAAI;AAC7G,IAAA,IAAI,CAAC,cAAc,IAAI,CAAC,KAAK,EAAE;QAC3B,OAAO;KACV;AACD,IAAA,MAAM,oBAAoB,GAAG,wBAAwB,CAAC,cAAc,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC;AAC7F,IAAA,IAAI,oBAAoB,KAAK,IAAI,EAAE;QAC/B,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,oBAAoB,CAAC,KAAK,EAAE,CAAC;KAChC;AACL,CAAC,CAAC;AAOK,MAAM,YAAY,GAAG,UAAU,CAIlC,CACI,EACI,IAAI,GAAG,OAAO,EACd,WAAW,EACX,QAAQ,EACR,QAAQ,EAAE,gBAAgB,EAC1B,cAAc,EAAE,sBAAsB,EACtC,KAAK,EACL,OAAO,EACP,SAAS,EACT,WAAW,EACX,YAAY,EACZ,UAAU,EACV,QAAQ,EACR,OAAO,EACP,MAAM,EACN,SAAS,EACT,aAAa,EAAE,qBAAqB,EACpC,oBAAoB,GAAG,IAAI,EAC3B,SAAS,EAAE,MAAM,GAAG,eAAe,GACtC,EACD,GAAG,KACH;AACA,IAAA,MAAM,EAAE,QAAQ,EAAE,GAAG,aAAa,EAAE,CAAC;IACrC,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAChD,MAAM,CAAC,cAAc,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;AAC1D,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAQ,EAAE,mBAAmB,EAAE,KAAK,EAAE,sBAAsB,EAAE,KAAK,EAAE,CAAC,CAAC;AAE9F,IAAA,MAAM,YAAY,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAClD,MAAM,oBAAoB,GAAG,eAAe,CAAC,UAAU,EAAE,YAAY,CAAC,CAAC;AACvE,IAAA,MAAM,iBAAiB,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;AACvD,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IAChD,MAAM,gBAAgB,GAAG,eAAe,CAAC,GAAG,EAAE,QAAQ,CAAC,CAAC;AACxD,IAAA,MAAM,SAAS,GAAG,KAAK,CAAC,KAAK,KAAK,EAAE,IAAI,KAAK,CAAC,KAAK,CAAC,MAAM,KAAK,CAAC,IAAI,WAAW,KAAK,EAAE,CAAC;AAEvF,IAAA,MAAM,aAAa,GAAG,WAAW,CAC7B,CAAC,KAAa,KAAI;AACd,QAAA,QAAQ,CAAC;YACL,KAAK;YACL,KAAK,EAAE,KAAK,CAAC,KAAK;YAClB,KAAK,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,QAAQ,EAAE,UAAU,EAAE;AAClD,SAAA,CAAC,CAAC;AACH,QAAA,qBAAqB,GAAG,KAAK,CAAC,CAAC;KAClC,EACD,CAAC,KAAK,CAAC,KAAK,EAAE,QAAQ,EAAE,qBAAqB,CAAC,CACjD,CAAC;AACF,IAAA,MAAM,EAAE,aAAa,EAAE,YAAY,EAAE,WAAW,EAAE,SAAS,EAAE,GAAG,QAAQ,CAAC,aAAa,EAAE,OAAO,EAAE,MAAM,CAAC,CAAC;IAEzG,SAAS,CAAC,MAAK;AACX,QAAA,IAAI,QAAQ,CAAC,OAAO,EAAE;AAClB,YAAA,eAAe,CAAC,SAAS,IAAI,QAAQ,CAAC,OAAO,CAAC,SAAS,CAAC,QAAQ,CAAC,eAAe,CAAC,CAAC,CAAC;SACtF;AACL,KAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;AAEhB,IAAA,MAAM,aAAa,GAAG,WAAW,CAC7B,CAAC,KAAa,KAAI;AACd,QAAA,MAAM,WAAW,GAAG,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;AACjD,QAAA,QAAQ,CAAC;YACL,KAAK,EAAE,KAAK,CAAC,KAAK;AAClB,YAAA,KAAK,EAAE,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC;AACvB,YAAA,KAAK,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAE,WAAW,GAAG,CAAC,CAAC,EAAE;AAC1E,SAAA,CAAC,CAAC;;AAEH,QAAA,QAAQ,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;AAC9B,KAAC,EACD,CAAC,QAAQ,EAAE,KAAK,CAAC,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,CACvC,CAAC;AAEF,IAAA,MAAM,cAAc,GAAG,WAAW,CAC9B,CAAC,KAAK,KAAI;;AAEN,QAAA,IAAI,oBAAoB,IAAI,aAAa,CAAC,KAAK,CAAC,WAAW,EAAE,YAAY,CAAC,KAAK,CAAC,EAAE;YAC9E,IAAI,KAAK,CAAC,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE;gBAC1B,OAAO;aACV;AACD,YAAA,QAAQ,CAAC;AACL,gBAAA,KAAK,EAAE,EAAE;AACT,gBAAA,KAAK,EAAE,CAAC,GAAG,KAAK,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,CAAC;gBAC/C,KAAK,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE;AAC5C,aAAA,CAAC,CAAC;AACH,YAAA,qBAAqB,GAAG,EAAE,CAAC,CAAC;SAC/B;;AAED,QAAA,IAAI,KAAK,CAAC,KAAK,KAAK,EAAE,IAAI,aAAa,CAAC,KAAK,CAAC,WAAW,EAAE,YAAY,CAAC,SAAS,CAAC,EAAE;YAChF,IAAI,KAAK,CAAC,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE;gBAC1B,OAAO;aACV;YACD,MAAM,WAAW,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC;AACtC,YAAA,QAAQ,CAAC;gBACL,KAAK,EAAE,KAAK,CAAC,KAAK;AAClB,gBAAA,KAAK,EAAE,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC;AACvB,gBAAA,KAAK,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,QAAQ,EAAE,WAAW,EAAE,OAAO,EAAE,WAAW,EAAE;AACzE,aAAA,CAAC,CAAC;SACN;;AAED,QAAA,IAAI,KAAK,CAAC,KAAK,KAAK,EAAE,IAAI,aAAa,CAAC,KAAK,CAAC,WAAW,EAAE,YAAY,CAAC,SAAS,CAAC,EAAE;YAChF,eAAe,CAAC,KAAK,EAAE,iBAAiB,CAAC,OAAO,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAC;SACvE;KACJ,EACD,CAAC,oBAAoB,EAAE,QAAQ,EAAE,qBAAqB,EAAE,KAAK,CAAC,CACjE,CAAC;;;IAIF,MAAM,mBAAmB,GAAG,SAAS;UAC/B,EAAE,SAAS,EAAE,GAAG,SAAS,IAAI,IAAI,KAAK,QAAQ,GAAG,EAAE,GAAG,EAAE,CAAC,CAAA,EAAA,CAAI,EAAE;UAC/D,SAAS,CAAC;AAEhB,IAAA,QACIA,IACI,CAAA,KAAA,EAAA,EAAA,QAAA,EAAA,CAAAA,IAAA,CAAA,KAAA,EAAA,EACI,GAAG,EAAE,oBAAoB,EACzB,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,IAAI,CAAC,EAAE;AAC7C,oBAAA,CAAC,MAAM,CAAC,OAAO,GAAG,SAAS;AAC3B,oBAAA,CAAC,MAAM,CAAC,YAAY,GAAG,cAAc;AACrC,oBAAA,CAAC,MAAM,CAAC,QAAQ,GAAG,CAAC,CAAC,QAAQ;AAC7B,oBAAA,CAAC,MAAM,CAAC,OAAO,GAAG,CAAC,CAAC,OAAO;AAC9B,iBAAA,CAAC,EACF,OAAO,EAAE,MAAK;oBACV,IAAI,QAAQ,EAAE;wBACV,OAAO;qBACV;AACD,oBAAA,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE;wBACnB,OAAO;qBACV;oBACD,WAAW,CAAC,IAAI,CAAC,CAAC;;;;oBAIlB,IAAI,QAAQ,CAAC,aAAa,KAAK,YAAY,CAAC,OAAO,EAAE;AACjD,wBAAA,QAAQ,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;qBAC5B;AACL,iBAAC,EACD,MAAM,EAAE,CAAC,KAAK,KAAI;oBACd,QAAQ,CAAC,OAAO,CAAC,mBAAmB;AAChC,wBAAA,KAAK,CAAC,aAAa,KAAK,YAAY,CAAC,OAAO,IAAI,KAAK,CAAC,aAAa,KAAK,QAAQ,CAAC,OAAO,CAAC;oBAC7F,WAAW,CAAC,KAAK,CAAC,CAAC;iBACtB,EACD,SAAS,EAAE,SAAS,EACpB,WAAW,EAAE,MAAK;;;;;AAKd,oBAAA,QAAQ,CAAC,OAAO,CAAC,mBAAmB,GAAG,QAAQ,CAAC,aAAa,KAAK,QAAQ,CAAC,OAAO,CAAC;oBACnF,QAAQ,CAAC,OAAO,CAAC,sBAAsB,GAAG,CAAC,CAAC,gBAAgB,CAAC;AACjE,iBAAC,EACD,OAAO,EAAE,MAAK;AACV,oBAAA,IACI,QAAQ,CAAC,OAAO,CAAC,mBAAmB;AACpC,wBAAA,QAAQ,CAAC,OAAO,CAAC,sBAAsB,KAAK,gBAAgB,EAC9D;wBACE,sBAAsB,IAAI,CAAC;qBAC9B;AACD,oBAAA,QAAQ,CAAC,OAAO,CAAC,mBAAmB,GAAG,KAAK,CAAC;AAC7C,oBAAA,QAAQ,CAAC,OAAO,CAAC,sBAAsB,GAAG,KAAK,CAAC;iBACnD,EACD,QAAQ,EAAE,QAAQ,GAAG,CAAC,CAAC,GAAG,CAAC,EAAA,SAAA,EAClB,MAAM,EAEf,QAAA,EAAA,CAAAC,GAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAE,mBAAmB,EAAE,SAAS,EAAE,MAAM,CAAC,cAAc,EAAA,QAAA,EAC7DD,cAAK,GAAG,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,CAAC,aAAa,aACvD,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,KAAI;AAC7B,oCAAA,QACIC,GAAC,CAAA,UAAU,IACP,OAAO,EAAC,QAAQ,EAEhB,IAAI,EAAC,OAAO,EACZ,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,MAAK;4CACX,aAAa,CAAC,KAAK,CAAC,CAAC;yCACxB,EACD,aAAa,EAAE,CAAsB,mBAAA,EAAA,IAAI,CAAC,KAAK,CAAE,CAAA,EAAA,QAAA,EAEhD,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,EARpB,EAAA,CAAA,EAAG,IAAI,CAAC,KAAK,CAAA,CAAA,EAAI,KAAK,CAAA,CAAE,CASpB,EACf;AACN,iCAAC,CAAC,EACFD,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,MAAM,CAAC,KAAK,EAAA,QAAA,EAAA,CACxBC,eACI,GAAG,EAAE,gBAAgB,EACrB,SAAS,EAAE,MAAM,CAAC,UAAU,EAC5B,IAAI,EAAC,MAAM,EACX,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,SAAS,EAAE,cAAc,EACzB,OAAO,EAAE,YAAY,EACrB,MAAM,EAAE,WAAW,EACnB,QAAQ,EAAE,aAAa,EAAA,SAAA,EACf,qBAAqB,EAC7B,QAAQ,EAAE,QAAQ,EAAA,CACpB,EACD,SAAS,KACNA,GAAK,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,MAAM,CAAC,YAAY,EAC/B,QAAA,EAAAA,GAAA,CAAA,OAAA,EAAA,EAAO,SAAS,EAAE,MAAM,CAAC,KAAK,EAAA,QAAA,EAAG,WAAW,EAAS,CAAA,EAAA,CACnD,CACT,CACC,EAAA,CAAA,CAAA,EAAA,CACJ,GACJ,EACNA,GAAA,CAAA,KAAA,EAAA,EACI,SAAS,EAAE,UAAU,CAAC,MAAM,CAAC,IAAI,EAAE;AAC/B,4BAAA,CAAC,MAAM,CAAC,YAAY,GAAG,QAAQ,IAAI,gBAAgB;AACtD,yBAAA,CAAC,EAEF,QAAA,EAAAA,GAAA,CAAC,yBAAyB,EAAA,EAAA,CAAG,EAC3B,CAAA,CAAA,EAAA,CACJ,EACNA,GAAA,CAAC,UAAU,EAAA,EACP,WAAW,EAAE,WAAW,EACxB,YAAY,EAAE,YAAY,EAC1B,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,OAAO,EAAA,CAClB,CACA,EAAA,CAAA,EACR;AACN,CAAC,EACH;AAEF,YAAY,CAAC,WAAW,GAAG,cAAc;;;;"}
1
+ {"version":3,"file":"ChipsTrigger.js","sources":["../src/ChipsTrigger.tsx"],"sourcesContent":["import {\n forwardRef,\n InputHTMLAttributes,\n useState,\n useCallback,\n KeyboardEventHandler,\n useRef,\n SyntheticEvent,\n useEffect,\n} from 'react';\nimport classnames from 'classnames';\n\nimport { findNextFocusableElement, keyboardKeys, keyboardMatch } from '@hh.ru/magritte-common-keyboard';\nimport { useMultipleRefs } from '@hh.ru/magritte-common-use-multiple-refs';\nimport { useBreakpoint } from '@hh.ru/magritte-ui-breakpoint';\nimport { CustomChip } from '@hh.ru/magritte-ui-chips';\nimport { ChipsTriggerProps } from '@hh.ru/magritte-ui-chips-trigger/types';\nimport { FormHelper } from '@hh.ru/magritte-ui-form-helper';\nimport { ChevronDownOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';\nimport { useFocus } from '@hh.ru/magritte-ui-input/useFocus';\n\nimport styles from './chips-trigger.less';\n\nconst focusOnLastChip = (event: SyntheticEvent, chipsContainer: HTMLElement | null, input: HTMLElement | null) => {\n if (!chipsContainer || !input) {\n return;\n }\n const nextFocusableElement = findNextFocusableElement(chipsContainer, input, 'left', 'list');\n if (nextFocusableElement !== null) {\n event.preventDefault();\n nextFocusableElement.focus();\n }\n};\n\ntype State = {\n hadFocusWhenClicked: boolean;\n wasExpandedWhenClicked: boolean;\n};\n\nexport const ChipsTrigger = forwardRef<\n HTMLInputElement,\n ChipsTriggerProps & Omit<InputHTMLAttributes<HTMLInputElement>, keyof ChipsTriggerProps>\n>(\n (\n {\n size = 'large',\n placeholder,\n disabled,\n expanded: externalExpanded,\n toggleExpanded: toggleExternalExpanded,\n state,\n invalid,\n maxHeight,\n description,\n errorMessage,\n wrapperRef,\n onChange,\n onFocus,\n onBlur,\n onKeyDown,\n onChangeInput: onChangeInputExternal,\n allowArbitraryValues = true,\n 'data-qa': dataQa = 'chips-trigger',\n },\n ref\n ) => {\n const { isMobile } = useBreakpoint();\n const [expanded, setExpanded] = useState(false);\n const [isFocusVisible, setFocusVisible] = useState(false);\n const stateRef = useRef<State>({ hadFocusWhenClicked: false, wasExpandedWhenClicked: false });\n\n const chipsRootRef = useRef<HTMLDivElement>(null);\n const chipsRootRefCallback = useMultipleRefs(wrapperRef, chipsRootRef);\n const chipsContainerRef = useRef<HTMLDivElement>(null);\n const inputRef = useRef<HTMLInputElement>(null);\n const inputRefCallback = useMultipleRefs(ref, inputRef);\n const showLabel = state.value === '' && state.chips.length === 0 && placeholder !== '';\n\n const onChangeInput = useCallback(\n (value: string) => {\n onChange({\n value,\n chips: state.chips,\n event: { type: 'change', modifier: 'keyboard' },\n });\n onChangeInputExternal?.(value);\n },\n [state.chips, onChange, onChangeInputExternal]\n );\n const { changeHandler, focusHandler, blurHandler, isFocused } = useFocus(onChangeInput, onFocus, onBlur);\n\n useEffect(() => {\n if (inputRef.current) {\n setFocusVisible(isFocused && inputRef.current.classList.contains('focus-visible'));\n }\n }, [isFocused]);\n\n const deleteHandler = useCallback(\n (index: number) => {\n const deletedChip = state.chips.splice(index, 1);\n onChange({\n value: state.value,\n chips: [...state.chips],\n event: { type: 'remove', modifier: 'cross', element: deletedChip?.[0] },\n });\n // не теряем фокус с инпута\n inputRef.current?.focus();\n },\n [onChange, state.chips, state.value]\n );\n\n const keyDownHandler = useCallback<KeyboardEventHandler>(\n (event) => {\n // создаем новый чипс и затираем текстовый инпут\n if (allowArbitraryValues && keyboardMatch(event.nativeEvent, keyboardKeys.Enter)) {\n if (state.value.length === 0) {\n return;\n }\n onChange({\n value: '',\n chips: [...state.chips, { value: state.value }],\n event: { type: 'add', modifier: 'enter' },\n });\n onChangeInputExternal?.('');\n }\n // удаляем последний созданный чипс\n if (state.value === '' && keyboardMatch(event.nativeEvent, keyboardKeys.Backspace)) {\n if (state.chips.length === 0) {\n return;\n }\n const deletedChip = state.chips.pop();\n onChange({\n value: state.value,\n chips: [...state.chips],\n event: { type: 'remove', modifier: 'backspace', element: deletedChip },\n });\n }\n // пытаемся найти ближайший чипс для фокуса\n if (state.value === '' && keyboardMatch(event.nativeEvent, keyboardKeys.ArrowLeft)) {\n focusOnLastChip(event, chipsContainerRef.current, inputRef.current);\n }\n },\n [allowArbitraryValues, onChange, onChangeInputExternal, state]\n );\n\n // при выставлении высоты учитваем падинги\n // иначе высота будет больше значения свойства\n const scrollableAreaStyle = maxHeight\n ? { maxHeight: `${maxHeight - (size === 'medium' ? 16 : 24)}px` }\n : undefined;\n\n return (\n <div>\n <div\n ref={chipsRootRefCallback}\n className={classnames(styles.root, styles[size], {\n [styles.focused]: isFocused,\n [styles.focusVisible]: isFocusVisible,\n [styles.disabled]: !!disabled,\n [styles.invalid]: !!invalid,\n })}\n onFocus={() => {\n if (disabled) {\n return;\n }\n if (!inputRef.current) {\n return;\n }\n setExpanded(true);\n // добавляем .focus() еще и тут\n // чтобы не сбрасывать фокус во время клика по chip\n // или по клику на враппер\n if (document.activeElement === chipsRootRef.current) {\n inputRef.current.focus();\n }\n }}\n onBlur={(event) => {\n stateRef.current.hadFocusWhenClicked &&=\n event.relatedTarget === chipsRootRef.current || event.relatedTarget === inputRef.current;\n setExpanded(false);\n }}\n onKeyDown={onKeyDown}\n onMouseDown={() => {\n // при повторном клике по инпуту в фокусе нужно закрыть дроп\n // при этом клик может прийтись на обертку, из-за чего инпут поймает blur и повторный фокус\n // что усложняет проверку того, что инпут уже был в фокусе в момент клика\n // поэтому в цепочке mouseDown -> blur -> focus -> click храним флаг, что фокус не вышел за пределы компонента\n stateRef.current.hadFocusWhenClicked = document.activeElement === inputRef.current;\n stateRef.current.wasExpandedWhenClicked = !!externalExpanded;\n }}\n onClick={() => {\n if (\n stateRef.current.hadFocusWhenClicked &&\n stateRef.current.wasExpandedWhenClicked === externalExpanded\n ) {\n toggleExternalExpanded?.();\n }\n stateRef.current.hadFocusWhenClicked = false;\n stateRef.current.wasExpandedWhenClicked = false;\n }}\n tabIndex={disabled ? -1 : 0}\n data-qa={dataQa}\n >\n <div style={scrollableAreaStyle} className={styles.scrollableArea}>\n <div ref={chipsContainerRef} className={styles.chipsAndInput}>\n {state.chips.map((chip, index) => {\n return (\n <div\n key={`${chip.value}-${index}`}\n className={styles.customChipWrapper}\n onMouseDown={(event) => event.preventDefault()}\n >\n <CustomChip\n Element=\"button\"\n size=\"small\"\n disabled={disabled}\n onDelete={() => {\n deleteHandler(index);\n }}\n dataQaWrapper={`chips-trigger-chip-${chip.value}`}\n deleteOnly\n >\n {chip.label ?? chip.value}\n </CustomChip>\n </div>\n );\n })}\n <div className={styles.field}>\n <input\n ref={inputRefCallback}\n className={styles.fieldInput}\n type=\"text\"\n disabled={disabled}\n value={state.value}\n onKeyDown={keyDownHandler}\n onFocus={focusHandler}\n onBlur={blurHandler}\n onChange={changeHandler}\n data-qa=\"chips-trigger-input\"\n readOnly={isMobile}\n />\n {showLabel && (\n <div className={styles.labelWrapper}>\n <label className={styles.label}>{placeholder}</label>\n </div>\n )}\n </div>\n </div>\n </div>\n <div\n className={classnames(styles.icon, {\n [styles.iconExpanded]: expanded || externalExpanded,\n })}\n >\n <ChevronDownOutlinedSize24 />\n </div>\n </div>\n <FormHelper\n description={description}\n errorMessage={errorMessage}\n disabled={disabled}\n invalid={invalid}\n />\n </div>\n );\n }\n);\n\nChipsTrigger.displayName = 'ChipsTrigger';\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
package/index.css CHANGED
@@ -70,7 +70,7 @@
70
70
  --magritte-color-component-input-chips-background-state-neutral-disable-v19-1-2:#1B1B1B;
71
71
  --magritte-color-component-input-chips-text-state-neutral-disable-v19-1-2:#474747;
72
72
  }
73
- .magritte-root___-zVdz_3-2-1{
73
+ .magritte-root___-zVdz_3-2-3{
74
74
  display:inline-flex;
75
75
  position:relative;
76
76
  width:100%;
@@ -85,106 +85,106 @@
85
85
  --magritte-ui-icon-color-override:var(--magritte-color-component-input-icon-chevron-v19-1-2);
86
86
  }
87
87
  @media (min-width: 1020px){
88
- body.magritte-old-layout .magritte-root___-zVdz_3-2-1:not(.magritte-focused___0Uzyu_3-2-1):not(.magritte-invalid___tVzQV_3-2-1):not(.magritte-disabled___UeqcV_3-2-1):hover{
88
+ body.magritte-old-layout .magritte-root___-zVdz_3-2-3:not(.magritte-focused___0Uzyu_3-2-3):not(.magritte-invalid___tVzQV_3-2-3):not(.magritte-disabled___UeqcV_3-2-3):hover{
89
89
  background-color:var(--magritte-color-component-input-background-state-field-hovered-v19-1-2);
90
90
  box-shadow:inset 0 0 0 1px var(--magritte-color-component-input-stroke-state-field-hovered-v19-1-2);
91
91
  --magritte-ui-icon-color-override:var(--magritte-color-component-input-icon-state-chevron-hovered-v19-1-2);
92
92
  }
93
- body.magritte-old-layout .magritte-root___-zVdz_3-2-1:not(.magritte-focused___0Uzyu_3-2-1):not(.magritte-invalid___tVzQV_3-2-1):not(.magritte-disabled___UeqcV_3-2-1):hover .magritte-label___j7Trt_3-2-1{
93
+ body.magritte-old-layout .magritte-root___-zVdz_3-2-3:not(.magritte-focused___0Uzyu_3-2-3):not(.magritte-invalid___tVzQV_3-2-3):not(.magritte-disabled___UeqcV_3-2-3):hover .magritte-label___j7Trt_3-2-3{
94
94
  color:var(--magritte-color-component-input-text-state-placeholder-hovered-v19-1-2);
95
95
  }
96
96
  }
97
97
  @media (min-width: 1024px){
98
- body:not(.magritte-old-layout) .magritte-root___-zVdz_3-2-1:not(.magritte-focused___0Uzyu_3-2-1):not(.magritte-invalid___tVzQV_3-2-1):not(.magritte-disabled___UeqcV_3-2-1):hover{
98
+ body:not(.magritte-old-layout) .magritte-root___-zVdz_3-2-3:not(.magritte-focused___0Uzyu_3-2-3):not(.magritte-invalid___tVzQV_3-2-3):not(.magritte-disabled___UeqcV_3-2-3):hover{
99
99
  background-color:var(--magritte-color-component-input-background-state-field-hovered-v19-1-2);
100
100
  box-shadow:inset 0 0 0 1px var(--magritte-color-component-input-stroke-state-field-hovered-v19-1-2);
101
101
  --magritte-ui-icon-color-override:var(--magritte-color-component-input-icon-state-chevron-hovered-v19-1-2);
102
102
  }
103
- body:not(.magritte-old-layout) .magritte-root___-zVdz_3-2-1:not(.magritte-focused___0Uzyu_3-2-1):not(.magritte-invalid___tVzQV_3-2-1):not(.magritte-disabled___UeqcV_3-2-1):hover .magritte-label___j7Trt_3-2-1{
103
+ body:not(.magritte-old-layout) .magritte-root___-zVdz_3-2-3:not(.magritte-focused___0Uzyu_3-2-3):not(.magritte-invalid___tVzQV_3-2-3):not(.magritte-disabled___UeqcV_3-2-3):hover .magritte-label___j7Trt_3-2-3{
104
104
  color:var(--magritte-color-component-input-text-state-placeholder-hovered-v19-1-2);
105
105
  }
106
106
  }
107
- .magritte-root___-zVdz_3-2-1:not(.magritte-disabled___UeqcV_3-2-1){
107
+ .magritte-root___-zVdz_3-2-3:not(.magritte-disabled___UeqcV_3-2-3){
108
108
  cursor:text;
109
109
  }
110
- .magritte-root___-zVdz_3-2-1.magritte-focused___0Uzyu_3-2-1{
110
+ .magritte-root___-zVdz_3-2-3.magritte-focused___0Uzyu_3-2-3{
111
111
  background-color:var(--magritte-color-component-input-background-state-field-focused-v19-1-2);
112
112
  box-shadow:inset 0 0 0 2px var(--magritte-color-component-input-stroke-state-field-focused-v19-1-2);
113
113
  --magritte-ui-icon-color-override:var(--magritte-color-component-input-icon-state-chevron-focused-v19-1-2);
114
114
  }
115
- .magritte-root___-zVdz_3-2-1.magritte-focused___0Uzyu_3-2-1 .magritte-label___j7Trt_3-2-1{
115
+ .magritte-root___-zVdz_3-2-3.magritte-focused___0Uzyu_3-2-3 .magritte-label___j7Trt_3-2-3{
116
116
  color:var(--magritte-color-component-input-text-state-placeholder-focused-v19-1-2);
117
117
  }
118
- .magritte-root___-zVdz_3-2-1.magritte-invalid___tVzQV_3-2-1{
118
+ .magritte-root___-zVdz_3-2-3.magritte-invalid___tVzQV_3-2-3{
119
119
  background-color:var(--magritte-color-component-input-background-state-field-invalid-v19-1-2);
120
120
  box-shadow:inset 0 0 0 1px var(--magritte-color-component-input-stroke-state-field-invalid-v19-1-2);
121
121
  --magritte-ui-icon-color-override:var(--magritte-color-component-input-icon-state-chevron-invalid-v19-1-2);
122
122
  }
123
- .magritte-root___-zVdz_3-2-1.magritte-invalid___tVzQV_3-2-1 .magritte-label___j7Trt_3-2-1{
123
+ .magritte-root___-zVdz_3-2-3.magritte-invalid___tVzQV_3-2-3 .magritte-label___j7Trt_3-2-3{
124
124
  color:var(--magritte-color-component-input-text-state-placeholder-invalid-v19-1-2);
125
125
  }
126
- .magritte-root___-zVdz_3-2-1.magritte-disabled___UeqcV_3-2-1{
126
+ .magritte-root___-zVdz_3-2-3.magritte-disabled___UeqcV_3-2-3{
127
127
  background-color:var(--magritte-color-component-input-background-state-field-disabled-v19-1-2);
128
128
  box-shadow:inset 0 0 0 1px var(--magritte-color-component-input-stroke-state-field-disabled-v19-1-2);
129
129
  --magritte-ui-icon-color-override:var(--magritte-color-component-input-icon-state-chevron-disabled-v19-1-2);
130
130
  --magritte-ui-chip-text-color-override:var(--magritte-color-component-input-chips-text-state-neutral-disable-v19-1-2);
131
131
  --magritte-ui-chip-background-color-override:var(--magritte-color-component-input-chips-background-state-neutral-disable-v19-1-2);
132
132
  }
133
- .magritte-root___-zVdz_3-2-1.magritte-disabled___UeqcV_3-2-1 .magritte-label___j7Trt_3-2-1{
133
+ .magritte-root___-zVdz_3-2-3.magritte-disabled___UeqcV_3-2-3 .magritte-label___j7Trt_3-2-3{
134
134
  color:var(--magritte-color-component-input-text-state-placeholder-disabled-v19-1-2);
135
135
  }
136
- .magritte-root___-zVdz_3-2-1.magritte-focus-visible___ifvAP_3-2-1{
136
+ .magritte-root___-zVdz_3-2-3.magritte-focus-visible___ifvAP_3-2-3{
137
137
  outline:var(--magritte-color-component-input-stroke-state-accent-focused-accessible-v19-1-2) solid 4px;
138
138
  }
139
- .magritte-root___-zVdz_3-2-1.magritte-focus-visible___ifvAP_3-2-1.magritte-invalid___tVzQV_3-2-1{
139
+ .magritte-root___-zVdz_3-2-3.magritte-focus-visible___ifvAP_3-2-3.magritte-invalid___tVzQV_3-2-3{
140
140
  outline-color:var(--magritte-color-component-input-stroke-state-negative-focused-accessible-v19-1-2);
141
141
  }
142
- .magritte-large___JIrIy_3-2-1{
142
+ .magritte-large___JIrIy_3-2-3{
143
143
  padding-left:var(--magritte-static-space-300-v19-1-2);
144
144
  padding-top:var(--magritte-static-space-300-v19-1-2);
145
145
  padding-bottom:var(--magritte-static-space-300-v19-1-2);
146
146
  padding-right:var(--magritte-static-space-50-v19-1-2);
147
147
  }
148
- .magritte-large___JIrIy_3-2-1 .magritte-field___rlEmn_3-2-1{
148
+ .magritte-large___JIrIy_3-2-3 .magritte-field___rlEmn_3-2-3{
149
149
  margin-left:var(--magritte-static-space-100-v19-1-2);
150
150
  }
151
- .magritte-large___JIrIy_3-2-1 .magritte-icon___fDMiz_3-2-1{
151
+ .magritte-large___JIrIy_3-2-3 .magritte-icon___fDMiz_3-2-3{
152
152
  top:var(--magritte-static-space-300-v19-1-2);
153
153
  right:var(--magritte-static-space-400-v19-1-2);
154
154
  }
155
- .magritte-large___JIrIy_3-2-1 .magritte-scrollable-area___-xMF2_3-2-1{
155
+ .magritte-large___JIrIy_3-2-3 .magritte-scrollable-area___-xMF2_3-2-3{
156
156
  padding-right:calc(24px + var(--magritte-static-space-250-v19-1-2) + var(--magritte-static-space-300-v19-1-2));
157
157
  }
158
- .magritte-medium___Xk-XB_3-2-1{
158
+ .magritte-medium___Xk-XB_3-2-3{
159
159
  padding-left:var(--magritte-static-space-200-v19-1-2);
160
160
  padding-top:var(--magritte-static-space-200-v19-1-2);
161
161
  padding-bottom:var(--magritte-static-space-200-v19-1-2);
162
162
  padding-right:var(--magritte-static-space-50-v19-1-2);
163
163
  }
164
- .magritte-medium___Xk-XB_3-2-1 .magritte-field___rlEmn_3-2-1{
164
+ .magritte-medium___Xk-XB_3-2-3 .magritte-field___rlEmn_3-2-3{
165
165
  margin-left:var(--magritte-static-space-100-v19-1-2);
166
166
  }
167
- .magritte-medium___Xk-XB_3-2-1 .magritte-icon___fDMiz_3-2-1{
167
+ .magritte-medium___Xk-XB_3-2-3 .magritte-icon___fDMiz_3-2-3{
168
168
  top:var(--magritte-static-space-200-v19-1-2);
169
169
  right:var(--magritte-static-space-300-v19-1-2);
170
170
  }
171
- .magritte-medium___Xk-XB_3-2-1 .magritte-scrollable-area___-xMF2_3-2-1{
171
+ .magritte-medium___Xk-XB_3-2-3 .magritte-scrollable-area___-xMF2_3-2-3{
172
172
  padding-right:calc(24px + var(--magritte-static-space-150-v19-1-2) + var(--magritte-static-space-300-v19-1-2));
173
173
  }
174
- .magritte-scrollable-area___-xMF2_3-2-1{
174
+ .magritte-scrollable-area___-xMF2_3-2-3{
175
175
  display:flex;
176
176
  align-items:flex-start;
177
177
  overflow-y:auto;
178
178
  width:100%;
179
179
  }
180
- .magritte-chips-and-input___qg-Ba_3-2-1{
180
+ .magritte-chips-and-input___qg-Ba_3-2-3{
181
181
  display:flex;
182
182
  gap:6px;
183
183
  flex-wrap:wrap;
184
184
  align-items:center;
185
185
  width:100%;
186
186
  }
187
- .magritte-field___rlEmn_3-2-1{
187
+ .magritte-field___rlEmn_3-2-3{
188
188
  display:flex;
189
189
  align-items:center;
190
190
  position:relative;
@@ -200,26 +200,26 @@
200
200
  text-transform:var(--magritte-typography-label-2-regular-text-transform-v19-1-2);
201
201
  text-decoration:var(--magritte-typography-label-2-regular-text-decoration-v19-1-2);
202
202
  }
203
- .magritte-field-input___04Cag_3-2-1{
203
+ .magritte-field-input___04Cag_3-2-3{
204
204
  border:0;
205
205
  padding:0;
206
206
  background:none;
207
207
  outline:none;
208
208
  width:100%;
209
209
  }
210
- .magritte-label-wrapper___De7Bm_3-2-1{
210
+ .magritte-label-wrapper___De7Bm_3-2-3{
211
211
  display:flex;
212
212
  align-items:center;
213
213
  position:absolute;
214
214
  height:100%;
215
215
  inset:0;
216
216
  }
217
- .magritte-label___j7Trt_3-2-1{
217
+ .magritte-label___j7Trt_3-2-3{
218
218
  color:var(--magritte-color-component-input-text-placeholder-v19-1-2);
219
219
  overflow:hidden;
220
220
  text-overflow:ellipsis;
221
221
  }
222
- .magritte-icon___fDMiz_3-2-1{
222
+ .magritte-icon___fDMiz_3-2-3{
223
223
  display:inline-flex;
224
224
  margin-left:auto;
225
225
  padding:var(--magritte-static-space-100-v19-1-2) 0;
@@ -228,7 +228,10 @@
228
228
  transition-duration:var(--magritte-semantic-animation-ease-in-out-100-duration-v19-1-2);
229
229
  transition-timing-function:var(--magritte-semantic-animation-ease-in-out-100-timing-function-v19-1-2);
230
230
  }
231
- .magritte-icon_expanded___RaOT-_3-2-1{
231
+ .magritte-icon_expanded___RaOT-_3-2-3{
232
232
  transform:rotate(-180deg);
233
233
  --magritte-ui-icon-color-override:var(--magritte-color-component-input-icon-state-chevron-focused-v19-1-2);
234
234
  }
235
+ .magritte-custom-chip-wrapper___a9kJ6_3-2-3{
236
+ display:inline-flex;
237
+ }
package/index.d.ts CHANGED
@@ -1,3 +1,4 @@
1
+ export * from '@hh.ru/magritte-ui-theme-provider';
1
2
  export * from '@hh.ru/magritte-ui-chips-trigger/ChipsTrigger';
2
3
  export * from '@hh.ru/magritte-ui-chips-trigger/UncontrolledChipsTrigger';
3
4
  export * from '@hh.ru/magritte-ui-chips-trigger/types';
package/index.js CHANGED
@@ -1,4 +1,5 @@
1
1
  import './index.css';
2
+ export * from '@hh.ru/magritte-ui-theme-provider';
2
3
  export { ChipsTrigger } from './ChipsTrigger.js';
3
4
  export { UncontrolledChipsTrigger } from './UncontrolledChipsTrigger.js';
4
5
  import 'react/jsx-runtime';
package/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;"}
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}
package/index.mock.d.ts ADDED
@@ -0,0 +1,5 @@
1
+ import { ForwardRefExoticComponent } from 'react';
2
+ export type * from '@hh.ru/magritte-ui-chips-trigger/types';
3
+ declare const ThemeProvider: any;
4
+ export { ThemeProvider };
5
+ export declare const Input: ForwardRefExoticComponent<Record<string, unknown>>;
package/index.mock.js ADDED
@@ -0,0 +1,40 @@
1
+ import './index.css';
2
+ import { jsxs, jsx } from 'react/jsx-runtime';
3
+ import { forwardRef } from 'react';
4
+
5
+ function enhance(mockComponent, staticProps) {
6
+ // удаляем внутренний свойства реакта, чтобы не перезаписать ими mockComponent
7
+ delete staticProps.type;
8
+ delete staticProps.$$typeof;
9
+ delete staticProps.render;
10
+ for (const prop in staticProps) {
11
+ mockComponent[prop] = staticProps[prop];
12
+ }
13
+ }
14
+ const MockComponent = ({ style, ...props }) => (
15
+ // eslint-disable-next-line @typescript-eslint/ban-ts-comment
16
+ // @ts-ignore
17
+ // eslint-disable-next-line react/jsx-no-undef
18
+ jsx("Magritte-component-mock", { "style-data": style, ...props }));
19
+ /**
20
+ * Возвращает mock React компонента
21
+ */
22
+ const mockComponent = (componentName, staticProps = {}, { withChildren, innerDependence } = {}) => {
23
+ const mockWrapper = forwardRef(({ children, ...props }, ref) => {
24
+ return (
25
+ // eslint-disable-next-line react/jsx-no-undef
26
+ jsxs(MockComponent, { ...props, _component: componentName, children: [innerDependence ? innerDependence(props, ref) : null, withChildren ? children : null] }));
27
+ });
28
+ staticProps && enhance(mockWrapper, staticProps);
29
+ mockWrapper.displayName = 'magritte-ref';
30
+ return mockWrapper;
31
+ };
32
+
33
+ // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
34
+ const { ThemeProvider } = jest.requireActual('@hh.ru/magritte-ui-theme-provider/index');
35
+ const Input = mockComponent('ChipsTrigger', undefined, {
36
+ withChildren: false,
37
+ });
38
+
39
+ export { Input, ThemeProvider };
40
+ //# sourceMappingURL=index.mock.js.map
package/index.mock.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.mock.js","sources":["../../mock-component/lib/setupMockComponent.js","../src/index.mock.ts"],"sourcesContent":["import { jsxs, jsx } from 'react/jsx-runtime';\nimport { forwardRef } from 'react';\n\nfunction enhance(mockComponent, staticProps) {\n // удаляем внутренний свойства реакта, чтобы не перезаписать ими mockComponent\n delete staticProps.type;\n delete staticProps.$$typeof;\n delete staticProps.render;\n for (const prop in staticProps) {\n mockComponent[prop] = staticProps[prop];\n }\n}\nconst MockComponent = ({ style, ...props }) => (\n// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-ignore\n// eslint-disable-next-line react/jsx-no-undef\njsx(\"Magritte-component-mock\", { \"style-data\": style, ...props }));\nconst MockComponentRenderProp = ({ style, ...props }) => (\n// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-ignore\n// eslint-disable-next-line react/jsx-no-undef\njsx(\"Magritte-component-mock-render-prop\", { \"style-data\": style, ...props }));\n/**\n * Возвращает mock React компонента\n */\nconst mockComponent = (componentName, staticProps = {}, { withChildren, innerDependence } = {}) => {\n const mockWrapper = forwardRef(({ children, ...props }, ref) => {\n return (\n // eslint-disable-next-line react/jsx-no-undef\n jsxs(MockComponent, { ...props, _component: componentName, children: [innerDependence ? innerDependence(props, ref) : null, withChildren ? children : null] }));\n });\n staticProps && enhance(mockWrapper, staticProps);\n mockWrapper.displayName = 'magritte-ref';\n return mockWrapper;\n};\n/**\n * Возвращает mock React компонента, который рендерит переданный в него пропс render\n *\n * @param {String} componentName наименование компонента\n * @param {Object} [staticProps] объект со свойствами, которыми необходимо усилить mock\n * @param {Object} [options] параметры мока\n * @param {boolean} [options.withChildren] флаг отвечает за рендеринг children компонента\n * @param {React.Component} [options.innerDependence] Реакт компонент, который рендерится внутри мока.\n * Необходим, когда mock компоненту требуется иметь\n * дополнительные элементы\n */\nconst mockComponentRenderProp = (componentName, staticProps, { withChildren, innerDependence, renderArguments } = { renderArguments: [] }) => {\n const mockWrapper = ({ render, children, ...props }) => (jsxs(MockComponentRenderProp, { ...props, _component: componentName, children: [innerDependence ? innerDependence(props) : null, withChildren ? children : null, render?.(...(renderArguments || []))] }));\n staticProps && enhance(mockWrapper, staticProps);\n mockWrapper.displayName = 'magritte-component-mock-render-prop';\n return mockWrapper;\n};\n\nexport { mockComponent, mockComponentRenderProp };\n//# sourceMappingURL=setupMockComponent.js.map\n","import { ForwardRefExoticComponent } from 'react';\n\nimport { mockComponent } from '@hh.ru/magritte-ui-mock-component';\n\nexport type * from '@hh.ru/magritte-ui-chips-trigger/types';\n\n// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\nconst { ThemeProvider } = jest.requireActual('@hh.ru/magritte-ui-theme-provider/index');\n\nexport { ThemeProvider };\n\nexport const Input: ForwardRefExoticComponent<Record<string, unknown>> = mockComponent('ChipsTrigger', undefined, {\n withChildren: false,\n});\n"],"names":[],"mappings":";;;AAGA,SAAS,OAAO,CAAC,aAAa,EAAE,WAAW,EAAE;AAC7C;AACA,IAAI,OAAO,WAAW,CAAC,IAAI,CAAC;AAC5B,IAAI,OAAO,WAAW,CAAC,QAAQ,CAAC;AAChC,IAAI,OAAO,WAAW,CAAC,MAAM,CAAC;AAC9B,IAAI,KAAK,MAAM,IAAI,IAAI,WAAW,EAAE;AACpC,QAAQ,aAAa,CAAC,IAAI,CAAC,GAAG,WAAW,CAAC,IAAI,CAAC,CAAC;AAChD,KAAK;AACL,CAAC;AACD,MAAM,aAAa,GAAG,CAAC,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE;AAC1C;AACA;AACA;AACA,GAAG,CAAC,yBAAyB,EAAE,EAAE,YAAY,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,CAAC,CAAC,CAAC;AAMnE;AACA;AACA;AACA,MAAM,aAAa,GAAG,CAAC,aAAa,EAAE,WAAW,GAAG,EAAE,EAAE,EAAE,YAAY,EAAE,eAAe,EAAE,GAAG,EAAE,KAAK;AACnG,IAAI,MAAM,WAAW,GAAG,UAAU,CAAC,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,KAAK;AACpE,QAAQ;AACR;AACA,QAAQ,IAAI,CAAC,aAAa,EAAE,EAAE,GAAG,KAAK,EAAE,UAAU,EAAE,aAAa,EAAE,QAAQ,EAAE,CAAC,eAAe,GAAG,eAAe,CAAC,KAAK,EAAE,GAAG,CAAC,GAAG,IAAI,EAAE,YAAY,GAAG,QAAQ,GAAG,IAAI,CAAC,EAAE,CAAC,EAAE;AACxK,KAAK,CAAC,CAAC;AACP,IAAI,WAAW,IAAI,OAAO,CAAC,WAAW,EAAE,WAAW,CAAC,CAAC;AACrD,IAAI,WAAW,CAAC,WAAW,GAAG,cAAc,CAAC;AAC7C,IAAI,OAAO,WAAW,CAAC;AACvB,CAAC;;AC5BD;AACM,MAAA,EAAE,aAAa,EAAE,GAAG,IAAI,CAAC,aAAa,CAAC,yCAAyC,EAAE;MAI3E,KAAK,GAAuD,aAAa,CAAC,cAAc,EAAE,SAAS,EAAE;AAC9G,IAAA,YAAY,EAAE,KAAK;AACtB,CAAA;;;;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hh.ru/magritte-ui-chips-trigger",
3
- "version": "3.2.1",
3
+ "version": "3.2.3",
4
4
  "main": "index.js",
5
5
  "types": "index.d.ts",
6
6
  "sideEffects": [
@@ -33,7 +33,8 @@
33
33
  "@hh.ru/magritte-ui-chips": "5.2.21",
34
34
  "@hh.ru/magritte-ui-form-helper": "1.0.13",
35
35
  "@hh.ru/magritte-ui-icon": "7.9.3",
36
- "@hh.ru/magritte-ui-input": "7.0.3"
36
+ "@hh.ru/magritte-ui-input": "7.0.3",
37
+ "@hh.ru/magritte-ui-theme-provider": "1.1.31"
37
38
  },
38
- "gitHead": "34aa8b63db1d1af2d969ef765d060ac8f59cd9ff"
39
+ "gitHead": "fb8f5621002b895e727aaa8ee79e7f91f9e6e4bc"
39
40
  }