@alfalab/core-components-picker-button 10.3.16 → 10.3.18

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 (23) hide show
  1. package/Component.js +1 -1
  2. package/cssm/typings-5e1b8383.d.ts +20 -4
  3. package/esm/Component.js +1 -1
  4. package/esm/field/Component.js +1 -1
  5. package/esm/field/index.css +5 -5
  6. package/esm/index.css +5 -5
  7. package/esm/option/Component.js +1 -1
  8. package/esm/option/index.css +4 -4
  9. package/esm/typings-5e1b8383.d.ts +20 -4
  10. package/field/Component.js +1 -1
  11. package/field/index.css +5 -5
  12. package/index.css +5 -5
  13. package/modern/Component.js +1 -1
  14. package/modern/field/Component.js +1 -1
  15. package/modern/field/index.css +5 -5
  16. package/modern/index.css +5 -5
  17. package/modern/option/Component.js +1 -1
  18. package/modern/option/index.css +4 -4
  19. package/modern/typings-5e1b8383.d.ts +20 -4
  20. package/option/Component.js +1 -1
  21. package/option/index.css +4 -4
  22. package/package.json +2 -2
  23. package/typings-5e1b8383.d.ts +20 -4
package/Component.js CHANGED
@@ -20,7 +20,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
20
20
  var React__default = /*#__PURE__*/_interopDefaultCompat(React);
21
21
  var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
22
22
 
23
- var styles = {"container":"picker-button__container_ap6x8","optionsPopover":"picker-button__optionsPopover_ap6x8","sideGap":"picker-button__sideGap_ap6x8","option":"picker-button__option_ap6x8"};
23
+ var styles = {"container":"picker-button__container_fi1r2","optionsPopover":"picker-button__optionsPopover_fi1r2","sideGap":"picker-button__sideGap_fi1r2","option":"picker-button__option_fi1r2"};
24
24
  require('./index.css')
25
25
 
26
26
  var SIDE_POSITIONS = ['right', 'right-start', 'right-end', 'left', 'left-start', 'left-end'];
package/cssm/typings-5e1b8383.d.ts CHANGED
@@ -254,6 +254,9 @@ type PopoverProps = {
254
254
  children?: ReactNode;
255
255
  };
256
256
  declare const Popover: React.ForwardRefExoticComponent<PopoverProps & React.RefAttributes<HTMLDivElement>>;
257
+ type BackgroundColorType = "accent" | "info" | "attention-muted" | "positive-muted" | "negative-muted" | "primary" | "primary-inverted" | "secondary" | "secondary-inverted" | "tertiary" | "tertiary-inverted" | "quaternary" | "quaternary-inverted" | "specialbg-component" | "specialbg-component-inverted" | "specialbg-primary-grouped" | "specialbg-secondary-grouped" | "specialbg-tertiary-grouped" | "specialbg-secondary-transparent" | "specialbg-secondary-transparent-inverted" | "specialbg-tertiary-transparent" | "specialbg-tertiary-transparent-inverted";
258
+ type GraphicColorType = "accent" | "link" | "attention" | "positive" | "negative" | "primary" | "primary-inverted" | "secondary" | "secondary-inverted" | "tertiary" | "tertiary-inverted" | "quaternary" | "quaternary-inverted" | "static-light" | "static-accent" | "static-dark";
259
+ type IconColorType = Extract<GraphicColorType, "positive" | "attention" | "link" | "negative" | "tertiary" | "secondary" | "primary">;
257
260
  type BadgeProps = {
258
261
  /**
259
262
  * Дополнительный класс
@@ -285,16 +288,24 @@ type BadgeProps = {
285
288
  */
286
289
  height?: number;
287
290
  /**
288
- * Цветовое оформление иконки
291
+ * Цветовое оформление бейджа при view='count'
289
292
  */
290
- iconColor?: "positive" | "attention" | "link" | "negative" | "tertiary" | "secondary" | "primary";
293
+ color?: Extract<BackgroundColorType, "accent" | "primary" | "specialbg-secondary-transparent">;
294
+ /**
295
+ * Цветовое оформление бейджа при view='icon'
296
+ */
297
+ iconColor?: IconColorType;
298
+ /**
299
+ * Цвет подложки под иконкой
300
+ */
301
+ iconUnderlayColor?: Extract<GraphicColorType, "primary" | "static-light">;
291
302
  /**
292
303
  * Идентификатор для систем автоматизированного тестирования
293
304
  */
294
305
  dataTestId?: string;
295
306
  };
296
307
  // eslint-disable-next-line complexity
297
- declare const Badge: ({ className, size, view, visibleIconOutline, visibleColorOutline, content, height, iconColor, dataTestId }: BadgeProps) => JSX.Element;
308
+ declare const Badge: ({ className, size, view, visibleIconOutline, visibleColorOutline, content, height, iconColor, color, iconUnderlayColor, dataTestId }: BadgeProps) => JSX.Element;
298
309
  type FormControlProps = HTMLAttributes<HTMLDivElement> & {
299
310
  /**
300
311
  * Растягивает компонент на ширину контейнера
@@ -360,6 +371,10 @@ type FormControlProps = HTMLAttributes<HTMLDivElement> & {
360
371
  * Дополнительный класс для поля
361
372
  */
362
373
  fieldClassName?: string;
374
+ /**
375
+ * Дополнительный класс для поля
376
+ */
377
+ inputWrapperClassName?: string;
363
378
  /**
364
379
  * Дополнительный класс для лейбла
365
380
  */
@@ -394,6 +409,7 @@ declare const FormControl: React.ForwardRefExoticComponent<React.HTMLAttributes<
394
409
  bottomAddons?: ReactNode;
395
410
  className?: string | undefined;
396
411
  fieldClassName?: string | undefined;
412
+ inputWrapperClassName?: string | undefined;
397
413
  labelClassName?: string | undefined;
398
414
  addonsClassName?: string | undefined;
399
415
  dataTestId?: string | undefined;
@@ -986,4 +1002,4 @@ type CheckmarkProps = {
986
1002
  */
987
1003
  icon?: FC<SVGProps<SVGSVGElement>>;
988
1004
  };
989
- export { InputProps, Input, Position, PopoverProps, Popover, BadgeProps, Badge, FormControlProps, FormControl, PortalProps, Portal, stackingOrder, StackingContext, StackProps, Stack, PORTAL_CONTAINER_ATTRIBUTE, getDefaultPortalContainer, setRef, AnyObject, OptionShape, GroupShape, BaseSelectChangePayload, BaseSelectProps, FieldProps, ArrowProps, OptionsListProps, OptgroupProps, OptionProps, CheckmarkProps };
1005
+ export { InputProps, Input, Position, PopoverProps, Popover, IconColorType, BadgeProps, Badge, FormControlProps, FormControl, PortalProps, Portal, stackingOrder, StackingContext, StackProps, Stack, PORTAL_CONTAINER_ATTRIBUTE, getDefaultPortalContainer, setRef, AnyObject, OptionShape, GroupShape, BaseSelectChangePayload, BaseSelectProps, FieldProps, ArrowProps, OptionsListProps, OptgroupProps, OptionProps, CheckmarkProps };
package/esm/Component.js CHANGED
@@ -11,7 +11,7 @@ import '@alfalab/icons-glyph/ChevronDownMIcon';
11
11
  import '@alfalab/icons-glyph/MoreMIcon';
12
12
  import '@alfalab/icons-glyph/MoreSIcon';
13
13
 
14
- var styles = {"container":"picker-button__container_ap6x8","optionsPopover":"picker-button__optionsPopover_ap6x8","sideGap":"picker-button__sideGap_ap6x8","option":"picker-button__option_ap6x8"};
14
+ var styles = {"container":"picker-button__container_fi1r2","optionsPopover":"picker-button__optionsPopover_fi1r2","sideGap":"picker-button__sideGap_fi1r2","option":"picker-button__option_fi1r2"};
15
15
  require('./index.css')
16
16
 
17
17
  var SIDE_POSITIONS = ['right', 'right-start', 'right-end', 'left', 'left-start', 'left-end'];
package/esm/field/Component.js CHANGED
@@ -8,7 +8,7 @@ import '@alfalab/icons-glyph/ChevronDownMIcon';
8
8
  import '@alfalab/icons-glyph/MoreMIcon';
9
9
  import '@alfalab/icons-glyph/MoreSIcon';
10
10
 
11
- var styles = {"iconContainer":"picker-button__iconContainer_1kjs8","addonsContainer":"picker-button__addonsContainer_1kjs8","showControlIcon":"picker-button__showControlIcon_1kjs8","open":"picker-button__open_1kjs8"};
11
+ var styles = {"iconContainer":"picker-button__iconContainer_7m9e7","addonsContainer":"picker-button__addonsContainer_7m9e7","showControlIcon":"picker-button__showControlIcon_7m9e7","open":"picker-button__open_7m9e7"};
12
12
  require('./index.css')
13
13
 
14
14
  var Field = function (_a) {
package/esm/field/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 1o1rf */
1
+ /* hash: 1u67g */
2
2
  :root {
3
3
  } /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
4
4
  } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -16,13 +16,13 @@
16
16
  } :root {
17
17
  } :root {
18
18
  --arrow-transform: rotate(180deg);
19
- } .picker-button__iconContainer_1kjs8 {
19
+ } .picker-button__iconContainer_7m9e7 {
20
20
  display: flex;
21
21
  transition: transform 0.15s ease-in-out;
22
- } .picker-button__addonsContainer_1kjs8 {
22
+ } .picker-button__addonsContainer_7m9e7 {
23
23
  display: flex
24
- } .picker-button__addonsContainer_1kjs8.picker-button__showControlIcon_1kjs8 {
24
+ } .picker-button__addonsContainer_7m9e7.picker-button__showControlIcon_7m9e7 {
25
25
  margin-right: var(--gap-2xs);
26
- } .picker-button__open_1kjs8 {
26
+ } .picker-button__open_7m9e7 {
27
27
  transform: var(--arrow-transform);
28
28
  }
package/esm/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 11rjs */
1
+ /* hash: 1t9sf */
2
2
  :root {
3
3
  } /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
4
4
  } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -16,13 +16,13 @@
16
16
  --gap-m: 16px;
17
17
  } :root {
18
18
  } :root {
19
- } .picker-button__container_ap6x8 {
19
+ } .picker-button__container_fi1r2 {
20
20
  min-width: auto;
21
- } .cc-picker-button.picker-button__optionsPopover_ap6x8.picker-button__sideGap_ap6x8 {
21
+ } .cc-picker-button.picker-button__optionsPopover_fi1r2.picker-button__sideGap_fi1r2 {
22
22
  padding: 0 var(--gap-xs);
23
- } .cc-picker-button .picker-button__option_ap6x8 {
23
+ } .cc-picker-button .picker-button__option_fi1r2 {
24
24
  padding: 0 var(--gap-m)
25
- } .cc-picker-button .picker-button__option_ap6x8:before {
25
+ } .cc-picker-button .picker-button__option_fi1r2:before {
26
26
  /* Удаляем разделители у опций выпадающего списка. */
27
27
  display: none;
28
28
  }
package/esm/option/Component.js CHANGED
@@ -2,7 +2,7 @@ import { __rest, __assign } from 'tslib';
2
2
  import React from 'react';
3
3
  import { Option as Option$1 } from '@alfalab/core-components-select/esm';
4
4
 
5
- var styles = {"container":"picker-button__container_1w0oq","icon":"picker-button__icon_1w0oq","content":"picker-button__content_1w0oq"};
5
+ var styles = {"container":"picker-button__container_1sfi5","icon":"picker-button__icon_1sfi5","content":"picker-button__content_1sfi5"};
6
6
  require('./index.css')
7
7
 
8
8
  var Option = function (_a) {
package/esm/option/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: t2rq0 */
1
+ /* hash: 1kl0c */
2
2
  :root {
3
3
  } /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
4
4
  } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -15,13 +15,13 @@
15
15
  --gap-s: 12px;
16
16
  } :root {
17
17
  } :root {
18
- } .picker-button__container_1w0oq {
18
+ } .picker-button__container_1sfi5 {
19
19
  display: flex;
20
20
  align-items: center;
21
- } .picker-button__icon_1w0oq {
21
+ } .picker-button__icon_1sfi5 {
22
22
  display: flex;
23
23
  margin-right: var(--gap-s);
24
- } .picker-button__content_1w0oq {
24
+ } .picker-button__content_1sfi5 {
25
25
  overflow: hidden;
26
26
  flex: 1;
27
27
  text-overflow: ellipsis;
package/esm/typings-5e1b8383.d.ts CHANGED
@@ -254,6 +254,9 @@ type PopoverProps = {
254
254
  children?: ReactNode;
255
255
  };
256
256
  declare const Popover: React.ForwardRefExoticComponent<PopoverProps & React.RefAttributes<HTMLDivElement>>;
257
+ type BackgroundColorType = "accent" | "info" | "attention-muted" | "positive-muted" | "negative-muted" | "primary" | "primary-inverted" | "secondary" | "secondary-inverted" | "tertiary" | "tertiary-inverted" | "quaternary" | "quaternary-inverted" | "specialbg-component" | "specialbg-component-inverted" | "specialbg-primary-grouped" | "specialbg-secondary-grouped" | "specialbg-tertiary-grouped" | "specialbg-secondary-transparent" | "specialbg-secondary-transparent-inverted" | "specialbg-tertiary-transparent" | "specialbg-tertiary-transparent-inverted";
258
+ type GraphicColorType = "accent" | "link" | "attention" | "positive" | "negative" | "primary" | "primary-inverted" | "secondary" | "secondary-inverted" | "tertiary" | "tertiary-inverted" | "quaternary" | "quaternary-inverted" | "static-light" | "static-accent" | "static-dark";
259
+ type IconColorType = Extract<GraphicColorType, "positive" | "attention" | "link" | "negative" | "tertiary" | "secondary" | "primary">;
257
260
  type BadgeProps = {
258
261
  /**
259
262
  * Дополнительный класс
@@ -285,16 +288,24 @@ type BadgeProps = {
285
288
  */
286
289
  height?: number;
287
290
  /**
288
- * Цветовое оформление иконки
291
+ * Цветовое оформление бейджа при view='count'
289
292
  */
290
- iconColor?: "positive" | "attention" | "link" | "negative" | "tertiary" | "secondary" | "primary";
293
+ color?: Extract<BackgroundColorType, "accent" | "primary" | "specialbg-secondary-transparent">;
294
+ /**
295
+ * Цветовое оформление бейджа при view='icon'
296
+ */
297
+ iconColor?: IconColorType;
298
+ /**
299
+ * Цвет подложки под иконкой
300
+ */
301
+ iconUnderlayColor?: Extract<GraphicColorType, "primary" | "static-light">;
291
302
  /**
292
303
  * Идентификатор для систем автоматизированного тестирования
293
304
  */
294
305
  dataTestId?: string;
295
306
  };
296
307
  // eslint-disable-next-line complexity
297
- declare const Badge: ({ className, size, view, visibleIconOutline, visibleColorOutline, content, height, iconColor, dataTestId }: BadgeProps) => JSX.Element;
308
+ declare const Badge: ({ className, size, view, visibleIconOutline, visibleColorOutline, content, height, iconColor, color, iconUnderlayColor, dataTestId }: BadgeProps) => JSX.Element;
298
309
  type FormControlProps = HTMLAttributes<HTMLDivElement> & {
299
310
  /**
300
311
  * Растягивает компонент на ширину контейнера
@@ -360,6 +371,10 @@ type FormControlProps = HTMLAttributes<HTMLDivElement> & {
360
371
  * Дополнительный класс для поля
361
372
  */
362
373
  fieldClassName?: string;
374
+ /**
375
+ * Дополнительный класс для поля
376
+ */
377
+ inputWrapperClassName?: string;
363
378
  /**
364
379
  * Дополнительный класс для лейбла
365
380
  */
@@ -394,6 +409,7 @@ declare const FormControl: React.ForwardRefExoticComponent<React.HTMLAttributes<
394
409
  bottomAddons?: ReactNode;
395
410
  className?: string | undefined;
396
411
  fieldClassName?: string | undefined;
412
+ inputWrapperClassName?: string | undefined;
397
413
  labelClassName?: string | undefined;
398
414
  addonsClassName?: string | undefined;
399
415
  dataTestId?: string | undefined;
@@ -986,4 +1002,4 @@ type CheckmarkProps = {
986
1002
  */
987
1003
  icon?: FC<SVGProps<SVGSVGElement>>;
988
1004
  };
989
- export { InputProps, Input, Position, PopoverProps, Popover, BadgeProps, Badge, FormControlProps, FormControl, PortalProps, Portal, stackingOrder, StackingContext, StackProps, Stack, PORTAL_CONTAINER_ATTRIBUTE, getDefaultPortalContainer, setRef, AnyObject, OptionShape, GroupShape, BaseSelectChangePayload, BaseSelectProps, FieldProps, ArrowProps, OptionsListProps, OptgroupProps, OptionProps, CheckmarkProps };
1005
+ export { InputProps, Input, Position, PopoverProps, Popover, IconColorType, BadgeProps, Badge, FormControlProps, FormControl, PortalProps, Portal, stackingOrder, StackingContext, StackProps, Stack, PORTAL_CONTAINER_ATTRIBUTE, getDefaultPortalContainer, setRef, AnyObject, OptionShape, GroupShape, BaseSelectChangePayload, BaseSelectProps, FieldProps, ArrowProps, OptionsListProps, OptgroupProps, OptionProps, CheckmarkProps };
package/field/Component.js CHANGED
@@ -17,7 +17,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
17
17
  var React__default = /*#__PURE__*/_interopDefaultCompat(React);
18
18
  var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
19
19
 
20
- var styles = {"iconContainer":"picker-button__iconContainer_1kjs8","addonsContainer":"picker-button__addonsContainer_1kjs8","showControlIcon":"picker-button__showControlIcon_1kjs8","open":"picker-button__open_1kjs8"};
20
+ var styles = {"iconContainer":"picker-button__iconContainer_7m9e7","addonsContainer":"picker-button__addonsContainer_7m9e7","showControlIcon":"picker-button__showControlIcon_7m9e7","open":"picker-button__open_7m9e7"};
21
21
  require('./index.css')
22
22
 
23
23
  var Field = function (_a) {
package/field/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 1o1rf */
1
+ /* hash: 1u67g */
2
2
  :root {
3
3
  } /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
4
4
  } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -16,13 +16,13 @@
16
16
  } :root {
17
17
  } :root {
18
18
  --arrow-transform: rotate(180deg);
19
- } .picker-button__iconContainer_1kjs8 {
19
+ } .picker-button__iconContainer_7m9e7 {
20
20
  display: flex;
21
21
  transition: transform 0.15s ease-in-out;
22
- } .picker-button__addonsContainer_1kjs8 {
22
+ } .picker-button__addonsContainer_7m9e7 {
23
23
  display: flex
24
- } .picker-button__addonsContainer_1kjs8.picker-button__showControlIcon_1kjs8 {
24
+ } .picker-button__addonsContainer_7m9e7.picker-button__showControlIcon_7m9e7 {
25
25
  margin-right: var(--gap-2xs);
26
- } .picker-button__open_1kjs8 {
26
+ } .picker-button__open_7m9e7 {
27
27
  transform: var(--arrow-transform);
28
28
  }
package/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 11rjs */
1
+ /* hash: 1t9sf */
2
2
  :root {
3
3
  } /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
4
4
  } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -16,13 +16,13 @@
16
16
  --gap-m: 16px;
17
17
  } :root {
18
18
  } :root {
19
- } .picker-button__container_ap6x8 {
19
+ } .picker-button__container_fi1r2 {
20
20
  min-width: auto;
21
- } .cc-picker-button.picker-button__optionsPopover_ap6x8.picker-button__sideGap_ap6x8 {
21
+ } .cc-picker-button.picker-button__optionsPopover_fi1r2.picker-button__sideGap_fi1r2 {
22
22
  padding: 0 var(--gap-xs);
23
- } .cc-picker-button .picker-button__option_ap6x8 {
23
+ } .cc-picker-button .picker-button__option_fi1r2 {
24
24
  padding: 0 var(--gap-m)
25
- } .cc-picker-button .picker-button__option_ap6x8:before {
25
+ } .cc-picker-button .picker-button__option_fi1r2:before {
26
26
  /* Удаляем разделители у опций выпадающего списка. */
27
27
  display: none;
28
28
  }
package/modern/Component.js CHANGED
@@ -10,7 +10,7 @@ import '@alfalab/icons-glyph/ChevronDownMIcon';
10
10
  import '@alfalab/icons-glyph/MoreMIcon';
11
11
  import '@alfalab/icons-glyph/MoreSIcon';
12
12
 
13
- const styles = {"container":"picker-button__container_ap6x8","optionsPopover":"picker-button__optionsPopover_ap6x8","sideGap":"picker-button__sideGap_ap6x8","option":"picker-button__option_ap6x8"};
13
+ const styles = {"container":"picker-button__container_fi1r2","optionsPopover":"picker-button__optionsPopover_fi1r2","sideGap":"picker-button__sideGap_fi1r2","option":"picker-button__option_fi1r2"};
14
14
  require('./index.css')
15
15
 
16
16
  const SIDE_POSITIONS = ['right', 'right-start', 'right-end', 'left', 'left-start', 'left-end'];
package/modern/field/Component.js CHANGED
@@ -7,7 +7,7 @@ import '@alfalab/icons-glyph/ChevronDownMIcon';
7
7
  import '@alfalab/icons-glyph/MoreMIcon';
8
8
  import '@alfalab/icons-glyph/MoreSIcon';
9
9
 
10
- const styles = {"iconContainer":"picker-button__iconContainer_1kjs8","addonsContainer":"picker-button__addonsContainer_1kjs8","showControlIcon":"picker-button__showControlIcon_1kjs8","open":"picker-button__open_1kjs8"};
10
+ const styles = {"iconContainer":"picker-button__iconContainer_7m9e7","addonsContainer":"picker-button__addonsContainer_7m9e7","showControlIcon":"picker-button__showControlIcon_7m9e7","open":"picker-button__open_7m9e7"};
11
11
  require('./index.css')
12
12
 
13
13
  const Field = ({ buttonSize = 'm', buttonVariant = 'default', view, label, open, multiple, rightAddons, Arrow, innerProps, className, selected, selectedMultiple, setSelectedItems, toggleMenu, valueRenderer, showArrow = true, labelView, ...restProps }) => {
package/modern/field/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 1o1rf */
1
+ /* hash: 1u67g */
2
2
  :root {
3
3
  } /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
4
4
  } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -16,13 +16,13 @@
16
16
  } :root {
17
17
  } :root {
18
18
  --arrow-transform: rotate(180deg);
19
- } .picker-button__iconContainer_1kjs8 {
19
+ } .picker-button__iconContainer_7m9e7 {
20
20
  display: flex;
21
21
  transition: transform 0.15s ease-in-out;
22
- } .picker-button__addonsContainer_1kjs8 {
22
+ } .picker-button__addonsContainer_7m9e7 {
23
23
  display: flex
24
- } .picker-button__addonsContainer_1kjs8.picker-button__showControlIcon_1kjs8 {
24
+ } .picker-button__addonsContainer_7m9e7.picker-button__showControlIcon_7m9e7 {
25
25
  margin-right: var(--gap-2xs);
26
- } .picker-button__open_1kjs8 {
26
+ } .picker-button__open_7m9e7 {
27
27
  transform: var(--arrow-transform);
28
28
  }
package/modern/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 11rjs */
1
+ /* hash: 1t9sf */
2
2
  :root {
3
3
  } /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
4
4
  } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -16,13 +16,13 @@
16
16
  --gap-m: 16px;
17
17
  } :root {
18
18
  } :root {
19
- } .picker-button__container_ap6x8 {
19
+ } .picker-button__container_fi1r2 {
20
20
  min-width: auto;
21
- } .cc-picker-button.picker-button__optionsPopover_ap6x8.picker-button__sideGap_ap6x8 {
21
+ } .cc-picker-button.picker-button__optionsPopover_fi1r2.picker-button__sideGap_fi1r2 {
22
22
  padding: 0 var(--gap-xs);
23
- } .cc-picker-button .picker-button__option_ap6x8 {
23
+ } .cc-picker-button .picker-button__option_fi1r2 {
24
24
  padding: 0 var(--gap-m)
25
- } .cc-picker-button .picker-button__option_ap6x8:before {
25
+ } .cc-picker-button .picker-button__option_fi1r2:before {
26
26
  /* Удаляем разделители у опций выпадающего списка. */
27
27
  display: none;
28
28
  }
package/modern/option/Component.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
2
  import { Option as Option$1 } from '@alfalab/core-components-select/modern';
3
3
 
4
- const styles = {"container":"picker-button__container_1w0oq","icon":"picker-button__icon_1w0oq","content":"picker-button__content_1w0oq"};
4
+ const styles = {"container":"picker-button__container_1sfi5","icon":"picker-button__icon_1sfi5","content":"picker-button__content_1sfi5"};
5
5
  require('./index.css')
6
6
 
7
7
  const Option = ({ option, children, ...restProps }) => {
package/modern/option/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: t2rq0 */
1
+ /* hash: 1kl0c */
2
2
  :root {
3
3
  } /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
4
4
  } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -15,13 +15,13 @@
15
15
  --gap-s: 12px;
16
16
  } :root {
17
17
  } :root {
18
- } .picker-button__container_1w0oq {
18
+ } .picker-button__container_1sfi5 {
19
19
  display: flex;
20
20
  align-items: center;
21
- } .picker-button__icon_1w0oq {
21
+ } .picker-button__icon_1sfi5 {
22
22
  display: flex;
23
23
  margin-right: var(--gap-s);
24
- } .picker-button__content_1w0oq {
24
+ } .picker-button__content_1sfi5 {
25
25
  overflow: hidden;
26
26
  flex: 1;
27
27
  text-overflow: ellipsis;
package/modern/typings-5e1b8383.d.ts CHANGED
@@ -254,6 +254,9 @@ type PopoverProps = {
254
254
  children?: ReactNode;
255
255
  };
256
256
  declare const Popover: React.ForwardRefExoticComponent<PopoverProps & React.RefAttributes<HTMLDivElement>>;
257
+ type BackgroundColorType = "accent" | "info" | "attention-muted" | "positive-muted" | "negative-muted" | "primary" | "primary-inverted" | "secondary" | "secondary-inverted" | "tertiary" | "tertiary-inverted" | "quaternary" | "quaternary-inverted" | "specialbg-component" | "specialbg-component-inverted" | "specialbg-primary-grouped" | "specialbg-secondary-grouped" | "specialbg-tertiary-grouped" | "specialbg-secondary-transparent" | "specialbg-secondary-transparent-inverted" | "specialbg-tertiary-transparent" | "specialbg-tertiary-transparent-inverted";
258
+ type GraphicColorType = "accent" | "link" | "attention" | "positive" | "negative" | "primary" | "primary-inverted" | "secondary" | "secondary-inverted" | "tertiary" | "tertiary-inverted" | "quaternary" | "quaternary-inverted" | "static-light" | "static-accent" | "static-dark";
259
+ type IconColorType = Extract<GraphicColorType, "positive" | "attention" | "link" | "negative" | "tertiary" | "secondary" | "primary">;
257
260
  type BadgeProps = {
258
261
  /**
259
262
  * Дополнительный класс
@@ -285,16 +288,24 @@ type BadgeProps = {
285
288
  */
286
289
  height?: number;
287
290
  /**
288
- * Цветовое оформление иконки
291
+ * Цветовое оформление бейджа при view='count'
289
292
  */
290
- iconColor?: "positive" | "attention" | "link" | "negative" | "tertiary" | "secondary" | "primary";
293
+ color?: Extract<BackgroundColorType, "accent" | "primary" | "specialbg-secondary-transparent">;
294
+ /**
295
+ * Цветовое оформление бейджа при view='icon'
296
+ */
297
+ iconColor?: IconColorType;
298
+ /**
299
+ * Цвет подложки под иконкой
300
+ */
301
+ iconUnderlayColor?: Extract<GraphicColorType, "primary" | "static-light">;
291
302
  /**
292
303
  * Идентификатор для систем автоматизированного тестирования
293
304
  */
294
305
  dataTestId?: string;
295
306
  };
296
307
  // eslint-disable-next-line complexity
297
- declare const Badge: ({ className, size, view, visibleIconOutline, visibleColorOutline, content, height, iconColor, dataTestId }: BadgeProps) => JSX.Element;
308
+ declare const Badge: ({ className, size, view, visibleIconOutline, visibleColorOutline, content, height, iconColor, color, iconUnderlayColor, dataTestId }: BadgeProps) => JSX.Element;
298
309
  type FormControlProps = HTMLAttributes<HTMLDivElement> & {
299
310
  /**
300
311
  * Растягивает компонент на ширину контейнера
@@ -360,6 +371,10 @@ type FormControlProps = HTMLAttributes<HTMLDivElement> & {
360
371
  * Дополнительный класс для поля
361
372
  */
362
373
  fieldClassName?: string;
374
+ /**
375
+ * Дополнительный класс для поля
376
+ */
377
+ inputWrapperClassName?: string;
363
378
  /**
364
379
  * Дополнительный класс для лейбла
365
380
  */
@@ -394,6 +409,7 @@ declare const FormControl: React.ForwardRefExoticComponent<React.HTMLAttributes<
394
409
  bottomAddons?: ReactNode;
395
410
  className?: string | undefined;
396
411
  fieldClassName?: string | undefined;
412
+ inputWrapperClassName?: string | undefined;
397
413
  labelClassName?: string | undefined;
398
414
  addonsClassName?: string | undefined;
399
415
  dataTestId?: string | undefined;
@@ -986,4 +1002,4 @@ type CheckmarkProps = {
986
1002
  */
987
1003
  icon?: FC<SVGProps<SVGSVGElement>>;
988
1004
  };
989
- export { InputProps, Input, Position, PopoverProps, Popover, BadgeProps, Badge, FormControlProps, FormControl, PortalProps, Portal, stackingOrder, StackingContext, StackProps, Stack, PORTAL_CONTAINER_ATTRIBUTE, getDefaultPortalContainer, setRef, AnyObject, OptionShape, GroupShape, BaseSelectChangePayload, BaseSelectProps, FieldProps, ArrowProps, OptionsListProps, OptgroupProps, OptionProps, CheckmarkProps };
1005
+ export { InputProps, Input, Position, PopoverProps, Popover, IconColorType, BadgeProps, Badge, FormControlProps, FormControl, PortalProps, Portal, stackingOrder, StackingContext, StackProps, Stack, PORTAL_CONTAINER_ATTRIBUTE, getDefaultPortalContainer, setRef, AnyObject, OptionShape, GroupShape, BaseSelectChangePayload, BaseSelectProps, FieldProps, ArrowProps, OptionsListProps, OptgroupProps, OptionProps, CheckmarkProps };
package/option/Component.js CHANGED
@@ -10,7 +10,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
10
10
 
11
11
  var React__default = /*#__PURE__*/_interopDefaultCompat(React);
12
12
 
13
- var styles = {"container":"picker-button__container_1w0oq","icon":"picker-button__icon_1w0oq","content":"picker-button__content_1w0oq"};
13
+ var styles = {"container":"picker-button__container_1sfi5","icon":"picker-button__icon_1sfi5","content":"picker-button__content_1sfi5"};
14
14
  require('./index.css')
15
15
 
16
16
  var Option = function (_a) {
package/option/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: t2rq0 */
1
+ /* hash: 1kl0c */
2
2
  :root {
3
3
  } /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
4
4
  } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -15,13 +15,13 @@
15
15
  --gap-s: 12px;
16
16
  } :root {
17
17
  } :root {
18
- } .picker-button__container_1w0oq {
18
+ } .picker-button__container_1sfi5 {
19
19
  display: flex;
20
20
  align-items: center;
21
- } .picker-button__icon_1w0oq {
21
+ } .picker-button__icon_1sfi5 {
22
22
  display: flex;
23
23
  margin-right: var(--gap-s);
24
- } .picker-button__content_1w0oq {
24
+ } .picker-button__content_1sfi5 {
25
25
  overflow: hidden;
26
26
  flex: 1;
27
27
  text-overflow: ellipsis;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alfalab/core-components-picker-button",
3
- "version": "10.3.16",
3
+ "version": "10.3.18",
4
4
  "description": "Picker button component",
5
5
  "keywords": [],
6
6
  "license": "MIT",
@@ -19,7 +19,7 @@
19
19
  },
20
20
  "dependencies": {
21
21
  "@alfalab/core-components-button": "^8.0.0",
22
- "@alfalab/core-components-select": "^14.0.0",
22
+ "@alfalab/core-components-select": "^14.0.2",
23
23
  "@alfalab/icons-classic": "^2.3.0",
24
24
  "@alfalab/icons-glyph": "^2.89.0",
25
25
  "classnames": "^2.3.1",
package/typings-5e1b8383.d.ts CHANGED
@@ -254,6 +254,9 @@ type PopoverProps = {
254
254
  children?: ReactNode;
255
255
  };
256
256
  declare const Popover: React.ForwardRefExoticComponent<PopoverProps & React.RefAttributes<HTMLDivElement>>;
257
+ type BackgroundColorType = "accent" | "info" | "attention-muted" | "positive-muted" | "negative-muted" | "primary" | "primary-inverted" | "secondary" | "secondary-inverted" | "tertiary" | "tertiary-inverted" | "quaternary" | "quaternary-inverted" | "specialbg-component" | "specialbg-component-inverted" | "specialbg-primary-grouped" | "specialbg-secondary-grouped" | "specialbg-tertiary-grouped" | "specialbg-secondary-transparent" | "specialbg-secondary-transparent-inverted" | "specialbg-tertiary-transparent" | "specialbg-tertiary-transparent-inverted";
258
+ type GraphicColorType = "accent" | "link" | "attention" | "positive" | "negative" | "primary" | "primary-inverted" | "secondary" | "secondary-inverted" | "tertiary" | "tertiary-inverted" | "quaternary" | "quaternary-inverted" | "static-light" | "static-accent" | "static-dark";
259
+ type IconColorType = Extract<GraphicColorType, "positive" | "attention" | "link" | "negative" | "tertiary" | "secondary" | "primary">;
257
260
  type BadgeProps = {
258
261
  /**
259
262
  * Дополнительный класс
@@ -285,16 +288,24 @@ type BadgeProps = {
285
288
  */
286
289
  height?: number;
287
290
  /**
288
- * Цветовое оформление иконки
291
+ * Цветовое оформление бейджа при view='count'
289
292
  */
290
- iconColor?: "positive" | "attention" | "link" | "negative" | "tertiary" | "secondary" | "primary";
293
+ color?: Extract<BackgroundColorType, "accent" | "primary" | "specialbg-secondary-transparent">;
294
+ /**
295
+ * Цветовое оформление бейджа при view='icon'
296
+ */
297
+ iconColor?: IconColorType;
298
+ /**
299
+ * Цвет подложки под иконкой
300
+ */
301
+ iconUnderlayColor?: Extract<GraphicColorType, "primary" | "static-light">;
291
302
  /**
292
303
  * Идентификатор для систем автоматизированного тестирования
293
304
  */
294
305
  dataTestId?: string;
295
306
  };
296
307
  // eslint-disable-next-line complexity
297
- declare const Badge: ({ className, size, view, visibleIconOutline, visibleColorOutline, content, height, iconColor, dataTestId }: BadgeProps) => JSX.Element;
308
+ declare const Badge: ({ className, size, view, visibleIconOutline, visibleColorOutline, content, height, iconColor, color, iconUnderlayColor, dataTestId }: BadgeProps) => JSX.Element;
298
309
  type FormControlProps = HTMLAttributes<HTMLDivElement> & {
299
310
  /**
300
311
  * Растягивает компонент на ширину контейнера
@@ -360,6 +371,10 @@ type FormControlProps = HTMLAttributes<HTMLDivElement> & {
360
371
  * Дополнительный класс для поля
361
372
  */
362
373
  fieldClassName?: string;
374
+ /**
375
+ * Дополнительный класс для поля
376
+ */
377
+ inputWrapperClassName?: string;
363
378
  /**
364
379
  * Дополнительный класс для лейбла
365
380
  */
@@ -394,6 +409,7 @@ declare const FormControl: React.ForwardRefExoticComponent<React.HTMLAttributes<
394
409
  bottomAddons?: ReactNode;
395
410
  className?: string | undefined;
396
411
  fieldClassName?: string | undefined;
412
+ inputWrapperClassName?: string | undefined;
397
413
  labelClassName?: string | undefined;
398
414
  addonsClassName?: string | undefined;
399
415
  dataTestId?: string | undefined;
@@ -986,4 +1002,4 @@ type CheckmarkProps = {
986
1002
  */
987
1003
  icon?: FC<SVGProps<SVGSVGElement>>;
988
1004
  };
989
- export { InputProps, Input, Position, PopoverProps, Popover, BadgeProps, Badge, FormControlProps, FormControl, PortalProps, Portal, stackingOrder, StackingContext, StackProps, Stack, PORTAL_CONTAINER_ATTRIBUTE, getDefaultPortalContainer, setRef, AnyObject, OptionShape, GroupShape, BaseSelectChangePayload, BaseSelectProps, FieldProps, ArrowProps, OptionsListProps, OptgroupProps, OptionProps, CheckmarkProps };
1005
+ export { InputProps, Input, Position, PopoverProps, Popover, IconColorType, BadgeProps, Badge, FormControlProps, FormControl, PortalProps, Portal, stackingOrder, StackingContext, StackProps, Stack, PORTAL_CONTAINER_ATTRIBUTE, getDefaultPortalContainer, setRef, AnyObject, OptionShape, GroupShape, BaseSelectChangePayload, BaseSelectProps, FieldProps, ArrowProps, OptionsListProps, OptgroupProps, OptionProps, CheckmarkProps };