@snack-uikit/search 0.11.0 → 0.11.2-preview-ff55e021.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (14) hide show
  1. package/CHANGELOG.md +11 -0
  2. package/README.md +1 -0
  3. package/dist/cjs/components/Search/Search.d.ts +1 -1
  4. package/dist/cjs/components/Search/Search.js +7 -4
  5. package/dist/cjs/components/SearchAutocomplete/SearchAutocomplete.js +5 -3
  6. package/dist/cjs/components/SearchFieldText/SearchFieldText.js +5 -3
  7. package/dist/esm/components/Search/Search.d.ts +1 -1
  8. package/dist/esm/components/Search/Search.js +3 -3
  9. package/dist/esm/components/SearchAutocomplete/SearchAutocomplete.js +2 -2
  10. package/dist/esm/components/SearchFieldText/SearchFieldText.js +2 -2
  11. package/package.json +2 -2
  12. package/src/components/Search/Search.tsx +5 -2
  13. package/src/components/SearchAutocomplete/SearchAutocomplete.tsx +2 -0
  14. package/src/components/SearchFieldText/SearchFieldText.tsx +15 -1
package/CHANGELOG.md CHANGED
@@ -3,6 +3,17 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## 0.11.1 (2025-05-07)
7
+
8
+
9
+ ### Bug Fixes
10
+
11
+ * **FF-6490:** pass tabIndex prop to Search ([a07cc91](https://github.com/cloud-ru-tech/snack-uikit/commit/a07cc915032dcb2b68e9151c49f083a7823af598))
12
+
13
+
14
+
15
+
16
+
6
17
  # 0.11.0 (2025-04-23)
7
18
 
8
19
 
package/README.md CHANGED
@@ -38,6 +38,7 @@ import { Search, SearchPrivate } from "@snack-uikit/search";
38
38
  | onFocus | `FocusEventHandler<HTMLInputElement>` | - | Колбек обработки получения фокуса |
39
39
  | onBlur | `FocusEventHandler<HTMLInputElement>` | - | Колбек обработки потери фокуса |
40
40
  | className | `string` | - | CSS-класс |
41
+ | tabIndex | `number` | - | |
41
42
  | size | enum Size: `"s"`, `"m"`, `"l"` | s | Размер |
42
43
  | loading | `boolean` | - | Состояние загрузки |
43
44
  | onSubmit | `(value: string) => void` | - | Колбек на подтверждение поиска по строке |
package/dist/cjs/components/Search/Search.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import { SearchPrivateProps } from '@snack-uikit/search-private';
2
2
  import { SearchAutocompleteProps } from '../SearchAutocomplete';
3
- export type SearchProps = Omit<SearchPrivateProps, 'onKeyDown' | 'tabIndex'> & {
3
+ export type SearchProps = Omit<SearchPrivateProps, 'onKeyDown'> & {
4
4
  /** Внешний бордер */
5
5
  outline?: boolean;
6
6
  } & ((Pick<SearchAutocompleteProps, 'options'> & {
package/dist/cjs/components/Search/Search.js CHANGED
@@ -32,9 +32,10 @@ exports.Search = (0, react_1.forwardRef)(function Search(_a, ref) {
32
32
  loading,
33
33
  placeholder,
34
34
  onSubmit,
35
- className
35
+ className,
36
+ tabIndex
36
37
  } = props,
37
- rest = __rest(props, ["value", "onChange", "onBlur", "onFocus", "outline", "loading", "placeholder", "onSubmit", "className"]);
38
+ rest = __rest(props, ["value", "onChange", "onBlur", "onFocus", "outline", "loading", "placeholder", "onSubmit", "className", "tabIndex"]);
38
39
  const supportProps = (0, utils_1.extractSupportProps)(rest);
39
40
  if (props.autocomplete) {
40
41
  return (0, jsx_runtime_1.jsx)(SearchAutocomplete_1.SearchAutocomplete, Object.assign({
@@ -49,7 +50,8 @@ exports.Search = (0, react_1.forwardRef)(function Search(_a, ref) {
49
50
  loading: loading,
50
51
  placeholder: placeholder,
51
52
  className: className,
52
- ref: ref
53
+ ref: ref,
54
+ tabIndex: tabIndex
53
55
  }, supportProps));
54
56
  }
55
57
  return (0, jsx_runtime_1.jsx)(SearchFieldText_1.SearchFieldText, Object.assign({
@@ -63,6 +65,7 @@ exports.Search = (0, react_1.forwardRef)(function Search(_a, ref) {
63
65
  loading: loading,
64
66
  placeholder: placeholder,
65
67
  className: className,
66
- ref: ref
68
+ ref: ref,
69
+ tabIndex: tabIndex
67
70
  }, supportProps));
68
71
  });
package/dist/cjs/components/SearchAutocomplete/SearchAutocomplete.js CHANGED
@@ -37,9 +37,10 @@ exports.SearchAutocomplete = (0, react_1.forwardRef)(function SearchAutocomplete
37
37
  outline,
38
38
  onSubmit,
39
39
  onFocus,
40
- className
40
+ className,
41
+ tabIndex
41
42
  } = _a,
42
- rest = __rest(_a, ["size", "value", "onChange", "placeholder", "options", "loading", "outline", "onSubmit", "onFocus", "className"]);
43
+ rest = __rest(_a, ["size", "value", "onChange", "placeholder", "options", "loading", "outline", "onSubmit", "onFocus", "className", "tabIndex"]);
43
44
  const scrollRef = (0, react_1.useRef)(null);
44
45
  const localRef = (0, react_1.useRef)(null);
45
46
  const [isOpen, setIsOpen] = (0, react_1.useState)(false);
@@ -130,7 +131,8 @@ exports.SearchAutocomplete = (0, react_1.forwardRef)(function SearchAutocomplete
130
131
  onKeyDown: handleKeyDown(onKeyDown),
131
132
  onFocus: onFocus,
132
133
  size: size,
133
- "data-test-id": constants_1.PRIVATE_SEARCH_TEST_IDS.field
134
+ "data-test-id": constants_1.PRIVATE_SEARCH_TEST_IDS.field,
135
+ tabIndex: tabIndex
134
136
  })
135
137
  });
136
138
  }
package/dist/cjs/components/SearchFieldText/SearchFieldText.js CHANGED
@@ -28,9 +28,10 @@ exports.SearchFieldText = (0, react_1.forwardRef)(function SearchFieldText(_a, r
28
28
  loading,
29
29
  placeholder,
30
30
  onSubmit,
31
- className
31
+ className,
32
+ tabIndex
32
33
  } = _a,
33
- rest = __rest(_a, ["value", "onChange", "onBlur", "onFocus", "size", "outline", "loading", "placeholder", "onSubmit", "className"]);
34
+ rest = __rest(_a, ["value", "onChange", "onBlur", "onFocus", "size", "outline", "loading", "placeholder", "onSubmit", "className", "tabIndex"]);
34
35
  return (0, jsx_runtime_1.jsx)(SearchDecorator_1.SearchDecorator, Object.assign({
35
36
  outline: outline,
36
37
  size: size,
@@ -46,7 +47,8 @@ exports.SearchFieldText = (0, react_1.forwardRef)(function SearchFieldText(_a, r
46
47
  onSubmit: onSubmit,
47
48
  placeholder: placeholder,
48
49
  loading: loading,
49
- "data-test-id": constants_1.PRIVATE_SEARCH_TEST_IDS.field
50
+ "data-test-id": constants_1.PRIVATE_SEARCH_TEST_IDS.field,
51
+ tabIndex: tabIndex
50
52
  })
51
53
  }));
52
54
  });
package/dist/esm/components/Search/Search.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import { SearchPrivateProps } from '@snack-uikit/search-private';
2
2
  import { SearchAutocompleteProps } from '../SearchAutocomplete';
3
- export type SearchProps = Omit<SearchPrivateProps, 'onKeyDown' | 'tabIndex'> & {
3
+ export type SearchProps = Omit<SearchPrivateProps, 'onKeyDown'> & {
4
4
  /** Внешний бордер */
5
5
  outline?: boolean;
6
6
  } & ((Pick<SearchAutocompleteProps, 'options'> & {
package/dist/esm/components/Search/Search.js CHANGED
@@ -17,10 +17,10 @@ import { SearchAutocomplete } from '../SearchAutocomplete';
17
17
  import { SearchFieldText } from '../SearchFieldText';
18
18
  export const Search = forwardRef(function Search(_a, ref) {
19
19
  var { size = SIZE.S } = _a, props = __rest(_a, ["size"]);
20
- const { value, onChange, onBlur, onFocus, outline, loading, placeholder, onSubmit, className } = props, rest = __rest(props, ["value", "onChange", "onBlur", "onFocus", "outline", "loading", "placeholder", "onSubmit", "className"]);
20
+ const { value, onChange, onBlur, onFocus, outline, loading, placeholder, onSubmit, className, tabIndex } = props, rest = __rest(props, ["value", "onChange", "onBlur", "onFocus", "outline", "loading", "placeholder", "onSubmit", "className", "tabIndex"]);
21
21
  const supportProps = extractSupportProps(rest);
22
22
  if (props.autocomplete) {
23
- return (_jsx(SearchAutocomplete, Object.assign({ value: value, onChange: onChange, options: props.options, onBlur: onBlur, onFocus: onFocus, onSubmit: onSubmit, size: size, outline: outline, loading: loading, placeholder: placeholder, className: className, ref: ref }, supportProps)));
23
+ return (_jsx(SearchAutocomplete, Object.assign({ value: value, onChange: onChange, options: props.options, onBlur: onBlur, onFocus: onFocus, onSubmit: onSubmit, size: size, outline: outline, loading: loading, placeholder: placeholder, className: className, ref: ref, tabIndex: tabIndex }, supportProps)));
24
24
  }
25
- return (_jsx(SearchFieldText, Object.assign({ value: value, onChange: onChange, onBlur: onBlur, onFocus: onFocus, onSubmit: onSubmit, size: size, outline: outline, loading: loading, placeholder: placeholder, className: className, ref: ref }, supportProps)));
25
+ return (_jsx(SearchFieldText, Object.assign({ value: value, onChange: onChange, onBlur: onBlur, onFocus: onFocus, onSubmit: onSubmit, size: size, outline: outline, loading: loading, placeholder: placeholder, className: className, ref: ref, tabIndex: tabIndex }, supportProps)));
26
26
  });
package/dist/esm/components/SearchAutocomplete/SearchAutocomplete.js CHANGED
@@ -19,7 +19,7 @@ import { PRIVATE_SEARCH_TEST_IDS, SIZE, TEST_IDS } from '../../constants';
19
19
  import { SearchDecorator } from '../SearchDecorator';
20
20
  import styles from './styles.module.css';
21
21
  export const SearchAutocomplete = forwardRef(function SearchAutocomplete(_a, ref) {
22
- var { size = SIZE.S, value, onChange, placeholder, options = [], loading, outline, onSubmit, onFocus, className } = _a, rest = __rest(_a, ["size", "value", "onChange", "placeholder", "options", "loading", "outline", "onSubmit", "onFocus", "className"]);
22
+ var { size = SIZE.S, value, onChange, placeholder, options = [], loading, outline, onSubmit, onFocus, className, tabIndex } = _a, rest = __rest(_a, ["size", "value", "onChange", "placeholder", "options", "loading", "outline", "onSubmit", "onFocus", "className", "tabIndex"]);
23
23
  const scrollRef = useRef(null);
24
24
  const localRef = useRef(null);
25
25
  const [isOpen, setIsOpen] = useState(false);
@@ -73,6 +73,6 @@ export const SearchAutocomplete = forwardRef(function SearchAutocomplete(_a, ref
73
73
  }), [handleOptionKeyDown, onChange, onSubmit, options]);
74
74
  return (_jsx("div", Object.assign({ className: cn(styles.wrap, className) }, rest, { children: _jsx(Droplist, { open: isOpen && options.length > 0, scroll: true, size: size, onOpenChange: setIsOpen, "data-test-id": TEST_IDS.droplist, triggerClassName: styles.triggerClassName, scrollRef: scrollRef, triggerElemRef: localRef, items: items, loading: loading, children: ({ onKeyDown }) => {
75
75
  var _a;
76
- return (_jsx(SearchDecorator, { size: size, outline: outline || undefined, focused: (isOpen && Boolean((_a = localRef.current) === null || _a === void 0 ? void 0 : _a.value)) || undefined, "data-test-id": TEST_IDS.decorator, children: _jsx(SearchPrivate, { loading: loading, value: value, onChange: onChange, onSubmit: onSubmit, placeholder: placeholder, ref: mergeRefs(ref, localRef), onKeyDown: handleKeyDown(onKeyDown), onFocus: onFocus, size: size, "data-test-id": PRIVATE_SEARCH_TEST_IDS.field }) }));
76
+ return (_jsx(SearchDecorator, { size: size, outline: outline || undefined, focused: (isOpen && Boolean((_a = localRef.current) === null || _a === void 0 ? void 0 : _a.value)) || undefined, "data-test-id": TEST_IDS.decorator, children: _jsx(SearchPrivate, { loading: loading, value: value, onChange: onChange, onSubmit: onSubmit, placeholder: placeholder, ref: mergeRefs(ref, localRef), onKeyDown: handleKeyDown(onKeyDown), onFocus: onFocus, size: size, "data-test-id": PRIVATE_SEARCH_TEST_IDS.field, tabIndex: tabIndex }) }));
77
77
  } }) })));
78
78
  });
package/dist/esm/components/SearchFieldText/SearchFieldText.js CHANGED
@@ -15,6 +15,6 @@ import { SearchPrivate } from '@snack-uikit/search-private';
15
15
  import { PRIVATE_SEARCH_TEST_IDS, SIZE } from '../../constants';
16
16
  import { SearchDecorator } from '../SearchDecorator';
17
17
  export const SearchFieldText = forwardRef(function SearchFieldText(_a, ref) {
18
- var { value, onChange, onBlur, onFocus, size = SIZE.S, outline, loading, placeholder, onSubmit, className } = _a, rest = __rest(_a, ["value", "onChange", "onBlur", "onFocus", "size", "outline", "loading", "placeholder", "onSubmit", "className"]);
19
- return (_jsx(SearchDecorator, Object.assign({ outline: outline, size: size, className: className }, rest, { children: _jsx(SearchPrivate, { ref: ref, size: size, value: value, onChange: onChange, onBlur: onBlur, onFocus: onFocus, onSubmit: onSubmit, placeholder: placeholder, loading: loading, "data-test-id": PRIVATE_SEARCH_TEST_IDS.field }) })));
18
+ var { value, onChange, onBlur, onFocus, size = SIZE.S, outline, loading, placeholder, onSubmit, className, tabIndex } = _a, rest = __rest(_a, ["value", "onChange", "onBlur", "onFocus", "size", "outline", "loading", "placeholder", "onSubmit", "className", "tabIndex"]);
19
+ return (_jsx(SearchDecorator, Object.assign({ outline: outline, size: size, className: className }, rest, { children: _jsx(SearchPrivate, { ref: ref, size: size, value: value, onChange: onChange, onBlur: onBlur, onFocus: onFocus, onSubmit: onSubmit, placeholder: placeholder, loading: loading, "data-test-id": PRIVATE_SEARCH_TEST_IDS.field, tabIndex: tabIndex }) })));
20
20
  });
package/package.json CHANGED
@@ -4,7 +4,7 @@
4
4
  "access": "public"
5
5
  },
6
6
  "title": "Search",
7
- "version": "0.11.0",
7
+ "version": "0.11.2-preview-ff55e021.0",
8
8
  "sideEffects": [
9
9
  "*.css",
10
10
  "*.woff",
@@ -45,5 +45,5 @@
45
45
  "devDependencies": {
46
46
  "@types/merge-refs": "1.0.0"
47
47
  },
48
- "gitHead": "9786e3a2d1ef58fd4b1002d4bc69a61a70113acf"
48
+ "gitHead": "67587bd2fedcd8accb1cfbc049ebce363fb6bf83"
49
49
  }
package/src/components/Search/Search.tsx CHANGED
@@ -7,7 +7,7 @@ import { SIZE } from '../../constants';
7
7
  import { SearchAutocomplete, SearchAutocompleteProps } from '../SearchAutocomplete';
8
8
  import { SearchFieldText } from '../SearchFieldText';
9
9
 
10
- export type SearchProps = Omit<SearchPrivateProps, 'onKeyDown' | 'tabIndex'> & {
10
+ export type SearchProps = Omit<SearchPrivateProps, 'onKeyDown'> & {
11
11
  /** Внешний бордер */
12
12
  outline?: boolean;
13
13
  } & (
@@ -27,7 +27,8 @@ export type SearchProps = Omit<SearchPrivateProps, 'onKeyDown' | 'tabIndex'> & {
27
27
  );
28
28
 
29
29
  export const Search = forwardRef<HTMLInputElement, SearchProps>(function Search({ size = SIZE.S, ...props }, ref) {
30
- const { value, onChange, onBlur, onFocus, outline, loading, placeholder, onSubmit, className, ...rest } = props;
30
+ const { value, onChange, onBlur, onFocus, outline, loading, placeholder, onSubmit, className, tabIndex, ...rest } =
31
+ props;
31
32
  const supportProps = extractSupportProps(rest);
32
33
 
33
34
  if (props.autocomplete) {
@@ -45,6 +46,7 @@ export const Search = forwardRef<HTMLInputElement, SearchProps>(function Search(
45
46
  placeholder={placeholder}
46
47
  className={className}
47
48
  ref={ref}
49
+ tabIndex={tabIndex}
48
50
  {...supportProps}
49
51
  />
50
52
  );
@@ -63,6 +65,7 @@ export const Search = forwardRef<HTMLInputElement, SearchProps>(function Search(
63
65
  placeholder={placeholder}
64
66
  className={className}
65
67
  ref={ref}
68
+ tabIndex={tabIndex}
66
69
  {...supportProps}
67
70
  />
68
71
  );
package/src/components/SearchAutocomplete/SearchAutocomplete.tsx CHANGED
@@ -41,6 +41,7 @@ export const SearchAutocomplete = forwardRef<HTMLInputElement, SearchAutocomplet
41
41
  onSubmit,
42
42
  onFocus,
43
43
  className,
44
+ tabIndex,
44
45
  ...rest
45
46
  },
46
47
  ref,
@@ -143,6 +144,7 @@ export const SearchAutocomplete = forwardRef<HTMLInputElement, SearchAutocomplet
143
144
  onFocus={onFocus}
144
145
  size={size}
145
146
  data-test-id={PRIVATE_SEARCH_TEST_IDS.field}
147
+ tabIndex={tabIndex}
146
148
  />
147
149
  </SearchDecorator>
148
150
  )}
package/src/components/SearchFieldText/SearchFieldText.tsx CHANGED
@@ -11,7 +11,20 @@ export type SearchTextFieldProps = Omit<SearchPrivateProps, 'onKeyDown'> & {
11
11
  };
12
12
 
13
13
  export const SearchFieldText = forwardRef<HTMLInputElement, SearchTextFieldProps>(function SearchFieldText(
14
- { value, onChange, onBlur, onFocus, size = SIZE.S, outline, loading, placeholder, onSubmit, className, ...rest },
14
+ {
15
+ value,
16
+ onChange,
17
+ onBlur,
18
+ onFocus,
19
+ size = SIZE.S,
20
+ outline,
21
+ loading,
22
+ placeholder,
23
+ onSubmit,
24
+ className,
25
+ tabIndex,
26
+ ...rest
27
+ },
15
28
  ref,
16
29
  ) {
17
30
  return (
@@ -27,6 +40,7 @@ export const SearchFieldText = forwardRef<HTMLInputElement, SearchTextFieldProps
27
40
  placeholder={placeholder}
28
41
  loading={loading}
29
42
  data-test-id={PRIVATE_SEARCH_TEST_IDS.field}
43
+ tabIndex={tabIndex}
30
44
  />
31
45
  </SearchDecorator>
32
46
  );