@ptsecurity/mosaic 13.9.0 → 13.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (183) hide show
  1. package/_theming.scss +80 -58
  2. package/_visual.scss +75 -58
  3. package/core/formatters/date/formatter.d.ts +6 -2
  4. package/design-tokens/legacy-2017/tokens/components/form-field.json5 +2 -2
  5. package/design-tokens/legacy-2017/tokens/components/popover.json5 +1 -0
  6. package/design-tokens/legacy-2017/tokens/components/radio.json5 +1 -0
  7. package/design-tokens/legacy-2017/tokens/properties/typography.json5 +42 -33
  8. package/design-tokens/legacy-2017/tokens.d.ts +44 -35
  9. package/design-tokens/pt-2022/tokens/components/form-field.json5 +3 -3
  10. package/design-tokens/pt-2022/tokens/components/link.json5 +2 -2
  11. package/design-tokens/pt-2022/tokens/components/popover.json5 +7 -6
  12. package/design-tokens/pt-2022/tokens/properties/colors.json5 +6 -6
  13. package/design-tokens/pt-2022/tokens/properties/typography.json5 +33 -24
  14. package/design-tokens/pt-2022/tokens.d.ts +66 -58
  15. package/esm2020/autocomplete/autocomplete.component.mjs +2 -2
  16. package/esm2020/button/button.component.mjs +2 -2
  17. package/esm2020/button-toggle/button-toggle.component.mjs +2 -2
  18. package/esm2020/card/card.component.mjs +2 -2
  19. package/esm2020/checkbox/checkbox.mjs +2 -2
  20. package/esm2020/core/formatters/date/formatter.mjs +7 -3
  21. package/esm2020/core/option/action.mjs +2 -2
  22. package/esm2020/core/option/optgroup.mjs +2 -2
  23. package/esm2020/core/option/option.mjs +2 -2
  24. package/esm2020/core/selection/pseudo-checkbox/pseudo-checkbox.mjs +2 -2
  25. package/esm2020/datepicker/calendar-body.component.mjs +2 -2
  26. package/esm2020/datepicker/calendar.component.mjs +2 -2
  27. package/esm2020/datepicker/datepicker-toggle.component.mjs +2 -2
  28. package/esm2020/datepicker/datepicker.component.mjs +3 -3
  29. package/esm2020/design-tokens/legacy-2017/tokens.mjs +45 -36
  30. package/esm2020/design-tokens/pt-2022/tokens.mjs +67 -59
  31. package/esm2020/divider/divider.component.mjs +2 -2
  32. package/esm2020/dl/dl.component.mjs +2 -2
  33. package/esm2020/dropdown/dropdown-item.component.mjs +2 -2
  34. package/esm2020/dropdown/dropdown.component.mjs +3 -3
  35. package/esm2020/form-field/form-field.mjs +2 -2
  36. package/esm2020/list/list-selection.component.mjs +229 -219
  37. package/esm2020/list/list.component.mjs +2 -2
  38. package/esm2020/loader-overlay/loader-overlay.component.mjs +7 -3
  39. package/esm2020/modal/modal.component.mjs +2 -2
  40. package/esm2020/navbar/navbar.component.mjs +2 -2
  41. package/esm2020/navbar/vertical-navbar.component.mjs +3 -3
  42. package/esm2020/popover/popover-confirm.component.mjs +3 -3
  43. package/esm2020/popover/popover.component.mjs +3 -3
  44. package/esm2020/progress-bar/progress-bar.component.mjs +2 -2
  45. package/esm2020/progress-spinner/progress-spinner.component.mjs +2 -2
  46. package/esm2020/radio/radio.component.mjs +2 -2
  47. package/esm2020/select/select.component.mjs +3 -3
  48. package/esm2020/sidepanel/sidepanel-container.component.mjs +3 -3
  49. package/esm2020/tabs/tab-group.component.mjs +2 -2
  50. package/esm2020/tabs/tab-header.component.mjs +2 -2
  51. package/esm2020/tabs/tab-nav-bar/tab-nav-bar.mjs +2 -2
  52. package/esm2020/tags/tag-list.component.mjs +2 -2
  53. package/esm2020/tags/tag.component.mjs +2 -2
  54. package/esm2020/toast/toast-container.component.mjs +2 -2
  55. package/esm2020/toast/toast.component.mjs +14 -11
  56. package/esm2020/toggle/toggle.component.mjs +3 -3
  57. package/esm2020/tooltip/tooltip.component.mjs +3 -3
  58. package/esm2020/tree/toggle.mjs +2 -2
  59. package/esm2020/tree/tree-option.component.mjs +7 -3
  60. package/esm2020/tree/tree-selection.component.mjs +7 -1
  61. package/esm2020/tree-select/tree-select.component.mjs +3 -3
  62. package/fesm2015/ptsecurity-mosaic-autocomplete.mjs +2 -2
  63. package/fesm2015/ptsecurity-mosaic-autocomplete.mjs.map +1 -1
  64. package/fesm2015/ptsecurity-mosaic-button-toggle.mjs +2 -2
  65. package/fesm2015/ptsecurity-mosaic-button-toggle.mjs.map +1 -1
  66. package/fesm2015/ptsecurity-mosaic-button.mjs +2 -2
  67. package/fesm2015/ptsecurity-mosaic-button.mjs.map +1 -1
  68. package/fesm2015/ptsecurity-mosaic-card.mjs +2 -2
  69. package/fesm2015/ptsecurity-mosaic-card.mjs.map +1 -1
  70. package/fesm2015/ptsecurity-mosaic-checkbox.mjs +2 -2
  71. package/fesm2015/ptsecurity-mosaic-checkbox.mjs.map +1 -1
  72. package/fesm2015/ptsecurity-mosaic-core.mjs +14 -10
  73. package/fesm2015/ptsecurity-mosaic-core.mjs.map +1 -1
  74. package/fesm2015/ptsecurity-mosaic-datepicker.mjs +8 -8
  75. package/fesm2015/ptsecurity-mosaic-datepicker.mjs.map +1 -1
  76. package/fesm2015/ptsecurity-mosaic-design-tokens.mjs +120 -94
  77. package/fesm2015/ptsecurity-mosaic-design-tokens.mjs.map +1 -1
  78. package/fesm2015/ptsecurity-mosaic-divider.mjs +2 -2
  79. package/fesm2015/ptsecurity-mosaic-divider.mjs.map +1 -1
  80. package/fesm2015/ptsecurity-mosaic-dl.mjs +2 -2
  81. package/fesm2015/ptsecurity-mosaic-dl.mjs.map +1 -1
  82. package/fesm2015/ptsecurity-mosaic-dropdown.mjs +4 -4
  83. package/fesm2015/ptsecurity-mosaic-dropdown.mjs.map +1 -1
  84. package/fesm2015/ptsecurity-mosaic-form-field.mjs +2 -2
  85. package/fesm2015/ptsecurity-mosaic-form-field.mjs.map +1 -1
  86. package/fesm2015/ptsecurity-mosaic-list.mjs +239 -229
  87. package/fesm2015/ptsecurity-mosaic-list.mjs.map +1 -1
  88. package/fesm2015/ptsecurity-mosaic-loader-overlay.mjs +6 -2
  89. package/fesm2015/ptsecurity-mosaic-loader-overlay.mjs.map +1 -1
  90. package/fesm2015/ptsecurity-mosaic-modal.mjs +2 -2
  91. package/fesm2015/ptsecurity-mosaic-modal.mjs.map +1 -1
  92. package/fesm2015/ptsecurity-mosaic-navbar.mjs +4 -4
  93. package/fesm2015/ptsecurity-mosaic-navbar.mjs.map +1 -1
  94. package/fesm2015/ptsecurity-mosaic-popover.mjs +4 -4
  95. package/fesm2015/ptsecurity-mosaic-popover.mjs.map +1 -1
  96. package/fesm2015/ptsecurity-mosaic-progress-bar.mjs +2 -2
  97. package/fesm2015/ptsecurity-mosaic-progress-bar.mjs.map +1 -1
  98. package/fesm2015/ptsecurity-mosaic-progress-spinner.mjs +2 -2
  99. package/fesm2015/ptsecurity-mosaic-progress-spinner.mjs.map +1 -1
  100. package/fesm2015/ptsecurity-mosaic-radio.mjs +2 -2
  101. package/fesm2015/ptsecurity-mosaic-radio.mjs.map +1 -1
  102. package/fesm2015/ptsecurity-mosaic-select.mjs +2 -2
  103. package/fesm2015/ptsecurity-mosaic-select.mjs.map +1 -1
  104. package/fesm2015/ptsecurity-mosaic-sidepanel.mjs +2 -2
  105. package/fesm2015/ptsecurity-mosaic-sidepanel.mjs.map +1 -1
  106. package/fesm2015/ptsecurity-mosaic-tabs.mjs +6 -6
  107. package/fesm2015/ptsecurity-mosaic-tabs.mjs.map +1 -1
  108. package/fesm2015/ptsecurity-mosaic-tags.mjs +4 -4
  109. package/fesm2015/ptsecurity-mosaic-tags.mjs.map +1 -1
  110. package/fesm2015/ptsecurity-mosaic-toast.mjs +16 -11
  111. package/fesm2015/ptsecurity-mosaic-toast.mjs.map +1 -1
  112. package/fesm2015/ptsecurity-mosaic-toggle.mjs +2 -2
  113. package/fesm2015/ptsecurity-mosaic-toggle.mjs.map +1 -1
  114. package/fesm2015/ptsecurity-mosaic-tooltip.mjs +2 -2
  115. package/fesm2015/ptsecurity-mosaic-tooltip.mjs.map +1 -1
  116. package/fesm2015/ptsecurity-mosaic-tree-select.mjs +2 -2
  117. package/fesm2015/ptsecurity-mosaic-tree-select.mjs.map +1 -1
  118. package/fesm2015/ptsecurity-mosaic-tree.mjs +14 -4
  119. package/fesm2015/ptsecurity-mosaic-tree.mjs.map +1 -1
  120. package/fesm2020/ptsecurity-mosaic-autocomplete.mjs +2 -2
  121. package/fesm2020/ptsecurity-mosaic-autocomplete.mjs.map +1 -1
  122. package/fesm2020/ptsecurity-mosaic-button-toggle.mjs +2 -2
  123. package/fesm2020/ptsecurity-mosaic-button-toggle.mjs.map +1 -1
  124. package/fesm2020/ptsecurity-mosaic-button.mjs +2 -2
  125. package/fesm2020/ptsecurity-mosaic-button.mjs.map +1 -1
  126. package/fesm2020/ptsecurity-mosaic-card.mjs +2 -2
  127. package/fesm2020/ptsecurity-mosaic-card.mjs.map +1 -1
  128. package/fesm2020/ptsecurity-mosaic-checkbox.mjs +2 -2
  129. package/fesm2020/ptsecurity-mosaic-checkbox.mjs.map +1 -1
  130. package/fesm2020/ptsecurity-mosaic-core.mjs +14 -10
  131. package/fesm2020/ptsecurity-mosaic-core.mjs.map +1 -1
  132. package/fesm2020/ptsecurity-mosaic-datepicker.mjs +8 -8
  133. package/fesm2020/ptsecurity-mosaic-datepicker.mjs.map +1 -1
  134. package/fesm2020/ptsecurity-mosaic-design-tokens.mjs +120 -94
  135. package/fesm2020/ptsecurity-mosaic-design-tokens.mjs.map +1 -1
  136. package/fesm2020/ptsecurity-mosaic-divider.mjs +2 -2
  137. package/fesm2020/ptsecurity-mosaic-divider.mjs.map +1 -1
  138. package/fesm2020/ptsecurity-mosaic-dl.mjs +2 -2
  139. package/fesm2020/ptsecurity-mosaic-dl.mjs.map +1 -1
  140. package/fesm2020/ptsecurity-mosaic-dropdown.mjs +4 -4
  141. package/fesm2020/ptsecurity-mosaic-dropdown.mjs.map +1 -1
  142. package/fesm2020/ptsecurity-mosaic-form-field.mjs +2 -2
  143. package/fesm2020/ptsecurity-mosaic-form-field.mjs.map +1 -1
  144. package/fesm2020/ptsecurity-mosaic-list.mjs +234 -224
  145. package/fesm2020/ptsecurity-mosaic-list.mjs.map +1 -1
  146. package/fesm2020/ptsecurity-mosaic-loader-overlay.mjs +6 -2
  147. package/fesm2020/ptsecurity-mosaic-loader-overlay.mjs.map +1 -1
  148. package/fesm2020/ptsecurity-mosaic-modal.mjs +2 -2
  149. package/fesm2020/ptsecurity-mosaic-modal.mjs.map +1 -1
  150. package/fesm2020/ptsecurity-mosaic-navbar.mjs +4 -4
  151. package/fesm2020/ptsecurity-mosaic-navbar.mjs.map +1 -1
  152. package/fesm2020/ptsecurity-mosaic-popover.mjs +4 -4
  153. package/fesm2020/ptsecurity-mosaic-popover.mjs.map +1 -1
  154. package/fesm2020/ptsecurity-mosaic-progress-bar.mjs +2 -2
  155. package/fesm2020/ptsecurity-mosaic-progress-bar.mjs.map +1 -1
  156. package/fesm2020/ptsecurity-mosaic-progress-spinner.mjs +2 -2
  157. package/fesm2020/ptsecurity-mosaic-progress-spinner.mjs.map +1 -1
  158. package/fesm2020/ptsecurity-mosaic-radio.mjs +2 -2
  159. package/fesm2020/ptsecurity-mosaic-radio.mjs.map +1 -1
  160. package/fesm2020/ptsecurity-mosaic-select.mjs +2 -2
  161. package/fesm2020/ptsecurity-mosaic-select.mjs.map +1 -1
  162. package/fesm2020/ptsecurity-mosaic-sidepanel.mjs +2 -2
  163. package/fesm2020/ptsecurity-mosaic-sidepanel.mjs.map +1 -1
  164. package/fesm2020/ptsecurity-mosaic-tabs.mjs +6 -6
  165. package/fesm2020/ptsecurity-mosaic-tabs.mjs.map +1 -1
  166. package/fesm2020/ptsecurity-mosaic-tags.mjs +4 -4
  167. package/fesm2020/ptsecurity-mosaic-tags.mjs.map +1 -1
  168. package/fesm2020/ptsecurity-mosaic-toast.mjs +14 -11
  169. package/fesm2020/ptsecurity-mosaic-toast.mjs.map +1 -1
  170. package/fesm2020/ptsecurity-mosaic-toggle.mjs +2 -2
  171. package/fesm2020/ptsecurity-mosaic-toggle.mjs.map +1 -1
  172. package/fesm2020/ptsecurity-mosaic-tooltip.mjs +2 -2
  173. package/fesm2020/ptsecurity-mosaic-tooltip.mjs.map +1 -1
  174. package/fesm2020/ptsecurity-mosaic-tree-select.mjs +2 -2
  175. package/fesm2020/ptsecurity-mosaic-tree-select.mjs.map +1 -1
  176. package/fesm2020/ptsecurity-mosaic-tree.mjs +14 -4
  177. package/fesm2020/ptsecurity-mosaic-tree.mjs.map +1 -1
  178. package/list/list-selection.component.d.ts +53 -52
  179. package/loader-overlay/loader-overlay.component.d.ts +1 -0
  180. package/package.json +4 -4
  181. package/prebuilt-themes/dark-theme.css +1 -1
  182. package/prebuilt-themes/default-theme.css +1 -1
  183. package/tree/tree-option.component.d.ts +1 -0
package/_visual.scss CHANGED
@@ -33,26 +33,26 @@ $dark-color-scheme-error-default: #b9023a;
33
33
  $dark-color-scheme-info-default: #0c6579;
34
34
  $dark-color-scheme-success-default: #016b37;
35
35
  $dark-color-scheme-warning-default: #7e5406;
36
- $dark-color-scheme-foreground-text: #f2f5f9;
36
+ $dark-color-scheme-foreground-text: #d7dee4;
37
37
  $dark-color-scheme-foreground-text-less-contrast: #8c99a5;
38
38
  $dark-color-scheme-foreground-text-disabled: #6d7a86;
39
39
  $dark-color-scheme-foreground-text-error: #ea5868;
40
40
  $dark-color-scheme-foreground-text-success: #319d5c;
41
- $dark-color-scheme-foreground-divider: #333f4a;
41
+ $dark-color-scheme-foreground-divider: mix(#515e69, transparent, 50%);
42
42
  $dark-color-scheme-foreground-border: #515e69;
43
43
  $dark-color-scheme-foreground-icon: #8c99a5;
44
44
  $dark-color-scheme-background-background: #19252f;
45
45
  $dark-color-scheme-background-background-disabled: #333f4a;
46
46
  $dark-color-scheme-background-background-less-contrast: #27333e;
47
47
  $dark-color-scheme-background-background-under: #151e25;
48
- $dark-color-scheme-background-overlay-hover: rgba(black, 0.05);
49
- $dark-color-scheme-background-overlay-active: rgba(black, 0.1);
48
+ $dark-color-scheme-background-overlay-hover: rgba(white, 0.05);
49
+ $dark-color-scheme-background-overlay-active: rgba(white, 0.1);
50
50
  $dark-color-scheme-background-overlay-disabled: rgba(black, 0.2);
51
51
  $dark-color-scheme-states-focused-color: #4187ff;
52
52
  $dark-color-scheme-states-focused-color-error: #b9023a;
53
- $dark-color-scheme-states-selected-color: #023c7f;
53
+ $dark-color-scheme-states-selected-color: rgba(3, 116, 235, 0.3);
54
54
  $dark-color-scheme-states-pressed-shadow: inset 1px 2px 2px 0 rgba(black, 0.2);
55
- $dark-color-scheme-states-disabled-opacity: 0.3;
55
+ $dark-color-scheme-states-disabled-opacity: 0.45;
56
56
  $font-family-accent: 'TT Positive', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
57
57
  $font-family-base: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
58
58
  $font-family-monospace: 'Roboto Mono', 'Consolas', 'Menlo', 'Monaco', monospace;
@@ -549,7 +549,7 @@ $datepicker-toggle-size-height: 30px;
549
549
  $datepicker-body-light-color-scheme-states-selected-color: #0374eb;
550
550
  $datepicker-body-light-color-scheme-states-selected-background: #e7f1ff;
551
551
  $datepicker-body-dark-color-scheme-states-selected-color: #4187ff;
552
- $datepicker-body-dark-color-scheme-states-selected-background: #023c7f;
552
+ $datepicker-body-dark-color-scheme-states-selected-background: rgba(3, 116, 235, 0.3);
553
553
  $datepicker-body-size-label-paddings: 8px 28px 12px 12px;
554
554
  $datepicker-body-size-cell-min-size: 32px;
555
555
  $datepicker-body-size-cell-margin: 5%;
@@ -569,13 +569,13 @@ $datepicker-calendar-font-default: body;
569
569
  $datepicker-calendar-font-header: caption;
570
570
  $datepicker-input-size-width: 130px;
571
571
  $divider-light-color-scheme-color: #d7dee4;
572
- $divider-dark-color-scheme-color: #333f4a;
572
+ $divider-dark-color-scheme-color: mix(#515e69, transparent, 50%);
573
573
  $divider-size-width: 1px;
574
574
  $divider-size-inset-margin: 80px;
575
575
  $description-list-light-color-scheme-dt: #6d7a86;
576
576
  $description-list-light-color-scheme-dd: #19252f;
577
577
  $description-list-dark-color-scheme-dt: #8c99a5;
578
- $description-list-dark-color-scheme-dd: #f2f5f9;
578
+ $description-list-dark-color-scheme-dd: #d7dee4;
579
579
  $description-list-size-grid-template-columns: repeat(4, 1fr);
580
580
  $description-list-size-dt-grid-column: 1;
581
581
  $description-list-size-dd-grid-column: 2 / span 3;
@@ -608,12 +608,12 @@ $form-field-light-color-scheme-border: #bdc7d1;
608
608
  $form-field-light-color-scheme-background: white;
609
609
  $form-field-light-color-scheme-states-hover-border: #8c99a5;
610
610
  $form-field-light-color-scheme-states-invalid-border: #db3c55;
611
- $form-field-light-color-scheme-states-invalid-background: transparent;
611
+ $form-field-light-color-scheme-states-invalid-background: #fff3f3;
612
612
  $form-field-dark-color-scheme-border: #515e69;
613
613
  $form-field-dark-color-scheme-background: transparent;
614
- $form-field-dark-color-scheme-states-hover-border: #515e69;
614
+ $form-field-dark-color-scheme-states-hover-border: #6d7a86;
615
615
  $form-field-dark-color-scheme-states-invalid-border: #b9023a;
616
- $form-field-dark-color-scheme-states-invalid-background: transparent;
616
+ $form-field-dark-color-scheme-states-invalid-background: mix(#41000b, transparent, 30%);
617
617
  $form-field-size-height: 32px;
618
618
  $form-field-size-border-width: 1px;
619
619
  $form-field-size-border-radius: 4px;
@@ -627,10 +627,10 @@ $form-field-password-hint-light-color-scheme-states-invalid-icon-color: #ee6f79;
627
627
  $form-field-password-hint-light-color-scheme-states-invalid-text-color: #19252f;
628
628
  $form-field-password-hint-light-color-scheme-states-valid-text-color: #016b37;
629
629
  $form-field-password-hint-light-color-scheme-states-valid-icon-color: #4ba96c;
630
- $form-field-password-hint-dark-color-scheme-text-color: #f2f5f9;
630
+ $form-field-password-hint-dark-color-scheme-text-color: #d7dee4;
631
631
  $form-field-password-hint-dark-color-scheme-icon-color: #8c99a5;
632
632
  $form-field-password-hint-dark-color-scheme-states-invalid-icon-color: #ee6f79;
633
- $form-field-password-hint-dark-color-scheme-states-invalid-text-color: #f2f5f9;
633
+ $form-field-password-hint-dark-color-scheme-states-invalid-text-color: #d7dee4;
634
634
  $form-field-password-hint-dark-color-scheme-states-valid-text-color: #319d5c;
635
635
  $form-field-password-hint-dark-color-scheme-states-valid-icon-color: #4ba96c;
636
636
  $form-field-password-hint-size-margin-top: 8px;
@@ -639,7 +639,7 @@ $form-field-password-hint-font-default: caption;
639
639
  $forms-light-color-scheme-label: #6d7a86;
640
640
  $forms-light-color-scheme-legend: #19252f;
641
641
  $forms-dark-color-scheme-label: #8c99a5;
642
- $forms-dark-color-scheme-legend: #f2f5f9;
642
+ $forms-dark-color-scheme-legend: #d7dee4;
643
643
  $forms-size-horizontal-row-margin-bottom: 20px;
644
644
  $forms-size-horizontal-label-padding-top: 6px;
645
645
  $forms-size-horizontal-label-padding-bottom: 0;
@@ -707,7 +707,7 @@ $input-size-width: 100%;
707
707
  $input-font-default: body;
708
708
  $input-font-monospace: body-mono;
709
709
  $link-light-color-scheme-text: #0374eb;
710
- $link-light-color-scheme-border-bottom: rgba(#8c99a5, 0.32);
710
+ $link-light-color-scheme-border-bottom: rgba(#0374eb, 0.32);
711
711
  $link-light-color-scheme-state-visited-text: #864775;
712
712
  $link-light-color-scheme-state-visited-border-bottom: rgba(#864775, 0.32);
713
713
  $link-light-color-scheme-state-hover-text: #0059b8;
@@ -715,7 +715,7 @@ $link-light-color-scheme-state-hover-border-bottom: rgba(#0059b8, 0.32);
715
715
  $link-light-color-scheme-state-active: #014b9d;
716
716
  $link-light-color-scheme-state-focused-outline: #0374eb;
717
717
  $link-dark-color-scheme-text: #5697ff;
718
- $link-dark-color-scheme-border-bottom: rgba(#6d7a86, 0.32);
718
+ $link-dark-color-scheme-border-bottom: rgba(#5697ff, 0.32);;
719
719
  $link-dark-color-scheme-state-visited-text: #bb78a7;
720
720
  $link-dark-color-scheme-state-visited-border-bottom: rgba(#bb78a7, 0.32);
721
721
  $link-dark-color-scheme-state-hover-text: #4187ff;
@@ -734,7 +734,7 @@ $loader-overlay-light-color-scheme-background: mix(white, transparent, 90%);
734
734
  $loader-overlay-light-color-scheme-text: #19252f;
735
735
  $loader-overlay-light-color-scheme-caption: #6d7a86;
736
736
  $loader-overlay-dark-color-scheme-background: mix(#19252f, transparent, 90%);
737
- $loader-overlay-dark-color-scheme-text: #f2f5f9;
737
+ $loader-overlay-dark-color-scheme-text: #d7dee4;
738
738
  $loader-overlay-dark-color-scheme-caption: #8c99a5;
739
739
  $loader-overlay-size-text-max-width: 480px;
740
740
  $loader-overlay-size-fixed-top-padding: 72px;
@@ -757,7 +757,7 @@ $modal-size-close-width: 56px;
757
757
  $modal-size-border-radius: 4px;
758
758
  $modal-size-border-width: 1px;
759
759
  $modal-header-light-color-scheme-border: #d7dee4;
760
- $modal-header-dark-color-scheme-border: #333f4a;
760
+ $modal-header-dark-color-scheme-border: mix(#515e69, transparent, 50%);
761
761
  $modal-header-size-border-radius: 4px 4px 0 0;
762
762
  $modal-header-size-height: 56px;
763
763
  $modal-header-size-padding: 0 16px;
@@ -766,7 +766,7 @@ $modal-body-size-max-height: calc(100vh - 260px);
766
766
  $modal-body-size-padding: 16px 24px 24px;
767
767
  $modal-body-font-default: body;
768
768
  $modal-footer-light-color-scheme-border: #f2f5f9;
769
- $modal-footer-dark-color-scheme-border: #333f4a;
769
+ $modal-footer-dark-color-scheme-border: mix(#515e69, transparent, 50%);
770
770
  $modal-footer-size-border-radius: 0 0 4px 4px;
771
771
  $modal-footer-size-height: 64px;
772
772
  $modal-footer-size-padding: 0 16px;
@@ -812,12 +812,13 @@ $popover-light-color-scheme-text: #19252f;
812
812
  $popover-light-color-scheme-shadow: 0 3px 8px 0 rgba(39, 51, 62, 0.2);
813
813
  $popover-light-color-scheme-border: #d7dee4;
814
814
  $popover-dark-color-scheme-background: #333f4a;
815
- $popover-dark-color-scheme-text: #f2f5f9;
815
+ $popover-dark-color-scheme-text: #d7dee4;
816
816
  $popover-dark-color-scheme-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.2);
817
817
  $popover-dark-color-scheme-border: #333f4a;
818
818
  $popover-size-max-height: 480px;
819
819
  $popover-size-padding: 16px;
820
820
  $popover-size-border-radius: 4px;
821
+ $popover-size-border-width: 1px;
821
822
  $popover-size-arrow-size: 12px;
822
823
  $popover-size-trigger-margin: 9px;
823
824
  $popover-size-small-width: 200px;
@@ -828,7 +829,7 @@ $popover-header-light-color-scheme-border: #d7dee4;
828
829
  $popover-header-light-color-scheme-text: #19252f;
829
830
  $popover-header-light-color-scheme-background: white;
830
831
  $popover-header-dark-color-scheme-border: #434f5a;
831
- $popover-header-dark-color-scheme-text: #f2f5f9;
832
+ $popover-header-dark-color-scheme-text: #d7dee4;
832
833
  $popover-header-dark-color-scheme-background: #333f4a;
833
834
  $popover-header-size-height: 40px;
834
835
  $popover-header-size-padding: 0 16px;
@@ -888,13 +889,13 @@ $sidepanel-light-color-scheme-border: #bdc7d1;
888
889
  $sidepanel-dark-color-scheme-border: #19252f;
889
890
  $sidepanel-font-default: body;
890
891
  $sidepanel-header-light-color-scheme-border: #d7dee4;
891
- $sidepanel-header-dark-color-scheme-border: #333f4a;
892
+ $sidepanel-header-dark-color-scheme-border: mix(#515e69, transparent, 50%);
892
893
  $sidepanel-header-size-height: 56px;
893
894
  $sidepanel-header-size-padding: 0 16px;
894
895
  $sidepanel-header-size-close-padding: 0 0 0 8px;
895
896
  $sidepanel-header-font-default: title;
896
897
  $sidepanel-footer-light-color-scheme-border: #f2f5f9;
897
- $sidepanel-footer-dark-color-scheme-border: #333f4a;
898
+ $sidepanel-footer-dark-color-scheme-border: mix(#515e69, transparent, 50%);
898
899
  $sidepanel-footer-size-height: 64px;
899
900
  $sidepanel-footer-size-padding: 0 16px;
900
901
  $sidepanel-footer-font-default: body;
@@ -916,9 +917,9 @@ $tabs-light-color-scheme-state-disabled-text: #8c99a5;
916
917
  $tabs-light-color-scheme-state-disabled-marker-opacity: 0.3;
917
918
  $tabs-dark-color-scheme-border: #333f4a;
918
919
  $tabs-dark-color-scheme-state-normal-icon: #8c99a5;
919
- $tabs-dark-color-scheme-state-normal-text: #f2f5f9;
920
+ $tabs-dark-color-scheme-state-normal-text: #d7dee4;
920
921
  $tabs-dark-color-scheme-state-hover-icon: #6d7a86;
921
- $tabs-dark-color-scheme-state-hover-text: #f2f5f9;
922
+ $tabs-dark-color-scheme-state-hover-text: #d7dee4;
922
923
  $tabs-dark-color-scheme-state-active-marker-color: #0059b8;
923
924
  $tabs-dark-color-scheme-state-empty-icon: mix(#8c99a5, transparent, 30%);
924
925
  $tabs-dark-color-scheme-state-empty-text: #6d7a86;
@@ -937,9 +938,9 @@ $vertical-tabs-light-color-scheme-state-selected-background: #e7f1ff;
937
938
  $vertical-tabs-light-color-scheme-state-hover-background: rgba(black, 0.05);
938
939
  $vertical-tabs-light-color-scheme-state-hover-selected-background: adjust-color(#e7f1ff, $saturation:-22%, $lightness:-5%);
939
940
  $vertical-tabs-dark-color-scheme-state-normal-background: transparent;
940
- $vertical-tabs-dark-color-scheme-state-selected-background: #023c7f;
941
- $vertical-tabs-dark-color-scheme-state-hover-background: rgba(black, 0.05);
942
- $vertical-tabs-dark-color-scheme-state-hover-selected-background: adjust-color(#023c7f, $lightness:-1%);
941
+ $vertical-tabs-dark-color-scheme-state-selected-background: rgba(3, 116, 235, 0.3);
942
+ $vertical-tabs-dark-color-scheme-state-hover-background: rgba(white, 0.05);
943
+ $vertical-tabs-dark-color-scheme-state-hover-selected-background: adjust-color(rgba(3, 116, 235, 0.3), $lightness:-1%);
943
944
  $tags-light-color-scheme-primary-background: #e7f1ff;
944
945
  $tags-light-color-scheme-primary-border: transparent;
945
946
  $tags-light-color-scheme-primary-text: #0374eb;
@@ -1023,7 +1024,7 @@ $toast-light-color-scheme-icon-success: #4ba96c;
1023
1024
  $toast-light-color-scheme-icon-warning: #e19f12;
1024
1025
  $toast-dark-color-scheme-background: #333f4a;
1025
1026
  $toast-dark-color-scheme-border: rgba(25, 37, 47, 0.1);
1026
- $toast-dark-color-scheme-text: #f2f5f9;
1027
+ $toast-dark-color-scheme-text: #d7dee4;
1027
1028
  $toast-dark-color-scheme-text-caption: #8c99a5;
1028
1029
  $toast-dark-color-scheme-shadow: 0 8px 16px 0 rgba(#27333e, 0.2);
1029
1030
  $toast-dark-color-scheme-icon-info: #18a5c5;
@@ -1075,7 +1076,7 @@ $toggle-small-size-width: 24px;
1075
1076
  $toggle-small-size-border-radius: 8px;
1076
1077
  $toggle-small-font-default: caption;
1077
1078
  $tooltip-light-color-scheme-background: #333f4a;
1078
- $tooltip-light-color-scheme-text: #f2f5f9;
1079
+ $tooltip-light-color-scheme-text: #d7dee4;
1079
1080
  $tooltip-light-color-scheme-border: transparent;
1080
1081
  $tooltip-light-color-scheme-shadow: 0 2px 4px 0 rgba(39, 51, 62, 0.2);
1081
1082
  $tooltip-light-color-scheme-warning-background: #fff4dd;
@@ -1086,7 +1087,7 @@ $tooltip-dark-color-scheme-text: #19252f;
1086
1087
  $tooltip-dark-color-scheme-border: transparent;
1087
1088
  $tooltip-dark-color-scheme-shadow: 0 2px 4px 0 rgba(39, 51, 62, 0.2);
1088
1089
  $tooltip-dark-color-scheme-warning-background: #7e5406;
1089
- $tooltip-dark-color-scheme-warning-text: #f2f5f9;
1090
+ $tooltip-dark-color-scheme-warning-text: #d7dee4;
1090
1091
  $tooltip-dark-color-scheme-warning-border: #7e5406;
1091
1092
  $tooltip-size-max-width: 300px;
1092
1093
  $tooltip-size-border-width: 1px;
@@ -1100,7 +1101,7 @@ $extended-tooltip-light-color-scheme-text: #19252f;
1100
1101
  $extended-tooltip-light-color-scheme-border: #d7dee4;
1101
1102
  $extended-tooltip-light-color-scheme-shadow: 0 2px 4px 0 rgba(39, 51, 62, 0.2);
1102
1103
  $extended-tooltip-dark-color-scheme-background: #333f4a;
1103
- $extended-tooltip-dark-color-scheme-text: #f2f5f9;
1104
+ $extended-tooltip-dark-color-scheme-text: #d7dee4;
1104
1105
  $extended-tooltip-dark-color-scheme-border: #333f4a;
1105
1106
  $extended-tooltip-dark-color-scheme-shadow: 0 2px 4px 0 rgba(39, 51, 62, 0.2);
1106
1107
  $extended-tooltip-size-border-radius: 4px;
@@ -1113,7 +1114,7 @@ $extended-tooltip-header-light-color-scheme-border: #d7dee4;
1113
1114
  $extended-tooltip-header-light-color-scheme-text: #19252f;
1114
1115
  $extended-tooltip-header-light-color-scheme-background: white;
1115
1116
  $extended-tooltip-header-dark-color-scheme-border: #434f5a;
1116
- $extended-tooltip-header-dark-color-scheme-text: #f2f5f9;
1117
+ $extended-tooltip-header-dark-color-scheme-text: #d7dee4;
1117
1118
  $extended-tooltip-header-dark-color-scheme-background: #333f4a;
1118
1119
  $extended-tooltip-header-size-height: 40px;
1119
1120
  $extended-tooltip-header-size-padding: 8px 16px;
@@ -1755,63 +1756,63 @@ $typography-display-1-line-height: 76px;
1755
1756
  $typography-display-1-letter-spacing: normal;
1756
1757
  $typography-display-1-font-weight: normal;
1757
1758
  $typography-display-1-font-family: 'TT Positive', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
1758
- $typography-display-1-text-transform: null;
1759
- $typography-display-1-font-feature-settings: null;
1759
+ $typography-display-1-text-transform: initial;
1760
+ $typography-display-1-font-feature-settings: initial;
1760
1761
  $typography-display-2-font-size: 45px;
1761
1762
  $typography-display-2-line-height: 56px;
1762
1763
  $typography-display-2-letter-spacing: normal;
1763
1764
  $typography-display-2-font-weight: normal;
1764
1765
  $typography-display-2-font-family: 'TT Positive', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
1765
- $typography-display-2-text-transform: null;
1766
- $typography-display-2-font-feature-settings: null;
1766
+ $typography-display-2-text-transform: initial;
1767
+ $typography-display-2-font-feature-settings: initial;
1767
1768
  $typography-display-3-font-size: 34px;
1768
1769
  $typography-display-3-line-height: 44px;
1769
1770
  $typography-display-3-letter-spacing: normal;
1770
1771
  $typography-display-3-font-weight: normal;
1771
1772
  $typography-display-3-font-family: 'TT Positive', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
1772
- $typography-display-3-text-transform: null;
1773
- $typography-display-3-font-feature-settings: null;
1773
+ $typography-display-3-text-transform: initial;
1774
+ $typography-display-3-font-feature-settings: initial;
1774
1775
  $typography-headline-font-size: 24px;
1775
1776
  $typography-headline-line-height: 32px;
1776
1777
  $typography-headline-letter-spacing: normal;
1777
1778
  $typography-headline-font-weight: normal;
1778
1779
  $typography-headline-font-family: 'TT Positive', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
1779
- $typography-headline-text-transform: null;
1780
- $typography-headline-font-feature-settings: null;
1780
+ $typography-headline-text-transform: initial;
1781
+ $typography-headline-font-feature-settings: initial;
1781
1782
  $typography-title-font-size: 20px;
1782
1783
  $typography-title-line-height: 28px;
1783
1784
  $typography-title-letter-spacing: normal;
1784
1785
  $typography-title-font-weight: 600;
1785
1786
  $typography-title-font-family: 'TT Positive', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
1786
- $typography-title-text-transform: null;
1787
- $typography-title-font-feature-settings: null;
1787
+ $typography-title-text-transform: initial;
1788
+ $typography-title-font-feature-settings: initial;
1788
1789
  $typography-subheading-font-size: 15px;
1789
1790
  $typography-subheading-line-height: 20px;
1790
1791
  $typography-subheading-letter-spacing: -0.009em;
1791
1792
  $typography-subheading-font-weight: 600;
1792
1793
  $typography-subheading-font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
1793
- $typography-subheading-text-transform: null;
1794
+ $typography-subheading-text-transform: initial;
1794
1795
  $typography-subheading-font-feature-settings: "ss01" on, "ss04" on;
1795
1796
  $typography-body-font-size: 15px;
1796
1797
  $typography-body-line-height: 20px;
1797
1798
  $typography-body-letter-spacing: -0.009em;
1798
1799
  $typography-body-font-weight: normal;
1799
1800
  $typography-body-font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
1800
- $typography-body-text-transform: null;
1801
+ $typography-body-text-transform: initial;
1801
1802
  $typography-body-font-feature-settings: "ss01" on, "ss04" on;
1802
1803
  $typography-body-tabular-font-size: 15px;
1803
1804
  $typography-body-tabular-line-height: 20px;
1804
1805
  $typography-body-tabular-letter-spacing: -0.009em;
1805
1806
  $typography-body-tabular-font-weight: normal;
1806
1807
  $typography-body-tabular-font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
1807
- $typography-body-tabular-text-transform: null;
1808
+ $typography-body-tabular-text-transform: initial;
1808
1809
  $typography-body-tabular-font-feature-settings: "tnum" on, "ss01" on, "ss04" on;
1809
1810
  $typography-body-strong-font-size: 15px;
1810
1811
  $typography-body-strong-line-height: 20px;
1811
1812
  $typography-body-strong-letter-spacing: -0.009em;
1812
1813
  $typography-body-strong-font-weight: 500;
1813
1814
  $typography-body-strong-font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
1814
- $typography-body-strong-text-transform: null;
1815
+ $typography-body-strong-text-transform: initial;
1815
1816
  $typography-body-strong-font-feature-settings: "ss01" on, "ss04" on;
1816
1817
  $typography-body-caps-font-size: 15px;
1817
1818
  $typography-body-caps-line-height: 20px;
@@ -1825,22 +1826,29 @@ $typography-body-mono-line-height: 20px;
1825
1826
  $typography-body-mono-letter-spacing: normal;
1826
1827
  $typography-body-mono-font-weight: normal;
1827
1828
  $typography-body-mono-font-family: 'Roboto Mono', 'Consolas', 'Menlo', 'Monaco', monospace;
1828
- $typography-body-mono-text-transform: null;
1829
- $typography-body-mono-font-feature-settings: null;
1829
+ $typography-body-mono-text-transform: initial;
1830
+ $typography-body-mono-font-feature-settings: initial;
1830
1831
  $typography-caption-font-size: 13px;
1831
1832
  $typography-caption-line-height: 16px;
1832
1833
  $typography-caption-letter-spacing: -0.0025em;
1833
1834
  $typography-caption-font-weight: normal;
1834
1835
  $typography-caption-font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
1835
- $typography-caption-text-transform: null;
1836
+ $typography-caption-text-transform: initial;
1836
1837
  $typography-caption-font-feature-settings: "ss01" on, "ss04" on;
1837
1838
  $typography-caption-tabular-font-size: 13px;
1838
1839
  $typography-caption-tabular-line-height: 16px;
1839
1840
  $typography-caption-tabular-letter-spacing: -0.0025em;
1840
1841
  $typography-caption-tabular-font-weight: normal;
1841
1842
  $typography-caption-tabular-font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
1842
- $typography-caption-tabular-text-transform: null;
1843
+ $typography-caption-tabular-text-transform: initial;
1843
1844
  $typography-caption-tabular-font-feature-settings: "tnum" on, "ss01" on, "ss04" on;
1845
+ $typography-caption-strong-font-size: 13px;
1846
+ $typography-caption-strong-line-height: 16px;
1847
+ $typography-caption-strong-letter-spacing: -0.0025em;
1848
+ $typography-caption-strong-font-weight: 500;
1849
+ $typography-caption-strong-font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
1850
+ $typography-caption-strong-text-transform: initial;
1851
+ $typography-caption-strong-font-feature-settings: "tnum" on, "ss01" on, "ss04" on;
1844
1852
  $typography-caption-caps-font-size: 13px;
1845
1853
  $typography-caption-caps-line-height: 16px;
1846
1854
  $typography-caption-caps-letter-spacing: 1.5px;
@@ -1853,21 +1861,21 @@ $typography-caption-mono-line-height: 16px;
1853
1861
  $typography-caption-mono-letter-spacing: normal;
1854
1862
  $typography-caption-mono-font-weight: normal;
1855
1863
  $typography-caption-mono-font-family: 'Roboto Mono', 'Consolas', 'Menlo', 'Monaco', monospace;
1856
- $typography-caption-mono-text-transform: null;
1857
- $typography-caption-mono-font-feature-settings: null;
1864
+ $typography-caption-mono-text-transform: initial;
1865
+ $typography-caption-mono-font-feature-settings: initial;
1858
1866
  $typography-small-text-font-size: 13px;
1859
1867
  $typography-small-text-line-height: 16px;
1860
1868
  $typography-small-text-letter-spacing: -0.0025em;
1861
1869
  $typography-small-text-font-weight: normal;
1862
1870
  $typography-small-text-font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
1863
- $typography-small-text-text-transform: null;
1871
+ $typography-small-text-text-transform: initial;
1864
1872
  $typography-small-text-font-feature-settings: "ss01" on, "ss04" on;
1865
1873
  $typography-extra-small-text-font-size: 11px;
1866
1874
  $typography-extra-small-text-line-height: 16px;
1867
1875
  $typography-extra-small-text-letter-spacing: 0.005em;
1868
1876
  $typography-extra-small-text-font-weight: normal;
1869
1877
  $typography-extra-small-text-font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
1870
- $typography-extra-small-text-text-transform: null;
1878
+ $typography-extra-small-text-text-transform: initial;
1871
1879
  $typography-extra-small-text-font-feature-settings: "ss01" on, "ss04" on;
1872
1880
  $typography-extra-small-text-caps-font-size: 11px;
1873
1881
  $typography-extra-small-text-caps-line-height: 16px;
@@ -1881,8 +1889,8 @@ $typography-extra-small-text-mono-line-height: 16px;
1881
1889
  $typography-extra-small-text-mono-letter-spacing: 0px;
1882
1890
  $typography-extra-small-text-mono-font-weight: normal;
1883
1891
  $typography-extra-small-text-mono-font-family: 'Roboto Mono', 'Consolas', 'Menlo', 'Monaco', monospace;
1884
- $typography-extra-small-text-mono-text-transform: null;
1885
- $typography-extra-small-text-mono-font-feature-settings: null;
1892
+ $typography-extra-small-text-mono-text-transform: initial;
1893
+ $typography-extra-small-text-mono-font-feature-settings: initial;
1886
1894
 
1887
1895
  $mosaic: (
1888
1896
  'typography': (
@@ -2003,6 +2011,15 @@ $mosaic: (
2003
2011
  'text-transform': $typography-caption-tabular-text-transform,
2004
2012
  'font-feature-settings': $typography-caption-tabular-font-feature-settings
2005
2013
  ),
2014
+ 'caption-strong': (
2015
+ 'font-size': $typography-caption-strong-font-size,
2016
+ 'line-height': $typography-caption-strong-line-height,
2017
+ 'letter-spacing': $typography-caption-strong-letter-spacing,
2018
+ 'font-weight': $typography-caption-strong-font-weight,
2019
+ 'font-family': $typography-caption-strong-font-family,
2020
+ 'text-transform': $typography-caption-strong-text-transform,
2021
+ 'font-feature-settings': $typography-caption-strong-font-feature-settings
2022
+ ),
2006
2023
  'caption-caps': (
2007
2024
  'font-size': $typography-caption-caps-font-size,
2008
2025
  'line-height': $typography-caption-caps-line-height,
@@ -73,6 +73,8 @@ export declare class DateFormatter<D> {
73
73
  /**
74
74
  * @param date - date
75
75
  * @param template - template
76
+ * @param seconds - use seconds
77
+ * @param milliseconds - use milliseconds
76
78
  * @returns relative date by template
77
79
  */
78
80
  relativeDate(date: D, template: FormatterRelativeTemplate, seconds?: boolean, milliseconds?: boolean): string;
@@ -158,6 +160,8 @@ export declare class DateFormatter<D> {
158
160
  * @param startDate - start date
159
161
  * @param endDate - end date
160
162
  * @param template - template
163
+ * @param seconds - use seconds
164
+ * @param milliseconds - use milliseconds
161
165
  * @returns range date in template format with time
162
166
  */
163
167
  rangeDateTime(startDate: D, endDate: D, template: FormatterRangeTemplate, seconds?: boolean, milliseconds?: boolean): string;
@@ -195,10 +199,10 @@ export declare class DateFormatter<D> {
195
199
  */
196
200
  rangeMiddleDateTime(startDate: D, endDate: D, options?: DateTimeOptions): string;
197
201
  /**
198
- * @param date
202
+ * @param date - date for compile
199
203
  * @param variables - date template variables
200
204
  * @param currYearForced - param for absolute days formatting
201
- * @private
205
+ * @returns compiledVariables
202
206
  */
203
207
  private compileVariables;
204
208
  private isBeforeYesterday;
@@ -10,7 +10,7 @@
10
10
  },
11
11
  invalid: {
12
12
  border: { value: '{light-color-scheme.error.default}' },
13
- background: { value: 'transparent' }
13
+ background: { value: '{light-color-scheme.error.palette.value.40}' }
14
14
  }
15
15
  }
16
16
  },
@@ -24,7 +24,7 @@
24
24
  },
25
25
  invalid: {
26
26
  border: { value: '{dark-color-scheme.error.default}' },
27
- background: { value: 'transparent' }
27
+ background: { value: 'mix({dark-color-scheme.error.palette.value.800}, transparent, 30%)' }
28
28
  }
29
29
  }
30
30
  },
@@ -16,6 +16,7 @@
16
16
  'max-height': { value: '480px' },
17
17
  padding: { value: '{size.l}' },
18
18
  'border-radius': { value: '{size.border-radius}' },
19
+ 'border-width': { value: '{size.border-width}' },
19
20
 
20
21
  'arrow-size': { value: '12px' },
21
22
  'trigger-margin': { value: '9px' },
@@ -20,6 +20,7 @@
20
20
  'dark-color-scheme': {
21
21
  'outer-circle-border': { value: '{dark-color-scheme.second.palette.value.400}' },
22
22
  'inner-circle-border': { value: 'transparent' },
23
+ 'cap-color': { value: 'white' },
23
24
 
24
25
  states: {
25
26
  checked: {