@nova-design-system/nova-base 3.0.0-beta.38 → 3.0.0-beta.39

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.
@@ -98,7 +98,7 @@
98
98
  --components-loader-brand-foreground: var(--color-petrol-500);
99
99
  --components-loader-brand-background: var(--color-petrol-900);
100
100
  --components-loader-white-foreground: var(--color-base-white);
101
- --components-list-dropdown-item-background-title: var(--color-interaction-container-neutral-background);
101
+ --components-list-dropdown-group-title-background: var(--color-transparent);
102
102
  --components-list-dropdown-item-background-disabled: var(--color-interaction-container-neutral-background);
103
103
  --components-list-dropdown-item-background-hover: var(--color-interaction-container-neutral-background-hover);
104
104
  --components-list-dropdown-item-background-default: var(--color-interaction-container-neutral-background);
@@ -262,6 +262,7 @@
262
262
  --color-interaction-link-high-text: var(--color-petrol-500);
263
263
  --color-interaction-container-neutral-text-active: var(--color-petrol-400);
264
264
  --color-interaction-container-neutral-icon-active: var(--color-petrol-400);
265
+ --color-interaction-container-neutral-border-active: var(--color-petrol-400);
265
266
  --color-interaction-container-neutral-background-active: var(--color-petrol-900);
266
267
  --color-interaction-container-branded-high-text-hover: var(--color-base-black);
267
268
  --color-interaction-container-branded-high-text-active: var(--color-base-black);
@@ -375,13 +376,16 @@
375
376
  --components-button-destructive-lower-background: var(--color-dont-use-background);
376
377
  --components-list-dropdown-border: var(--color-content-low-border);
377
378
  --components-list-dropdown-separator: var(--color-content-low-border);
378
- --components-list-dropdown-item-title-content: var(--color-content-medium-text);
379
+ --components-list-dropdown-group-title-content: var(--color-content-medium-text);
380
+ --components-list-dropdown-item-background-active: var(--color-interaction-container-neutral-background-active);
379
381
  --components-list-dropdown-item-description-disabled: var(--color-content-lower-text);
380
382
  --components-list-dropdown-item-description-hover: var(--color-content-medium-text);
381
383
  --components-list-dropdown-item-description-default: var(--color-content-low-text);
384
+ --components-list-dropdown-item-label-active: var(--color-content-low-text);
382
385
  --components-list-dropdown-item-label-disabled: var(--color-content-low-text);
383
386
  --components-list-dropdown-item-label-hover: var(--color-content-high-text);
384
387
  --components-list-dropdown-item-label-default: var(--color-content-medium-text);
388
+ --components-list-dropdown-item-border-active: var(--color-interaction-container-neutral-border-active);
385
389
  --components-list-dropdown-header-background: var(--color-level-10-background);
386
390
  --components-list-dropdown-background: var(--color-level-00-background);
387
391
  --components-form-shape-foreground-disabled-error: var(--color-feedback-error-high-background);
@@ -594,7 +598,7 @@
594
598
  --components-loader-brand-foreground: var(--color-petrol-500);
595
599
  --components-loader-brand-background: var(--color-petrol-50);
596
600
  --components-loader-white-foreground: var(--color-base-white);
597
- --components-list-dropdown-item-background-title: var(--color-interaction-container-neutral-background);
601
+ --components-list-dropdown-group-title-background: var(--color-transparent);
598
602
  --components-list-dropdown-item-background-disabled: var(--color-interaction-container-neutral-background);
599
603
  --components-list-dropdown-item-background-hover: var(--color-interaction-container-neutral-background-hover);
600
604
  --components-list-dropdown-item-background-default: var(--color-interaction-container-neutral-background);
@@ -758,6 +762,7 @@
758
762
  --color-interaction-link-high-text: var(--color-petrol-600);
759
763
  --color-interaction-container-neutral-text-active: var(--color-petrol-700);
760
764
  --color-interaction-container-neutral-icon-active: var(--color-petrol-700);
765
+ --color-interaction-container-neutral-border-active: var(--color-petrol-700);
761
766
  --color-interaction-container-neutral-background-active: var(--color-petrol-50);
762
767
  --color-interaction-container-branded-high-text-hover: var(--color-base-white);
763
768
  --color-interaction-container-branded-high-text-active: var(--color-base-white);
@@ -871,13 +876,16 @@
871
876
  --components-button-destructive-lower-background: var(--color-dont-use-background);
872
877
  --components-list-dropdown-border: var(--color-content-low-border);
873
878
  --components-list-dropdown-separator: var(--color-content-low-border);
874
- --components-list-dropdown-item-title-content: var(--color-content-medium-text);
879
+ --components-list-dropdown-group-title-content: var(--color-content-medium-text);
880
+ --components-list-dropdown-item-background-active: var(--color-interaction-container-neutral-background-active);
875
881
  --components-list-dropdown-item-description-disabled: var(--color-content-lower-text);
876
882
  --components-list-dropdown-item-description-hover: var(--color-content-medium-text);
877
883
  --components-list-dropdown-item-description-default: var(--color-content-low-text);
884
+ --components-list-dropdown-item-label-active: var(--color-content-low-text);
878
885
  --components-list-dropdown-item-label-disabled: var(--color-content-low-text);
879
886
  --components-list-dropdown-item-label-hover: var(--color-content-high-text);
880
887
  --components-list-dropdown-item-label-default: var(--color-content-medium-text);
888
+ --components-list-dropdown-item-border-active: var(--color-interaction-container-neutral-border-active);
881
889
  --components-list-dropdown-header-background: var(--color-level-10-background);
882
890
  --components-list-dropdown-background: var(--color-level-00-background);
883
891
  --components-form-shape-foreground-disabled-error: var(--color-feedback-error-high-background);
@@ -97,7 +97,7 @@
97
97
  --components-loader-brand-foreground: var(--color-orange-500);
98
98
  --components-loader-brand-background: var(--color-orange-900);
99
99
  --components-loader-white-foreground: var(--color-base-white);
100
- --components-list-dropdown-item-background-title: var(--color-interaction-container-neutral-background);
100
+ --components-list-dropdown-group-title-background: var(--color-transparent);
101
101
  --components-list-dropdown-item-background-disabled: var(--color-interaction-container-neutral-background);
102
102
  --components-list-dropdown-item-background-hover: var(--color-interaction-container-neutral-background-hover);
103
103
  --components-list-dropdown-item-background-default: var(--color-interaction-container-neutral-background);
@@ -262,6 +262,7 @@
262
262
  --color-interaction-link-high-text: var(--color-orange-500);
263
263
  --color-interaction-container-neutral-text-active: var(--color-orange-400);
264
264
  --color-interaction-container-neutral-icon-active: var(--color-orange-400);
265
+ --color-interaction-container-neutral-border-active: var(--color-orange-400);
265
266
  --color-interaction-container-neutral-background-active: var(--color-orange-900);
266
267
  --color-interaction-container-branded-high-text-hover: var(--color-base-black);
267
268
  --color-interaction-container-branded-high-text-active: var(--color-base-black);
@@ -375,13 +376,16 @@
375
376
  --components-button-destructive-lower-background: var(--color-dont-use-background);
376
377
  --components-list-dropdown-border: var(--color-content-low-border);
377
378
  --components-list-dropdown-separator: var(--color-content-low-border);
378
- --components-list-dropdown-item-title-content: var(--color-content-medium-text);
379
+ --components-list-dropdown-group-title-content: var(--color-content-medium-text);
380
+ --components-list-dropdown-item-background-active: var(--color-interaction-container-neutral-background-active);
379
381
  --components-list-dropdown-item-description-disabled: var(--color-content-lower-text);
380
382
  --components-list-dropdown-item-description-hover: var(--color-content-medium-text);
381
383
  --components-list-dropdown-item-description-default: var(--color-content-low-text);
384
+ --components-list-dropdown-item-label-active: var(--color-content-low-text);
382
385
  --components-list-dropdown-item-label-disabled: var(--color-content-low-text);
383
386
  --components-list-dropdown-item-label-hover: var(--color-content-high-text);
384
387
  --components-list-dropdown-item-label-default: var(--color-content-medium-text);
388
+ --components-list-dropdown-item-border-active: var(--color-interaction-container-neutral-border-active);
385
389
  --components-list-dropdown-header-background: var(--color-level-10-background);
386
390
  --components-list-dropdown-background: var(--color-level-00-background);
387
391
  --components-form-shape-foreground-disabled-error: var(--color-feedback-error-high-background);
@@ -591,7 +595,7 @@
591
595
  --components-loader-brand-foreground: var(--color-orange-500);
592
596
  --components-loader-brand-background: var(--color-orange-50);
593
597
  --components-loader-white-foreground: var(--color-base-white);
594
- --components-list-dropdown-item-background-title: var(--color-interaction-container-neutral-background);
598
+ --components-list-dropdown-group-title-background: var(--color-transparent);
595
599
  --components-list-dropdown-item-background-disabled: var(--color-interaction-container-neutral-background);
596
600
  --components-list-dropdown-item-background-hover: var(--color-interaction-container-neutral-background-hover);
597
601
  --components-list-dropdown-item-background-default: var(--color-interaction-container-neutral-background);
@@ -756,6 +760,7 @@
756
760
  --color-interaction-link-high-text: var(--color-orange-500);
757
761
  --color-interaction-container-neutral-text-active: var(--color-orange-600);
758
762
  --color-interaction-container-neutral-icon-active: var(--color-orange-600);
763
+ --color-interaction-container-neutral-border-active: var(--color-orange-600);
759
764
  --color-interaction-container-neutral-background-active: var(--color-orange-50);
760
765
  --color-interaction-container-branded-high-text-hover: var(--color-base-white);
761
766
  --color-interaction-container-branded-high-text-active: var(--color-base-white);
@@ -869,13 +874,16 @@
869
874
  --components-button-destructive-lower-background: var(--color-dont-use-background);
870
875
  --components-list-dropdown-border: var(--color-content-low-border);
871
876
  --components-list-dropdown-separator: var(--color-content-low-border);
872
- --components-list-dropdown-item-title-content: var(--color-content-medium-text);
873
- --components-list-dropdown-item-description-disabled: var(--color-content-lower-text);
874
- --components-list-dropdown-item-description-hover: var(--color-content-medium-text);
877
+ --components-list-dropdown-group-title-content: var(--color-content-medium-text);
878
+ --components-list-dropdown-item-background-active: var(--color-interaction-container-neutral-background-active);
879
+ --components-list-dropdown-item-description-disabled: var(--color-content-low-text);
880
+ --components-list-dropdown-item-description-hover: var(--color-content-low-text);
875
881
  --components-list-dropdown-item-description-default: var(--color-content-low-text);
876
- --components-list-dropdown-item-label-disabled: var(--color-content-low-text);
882
+ --components-list-dropdown-item-label-active: var(--color-interaction-container-neutral-text-active);
883
+ --components-list-dropdown-item-label-disabled: var(--color-content-medium-text);
877
884
  --components-list-dropdown-item-label-hover: var(--color-content-high-text);
878
885
  --components-list-dropdown-item-label-default: var(--color-content-medium-text);
886
+ --components-list-dropdown-item-border-active: var(--color-interaction-container-neutral-border-active);
879
887
  --components-list-dropdown-header-background: var(--color-level-10-background);
880
888
  --components-list-dropdown-background: var(--color-level-00-background);
881
889
  --components-form-shape-foreground-disabled-error: var(--color-feedback-error-high-background);
@@ -329,7 +329,7 @@ export declare const NOVA_TAILWIND_COMPONENTS: {
329
329
  '.nv-link:hover': {
330
330
  color: string;
331
331
  };
332
- '.nv-sidenav .nv-link, .nv-navbar .nv-link, .nv-tabs .nv-link': {
332
+ '.nv-sidenav .nv-link, .nv-navbar .nv-link, .nv-tabs .nv-link, .nv-buttongroup .nv-link': {
333
333
  display: string;
334
334
  alignItems: string;
335
335
  color: string;
@@ -361,16 +361,16 @@ export declare const NOVA_TAILWIND_COMPONENTS: {
361
361
  borderColor: string;
362
362
  backgroundColor: string;
363
363
  };
364
- '.nv-navbar .nv-link, .nv-sidenav .nv-link': {
364
+ '.nv-navbar .nv-link, .nv-sidenav .nv-link, .nv-buttongroup .nv-link': {
365
365
  border: string;
366
366
  borderRadius: string;
367
367
  };
368
- '.nv-navbar .nv-link:hover, .nv-sidenav .nv-link:hover': {
368
+ '.nv-navbar .nv-link:hover, .nv-sidenav .nv-link:hover, .nv-buttongroup .nv-link:hover': {
369
369
  color: string;
370
370
  borderColor: string;
371
371
  backgroundColor: string;
372
372
  };
373
- '.nv-navbar .nv-link.active, .nv-navbar .nv-link.router-link-active, .nv-sidenav .nv-link.active, .nv-sidenav .nv-link.router-link-active': {
373
+ '.nv-navbar .nv-link.active, .nv-navbar .nv-link.router-link-active, .nv-sidenav .nv-link.active, .nv-sidenav .nv-link.router-link-active, .nv-buttongroup .nv-link.active, .nv-buttongroup .nv-link.router-link-active': {
374
374
  color: string;
375
375
  borderColor: string;
376
376
  backgroundColor: string;
@@ -382,6 +382,27 @@ export declare const NOVA_TAILWIND_COMPONENTS: {
382
382
  width: string;
383
383
  height: string;
384
384
  };
385
+ '.nv-buttongroup': {
386
+ display: string;
387
+ borderRadius: string;
388
+ border: string;
389
+ overflow: string;
390
+ };
391
+ '.nv-buttongroup .nv-link': {
392
+ borderColor: string;
393
+ borderWidth: string;
394
+ borderStyle: string;
395
+ borderRadius: string;
396
+ };
397
+ '.nv-buttongroup .nv-link:hover': {
398
+ borderColor: string;
399
+ };
400
+ '.nv-buttongroup .nv-link.active, .nv-buttongroup .nv-link.router-link-active': {
401
+ borderColor: string;
402
+ };
403
+ '.nv-buttongroup li:last-child .nv-link': {
404
+ borderRightWidth: string;
405
+ };
385
406
  '.nv-link .nv-badge': {
386
407
  borderRadius: string;
387
408
  width: string;
@@ -396,4 +417,8 @@ export declare const NOVA_TAILWIND_COMPONENTS: {
396
417
  opacity: string;
397
418
  cursor: string;
398
419
  };
420
+ '.nv-link.disabled:hover': {
421
+ color: string;
422
+ backgroundColor: string;
423
+ };
399
424
  };
@@ -330,7 +330,7 @@ export const NOVA_TAILWIND_COMPONENTS = {
330
330
  '.nv-link:hover': {
331
331
  'color': 'var(--color-interaction-link-high-text-hover)'
332
332
  },
333
- '.nv-sidenav .nv-link, .nv-navbar .nv-link, .nv-tabs .nv-link': {
333
+ '.nv-sidenav .nv-link, .nv-navbar .nv-link, .nv-tabs .nv-link, .nv-buttongroup .nv-link': {
334
334
  'display': 'flex',
335
335
  'alignItems': 'center',
336
336
  'color': 'var(--color-interaction-container-neutral-text)',
@@ -362,16 +362,16 @@ export const NOVA_TAILWIND_COMPONENTS = {
362
362
  'borderColor': 'var(--color-interaction-container-branded-low-border-active)',
363
363
  'backgroundColor': 'transparent'
364
364
  },
365
- '.nv-navbar .nv-link, .nv-sidenav .nv-link': {
365
+ '.nv-navbar .nv-link, .nv-sidenav .nv-link, .nv-buttongroup .nv-link': {
366
366
  'border': 'solid 0 transparent',
367
367
  'borderRadius': 'var(--radius-rounded-md)'
368
368
  },
369
- '.nv-navbar .nv-link:hover, .nv-sidenav .nv-link:hover': {
369
+ '.nv-navbar .nv-link:hover, .nv-sidenav .nv-link:hover, .nv-buttongroup .nv-link:hover': {
370
370
  'color': 'var(--color-interaction-container-neutral-text-hover)',
371
371
  'borderColor': 'var(--color-interaction-container-neutral-border-hover)',
372
372
  'backgroundColor': 'var(--color-interaction-container-neutral-background-hover)'
373
373
  },
374
- '.nv-navbar .nv-link.active, .nv-navbar .nv-link.router-link-active, .nv-sidenav .nv-link.active, .nv-sidenav .nv-link.router-link-active': {
374
+ '.nv-navbar .nv-link.active, .nv-navbar .nv-link.router-link-active, .nv-sidenav .nv-link.active, .nv-sidenav .nv-link.router-link-active, .nv-buttongroup .nv-link.active, .nv-buttongroup .nv-link.router-link-active': {
375
375
  'color': 'var(--color-interaction-container-neutral-text-active)',
376
376
  'borderColor': 'var(--color-interaction-container-neutral-text-active)',
377
377
  'backgroundColor': 'var(--color-interaction-container-neutral-background-active)'
@@ -383,6 +383,27 @@ export const NOVA_TAILWIND_COMPONENTS = {
383
383
  'width': '20px !important',
384
384
  'height': '20px !important'
385
385
  },
386
+ '.nv-buttongroup': {
387
+ 'display': 'inline-flex',
388
+ 'borderRadius': 'var(--radius-rounded-md)',
389
+ 'border': '1px solid var(--color-content-medium-border)',
390
+ 'overflow': 'hidden'
391
+ },
392
+ '.nv-buttongroup .nv-link': {
393
+ 'borderColor': 'var(--color-content-medium-border)',
394
+ 'borderWidth': '0 1px 0 0',
395
+ 'borderStyle': 'solid',
396
+ 'borderRadius': '0'
397
+ },
398
+ '.nv-buttongroup .nv-link:hover': {
399
+ 'borderColor': 'var(--color-content-medium-border)'
400
+ },
401
+ '.nv-buttongroup .nv-link.active, .nv-buttongroup .nv-link.router-link-active': {
402
+ 'borderColor': 'var(--color-content-medium-border)'
403
+ },
404
+ '.nv-buttongroup li:last-child .nv-link': {
405
+ 'borderRightWidth': '0'
406
+ },
386
407
  '.nv-link .nv-badge': {
387
408
  'borderRadius': 'var(--radius-rounded-full)',
388
409
  'width': 'var(--spacing-5)',
@@ -396,5 +417,9 @@ export const NOVA_TAILWIND_COMPONENTS = {
396
417
  '.nv-link.disabled': {
397
418
  'opacity': '0.5',
398
419
  'cursor': 'not-allowed'
420
+ },
421
+ '.nv-link.disabled:hover': {
422
+ 'color': 'var(--color-interaction-container-neutral-text)',
423
+ 'backgroundColor': 'transparent'
399
424
  }
400
425
  };
@@ -261,6 +261,9 @@ export declare const NOVA_TAILWIND_TOKENS: {
261
261
  '.border-interaction-container-neutral': {
262
262
  'border-color': string;
263
263
  };
264
+ '.border-interaction-container-neutral-active': {
265
+ 'border-color': string;
266
+ };
264
267
  '.border-interaction-container-neutral-hover': {
265
268
  'border-color': string;
266
269
  };
@@ -262,6 +262,9 @@ export const NOVA_TAILWIND_TOKENS = {
262
262
  '.border-interaction-container-neutral': {
263
263
  'border-color': 'var(--color-interaction-container-neutral-border)'
264
264
  },
265
+ '.border-interaction-container-neutral-active': {
266
+ 'border-color': 'var(--color-interaction-container-neutral-border-active)'
267
+ },
265
268
  '.border-interaction-container-neutral-hover': {
266
269
  'border-color': 'var(--color-interaction-container-neutral-border-hover)'
267
270
  },
@@ -30,6 +30,7 @@ export const ColorInteractionContainerNeutralBackground : string;
30
30
  export const ColorInteractionContainerNeutralBackgroundHover : string;
31
31
  export const ColorInteractionContainerNeutralBackgroundActive : string;
32
32
  export const ColorInteractionContainerNeutralBorder : string;
33
+ export const ColorInteractionContainerNeutralBorderActive : string;
33
34
  export const ColorInteractionContainerNeutralBorderHover : string;
34
35
  export const ColorInteractionContainerNeutralIcon : string;
35
36
  export const ColorInteractionContainerNeutralIconActive : string;
@@ -329,17 +330,20 @@ export const ComponentsListNativeItemBackgroundDisabled : string;
329
330
  export const ComponentsListNativeItemBackgroundTitle : string;
330
331
  export const ComponentsListDropdownBackground : string;
331
332
  export const ComponentsListDropdownHeaderBackground : string;
333
+ export const ComponentsListDropdownItemBorderActive : string;
332
334
  export const ComponentsListDropdownItemLabelDefault : string;
333
335
  export const ComponentsListDropdownItemLabelHover : string;
334
336
  export const ComponentsListDropdownItemLabelDisabled : string;
337
+ export const ComponentsListDropdownItemLabelActive : string;
335
338
  export const ComponentsListDropdownItemDescriptionDefault : string;
336
339
  export const ComponentsListDropdownItemDescriptionHover : string;
337
340
  export const ComponentsListDropdownItemDescriptionDisabled : string;
338
341
  export const ComponentsListDropdownItemBackgroundDefault : string;
339
342
  export const ComponentsListDropdownItemBackgroundHover : string;
340
343
  export const ComponentsListDropdownItemBackgroundDisabled : string;
341
- export const ComponentsListDropdownItemBackgroundTitle : string;
342
- export const ComponentsListDropdownItemTitleContent : string;
344
+ export const ComponentsListDropdownItemBackgroundActive : string;
345
+ export const ComponentsListDropdownGroupTitleContent : string;
346
+ export const ComponentsListDropdownGroupTitleBackground : string;
343
347
  export const ComponentsListDropdownSeparator : string;
344
348
  export const ComponentsListDropdownBorder : string;
345
349
  export const ComponentsLoaderWhiteBackground : string;
@@ -30,6 +30,7 @@ export const ColorInteractionContainerNeutralBackground = "#ffffff";
30
30
  export const ColorInteractionContainerNeutralBackgroundHover = "#ffffff";
31
31
  export const ColorInteractionContainerNeutralBackgroundActive = "#ffffff";
32
32
  export const ColorInteractionContainerNeutralBorder = "#889499";
33
+ export const ColorInteractionContainerNeutralBorderActive = "#71b2bc";
33
34
  export const ColorInteractionContainerNeutralBorderHover = "#bac1c4";
34
35
  export const ColorInteractionContainerNeutralIcon = "#889499";
35
36
  export const ColorInteractionContainerNeutralIconActive = "#71b2bc";
@@ -329,17 +330,20 @@ export const ComponentsListNativeItemBackgroundDisabled = "#ffffff";
329
330
  export const ComponentsListNativeItemBackgroundTitle = "#ffffff";
330
331
  export const ComponentsListDropdownBackground = "#0b0f11";
331
332
  export const ComponentsListDropdownHeaderBackground = "#171f22";
333
+ export const ComponentsListDropdownItemBorderActive = "#71b2bc";
332
334
  export const ComponentsListDropdownItemLabelDefault = "#bac1c4";
333
335
  export const ComponentsListDropdownItemLabelHover = "#f5f6f7";
334
336
  export const ComponentsListDropdownItemLabelDisabled = "#889499";
337
+ export const ComponentsListDropdownItemLabelActive = "#889499";
335
338
  export const ComponentsListDropdownItemDescriptionDefault = "#889499";
336
339
  export const ComponentsListDropdownItemDescriptionHover = "#bac1c4";
337
340
  export const ComponentsListDropdownItemDescriptionDisabled = "#617177";
338
341
  export const ComponentsListDropdownItemBackgroundDefault = "#ffffff";
339
342
  export const ComponentsListDropdownItemBackgroundHover = "#ffffff";
340
343
  export const ComponentsListDropdownItemBackgroundDisabled = "#ffffff";
341
- export const ComponentsListDropdownItemBackgroundTitle = "#ffffff";
342
- export const ComponentsListDropdownItemTitleContent = "#bac1c4";
344
+ export const ComponentsListDropdownItemBackgroundActive = "#ffffff";
345
+ export const ComponentsListDropdownGroupTitleContent = "#bac1c4";
346
+ export const ComponentsListDropdownGroupTitleBackground = "#ffffff";
343
347
  export const ComponentsListDropdownSeparator = "#394d55";
344
348
  export const ComponentsListDropdownBorder = "#394d55";
345
349
  export const ComponentsLoaderWhiteBackground = "#ffffff";
@@ -30,6 +30,7 @@ export const ColorInteractionContainerNeutralBackground : string;
30
30
  export const ColorInteractionContainerNeutralBackgroundHover : string;
31
31
  export const ColorInteractionContainerNeutralBackgroundActive : string;
32
32
  export const ColorInteractionContainerNeutralBorder : string;
33
+ export const ColorInteractionContainerNeutralBorderActive : string;
33
34
  export const ColorInteractionContainerNeutralBorderHover : string;
34
35
  export const ColorInteractionContainerNeutralIcon : string;
35
36
  export const ColorInteractionContainerNeutralIconActive : string;
@@ -329,17 +330,20 @@ export const ComponentsListNativeItemBackgroundDisabled : string;
329
330
  export const ComponentsListNativeItemBackgroundTitle : string;
330
331
  export const ComponentsListDropdownBackground : string;
331
332
  export const ComponentsListDropdownHeaderBackground : string;
333
+ export const ComponentsListDropdownItemBorderActive : string;
332
334
  export const ComponentsListDropdownItemLabelDefault : string;
333
335
  export const ComponentsListDropdownItemLabelHover : string;
334
336
  export const ComponentsListDropdownItemLabelDisabled : string;
337
+ export const ComponentsListDropdownItemLabelActive : string;
335
338
  export const ComponentsListDropdownItemDescriptionDefault : string;
336
339
  export const ComponentsListDropdownItemDescriptionHover : string;
337
340
  export const ComponentsListDropdownItemDescriptionDisabled : string;
338
341
  export const ComponentsListDropdownItemBackgroundDefault : string;
339
342
  export const ComponentsListDropdownItemBackgroundHover : string;
340
343
  export const ComponentsListDropdownItemBackgroundDisabled : string;
341
- export const ComponentsListDropdownItemBackgroundTitle : string;
342
- export const ComponentsListDropdownItemTitleContent : string;
344
+ export const ComponentsListDropdownItemBackgroundActive : string;
345
+ export const ComponentsListDropdownGroupTitleContent : string;
346
+ export const ComponentsListDropdownGroupTitleBackground : string;
343
347
  export const ComponentsListDropdownSeparator : string;
344
348
  export const ComponentsListDropdownBorder : string;
345
349
  export const ComponentsLoaderWhiteBackground : string;
@@ -30,6 +30,7 @@ export const ColorInteractionContainerNeutralBackground = "#ffffff";
30
30
  export const ColorInteractionContainerNeutralBackgroundHover = "#a5a6a7";
31
31
  export const ColorInteractionContainerNeutralBackgroundActive = "#a5a6a7";
32
32
  export const ColorInteractionContainerNeutralBorder = "#617177";
33
+ export const ColorInteractionContainerNeutralBorderActive = "#185963";
33
34
  export const ColorInteractionContainerNeutralBorderHover = "#34464d";
34
35
  export const ColorInteractionContainerNeutralIcon = "#617177";
35
36
  export const ColorInteractionContainerNeutralIconActive = "#185963";
@@ -329,17 +330,20 @@ export const ComponentsListNativeItemBackgroundDisabled = "#ffffff";
329
330
  export const ComponentsListNativeItemBackgroundTitle = "#ffffff";
330
331
  export const ComponentsListDropdownBackground = "#ffffff";
331
332
  export const ComponentsListDropdownHeaderBackground = "#f5f6f7";
333
+ export const ComponentsListDropdownItemBorderActive = "#185963";
332
334
  export const ComponentsListDropdownItemLabelDefault = "#34464d";
333
335
  export const ComponentsListDropdownItemLabelHover = "#171f22";
334
336
  export const ComponentsListDropdownItemLabelDisabled = "#617177";
337
+ export const ComponentsListDropdownItemLabelActive = "#617177";
335
338
  export const ComponentsListDropdownItemDescriptionDefault = "#617177";
336
339
  export const ComponentsListDropdownItemDescriptionHover = "#34464d";
337
340
  export const ComponentsListDropdownItemDescriptionDisabled = "#9fadb2";
338
341
  export const ComponentsListDropdownItemBackgroundDefault = "#ffffff";
339
342
  export const ComponentsListDropdownItemBackgroundHover = "#a5a6a7";
340
343
  export const ComponentsListDropdownItemBackgroundDisabled = "#ffffff";
341
- export const ComponentsListDropdownItemBackgroundTitle = "#ffffff";
342
- export const ComponentsListDropdownItemTitleContent = "#34464d";
344
+ export const ComponentsListDropdownItemBackgroundActive = "#a5a6a7";
345
+ export const ComponentsListDropdownGroupTitleContent = "#34464d";
346
+ export const ComponentsListDropdownGroupTitleBackground = "#ffffff";
343
347
  export const ComponentsListDropdownSeparator = "#e1e4e6";
344
348
  export const ComponentsListDropdownBorder = "#e1e4e6";
345
349
  export const ComponentsLoaderWhiteBackground = "#ffffff";
@@ -30,6 +30,7 @@ export const ColorInteractionContainerNeutralBackground : string;
30
30
  export const ColorInteractionContainerNeutralBackgroundHover : string;
31
31
  export const ColorInteractionContainerNeutralBackgroundActive : string;
32
32
  export const ColorInteractionContainerNeutralBorder : string;
33
+ export const ColorInteractionContainerNeutralBorderActive : string;
33
34
  export const ColorInteractionContainerNeutralBorderHover : string;
34
35
  export const ColorInteractionContainerNeutralIcon : string;
35
36
  export const ColorInteractionContainerNeutralIconActive : string;
@@ -329,17 +330,20 @@ export const ComponentsListNativeItemBackgroundDisabled : string;
329
330
  export const ComponentsListNativeItemBackgroundTitle : string;
330
331
  export const ComponentsListDropdownBackground : string;
331
332
  export const ComponentsListDropdownHeaderBackground : string;
333
+ export const ComponentsListDropdownItemBorderActive : string;
332
334
  export const ComponentsListDropdownItemLabelDefault : string;
333
335
  export const ComponentsListDropdownItemLabelHover : string;
334
336
  export const ComponentsListDropdownItemLabelDisabled : string;
337
+ export const ComponentsListDropdownItemLabelActive : string;
335
338
  export const ComponentsListDropdownItemDescriptionDefault : string;
336
339
  export const ComponentsListDropdownItemDescriptionHover : string;
337
340
  export const ComponentsListDropdownItemDescriptionDisabled : string;
338
341
  export const ComponentsListDropdownItemBackgroundDefault : string;
339
342
  export const ComponentsListDropdownItemBackgroundHover : string;
340
343
  export const ComponentsListDropdownItemBackgroundDisabled : string;
341
- export const ComponentsListDropdownItemBackgroundTitle : string;
342
- export const ComponentsListDropdownItemTitleContent : string;
344
+ export const ComponentsListDropdownItemBackgroundActive : string;
345
+ export const ComponentsListDropdownGroupTitleContent : string;
346
+ export const ComponentsListDropdownGroupTitleBackground : string;
343
347
  export const ComponentsListDropdownSeparator : string;
344
348
  export const ComponentsListDropdownBorder : string;
345
349
  export const ComponentsLoaderWhiteBackground : string;
@@ -30,6 +30,7 @@ export const ColorInteractionContainerNeutralBackground = "#ffffff";
30
30
  export const ColorInteractionContainerNeutralBackgroundHover = "#ffffff";
31
31
  export const ColorInteractionContainerNeutralBackgroundActive = "#0b292e";
32
32
  export const ColorInteractionContainerNeutralBorder = "#889499";
33
+ export const ColorInteractionContainerNeutralBorderActive = "#4b9eaa";
33
34
  export const ColorInteractionContainerNeutralBorderHover = "#bac1c4";
34
35
  export const ColorInteractionContainerNeutralIcon = "#889499";
35
36
  export const ColorInteractionContainerNeutralIconActive = "#4b9eaa";
@@ -329,17 +330,20 @@ export const ComponentsListNativeItemBackgroundDisabled = "#ffffff";
329
330
  export const ComponentsListNativeItemBackgroundTitle = "#ffffff";
330
331
  export const ComponentsListDropdownBackground = "#0b0f11";
331
332
  export const ComponentsListDropdownHeaderBackground = "#171f22";
333
+ export const ComponentsListDropdownItemBorderActive = "#4b9eaa";
332
334
  export const ComponentsListDropdownItemLabelDefault = "#bac1c4";
333
335
  export const ComponentsListDropdownItemLabelHover = "#f5f6f7";
334
336
  export const ComponentsListDropdownItemLabelDisabled = "#889499";
337
+ export const ComponentsListDropdownItemLabelActive = "#889499";
335
338
  export const ComponentsListDropdownItemDescriptionDefault = "#889499";
336
339
  export const ComponentsListDropdownItemDescriptionHover = "#bac1c4";
337
340
  export const ComponentsListDropdownItemDescriptionDisabled = "#617177";
338
341
  export const ComponentsListDropdownItemBackgroundDefault = "#ffffff";
339
342
  export const ComponentsListDropdownItemBackgroundHover = "#ffffff";
340
343
  export const ComponentsListDropdownItemBackgroundDisabled = "#ffffff";
341
- export const ComponentsListDropdownItemBackgroundTitle = "#ffffff";
342
- export const ComponentsListDropdownItemTitleContent = "#bac1c4";
344
+ export const ComponentsListDropdownItemBackgroundActive = "#0b292e";
345
+ export const ComponentsListDropdownGroupTitleContent = "#bac1c4";
346
+ export const ComponentsListDropdownGroupTitleBackground = "#ffffff";
343
347
  export const ComponentsListDropdownSeparator = "#394d55";
344
348
  export const ComponentsListDropdownBorder = "#394d55";
345
349
  export const ComponentsLoaderWhiteBackground = "#ffffff";
@@ -30,6 +30,7 @@ export const ColorInteractionContainerNeutralBackground : string;
30
30
  export const ColorInteractionContainerNeutralBackgroundHover : string;
31
31
  export const ColorInteractionContainerNeutralBackgroundActive : string;
32
32
  export const ColorInteractionContainerNeutralBorder : string;
33
+ export const ColorInteractionContainerNeutralBorderActive : string;
33
34
  export const ColorInteractionContainerNeutralBorderHover : string;
34
35
  export const ColorInteractionContainerNeutralIcon : string;
35
36
  export const ColorInteractionContainerNeutralIconActive : string;
@@ -329,17 +330,20 @@ export const ComponentsListNativeItemBackgroundDisabled : string;
329
330
  export const ComponentsListNativeItemBackgroundTitle : string;
330
331
  export const ComponentsListDropdownBackground : string;
331
332
  export const ComponentsListDropdownHeaderBackground : string;
333
+ export const ComponentsListDropdownItemBorderActive : string;
332
334
  export const ComponentsListDropdownItemLabelDefault : string;
333
335
  export const ComponentsListDropdownItemLabelHover : string;
334
336
  export const ComponentsListDropdownItemLabelDisabled : string;
337
+ export const ComponentsListDropdownItemLabelActive : string;
335
338
  export const ComponentsListDropdownItemDescriptionDefault : string;
336
339
  export const ComponentsListDropdownItemDescriptionHover : string;
337
340
  export const ComponentsListDropdownItemDescriptionDisabled : string;
338
341
  export const ComponentsListDropdownItemBackgroundDefault : string;
339
342
  export const ComponentsListDropdownItemBackgroundHover : string;
340
343
  export const ComponentsListDropdownItemBackgroundDisabled : string;
341
- export const ComponentsListDropdownItemBackgroundTitle : string;
342
- export const ComponentsListDropdownItemTitleContent : string;
344
+ export const ComponentsListDropdownItemBackgroundActive : string;
345
+ export const ComponentsListDropdownGroupTitleContent : string;
346
+ export const ComponentsListDropdownGroupTitleBackground : string;
343
347
  export const ComponentsListDropdownSeparator : string;
344
348
  export const ComponentsListDropdownBorder : string;
345
349
  export const ComponentsLoaderWhiteBackground : string;
@@ -30,6 +30,7 @@ export const ColorInteractionContainerNeutralBackground = "#ffffff";
30
30
  export const ColorInteractionContainerNeutralBackgroundHover = "#a5a6a7";
31
31
  export const ColorInteractionContainerNeutralBackgroundActive = "#e4f0f2";
32
32
  export const ColorInteractionContainerNeutralBorder = "#617177";
33
+ export const ColorInteractionContainerNeutralBorderActive = "#185963";
33
34
  export const ColorInteractionContainerNeutralBorderHover = "#34464d";
34
35
  export const ColorInteractionContainerNeutralIcon = "#617177";
35
36
  export const ColorInteractionContainerNeutralIconActive = "#185963";
@@ -329,17 +330,20 @@ export const ComponentsListNativeItemBackgroundDisabled = "#ffffff";
329
330
  export const ComponentsListNativeItemBackgroundTitle = "#ffffff";
330
331
  export const ComponentsListDropdownBackground = "#ffffff";
331
332
  export const ComponentsListDropdownHeaderBackground = "#f5f6f7";
333
+ export const ComponentsListDropdownItemBorderActive = "#185963";
332
334
  export const ComponentsListDropdownItemLabelDefault = "#34464d";
333
335
  export const ComponentsListDropdownItemLabelHover = "#171f22";
334
336
  export const ComponentsListDropdownItemLabelDisabled = "#617177";
337
+ export const ComponentsListDropdownItemLabelActive = "#617177";
335
338
  export const ComponentsListDropdownItemDescriptionDefault = "#617177";
336
339
  export const ComponentsListDropdownItemDescriptionHover = "#34464d";
337
340
  export const ComponentsListDropdownItemDescriptionDisabled = "#9fadb2";
338
341
  export const ComponentsListDropdownItemBackgroundDefault = "#ffffff";
339
342
  export const ComponentsListDropdownItemBackgroundHover = "#a5a6a7";
340
343
  export const ComponentsListDropdownItemBackgroundDisabled = "#ffffff";
341
- export const ComponentsListDropdownItemBackgroundTitle = "#ffffff";
342
- export const ComponentsListDropdownItemTitleContent = "#34464d";
344
+ export const ComponentsListDropdownItemBackgroundActive = "#e4f0f2";
345
+ export const ComponentsListDropdownGroupTitleContent = "#34464d";
346
+ export const ComponentsListDropdownGroupTitleBackground = "#ffffff";
343
347
  export const ComponentsListDropdownSeparator = "#e1e4e6";
344
348
  export const ComponentsListDropdownBorder = "#e1e4e6";
345
349
  export const ComponentsLoaderWhiteBackground = "#ffffff";
@@ -30,6 +30,7 @@ export const ColorInteractionContainerNeutralBackground : string;
30
30
  export const ColorInteractionContainerNeutralBackgroundHover : string;
31
31
  export const ColorInteractionContainerNeutralBackgroundActive : string;
32
32
  export const ColorInteractionContainerNeutralBorder : string;
33
+ export const ColorInteractionContainerNeutralBorderActive : string;
33
34
  export const ColorInteractionContainerNeutralBorderHover : string;
34
35
  export const ColorInteractionContainerNeutralIcon : string;
35
36
  export const ColorInteractionContainerNeutralIconActive : string;
@@ -329,17 +330,20 @@ export const ComponentsListNativeItemBackgroundDisabled : string;
329
330
  export const ComponentsListNativeItemBackgroundTitle : string;
330
331
  export const ComponentsListDropdownBackground : string;
331
332
  export const ComponentsListDropdownHeaderBackground : string;
333
+ export const ComponentsListDropdownItemBorderActive : string;
332
334
  export const ComponentsListDropdownItemLabelDefault : string;
333
335
  export const ComponentsListDropdownItemLabelHover : string;
334
336
  export const ComponentsListDropdownItemLabelDisabled : string;
337
+ export const ComponentsListDropdownItemLabelActive : string;
335
338
  export const ComponentsListDropdownItemDescriptionDefault : string;
336
339
  export const ComponentsListDropdownItemDescriptionHover : string;
337
340
  export const ComponentsListDropdownItemDescriptionDisabled : string;
338
341
  export const ComponentsListDropdownItemBackgroundDefault : string;
339
342
  export const ComponentsListDropdownItemBackgroundHover : string;
340
343
  export const ComponentsListDropdownItemBackgroundDisabled : string;
341
- export const ComponentsListDropdownItemBackgroundTitle : string;
342
- export const ComponentsListDropdownItemTitleContent : string;
344
+ export const ComponentsListDropdownItemBackgroundActive : string;
345
+ export const ComponentsListDropdownGroupTitleContent : string;
346
+ export const ComponentsListDropdownGroupTitleBackground : string;
343
347
  export const ComponentsListDropdownSeparator : string;
344
348
  export const ComponentsListDropdownBorder : string;
345
349
  export const ComponentsLoaderWhiteBackground : string;
@@ -30,6 +30,7 @@ export const ColorInteractionContainerNeutralBackground = "#ffffff";
30
30
  export const ColorInteractionContainerNeutralBackgroundHover = "#ffffff";
31
31
  export const ColorInteractionContainerNeutralBackgroundActive = "#45190a";
32
32
  export const ColorInteractionContainerNeutralBorder = "#808080";
33
+ export const ColorInteractionContainerNeutralBorderActive = "#eb7247";
33
34
  export const ColorInteractionContainerNeutralBorderHover = "#bfbfbf";
34
35
  export const ColorInteractionContainerNeutralIcon = "#808080";
35
36
  export const ColorInteractionContainerNeutralIconActive = "#eb7247";
@@ -329,17 +330,20 @@ export const ComponentsListNativeItemBackgroundDisabled = "#ffffff";
329
330
  export const ComponentsListNativeItemBackgroundTitle = "#ffffff";
330
331
  export const ComponentsListDropdownBackground = "#0e0e0e";
331
332
  export const ComponentsListDropdownHeaderBackground = "#1d1d1d";
333
+ export const ComponentsListDropdownItemBorderActive = "#eb7247";
332
334
  export const ComponentsListDropdownItemLabelDefault = "#bfbfbf";
333
335
  export const ComponentsListDropdownItemLabelHover = "#f6f6f6";
334
336
  export const ComponentsListDropdownItemLabelDisabled = "#808080";
337
+ export const ComponentsListDropdownItemLabelActive = "#808080";
335
338
  export const ComponentsListDropdownItemDescriptionDefault = "#808080";
336
339
  export const ComponentsListDropdownItemDescriptionHover = "#bfbfbf";
337
340
  export const ComponentsListDropdownItemDescriptionDisabled = "#6d6d6d";
338
341
  export const ComponentsListDropdownItemBackgroundDefault = "#ffffff";
339
342
  export const ComponentsListDropdownItemBackgroundHover = "#ffffff";
340
343
  export const ComponentsListDropdownItemBackgroundDisabled = "#ffffff";
341
- export const ComponentsListDropdownItemBackgroundTitle = "#ffffff";
342
- export const ComponentsListDropdownItemTitleContent = "#bfbfbf";
344
+ export const ComponentsListDropdownItemBackgroundActive = "#45190a";
345
+ export const ComponentsListDropdownGroupTitleContent = "#bfbfbf";
346
+ export const ComponentsListDropdownGroupTitleBackground = "#ffffff";
343
347
  export const ComponentsListDropdownSeparator = "#484848";
344
348
  export const ComponentsListDropdownBorder = "#484848";
345
349
  export const ComponentsLoaderWhiteBackground = "#ffffff";