@sbb-esta/lyne-elements-dev 5.0.0-next-dev.1777034920 → 5.0.0-next-dev.1777124912

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 (36) hide show
  1. package/core/styles/core.scss +24 -0
  2. package/core.css +66 -0
  3. package/development/navigation/common/navigation-action-common.js +1 -1
  4. package/development/navigation/navigation/navigation.component.js +1 -1
  5. package/development/navigation/navigation-list/navigation-list.component.js +1 -1
  6. package/development/navigation/navigation-marker/navigation-marker.component.js +1 -1
  7. package/development/navigation/navigation-section/navigation-section.component.js +1 -1
  8. package/development/navigation-action-common-BsrmO4QQ.js +92 -0
  9. package/development/navigation-list.component-CQ4q671G.js +90 -0
  10. package/development/navigation-marker.component-D7ks8vbC.js +121 -0
  11. package/development/navigation-section.component-t36xyaq4.js +346 -0
  12. package/development/navigation.component-Djm0PFOA.js +315 -0
  13. package/development/navigation.js +5 -5
  14. package/development/navigation.pure.js +5 -5
  15. package/navigation/common/navigation-action-common.js +1 -1
  16. package/navigation/navigation/navigation.component.js +1 -1
  17. package/navigation/navigation-list/navigation-list.component.js +1 -1
  18. package/navigation/navigation-marker/navigation-marker.component.js +1 -1
  19. package/navigation/navigation-section/navigation-section.component.js +1 -1
  20. package/navigation-action-common-XvWVU7Zk.js +66 -0
  21. package/{navigation-list.component-DSJx3LwB.js → navigation-list.component-BX-kv06z.js} +1 -1
  22. package/{navigation-marker.component-xmkTtMap.js → navigation-marker.component-iSodFQRj.js} +1 -1
  23. package/{navigation-section.component-CUrICmbc.js → navigation-section.component-K4Pa53K7.js} +1 -1
  24. package/{navigation.component-CR4vG3vH.js → navigation.component-BFejmwjr.js} +1 -1
  25. package/navigation.js +5 -5
  26. package/navigation.pure.js +5 -5
  27. package/off-brand-theme.css +66 -0
  28. package/package.json +2 -2
  29. package/safety-theme.css +66 -0
  30. package/standard-theme.css +66 -0
  31. package/development/navigation-action-common-DREsZcc7.js +0 -92
  32. package/development/navigation-list.component-3kQyQ-yJ.js +0 -90
  33. package/development/navigation-marker.component-DyWfazQL.js +0 -121
  34. package/development/navigation-section.component-DyPWGns2.js +0 -346
  35. package/development/navigation.component-CZ2P2xfh.js +0 -315
  36. package/navigation-action-common-D3rE0ZNS.js +0 -66
package/{navigation.component-CR4vG3vH.js → navigation.component-BFejmwjr.js} RENAMED
@@ -6,7 +6,7 @@ import { SbbTransparentButtonElement as S } from "./button.pure.js";
6
6
  import { ResizeController as C } from "@lit-labs/observers/resize-controller.js";
7
7
  import { ref as w } from "lit/directives/ref.js";
8
8
  //#region src/elements/navigation/navigation/navigation.scss?inline
9
- var T = ":host{--sbb-navigation-grid-column: 1 / -1;--sbb-navigation-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-3x) );--sbb-navigation-animation-easing: ease-in;--sbb-navigation-padding-inline: var(--sbb-layout-base-offset-responsive);--sbb-navigation-padding-block-start: var(--sbb-spacing-responsive-l);--sbb-navigation-padding-block-end: var(--sbb-spacing-responsive-xl);--sbb-navigation-backdrop-visibility: hidden;--sbb-navigation-backdrop-pointer-events: none;--sbb-navigation-backdrop-color: color-mix(in srgb, var(--sbb-color-black) 70%, transparent);--sbb-navigation-backdrop-animation-name: backdrop-open;--sbb-navigation-background-color: var(--sbb-background-color-1-negative);--sbb-navigation-color: var(--sbb-color-1-negative);--sbb-navigation-list-margin-block-start: var(--sbb-spacing-responsive-xxl);--sbb-navigation-inline-start: 0;--sbb-navigation-expanded-width: 100%;--sbb-navigation-inset: 0 auto auto 0;--sbb-navigation-translate: -100% 0;--sbb-navigation-content-translate: 0;--sbb-navigation-width: 100%;--sbb-navigation-height: 100dvh;--sbb-focus-outline-color: var(--sbb-focus-outline-color-dark);display:none;position:fixed;inset:var(--sbb-navigation-inset);z-index:var(--sbb-navigation-z-index, var(--sbb-overlay-default-z-index));overflow:hidden}@media(min-width:64rem){:host{--sbb-navigation-grid-column: 1 / 5;--sbb-navigation-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-6x) );--sbb-navigation-padding-block-start: var(--sbb-spacing-responsive-xl);--sbb-navigation-padding-inline: var(--sbb-layout-base-offset-responsive) 0;--sbb-navigation-list-margin-block-start: var(--sbb-spacing-fixed-1x);--sbb-navigation-inline-start: calc(var(--sbb-layout-base-offset-responsive) * -1);--sbb-navigation-width: calc(100% + var(--sbb-layout-base-offset-responsive))}}@media(min-width:90rem){:host{--sbb-navigation-grid-column: 1 / 6;--sbb-navigation-padding-block-start: var(--sbb-spacing-responsive-xxl)}}:host(:is(:is(:state(state-opening),[state--state-opening]),:is(:state(state-opened),[state--state-opened]),:is(:state(state-closing),[state--state-closing]))){display:block}:host(:is(:state(state-opened),[state--state-opened])){--sbb-navigation-animation-easing: ease-out}:host(:is(:is(:state(state-opened),[state--state-opened]),:is(:state(state-opening),[state--state-opening]))){--sbb-navigation-backdrop-visibility: visible;--sbb-navigation-backdrop-pointer-events: all}:host(:not(:is(:state(state-closed),[state--state-closed]))){--sbb-navigation-inset: 0;--sbb-navigation-translate: }:host(:is(:state(state-closing),[state--state-closing])){--sbb-navigation-backdrop-animation-name: backdrop-close}:host(:is(:state(has-open-navigation-section),[state--has-open-navigation-section])){--sbb-navigation-content-translate: -100% 0}@media(min-width:64rem){:host(:is(:state(has-open-navigation-section),[state--has-open-navigation-section])){--sbb-navigation-expanded-width: 100dvw;--sbb-navigation-content-translate: 0}}:host(:is(:state(resize-disable-animation),[state--resize-disable-animation])){--sbb-disable-animation-duration: 0s}.sbb-navigation__container{display:grid;gap:var(--sbb-grid-base-gutter-responsive);grid-template-columns:repeat(var(--sbb-grid-base-columns),1fr);padding-inline:0;pointer-events:none;translate:var(--sbb-navigation-translate)}@media(min-width:64rem){.sbb-navigation__container{padding-inline:var(--sbb-layout-base-offset-responsive)}.sbb-navigation__container:before{transition-duration:var(--sbb-navigation-animation-duration);transition-timing-function:var(--sbb-navigation-animation-easing);transition-property:visibility;animation-name:var(--sbb-navigation-backdrop-animation-name);animation-duration:var(--sbb-navigation-animation-duration);animation-timing-function:var(--sbb-navigation-animation-easing);content:\"\";visibility:var(--sbb-navigation-backdrop-visibility);pointer-events:var(--sbb-navigation-backdrop-pointer-events);position:fixed;inset:var(--sbb-navigation-inset);background-color:var(--sbb-navigation-backdrop-color)}}.sbb-navigation{transition-duration:var(--sbb-navigation-animation-duration);transition-timing-function:var(--sbb-navigation-animation-easing);transition-property:width;display:none;width:var(--sbb-navigation-width);grid-column:var(--sbb-navigation-grid-column);padding:0;margin:0;position:relative;inset-inline-start:var(--sbb-navigation-inline-start);inset-block-start:0;border:none;pointer-events:none;height:var(--sbb-navigation-height);color:var(--sbb-navigation-color);background-color:var(--sbb-navigation-background-color)}.sbb-navigation:before{transition-duration:var(--sbb-navigation-animation-duration);transition-timing-function:var(--sbb-navigation-animation-easing);transition-property:width;content:\"\";position:absolute;width:var(--sbb-navigation-expanded-width);height:var(--sbb-navigation-height);background:var(--sbb-navigation-background-color)}:host(:is(:is(:state(state-opening),[state--state-opening]),:is(:state(state-opened),[state--state-opened]),:is(:state(state-closing),[state--state-closing]))) .sbb-navigation{display:block;pointer-events:all;animation-name:open;animation-duration:var(--sbb-navigation-animation-duration);animation-timing-function:var(--sbb-navigation-animation-easing)}:host(:is(:state(state-closing),[state--state-closing])) .sbb-navigation{pointer-events:none;animation-name:close}@media(forced-colors:active){.sbb-navigation{outline:var(--sbb-border-width-1x) solid CanvasText}}.sbb-navigation__wrapper{outline:none}.sbb-navigation__header{transition-duration:var(--sbb-navigation-animation-duration);transition-timing-function:var(--sbb-navigation-animation-easing);transition-property:width;display:flex;justify-content:flex-end;position:absolute;width:var(--sbb-navigation-expanded-width);pointer-events:none;padding:var(--sbb-spacing-responsive-xs);z-index:calc(var(--sbb-navigation-z-index, var(--sbb-overlay-default-z-index)) + 1)}.sbb-navigation__close{pointer-events:all}.sbb-navigation__content{transition-duration:var(--sbb-navigation-animation-duration);transition-timing-function:var(--sbb-navigation-animation-easing);transition-property:translate;--sbb-scrollbar-width: var(--sbb-spacing-fixed-3x);--sbb-scrollbar-thumb-width: .125rem;--sbb-scrollbar-thumb-width-hover: .25rem;--sbb-scrollbar-width-firefox: thin;--sbb-scrollbar-color: color-mix(in srgb, var(--sbb-color-white) 30%, transparent);--sbb-scrollbar-color-hover: color-mix(in srgb, var(--sbb-color-white) 60%, transparent);--sbb-scrollbar-track-color: transparent}.sbb-navigation__content::-webkit-scrollbar{width:var(--sbb-scrollbar-width);height:var(--sbb-scrollbar-width);background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-navigation__content::-webkit-scrollbar-corner{background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-navigation__content::-webkit-scrollbar-thumb{background-color:var(--sbb-scrollbar-color, currentcolor);border:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width))) solid transparent;border-radius:var(--sbb-border-radius-4x);background-clip:padding-box}.sbb-navigation__content::-webkit-scrollbar-thumb:hover{background-color:var(--sbb-scrollbar-color-hover, currentcolor);border-width:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width-hover)))}.sbb-navigation__content::-webkit-scrollbar-button,.sbb-navigation__content::-webkit-scrollbar-corner{display:none}@supports not selector(::-webkit-scrollbar){.sbb-navigation__content{scrollbar-width:var(--sbb-scrollbar-width-firefox);scrollbar-color:var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent)}}.sbb-navigation__content{display:flex;flex-direction:column;gap:var(--sbb-spacing-responsive-xxl);position:relative;height:var(--sbb-navigation-height);padding-inline:var(--sbb-navigation-padding-inline);padding-block:var(--sbb-navigation-padding-block-start) var(--sbb-navigation-padding-block-end);overflow-y:auto;translate:var(--sbb-navigation-content-translate)}::slotted(:first-child){margin-block-start:var(--sbb-navigation-list-margin-block-start)}@keyframes open{0%{translate:-100% 0}to{translate:0}}@keyframes close{0%{translate:0}to{translate:-100% 0}}@keyframes backdrop-open{0%{background-color:transparent}}@keyframes backdrop-close{to{background-color:transparent}}", E = 150, D = (() => {
9
+ var T = ":host{--sbb-navigation-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-3x) );--sbb-focus-outline-color: var(--sbb-focus-outline-color-dark);display:none;position:fixed;inset:var(--sbb-navigation-inset);z-index:var(--sbb-navigation-z-index, var(--sbb-overlay-default-z-index));overflow:hidden}@media(min-width:64rem){:host{--sbb-navigation-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-6x) );--sbb-navigation-width: calc(100% + var(--sbb-layout-base-offset-responsive))}}:host(:is(:is(:state(state-opening),[state--state-opening]),:is(:state(state-opened),[state--state-opened]),:is(:state(state-closing),[state--state-closing]))){display:block}:host(:is(:state(state-opened),[state--state-opened])){--sbb-navigation-animation-easing: ease-out}:host(:is(:is(:state(state-opened),[state--state-opened]),:is(:state(state-opening),[state--state-opening]))){--sbb-navigation-backdrop-visibility: visible;--sbb-navigation-backdrop-pointer-events: all}:host(:not(:is(:state(state-closed),[state--state-closed]))){--sbb-navigation-inset: 0;--sbb-navigation-translate: none}:host(:is(:state(state-closing),[state--state-closing])){--sbb-navigation-backdrop-animation-name: backdrop-close}:host(:is(:state(has-open-navigation-section),[state--has-open-navigation-section])){--sbb-navigation-content-translate: -100% 0}@media(min-width:64rem){:host(:is(:state(has-open-navigation-section),[state--has-open-navigation-section])){--sbb-navigation-expanded-width: 100dvw;--sbb-navigation-content-translate: 0}}:host(:is(:state(resize-disable-animation),[state--resize-disable-animation])){--sbb-disable-animation-duration: 0s}.sbb-navigation__container{display:grid;gap:var(--sbb-grid-base-gutter-responsive);grid-template-columns:repeat(var(--sbb-grid-base-columns),1fr);padding-inline:0;pointer-events:none;translate:var(--sbb-navigation-translate)}@media(min-width:64rem){.sbb-navigation__container{padding-inline:var(--sbb-layout-base-offset-responsive)}.sbb-navigation__container:before{transition-duration:var(--sbb-navigation-animation-duration);transition-timing-function:var(--sbb-navigation-animation-easing);transition-property:visibility;animation-name:var(--sbb-navigation-backdrop-animation-name);animation-duration:var(--sbb-navigation-animation-duration);animation-timing-function:var(--sbb-navigation-animation-easing);content:\"\";visibility:var(--sbb-navigation-backdrop-visibility, hidden);pointer-events:var(--sbb-navigation-backdrop-pointer-events, none);position:fixed;inset:var(--sbb-navigation-inset);background-color:var(--sbb-navigation-backdrop-color)}}.sbb-navigation{transition-duration:var(--sbb-navigation-animation-duration);transition-timing-function:var(--sbb-navigation-animation-easing);transition-property:width;display:none;width:var(--sbb-navigation-width);grid-column:var(--sbb-navigation-grid-column);padding:0;margin:0;position:relative;inset-inline-start:var(--sbb-navigation-inline-start, 0);inset-block-start:0;border:none;pointer-events:none;height:var(--sbb-navigation-height);color:var(--sbb-navigation-color);background-color:var(--sbb-navigation-background-color)}.sbb-navigation:before{transition-duration:var(--sbb-navigation-animation-duration);transition-timing-function:var(--sbb-navigation-animation-easing);transition-property:width;content:\"\";position:absolute;width:var(--sbb-navigation-expanded-width);height:var(--sbb-navigation-height);background-color:var(--sbb-navigation-background-color)}:host(:is(:is(:state(state-opening),[state--state-opening]),:is(:state(state-opened),[state--state-opened]),:is(:state(state-closing),[state--state-closing]))) .sbb-navigation{display:block;pointer-events:all;animation-name:open;animation-duration:var(--sbb-navigation-animation-duration);animation-timing-function:var(--sbb-navigation-animation-easing)}:host(:is(:state(state-closing),[state--state-closing])) .sbb-navigation{pointer-events:none;animation-name:close}@media(forced-colors:active){.sbb-navigation{outline:var(--sbb-border-width-1x) solid CanvasText}}.sbb-navigation__wrapper{outline:none}.sbb-navigation__header{transition-duration:var(--sbb-navigation-animation-duration);transition-timing-function:var(--sbb-navigation-animation-easing);transition-property:width;display:flex;justify-content:flex-end;position:absolute;width:var(--sbb-navigation-expanded-width);pointer-events:none;padding:var(--sbb-spacing-responsive-xs);z-index:calc(var(--sbb-navigation-z-index, var(--sbb-overlay-default-z-index)) + 1)}.sbb-navigation__close{pointer-events:all}.sbb-navigation__content{transition-duration:var(--sbb-navigation-animation-duration);transition-timing-function:var(--sbb-navigation-animation-easing);transition-property:translate;--sbb-scrollbar-width: var(--sbb-spacing-fixed-3x);--sbb-scrollbar-thumb-width: .125rem;--sbb-scrollbar-thumb-width-hover: .25rem;--sbb-scrollbar-width-firefox: thin;--sbb-scrollbar-color: color-mix(in srgb, var(--sbb-color-white) 30%, transparent);--sbb-scrollbar-color-hover: color-mix(in srgb, var(--sbb-color-white) 60%, transparent);--sbb-scrollbar-track-color: transparent}.sbb-navigation__content::-webkit-scrollbar{width:var(--sbb-scrollbar-width);height:var(--sbb-scrollbar-width);background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-navigation__content::-webkit-scrollbar-corner{background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-navigation__content::-webkit-scrollbar-thumb{background-color:var(--sbb-scrollbar-color, currentcolor);border:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width))) solid transparent;border-radius:var(--sbb-border-radius-4x);background-clip:padding-box}.sbb-navigation__content::-webkit-scrollbar-thumb:hover{background-color:var(--sbb-scrollbar-color-hover, currentcolor);border-width:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width-hover)))}.sbb-navigation__content::-webkit-scrollbar-button,.sbb-navigation__content::-webkit-scrollbar-corner{display:none}@supports not selector(::-webkit-scrollbar){.sbb-navigation__content{scrollbar-width:var(--sbb-scrollbar-width-firefox);scrollbar-color:var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent)}}.sbb-navigation__content{display:flex;flex-direction:column;gap:var(--sbb-navigation-content-gap);position:relative;height:var(--sbb-navigation-height);padding-inline:var(--sbb-navigation-padding-inline);padding-block:var(--sbb-navigation-padding-block-start) var(--sbb-navigation-padding-block-end);overflow-y:auto;translate:var(--sbb-navigation-content-translate)}::slotted(:first-child){margin-block-start:var(--sbb-navigation-list-margin-block-start)}@keyframes open{0%{translate:-100% 0}to{translate:0}}@keyframes close{0%{translate:0}to{translate:-100% 0}}@keyframes backdrop-open{0%{background-color:transparent}}@keyframes backdrop-close{to{background-color:transparent}}", E = 150, D = (() => {
10
10
  let D = p(d), O, k = [], A = [], j, M = [], N = [], P, F = [], I = [];
11
11
  return class extends D {
12
12
  static {
package/navigation.js CHANGED
@@ -1,10 +1,10 @@
1
- import { t as e } from "./navigation-action-common-D3rE0ZNS.js";
1
+ import { t as e } from "./navigation-action-common-XvWVU7Zk.js";
2
2
  import { SbbNavigationButtonElement as t } from "./navigation/navigation-button/navigation-button.component.js";
3
3
  import { SbbNavigationLinkElement as n } from "./navigation/navigation-link/navigation-link.component.js";
4
- import { t as r } from "./navigation-list.component-DSJx3LwB.js";
5
- import { t as i } from "./navigation-marker.component-xmkTtMap.js";
6
- import { t as a } from "./navigation-section.component-CUrICmbc.js";
7
- import { t as o } from "./navigation.component-CR4vG3vH.js";
4
+ import { t as r } from "./navigation-list.component-BX-kv06z.js";
5
+ import { t as i } from "./navigation-marker.component-iSodFQRj.js";
6
+ import { t as a } from "./navigation-section.component-K4Pa53K7.js";
7
+ import { t as o } from "./navigation.component-BFejmwjr.js";
8
8
  import "./navigation.pure.js";
9
9
  o.define(), t.define(), n.define(), r.define(), i.define(), a.define();
10
10
  //#endregion
package/navigation.pure.js CHANGED
@@ -1,8 +1,8 @@
1
- import { t as e } from "./navigation-action-common-D3rE0ZNS.js";
1
+ import { t as e } from "./navigation-action-common-XvWVU7Zk.js";
2
2
  import { SbbNavigationButtonElement as t } from "./navigation/navigation-button/navigation-button.component.js";
3
3
  import { SbbNavigationLinkElement as n } from "./navigation/navigation-link/navigation-link.component.js";
4
- import { t as r } from "./navigation-list.component-DSJx3LwB.js";
5
- import { t as i } from "./navigation-marker.component-xmkTtMap.js";
6
- import { t as a } from "./navigation-section.component-CUrICmbc.js";
7
- import { t as o } from "./navigation.component-CR4vG3vH.js";
4
+ import { t as r } from "./navigation-list.component-BX-kv06z.js";
5
+ import { t as i } from "./navigation-marker.component-iSodFQRj.js";
6
+ import { t as a } from "./navigation-section.component-K4Pa53K7.js";
7
+ import { t as o } from "./navigation.component-BFejmwjr.js";
8
8
  export { e as SbbNavigationActionCommonElementMixin, t as SbbNavigationButtonElement, o as SbbNavigationElement, n as SbbNavigationLinkElement, r as SbbNavigationListElement, i as SbbNavigationMarkerElement, a as SbbNavigationSectionElement };
package/off-brand-theme.css CHANGED
@@ -1659,6 +1659,54 @@ slot[name=error]::slotted(*) {
1659
1659
  --sbb-message-subtitle-color: var(--sbb-color-granite);
1660
1660
  --sbb-message-subtitle-color: light-dark(var(--sbb-color-granite), var(--sbb-color-platinum));
1661
1661
  --sbb-message-legend-margin-block: var(--sbb-spacing-responsive-xxxs) 0;
1662
+ --sbb-navigation-grid-column: 1 / -1;
1663
+ --sbb-navigation-animation-easing: ease-in;
1664
+ --sbb-navigation-padding-inline: var(--sbb-layout-base-offset-responsive);
1665
+ --sbb-navigation-padding-block-start: var(--sbb-spacing-responsive-l);
1666
+ --sbb-navigation-padding-block-end: var(--sbb-spacing-responsive-xl);
1667
+ --sbb-navigation-backdrop-color: color-mix(in srgb, var(--sbb-color-black) 70%, transparent);
1668
+ --sbb-navigation-backdrop-animation-name: backdrop-open;
1669
+ --sbb-navigation-background-color: var(--sbb-background-color-1-negative);
1670
+ --sbb-navigation-color: var(--sbb-color-1-negative);
1671
+ --sbb-navigation-list-margin-block-start: var(--sbb-spacing-responsive-xxl);
1672
+ --sbb-navigation-expanded-width: 100%;
1673
+ --sbb-navigation-inset: 0 auto auto 0;
1674
+ --sbb-navigation-translate: -100% 0;
1675
+ --sbb-navigation-content-gap: var(--sbb-spacing-responsive-xxl);
1676
+ --sbb-navigation-content-translate: 0;
1677
+ --sbb-navigation-width: 100%;
1678
+ --sbb-navigation-height: 100dvh;
1679
+ --sbb-navigation-action-color: var(--sbb-color-4-negative);
1680
+ --sbb-navigation-action-icon-display: none;
1681
+ --sbb-navigation-action-font-size: var(--sbb-text-font-size-xl);
1682
+ --sbb-navigation-action-letter-spacing: var(--sbb-typo-letter-spacing-heading);
1683
+ --sbb-navigation-action-line-height: var(--sbb-typo-line-height-heading);
1684
+ --sbb-navigation-list-font-size: var(--sbb-text-font-size-xxs);
1685
+ --sbb-navigation-list-gap: var(--sbb-spacing-fixed-2x);
1686
+ --sbb-navigation-list-margin-block: var(--sbb-spacing-fixed-1x);
1687
+ --sbb-navigation-list-padding-block-end: var(--sbb-spacing-fixed-2x);
1688
+ --sbb-navigation-action-gap: var(--sbb-spacing-responsive-xs);
1689
+ --sbb-navigation-marker-position-x: var(--sbb-spacing-fixed-1x);
1690
+ --sbb-navigation-marker-position-y: unset;
1691
+ --sbb-navigation-marker-width: 1.0625rem;
1692
+ --sbb-navigation-marker-border: var(--sbb-border-width-1x);
1693
+ --sbb-navigation-marker-padding-inline-start: var(--sbb-spacing-fixed-6x);
1694
+ --sbb-navigation-marker-typo-line-height: var(--sbb-typo-line-height-heading);
1695
+ --sbb-navigation-margin-inline-start: var(--sbb-spacing-fixed-3x);
1696
+ --sbb-navigation-marker-font-size: var(--sbb-text-font-size-xl);
1697
+ --sbb-navigation-marker-letter-spacing: var(--sbb-typo-letter-spacing-heading);
1698
+ --sbb-navigation-marker-line-height: var(--sbb-typo-line-height-heading);
1699
+ --sbb-navigation-section-column: 1 / -1;
1700
+ --sbb-navigation-section-position: fixed;
1701
+ --sbb-navigation-section-pointer-events: none;
1702
+ --sbb-navigation-section-animation-easing: ease-out;
1703
+ --sbb-navigation-section-padding-inline: var(--sbb-layout-base-offset-responsive);
1704
+ --sbb-navigation-section-padding-block: var(--sbb-spacing-responsive-l);
1705
+ --sbb-navigation-section-translate: 100%;
1706
+ --sbb-navigation-section-content-padding-inline-start: var(--sbb-spacing-fixed-12x);
1707
+ --sbb-navigation-section-width: 100dvw;
1708
+ --sbb-navigation-section-height: 100dvh;
1709
+ --sbb-navigation-section-font-size: var(--sbb-heading-font-size-4);
1662
1710
  --sbb-mini-calendar-day-animation-easing: var(--sbb-animation-easing);
1663
1711
  --sbb-mini-calendar-day-dimensions: 0.375rem;
1664
1712
  --sbb-mini-calendar-day-scale: 1.333;
@@ -2143,6 +2191,19 @@ slot[name=error]::slotted(*) {
2143
2191
  --_sbb-form-field-floating-label-transform: 0.65625rem;
2144
2192
  --_sbb-form-field-spacer-margin-block-end: calc(-1 * var(--_sbb-form-field-label-to-input-overlapping));
2145
2193
  --sbb-header-height: var(--sbb-spacing-fixed-24x);
2194
+ --sbb-navigation-grid-column: 1 / 5;
2195
+ --sbb-navigation-padding-block-start: var(--sbb-spacing-responsive-xl);
2196
+ --sbb-navigation-padding-inline: var(--sbb-layout-base-offset-responsive) 0;
2197
+ --sbb-navigation-list-margin-block-start: var(--sbb-spacing-fixed-1x);
2198
+ --sbb-navigation-inline-start: calc(var(--sbb-layout-base-offset-responsive) * -1);
2199
+ --sbb-navigation-section-column: 5 / 13;
2200
+ --sbb-navigation-section-padding-block: var(--sbb-spacing-responsive-xl);
2201
+ --sbb-navigation-section-padding-inline: var(--sbb-spacing-fixed-8x)
2202
+ var(--sbb-layout-base-offset-responsive);
2203
+ --sbb-navigation-section-position: relative;
2204
+ --sbb-navigation-section-translate: 0;
2205
+ --sbb-navigation-section-content-padding-inline-start: 0;
2206
+ --sbb-navigation-section-font-size: var(--sbb-heading-font-size-2);
2146
2207
  --sbb-menu-max-width: 20rem;
2147
2208
  --sbb-menu-min-width: 11.25rem;
2148
2209
  --sbb-menu-transform-y: var(--sbb-spacing-fixed-2x);
@@ -2178,6 +2239,11 @@ slot[name=error]::slotted(*) {
2178
2239
  --sbb-lead-container-image-ratio: 21 / 9;
2179
2240
  --sbb-lead-container-image-border-radius: var(--sbb-lead-container-border-radius);
2180
2241
  --sbb-map-container-sidebar-width: 30rem;
2242
+ --sbb-navigation-grid-column: 1 / 6;
2243
+ --sbb-navigation-padding-block-start: var(--sbb-spacing-responsive-xxl);
2244
+ --sbb-navigation-section-column: 6 / 17;
2245
+ --sbb-navigation-section-padding-block: var(--sbb-spacing-responsive-xxl)
2246
+ var(--sbb-spacing-responsive-l);
2181
2247
  --sbb-panel-width: 26.75rem;
2182
2248
  --sbb-panel-inner-height: 20.02375rem;
2183
2249
  --sbb-panel-triangle-height: 3.956875rem;
package/package.json CHANGED
@@ -1,12 +1,12 @@
1
1
  {
2
2
  "name": "@sbb-esta/lyne-elements-dev",
3
- "version": "5.0.0-next-dev.1777034920",
3
+ "version": "5.0.0-next-dev.1777124912",
4
4
  "description": "Lyne Design System",
5
5
  "keywords": [
6
6
  "design system",
7
7
  "web components",
8
8
  "lit",
9
- "https://github.com/sbb-design-systems/lyne-components/commit/dc1484a70dd94e9f3170a2f9c5d367583835f45d"
9
+ "https://github.com/sbb-design-systems/lyne-components/commit/aaaaafd20c0b6d7f25f8274f9903e3d6a6751f35"
10
10
  ],
11
11
  "type": "module",
12
12
  "exports": {
package/safety-theme.css CHANGED
@@ -1659,6 +1659,54 @@ slot[name=error]::slotted(*) {
1659
1659
  --sbb-message-subtitle-color: var(--sbb-color-granite);
1660
1660
  --sbb-message-subtitle-color: light-dark(var(--sbb-color-granite), var(--sbb-color-platinum));
1661
1661
  --sbb-message-legend-margin-block: var(--sbb-spacing-responsive-xxxs) 0;
1662
+ --sbb-navigation-grid-column: 1 / -1;
1663
+ --sbb-navigation-animation-easing: ease-in;
1664
+ --sbb-navigation-padding-inline: var(--sbb-layout-base-offset-responsive);
1665
+ --sbb-navigation-padding-block-start: var(--sbb-spacing-responsive-l);
1666
+ --sbb-navigation-padding-block-end: var(--sbb-spacing-responsive-xl);
1667
+ --sbb-navigation-backdrop-color: color-mix(in srgb, var(--sbb-color-black) 70%, transparent);
1668
+ --sbb-navigation-backdrop-animation-name: backdrop-open;
1669
+ --sbb-navigation-background-color: var(--sbb-background-color-1-negative);
1670
+ --sbb-navigation-color: var(--sbb-color-1-negative);
1671
+ --sbb-navigation-list-margin-block-start: var(--sbb-spacing-responsive-xxl);
1672
+ --sbb-navigation-expanded-width: 100%;
1673
+ --sbb-navigation-inset: 0 auto auto 0;
1674
+ --sbb-navigation-translate: -100% 0;
1675
+ --sbb-navigation-content-gap: var(--sbb-spacing-responsive-xxl);
1676
+ --sbb-navigation-content-translate: 0;
1677
+ --sbb-navigation-width: 100%;
1678
+ --sbb-navigation-height: 100dvh;
1679
+ --sbb-navigation-action-color: var(--sbb-color-4-negative);
1680
+ --sbb-navigation-action-icon-display: none;
1681
+ --sbb-navigation-action-font-size: var(--sbb-text-font-size-xl);
1682
+ --sbb-navigation-action-letter-spacing: var(--sbb-typo-letter-spacing-heading);
1683
+ --sbb-navigation-action-line-height: var(--sbb-typo-line-height-heading);
1684
+ --sbb-navigation-list-font-size: var(--sbb-text-font-size-xxs);
1685
+ --sbb-navigation-list-gap: var(--sbb-spacing-fixed-2x);
1686
+ --sbb-navigation-list-margin-block: var(--sbb-spacing-fixed-1x);
1687
+ --sbb-navigation-list-padding-block-end: var(--sbb-spacing-fixed-2x);
1688
+ --sbb-navigation-action-gap: var(--sbb-spacing-responsive-xs);
1689
+ --sbb-navigation-marker-position-x: var(--sbb-spacing-fixed-1x);
1690
+ --sbb-navigation-marker-position-y: unset;
1691
+ --sbb-navigation-marker-width: 1.0625rem;
1692
+ --sbb-navigation-marker-border: var(--sbb-border-width-1x);
1693
+ --sbb-navigation-marker-padding-inline-start: var(--sbb-spacing-fixed-6x);
1694
+ --sbb-navigation-marker-typo-line-height: var(--sbb-typo-line-height-heading);
1695
+ --sbb-navigation-margin-inline-start: var(--sbb-spacing-fixed-3x);
1696
+ --sbb-navigation-marker-font-size: var(--sbb-text-font-size-xl);
1697
+ --sbb-navigation-marker-letter-spacing: var(--sbb-typo-letter-spacing-heading);
1698
+ --sbb-navigation-marker-line-height: var(--sbb-typo-line-height-heading);
1699
+ --sbb-navigation-section-column: 1 / -1;
1700
+ --sbb-navigation-section-position: fixed;
1701
+ --sbb-navigation-section-pointer-events: none;
1702
+ --sbb-navigation-section-animation-easing: ease-out;
1703
+ --sbb-navigation-section-padding-inline: var(--sbb-layout-base-offset-responsive);
1704
+ --sbb-navigation-section-padding-block: var(--sbb-spacing-responsive-l);
1705
+ --sbb-navigation-section-translate: 100%;
1706
+ --sbb-navigation-section-content-padding-inline-start: var(--sbb-spacing-fixed-12x);
1707
+ --sbb-navigation-section-width: 100dvw;
1708
+ --sbb-navigation-section-height: 100dvh;
1709
+ --sbb-navigation-section-font-size: var(--sbb-heading-font-size-4);
1662
1710
  --sbb-mini-calendar-day-animation-easing: var(--sbb-animation-easing);
1663
1711
  --sbb-mini-calendar-day-dimensions: 0.375rem;
1664
1712
  --sbb-mini-calendar-day-scale: 1.333;
@@ -2143,6 +2191,19 @@ slot[name=error]::slotted(*) {
2143
2191
  --_sbb-form-field-floating-label-transform: 0.65625rem;
2144
2192
  --_sbb-form-field-spacer-margin-block-end: calc(-1 * var(--_sbb-form-field-label-to-input-overlapping));
2145
2193
  --sbb-header-height: var(--sbb-spacing-fixed-24x);
2194
+ --sbb-navigation-grid-column: 1 / 5;
2195
+ --sbb-navigation-padding-block-start: var(--sbb-spacing-responsive-xl);
2196
+ --sbb-navigation-padding-inline: var(--sbb-layout-base-offset-responsive) 0;
2197
+ --sbb-navigation-list-margin-block-start: var(--sbb-spacing-fixed-1x);
2198
+ --sbb-navigation-inline-start: calc(var(--sbb-layout-base-offset-responsive) * -1);
2199
+ --sbb-navigation-section-column: 5 / 13;
2200
+ --sbb-navigation-section-padding-block: var(--sbb-spacing-responsive-xl);
2201
+ --sbb-navigation-section-padding-inline: var(--sbb-spacing-fixed-8x)
2202
+ var(--sbb-layout-base-offset-responsive);
2203
+ --sbb-navigation-section-position: relative;
2204
+ --sbb-navigation-section-translate: 0;
2205
+ --sbb-navigation-section-content-padding-inline-start: 0;
2206
+ --sbb-navigation-section-font-size: var(--sbb-heading-font-size-2);
2146
2207
  --sbb-menu-max-width: 20rem;
2147
2208
  --sbb-menu-min-width: 11.25rem;
2148
2209
  --sbb-menu-transform-y: var(--sbb-spacing-fixed-2x);
@@ -2178,6 +2239,11 @@ slot[name=error]::slotted(*) {
2178
2239
  --sbb-lead-container-image-ratio: 21 / 9;
2179
2240
  --sbb-lead-container-image-border-radius: var(--sbb-lead-container-border-radius);
2180
2241
  --sbb-map-container-sidebar-width: 30rem;
2242
+ --sbb-navigation-grid-column: 1 / 6;
2243
+ --sbb-navigation-padding-block-start: var(--sbb-spacing-responsive-xxl);
2244
+ --sbb-navigation-section-column: 6 / 17;
2245
+ --sbb-navigation-section-padding-block: var(--sbb-spacing-responsive-xxl)
2246
+ var(--sbb-spacing-responsive-l);
2181
2247
  --sbb-panel-width: 26.75rem;
2182
2248
  --sbb-panel-inner-height: 20.02375rem;
2183
2249
  --sbb-panel-triangle-height: 3.956875rem;
package/standard-theme.css CHANGED
@@ -1659,6 +1659,54 @@ slot[name=error]::slotted(*) {
1659
1659
  --sbb-message-subtitle-color: var(--sbb-color-granite);
1660
1660
  --sbb-message-subtitle-color: light-dark(var(--sbb-color-granite), var(--sbb-color-platinum));
1661
1661
  --sbb-message-legend-margin-block: var(--sbb-spacing-responsive-xxxs) 0;
1662
+ --sbb-navigation-grid-column: 1 / -1;
1663
+ --sbb-navigation-animation-easing: ease-in;
1664
+ --sbb-navigation-padding-inline: var(--sbb-layout-base-offset-responsive);
1665
+ --sbb-navigation-padding-block-start: var(--sbb-spacing-responsive-l);
1666
+ --sbb-navigation-padding-block-end: var(--sbb-spacing-responsive-xl);
1667
+ --sbb-navigation-backdrop-color: color-mix(in srgb, var(--sbb-color-black) 70%, transparent);
1668
+ --sbb-navigation-backdrop-animation-name: backdrop-open;
1669
+ --sbb-navigation-background-color: var(--sbb-background-color-1-negative);
1670
+ --sbb-navigation-color: var(--sbb-color-1-negative);
1671
+ --sbb-navigation-list-margin-block-start: var(--sbb-spacing-responsive-xxl);
1672
+ --sbb-navigation-expanded-width: 100%;
1673
+ --sbb-navigation-inset: 0 auto auto 0;
1674
+ --sbb-navigation-translate: -100% 0;
1675
+ --sbb-navigation-content-gap: var(--sbb-spacing-responsive-xxl);
1676
+ --sbb-navigation-content-translate: 0;
1677
+ --sbb-navigation-width: 100%;
1678
+ --sbb-navigation-height: 100dvh;
1679
+ --sbb-navigation-action-color: var(--sbb-color-4-negative);
1680
+ --sbb-navigation-action-icon-display: none;
1681
+ --sbb-navigation-action-font-size: var(--sbb-text-font-size-xl);
1682
+ --sbb-navigation-action-letter-spacing: var(--sbb-typo-letter-spacing-heading);
1683
+ --sbb-navigation-action-line-height: var(--sbb-typo-line-height-heading);
1684
+ --sbb-navigation-list-font-size: var(--sbb-text-font-size-xxs);
1685
+ --sbb-navigation-list-gap: var(--sbb-spacing-fixed-2x);
1686
+ --sbb-navigation-list-margin-block: var(--sbb-spacing-fixed-1x);
1687
+ --sbb-navigation-list-padding-block-end: var(--sbb-spacing-fixed-2x);
1688
+ --sbb-navigation-action-gap: var(--sbb-spacing-responsive-xs);
1689
+ --sbb-navigation-marker-position-x: var(--sbb-spacing-fixed-1x);
1690
+ --sbb-navigation-marker-position-y: unset;
1691
+ --sbb-navigation-marker-width: 1.0625rem;
1692
+ --sbb-navigation-marker-border: var(--sbb-border-width-1x);
1693
+ --sbb-navigation-marker-padding-inline-start: var(--sbb-spacing-fixed-6x);
1694
+ --sbb-navigation-marker-typo-line-height: var(--sbb-typo-line-height-heading);
1695
+ --sbb-navigation-margin-inline-start: var(--sbb-spacing-fixed-3x);
1696
+ --sbb-navigation-marker-font-size: var(--sbb-text-font-size-xl);
1697
+ --sbb-navigation-marker-letter-spacing: var(--sbb-typo-letter-spacing-heading);
1698
+ --sbb-navigation-marker-line-height: var(--sbb-typo-line-height-heading);
1699
+ --sbb-navigation-section-column: 1 / -1;
1700
+ --sbb-navigation-section-position: fixed;
1701
+ --sbb-navigation-section-pointer-events: none;
1702
+ --sbb-navigation-section-animation-easing: ease-out;
1703
+ --sbb-navigation-section-padding-inline: var(--sbb-layout-base-offset-responsive);
1704
+ --sbb-navigation-section-padding-block: var(--sbb-spacing-responsive-l);
1705
+ --sbb-navigation-section-translate: 100%;
1706
+ --sbb-navigation-section-content-padding-inline-start: var(--sbb-spacing-fixed-12x);
1707
+ --sbb-navigation-section-width: 100dvw;
1708
+ --sbb-navigation-section-height: 100dvh;
1709
+ --sbb-navigation-section-font-size: var(--sbb-heading-font-size-4);
1662
1710
  --sbb-mini-calendar-day-animation-easing: var(--sbb-animation-easing);
1663
1711
  --sbb-mini-calendar-day-dimensions: 0.375rem;
1664
1712
  --sbb-mini-calendar-day-scale: 1.333;
@@ -2143,6 +2191,19 @@ slot[name=error]::slotted(*) {
2143
2191
  --_sbb-form-field-floating-label-transform: 0.65625rem;
2144
2192
  --_sbb-form-field-spacer-margin-block-end: calc(-1 * var(--_sbb-form-field-label-to-input-overlapping));
2145
2193
  --sbb-header-height: var(--sbb-spacing-fixed-24x);
2194
+ --sbb-navigation-grid-column: 1 / 5;
2195
+ --sbb-navigation-padding-block-start: var(--sbb-spacing-responsive-xl);
2196
+ --sbb-navigation-padding-inline: var(--sbb-layout-base-offset-responsive) 0;
2197
+ --sbb-navigation-list-margin-block-start: var(--sbb-spacing-fixed-1x);
2198
+ --sbb-navigation-inline-start: calc(var(--sbb-layout-base-offset-responsive) * -1);
2199
+ --sbb-navigation-section-column: 5 / 13;
2200
+ --sbb-navigation-section-padding-block: var(--sbb-spacing-responsive-xl);
2201
+ --sbb-navigation-section-padding-inline: var(--sbb-spacing-fixed-8x)
2202
+ var(--sbb-layout-base-offset-responsive);
2203
+ --sbb-navigation-section-position: relative;
2204
+ --sbb-navigation-section-translate: 0;
2205
+ --sbb-navigation-section-content-padding-inline-start: 0;
2206
+ --sbb-navigation-section-font-size: var(--sbb-heading-font-size-2);
2146
2207
  --sbb-menu-max-width: 20rem;
2147
2208
  --sbb-menu-min-width: 11.25rem;
2148
2209
  --sbb-menu-transform-y: var(--sbb-spacing-fixed-2x);
@@ -2178,6 +2239,11 @@ slot[name=error]::slotted(*) {
2178
2239
  --sbb-lead-container-image-ratio: 21 / 9;
2179
2240
  --sbb-lead-container-image-border-radius: var(--sbb-lead-container-border-radius);
2180
2241
  --sbb-map-container-sidebar-width: 30rem;
2242
+ --sbb-navigation-grid-column: 1 / 6;
2243
+ --sbb-navigation-padding-block-start: var(--sbb-spacing-responsive-xxl);
2244
+ --sbb-navigation-section-column: 6 / 17;
2245
+ --sbb-navigation-section-padding-block: var(--sbb-spacing-responsive-xxl)
2246
+ var(--sbb-spacing-responsive-l);
2181
2247
  --sbb-panel-width: 26.75rem;
2182
2248
  --sbb-panel-inner-height: 20.02375rem;
2183
2249
  --sbb-panel-triangle-height: 3.956875rem;
package/development/navigation-action-common-DREsZcc7.js DELETED
@@ -1,92 +0,0 @@
1
- import { __esDecorate, __runInitializers } from "tslib";
2
- import { unsafeCSS } from "lit";
3
- import { property } from "lit/decorators.js";
4
- import { boxSizingStyles } from "./core.js";
5
- import { html as html$1 } from "lit/static-html.js";
6
- import { SbbIconElement } from "./icon.pure.js";
7
- //#region src/elements/navigation/common/navigation-action.scss?inline
8
- var navigation_action_default = ":host {\n --sbb-navigation-action-color: var(--sbb-color-4-negative);\n --sbb-navigation-action-icon-display: none;\n display: block;\n outline: none !important;\n}\n\n:host(:is(:state(section-action),[state--section-action]):is(:state(action-active),[state--action-active]).sbb-active) {\n --sbb-navigation-action-icon-display: block;\n}\n\n:host(:is(:state(action-active),[state--action-active])) {\n --sbb-navigation-action-color: var(--sbb-color-5);\n}\n@media (forced-colors: active) {\n :host(:is(:state(action-active),[state--action-active])) {\n --sbb-navigation-action-color: Highlight;\n }\n}\n\nsbb-icon {\n display: var(--sbb-navigation-action-icon-display);\n position: absolute;\n inset-inline-start: calc((var(--sbb-size-icon-ui-small) + var(--sbb-spacing-fixed-1x)) * -1);\n inset-block-start: calc(1em * var(--sbb-typo-line-height-text) / 2);\n translate: 0 -50%;\n}\n\n@media (any-hover: hover) {\n :host(:hover) {\n --sbb-navigation-action-color: var(--sbb-color-5);\n }\n}\n@media (forced-colors: active) {\n :host(:is(:state(button),[state--button])) {\n --sbb-navigation-action-color: ButtonText;\n }\n}\n\n:is(.sbb-navigation-button, .sbb-navigation-link) {\n --sbb-title-font-size: var(--sbb-title-font-size-level-4-lean, var(--sbb-heading-font-size-4));\n margin-block: var(--sbb-title-margin-block, 0);\n margin-inline: 0;\n font-family: var(--sbb-typo-font-family);\n font-weight: bold;\n font-size: var(--sbb-title-font-size);\n letter-spacing: var(--sbb-typo-letter-spacing-heading);\n line-height: var(--sbb-title-line-height, var(--sbb-typo-line-height-heading));\n cursor: var(--sbb-cursor-pointer);\n position: relative;\n text-decoration: none;\n display: flex;\n user-select: none;\n -webkit-tap-highlight-color: transparent;\n transition: color var(--sbb-disable-animation-duration, var(--sbb-animation-duration-3x)) ease;\n hyphens: auto;\n text-align: left;\n color: var(--sbb-navigation-action-color);\n outline: none;\n}\n@media (forced-colors: active) {\n :is(.sbb-navigation-button, .sbb-navigation-link) {\n transition: none;\n }\n}\n:host([size=m]) :is(.sbb-navigation-button, .sbb-navigation-link) {\n --sbb-text-font-size: var(--sbb-text-font-size-s);\n font-family: var(--sbb-typo-font-family);\n font-weight: normal;\n line-height: var(--sbb-typo-line-height-text);\n letter-spacing: var(--sbb-typo-letter-spacing-text);\n font-size: var(--sbb-text-font-size);\n font-weight: bold;\n}\n:host([size=s]) :is(.sbb-navigation-button, .sbb-navigation-link) {\n --sbb-text-font-size: var(--sbb-text-font-size-xxs);\n font-family: var(--sbb-typo-font-family);\n font-weight: normal;\n line-height: var(--sbb-typo-line-height-text);\n letter-spacing: var(--sbb-typo-letter-spacing-text);\n font-size: var(--sbb-text-font-size);\n font-weight: bold;\n}\n:host(:focus-visible) :is(.sbb-navigation-button, .sbb-navigation-link), :is(.sbb-navigation-button, .sbb-navigation-link):focus-visible {\n outline-offset: var(--sbb-focus-outline-offset);\n outline: var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);\n border-radius: calc(var(--sbb-border-radius-4x) - var(--sbb-focus-outline-offset));\n}";
9
- //#endregion
10
- //#region src/elements/navigation/common/navigation-action-common.ts
11
- var SbbNavigationActionCommonElementMixin = (superClass) => {
12
- return (() => {
13
- let _classSuper = superClass;
14
- let _size_decorators;
15
- let _size_initializers = [];
16
- let _size_extraInitializers = [];
17
- return class SbbNavigationActionCommonElement extends _classSuper {
18
- static {
19
- const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
20
- _size_decorators = [property({ reflect: true })];
21
- __esDecorate(this, null, _size_decorators, {
22
- kind: "accessor",
23
- name: "size",
24
- static: false,
25
- private: false,
26
- access: {
27
- has: (obj) => "size" in obj,
28
- get: (obj) => obj.size,
29
- set: (obj, value) => {
30
- obj.size = value;
31
- }
32
- },
33
- metadata: _metadata
34
- }, _size_initializers, _size_extraInitializers);
35
- if (_metadata) Object.defineProperty(this, Symbol.metadata, {
36
- enumerable: true,
37
- configurable: true,
38
- writable: true,
39
- value: _metadata
40
- });
41
- }
42
- static {
43
- this.elementDependencies = [SbbIconElement];
44
- }
45
- static {
46
- this.styles = [boxSizingStyles, unsafeCSS(navigation_action_default)];
47
- }
48
- #size_accessor_storage;
49
- /**
50
- * Action size variant, either s, m or l.
51
- */
52
- get size() {
53
- return this.#size_accessor_storage;
54
- }
55
- set size(value) {
56
- this.#size_accessor_storage = value;
57
- }
58
- /** The navigation marker in which the action is nested. */
59
- get marker() {
60
- return this._navigationMarker;
61
- }
62
- /** The section in which the action is nested. */
63
- get section() {
64
- return this._navigationSection;
65
- }
66
- constructor(...args) {
67
- super(...args);
68
- this.#size_accessor_storage = __runInitializers(this, _size_initializers, "l");
69
- /** The section that is being controlled by the action, if any. */
70
- this.connectedSection = __runInitializers(this, _size_extraInitializers);
71
- this._navigationMarker = null;
72
- this._navigationSection = null;
73
- this.addEventListener?.("click", () => {
74
- if (!this.matches(":is(:state(action-active),[state--action-active])") && this._navigationMarker && !this.connectedSection) this.marker?.select(this);
75
- });
76
- }
77
- connectedCallback() {
78
- super.connectedCallback();
79
- this._navigationMarker = this.closest("sbb-navigation-marker");
80
- this._navigationSection = this.closest("sbb-navigation-section");
81
- this.toggleState("section-action", !!this._navigationSection);
82
- }
83
- renderTemplate() {
84
- return html$1`<sbb-icon name="dash-small"></sbb-icon> <slot></slot>`;
85
- }
86
- };
87
- })();
88
- };
89
- //#endregion
90
- export { SbbNavigationActionCommonElementMixin as t };
91
-
92
- //# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmF2aWdhdGlvbi1hY3Rpb24tY29tbW9uLURSRXNaY2M3LmpzIiwibmFtZXMiOltdLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9lbGVtZW50cy9uYXZpZ2F0aW9uL2NvbW1vbi9uYXZpZ2F0aW9uLWFjdGlvbi5zY3NzP2lubGluZSIsIi4uLy4uLy4uL3NyYy9lbGVtZW50cy9uYXZpZ2F0aW9uL2NvbW1vbi9uYXZpZ2F0aW9uLWFjdGlvbi1jb21tb24udHMiXSwic291cmNlc0NvbnRlbnQiOlsiQHVzZSAnLi4vLi4vY29yZS9zdHlsZXMnIGFzIHNiYjtcblxuOmhvc3Qge1xuICAtLXNiYi1uYXZpZ2F0aW9uLWFjdGlvbi1jb2xvcjogdmFyKC0tc2JiLWNvbG9yLTQtbmVnYXRpdmUpO1xuICAtLXNiYi1uYXZpZ2F0aW9uLWFjdGlvbi1pY29uLWRpc3BsYXk6IG5vbmU7XG5cbiAgZGlzcGxheTogYmxvY2s7XG5cbiAgLy8gVXNlICFpbXBvcnRhbnQgaGVyZSB0byBub3QgaW50ZXJmZXJlIHdpdGggRmlyZWZveCBmb2N1cyByaW5nIGRlZmluaXRpb25cbiAgLy8gd2hpY2ggYXBwZWFycyBpbiBub3JtYWxpemUgQ1NTIG9mIHNldmVyYWwgZnJhbWV3b3Jrcy5cbiAgb3V0bGluZTogbm9uZSAhaW1wb3J0YW50O1xufVxuXG46aG9zdCg6c3RhdGUoc2VjdGlvbi1hY3Rpb24pOnN0YXRlKGFjdGlvbi1hY3RpdmUpLnNiYi1hY3RpdmUpIHtcbiAgLS1zYmItbmF2aWdhdGlvbi1hY3Rpb24taWNvbi1kaXNwbGF5OiBibG9jaztcbn1cblxuOmhvc3QoOnN0YXRlKGFjdGlvbi1hY3RpdmUpKSB7XG4gIC0tc2JiLW5hdmlnYXRpb24tYWN0aW9uLWNvbG9yOiB2YXIoLS1zYmItY29sb3ItNSk7XG5cbiAgQGluY2x1ZGUgc2JiLmlmLWZvcmNlZC1jb2xvcnMge1xuICAgIC0tc2JiLW5hdmlnYXRpb24tYWN0aW9uLWNvbG9yOiBIaWdobGlnaHQ7XG4gIH1cbn1cblxuc2JiLWljb24ge1xuICBkaXNwbGF5OiB2YXIoLS1zYmItbmF2aWdhdGlvbi1hY3Rpb24taWNvbi1kaXNwbGF5KTtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICBpbnNldC1pbmxpbmUtc3RhcnQ6IGNhbGMoKHZhcigtLXNiYi1zaXplLWljb24tdWktc21hbGwpICsgdmFyKC0tc2JiLXNwYWNpbmctZml4ZWQtMXgpKSAqIC0xKTtcbiAgaW5zZXQtYmxvY2stc3RhcnQ6IGNhbGMoMWVtICogKHZhcigtLXNiYi10eXBvLWxpbmUtaGVpZ2h0LXRleHQpIC8gMikpO1xuICB0cmFuc2xhdGU6IDAgLTUwJTtcbn1cblxuQGluY2x1ZGUgc2JiLmhvdmVyLW1xKCRob3ZlcjogdHJ1ZSkge1xuICA6aG9zdCg6aG92ZXIpIHtcbiAgICAtLXNiYi1uYXZpZ2F0aW9uLWFjdGlvbi1jb2xvcjogdmFyKC0tc2JiLWNvbG9yLTUpO1xuICB9XG59XG5cbjpob3N0KDpzdGF0ZShidXR0b24pKSB7XG4gIEBpbmNsdWRlIHNiYi5pZi1mb3JjZWQtY29sb3JzIHtcbiAgICAtLXNiYi1uYXZpZ2F0aW9uLWFjdGlvbi1jb2xvcjogQnV0dG9uVGV4dDtcbiAgfVxufVxuXG46aXMoLnNiYi1uYXZpZ2F0aW9uLWJ1dHRvbiwgLnNiYi1uYXZpZ2F0aW9uLWxpbmspIHtcbiAgQGluY2x1ZGUgc2JiLnRpdGxlLTQoJGV4Y2x1ZGUtc3BhY2luZzogdHJ1ZSk7XG5cbiAgY3Vyc29yOiB2YXIoLS1zYmItY3Vyc29yLXBvaW50ZXIpO1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIHRleHQtZGVjb3JhdGlvbjogbm9uZTtcbiAgZGlzcGxheTogZmxleDtcbiAgdXNlci1zZWxlY3Q6IG5vbmU7XG4gIC13ZWJraXQtdGFwLWhpZ2hsaWdodC1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIHRyYW5zaXRpb246IGNvbG9yIHZhcigtLXNiYi1kaXNhYmxlLWFuaW1hdGlvbi1kdXJhdGlvbiwgdmFyKC0tc2JiLWFuaW1hdGlvbi1kdXJhdGlvbi0zeCkpIGVhc2U7XG4gIGh5cGhlbnM6IGF1dG87XG4gIHRleHQtYWxpZ246IGxlZnQ7XG4gIGNvbG9yOiB2YXIoLS1zYmItbmF2aWdhdGlvbi1hY3Rpb24tY29sb3IpO1xuICBvdXRsaW5lOiBub25lO1xuXG4gIEBpbmNsdWRlIHNiYi5pZi1mb3JjZWQtY29sb3JzIHtcbiAgICB0cmFuc2l0aW9uOiBub25lO1xuICB9XG5cbiAgOmhvc3QoW3NpemU9J20nXSkgJiB7XG4gICAgQGluY2x1ZGUgc2JiLnRleHQtcy0tYm9sZDtcbiAgfVxuXG4gIDpob3N0KFtzaXplPSdzJ10pICYge1xuICAgIEBpbmNsdWRlIHNiYi50ZXh0LXh4cy0tYm9sZDtcbiAgfVxuXG4gIC8vIEhhbmRsZSBmb2N1cyBvbiB0aGUgaG9zdCAoYnV0dG9uIHZhcmlhbnQpXG4gIDpob3N0KDpmb2N1cy12aXNpYmxlKSAmLFxuICAvLyBIYW5kbGUgZm9jdXMgb24gdGhlIGFjdGlvbiAobGluayB2YXJpYW50KVxuICAmOmZvY3VzLXZpc2libGUge1xuICAgIEBpbmNsdWRlIHNiYi5mb2N1cy1vdXRsaW5lO1xuXG4gICAgYm9yZGVyLXJhZGl1czogY2FsYyh2YXIoLS1zYmItYm9yZGVyLXJhZGl1cy00eCkgLSB2YXIoLS1zYmItZm9jdXMtb3V0bGluZS1vZmZzZXQpKTtcbiAgfVxufVxuIiwiaW1wb3J0IHsgdHlwZSBDU1NSZXN1bHRHcm91cCwgdHlwZSBUZW1wbGF0ZVJlc3VsdCwgdW5zYWZlQ1NTIH0gZnJvbSAnbGl0JztcbmltcG9ydCB7IHByb3BlcnR5IH0gZnJvbSAnbGl0L2RlY29yYXRvcnMuanMnO1xuaW1wb3J0IHsgaHRtbCB9IGZyb20gJ2xpdC9zdGF0aWMtaHRtbC5qcyc7XG5cbmltcG9ydCB0eXBlIHtcbiAgQWJzdHJhY3RDb25zdHJ1Y3RvcixcbiAgU2JiQWN0aW9uQmFzZUVsZW1lbnQsXG4gIFNiYkVsZW1lbnRDb25zdHJ1Y3RvcixcbiAgU2JiRWxlbWVudFR5cGUsXG59IGZyb20gJy4uLy4uL2NvcmUudHMnO1xuaW1wb3J0IHsgYm94U2l6aW5nU3R5bGVzIH0gZnJvbSAnLi4vLi4vY29yZS50cyc7XG5pbXBvcnQgeyBTYmJJY29uRWxlbWVudCB9IGZyb20gJy4uLy4uL2ljb24ucHVyZS50cyc7XG5pbXBvcnQgdHlwZSB7IFNiYk5hdmlnYXRpb25CdXR0b25FbGVtZW50IH0gZnJvbSAnLi4vbmF2aWdhdGlvbi1idXR0b24vbmF2aWdhdGlvbi1idXR0b24uY29tcG9uZW50LnRzJztcbmltcG9ydCB0eXBlIHsgU2JiTmF2aWdhdGlvbkxpbmtFbGVtZW50IH0gZnJvbSAnLi4vbmF2aWdhdGlvbi1saW5rL25hdmlnYXRpb24tbGluay5jb21wb25lbnQudHMnO1xuaW1wb3J0IHR5cGUgeyBTYmJOYXZpZ2F0aW9uTWFya2VyRWxlbWVudCB9IGZyb20gJy4uL25hdmlnYXRpb24tbWFya2VyL25hdmlnYXRpb24tbWFya2VyLmNvbXBvbmVudC50cyc7XG5pbXBvcnQgdHlwZSB7IFNiYk5hdmlnYXRpb25TZWN0aW9uRWxlbWVudCB9IGZyb20gJy4uL25hdmlnYXRpb24tc2VjdGlvbi9uYXZpZ2F0aW9uLXNlY3Rpb24uY29tcG9uZW50LnRzJztcblxuaW1wb3J0IHN0eWxlIGZyb20gJy4vbmF2aWdhdGlvbi1hY3Rpb24uc2Nzcz9pbmxpbmUnO1xuXG5leHBvcnQgdHlwZSBTYmJOYXZpZ2F0aW9uQWN0aW9uU2l6ZSA9ICdzJyB8ICdtJyB8ICdsJztcblxuZXhwb3J0IGRlY2xhcmUgY2xhc3MgU2JiTmF2aWdhdGlvbkFjdGlvbkNvbW1vbkVsZW1lbnRNaXhpblR5cGUge1xuICBwdWJsaWMgYWNjZXNzb3Igc2l6ZTogU2JiTmF2aWdhdGlvbkFjdGlvblNpemU7XG4gIHB1YmxpYyBnZXQgbWFya2VyKCk6IFNiYk5hdmlnYXRpb25NYXJrZXJFbGVtZW50IHwgbnVsbDtcbiAgcHVibGljIGdldCBzZWN0aW9uKCk6IFNiYk5hdmlnYXRpb25TZWN0aW9uRWxlbWVudCB8IG51bGw7XG4gIHB1YmxpYyBjb25uZWN0ZWRTZWN0aW9uOiBTYmJOYXZpZ2F0aW9uU2VjdGlvbkVsZW1lbnQgfCB1bmRlZmluZWQ7XG59XG5cbi8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBAdHlwZXNjcmlwdC1lc2xpbnQvbmFtaW5nLWNvbnZlbnRpb25cbmV4cG9ydCBjb25zdCBTYmJOYXZpZ2F0aW9uQWN0aW9uQ29tbW9uRWxlbWVudE1peGluID0gPFxuICBUIGV4dGVuZHMgQWJzdHJhY3RDb25zdHJ1Y3RvcjxTYmJBY3Rpb25CYXNlRWxlbWVudD4gJiBTYmJFbGVtZW50Q29uc3RydWN0b3IsXG4+KFxuICBzdXBlckNsYXNzOiBULFxuKTogQWJzdHJhY3RDb25zdHJ1Y3RvcjxTYmJOYXZpZ2F0aW9uQWN0aW9uQ29tbW9uRWxlbWVudE1peGluVHlwZT4gJiBUID0+IHtcbiAgYWJzdHJhY3QgY2xhc3MgU2JiTmF2aWdhdGlvbkFjdGlvbkNvbW1vbkVsZW1lbnRcbiAgICBleHRlbmRzIHN1cGVyQ2xhc3NcbiAgICBpbXBsZW1lbnRzIFBhcnRpYWw8U2JiTmF2aWdhdGlvbkFjdGlvbkNvbW1vbkVsZW1lbnRNaXhpblR5cGU+XG4gIHtcbiAgICBwdWJsaWMgc3RhdGljIG92ZXJyaWRlIGVsZW1lbnREZXBlbmRlbmNpZXM6IFNiYkVsZW1lbnRUeXBlW10gPSBbU2JiSWNvbkVsZW1lbnRdO1xuICAgIHB1YmxpYyBzdGF0aWMgc3R5bGVzOiBDU1NSZXN1bHRHcm91cCA9IFtib3hTaXppbmdTdHlsZXMsIHVuc2FmZUNTUyhzdHlsZSldO1xuXG4gICAgLyoqXG4gICAgICogQWN0aW9uIHNpemUgdmFyaWFudCwgZWl0aGVyIHMsIG0gb3IgbC5cbiAgICAgKi9cbiAgICBAcHJvcGVydHkoeyByZWZsZWN0OiB0cnVlIH0pIHB1YmxpYyBhY2Nlc3NvciBzaXplOiBTYmJOYXZpZ2F0aW9uQWN0aW9uU2l6ZSA9ICdsJztcblxuICAgIC8qKiBUaGUgc2VjdGlvbiB0aGF0IGlzIGJlaW5nIGNvbnRyb2xsZWQgYnkgdGhlIGFjdGlvbiwgaWYgYW55LiAqL1xuICAgIHB1YmxpYyBjb25uZWN0ZWRTZWN0aW9uPzogU2JiTmF2aWdhdGlvblNlY3Rpb25FbGVtZW50O1xuXG4gICAgLyoqIFRoZSBuYXZpZ2F0aW9uIG1hcmtlciBpbiB3aGljaCB0aGUgYWN0aW9uIGlzIG5lc3RlZC4gKi9cbiAgICBwdWJsaWMgZ2V0IG1hcmtlcigpOiBTYmJOYXZpZ2F0aW9uTWFya2VyRWxlbWVudCB8IG51bGwge1xuICAgICAgcmV0dXJuIHRoaXMuX25hdmlnYXRpb25NYXJrZXI7XG4gICAgfVxuXG4gICAgLyoqIFRoZSBzZWN0aW9uIGluIHdoaWNoIHRoZSBhY3Rpb24gaXMgbmVzdGVkLiAqL1xuICAgIHB1YmxpYyBnZXQgc2VjdGlvbigpOiBTYmJOYXZpZ2F0aW9uU2VjdGlvbkVsZW1lbnQgfCBudWxsIHtcbiAgICAgIHJldHVybiB0aGlzLl9uYXZpZ2F0aW9uU2VjdGlvbjtcbiAgICB9XG5cbiAgICBwcml2YXRlIF9uYXZpZ2F0aW9uTWFya2VyOiBTYmJOYXZpZ2F0aW9uTWFya2VyRWxlbWVudCB8IG51bGwgPSBudWxsO1xuICAgIHByaXZhdGUgX25hdmlnYXRpb25TZWN0aW9uOiBTYmJOYXZpZ2F0aW9uU2VjdGlvbkVsZW1lbnQgfCBudWxsID0gbnVsbDtcblxuICAgIHByb3RlY3RlZCBjb25zdHJ1Y3RvciguLi5hcmdzOiBhbnlbXSkge1xuICAgICAgc3VwZXIoLi4uYXJncyk7XG4gICAgICB0aGlzLmFkZEV2ZW50TGlzdGVuZXI/LignY2xpY2snLCAoKSA9PiB7XG4gICAgICAgIGlmIChcbiAgICAgICAgICAhdGhpcy5tYXRjaGVzKCc6c3RhdGUoYWN0aW9uLWFjdGl2ZSknKSAmJlxuICAgICAgICAgIHRoaXMuX25hdmlnYXRpb25NYXJrZXIgJiZcbiAgICAgICAgICAhdGhpcy5jb25uZWN0ZWRTZWN0aW9uXG4gICAgICAgICkge1xuICAgICAgICAgIHRoaXMubWFya2VyPy5zZWxlY3QoXG4gICAgICAgICAgICB0aGlzIGFzIHVua25vd24gYXMgU2JiTmF2aWdhdGlvbkJ1dHRvbkVsZW1lbnQgfCBTYmJOYXZpZ2F0aW9uTGlua0VsZW1lbnQsXG4gICAgICAgICAgKTtcbiAgICAgICAgfVxuICAgICAgfSk7XG4gICAgfVxuXG4gICAgcHVibGljIG92ZXJyaWRlIGNvbm5lY3RlZENhbGxiYWNrKCk6IHZvaWQge1xuICAgICAgc3VwZXIuY29ubmVjdGVkQ2FsbGJhY2soKTtcblxuICAgICAgLy8gQ2hlY2sgaWYgdGhlIGN1cnJlbnQgZWxlbWVudCBpcyBuZXN0ZWQgaW5zaWRlIGEgbmF2aWdhdGlvbiBtYXJrZXIuXG4gICAgICB0aGlzLl9uYXZpZ2F0aW9uTWFya2VyID0gdGhpcy5jbG9zZXN0KCdzYmItbmF2aWdhdGlvbi1tYXJrZXInKTtcblxuICAgICAgLy8gQ2hlY2sgaWYgdGhlIGN1cnJlbnQgZWxlbWVudCBpcyBuZXN0ZWQgaW5zaWRlIGEgbmF2aWdhdGlvbiBzZWN0aW9uLlxuICAgICAgdGhpcy5fbmF2aWdhdGlvblNlY3Rpb24gPSB0aGlzLmNsb3Nlc3QoJ3NiYi1uYXZpZ2F0aW9uLXNlY3Rpb24nKTtcbiAgICAgIHRoaXMudG9nZ2xlU3RhdGUoJ3NlY3Rpb24tYWN0aW9uJywgISF0aGlzLl9uYXZpZ2F0aW9uU2VjdGlvbik7XG4gICAgfVxuXG4gICAgcHJvdGVjdGVkIG92ZXJyaWRlIHJlbmRlclRlbXBsYXRlKCk6IFRlbXBsYXRlUmVzdWx0IHtcbiAgICAgIHJldHVybiBodG1sYDxzYmItaWNvbiBuYW1lPVwiZGFzaC1zbWFsbFwiPjwvc2JiLWljb24+IDxzbG90Pjwvc2xvdD5gO1xuICAgIH1cbiAgfVxuICByZXR1cm4gU2JiTmF2aWdhdGlvbkFjdGlvbkNvbW1vbkVsZW1lbnQgYXMgdW5rbm93biBhcyBBYnN0cmFjdENvbnN0cnVjdG9yPFNiYk5hdmlnYXRpb25BY3Rpb25Db21tb25FbGVtZW50TWl4aW5UeXBlPiAmXG4gICAgVDtcbn07XG4iXSwibWFwcGluZ3MiOiI7Ozs7Ozs7Ozs7QUM2QkEsSUFBYSx5Q0FHWCxlQUNzRTtBQTJEdEUsZUExRCtDO29CQUNyQzs7OztlQURLLHlDQUNMLFlBQVU7Ozt3QkFTakIsU0FBUyxFQUFFLFNBQVMsTUFBTSxDQUFDLENBQUE7QUFBQyxpQkFBQSxNQUFBLE1BQUEsa0JBQUE7S0FBQSxNQUFBO0tBQUEsTUFBQTtLQUFBLFFBQUE7S0FBQSxTQUFBO0tBQUEsUUFBQTtNQUFBLE1BQUEsUUFBQSxVQUFBO01BQUEsTUFBQSxRQUFBLElBQWdCO01BQUksTUFBQSxLQUFBLFVBQUE7QUFBQSxXQUFKLE9BQUk7O01BQUE7S0FBQSxVQUFBO0tBQUEsRUFBQSxvQkFBQSx3QkFBQTs7Ozs7Ozs7O0FBTjFCLFNBQUEsc0JBQXdDLENBQUMsZUFBZTs7O0FBQ2pFLFNBQUEsU0FBeUIsQ0FBQyxpQkFBaUIsVUFBVSwwQkFBTSxDQUFDOztHQUs3Qzs7OztHQUFBLElBQWdCLE9BQUk7QUFBQSxXQUFBLE1BQUE7O0dBQXBCLElBQWdCLEtBQUksT0FBQTtBQUFBLFVBQUEsd0JBQUE7OztHQU1qRCxJQUFXLFNBQU07QUFDZixXQUFPLEtBQUs7OztHQUlkLElBQVcsVUFBTztBQUNoQixXQUFPLEtBQUs7O0dBTWQsWUFBc0IsR0FBRyxNQUFXO0FBQ2xDLFVBQU0sR0FBRyxLQUFLO0FBbkI2QixVQUFBLHdCQUFBLGtCQUFBLE1BQUEsb0JBQWdDLElBQUc7O0FBR3pFLFNBQUEsbUJBQWdCLGtCQUFBLE1BQUEsd0JBQUE7QUFZZixTQUFBLG9CQUF1RDtBQUN2RCxTQUFBLHFCQUF5RDtBQUkvRCxTQUFLLG1CQUFtQixlQUFjO0FBQ3BDLFNBQ0UsQ0FBQyxLQUFLLFFBQVEsb0RBQXdCLElBQ3RDLEtBQUsscUJBQ0wsQ0FBQyxLQUFLLGlCQUVOLE1BQUssUUFBUSxPQUNYLEtBQ0Q7TUFFSDs7R0FHWSxvQkFBaUI7QUFDL0IsVUFBTSxtQkFBbUI7QUFHekIsU0FBSyxvQkFBb0IsS0FBSyxRQUFRLHdCQUF3QjtBQUc5RCxTQUFLLHFCQUFxQixLQUFLLFFBQVEseUJBQXlCO0FBQ2hFLFNBQUssWUFBWSxrQkFBa0IsQ0FBQyxDQUFDLEtBQUssbUJBQW1COztHQUc1QyxpQkFBYztBQUMvQixXQUFPLE1BQUk7OztLQUdSIn0=
package/development/navigation-list.component-3kQyQ-yJ.js DELETED
@@ -1,90 +0,0 @@
1
- import { __esDecorate, __runInitializers } from "tslib";
2
- import { html, unsafeCSS } from "lit";
3
- import { property } from "lit/decorators.js";
4
- import { SbbElement, SbbNamedSlotListMixin, boxSizingStyles, forceType, omitEmptyConverter } from "./core.js";
5
- //#region src/elements/navigation/navigation-list/navigation-list.scss?inline
6
- var navigation_list_default = ":host {\n display: block;\n}\n\n.sbb-navigation-list__content {\n list-style: none;\n margin: 0;\n padding: 0;\n font-size: inherit;\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n gap: var(--sbb-spacing-fixed-2x);\n margin-block: var(--sbb-spacing-fixed-1x);\n}\n\n.sbb-navigation-list__label {\n --sbb-text-font-size: var(--sbb-text-font-size-xxs);\n font-family: var(--sbb-typo-font-family);\n font-weight: normal;\n line-height: var(--sbb-typo-line-height-text);\n letter-spacing: var(--sbb-typo-letter-spacing-text);\n font-size: var(--sbb-text-font-size);\n font-weight: bold;\n display: block;\n color: var(--sbb-color-5);\n padding-block-end: var(--sbb-spacing-fixed-2x);\n}\n:host(:not(:is(:state(slotted-label),[state--slotted-label]), [label])) .sbb-navigation-list__label {\n display: none;\n}";
7
- //#endregion
8
- //#region src/elements/navigation/navigation-list/navigation-list.component.ts
9
- /**
10
- * It can be used as a container for one or more `sbb-navigation-button`/`sbb-navigation-link` within a `sbb-navigation-section`.
11
- *
12
- * @slot - Use the unnamed slot to add content to the `sbb-navigation-list`.
13
- * @slot label - Use this to provide a label element.
14
- */
15
- var SbbNavigationListElement = (() => {
16
- let _classSuper = SbbNamedSlotListMixin(SbbElement);
17
- let _label_decorators;
18
- let _label_initializers = [];
19
- let _label_extraInitializers = [];
20
- return class SbbNavigationListElement extends _classSuper {
21
- static {
22
- const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
23
- _label_decorators = [forceType(), property({
24
- reflect: true,
25
- converter: omitEmptyConverter
26
- })];
27
- __esDecorate(this, null, _label_decorators, {
28
- kind: "accessor",
29
- name: "label",
30
- static: false,
31
- private: false,
32
- access: {
33
- has: (obj) => "label" in obj,
34
- get: (obj) => obj.label,
35
- set: (obj, value) => {
36
- obj.label = value;
37
- }
38
- },
39
- metadata: _metadata
40
- }, _label_initializers, _label_extraInitializers);
41
- if (_metadata) Object.defineProperty(this, Symbol.metadata, {
42
- enumerable: true,
43
- configurable: true,
44
- writable: true,
45
- value: _metadata
46
- });
47
- }
48
- static {
49
- this.elementName = "sbb-navigation-list";
50
- }
51
- static {
52
- this.styles = [boxSizingStyles, unsafeCSS(navigation_list_default)];
53
- }
54
- #label_accessor_storage;
55
- /**
56
- * The label to be shown before the action list.
57
- */
58
- get label() {
59
- return this.#label_accessor_storage;
60
- }
61
- set label(value) {
62
- this.#label_accessor_storage = value;
63
- }
64
- willUpdate(changedProperties) {
65
- super.willUpdate(changedProperties);
66
- if (changedProperties.has("listChildren")) this.listChildren.forEach((c) => c.size = "m");
67
- }
68
- render() {
69
- return html`
70
- <span class="sbb-navigation-list__label" id="sbb-navigation-link-label-id">
71
- <slot name="label">${this.label}</slot>
72
- </span>
73
- ${this.renderList({
74
- class: "sbb-navigation-list__content",
75
- ariaLabelledby: "sbb-navigation-link-label-id"
76
- })}
77
- `;
78
- }
79
- constructor() {
80
- super(...arguments);
81
- this.listChildLocalNames = ["sbb-navigation-button", "sbb-navigation-link"];
82
- this.#label_accessor_storage = __runInitializers(this, _label_initializers, "");
83
- __runInitializers(this, _label_extraInitializers);
84
- }
85
- };
86
- })();
87
- //#endregion
88
- export { SbbNavigationListElement as t };
89
-
90
- //# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmF2aWdhdGlvbi1saXN0LmNvbXBvbmVudC0za1F5US15Si5qcyIsIm5hbWVzIjpbXSwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvZWxlbWVudHMvbmF2aWdhdGlvbi9uYXZpZ2F0aW9uLWxpc3QvbmF2aWdhdGlvbi1saXN0LnNjc3M/aW5saW5lIiwiLi4vLi4vLi4vc3JjL2VsZW1lbnRzL25hdmlnYXRpb24vbmF2aWdhdGlvbi1saXN0L25hdmlnYXRpb24tbGlzdC5jb21wb25lbnQudHMiXSwic291cmNlc0NvbnRlbnQiOlsiQHVzZSAnLi4vLi4vY29yZS9zdHlsZXMnIGFzIHNiYjtcblxuOmhvc3Qge1xuICBkaXNwbGF5OiBibG9jaztcbn1cblxuLnNiYi1uYXZpZ2F0aW9uLWxpc3RfX2NvbnRlbnQge1xuICBAaW5jbHVkZSBzYmIubGlzdC1yZXNldDtcblxuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICBhbGlnbi1pdGVtczogZmxleC1zdGFydDtcbiAgZ2FwOiB2YXIoLS1zYmItc3BhY2luZy1maXhlZC0yeCk7XG4gIG1hcmdpbi1ibG9jazogdmFyKC0tc2JiLXNwYWNpbmctZml4ZWQtMXgpO1xufVxuXG4uc2JiLW5hdmlnYXRpb24tbGlzdF9fbGFiZWwge1xuICBAaW5jbHVkZSBzYmIudGV4dC14eHMtLWJvbGQ7XG5cbiAgZGlzcGxheTogYmxvY2s7XG4gIGNvbG9yOiB2YXIoLS1zYmItY29sb3ItNSk7XG4gIHBhZGRpbmctYmxvY2stZW5kOiB2YXIoLS1zYmItc3BhY2luZy1maXhlZC0yeCk7XG5cbiAgOmhvc3QoOm5vdCg6c3RhdGUoc2xvdHRlZC1sYWJlbCksIFtsYWJlbF0pKSAmIHtcbiAgICBkaXNwbGF5OiBub25lO1xuICB9XG59XG4iLCJpbXBvcnQge1xuICB0eXBlIENTU1Jlc3VsdEdyb3VwLFxuICBodG1sLFxuICB0eXBlIFByb3BlcnR5VmFsdWVzLFxuICB0eXBlIFRlbXBsYXRlUmVzdWx0LFxuICB1bnNhZmVDU1MsXG59IGZyb20gJ2xpdCc7XG5pbXBvcnQgeyBwcm9wZXJ0eSB9IGZyb20gJ2xpdC9kZWNvcmF0b3JzLmpzJztcblxuaW1wb3J0IHtcbiAgYm94U2l6aW5nU3R5bGVzLFxuICBmb3JjZVR5cGUsXG4gIG9taXRFbXB0eUNvbnZlcnRlcixcbiAgU2JiRWxlbWVudCxcbiAgU2JiTmFtZWRTbG90TGlzdE1peGluLFxuICB0eXBlIFdpdGhMaXN0Q2hpbGRyZW4sXG59IGZyb20gJy4uLy4uL2NvcmUudHMnO1xuaW1wb3J0IHR5cGUgeyBTYmJOYXZpZ2F0aW9uQnV0dG9uRWxlbWVudCB9IGZyb20gJy4uL25hdmlnYXRpb24tYnV0dG9uL25hdmlnYXRpb24tYnV0dG9uLmNvbXBvbmVudC50cyc7XG5pbXBvcnQgdHlwZSB7IFNiYk5hdmlnYXRpb25MaW5rRWxlbWVudCB9IGZyb20gJy4uL25hdmlnYXRpb24tbGluay9uYXZpZ2F0aW9uLWxpbmsuY29tcG9uZW50LnRzJztcblxuaW1wb3J0IHN0eWxlIGZyb20gJy4vbmF2aWdhdGlvbi1saXN0LnNjc3M/aW5saW5lJztcblxuLyoqXG4gKiBJdCBjYW4gYmUgdXNlZCBhcyBhIGNvbnRhaW5lciBmb3Igb25lIG9yIG1vcmUgYHNiYi1uYXZpZ2F0aW9uLWJ1dHRvbmAvYHNiYi1uYXZpZ2F0aW9uLWxpbmtgIHdpdGhpbiBhIGBzYmItbmF2aWdhdGlvbi1zZWN0aW9uYC5cbiAqXG4gKiBAc2xvdCAtIFVzZSB0aGUgdW5uYW1lZCBzbG90IHRvIGFkZCBjb250ZW50IHRvIHRoZSBgc2JiLW5hdmlnYXRpb24tbGlzdGAuXG4gKiBAc2xvdCBsYWJlbCAtIFVzZSB0aGlzIHRvIHByb3ZpZGUgYSBsYWJlbCBlbGVtZW50LlxuICovXG5leHBvcnQgY2xhc3MgU2JiTmF2aWdhdGlvbkxpc3RFbGVtZW50IGV4dGVuZHMgU2JiTmFtZWRTbG90TGlzdE1peGluPFxuICBTYmJOYXZpZ2F0aW9uQnV0dG9uRWxlbWVudCB8IFNiYk5hdmlnYXRpb25MaW5rRWxlbWVudCxcbiAgdHlwZW9mIFNiYkVsZW1lbnRcbj4oU2JiRWxlbWVudCkge1xuICBwdWJsaWMgc3RhdGljIG92ZXJyaWRlIHJlYWRvbmx5IGVsZW1lbnROYW1lOiBzdHJpbmcgPSAnc2JiLW5hdmlnYXRpb24tbGlzdCc7XG4gIHB1YmxpYyBzdGF0aWMgb3ZlcnJpZGUgc3R5bGVzOiBDU1NSZXN1bHRHcm91cCA9IFtib3hTaXppbmdTdHlsZXMsIHVuc2FmZUNTUyhzdHlsZSldO1xuICBwcm90ZWN0ZWQgb3ZlcnJpZGUgcmVhZG9ubHkgbGlzdENoaWxkTG9jYWxOYW1lcyA9IFtcbiAgICAnc2JiLW5hdmlnYXRpb24tYnV0dG9uJyxcbiAgICAnc2JiLW5hdmlnYXRpb24tbGluaycsXG4gIF07XG5cbiAgLyoqXG4gICAqIFRoZSBsYWJlbCB0byBiZSBzaG93biBiZWZvcmUgdGhlIGFjdGlvbiBsaXN0LlxuICAgKi9cbiAgQGZvcmNlVHlwZSgpXG4gIEBwcm9wZXJ0eSh7IHJlZmxlY3Q6IHRydWUsIGNvbnZlcnRlcjogb21pdEVtcHR5Q29udmVydGVyIH0pXG4gIHB1YmxpYyBhY2Nlc3NvciBsYWJlbDogc3RyaW5nID0gJyc7XG5cbiAgcHJvdGVjdGVkIG92ZXJyaWRlIHdpbGxVcGRhdGUoY2hhbmdlZFByb3BlcnRpZXM6IFByb3BlcnR5VmFsdWVzPFdpdGhMaXN0Q2hpbGRyZW48dGhpcz4+KTogdm9pZCB7XG4gICAgc3VwZXIud2lsbFVwZGF0ZShjaGFuZ2VkUHJvcGVydGllcyk7XG5cbiAgICBpZiAoY2hhbmdlZFByb3BlcnRpZXMuaGFzKCdsaXN0Q2hpbGRyZW4nKSkge1xuICAgICAgdGhpcy5saXN0Q2hpbGRyZW4uZm9yRWFjaCgoYykgPT4gKGMuc2l6ZSA9ICdtJykpO1xuICAgIH1cbiAgfVxuXG4gIHByb3RlY3RlZCBvdmVycmlkZSByZW5kZXIoKTogVGVtcGxhdGVSZXN1bHQge1xuICAgIHJldHVybiBodG1sYFxuICAgICAgPHNwYW4gY2xhc3M9XCJzYmItbmF2aWdhdGlvbi1saXN0X19sYWJlbFwiIGlkPVwic2JiLW5hdmlnYXRpb24tbGluay1sYWJlbC1pZFwiPlxuICAgICAgICA8c2xvdCBuYW1lPVwibGFiZWxcIj4ke3RoaXMubGFiZWx9PC9zbG90PlxuICAgICAgPC9zcGFuPlxuICAgICAgJHt0aGlzLnJlbmRlckxpc3Qoe1xuICAgICAgICBjbGFzczogJ3NiYi1uYXZpZ2F0aW9uLWxpc3RfX2NvbnRlbnQnLFxuICAgICAgICBhcmlhTGFiZWxsZWRieTogJ3NiYi1uYXZpZ2F0aW9uLWxpbmstbGFiZWwtaWQnLFxuICAgICAgfSl9XG4gICAgYDtcbiAgfVxufVxuXG5kZWNsYXJlIGdsb2JhbCB7XG4gIGludGVyZmFjZSBIVE1MRWxlbWVudFRhZ05hbWVNYXAge1xuICAgIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBAdHlwZXNjcmlwdC1lc2xpbnQvbmFtaW5nLWNvbnZlbnRpb25cbiAgICAnc2JiLW5hdmlnYXRpb24tbGlzdCc6IFNiYk5hdmlnYXRpb25MaXN0RWxlbWVudDtcbiAgfVxufVxuIl0sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7Ozs7OztJQzRCYSxrQ0FBd0I7bUJBQVMsc0JBRzVDLFdBQVc7Ozs7Y0FIQSxpQ0FBaUMsWUFHakM7Ozt3QkFXVixXQUFXLEVBQ1gsU0FBUztJQUFFLFNBQVM7SUFBTSxXQUFXO0lBQW9CLENBQUMsQ0FBQTtBQUMzRCxnQkFBQSxNQUFBLE1BQUEsbUJBQUE7SUFBQSxNQUFBO0lBQUEsTUFBQTtJQUFBLFFBQUE7SUFBQSxTQUFBO0lBQUEsUUFBQTtLQUFBLE1BQUEsUUFBQSxXQUFBO0tBQUEsTUFBQSxRQUFBLElBQWdCO0tBQUssTUFBQSxLQUFBLFVBQUE7QUFBQSxVQUFMLFFBQUs7O0tBQUE7SUFBQSxVQUFBO0lBQUEsRUFBQSxxQkFBQSx5QkFBQTs7Ozs7Ozs7O0FBWlcsUUFBQSxjQUFzQjs7O0FBQy9CLFFBQUEsU0FBeUIsQ0FBQyxpQkFBaUIsVUFBVSx3QkFBTSxDQUFDOztFQVduRjs7OztFQUFBLElBQWdCLFFBQUs7QUFBQSxVQUFBLE1BQUE7O0VBQXJCLElBQWdCLE1BQUssT0FBQTtBQUFBLFNBQUEseUJBQUE7O0VBRUYsV0FBVyxtQkFBeUQ7QUFDckYsU0FBTSxXQUFXLGtCQUFrQjtBQUVuQyxPQUFJLGtCQUFrQixJQUFJLGVBQWUsQ0FDdkMsTUFBSyxhQUFhLFNBQVMsTUFBTyxFQUFFLE9BQU8sSUFBSzs7RUFJakMsU0FBTTtBQUN2QixVQUFPLElBQUk7OzZCQUVjLEtBQUssTUFBSzs7UUFFL0IsS0FBSyxXQUFXO0lBQ2hCLE9BQU87SUFDUCxnQkFBZ0I7SUFDakIsQ0FBQyxDQUFBOzs7OztBQTVCc0IsUUFBQSxzQkFBc0IsQ0FDaEQseUJBQ0Esc0JBQ0Q7QUFPZSxTQUFBLHlCQUFBLGtCQUFBLE1BQUEscUJBQWdCLEdBQUUifQ==