@hh.ru/magritte-ui-select 12.5.4 → 12.6.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/index.css CHANGED
@@ -1,4 +1,4 @@
1
- .magritte-error-container___t9B5w_12-5-4{
1
+ .magritte-error-container___t9B5w_12-6-1{
2
2
  display:flex;
3
3
  flex-direction:column;
4
4
  align-items:center;
@@ -6,95 +6,104 @@
6
6
  justify-content:center;
7
7
  }
8
8
  @media (min-width: 1020px){
9
- body.magritte-old-layout .magritte-error-container___t9B5w_12-5-4{
9
+ body.magritte-old-layout .magritte-error-container___t9B5w_12-6-1{
10
10
  min-height:320px;
11
11
  height:auto;
12
12
  }
13
13
  }
14
14
  @media (min-width: 1024px){
15
- body:not(.magritte-old-layout) .magritte-error-container___t9B5w_12-5-4{
15
+ body:not(.magritte-old-layout) .magritte-error-container___t9B5w_12-6-1{
16
16
  min-height:320px;
17
17
  height:auto;
18
18
  }
19
19
  }
20
20
 
21
- .magritte-select-option-plain___dfz4a_12-5-4:hover{
21
+ :root{
22
+ --magritte-color-component-input-stroke-state-accent-focused-accessible-v24-5-0:#0070ff7a;
23
+ }
24
+ .magritte-select-option-plain___dfz4a_12-6-1{
25
+ border-radius:8px;
26
+ }
27
+ .magritte-select-option-plain___dfz4a_12-6-1.focus-visible{
28
+ outline:var(--magritte-color-component-input-stroke-state-accent-focused-accessible-v24-5-0) solid 4px;
29
+ }
30
+ .magritte-select-option-plain___dfz4a_12-6-1:hover{
22
31
  cursor:default;
23
32
  }
24
- .magritte-select-option-plain_active___AQSQS_12-5-4:hover{
33
+ .magritte-select-option-plain_active___AQSQS_12-6-1:hover{
25
34
  cursor:pointer;
26
35
  }
27
- .magritte-select-delimiter___WyeR6_12-5-4{
36
+ .magritte-select-delimiter___WyeR6_12-6-1{
28
37
  padding-left:16px;
29
38
  padding-top:12px;
30
39
  }
31
40
 
32
- .magritte-select-bottom-sheet___1RZDJ_12-5-4{
41
+ .magritte-select-bottom-sheet___1RZDJ_12-6-1{
33
42
  display:flex;
34
43
  flex-direction:column;
35
44
  padding:0 16px;
36
45
  padding-bottom:16px;
37
46
  }
38
- .magritte-select-bottom-sheet_checkbox___hwTgo_12-5-4,
39
- .magritte-select-bottom-sheet_radio___qvFFV_12-5-4{
47
+ .magritte-select-bottom-sheet_checkbox___hwTgo_12-6-1,
48
+ .magritte-select-bottom-sheet_radio___qvFFV_12-6-1{
40
49
  gap:12px;
41
50
  }
42
- .magritte-select-bottom-sheet_without-header___KOKVh_12-5-4{
51
+ .magritte-select-bottom-sheet_without-header___KOKVh_12-6-1{
43
52
  padding-top:16px;
44
53
  }
45
- .magritte-full-screen-placeholder___zPC8k_12-5-4{
54
+ .magritte-full-screen-placeholder___zPC8k_12-6-1{
46
55
  display:flex;
47
56
  flex-direction:column;
48
57
  align-items:center;
49
58
  height:100%;
50
59
  justify-content:center;
51
60
  }
52
- .magritte-error-wrapper___P7jYg_12-5-4{
61
+ .magritte-error-wrapper___P7jYg_12-6-1{
53
62
  height:100%;
54
63
  }
55
64
 
56
- .magritte-select-drop-container-wrapper___OHM0q_12-5-4{
65
+ .magritte-select-drop-container-wrapper___OHM0q_12-6-1{
57
66
  display:flex;
58
67
  flex-direction:column;
59
68
  }
60
- .magritte-select-drop-container___hee1p_12-5-4{
69
+ .magritte-select-drop-container___hee1p_12-6-1{
61
70
  display:flex;
62
71
  flex-direction:column;
63
72
  padding:12px;
64
73
  margin:calc(-1 * 12px);
65
74
  }
66
- .magritte-select-drop-container_plain___766zl_12-5-4{
75
+ .magritte-select-drop-container_plain___766zl_12-6-1{
67
76
  padding:24px;
68
77
  margin:calc(-1 * 24px);
69
78
  }
70
- .magritte-select-drop-container_with-footer___6wp-L_12-5-4{
79
+ .magritte-select-drop-container_with-footer___6wp-L_12-6-1{
71
80
  margin-bottom:0;
72
81
  padding-bottom:0;
73
82
  }
74
- .magritte-select-drop___jn4O-_12-5-4{
83
+ .magritte-select-drop___jn4O-_12-6-1{
75
84
  display:flex;
76
85
  flex-direction:column;
77
86
  gap:8px;
78
87
  }
79
- .magritte-select-drop-header___fMmio_12-5-4{
88
+ .magritte-select-drop-header___fMmio_12-6-1{
80
89
  display:flex;
81
90
  flex-direction:column;
82
91
  margin-bottom:8px;
83
92
  }
84
- .magritte-select-drop_plain___VL8Fz_12-5-4{
93
+ .magritte-select-drop_plain___VL8Fz_12-6-1{
85
94
  gap:16px;
86
95
  }
87
- .magritte-label-option___2N7t9_12-5-4{
96
+ .magritte-label-option___2N7t9_12-6-1{
88
97
  display:flex;
89
98
  justify-content:center;
90
99
  }
91
- .magritte-loading___AMiuq_12-5-4{
100
+ .magritte-loading___AMiuq_12-6-1{
92
101
  display:flex;
93
102
  align-items:center;
94
103
  height:150px;
95
104
  justify-content:center;
96
105
  }
97
- .magritte-hint___6qaFl_12-5-4{
106
+ .magritte-hint___6qaFl_12-6-1{
98
107
  display:flex;
99
108
  flex-direction:column;
100
109
  align-items:center;
@@ -102,24 +111,24 @@
102
111
  justify-content:center;
103
112
  }
104
113
 
105
- .magritte-select-modal-wrapper___5BhtC_12-5-4{
114
+ .magritte-select-modal-wrapper___5BhtC_12-6-1{
106
115
  display:flex;
107
116
  flex-direction:column;
108
117
  flex-grow:1;
109
118
  }
110
- .magritte-select-modal___f9wc6_12-5-4{
119
+ .magritte-select-modal___f9wc6_12-6-1{
111
120
  display:flex;
112
121
  flex-direction:column;
113
122
  gap:12px;
114
123
  }
115
- .magritte-select-modal_plain___0rP39_12-5-4{
124
+ .magritte-select-modal_plain___0rP39_12-6-1{
116
125
  gap:0;
117
126
  }
118
- .magritte-label-option___kFAuR_12-5-4{
127
+ .magritte-label-option___kFAuR_12-6-1{
119
128
  display:flex;
120
129
  justify-content:center;
121
130
  }
122
- .magritte-layer-full-height___cJX-K_12-5-4{
131
+ .magritte-layer-full-height___cJX-K_12-6-1{
123
132
  display:flex;
124
133
  flex-direction:column;
125
134
  align-items:center;
@@ -146,14 +155,14 @@
146
155
  --magritte-color-background-accent-secondary-v24-5-0:#F1F4F7;
147
156
  --magritte-color-icon-accent-v24-5-0:#7195AF;
148
157
  }
149
- .magritte-select-empty-hint___B39XJ_12-5-4{
158
+ .magritte-select-empty-hint___B39XJ_12-6-1{
150
159
  display:flex;
151
160
  flex-direction:column;
152
161
  justify-content:center;
153
162
  align-content:center;
154
163
  align-items:center;
155
164
  }
156
- .magritte-icon___F0GQx_12-5-4{
165
+ .magritte-icon___F0GQx_12-6-1{
157
166
  display:flex;
158
167
  align-items:center;
159
168
  justify-content:center;
@@ -161,11 +170,11 @@
161
170
  height:48px;
162
171
  border-radius:50%;
163
172
  }
164
- .magritte-icon-init___GWK-V_12-5-4{
173
+ .magritte-icon-init___GWK-V_12-6-1{
165
174
  background-color:var(--magritte-color-background-accent-secondary-v24-5-0);
166
175
  --magritte-ui-icon-color-override:var(--magritte-color-icon-accent-v24-5-0);
167
176
  }
168
- .magritte-icon-search___ZsqO-_12-5-4{
177
+ .magritte-icon-search___ZsqO-_12-6-1{
169
178
  background-color:var(--magritte-color-background-secondary-v24-5-0);
170
179
  --magritte-ui-icon-color-override:var(--magritte-color-icon-tertiary-v24-5-0);
171
180
  }
package/index.d.ts CHANGED
@@ -1,4 +1,5 @@
1
1
  export * from '@hh.ru/magritte-ui-select/types';
2
2
  export * from '@hh.ru/magritte-ui-select/Select';
3
+ export { RenderHeaderDefault } from '@hh.ru/magritte-ui-select/SelectBottomSheet';
3
4
  export * from '@hh.ru/magritte-ui-select/UncontrolledSelect';
4
5
  export * from '@hh.ru/magritte-ui-select/SelectEmptyHint';
package/index.js CHANGED
@@ -1,5 +1,6 @@
1
1
  import './index.css';
2
2
  export { Select } from './Select.js';
3
+ export { RenderHeaderDefault } from './SelectBottomSheet.js';
3
4
  export { UncontrolledSelect } from './UncontrolledSelect.js';
4
5
  export { SelectEmptyHint } from './SelectEmptyHint.js';
5
6
  import 'react/jsx-runtime';
@@ -9,17 +10,16 @@ import '@hh.ru/magritte-common-use-disabled';
9
10
  import '@hh.ru/magritte-common-use-multiple-refs';
10
11
  import '@hh.ru/magritte-ui-breakpoint';
11
12
  import '@hh.ru/magritte-ui-input/BaseInput';
12
- import './SelectBottomSheet.js';
13
+ import './SelectDrop.js';
13
14
  import 'classnames';
14
- import '@hh.ru/magritte-ui-action-bar';
15
- import '@hh.ru/magritte-ui-bottom-sheet';
16
- import '@hh.ru/magritte-ui-button';
15
+ import '@hh.ru/magritte-common-use-translation';
16
+ import '@hh.ru/magritte-ui-action-bar/ActionBar';
17
17
  import '@hh.ru/magritte-ui-cell';
18
+ import '@hh.ru/magritte-ui-drop';
18
19
  import '@hh.ru/magritte-ui-icon/icon';
19
- import '@hh.ru/magritte-ui-input';
20
20
  import '@hh.ru/magritte-ui-loader';
21
- import '@hh.ru/magritte-ui-navigation-bar';
22
21
  import './SelectError.js';
22
+ import '@hh.ru/magritte-ui-button';
23
23
  import '@hh.ru/magritte-ui-icon/variants/icon';
24
24
  import '@hh.ru/magritte-ui-spacing';
25
25
  import '@hh.ru/magritte-ui-title';
@@ -28,15 +28,16 @@ import './SelectOption.js';
28
28
  import '@hh.ru/magritte-ui-checkable-card/CheckableCardElement';
29
29
  import '@hh.ru/magritte-ui-checkbox-radio';
30
30
  import './getChecked.js';
31
- import './isArraysEquals.js';
32
- import './SelectDrop.js';
33
- import '@hh.ru/magritte-ui-action-bar/ActionBar';
34
- import '@hh.ru/magritte-ui-drop';
35
31
  import './SelectModal.js';
32
+ import '@hh.ru/magritte-ui-action-bar';
33
+ import '@hh.ru/magritte-ui-input';
36
34
  import '@hh.ru/magritte-ui-modal';
35
+ import './isArraysEquals.js';
37
36
  import './useSelectOptionsList.js';
38
37
  import './useSelectSearch.js';
39
38
  import '@hh.ru/magritte-common-data-provider';
40
39
  import './useSelectState.js';
41
40
  import '@hh.ru/magritte-ui-trigger';
41
+ import '@hh.ru/magritte-ui-bottom-sheet';
42
+ import '@hh.ru/magritte-ui-navigation-bar';
42
43
  //# sourceMappingURL=index.js.map
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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hh.ru/magritte-ui-select",
3
- "version": "12.5.4",
3
+ "version": "12.6.1",
4
4
  "main": "index.js",
5
5
  "types": "index.d.ts",
6
6
  "sideEffects": [
@@ -31,26 +31,27 @@
31
31
  "@hh.ru/magritte-common-keyboard": "4.3.1",
32
32
  "@hh.ru/magritte-common-use-disabled": "1.0.15",
33
33
  "@hh.ru/magritte-common-use-multiple-refs": "1.1.11",
34
+ "@hh.ru/magritte-common-use-translation": "3.1.0",
34
35
  "@hh.ru/magritte-design-tokens": "24.5.0",
35
- "@hh.ru/magritte-ui-action-bar": "5.3.8",
36
- "@hh.ru/magritte-ui-bottom-sheet": "9.2.16",
36
+ "@hh.ru/magritte-ui-action-bar": "5.3.9",
37
+ "@hh.ru/magritte-ui-bottom-sheet": "9.3.1",
37
38
  "@hh.ru/magritte-ui-breakpoint": "6.0.8",
38
- "@hh.ru/magritte-ui-button": "7.1.8",
39
- "@hh.ru/magritte-ui-button-stack": "3.0.5",
40
- "@hh.ru/magritte-ui-cell": "7.2.9",
41
- "@hh.ru/magritte-ui-checkable-card": "5.0.12",
42
- "@hh.ru/magritte-ui-checkbox-radio": "4.1.8",
43
- "@hh.ru/magritte-ui-drop": "12.2.7",
44
- "@hh.ru/magritte-ui-icon": "13.11.4",
45
- "@hh.ru/magritte-ui-input": "9.4.7",
46
- "@hh.ru/magritte-ui-loader": "2.1.8",
39
+ "@hh.ru/magritte-ui-button": "7.1.9",
40
+ "@hh.ru/magritte-ui-button-stack": "3.0.6",
41
+ "@hh.ru/magritte-ui-cell": "7.2.10",
42
+ "@hh.ru/magritte-ui-checkable-card": "5.0.14",
43
+ "@hh.ru/magritte-ui-checkbox-radio": "4.1.9",
44
+ "@hh.ru/magritte-ui-drop": "12.3.1",
45
+ "@hh.ru/magritte-ui-icon": "14.0.0",
46
+ "@hh.ru/magritte-ui-input": "9.4.9",
47
+ "@hh.ru/magritte-ui-loader": "3.0.0",
47
48
  "@hh.ru/magritte-ui-mock-component": "1.1.7",
48
- "@hh.ru/magritte-ui-modal": "9.8.5",
49
- "@hh.ru/magritte-ui-navigation-bar": "10.1.11",
49
+ "@hh.ru/magritte-ui-modal": "10.0.0",
50
+ "@hh.ru/magritte-ui-navigation-bar": "10.1.12",
50
51
  "@hh.ru/magritte-ui-spacing": "2.1.14",
51
- "@hh.ru/magritte-ui-title": "7.0.33",
52
- "@hh.ru/magritte-ui-trigger": "4.2.7",
53
- "@hh.ru/magritte-ui-typography": "4.5.4"
52
+ "@hh.ru/magritte-ui-title": "8.0.0",
53
+ "@hh.ru/magritte-ui-trigger": "4.3.1",
54
+ "@hh.ru/magritte-ui-typography": "5.0.0"
54
55
  },
55
- "gitHead": "0d147efb00e0803c03ee0ac99525211ce44788e1"
56
+ "gitHead": "e019f700cfff466975b65b96124aaac592268720"
56
57
  }
package/types.d.ts CHANGED
@@ -94,6 +94,8 @@ export interface RenderHeaderProps extends SearchValueHelper, OptionsCount {
94
94
  headerTitle?: ReactNode;
95
95
  onSearchSubmit?: SearchSubmitType;
96
96
  onCloseBottomSheetWithUpdateValues: VoidFunction;
97
+ searchTrl?: string;
98
+ closeTrl?: string;
97
99
  }
98
100
  export interface RenderHeader {
99
101
  (props: RenderHeaderProps): ReactNode;
@@ -259,6 +261,7 @@ interface ExternalSelectDropProps {
259
261
  }
260
262
  export type FocusStateType = 'focus' | 'focusAndSelect' | null;
261
263
  interface InternalSelectDropProps {
264
+ id: string;
262
265
  activatorRef: RefObject<HTMLElement>;
263
266
  setForcedState: (state: FocusStateType) => void;
264
267
  }
@@ -267,6 +270,7 @@ interface InternalModalProps<DataType extends StaticDataFetcherItem> {
267
270
  initialValuesOnOpening: RefObject<DataType[]>;
268
271
  }
269
272
  interface InternalSelectBottomSheetProps<DataType extends StaticDataFetcherItem> {
273
+ id: string;
270
274
  initialValuesOnOpening: RefObject<DataType[]>;
271
275
  }
272
276
  type SelectSearchAndCommitStuff<DataType extends StaticDataFetcherItem> = UseSelectSearch<DataType> & UseSelectStateHelper<DataType> & SelectInternalPropsHelper<DataType>;