@sbb-esta/lyne-elements-dev 5.0.0-next.3-dev.1779781429 → 5.0.0-next.3-dev.1779890843

package/option/{option/option.global.scss → _option.global.scss}

@@ -1,9 +1,20 @@
-@use '../../core/styles' as sbb;
+@use '../core/styles' as sbb;
 
 $theme: 'standard' !default;
 
 // Used by `sbb-option` and `sbb-autocomplete-grid-option`
 @mixin base {
+  --sbb-optgroup-label-color: light-dark(var(--sbb-color-metal), var(--sbb-color-smoke));
+  --sbb-optgroup-label-font-size: var(--sbb-text-font-size-xxs);
+  --sbb-optgroup-label-padding-end: #{sbb.theme-pattern-select(
+      (
+        'standard': var(--sbb-spacing-fixed-2x),
+        'lean': var(--sbb-spacing-fixed-1x),
+      ),
+      $theme
+    )};
+  --sbb-optgroup-label-padding-inline: var(--sbb-spacing-responsive-xxxs);
+  --sbb-optgroup-divider-color: var(--sbb-divider-color);
   --sbb-option-color: var(--sbb-color-3);
   --sbb-option-background-color: inherit;
   --sbb-option-background-color-hover: light-dark(var(--sbb-color-milk), var(--sbb-color-midnight));
@@ -39,6 +50,24 @@ $theme: 'standard' !default;
       $theme
     )};
   --sbb-option-font-size: var(--sbb-text-font-size-s);
+  --sbb-option-hint-color: light-dark(var(--sbb-color-metal), var(--sbb-color-smoke));
+  --sbb-option-hint-column-gap: var(--sbb-spacing-responsive-xxxs);
+  --sbb-option-hint-padding-block-end: #{sbb.theme-pattern-select(
+      (
+        'standard': var(--sbb-spacing-fixed-2x),
+        'lean': 0 var(--sbb-spacing-fixed-1x),
+      ),
+      $theme
+    )};
+  --sbb-option-hint-padding-inline: var(--sbb-spacing-responsive-xxxs);
+  --sbb-option-hint-font-size: var(--sbb-text-font-size-xxs);
+  --sbb-options-panel-border-radius: var(--sbb-border-radius-4x);
+  --sbb-options-panel-animation-timing-function: ease;
+  --sbb-options-panel-background-color: var(--sbb-background-color-2);
+  --sbb-options-panel-divider-margin-block: var(--sbb-spacing-fixed-3x);
+  --sbb-options-panel-box-shadow: var(--sbb-box-shadow-level-9-hard);
+  --sbb-options-panel-margin-block-start: var(--sbb-spacing-fixed-2x);
+  --sbb-options-panel-padding-block: var(--sbb-spacing-fixed-1x);
 }
 
 @mixin rules {

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@sbb-esta/lyne-elements-dev",
-  "version": "5.0.0-next.3-dev.1779781429",
+  "version": "5.0.0-next.3-dev.1779890843",
   "description": "Lyne Design System",
   "keywords": [
     "design system",
     "web components",
     "lit",
-    "https://github.com/sbb-design-systems/lyne-components/commit/b7c7fb322b420f3331fef15f885f530690bd764d"
+    "https://github.com/sbb-design-systems/lyne-components/commit/30782dcc6ecd31bd4d3d226cf14994a7e9573862"
   ],
   "type": "module",
   "exports": {

package/paginator/_paginator.global.scss

@@ -0,0 +1,21 @@
+@use '../core/styles' as sbb;
+
+$theme: 'standard' !default;
+
+@mixin base {
+  --sbb-paginator-color: light-dark(var(--sbb-color-metal), var(--sbb-color-smoke));
+  --sbb-paginator-height: #{sbb.theme-pattern-select(
+      (
+        'standard': var(--sbb-size-element-m),
+        'lean': var(--sbb-size-element-xs),
+      ),
+      $theme
+    )};
+  --sbb-paginator-page-border-width: 0;
+  --sbb-paginator-page-cursor: var(--sbb-cursor-pointer);
+  --sbb-paginator-animation-easing: var(--sbb-animation-easing);
+  --sbb-paginator-font-size: var(--sbb-text-font-size-s);
+  --sbb-compact-paginator-font-size: var(--sbb-text-font-size-m);
+  --sbb-compact-paginator-gap: var(--sbb-spacing-fixed-5x);
+  --sbb-compact-paginator-pages-gap: var(--sbb-spacing-fixed-2x);
+}

package/radio-button/{common/radio-button-common.global.scss → _radio-button.global.scss}

@@ -1,4 +1,4 @@
-@use '../../core/styles' as sbb;
+@use '../core/styles' as sbb;
 
 $theme: 'standard' !default;
 
@@ -30,7 +30,7 @@ $theme: 'standard' !default;
     )};
 }
 
-@mixin base-forced-colors {
+@mixin forced-colors {
   --sbb-radio-button-background-color: Canvas;
   --sbb-radio-button-border-width: var(--sbb-border-width-2x);
   --sbb-radio-button-border-color: ButtonBorder;