@salutejs/plasma-web 1.406.0-canary.1392.11041436795.0 → 1.406.0-canary.1421.11039037651.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (35) hide show
  1. package/api/plasma-web.api.md +59 -15
  2. package/components/DatePicker/DatePicker.d.ts +1 -0
  3. package/components/Segment/Segment.d.ts +4 -16
  4. package/components/Segment/SegmentGroup.config.d.ts +2 -5
  5. package/components/Segment/SegmentGroup.config.js +11 -14
  6. package/components/Segment/SegmentItem.config.d.ts +1 -1
  7. package/components/Segment/SegmentItem.config.js +8 -8
  8. package/components/Slider/Slider.d.ts +47 -1
  9. package/css/cjs/components/Segment/Segment.css +18 -19
  10. package/css/cjs/components/Segment/SegmentGroup.config.js +3 -6
  11. package/css/cjs/components/Segment/SegmentGroup.config.js.map +1 -1
  12. package/css/cjs/components/Segment/SegmentGroup.config_notwep.css +10 -0
  13. package/css/cjs/components/Segment/SegmentItem.config.js +3 -3
  14. package/css/cjs/components/Segment/SegmentItem.config.js.map +1 -1
  15. package/css/cjs/components/Segment/SegmentItem.config_g2b5lk.css +9 -0
  16. package/css/cjs/index.css +19 -20
  17. package/css/es/components/Segment/Segment.css +18 -19
  18. package/css/es/components/Segment/SegmentGroup.config.js +3 -6
  19. package/css/es/components/Segment/SegmentGroup.config.js.map +1 -1
  20. package/css/es/components/Segment/SegmentGroup.config_notwep.css +10 -0
  21. package/css/es/components/Segment/SegmentItem.config.js +3 -3
  22. package/css/es/components/Segment/SegmentItem.config.js.map +1 -1
  23. package/css/es/components/Segment/SegmentItem.config_g2b5lk.css +9 -0
  24. package/css/es/index.css +19 -20
  25. package/es/components/Segment/SegmentGroup.config.js +11 -14
  26. package/es/components/Segment/SegmentItem.config.js +8 -8
  27. package/es/hooks/index.js +2 -1
  28. package/hooks/index.d.ts +1 -0
  29. package/hooks/index.js +8 -1
  30. package/package.json +3 -3
  31. package/temp/plasma-web.api.md +59 -15
  32. package/css/cjs/components/Segment/SegmentGroup.config_rwcojv.css +0 -11
  33. package/css/cjs/components/Segment/SegmentItem.config_1fal3h5.css +0 -9
  34. package/css/es/components/Segment/SegmentGroup.config_rwcojv.css +0 -11
  35. package/css/es/components/Segment/SegmentItem.config_1fal3h5.css +0 -9
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@salutejs/plasma-web",
3
- "version": "1.406.0-canary.1392.11041436795.0",
3
+ "version": "1.406.0-canary.1421.11039037651.0",
4
4
  "description": "Salute Design System / React UI kit for web applications",
5
5
  "author": "Salute Frontend Team <salute.developers@gmail.com>",
6
6
  "license": "MIT",
@@ -21,7 +21,7 @@
21
21
  "dependencies": {
22
22
  "@salutejs/plasma-core": "1.180.0",
23
23
  "@salutejs/plasma-hope": "1.312.0",
24
- "@salutejs/plasma-new-hope": "0.154.0-canary.1392.11041436795.0",
24
+ "@salutejs/plasma-new-hope": "0.154.0-canary.1421.11039037651.0",
25
25
  "@salutejs/plasma-themes": "0.18.0",
26
26
  "@salutejs/plasma-tokens-b2b": "1.42.0",
27
27
  "@salutejs/plasma-tokens-b2c": "0.52.0",
@@ -112,5 +112,5 @@
112
112
  "Fanil Zubairov"
113
113
  ],
114
114
  "sideEffects": false,
115
- "gitHead": "9129c50002be8b4dd68e5e9470700592c1ffb47b"
115
+ "gitHead": "616e7a9fba1d1270d3ce9cb5d64631ffdd05300c"
116
116
  }
@@ -138,6 +138,8 @@ import { FC } from 'react';
138
138
  import { Filter } from '@salutejs/plasma-new-hope/types/engines/types';
139
139
  import { FocusProps } from '@salutejs/plasma-core';
140
140
  import { formatCurrency } from '@salutejs/plasma-core';
141
+ import { FormTypeNumber } from '@salutejs/plasma-new-hope/types/types/FormType';
142
+ import { FormTypeNumberArray } from '@salutejs/plasma-new-hope/types/types/FormType';
141
143
  import { ForwardRefExoticComponent } from 'react';
142
144
  import { FunctionComponent } from 'react';
143
145
  import { gridBreakpoints } from '@salutejs/plasma-hope';
@@ -245,10 +247,11 @@ import { sheetClasses } from '@salutejs/plasma-new-hope/styled-components';
245
247
  import { SheetProps } from '@salutejs/plasma-new-hope/styled-components';
246
248
  import { ShiftProps } from '@salutejs/plasma-core';
247
249
  import { ShowToastArgs } from '@salutejs/plasma-new-hope/styled-components';
248
- import { SingleSliderProps } from '@salutejs/plasma-new-hope/styled-components';
249
250
  import { SkeletonGradientProps } from '@salutejs/plasma-core';
250
251
  import { SkeletonGradientProps as SkeletonGradientProps_2 } from '@salutejs/plasma-new-hope/styled-components';
251
252
  import { SkeletonSizeProps } from '@salutejs/plasma-new-hope/types/components/Skeleton/Skeleton.types';
253
+ import { SliderBaseProps } from '@salutejs/plasma-new-hope/types/components/Slider/components/SliderBase/SliderBase.types';
254
+ import { SliderInternalProps } from '@salutejs/plasma-new-hope/types/components/Slider/components';
252
255
  import { SliderProps } from '@salutejs/plasma-new-hope/styled-components';
253
256
  import { SmartPaginationDots } from '@salutejs/plasma-hope';
254
257
  import { SmartPaginationDotsProps } from '@salutejs/plasma-hope';
@@ -307,6 +310,7 @@ import { UploadVisualProps } from '@salutejs/plasma-hope';
307
310
  import { useDebouncedFunction } from '@salutejs/plasma-core';
308
311
  import { useFocusTrap } from '@salutejs/plasma-hope';
309
312
  import { useForkRef } from '@salutejs/plasma-core';
313
+ import { useForm } from '@salutejs/plasma-new-hope';
310
314
  import { useIsomorphicLayoutEffect } from '@salutejs/plasma-core';
311
315
  import { usePopupContext as usePopupBaseContext } from '@salutejs/plasma-new-hope/styled-components';
312
316
  import { useSegment } from '@salutejs/plasma-new-hope/styled-components';
@@ -1584,6 +1588,7 @@ true: PolymorphicClassName;
1584
1588
  }> & DatePickerdVariationProps & {
1585
1589
  defaultFirstDate?: Date | undefined;
1586
1590
  defaultSecondDate?: Date | undefined;
1591
+ name?: string | undefined;
1587
1592
  onCommitFirstDate?: ((value: string | Date, error?: boolean | undefined, success?: boolean | undefined, dateInfo?: DateInfo | undefined) => void) | undefined;
1588
1593
  onCommitSecondDate?: ((value: string | Date, error?: boolean | undefined, success?: boolean | undefined, dateInfo?: DateInfo | undefined) => void) | undefined;
1589
1594
  } & {
@@ -2675,26 +2680,20 @@ true: PolymorphicClassName;
2675
2680
  pilled: {
2676
2681
  true: PolymorphicClassName;
2677
2682
  };
2678
- stretch: {
2679
- true: PolymorphicClassName;
2680
- };
2681
2683
  filledBackground: {
2682
2684
  true: PolymorphicClassName;
2683
2685
  };
2684
- orientation: {
2685
- vertical: PolymorphicClassName;
2686
+ stretch: {
2687
+ true: PolymorphicClassName;
2686
2688
  };
2687
2689
  }> & HTMLAttributes<HTMLDivElement> & {
2688
2690
  selectionMode?: "multiple" | "single" | undefined;
2689
2691
  disabled?: boolean | undefined;
2690
2692
  stretch?: boolean | undefined;
2691
- clip?: "scroll" | "showAll" | undefined;
2692
- orientation?: "horizontal" | "vertical" | undefined;
2693
2693
  pilled?: boolean | undefined;
2694
2694
  filledBackground?: boolean | undefined;
2695
2695
  size?: string | undefined;
2696
2696
  view?: string | undefined;
2697
- hasBackground?: boolean | undefined;
2698
2697
  } & RefAttributes<HTMLDivElement>>;
2699
2698
 
2700
2699
  export { SegmentGroupProps }
@@ -2703,8 +2702,8 @@ export { SegmentGroupProps }
2703
2702
  export const SegmentItem: FunctionComponent<PropsType< {
2704
2703
  view: {
2705
2704
  clear: PolymorphicClassName;
2706
- secondary: PolymorphicClassName;
2707
2705
  default: PolymorphicClassName;
2706
+ secondary: PolymorphicClassName;
2708
2707
  };
2709
2708
  size: {
2710
2709
  xs: PolymorphicClassName;
@@ -2724,11 +2723,8 @@ id?: string | undefined;
2724
2723
  label?: ReactNode;
2725
2724
  pilled?: boolean | undefined;
2726
2725
  customHandleSelect?: ((e: MouseEvent_2<HTMLButtonElement, MouseEvent>) => void) | undefined;
2727
- skipSelection?: boolean | undefined;
2728
2726
  size?: string | undefined;
2729
- view?: "default" | "secondary" | undefined;
2730
- contentLeft?: ReactNode;
2731
- contentRight?: ReactNode;
2727
+ view?: string | undefined;
2732
2728
  } & RefAttributes<HTMLLabelElement>>;
2733
2729
 
2734
2730
  export { SegmentItemProps }
@@ -2960,7 +2956,53 @@ s: PolymorphicClassName;
2960
2956
  disabled: {
2961
2957
  true: PolymorphicClassName;
2962
2958
  };
2963
- }> & ((SingleSliderProps & RefAttributes<HTMLDivElement>) | (DoubleSliderProps & RefAttributes<HTMLDivElement>))>;
2959
+ }> & ((SliderBaseProps & SliderInternalProps & {
2960
+ onChange?: ((event: FormTypeNumber) => void) | undefined;
2961
+ name: string;
2962
+ value?: undefined;
2963
+ defaultValue?: number | undefined;
2964
+ } & Omit<HTMLAttributes<HTMLDivElement>, "onChange"> & {
2965
+ onChangeCommitted?: ((value: number) => void) | undefined;
2966
+ ariaLabel?: string | undefined;
2967
+ showCurrentValue?: boolean | undefined;
2968
+ showRangeValues?: boolean | undefined;
2969
+ hideMinValueDiff?: number | undefined;
2970
+ hideMaxValueDiff?: number | undefined;
2971
+ rangeValuesPlacement?: "outer" | "inner" | undefined;
2972
+ labelPlacement?: "outer" | "inner" | undefined;
2973
+ multipleStepSize?: number | undefined;
2974
+ view?: string | undefined;
2975
+ size?: "m" | "s" | "l" | undefined;
2976
+ type?: "single" | undefined;
2977
+ } & RefAttributes<HTMLDivElement>) | (SliderBaseProps & SliderInternalProps & {
2978
+ onChange?: ((value: number) => void) | undefined;
2979
+ value: number;
2980
+ name?: undefined;
2981
+ defaultValue?: undefined;
2982
+ } & Omit<HTMLAttributes<HTMLDivElement>, "onChange"> & {
2983
+ onChangeCommitted?: ((value: number) => void) | undefined;
2984
+ ariaLabel?: string | undefined;
2985
+ showCurrentValue?: boolean | undefined;
2986
+ showRangeValues?: boolean | undefined;
2987
+ hideMinValueDiff?: number | undefined;
2988
+ hideMaxValueDiff?: number | undefined;
2989
+ rangeValuesPlacement?: "outer" | "inner" | undefined;
2990
+ labelPlacement?: "outer" | "inner" | undefined;
2991
+ multipleStepSize?: number | undefined;
2992
+ view?: string | undefined;
2993
+ size?: "m" | "s" | "l" | undefined;
2994
+ type?: "single" | undefined;
2995
+ } & RefAttributes<HTMLDivElement>) | (Omit<DoubleSliderProps, "value"> & {
2996
+ onChange?: ((event: FormTypeNumberArray) => void) | undefined;
2997
+ name: string;
2998
+ value?: undefined;
2999
+ defaultValue?: number[] | undefined;
3000
+ } & RefAttributes<HTMLDivElement>) | (Omit<DoubleSliderProps, "value"> & {
3001
+ onChange?: ((values: number[]) => void) | undefined;
3002
+ value: number[];
3003
+ name?: undefined;
3004
+ defaultValue?: undefined;
3005
+ } & RefAttributes<HTMLDivElement>))>;
2964
3006
 
2965
3007
  export { SliderProps }
2966
3008
 
@@ -3287,6 +3329,8 @@ export { useFocusTrap }
3287
3329
 
3288
3330
  export { useForkRef }
3289
3331
 
3332
+ export { useForm }
3333
+
3290
3334
  export { useIsomorphicLayoutEffect }
3291
3335
 
3292
3336
  export { usePopupBaseContext }
@@ -1,11 +0,0 @@
1
- .cct3vnm{--plasma-segment-group-background-color:tranparent;--plasma-segment-outline-focus-color:var(--plasma-colors-button-focused);}
2
- .f15142ru{--plasma-segment-group-background-color:transparent;--plasma-segment-outline-focus-color:var(--plasma-colors-button-focused);}
3
- .xekvq49{--plasma-segment-group-border-radius:0.625rem;--plasma-segment-group-pilled-border-radius:1.125rem;--plasma-segment-group-width:auto;--plasma-segment-group-height:auto;}
4
- .slveods{--plasma-segment-group-border-radius:0.75rem;--plasma-segment-group-pilled-border-radius:1.375rem;--plasma-segment-group-width:auto;--plasma-segment-group-height:auto;}
5
- .mt19ik9{--plasma-segment-group-border-radius:0.875rem;--plasma-segment-group-pilled-border-radius:1.625rem;--plasma-segment-group-width:auto;--plasma-segment-group-height:auto;}
6
- .l1pt19wo{--plasma-segment-group-border-radius:1rem;--plasma-segment-group-pilled-border-radius:1.875rem;--plasma-segment-group-width:auto;--plasma-segment-group-height:auto;}
7
- .t1832286{--plasma-segment-disabled-opacity:0.4;}
8
-
9
-
10
- .tjfuhig{--plasma-segment-group-filled-background-color:var(--plasma-colors-surface-liquid02);}
11
-
@@ -1,9 +0,0 @@
1
- .cw5l9ny{--plasma-segment-item-color:var(--text-secondary);--plasma-segment-item-background-color:transparent;--plasma-segment-item-color-hover:var(--text-primary);--plasma-segment-item-background-color-hover:transparent;--plasma-segment-item-additional-color:var(--text-tertiary);--plasma-segment-item-additional-color-hover:var(--text-secondary);--plasma-segment-item-selected-color:var(--text-primary);--plasma-segment-item-selected-background-color:transparent;--plasma-segment-item-selected-color-hover:var(--text-primary);--plasma-segment-item-selected-background-color-hover:transparent;--plasma-segment-item-selected-additional-color:var(--text-secondary);--plasma-segment-item-selected-additional-color-hover:var(--text-secondary);--plasma-segment-outline-focus-color:var(--plasma-colors-button-focused);}
2
- .s1xvuorj{--plasma-segment-item-color:var(--text-primary);--plasma-segment-item-background-color:transparent;--plasma-segment-item-color-hover:var(--text-primary);--plasma-segment-item-background-color-hover:transparent;--plasma-segment-item-additional-color:var(--text-secondary);--plasma-segment-item-additional-color-hover:var(--text-secondary);--plasma-segment-item-selected-color:var(--text-primary);--plasma-segment-item-selected-background-color:var(--surface-solid-card);--plasma-segment-item-selected-color-hover:var(--text-primary);--plasma-segment-item-selected-background-color-hover:var(--surface-solid-card);--plasma-segment-item-selected-additional-color:var(--text-secondary);--plasma-segment-item-selected-additional-color-hover:var(--text-secondary);--plasma-segment-outline-focus-color:var(--plasma-colors-button-focused);}
3
- .d1f4sf91{--plasma-segment-item-color:var(--text-primary);--plasma-segment-item-background-color:transparent;--plasma-segment-item-color-hover:var(--text-primary);--plasma-segment-item-background-color-hover:transparent;--plasma-segment-item-additional-color:var(--text-secondary);--plasma-segment-item-additional-color-hover:var(--text-secondary);--plasma-segment-item-selected-color:var(--inverse-text-primary);--plasma-segment-item-selected-background-color:var(--surface-solid-default);--plasma-segment-item-selected-color-hover:var(--inverse-text-primary);--plasma-segment-item-selected-background-color-hover:var(--surface-solid-default);--plasma-segment-item-selected-additional-color:var(--inverse-text-secondary);--plasma-segment-item-selected-additional-color-hover:var(--inverse-text-secondary);--plasma-segment-outline-focus-color:var(--plasma-colors-button-focused);}
4
- .x12jn5jz{--plasma-segment-item-border-radius:0.5rem;--plasma-segment-item-width:auto;--plasma-segment-item-height:2rem;--plasma-segment-item-padding:0.5rem 0.75rem;--plasma-segment-item-pilled-padding:0.5rem 0.5rem;--plasma-segment-item-content-padding:0.0625rem 0.125rem;--plasma-segment-item-content-icon-margin:0.125rem;--plasma-segment-item-margin-left:0;--plasma-segment-item-font-family:var(--plasma-typo-body-xs-bold-font-family);--plasma-segment-item-font-size:var(--plasma-typo-body-xs-bold-font-size);--plasma-segment-item-font-style:var(--plasma-typo-body-xs-bold-font-style);--plasma-segment-item-font-weight:var(--plasma-typo-body-xs-bold-font-weight);--plasma-segment-item-letter-spacing:var(--plasma-typo-body-xs-bold-letter-spacing);--plasma-segment-item-lineheight:var(--plasma-typo-body-xs-bold-line-height);}
5
- .s1w7desh{--plasma-segment-item-border-radius:0.625rem;--plasma-segment-item-width:auto;--plasma-segment-item-height:2.5rem;--plasma-segment-item-padding:0.5rem 1rem;--plasma-segment-item-pilled-padding:0.5rem 0.5rem;--plasma-segment-item-content-padding:0.1875rem 0.125rem;--plasma-segment-item-content-icon-margin:0.125rem;--plasma-segment-item-margin-left:0rem;--plasma-segment-item-font-family:var(--plasma-typo-body-s-bold-font-family);--plasma-segment-item-font-size:var(--plasma-typo-body-s-bold-font-size);--plasma-segment-item-font-style:var(--plasma-typo-body-s-bold-font-style);--plasma-segment-item-font-weight:var(--plasma-typo-body-s-bold-font-weight);--plasma-segment-item-letter-spacing:var(--plasma-typo-body-s-bold-letter-spacing);--plasma-segment-item-lineheight:var(--plasma-typo-body-s-bold-line-height);}
6
- .msu8eyv{--plasma-segment-item-border-radius:0.75rem;--plasma-segment-item-width:auto;--plasma-segment-item-height:3rem;--plasma-segment-item-padding:0.75rem 1.25rem;--plasma-segment-item-pilled-padding:0.75rem 0.75rem;--plasma-segment-item-content-padding:0.125rem;--plasma-segment-item-content-icon-margin:0.25rem;--plasma-segment-item-margin-left:0rem;--plasma-segment-item-font-family:var(--plasma-typo-body-m-bold-font-family);--plasma-segment-item-font-size:var(--plasma-typo-body-m-bold-font-size);--plasma-segment-item-font-style:var(--plasma-typo-body-m-bold-font-style);--plasma-segment-item-font-weight:var(--plasma-typo-body-m-bold-font-weight);--plasma-segment-item-letter-spacing:var(--plasma-typo-body-m-bold-letter-spacing);--plasma-segment-item-lineheight:var(--plasma-typo-body-m-bold-line-height);}
7
- .l1k7f0bw{--plasma-segment-item-border-radius:0.875rem;--plasma-segment-item-width:auto;--plasma-segment-item-height:3.5rem;--plasma-segment-item-padding:1rem 1.5rem;--plasma-segment-item-pilled-padding:1rem 1rem;--plasma-segment-item-content-padding:0.0625rem 0.125rem;--plasma-segment-item-content-icon-margin:0.375rem;--plasma-segment-item-margin-left:0;--plasma-segment-item-font-family:var(--plasma-typo-body-l-bold-font-family);--plasma-segment-item-font-size:var(--plasma-typo-body-l-bold-font-size);--plasma-segment-item-font-style:var(--plasma-typo-body-l-bold-font-style);--plasma-segment-item-font-weight:var(--plasma-typo-body-l-bold-font-weight);--plasma-segment-item-letter-spacing:var(--plasma-typo-body-l-bold-letter-spacing);--plasma-segment-item-lineheight:var(--plasma-typo-body-l-bold-line-height);}
8
- .t169sl90{--plasma-segment-disabled-opacity:0.4;}
9
- .t1aaurja{--plasma-segment-item-pilled-border-radius:1.75rem;}
@@ -1,11 +0,0 @@
1
- .cct3vnm{--plasma-segment-group-background-color:tranparent;--plasma-segment-outline-focus-color:var(--plasma-colors-button-focused);}
2
- .f15142ru{--plasma-segment-group-background-color:transparent;--plasma-segment-outline-focus-color:var(--plasma-colors-button-focused);}
3
- .xekvq49{--plasma-segment-group-border-radius:0.625rem;--plasma-segment-group-pilled-border-radius:1.125rem;--plasma-segment-group-width:auto;--plasma-segment-group-height:auto;}
4
- .slveods{--plasma-segment-group-border-radius:0.75rem;--plasma-segment-group-pilled-border-radius:1.375rem;--plasma-segment-group-width:auto;--plasma-segment-group-height:auto;}
5
- .mt19ik9{--plasma-segment-group-border-radius:0.875rem;--plasma-segment-group-pilled-border-radius:1.625rem;--plasma-segment-group-width:auto;--plasma-segment-group-height:auto;}
6
- .l1pt19wo{--plasma-segment-group-border-radius:1rem;--plasma-segment-group-pilled-border-radius:1.875rem;--plasma-segment-group-width:auto;--plasma-segment-group-height:auto;}
7
- .t1832286{--plasma-segment-disabled-opacity:0.4;}
8
-
9
-
10
- .tjfuhig{--plasma-segment-group-filled-background-color:var(--plasma-colors-surface-liquid02);}
11
-
@@ -1,9 +0,0 @@
1
- .cw5l9ny{--plasma-segment-item-color:var(--text-secondary);--plasma-segment-item-background-color:transparent;--plasma-segment-item-color-hover:var(--text-primary);--plasma-segment-item-background-color-hover:transparent;--plasma-segment-item-additional-color:var(--text-tertiary);--plasma-segment-item-additional-color-hover:var(--text-secondary);--plasma-segment-item-selected-color:var(--text-primary);--plasma-segment-item-selected-background-color:transparent;--plasma-segment-item-selected-color-hover:var(--text-primary);--plasma-segment-item-selected-background-color-hover:transparent;--plasma-segment-item-selected-additional-color:var(--text-secondary);--plasma-segment-item-selected-additional-color-hover:var(--text-secondary);--plasma-segment-outline-focus-color:var(--plasma-colors-button-focused);}
2
- .s1xvuorj{--plasma-segment-item-color:var(--text-primary);--plasma-segment-item-background-color:transparent;--plasma-segment-item-color-hover:var(--text-primary);--plasma-segment-item-background-color-hover:transparent;--plasma-segment-item-additional-color:var(--text-secondary);--plasma-segment-item-additional-color-hover:var(--text-secondary);--plasma-segment-item-selected-color:var(--text-primary);--plasma-segment-item-selected-background-color:var(--surface-solid-card);--plasma-segment-item-selected-color-hover:var(--text-primary);--plasma-segment-item-selected-background-color-hover:var(--surface-solid-card);--plasma-segment-item-selected-additional-color:var(--text-secondary);--plasma-segment-item-selected-additional-color-hover:var(--text-secondary);--plasma-segment-outline-focus-color:var(--plasma-colors-button-focused);}
3
- .d1f4sf91{--plasma-segment-item-color:var(--text-primary);--plasma-segment-item-background-color:transparent;--plasma-segment-item-color-hover:var(--text-primary);--plasma-segment-item-background-color-hover:transparent;--plasma-segment-item-additional-color:var(--text-secondary);--plasma-segment-item-additional-color-hover:var(--text-secondary);--plasma-segment-item-selected-color:var(--inverse-text-primary);--plasma-segment-item-selected-background-color:var(--surface-solid-default);--plasma-segment-item-selected-color-hover:var(--inverse-text-primary);--plasma-segment-item-selected-background-color-hover:var(--surface-solid-default);--plasma-segment-item-selected-additional-color:var(--inverse-text-secondary);--plasma-segment-item-selected-additional-color-hover:var(--inverse-text-secondary);--plasma-segment-outline-focus-color:var(--plasma-colors-button-focused);}
4
- .x12jn5jz{--plasma-segment-item-border-radius:0.5rem;--plasma-segment-item-width:auto;--plasma-segment-item-height:2rem;--plasma-segment-item-padding:0.5rem 0.75rem;--plasma-segment-item-pilled-padding:0.5rem 0.5rem;--plasma-segment-item-content-padding:0.0625rem 0.125rem;--plasma-segment-item-content-icon-margin:0.125rem;--plasma-segment-item-margin-left:0;--plasma-segment-item-font-family:var(--plasma-typo-body-xs-bold-font-family);--plasma-segment-item-font-size:var(--plasma-typo-body-xs-bold-font-size);--plasma-segment-item-font-style:var(--plasma-typo-body-xs-bold-font-style);--plasma-segment-item-font-weight:var(--plasma-typo-body-xs-bold-font-weight);--plasma-segment-item-letter-spacing:var(--plasma-typo-body-xs-bold-letter-spacing);--plasma-segment-item-lineheight:var(--plasma-typo-body-xs-bold-line-height);}
5
- .s1w7desh{--plasma-segment-item-border-radius:0.625rem;--plasma-segment-item-width:auto;--plasma-segment-item-height:2.5rem;--plasma-segment-item-padding:0.5rem 1rem;--plasma-segment-item-pilled-padding:0.5rem 0.5rem;--plasma-segment-item-content-padding:0.1875rem 0.125rem;--plasma-segment-item-content-icon-margin:0.125rem;--plasma-segment-item-margin-left:0rem;--plasma-segment-item-font-family:var(--plasma-typo-body-s-bold-font-family);--plasma-segment-item-font-size:var(--plasma-typo-body-s-bold-font-size);--plasma-segment-item-font-style:var(--plasma-typo-body-s-bold-font-style);--plasma-segment-item-font-weight:var(--plasma-typo-body-s-bold-font-weight);--plasma-segment-item-letter-spacing:var(--plasma-typo-body-s-bold-letter-spacing);--plasma-segment-item-lineheight:var(--plasma-typo-body-s-bold-line-height);}
6
- .msu8eyv{--plasma-segment-item-border-radius:0.75rem;--plasma-segment-item-width:auto;--plasma-segment-item-height:3rem;--plasma-segment-item-padding:0.75rem 1.25rem;--plasma-segment-item-pilled-padding:0.75rem 0.75rem;--plasma-segment-item-content-padding:0.125rem;--plasma-segment-item-content-icon-margin:0.25rem;--plasma-segment-item-margin-left:0rem;--plasma-segment-item-font-family:var(--plasma-typo-body-m-bold-font-family);--plasma-segment-item-font-size:var(--plasma-typo-body-m-bold-font-size);--plasma-segment-item-font-style:var(--plasma-typo-body-m-bold-font-style);--plasma-segment-item-font-weight:var(--plasma-typo-body-m-bold-font-weight);--plasma-segment-item-letter-spacing:var(--plasma-typo-body-m-bold-letter-spacing);--plasma-segment-item-lineheight:var(--plasma-typo-body-m-bold-line-height);}
7
- .l1k7f0bw{--plasma-segment-item-border-radius:0.875rem;--plasma-segment-item-width:auto;--plasma-segment-item-height:3.5rem;--plasma-segment-item-padding:1rem 1.5rem;--plasma-segment-item-pilled-padding:1rem 1rem;--plasma-segment-item-content-padding:0.0625rem 0.125rem;--plasma-segment-item-content-icon-margin:0.375rem;--plasma-segment-item-margin-left:0;--plasma-segment-item-font-family:var(--plasma-typo-body-l-bold-font-family);--plasma-segment-item-font-size:var(--plasma-typo-body-l-bold-font-size);--plasma-segment-item-font-style:var(--plasma-typo-body-l-bold-font-style);--plasma-segment-item-font-weight:var(--plasma-typo-body-l-bold-font-weight);--plasma-segment-item-letter-spacing:var(--plasma-typo-body-l-bold-letter-spacing);--plasma-segment-item-lineheight:var(--plasma-typo-body-l-bold-line-height);}
8
- .t169sl90{--plasma-segment-disabled-opacity:0.4;}
9
- .t1aaurja{--plasma-segment-item-pilled-border-radius:1.75rem;}