@sbb-esta/lyne-elements-dev 5.0.0-next.3-dev.1780495434 → 5.0.0-next.3-dev.1780500158

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 (38) hide show
  1. package/core/styles/mixins/_scrollbar.scss +6 -0
  2. package/core/styles/styles.js +1 -1
  3. package/core.js +1 -1
  4. package/custom-elements.json +10 -2
  5. package/development/core/styles/styles.js +1 -1
  6. package/development/core.js +1 -1
  7. package/development/header/header/header.component.d.ts +2 -0
  8. package/development/header/header/header.component.d.ts.map +1 -1
  9. package/development/header/header/header.component.js +1 -1
  10. package/development/header.component-FVw_5NRT.js +336 -0
  11. package/development/header.js +1 -1
  12. package/development/header.pure.js +1 -1
  13. package/development/map-container/map-container.component.d.ts +2 -2
  14. package/development/map-container/map-container.component.js +1 -1
  15. package/development/map-container.component-ASCfDs-R.js +176 -0
  16. package/development/map-container.js +1 -1
  17. package/development/map-container.pure.js +1 -1
  18. package/development/{styles-AtR8n_N4.js → styles-CUz7LBUc.js} +3 -3
  19. package/header/_header.global.scss +8 -1
  20. package/header/header/header.component.js +1 -1
  21. package/{header.component-DgWfgTse.js → header.component-BbdHh5fF.js} +1 -1
  22. package/header.js +1 -1
  23. package/header.pure.js +1 -1
  24. package/lean-off-brand-theme.css +7 -1
  25. package/lean-safety-theme.css +7 -1
  26. package/lean-theme.css +7 -1
  27. package/map-container/map-container.component.js +1 -1
  28. package/{map-container.component-bI8Gb4I8.js → map-container.component-C2_Miiv0.js} +1 -1
  29. package/map-container.js +1 -1
  30. package/map-container.pure.js +1 -1
  31. package/off-brand-theme.css +7 -1
  32. package/package.json +2 -2
  33. package/safety-theme.css +7 -1
  34. package/standard-theme.css +7 -1
  35. package/styles-BwvY_TyZ.js +5 -0
  36. package/development/header.component-B43X03Jg.js +0 -334
  37. package/development/map-container.component-N-e2oBnd.js +0 -176
  38. package/styles-Cx8wGnh9.js +0 -5
package/development/map-container.component-ASCfDs-R.js ADDED
@@ -0,0 +1,176 @@
1
+ import { __esDecorate, __runInitializers } from "tslib";
2
+ import { html, nothing, unsafeCSS } from "lit";
3
+ import { property, state } from "lit/decorators.js";
4
+ import { SbbElement, SbbLanguageController, forceType, forwardEvent, i18nMapContainerButtonLabel, scrollbarStyles } from "./core.js";
5
+ import { SbbAccentButtonElement } from "./button.pure.js";
6
+ import { IntersectionController } from "@lit-labs/observers/intersection-controller.js";
7
+ //#region src/elements/map-container/map-container.scss?inline
8
+ var map_container_default = ":host {\n --sbb-map-container-animation-duration: var(\n --sbb-disable-animation-duration,\n var(--sbb-animation-duration-4x)\n );\n --_sbb-map-container-map-height: calc(\n var(--sbb-map-container-map-height-zero) + var(--sbb-map-container-border-radius)\n );\n display: grid;\n grid-template-rows: auto auto;\n}\n@media (min-width: calc(37.5rem)) {\n :host {\n --_sbb-map-container-map-height: calc(\n var(--sbb-map-container-map-height-small) + var(--sbb-map-container-border-radius)\n );\n }\n}\n@media (min-width: calc(64rem)) {\n :host {\n grid-template-columns: max(var(--sbb-map-container-sidebar-width)) calc(100% - var(--sbb-map-container-sidebar-width));\n position: fixed;\n inset: var(--sbb-map-container-margin-start, var(--sbb-header-vertical-spacing)) 0 0 0;\n }\n}\n\n.sbb-map-container__sidebar-button {\n position: fixed;\n left: 50%;\n inset-block-end: var(--sbb-spacing-fixed-5x);\n visibility: hidden;\n opacity: 0;\n transform: translateX(-50%) translateY(calc(100% + var(--sbb-spacing-fixed-5x)));\n transition: opacity var(--sbb-map-container-animation-duration) var(--sbb-animation-easing), visibility var(--sbb-map-container-animation-duration) var(--sbb-animation-easing) var(--sbb-map-container-animation-duration), transform var(--sbb-map-container-animation-duration) var(--sbb-animation-easing);\n}\n:host(:is(:state(scroll-up-button-visible),[state--scroll-up-button-visible])) .sbb-map-container__sidebar-button {\n transition: visibility var(--sbb-map-container-animation-duration) var(--sbb-animation-easing), opacity var(--sbb-map-container-animation-duration) var(--sbb-animation-easing), transform var(--sbb-map-container-animation-duration) ease-out;\n visibility: visible;\n opacity: 1;\n transform: translateX(-50%) translateY(0);\n}\n@media (min-width: calc(64rem)) {\n .sbb-map-container__sidebar-button {\n display: none;\n }\n}\n\n.sbb-map-container__sidebar {\n grid-column: 1/3;\n grid-row: 2/3;\n width: 100%;\n overflow: hidden auto;\n position: relative;\n border-start-end-radius: var(--sbb-map-container-border-radius);\n border-start-start-radius: var(--sbb-map-container-border-radius);\n margin-block-start: calc(var(--sbb-map-container-border-radius) * -1);\n background-color: var(--sbb-map-container-sidebar-background-color);\n}\n@media (min-width: calc(64rem)) {\n .sbb-map-container__sidebar {\n grid-column: 1/2;\n grid-row: 1/3;\n border-radius: 0;\n margin-block-start: 0;\n border-block-start: var(--sbb-border-width-1x) solid var(--sbb-border-color-4-inverted);\n }\n}\n\n.sbb-map-container__map {\n position: sticky;\n inset-block-start: 0;\n inset-inline: 0;\n grid-row: 1/2;\n grid-column: 1/3;\n}\n@media (max-width: calc(63.9375rem)) {\n .sbb-map-container__map {\n inset-block-start: var(--sbb-map-container-mobile-sticky-block-start, 0);\n height: var(--_sbb-map-container-map-height);\n }\n}\n@media (min-width: calc(64rem)) {\n .sbb-map-container__map {\n grid-row: 1/3;\n grid-column: 2/3;\n position: relative;\n }\n}";
9
+ //#endregion
10
+ //#region src/elements/map-container/map-container.component.ts
11
+ /**
12
+ * It can be used as a container for maps.
13
+ *
14
+ * @slot - Use the unnamed slot to add content to the sidebar.
15
+ * @slot map - Used for slotting the map.
16
+ * @cssprop [--sbb-map-container-margin-start=var(--sbb-header-vertical-spacing)] - The component
17
+ * comes along with a height calculation that subtracts the height of the header.
18
+ * For specific use cases, this variable can be used to modify the preset height.
19
+ * @cssprop [--sbb-map-container-sidebar-width=zero-large:400px;ultra:480px] - Can be used
20
+ * to modify the width of the left sidebar.
21
+ * @cssprop [--sbb-map-container-mobile-sticky-block-start=0] - If e.g. a header with a fixed height
22
+ * is placed before the map-container, the map should be sticky respecting
23
+ * this offset from the document's top. Only applied on mobile views.
24
+ * Most commonly it can be set to `var(--sbb-header-vertical-spacing)`.
25
+ */
26
+ var SbbMapContainerElement = (() => {
27
+ let _classSuper = SbbElement;
28
+ let _hideScrollUpButton_decorators;
29
+ let _hideScrollUpButton_initializers = [];
30
+ let _hideScrollUpButton_extraInitializers = [];
31
+ let __scrollUpButtonVisible_decorators;
32
+ let __scrollUpButtonVisible_initializers = [];
33
+ let __scrollUpButtonVisible_extraInitializers = [];
34
+ return class SbbMapContainerElement extends _classSuper {
35
+ constructor() {
36
+ super(...arguments);
37
+ this.#hideScrollUpButton_accessor_storage = __runInitializers(this, _hideScrollUpButton_initializers, false);
38
+ this.#_scrollUpButtonVisible_accessor_storage = (__runInitializers(this, _hideScrollUpButton_extraInitializers), __runInitializers(this, __scrollUpButtonVisible_initializers, false));
39
+ this._language = (__runInitializers(this, __scrollUpButtonVisible_extraInitializers), new SbbLanguageController(this));
40
+ this._observer = new IntersectionController(this, {
41
+ target: null,
42
+ callback: (entries) => this._toggleButtonVisibilityOnIntersect(entries)
43
+ });
44
+ }
45
+ static {
46
+ const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
47
+ _hideScrollUpButton_decorators = [forceType(), property({
48
+ attribute: "hide-scroll-up-button",
49
+ reflect: true,
50
+ type: Boolean
51
+ })];
52
+ __scrollUpButtonVisible_decorators = [state()];
53
+ __esDecorate(this, null, _hideScrollUpButton_decorators, {
54
+ kind: "accessor",
55
+ name: "hideScrollUpButton",
56
+ static: false,
57
+ private: false,
58
+ access: {
59
+ has: (obj) => "hideScrollUpButton" in obj,
60
+ get: (obj) => obj.hideScrollUpButton,
61
+ set: (obj, value) => {
62
+ obj.hideScrollUpButton = value;
63
+ }
64
+ },
65
+ metadata: _metadata
66
+ }, _hideScrollUpButton_initializers, _hideScrollUpButton_extraInitializers);
67
+ __esDecorate(this, null, __scrollUpButtonVisible_decorators, {
68
+ kind: "accessor",
69
+ name: "_scrollUpButtonVisible",
70
+ static: false,
71
+ private: false,
72
+ access: {
73
+ has: (obj) => "_scrollUpButtonVisible" in obj,
74
+ get: (obj) => obj._scrollUpButtonVisible,
75
+ set: (obj, value) => {
76
+ obj._scrollUpButtonVisible = value;
77
+ }
78
+ },
79
+ metadata: _metadata
80
+ }, __scrollUpButtonVisible_initializers, __scrollUpButtonVisible_extraInitializers);
81
+ if (_metadata) Object.defineProperty(this, Symbol.metadata, {
82
+ enumerable: true,
83
+ configurable: true,
84
+ writable: true,
85
+ value: _metadata
86
+ });
87
+ }
88
+ static {
89
+ this.elementName = "sbb-map-container";
90
+ }
91
+ static {
92
+ this.elementDependencies = [SbbAccentButtonElement];
93
+ }
94
+ static {
95
+ this.styles = [scrollbarStyles, unsafeCSS(map_container_default)];
96
+ }
97
+ #hideScrollUpButton_accessor_storage;
98
+ /** Flag to show/hide the scroll up button inside the sidebar on mobile. */
99
+ get hideScrollUpButton() {
100
+ return this.#hideScrollUpButton_accessor_storage;
101
+ }
102
+ set hideScrollUpButton(value) {
103
+ this.#hideScrollUpButton_accessor_storage = value;
104
+ }
105
+ #_scrollUpButtonVisible_accessor_storage;
106
+ get _scrollUpButtonVisible() {
107
+ return this.#_scrollUpButtonVisible_accessor_storage;
108
+ }
109
+ set _scrollUpButtonVisible(value) {
110
+ this.#_scrollUpButtonVisible_accessor_storage = value;
111
+ }
112
+ willUpdate(changedProperties) {
113
+ super.willUpdate(changedProperties);
114
+ if (changedProperties.has("hideScrollUpButton")) {
115
+ const intersectorElement = this._intersector();
116
+ if (!this.hideScrollUpButton && intersectorElement) this._observer.observe(intersectorElement);
117
+ else if (intersectorElement) this._observer.unobserve(intersectorElement);
118
+ }
119
+ }
120
+ firstUpdated(changedProperties) {
121
+ super.firstUpdated(changedProperties);
122
+ if (!this.hideScrollUpButton) this._observer.observe(this._intersector());
123
+ }
124
+ _intersector() {
125
+ return this.shadowRoot?.querySelector("#intersector") ?? null;
126
+ }
127
+ /**
128
+ * Button click callback to trigger the scroll to container top
129
+ * @private
130
+ */
131
+ _onScrollButtonClick() {
132
+ this.scrollIntoView({ behavior: "smooth" });
133
+ }
134
+ /**
135
+ * Intersection callback. Toggles the visibility.
136
+ * @param entries
137
+ * @private
138
+ */
139
+ _toggleButtonVisibilityOnIntersect(entries) {
140
+ entries.forEach((entry) => {
141
+ const mapIsHidden = !entry.isIntersecting;
142
+ this.toggleState("scroll-up-button-visible", mapIsHidden);
143
+ this._scrollUpButtonVisible = mapIsHidden;
144
+ });
145
+ }
146
+ render() {
147
+ return html`
148
+ <div class="sbb-map-container__map">
149
+ <slot name="map"></slot>
150
+ </div>
151
+ <div
152
+ class="sbb-map-container__sidebar sbb-scrollbar-thick-track-visible"
153
+ @scroll=${(e) => forwardEvent(e, document)}
154
+ >
155
+ <span id="intersector"></span>
156
+
157
+ <slot></slot>
158
+
159
+ ${!this.hideScrollUpButton ? html`<sbb-accent-button
160
+ class="sbb-map-container__sidebar-button"
161
+ size="l"
162
+ icon-name="location-pin-map-small"
163
+ @click=${() => this._onScrollButtonClick()}
164
+ ?inert=${!this._scrollUpButtonVisible}
165
+ >
166
+ ${i18nMapContainerButtonLabel[this._language.current]}
167
+ </sbb-accent-button>` : nothing}
168
+ </div>
169
+ `;
170
+ }
171
+ };
172
+ })();
173
+ //#endregion
174
+ export { SbbMapContainerElement as t };
175
+
176
+ //# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibWFwLWNvbnRhaW5lci5jb21wb25lbnQtQVNDZkRzLVIuanMiLCJuYW1lcyI6W10sInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2VsZW1lbnRzL21hcC1jb250YWluZXIvbWFwLWNvbnRhaW5lci5zY3NzP2lubGluZSIsIi4uLy4uLy4uL3NyYy9lbGVtZW50cy9tYXAtY29udGFpbmVyL21hcC1jb250YWluZXIuY29tcG9uZW50LnRzIl0sInNvdXJjZXNDb250ZW50IjpbIkB1c2UgJy4uL2NvcmUvc3R5bGVzJyBhcyBzYmI7XG5cbjpob3N0IHtcbiAgLS1zYmItbWFwLWNvbnRhaW5lci1hbmltYXRpb24tZHVyYXRpb246IHZhcihcbiAgICAtLXNiYi1kaXNhYmxlLWFuaW1hdGlvbi1kdXJhdGlvbixcbiAgICB2YXIoLS1zYmItYW5pbWF0aW9uLWR1cmF0aW9uLTR4KVxuICApO1xuICAtLV9zYmItbWFwLWNvbnRhaW5lci1tYXAtaGVpZ2h0OiBjYWxjKFxuICAgIHZhcigtLXNiYi1tYXAtY29udGFpbmVyLW1hcC1oZWlnaHQtemVybykgKyB2YXIoLS1zYmItbWFwLWNvbnRhaW5lci1ib3JkZXItcmFkaXVzKVxuICApO1xuXG4gIGRpc3BsYXk6IGdyaWQ7XG4gIGdyaWQtdGVtcGxhdGUtcm93czogYXV0byBhdXRvO1xuXG4gIEBpbmNsdWRlIHNiYi5tcSgkZnJvbTogc21hbGwpIHtcbiAgICAtLV9zYmItbWFwLWNvbnRhaW5lci1tYXAtaGVpZ2h0OiBjYWxjKFxuICAgICAgdmFyKC0tc2JiLW1hcC1jb250YWluZXItbWFwLWhlaWdodC1zbWFsbCkgKyB2YXIoLS1zYmItbWFwLWNvbnRhaW5lci1ib3JkZXItcmFkaXVzKVxuICAgICk7XG4gIH1cblxuICBAaW5jbHVkZSBzYmIubXEoJGZyb206IGxhcmdlKSB7XG4gICAgZ3JpZC10ZW1wbGF0ZS1jb2x1bW5zOiBtYXgodmFyKC0tc2JiLW1hcC1jb250YWluZXItc2lkZWJhci13aWR0aCkpIGNhbGMoXG4gICAgICAgIDEwMCUgLSB2YXIoLS1zYmItbWFwLWNvbnRhaW5lci1zaWRlYmFyLXdpZHRoKVxuICAgICAgKTtcbiAgICBwb3NpdGlvbjogZml4ZWQ7XG4gICAgaW5zZXQ6IHZhcigtLXNiYi1tYXAtY29udGFpbmVyLW1hcmdpbi1zdGFydCwgdmFyKC0tc2JiLWhlYWRlci12ZXJ0aWNhbC1zcGFjaW5nKSkgMCAwIDA7XG4gIH1cbn1cblxuLnNiYi1tYXAtY29udGFpbmVyX19zaWRlYmFyLWJ1dHRvbiB7XG4gIHBvc2l0aW9uOiBmaXhlZDtcbiAgbGVmdDogNTAlO1xuICBpbnNldC1ibG9jay1lbmQ6IHZhcigtLXNiYi1zcGFjaW5nLWZpeGVkLTV4KTtcbiAgdmlzaWJpbGl0eTogaGlkZGVuO1xuICBvcGFjaXR5OiAwO1xuICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVgoLTUwJSkgdHJhbnNsYXRlWShjYWxjKDEwMCUgKyB2YXIoLS1zYmItc3BhY2luZy1maXhlZC01eCkpKTtcblxuICAvLyBIaWRlIHRyYW5zaXRpb24sIHZpc2liaWxpdHkgc2hvdWxkIGJlIGRlbGF5ZWRcbiAgdHJhbnNpdGlvbjpcbiAgICBvcGFjaXR5IHZhcigtLXNiYi1tYXAtY29udGFpbmVyLWFuaW1hdGlvbi1kdXJhdGlvbikgdmFyKC0tc2JiLWFuaW1hdGlvbi1lYXNpbmcpLFxuICAgIHZpc2liaWxpdHkgdmFyKC0tc2JiLW1hcC1jb250YWluZXItYW5pbWF0aW9uLWR1cmF0aW9uKSB2YXIoLS1zYmItYW5pbWF0aW9uLWVhc2luZylcbiAgICAgIHZhcigtLXNiYi1tYXAtY29udGFpbmVyLWFuaW1hdGlvbi1kdXJhdGlvbiksXG4gICAgdHJhbnNmb3JtIHZhcigtLXNiYi1tYXAtY29udGFpbmVyLWFuaW1hdGlvbi1kdXJhdGlvbikgdmFyKC0tc2JiLWFuaW1hdGlvbi1lYXNpbmcpO1xuXG4gIDpob3N0KDpzdGF0ZShzY3JvbGwtdXAtYnV0dG9uLXZpc2libGUpKSAmIHtcbiAgICAvLyBTaG93IHRyYW5zaXRpb25cbiAgICB0cmFuc2l0aW9uOlxuICAgICAgdmlzaWJpbGl0eSB2YXIoLS1zYmItbWFwLWNvbnRhaW5lci1hbmltYXRpb24tZHVyYXRpb24pIHZhcigtLXNiYi1hbmltYXRpb24tZWFzaW5nKSxcbiAgICAgIG9wYWNpdHkgdmFyKC0tc2JiLW1hcC1jb250YWluZXItYW5pbWF0aW9uLWR1cmF0aW9uKSB2YXIoLS1zYmItYW5pbWF0aW9uLWVhc2luZyksXG4gICAgICB0cmFuc2Zvcm0gdmFyKC0tc2JiLW1hcC1jb250YWluZXItYW5pbWF0aW9uLWR1cmF0aW9uKSBlYXNlLW91dDtcbiAgICB2aXNpYmlsaXR5OiB2aXNpYmxlO1xuICAgIG9wYWNpdHk6IDE7XG4gICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVYKC01MCUpIHRyYW5zbGF0ZVkoMCk7XG4gIH1cblxuICBAaW5jbHVkZSBzYmIubXEoJGZyb206IGxhcmdlKSB7XG4gICAgZGlzcGxheTogbm9uZTtcbiAgfVxufVxuXG4uc2JiLW1hcC1jb250YWluZXJfX3NpZGViYXIge1xuICBncmlkLWNvbHVtbjogMSAvIDM7XG4gIGdyaWQtcm93OiAyIC8gMztcbiAgd2lkdGg6IDEwMCU7XG4gIG92ZXJmbG93OiBoaWRkZW4gYXV0bztcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xuICBib3JkZXItc3RhcnQtZW5kLXJhZGl1czogdmFyKC0tc2JiLW1hcC1jb250YWluZXItYm9yZGVyLXJhZGl1cyk7XG4gIGJvcmRlci1zdGFydC1zdGFydC1yYWRpdXM6IHZhcigtLXNiYi1tYXAtY29udGFpbmVyLWJvcmRlci1yYWRpdXMpO1xuICBtYXJnaW4tYmxvY2stc3RhcnQ6IGNhbGModmFyKC0tc2JiLW1hcC1jb250YWluZXItYm9yZGVyLXJhZGl1cykgKiAtMSk7XG4gIGJhY2tncm91bmQtY29sb3I6IHZhcigtLXNiYi1tYXAtY29udGFpbmVyLXNpZGViYXItYmFja2dyb3VuZC1jb2xvcik7XG5cbiAgQGluY2x1ZGUgc2JiLm1xKCRmcm9tOiBsYXJnZSkge1xuICAgIGdyaWQtY29sdW1uOiAxIC8gMjtcbiAgICBncmlkLXJvdzogMSAvIDM7XG4gICAgYm9yZGVyLXJhZGl1czogMDtcbiAgICBtYXJnaW4tYmxvY2stc3RhcnQ6IDA7XG4gICAgYm9yZGVyLWJsb2NrLXN0YXJ0OiB2YXIoLS1zYmItYm9yZGVyLXdpZHRoLTF4KSBzb2xpZCB2YXIoLS1zYmItYm9yZGVyLWNvbG9yLTQtaW52ZXJ0ZWQpO1xuICB9XG59XG5cbi5zYmItbWFwLWNvbnRhaW5lcl9fbWFwIHtcbiAgcG9zaXRpb246IHN0aWNreTtcbiAgaW5zZXQtYmxvY2stc3RhcnQ6IDA7XG4gIGluc2V0LWlubGluZTogMDtcbiAgZ3JpZC1yb3c6IDEgLyAyO1xuICBncmlkLWNvbHVtbjogMSAvIDM7XG5cbiAgLy8gV2UgdXNlIFwidG86IGxhcmdlXCIgdG8gYXZvaWQgcmVzZXR0aW5nIHRoZSBzdHlsZXNcbiAgQGluY2x1ZGUgc2JiLm1xKCR0bzogbGFyZ2UpIHtcbiAgICBpbnNldC1ibG9jay1zdGFydDogdmFyKC0tc2JiLW1hcC1jb250YWluZXItbW9iaWxlLXN0aWNreS1ibG9jay1zdGFydCwgMCk7XG4gICAgaGVpZ2h0OiB2YXIoLS1fc2JiLW1hcC1jb250YWluZXItbWFwLWhlaWdodCk7XG4gIH1cblxuICBAaW5jbHVkZSBzYmIubXEoJGZyb206IGxhcmdlKSB7XG4gICAgZ3JpZC1yb3c6IDEgLyAzO1xuICAgIGdyaWQtY29sdW1uOiAyIC8gMztcbiAgICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIH1cbn1cbiIsImltcG9ydCB7IEludGVyc2VjdGlvbkNvbnRyb2xsZXIgfSBmcm9tICdAbGl0LWxhYnMvb2JzZXJ2ZXJzL2ludGVyc2VjdGlvbi1jb250cm9sbGVyLmpzJztcbmltcG9ydCB7XG4gIHR5cGUgQ1NTUmVzdWx0R3JvdXAsXG4gIGh0bWwsXG4gIG5vdGhpbmcsXG4gIHR5cGUgUHJvcGVydHlWYWx1ZXMsXG4gIHR5cGUgVGVtcGxhdGVSZXN1bHQsXG4gIHVuc2FmZUNTUyxcbn0gZnJvbSAnbGl0JztcbmltcG9ydCB7IHByb3BlcnR5LCBzdGF0ZSB9IGZyb20gJ2xpdC9kZWNvcmF0b3JzLmpzJztcblxuaW1wb3J0IHsgU2JiQWNjZW50QnV0dG9uRWxlbWVudCB9IGZyb20gJy4uL2J1dHRvbi5wdXJlLnRzJztcbmltcG9ydCB7XG4gIGZvcmNlVHlwZSxcbiAgZm9yd2FyZEV2ZW50LFxuICBpMThuTWFwQ29udGFpbmVyQnV0dG9uTGFiZWwsXG4gIFNiYkVsZW1lbnQsXG4gIHR5cGUgU2JiRWxlbWVudFR5cGUsXG4gIFNiYkxhbmd1YWdlQ29udHJvbGxlcixcbiAgc2Nyb2xsYmFyU3R5bGVzLFxufSBmcm9tICcuLi9jb3JlLnRzJztcblxuaW1wb3J0IHN0eWxlIGZyb20gJy4vbWFwLWNvbnRhaW5lci5zY3NzP2lubGluZSc7XG5cbi8qKlxuICogSXQgY2FuIGJlIHVzZWQgYXMgYSBjb250YWluZXIgZm9yIG1hcHMuXG4gKlxuICogQHNsb3QgLSBVc2UgdGhlIHVubmFtZWQgc2xvdCB0byBhZGQgY29udGVudCB0byB0aGUgc2lkZWJhci5cbiAqIEBzbG90IG1hcCAtIFVzZWQgZm9yIHNsb3R0aW5nIHRoZSBtYXAuXG4gKiBAY3NzcHJvcCBbLS1zYmItbWFwLWNvbnRhaW5lci1tYXJnaW4tc3RhcnQ9dmFyKC0tc2JiLWhlYWRlci12ZXJ0aWNhbC1zcGFjaW5nKV0gLSBUaGUgY29tcG9uZW50XG4gKiBjb21lcyBhbG9uZyB3aXRoIGEgaGVpZ2h0IGNhbGN1bGF0aW9uIHRoYXQgc3VidHJhY3RzIHRoZSBoZWlnaHQgb2YgdGhlIGhlYWRlci5cbiAqIEZvciBzcGVjaWZpYyB1c2UgY2FzZXMsIHRoaXMgdmFyaWFibGUgY2FuIGJlIHVzZWQgdG8gbW9kaWZ5IHRoZSBwcmVzZXQgaGVpZ2h0LlxuICogQGNzc3Byb3AgWy0tc2JiLW1hcC1jb250YWluZXItc2lkZWJhci13aWR0aD16ZXJvLWxhcmdlOjQwMHB4O3VsdHJhOjQ4MHB4XSAtIENhbiBiZSB1c2VkXG4gKiB0byBtb2RpZnkgdGhlIHdpZHRoIG9mIHRoZSBsZWZ0IHNpZGViYXIuXG4gKiBAY3NzcHJvcCBbLS1zYmItbWFwLWNvbnRhaW5lci1tb2JpbGUtc3RpY2t5LWJsb2NrLXN0YXJ0PTBdIC0gSWYgZS5nLiBhIGhlYWRlciB3aXRoIGEgZml4ZWQgaGVpZ2h0XG4gKiBpcyBwbGFjZWQgYmVmb3JlIHRoZSBtYXAtY29udGFpbmVyLCB0aGUgbWFwIHNob3VsZCBiZSBzdGlja3kgcmVzcGVjdGluZ1xuICogdGhpcyBvZmZzZXQgZnJvbSB0aGUgZG9jdW1lbnQncyB0b3AuIE9ubHkgYXBwbGllZCBvbiBtb2JpbGUgdmlld3MuXG4gKiBNb3N0IGNvbW1vbmx5IGl0IGNhbiBiZSBzZXQgdG8gYHZhcigtLXNiYi1oZWFkZXItdmVydGljYWwtc3BhY2luZylgLlxuICovXG5leHBvcnQgY2xhc3MgU2JiTWFwQ29udGFpbmVyRWxlbWVudCBleHRlbmRzIFNiYkVsZW1lbnQge1xuICBwdWJsaWMgc3RhdGljIG92ZXJyaWRlIHJlYWRvbmx5IGVsZW1lbnROYW1lOiBzdHJpbmcgPSAnc2JiLW1hcC1jb250YWluZXInO1xuICBwdWJsaWMgc3RhdGljIG92ZXJyaWRlIGVsZW1lbnREZXBlbmRlbmNpZXM6IFNiYkVsZW1lbnRUeXBlW10gPSBbU2JiQWNjZW50QnV0dG9uRWxlbWVudF07XG4gIHB1YmxpYyBzdGF0aWMgb3ZlcnJpZGUgc3R5bGVzOiBDU1NSZXN1bHRHcm91cCA9IFtzY3JvbGxiYXJTdHlsZXMsIHVuc2FmZUNTUyhzdHlsZSldO1xuXG4gIC8qKiBGbGFnIHRvIHNob3cvaGlkZSB0aGUgc2Nyb2xsIHVwIGJ1dHRvbiBpbnNpZGUgdGhlIHNpZGViYXIgb24gbW9iaWxlLiAqL1xuICBAZm9yY2VUeXBlKClcbiAgQHByb3BlcnR5KHsgYXR0cmlidXRlOiAnaGlkZS1zY3JvbGwtdXAtYnV0dG9uJywgcmVmbGVjdDogdHJ1ZSwgdHlwZTogQm9vbGVhbiB9KVxuICBwdWJsaWMgYWNjZXNzb3IgaGlkZVNjcm9sbFVwQnV0dG9uOiBib29sZWFuID0gZmFsc2U7XG5cbiAgQHN0YXRlKCkgcHJpdmF0ZSBhY2Nlc3NvciBfc2Nyb2xsVXBCdXR0b25WaXNpYmxlID0gZmFsc2U7XG5cbiAgcHJpdmF0ZSBfbGFuZ3VhZ2UgPSBuZXcgU2JiTGFuZ3VhZ2VDb250cm9sbGVyKHRoaXMpO1xuICBwcml2YXRlIF9vYnNlcnZlciA9IG5ldyBJbnRlcnNlY3Rpb25Db250cm9sbGVyKHRoaXMsIHtcbiAgICB0YXJnZXQ6IG51bGwsXG4gICAgY2FsbGJhY2s6IChlbnRyaWVzKSA9PiB0aGlzLl90b2dnbGVCdXR0b25WaXNpYmlsaXR5T25JbnRlcnNlY3QoZW50cmllcyksXG4gIH0pO1xuXG4gIHByb3RlY3RlZCBvdmVycmlkZSB3aWxsVXBkYXRlKGNoYW5nZWRQcm9wZXJ0aWVzOiBQcm9wZXJ0eVZhbHVlczx0aGlzPik6IHZvaWQge1xuICAgIHN1cGVyLndpbGxVcGRhdGUoY2hhbmdlZFByb3BlcnRpZXMpO1xuXG4gICAgaWYgKGNoYW5nZWRQcm9wZXJ0aWVzLmhhcygnaGlkZVNjcm9sbFVwQnV0dG9uJykpIHtcbiAgICAgIGNvbnN0IGludGVyc2VjdG9yRWxlbWVudCA9IHRoaXMuX2ludGVyc2VjdG9yKCk7XG5cbiAgICAgIGlmICghdGhpcy5oaWRlU2Nyb2xsVXBCdXR0b24gJiYgaW50ZXJzZWN0b3JFbGVtZW50KSB7XG4gICAgICAgIHRoaXMuX29ic2VydmVyLm9ic2VydmUoaW50ZXJzZWN0b3JFbGVtZW50KTtcbiAgICAgIH0gZWxzZSBpZiAoaW50ZXJzZWN0b3JFbGVtZW50KSB7XG4gICAgICAgIHRoaXMuX29ic2VydmVyLnVub2JzZXJ2ZShpbnRlcnNlY3RvckVsZW1lbnQpO1xuICAgICAgfVxuICAgIH1cbiAgfVxuXG4gIHByb3RlY3RlZCBvdmVycmlkZSBmaXJzdFVwZGF0ZWQoY2hhbmdlZFByb3BlcnRpZXM6IFByb3BlcnR5VmFsdWVzPHRoaXM+KTogdm9pZCB7XG4gICAgc3VwZXIuZmlyc3RVcGRhdGVkKGNoYW5nZWRQcm9wZXJ0aWVzKTtcbiAgICBpZiAoIXRoaXMuaGlkZVNjcm9sbFVwQnV0dG9uKSB7XG4gICAgICB0aGlzLl9vYnNlcnZlci5vYnNlcnZlKHRoaXMuX2ludGVyc2VjdG9yKCkhKTtcbiAgICB9XG4gIH1cblxuICBwcml2YXRlIF9pbnRlcnNlY3RvcigpOiBIVE1MRWxlbWVudCB8IG51bGwge1xuICAgIHJldHVybiB0aGlzLnNoYWRvd1Jvb3Q/LnF1ZXJ5U2VsZWN0b3IoJyNpbnRlcnNlY3RvcicpID8/IG51bGw7XG4gIH1cblxuICAvKipcbiAgICogQnV0dG9uIGNsaWNrIGNhbGxiYWNrIHRvIHRyaWdnZXIgdGhlIHNjcm9sbCB0byBjb250YWluZXIgdG9wXG4gICAqIEBwcml2YXRlXG4gICAqL1xuICBwcml2YXRlIF9vblNjcm9sbEJ1dHRvbkNsaWNrKCk6IHZvaWQge1xuICAgIHRoaXMuc2Nyb2xsSW50b1ZpZXcoeyBiZWhhdmlvcjogJ3Ntb290aCcgfSk7XG4gIH1cblxuICAvKipcbiAgICogSW50ZXJzZWN0aW9uIGNhbGxiYWNrLiBUb2dnbGVzIHRoZSB2aXNpYmlsaXR5LlxuICAgKiBAcGFyYW0gZW50cmllc1xuICAgKiBAcHJpdmF0ZVxuICAgKi9cbiAgcHJpdmF0ZSBfdG9nZ2xlQnV0dG9uVmlzaWJpbGl0eU9uSW50ZXJzZWN0KGVudHJpZXM6IEludGVyc2VjdGlvbk9ic2VydmVyRW50cnlbXSk6IHZvaWQge1xuICAgIGVudHJpZXMuZm9yRWFjaCgoZW50cnkpID0+IHtcbiAgICAgIGNvbnN0IG1hcElzSGlkZGVuID0gIWVudHJ5LmlzSW50ZXJzZWN0aW5nO1xuICAgICAgdGhpcy50b2dnbGVTdGF0ZSgnc2Nyb2xsLXVwLWJ1dHRvbi12aXNpYmxlJywgbWFwSXNIaWRkZW4pO1xuICAgICAgdGhpcy5fc2Nyb2xsVXBCdXR0b25WaXNpYmxlID0gbWFwSXNIaWRkZW47XG4gICAgfSk7XG4gIH1cblxuICBwcm90ZWN0ZWQgb3ZlcnJpZGUgcmVuZGVyKCk6IFRlbXBsYXRlUmVzdWx0IHtcbiAgICByZXR1cm4gaHRtbGBcbiAgICAgIDxkaXYgY2xhc3M9XCJzYmItbWFwLWNvbnRhaW5lcl9fbWFwXCI+XG4gICAgICAgIDxzbG90IG5hbWU9XCJtYXBcIj48L3Nsb3Q+XG4gICAgICA8L2Rpdj5cbiAgICAgIDxkaXZcbiAgICAgICAgY2xhc3M9XCJzYmItbWFwLWNvbnRhaW5lcl9fc2lkZWJhciBzYmItc2Nyb2xsYmFyLXRoaWNrLXRyYWNrLXZpc2libGVcIlxuICAgICAgICBAc2Nyb2xsPSR7KGU6IEV2ZW50KSA9PiBmb3J3YXJkRXZlbnQoZSwgZG9jdW1lbnQpfVxuICAgICAgPlxuICAgICAgICA8c3BhbiBpZD1cImludGVyc2VjdG9yXCI+PC9zcGFuPlxuXG4gICAgICAgIDxzbG90Pjwvc2xvdD5cblxuICAgICAgICAkeyF0aGlzLmhpZGVTY3JvbGxVcEJ1dHRvblxuICAgICAgICAgID8gaHRtbGA8c2JiLWFjY2VudC1idXR0b25cbiAgICAgICAgICAgICAgY2xhc3M9XCJzYmItbWFwLWNvbnRhaW5lcl9fc2lkZWJhci1idXR0b25cIlxuICAgICAgICAgICAgICBzaXplPVwibFwiXG4gICAgICAgICAgICAgIGljb24tbmFtZT1cImxvY2F0aW9uLXBpbi1tYXAtc21hbGxcIlxuICAgICAgICAgICAgICBAY2xpY2s9JHsoKSA9PiB0aGlzLl9vblNjcm9sbEJ1dHRvbkNsaWNrKCl9XG4gICAgICAgICAgICAgID9pbmVydD0keyF0aGlzLl9zY3JvbGxVcEJ1dHRvblZpc2libGV9XG4gICAgICAgICAgICA+XG4gICAgICAgICAgICAgICR7aTE4bk1hcENvbnRhaW5lckJ1dHRvbkxhYmVsW3RoaXMuX2xhbmd1YWdlLmN1cnJlbnRdfVxuICAgICAgICAgICAgPC9zYmItYWNjZW50LWJ1dHRvbj5gXG4gICAgICAgICAgOiBub3RoaW5nfVxuICAgICAgPC9kaXY+XG4gICAgYDtcbiAgfVxufVxuXG5kZWNsYXJlIGdsb2JhbCB7XG4gIGludGVyZmFjZSBIVE1MRWxlbWVudFRhZ05hbWVNYXAge1xuICAgIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBAdHlwZXNjcmlwdC1lc2xpbnQvbmFtaW5nLWNvbnZlbnRpb25cbiAgICAnc2JiLW1hcC1jb250YWluZXInOiBTYmJNYXBDb250YWluZXJFbGVtZW50O1xuICB9XG59XG4iXSwibWFwcGluZ3MiOiI7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7SUN1Q2EsZ0NBQXNCO21CQUFTOzs7Ozs7O2NBQS9CLCtCQUErQixZQUFVOzs7R0FRcEMsS0FBQSx1Q0FBQSxrQkFBQSxNQUFBLGtDQUE4QixLQUFLO0dBRXpCLEtBQUEsNENBQUEsa0JBQUEsTUFBQSxxQ0FBQSxHQUFBLGtCQUFBLE1BQUEsc0NBQXlCLEtBQUs7R0FFaEQsS0FBQSxhQUFTLGtCQUFBLE1BQUEseUNBQUEsR0FBRyxJQUFJLHNCQUFzQixJQUFJO0dBQzFDLEtBQUEsWUFBWSxJQUFJLHVCQUF1QixNQUFNO0lBQ25ELFFBQVE7SUFDUixXQUFXLFlBQVksS0FBSyxtQ0FBbUMsT0FBTztJQUN2RTtFQTJFSDs7O3FDQXJGRyxVQUFTLEdBQ1QsU0FBUztJQUFFLFdBQVc7SUFBeUIsU0FBUztJQUFNLE1BQU07R0FBTyxDQUFFLENBQUM7eUNBRzlFLE1BQUssQ0FBRTtHQUZSLGFBQUEsTUFBQSxNQUFBLGdDQUFBO0lBQUEsTUFBQTtJQUFBLE1BQUE7SUFBQSxRQUFBO0lBQUEsU0FBQTtJQUFBLFFBQUE7S0FBQSxNQUFBLFFBQUEsd0JBQUE7S0FBQSxNQUFBLFFBQUEsSUFBZ0I7S0FBa0IsTUFBQSxLQUFBLFVBQUE7TUFBQSxJQUFsQixxQkFBa0I7S0FBQTtJQUFBO0lBQUEsVUFBQTtHQUFBLEdBQUEsa0NBQUEscUNBQUE7R0FFekIsYUFBQSxNQUFBLE1BQUEsb0NBQUE7SUFBQSxNQUFBO0lBQUEsTUFBQTtJQUFBLFFBQUE7SUFBQSxTQUFBO0lBQUEsUUFBQTtLQUFBLE1BQUEsUUFBQSw0QkFBQTtLQUFBLE1BQUEsUUFBQSxJQUFpQjtLQUFzQixNQUFBLEtBQUEsVUFBQTtNQUFBLElBQXRCLHlCQUFzQjtLQUFBO0lBQUE7SUFBQSxVQUFBO0dBQUEsR0FBQSxzQ0FBQSx5Q0FBQTs7Ozs7Ozs7O0dBVGhCLEtBQUEsY0FBc0I7RUFBb0I7O0dBQ25ELEtBQUEsc0JBQXdDLENBQUMsc0JBQXNCO0VBQUU7O0dBQ2pFLEtBQUEsU0FBeUIsQ0FBQyxpQkFBaUIsVUFBVSxxQkFBSyxDQUFDO0VBQUU7RUFLcEY7O0VBQUEsSUFBZ0IscUJBQWtCO0dBQUEsT0FBQSxLQUFBO0VBQUE7RUFBbEMsSUFBZ0IsbUJBQWtCLE9BQUE7R0FBQSxLQUFBLHVDQUFBO0VBQUE7RUFFekI7RUFBQSxJQUFpQix5QkFBc0I7R0FBQSxPQUFBLEtBQUE7RUFBQTtFQUF2QyxJQUFpQix1QkFBc0IsT0FBQTtHQUFBLEtBQUEsMkNBQUE7RUFBQTtFQVE3QixXQUFXLG1CQUF1QztHQUNuRSxNQUFNLFdBQVcsaUJBQWlCO0dBRWxDLElBQUksa0JBQWtCLElBQUksb0JBQW9CLEdBQUc7SUFDL0MsTUFBTSxxQkFBcUIsS0FBSyxhQUFZO0lBRTVDLElBQUksQ0FBQyxLQUFLLHNCQUFzQixvQkFDOUIsS0FBSyxVQUFVLFFBQVEsa0JBQWtCO1NBQ3BDLElBQUksb0JBQ1QsS0FBSyxVQUFVLFVBQVUsa0JBQWtCO0dBRS9DO0VBQ0Y7RUFFbUIsYUFBYSxtQkFBdUM7R0FDckUsTUFBTSxhQUFhLGlCQUFpQjtHQUNwQyxJQUFJLENBQUMsS0FBSyxvQkFDUixLQUFLLFVBQVUsUUFBUSxLQUFLLGFBQVksQ0FBRztFQUUvQztFQUVRLGVBQVk7R0FDbEIsT0FBTyxLQUFLLFlBQVksY0FBYyxjQUFjLEtBQUs7RUFDM0Q7Ozs7O0VBTVEsdUJBQW9CO0dBQzFCLEtBQUssZUFBZSxFQUFFLFVBQVUsU0FBUSxDQUFFO0VBQzVDOzs7Ozs7RUFPUSxtQ0FBbUMsU0FBb0M7R0FDN0UsUUFBUSxTQUFTLFVBQVM7SUFDeEIsTUFBTSxjQUFjLENBQUMsTUFBTTtJQUMzQixLQUFLLFlBQVksNEJBQTRCLFdBQVc7SUFDeEQsS0FBSyx5QkFBeUI7R0FDaEMsQ0FBQztFQUNIO0VBRW1CLFNBQU07R0FDdkIsT0FBTyxJQUFJOzs7Ozs7bUJBTUksTUFBYSxhQUFhLEdBQUcsUUFBUSxFQUFBOzs7Ozs7VUFNOUMsQ0FBQyxLQUFLLHFCQUNKLElBQUk7Ozs7NkJBSWEsS0FBSyxxQkFBb0IsRUFBQTt1QkFDL0IsQ0FBQyxLQUFLLHVCQUFBOztnQkFFYiw0QkFBNEIsS0FBSyxVQUFVLFNBQUE7b0NBRS9DLFFBQUE7OztFQUdWIn0=
package/development/map-container.js CHANGED
@@ -1,4 +1,4 @@
1
- import { t as SbbMapContainerElement } from "./map-container.component-N-e2oBnd.js";
1
+ import { t as SbbMapContainerElement } from "./map-container.component-ASCfDs-R.js";
2
2
  import "./map-container.pure.js";
3
3
  //#region src/elements/map-container.ts
4
4
  /** @entrypoint */
package/development/map-container.pure.js CHANGED
@@ -1,2 +1,2 @@
1
- import { t as SbbMapContainerElement } from "./map-container.component-N-e2oBnd.js";
1
+ import { t as SbbMapContainerElement } from "./map-container.component-ASCfDs-R.js";
2
2
  export { SbbMapContainerElement };
package/development/{styles-AtR8n_N4.js → styles-CUz7LBUc.js} RENAMED
@@ -1,12 +1,12 @@
1
1
  import { unsafeCSS } from "lit";
2
2
  //#region src/elements/core/styles/features/scrollbar.scss?inline
3
- var scrollbar_default = ":is(.sbb-scrollbar,\n.sbb-scrollbar-negative,\n.sbb-scrollbar-thick,\n.sbb-scrollbar-thick-negative,\n.sbb-scrollbar-track-visible,\n.sbb-scrollbar-negative-track-visible,\n.sbb-scrollbar-thick-track-visible,\n.sbb-scrollbar-thick-negative-track-visible) {\n --sbb-scrollbar-width: var(--sbb-spacing-fixed-3x);\n --sbb-scrollbar-thumb-width: 0.125rem;\n --sbb-scrollbar-thumb-width-hover: 0.25rem;\n --sbb-scrollbar-width-firefox: thin;\n --sbb-scrollbar-color: color-mix(in srgb, var(--sbb-color-black) 30%, transparent);\n --sbb-scrollbar-color: light-dark(\n color-mix(in srgb, var(--sbb-color-black) 30%, transparent),\n color-mix(in srgb, var(--sbb-color-white) 30%, transparent)\n );\n --sbb-scrollbar-color-hover: color-mix(in srgb, var(--sbb-color-black) 60%, transparent);\n --sbb-scrollbar-color-hover: light-dark(\n color-mix(in srgb, var(--sbb-color-black) 60%, transparent),\n color-mix(in srgb, var(--sbb-color-white) 60%, transparent)\n );\n}\n:is(.sbb-scrollbar,\n.sbb-scrollbar-negative,\n.sbb-scrollbar-thick,\n.sbb-scrollbar-thick-negative,\n.sbb-scrollbar-track-visible,\n.sbb-scrollbar-negative-track-visible,\n.sbb-scrollbar-thick-track-visible,\n.sbb-scrollbar-thick-negative-track-visible)::-webkit-scrollbar {\n width: var(--sbb-scrollbar-width);\n height: var(--sbb-scrollbar-width);\n background-color: var(--sbb-scrollbar-track-color, transparent);\n}\n:is(.sbb-scrollbar,\n.sbb-scrollbar-negative,\n.sbb-scrollbar-thick,\n.sbb-scrollbar-thick-negative,\n.sbb-scrollbar-track-visible,\n.sbb-scrollbar-negative-track-visible,\n.sbb-scrollbar-thick-track-visible,\n.sbb-scrollbar-thick-negative-track-visible)::-webkit-scrollbar-corner {\n background-color: var(--sbb-scrollbar-track-color, transparent);\n}\n:is(.sbb-scrollbar,\n.sbb-scrollbar-negative,\n.sbb-scrollbar-thick,\n.sbb-scrollbar-thick-negative,\n.sbb-scrollbar-track-visible,\n.sbb-scrollbar-negative-track-visible,\n.sbb-scrollbar-thick-track-visible,\n.sbb-scrollbar-thick-negative-track-visible)::-webkit-scrollbar-thumb {\n background-color: var(--sbb-scrollbar-color, currentcolor);\n border: calc(0.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width))) solid transparent;\n border-radius: var(--sbb-border-radius-4x);\n background-clip: padding-box;\n}\n:is(.sbb-scrollbar,\n.sbb-scrollbar-negative,\n.sbb-scrollbar-thick,\n.sbb-scrollbar-thick-negative,\n.sbb-scrollbar-track-visible,\n.sbb-scrollbar-negative-track-visible,\n.sbb-scrollbar-thick-track-visible,\n.sbb-scrollbar-thick-negative-track-visible)::-webkit-scrollbar-thumb:hover {\n background-color: var(--sbb-scrollbar-color-hover, currentcolor);\n border-width: calc(0.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width-hover)));\n}\n:is(.sbb-scrollbar,\n.sbb-scrollbar-negative,\n.sbb-scrollbar-thick,\n.sbb-scrollbar-thick-negative,\n.sbb-scrollbar-track-visible,\n.sbb-scrollbar-negative-track-visible,\n.sbb-scrollbar-thick-track-visible,\n.sbb-scrollbar-thick-negative-track-visible)::-webkit-scrollbar-button, :is(.sbb-scrollbar,\n.sbb-scrollbar-negative,\n.sbb-scrollbar-thick,\n.sbb-scrollbar-thick-negative,\n.sbb-scrollbar-track-visible,\n.sbb-scrollbar-negative-track-visible,\n.sbb-scrollbar-thick-track-visible,\n.sbb-scrollbar-thick-negative-track-visible)::-webkit-scrollbar-corner {\n display: none;\n}\n@supports not selector(::-webkit-scrollbar) {\n :is(.sbb-scrollbar,\n .sbb-scrollbar-negative,\n .sbb-scrollbar-thick,\n .sbb-scrollbar-thick-negative,\n .sbb-scrollbar-track-visible,\n .sbb-scrollbar-negative-track-visible,\n .sbb-scrollbar-thick-track-visible,\n .sbb-scrollbar-thick-negative-track-visible) {\n scrollbar-width: var(--sbb-scrollbar-width-firefox);\n scrollbar-color: var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent);\n }\n}\n\n:is(.sbb-scrollbar-negative,\n.sbb-scrollbar-thick-negative,\n.sbb-scrollbar-negative-track-visible,\n.sbb-scrollbar-thick-negative-track-visible) {\n --sbb-scrollbar-color: color-mix(in srgb, var(--sbb-color-white) 30%, transparent);\n --sbb-scrollbar-color-hover: color-mix(in srgb, var(--sbb-color-white) 60%, transparent);\n}\n\n:is(.sbb-scrollbar-thick-negative,\n.sbb-scrollbar-thick,\n.sbb-scrollbar-thick-track-visible,\n.sbb-scrollbar-thick-negative-track-visible) {\n --sbb-scrollbar-thumb-width: 0.5rem;\n --sbb-scrollbar-thumb-width-hover: var(--sbb-scrollbar-thumb-width);\n --sbb-scrollbar-width-firefox: auto;\n}\n\n:is(.sbb-scrollbar-track-visible, .sbb-scrollbar-thick-track-visible) {\n --sbb-scrollbar-track-color: var(--sbb-background-color-4);\n}\n\n:is(.sbb-scrollbar-negative-track-visible, .sbb-scrollbar-thick-negative-track-visible) {\n --sbb-scrollbar-track-color: var(--sbb-background-color-4-negative);\n}";
3
+ var scrollbar_default = ":is(.sbb-scrollbar,\n.sbb-scrollbar-negative,\n.sbb-scrollbar-thick,\n.sbb-scrollbar-thick-negative,\n.sbb-scrollbar-track-visible,\n.sbb-scrollbar-negative-track-visible,\n.sbb-scrollbar-thick-track-visible,\n.sbb-scrollbar-thick-negative-track-visible) {\n --sbb-scrollbar-width: var(--sbb-spacing-fixed-3x);\n --sbb-scrollbar-thumb-width: 0.125rem;\n --sbb-scrollbar-thumb-width-hover: 0.25rem;\n --sbb-scrollbar-width-firefox: thin;\n --sbb-scrollbar-color: color-mix(in srgb, var(--sbb-color-black) 30%, transparent);\n --sbb-scrollbar-color: light-dark(\n color-mix(in srgb, var(--sbb-color-black) 30%, transparent),\n color-mix(in srgb, var(--sbb-color-white) 30%, transparent)\n );\n --sbb-scrollbar-color-hover: color-mix(in srgb, var(--sbb-color-black) 60%, transparent);\n --sbb-scrollbar-color-hover: light-dark(\n color-mix(in srgb, var(--sbb-color-black) 60%, transparent),\n color-mix(in srgb, var(--sbb-color-white) 60%, transparent)\n );\n --sbb-scrollbar-track-color: transparent;\n}\n:is(.sbb-scrollbar,\n.sbb-scrollbar-negative,\n.sbb-scrollbar-thick,\n.sbb-scrollbar-thick-negative,\n.sbb-scrollbar-track-visible,\n.sbb-scrollbar-negative-track-visible,\n.sbb-scrollbar-thick-track-visible,\n.sbb-scrollbar-thick-negative-track-visible)::-webkit-scrollbar {\n width: var(--sbb-scrollbar-width);\n height: var(--sbb-scrollbar-width);\n background-color: var(--sbb-scrollbar-track-color, transparent);\n}\n:is(.sbb-scrollbar,\n.sbb-scrollbar-negative,\n.sbb-scrollbar-thick,\n.sbb-scrollbar-thick-negative,\n.sbb-scrollbar-track-visible,\n.sbb-scrollbar-negative-track-visible,\n.sbb-scrollbar-thick-track-visible,\n.sbb-scrollbar-thick-negative-track-visible)::-webkit-scrollbar-corner {\n background-color: var(--sbb-scrollbar-track-color, transparent);\n}\n:is(.sbb-scrollbar,\n.sbb-scrollbar-negative,\n.sbb-scrollbar-thick,\n.sbb-scrollbar-thick-negative,\n.sbb-scrollbar-track-visible,\n.sbb-scrollbar-negative-track-visible,\n.sbb-scrollbar-thick-track-visible,\n.sbb-scrollbar-thick-negative-track-visible)::-webkit-scrollbar-thumb {\n background-color: var(--sbb-scrollbar-color, currentcolor);\n border: calc(0.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width))) solid transparent;\n border-radius: var(--sbb-border-radius-4x);\n background-clip: padding-box;\n}\n:is(.sbb-scrollbar,\n.sbb-scrollbar-negative,\n.sbb-scrollbar-thick,\n.sbb-scrollbar-thick-negative,\n.sbb-scrollbar-track-visible,\n.sbb-scrollbar-negative-track-visible,\n.sbb-scrollbar-thick-track-visible,\n.sbb-scrollbar-thick-negative-track-visible)::-webkit-scrollbar-thumb:hover {\n background-color: var(--sbb-scrollbar-color-hover, currentcolor);\n border-width: calc(0.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width-hover)));\n}\n:is(.sbb-scrollbar,\n.sbb-scrollbar-negative,\n.sbb-scrollbar-thick,\n.sbb-scrollbar-thick-negative,\n.sbb-scrollbar-track-visible,\n.sbb-scrollbar-negative-track-visible,\n.sbb-scrollbar-thick-track-visible,\n.sbb-scrollbar-thick-negative-track-visible)::-webkit-scrollbar-button, :is(.sbb-scrollbar,\n.sbb-scrollbar-negative,\n.sbb-scrollbar-thick,\n.sbb-scrollbar-thick-negative,\n.sbb-scrollbar-track-visible,\n.sbb-scrollbar-negative-track-visible,\n.sbb-scrollbar-thick-track-visible,\n.sbb-scrollbar-thick-negative-track-visible)::-webkit-scrollbar-corner {\n display: none;\n}\n@supports not selector(::-webkit-scrollbar) {\n :is(.sbb-scrollbar,\n .sbb-scrollbar-negative,\n .sbb-scrollbar-thick,\n .sbb-scrollbar-thick-negative,\n .sbb-scrollbar-track-visible,\n .sbb-scrollbar-negative-track-visible,\n .sbb-scrollbar-thick-track-visible,\n .sbb-scrollbar-thick-negative-track-visible) {\n scrollbar-width: var(--sbb-scrollbar-width-firefox);\n scrollbar-color: var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent);\n }\n}\n\n:is(.sbb-scrollbar-negative,\n.sbb-scrollbar-thick-negative,\n.sbb-scrollbar-negative-track-visible,\n.sbb-scrollbar-thick-negative-track-visible) {\n --sbb-scrollbar-color: color-mix(in srgb, var(--sbb-color-white) 30%, transparent);\n --sbb-scrollbar-color-hover: color-mix(in srgb, var(--sbb-color-white) 60%, transparent);\n}\n\n:is(.sbb-scrollbar-thick-negative,\n.sbb-scrollbar-thick,\n.sbb-scrollbar-thick-track-visible,\n.sbb-scrollbar-thick-negative-track-visible) {\n --sbb-scrollbar-thumb-width: 0.5rem;\n --sbb-scrollbar-thumb-width-hover: var(--sbb-scrollbar-thumb-width);\n --sbb-scrollbar-width-firefox: auto;\n}\n\n:is(.sbb-scrollbar-track-visible, .sbb-scrollbar-thick-track-visible) {\n --sbb-scrollbar-track-color: var(--sbb-background-color-4);\n}\n\n:is(.sbb-scrollbar-negative-track-visible, .sbb-scrollbar-thick-negative-track-visible) {\n --sbb-scrollbar-track-color: var(--sbb-background-color-4-negative);\n}";
4
4
  //#endregion
5
5
  //#region src/elements/core/styles/internals/button-reset.scss?inline
6
6
  var button_reset_default = "button {\n appearance: none;\n box-sizing: border-box;\n margin: 0;\n outline: none;\n border: none;\n border-radius: 0;\n padding: 0;\n background: none;\n -webkit-tap-highlight-color: transparent;\n color: inherit;\n}";
7
7
  //#endregion
8
8
  //#region src/elements/core/styles/internals/host-scrollbar.scss?inline
9
- var host_scrollbar_default = ":host {\n --sbb-scrollbar-width: var(--sbb-spacing-fixed-3x);\n --sbb-scrollbar-thumb-width: 0.125rem;\n --sbb-scrollbar-thumb-width-hover: 0.25rem;\n --sbb-scrollbar-width-firefox: thin;\n --sbb-scrollbar-color: color-mix(in srgb, var(--sbb-color-black) 30%, transparent);\n --sbb-scrollbar-color: light-dark(\n color-mix(in srgb, var(--sbb-color-black) 30%, transparent),\n color-mix(in srgb, var(--sbb-color-white) 30%, transparent)\n );\n --sbb-scrollbar-color-hover: color-mix(in srgb, var(--sbb-color-black) 60%, transparent);\n --sbb-scrollbar-color-hover: light-dark(\n color-mix(in srgb, var(--sbb-color-black) 60%, transparent),\n color-mix(in srgb, var(--sbb-color-white) 60%, transparent)\n );\n}\n:host::-webkit-scrollbar {\n width: var(--sbb-scrollbar-width);\n height: var(--sbb-scrollbar-width);\n background-color: var(--sbb-scrollbar-track-color, transparent);\n}\n:host::-webkit-scrollbar-corner {\n background-color: var(--sbb-scrollbar-track-color, transparent);\n}\n:host::-webkit-scrollbar-thumb {\n background-color: var(--sbb-scrollbar-color, currentcolor);\n border: calc(0.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width))) solid transparent;\n border-radius: var(--sbb-border-radius-4x);\n background-clip: padding-box;\n}\n:host::-webkit-scrollbar-thumb:hover {\n background-color: var(--sbb-scrollbar-color-hover, currentcolor);\n border-width: calc(0.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width-hover)));\n}\n:host::-webkit-scrollbar-button, :host::-webkit-scrollbar-corner {\n display: none;\n}\n@supports not selector(::-webkit-scrollbar) {\n :host {\n scrollbar-width: var(--sbb-scrollbar-width-firefox);\n scrollbar-color: var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent);\n }\n}";
9
+ var host_scrollbar_default = ":host {\n --sbb-scrollbar-width: var(--sbb-spacing-fixed-3x);\n --sbb-scrollbar-thumb-width: 0.125rem;\n --sbb-scrollbar-thumb-width-hover: 0.25rem;\n --sbb-scrollbar-width-firefox: thin;\n --sbb-scrollbar-color: color-mix(in srgb, var(--sbb-color-black) 30%, transparent);\n --sbb-scrollbar-color: light-dark(\n color-mix(in srgb, var(--sbb-color-black) 30%, transparent),\n color-mix(in srgb, var(--sbb-color-white) 30%, transparent)\n );\n --sbb-scrollbar-color-hover: color-mix(in srgb, var(--sbb-color-black) 60%, transparent);\n --sbb-scrollbar-color-hover: light-dark(\n color-mix(in srgb, var(--sbb-color-black) 60%, transparent),\n color-mix(in srgb, var(--sbb-color-white) 60%, transparent)\n );\n --sbb-scrollbar-track-color: transparent;\n}\n:host::-webkit-scrollbar {\n width: var(--sbb-scrollbar-width);\n height: var(--sbb-scrollbar-width);\n background-color: var(--sbb-scrollbar-track-color, transparent);\n}\n:host::-webkit-scrollbar-corner {\n background-color: var(--sbb-scrollbar-track-color, transparent);\n}\n:host::-webkit-scrollbar-thumb {\n background-color: var(--sbb-scrollbar-color, currentcolor);\n border: calc(0.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width))) solid transparent;\n border-radius: var(--sbb-border-radius-4x);\n background-clip: padding-box;\n}\n:host::-webkit-scrollbar-thumb:hover {\n background-color: var(--sbb-scrollbar-color-hover, currentcolor);\n border-width: calc(0.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width-hover)));\n}\n:host::-webkit-scrollbar-button, :host::-webkit-scrollbar-corner {\n display: none;\n}\n@supports not selector(::-webkit-scrollbar) {\n :host {\n scrollbar-width: var(--sbb-scrollbar-width-firefox);\n scrollbar-color: var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent);\n }\n}";
10
10
  //#endregion
11
11
  //#region src/elements/core/styles/internals/list-reset.scss?inline
12
12
  var list_reset_default = "ul,\nol {\n list-style: none;\n margin: 0;\n padding: 0;\n font-size: inherit;\n}";
@@ -27,4 +27,4 @@ var scrollbarStyles = unsafeCSS(scrollbar_default);
27
27
  //#endregion
28
28
  export { screenReaderOnlyStyles as a, popoverResetStyles as i, hostScrollbarStyles as n, scrollbarStyles as o, listResetStyles as r, buttonResetStyles as t };
29
29
 
30
- //# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3R5bGVzLUF0UjhuX040LmpzIiwibmFtZXMiOltdLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9lbGVtZW50cy9jb3JlL3N0eWxlcy9mZWF0dXJlcy9zY3JvbGxiYXIuc2Nzcz9pbmxpbmUiLCIuLi8uLi8uLi9zcmMvZWxlbWVudHMvY29yZS9zdHlsZXMvaW50ZXJuYWxzL2J1dHRvbi1yZXNldC5zY3NzP2lubGluZSIsIi4uLy4uLy4uL3NyYy9lbGVtZW50cy9jb3JlL3N0eWxlcy9pbnRlcm5hbHMvaG9zdC1zY3JvbGxiYXIuc2Nzcz9pbmxpbmUiLCIuLi8uLi8uLi9zcmMvZWxlbWVudHMvY29yZS9zdHlsZXMvaW50ZXJuYWxzL2xpc3QtcmVzZXQuc2Nzcz9pbmxpbmUiLCIuLi8uLi8uLi9zcmMvZWxlbWVudHMvY29yZS9zdHlsZXMvaW50ZXJuYWxzL3BvcG92ZXItcmVzZXQuc2Nzcz9pbmxpbmUiLCIuLi8uLi8uLi9zcmMvZWxlbWVudHMvY29yZS9zdHlsZXMvaW50ZXJuYWxzL3NjcmVlbi1yZWFkZXItb25seS5zY3NzP2lubGluZSIsIi4uLy4uLy4uL3NyYy9lbGVtZW50cy9jb3JlL3N0eWxlcy9zdHlsZXMudHMiXSwic291cmNlc0NvbnRlbnQiOlsiQHVzZSAnLi4vbWl4aW5zL3Njcm9sbGJhcic7XG5cbjppcyhcbiAgLnNiYi1zY3JvbGxiYXIsXG4gIC5zYmItc2Nyb2xsYmFyLW5lZ2F0aXZlLFxuICAuc2JiLXNjcm9sbGJhci10aGljayxcbiAgLnNiYi1zY3JvbGxiYXItdGhpY2stbmVnYXRpdmUsXG4gIC5zYmItc2Nyb2xsYmFyLXRyYWNrLXZpc2libGUsXG4gIC5zYmItc2Nyb2xsYmFyLW5lZ2F0aXZlLXRyYWNrLXZpc2libGUsXG4gIC5zYmItc2Nyb2xsYmFyLXRoaWNrLXRyYWNrLXZpc2libGUsXG4gIC5zYmItc2Nyb2xsYmFyLXRoaWNrLW5lZ2F0aXZlLXRyYWNrLXZpc2libGVcbikge1xuICBAaW5jbHVkZSBzY3JvbGxiYXIuc2Nyb2xsYmFyLXZhcmlhYmxlcztcbiAgQGluY2x1ZGUgc2Nyb2xsYmFyLnNjcm9sbGJhci1ydWxlcztcbn1cblxuOmlzKFxuICAuc2JiLXNjcm9sbGJhci1uZWdhdGl2ZSxcbiAgLnNiYi1zY3JvbGxiYXItdGhpY2stbmVnYXRpdmUsXG4gIC5zYmItc2Nyb2xsYmFyLW5lZ2F0aXZlLXRyYWNrLXZpc2libGUsXG4gIC5zYmItc2Nyb2xsYmFyLXRoaWNrLW5lZ2F0aXZlLXRyYWNrLXZpc2libGVcbikge1xuICBAaW5jbHVkZSBzY3JvbGxiYXIuc2Nyb2xsYmFyLXZhcmlhYmxlcy0tY29sb3ItbmVnYXRpdmU7XG59XG5cbjppcyhcbiAgLnNiYi1zY3JvbGxiYXItdGhpY2stbmVnYXRpdmUsXG4gIC5zYmItc2Nyb2xsYmFyLXRoaWNrLFxuICAuc2JiLXNjcm9sbGJhci10aGljay10cmFjay12aXNpYmxlLFxuICAuc2JiLXNjcm9sbGJhci10aGljay1uZWdhdGl2ZS10cmFjay12aXNpYmxlXG4pIHtcbiAgQGluY2x1ZGUgc2Nyb2xsYmFyLnNjcm9sbGJhci12YXJpYWJsZXMtLXNpemUtdGhpY2s7XG59XG5cbjppcyguc2JiLXNjcm9sbGJhci10cmFjay12aXNpYmxlLCAuc2JiLXNjcm9sbGJhci10aGljay10cmFjay12aXNpYmxlKSB7XG4gIEBpbmNsdWRlIHNjcm9sbGJhci5zY3JvbGxiYXItdmFyaWFibGVzLS1jb2xvci1wb3NpdGl2ZS10cmFjay12aXNpYmxlO1xufVxuXG46aXMoLnNiYi1zY3JvbGxiYXItbmVnYXRpdmUtdHJhY2stdmlzaWJsZSwgLnNiYi1zY3JvbGxiYXItdGhpY2stbmVnYXRpdmUtdHJhY2stdmlzaWJsZSkge1xuICBAaW5jbHVkZSBzY3JvbGxiYXIuc2Nyb2xsYmFyLXZhcmlhYmxlcy0tY29sb3ItbmVnYXRpdmUtdHJhY2stdmlzaWJsZTtcbn1cbiIsIkB1c2UgJy4uL21peGlucy9yZXNldCc7XG5cbmJ1dHRvbiB7XG4gIEBpbmNsdWRlIHJlc2V0LmJ1dHRvbi1yZXNldDtcbn1cbiIsIkB1c2UgJy4uL21peGlucy9zY3JvbGxiYXInO1xuXG46aG9zdCB7XG4gIEBpbmNsdWRlIHNjcm9sbGJhci5zY3JvbGxiYXItdmFyaWFibGVzO1xuICBAaW5jbHVkZSBzY3JvbGxiYXIuc2Nyb2xsYmFyLXJ1bGVzO1xufVxuIiwiQHVzZSAnLi4vbWl4aW5zL3Jlc2V0JztcblxudWwsXG5vbCB7XG4gIEBpbmNsdWRlIHJlc2V0Lmxpc3QtcmVzZXQ7XG59XG4iLCJAdXNlICcuLi9taXhpbnMvcmVzZXQnO1xuXG46aG9zdCg6d2hlcmUoW3BvcG92ZXJdKSksXG4uc2JiLXBvcG92ZXItcmVzZXQ6d2hlcmUoW3BvcG92ZXJdKSB7XG4gIEBpbmNsdWRlIHJlc2V0LnBvcG92ZXItcmVzZXQ7XG59XG4iLCJAdXNlICcuLi9taXhpbnMvYTExeSc7XG5cbi5zYmItc2NyZWVuLXJlYWRlci1vbmx5IHtcbiAgQGluY2x1ZGUgYTExeS5zY3JlZW4tcmVhZGVyLW9ubHk7XG59XG4iLCJpbXBvcnQgeyB1bnNhZmVDU1MgfSBmcm9tICdsaXQnO1xuXG5pbXBvcnQgc2Nyb2xsYmFyU3R5bGVzU3RyaW5nIGZyb20gJy4vZmVhdHVyZXMvc2Nyb2xsYmFyLnNjc3M/aW5saW5lJztcbmltcG9ydCBidXR0b25SZXNldFN0eWxlc1N0cmluZyBmcm9tICcuL2ludGVybmFscy9idXR0b24tcmVzZXQuc2Nzcz9pbmxpbmUnO1xuaW1wb3J0IGhvc3RTY3JvbGxiYXJTdHlsZXNTdHJpbmcgZnJvbSAnLi9pbnRlcm5hbHMvaG9zdC1zY3JvbGxiYXIuc2Nzcz9pbmxpbmUnO1xuaW1wb3J0IGxpc3RSZXNldFN0eWxlc1N0cmluZyBmcm9tICcuL2ludGVybmFscy9saXN0LXJlc2V0LnNjc3M/aW5saW5lJztcbmltcG9ydCBwb3BvdmVyUmVzZXRTdHlsZXNTdHJpbmcgZnJvbSAnLi9pbnRlcm5hbHMvcG9wb3Zlci1yZXNldC5zY3NzP2lubGluZSc7XG5pbXBvcnQgc2NyZWVuUmVhZGVyT25seVN0eWxlc1N0cmluZyBmcm9tICcuL2ludGVybmFscy9zY3JlZW4tcmVhZGVyLW9ubHkuc2Nzcz9pbmxpbmUnO1xuXG5leHBvcnQgY29uc3QgYnV0dG9uUmVzZXRTdHlsZXMgPSB1bnNhZmVDU1MoYnV0dG9uUmVzZXRTdHlsZXNTdHJpbmcpO1xuZXhwb3J0IGNvbnN0IGhvc3RTY3JvbGxiYXJTdHlsZXMgPSB1bnNhZmVDU1MoaG9zdFNjcm9sbGJhclN0eWxlc1N0cmluZyk7XG5leHBvcnQgY29uc3QgbGlzdFJlc2V0U3R5bGVzID0gdW5zYWZlQ1NTKGxpc3RSZXNldFN0eWxlc1N0cmluZyk7XG5leHBvcnQgY29uc3Qgc2NyZWVuUmVhZGVyT25seVN0eWxlcyA9IHVuc2FmZUNTUyhzY3JlZW5SZWFkZXJPbmx5U3R5bGVzU3RyaW5nKTtcbmV4cG9ydCBjb25zdCBwb3BvdmVyUmVzZXRTdHlsZXMgPSB1bnNhZmVDU1MocG9wb3ZlclJlc2V0U3R5bGVzU3RyaW5nKTtcbmV4cG9ydCBjb25zdCBzY3JvbGxiYXJTdHlsZXMgPSB1bnNhZmVDU1Moc2Nyb2xsYmFyU3R5bGVzU3RyaW5nKTtcbiJdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7QU1TQSxJQUFhLG9CQUFvQixVQUFVLG9CQUF1QjtBQUNsRSxJQUFhLHNCQUFzQixVQUFVLHNCQUF5QjtBQUN0RSxJQUFhLGtCQUFrQixVQUFVLGtCQUFxQjtBQUM5RCxJQUFhLHlCQUF5QixVQUFVLDBCQUE0QjtBQUM1RSxJQUFhLHFCQUFxQixVQUFVLHFCQUF3QjtBQUNwRSxJQUFhLGtCQUFrQixVQUFVLGlCQUFxQiJ9
30
+ //# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3R5bGVzLUNVejdMQlVjLmpzIiwibmFtZXMiOltdLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9lbGVtZW50cy9jb3JlL3N0eWxlcy9mZWF0dXJlcy9zY3JvbGxiYXIuc2Nzcz9pbmxpbmUiLCIuLi8uLi8uLi9zcmMvZWxlbWVudHMvY29yZS9zdHlsZXMvaW50ZXJuYWxzL2J1dHRvbi1yZXNldC5zY3NzP2lubGluZSIsIi4uLy4uLy4uL3NyYy9lbGVtZW50cy9jb3JlL3N0eWxlcy9pbnRlcm5hbHMvaG9zdC1zY3JvbGxiYXIuc2Nzcz9pbmxpbmUiLCIuLi8uLi8uLi9zcmMvZWxlbWVudHMvY29yZS9zdHlsZXMvaW50ZXJuYWxzL2xpc3QtcmVzZXQuc2Nzcz9pbmxpbmUiLCIuLi8uLi8uLi9zcmMvZWxlbWVudHMvY29yZS9zdHlsZXMvaW50ZXJuYWxzL3BvcG92ZXItcmVzZXQuc2Nzcz9pbmxpbmUiLCIuLi8uLi8uLi9zcmMvZWxlbWVudHMvY29yZS9zdHlsZXMvaW50ZXJuYWxzL3NjcmVlbi1yZWFkZXItb25seS5zY3NzP2lubGluZSIsIi4uLy4uLy4uL3NyYy9lbGVtZW50cy9jb3JlL3N0eWxlcy9zdHlsZXMudHMiXSwic291cmNlc0NvbnRlbnQiOlsiQHVzZSAnLi4vbWl4aW5zL3Njcm9sbGJhcic7XG5cbjppcyhcbiAgLnNiYi1zY3JvbGxiYXIsXG4gIC5zYmItc2Nyb2xsYmFyLW5lZ2F0aXZlLFxuICAuc2JiLXNjcm9sbGJhci10aGljayxcbiAgLnNiYi1zY3JvbGxiYXItdGhpY2stbmVnYXRpdmUsXG4gIC5zYmItc2Nyb2xsYmFyLXRyYWNrLXZpc2libGUsXG4gIC5zYmItc2Nyb2xsYmFyLW5lZ2F0aXZlLXRyYWNrLXZpc2libGUsXG4gIC5zYmItc2Nyb2xsYmFyLXRoaWNrLXRyYWNrLXZpc2libGUsXG4gIC5zYmItc2Nyb2xsYmFyLXRoaWNrLW5lZ2F0aXZlLXRyYWNrLXZpc2libGVcbikge1xuICBAaW5jbHVkZSBzY3JvbGxiYXIuc2Nyb2xsYmFyLXZhcmlhYmxlcztcbiAgQGluY2x1ZGUgc2Nyb2xsYmFyLnNjcm9sbGJhci1ydWxlcztcbn1cblxuOmlzKFxuICAuc2JiLXNjcm9sbGJhci1uZWdhdGl2ZSxcbiAgLnNiYi1zY3JvbGxiYXItdGhpY2stbmVnYXRpdmUsXG4gIC5zYmItc2Nyb2xsYmFyLW5lZ2F0aXZlLXRyYWNrLXZpc2libGUsXG4gIC5zYmItc2Nyb2xsYmFyLXRoaWNrLW5lZ2F0aXZlLXRyYWNrLXZpc2libGVcbikge1xuICBAaW5jbHVkZSBzY3JvbGxiYXIuc2Nyb2xsYmFyLXZhcmlhYmxlcy0tY29sb3ItbmVnYXRpdmU7XG59XG5cbjppcyhcbiAgLnNiYi1zY3JvbGxiYXItdGhpY2stbmVnYXRpdmUsXG4gIC5zYmItc2Nyb2xsYmFyLXRoaWNrLFxuICAuc2JiLXNjcm9sbGJhci10aGljay10cmFjay12aXNpYmxlLFxuICAuc2JiLXNjcm9sbGJhci10aGljay1uZWdhdGl2ZS10cmFjay12aXNpYmxlXG4pIHtcbiAgQGluY2x1ZGUgc2Nyb2xsYmFyLnNjcm9sbGJhci12YXJpYWJsZXMtLXNpemUtdGhpY2s7XG59XG5cbjppcyguc2JiLXNjcm9sbGJhci10cmFjay12aXNpYmxlLCAuc2JiLXNjcm9sbGJhci10aGljay10cmFjay12aXNpYmxlKSB7XG4gIEBpbmNsdWRlIHNjcm9sbGJhci5zY3JvbGxiYXItdmFyaWFibGVzLS1jb2xvci1wb3NpdGl2ZS10cmFjay12aXNpYmxlO1xufVxuXG46aXMoLnNiYi1zY3JvbGxiYXItbmVnYXRpdmUtdHJhY2stdmlzaWJsZSwgLnNiYi1zY3JvbGxiYXItdGhpY2stbmVnYXRpdmUtdHJhY2stdmlzaWJsZSkge1xuICBAaW5jbHVkZSBzY3JvbGxiYXIuc2Nyb2xsYmFyLXZhcmlhYmxlcy0tY29sb3ItbmVnYXRpdmUtdHJhY2stdmlzaWJsZTtcbn1cbiIsIkB1c2UgJy4uL21peGlucy9yZXNldCc7XG5cbmJ1dHRvbiB7XG4gIEBpbmNsdWRlIHJlc2V0LmJ1dHRvbi1yZXNldDtcbn1cbiIsIkB1c2UgJy4uL21peGlucy9zY3JvbGxiYXInO1xuXG46aG9zdCB7XG4gIEBpbmNsdWRlIHNjcm9sbGJhci5zY3JvbGxiYXItdmFyaWFibGVzO1xuICBAaW5jbHVkZSBzY3JvbGxiYXIuc2Nyb2xsYmFyLXJ1bGVzO1xufVxuIiwiQHVzZSAnLi4vbWl4aW5zL3Jlc2V0JztcblxudWwsXG5vbCB7XG4gIEBpbmNsdWRlIHJlc2V0Lmxpc3QtcmVzZXQ7XG59XG4iLCJAdXNlICcuLi9taXhpbnMvcmVzZXQnO1xuXG46aG9zdCg6d2hlcmUoW3BvcG92ZXJdKSksXG4uc2JiLXBvcG92ZXItcmVzZXQ6d2hlcmUoW3BvcG92ZXJdKSB7XG4gIEBpbmNsdWRlIHJlc2V0LnBvcG92ZXItcmVzZXQ7XG59XG4iLCJAdXNlICcuLi9taXhpbnMvYTExeSc7XG5cbi5zYmItc2NyZWVuLXJlYWRlci1vbmx5IHtcbiAgQGluY2x1ZGUgYTExeS5zY3JlZW4tcmVhZGVyLW9ubHk7XG59XG4iLCJpbXBvcnQgeyB1bnNhZmVDU1MgfSBmcm9tICdsaXQnO1xuXG5pbXBvcnQgc2Nyb2xsYmFyU3R5bGVzU3RyaW5nIGZyb20gJy4vZmVhdHVyZXMvc2Nyb2xsYmFyLnNjc3M/aW5saW5lJztcbmltcG9ydCBidXR0b25SZXNldFN0eWxlc1N0cmluZyBmcm9tICcuL2ludGVybmFscy9idXR0b24tcmVzZXQuc2Nzcz9pbmxpbmUnO1xuaW1wb3J0IGhvc3RTY3JvbGxiYXJTdHlsZXNTdHJpbmcgZnJvbSAnLi9pbnRlcm5hbHMvaG9zdC1zY3JvbGxiYXIuc2Nzcz9pbmxpbmUnO1xuaW1wb3J0IGxpc3RSZXNldFN0eWxlc1N0cmluZyBmcm9tICcuL2ludGVybmFscy9saXN0LXJlc2V0LnNjc3M/aW5saW5lJztcbmltcG9ydCBwb3BvdmVyUmVzZXRTdHlsZXNTdHJpbmcgZnJvbSAnLi9pbnRlcm5hbHMvcG9wb3Zlci1yZXNldC5zY3NzP2lubGluZSc7XG5pbXBvcnQgc2NyZWVuUmVhZGVyT25seVN0eWxlc1N0cmluZyBmcm9tICcuL2ludGVybmFscy9zY3JlZW4tcmVhZGVyLW9ubHkuc2Nzcz9pbmxpbmUnO1xuXG5leHBvcnQgY29uc3QgYnV0dG9uUmVzZXRTdHlsZXMgPSB1bnNhZmVDU1MoYnV0dG9uUmVzZXRTdHlsZXNTdHJpbmcpO1xuZXhwb3J0IGNvbnN0IGhvc3RTY3JvbGxiYXJTdHlsZXMgPSB1bnNhZmVDU1MoaG9zdFNjcm9sbGJhclN0eWxlc1N0cmluZyk7XG5leHBvcnQgY29uc3QgbGlzdFJlc2V0U3R5bGVzID0gdW5zYWZlQ1NTKGxpc3RSZXNldFN0eWxlc1N0cmluZyk7XG5leHBvcnQgY29uc3Qgc2NyZWVuUmVhZGVyT25seVN0eWxlcyA9IHVuc2FmZUNTUyhzY3JlZW5SZWFkZXJPbmx5U3R5bGVzU3RyaW5nKTtcbmV4cG9ydCBjb25zdCBwb3BvdmVyUmVzZXRTdHlsZXMgPSB1bnNhZmVDU1MocG9wb3ZlclJlc2V0U3R5bGVzU3RyaW5nKTtcbmV4cG9ydCBjb25zdCBzY3JvbGxiYXJTdHlsZXMgPSB1bnNhZmVDU1Moc2Nyb2xsYmFyU3R5bGVzU3RyaW5nKTtcbiJdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7QU1TQSxJQUFhLG9CQUFvQixVQUFVLG9CQUF1QjtBQUNsRSxJQUFhLHNCQUFzQixVQUFVLHNCQUF5QjtBQUN0RSxJQUFhLGtCQUFrQixVQUFVLGtCQUFxQjtBQUM5RCxJQUFhLHlCQUF5QixVQUFVLDBCQUE0QjtBQUM1RSxJQUFhLHFCQUFxQixVQUFVLHFCQUF3QjtBQUNwRSxJQUFhLGtCQUFrQixVQUFVLGlCQUFxQiJ9
package/header/_header.global.scss CHANGED
@@ -34,6 +34,13 @@ $theme: 'standard' !default;
34
34
  --sbb-header-box-shadow: var(--sbb-box-shadow-level-9-soft);
35
35
  --sbb-header-inset-inline-end: 0;
36
36
  --sbb-header-position: fixed;
37
+ --sbb-header-padding-block-start: env(safe-area-inset-top, 0);
38
+
39
+ // If --sbb-header-padding-block-start is not defined globally, it is not applied here.
40
+ // We accept this limitation, as overriding this padding is an extremely rare use case.
41
+ --sbb-header-vertical-spacing: calc(
42
+ var(--sbb-header-height) + var(--sbb-header-padding-block-start)
43
+ );
37
44
  --sbb-header-height-s: #{sbb.px-to-rem-build(52)};
38
45
  --sbb-header-height-m: var(--sbb-spacing-fixed-14x);
39
46
  --sbb-header-height: #{sbb.theme-pattern-select(
@@ -79,7 +86,7 @@ $theme: 'standard' !default;
79
86
 
80
87
  // Move container below header
81
88
  sbb-header + :where(sbb-sidebar-container, sbb-icon-sidebar-container) {
82
- margin-block-start: var(--sbb-header-height);
89
+ margin-block-start: var(--sbb-header-vertical-spacing);
83
90
  }
84
91
 
85
92
  // Helper class for the application name and version in sbb-header.
package/header/header/header.component.js CHANGED
@@ -1,2 +1,2 @@
1
- import { t as e } from "../../header.component-DgWfgTse.js";
1
+ import { t as e } from "../../header.component-BbdHh5fF.js";
2
2
  export { e as SbbHeaderElement };
package/{header.component-DgWfgTse.js → header.component-BbdHh5fF.js} RENAMED
@@ -3,7 +3,7 @@ import { html as n, isServer as r, unsafeCSS as i } from "lit";
3
3
  import { property as a, state as o } from "lit/decorators.js";
4
4
  import { SbbElement as s, SbbFocusVisibleWithinController as c, forceType as l, idReference as u, queueDomContentLoaded as d } from "./core.js";
5
5
  //#region src/elements/header/header/header.scss?inline
6
- var f = ":host{--sbb-logo-height: 1rem;--sbb-signet-height: 1rem;--sbb-header-transition-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-6x) )}@media(min-width:64rem){:host{--sbb-logo-height: 1.25rem;--sbb-signet-height: 1.25rem}}:host{display:block;height:var(--sbb-header-height);line-height:var(--sbb-typo-line-height-text)}:host([size=s]){--sbb-header-height: var(--sbb-header-height-s)}:host([size=m]){--sbb-header-height: var(--sbb-header-height-m)}:host([hide-on-scroll]){--sbb-header-position: absolute}:host([hide-on-scroll]:is(:state(fixed),[state--fixed])){--sbb-header-position: fixed;--sbb-header-animation-name: hide;--sbb-header-transform: translate3d(0, -100%, 0);--sbb-header-inset-inline-end: var(--sbb-scrollbar-width, 0)}:host([hide-on-scroll]:is(:state(fixed),[state--fixed]):is(:state(animated),[state--animated])){--sbb-header-transition-timing: cubic-bezier(.4, 0, 1, 1)}:host([hide-on-scroll]:is(:state(fixed),[state--fixed]):is(:state(visible),[state--visible])){--sbb-header-animation-name: show;--sbb-header-transform: translate3d(0, 0, 0);--sbb-header-transition-timing: cubic-bezier(0, 0, .2, 1)}:host([hide-on-scroll]:is(:state(fixed),[state--fixed]):is(:state(has-visible-focus-within),[state--has-visible-focus-within])){--sbb-header-transition-duration: 0;--sbb-header-transform: translate3d(0, 0, 0)}.sbb-header{position:var(--sbb-header-position);inset:0 var(--sbb-header-inset-inline-end) auto 0;background:var(--sbb-header-background);z-index:var(--sbb-header-z-index, 10);transform:var(--sbb-header-transform);transition-property:box-shadow;transition-duration:var(--sbb-header-transition-duration);transition-timing-function:var(--sbb-header-transition-timing);animation-name:var(--sbb-header-animation-name);animation-duration:var(--sbb-header-transition-duration);animation-timing-function:var(--sbb-header-transition-timing)}:host(:is(:is(:state(shadow),[state--shadow]),:is(:state(has-visible-focus-within),[state--has-visible-focus-within]):is(:state(fixed),[state--fixed]))) .sbb-header{box-shadow:var(--sbb-header-box-shadow)}@media(forced-colors:active){.sbb-header{border-block-end:var(--sbb-border-width-1x) solid CanvasText}}.sbb-header__wrapper{display:flex;align-items:center;justify-content:flex-start;height:var(--sbb-header-height)}:host(:not([expanded])) .sbb-header__wrapper{padding-inline:var(--sbb-page-spacing-padding, var(--sbb-layout-base-offset-responsive));margin-inline:auto;width:100%}@media(min-width:90rem){:host(:not([expanded])) .sbb-header__wrapper{max-width:var(--sbb-spacing-max-width, calc(var(--sbb-layout-base-page-max-width) + 2 * var(--sbb-layout-base-offset-responsive)))}}:host([expanded]) .sbb-header__wrapper{padding-inline:var(--sbb-page-spacing-padding, var(--sbb-spacing-responsive-xxs))}::slotted(:is(sbb-header-button,sbb-header-link):first-child){margin-inline-start:var(--sbb-header-first-item-margin-inline-start)}::slotted(*){flex:0 0 auto}::slotted(.sbb-header-shrinkable){flex-shrink:1;min-width:0}::slotted(.sbb-header-spacer){flex-grow:1}::slotted(.sbb-header-logo){margin-inline-start:var(--sbb-spacing-responsive-s)}::slotted(a.sbb-header-logo){display:block;padding-block:var(--sbb-spacing-fixed-3x);position:relative;outline:none!important}::slotted(a.sbb-header-logo):before{content:\"\";display:block;position:absolute;inset:var(--sbb-spacing-fixed-3x) 0}::slotted(a.sbb-header-logo:focus-visible):before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);outline-offset:var(--sbb-spacing-fixed-3x);border-radius:1px}@keyframes show{0%{transform:translate3d(0,-100%,0)}to{transform:translateZ(0)}}@keyframes hide{0%{transform:translateZ(0)}to{transform:translate3d(0,-100%,0)}}", p = "[aria-controls][aria-expanded='true']", m = (() => {
6
+ var f = ":host{--sbb-logo-height: 1rem;--sbb-signet-height: 1rem;--sbb-header-transition-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-6x) )}@media(min-width:64rem){:host{--sbb-logo-height: 1.25rem;--sbb-signet-height: 1.25rem}}:host{display:block;height:var(--sbb-header-height);line-height:var(--sbb-typo-line-height-text);padding-block-start:calc(var(--sbb-header-height) + var(--sbb-header-padding-block-start))}:host([size=s]){--sbb-header-height: var(--sbb-header-height-s)}:host([size=m]){--sbb-header-height: var(--sbb-header-height-m)}:host([hide-on-scroll]){--sbb-header-position: absolute}:host([hide-on-scroll]:is(:state(fixed),[state--fixed])){--sbb-header-position: fixed;--sbb-header-animation-name: hide;--sbb-header-transform: translate3d(0, -100%, 0);--sbb-header-inset-inline-end: var(--sbb-scrollbar-width, 0)}:host([hide-on-scroll]:is(:state(fixed),[state--fixed]):is(:state(animated),[state--animated])){--sbb-header-transition-timing: cubic-bezier(.4, 0, 1, 1)}:host([hide-on-scroll]:is(:state(fixed),[state--fixed]):is(:state(visible),[state--visible])){--sbb-header-animation-name: show;--sbb-header-transform: translate3d(0, 0, 0);--sbb-header-transition-timing: cubic-bezier(0, 0, .2, 1)}:host([hide-on-scroll]:is(:state(fixed),[state--fixed]):is(:state(has-visible-focus-within),[state--has-visible-focus-within])){--sbb-header-transition-duration: 0;--sbb-header-transform: translate3d(0, 0, 0)}.sbb-header{position:var(--sbb-header-position);inset:0 var(--sbb-header-inset-inline-end) auto 0;padding-block-start:var(--sbb-header-padding-block-start);background:var(--sbb-header-background);z-index:var(--sbb-header-z-index, 10);transform:var(--sbb-header-transform);transition-property:box-shadow;transition-duration:var(--sbb-header-transition-duration);transition-timing-function:var(--sbb-header-transition-timing);animation-name:var(--sbb-header-animation-name);animation-duration:var(--sbb-header-transition-duration);animation-timing-function:var(--sbb-header-transition-timing)}:host(:is(:is(:state(shadow),[state--shadow]),:is(:state(has-visible-focus-within),[state--has-visible-focus-within]):is(:state(fixed),[state--fixed]))) .sbb-header{box-shadow:var(--sbb-header-box-shadow)}@media(forced-colors:active){.sbb-header{border-block-end:var(--sbb-border-width-1x) solid CanvasText}}.sbb-header__wrapper{display:flex;align-items:center;justify-content:flex-start;height:var(--sbb-header-height)}:host(:not([expanded])) .sbb-header__wrapper{padding-inline:var(--sbb-page-spacing-padding, var(--sbb-layout-base-offset-responsive));margin-inline:auto;width:100%}@media(min-width:90rem){:host(:not([expanded])) .sbb-header__wrapper{max-width:var(--sbb-spacing-max-width, calc(var(--sbb-layout-base-page-max-width) + 2 * var(--sbb-layout-base-offset-responsive)))}}:host([expanded]) .sbb-header__wrapper{padding-inline:var(--sbb-page-spacing-padding, var(--sbb-spacing-responsive-xxs))}::slotted(:is(sbb-header-button,sbb-header-link):first-child){margin-inline-start:var(--sbb-header-first-item-margin-inline-start)}::slotted(*){flex:0 0 auto}::slotted(.sbb-header-shrinkable){flex-shrink:1;min-width:0}::slotted(.sbb-header-spacer){flex-grow:1}::slotted(.sbb-header-logo){margin-inline-start:var(--sbb-spacing-responsive-s)}::slotted(a.sbb-header-logo){display:block;padding-block:var(--sbb-spacing-fixed-3x);position:relative;outline:none!important}::slotted(a.sbb-header-logo):before{content:\"\";display:block;position:absolute;inset:var(--sbb-spacing-fixed-3x) 0}::slotted(a.sbb-header-logo:focus-visible):before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);outline-offset:var(--sbb-spacing-fixed-3x);border-radius:1px}@keyframes show{0%{transform:translate3d(0,-100%,0)}to{transform:translateZ(0)}}@keyframes hide{0%{transform:translateZ(0)}to{transform:translate3d(0,-100%,0)}}", p = "[aria-controls][aria-expanded='true']", m = (() => {
7
7
  let m = s, h, g = [], _ = [], v, y = [], b = [], x, S = [], C = [], w, T = [], E = [], D, O = [], k = [];
8
8
  return class s extends m {
9
9
  static {
package/header.js CHANGED
@@ -2,7 +2,7 @@ import { t as e } from "./header-action-common-B5M7_3Q1.js";
2
2
  import { SbbHeaderButtonElement as t } from "./header/header-button/header-button.component.js";
3
3
  import { t as n } from "./header-environment.component-Diy44YpD.js";
4
4
  import { SbbHeaderLinkElement as r } from "./header/header-link/header-link.component.js";
5
- import { t as i } from "./header.component-DgWfgTse.js";
5
+ import { t as i } from "./header.component-BbdHh5fF.js";
6
6
  import "./header.pure.js";
7
7
  i.define(), t.define(), n.define(), r.define();
8
8
  //#endregion
package/header.pure.js CHANGED
@@ -2,5 +2,5 @@ import { t as e } from "./header-action-common-B5M7_3Q1.js";
2
2
  import { SbbHeaderButtonElement as t } from "./header/header-button/header-button.component.js";
3
3
  import { t as n } from "./header-environment.component-Diy44YpD.js";
4
4
  import { SbbHeaderLinkElement as r } from "./header/header-link/header-link.component.js";
5
- import { t as i } from "./header.component-DgWfgTse.js";
5
+ import { t as i } from "./header.component-BbdHh5fF.js";
6
6
  export { e as SbbHeaderActionCommonElementMixin, t as SbbHeaderButtonElement, i as SbbHeaderElement, n as SbbHeaderEnvironmentElement, r as SbbHeaderLinkElement };
package/lean-off-brand-theme.css CHANGED
@@ -1405,6 +1405,10 @@ summary {
1405
1405
  --sbb-header-box-shadow: var(--sbb-box-shadow-level-9-soft);
1406
1406
  --sbb-header-inset-inline-end: 0;
1407
1407
  --sbb-header-position: fixed;
1408
+ --sbb-header-padding-block-start: env(safe-area-inset-top, 0);
1409
+ --sbb-header-vertical-spacing: calc(
1410
+ var(--sbb-header-height) + var(--sbb-header-padding-block-start)
1411
+ );
1408
1412
  --sbb-header-height-s: 3.25rem;
1409
1413
  --sbb-header-height-m: var(--sbb-spacing-fixed-14x);
1410
1414
  --sbb-header-height: var(--sbb-header-height-s);
@@ -2357,6 +2361,7 @@ sbb-flip-card-summary > [slot=image] :is(sbb-image, img):not(.sbb-figure-overlap
2357
2361
  color-mix(in srgb, var(--sbb-color-black) 60%, transparent),
2358
2362
  color-mix(in srgb, var(--sbb-color-white) 60%, transparent)
2359
2363
  );
2364
+ --sbb-scrollbar-track-color: transparent;
2360
2365
  }
2361
2366
  :is(sbb-form-field, sbb-timetable-form-field) :where(textarea)::-webkit-scrollbar {
2362
2367
  width: var(--sbb-scrollbar-width);
@@ -2455,7 +2460,7 @@ sbb-flip-card-summary > [slot=image] :is(sbb-image, img):not(.sbb-figure-overlap
2455
2460
  }
2456
2461
 
2457
2462
  sbb-header + :where(sbb-sidebar-container, sbb-icon-sidebar-container) {
2458
- margin-block-start: var(--sbb-header-height);
2463
+ margin-block-start: var(--sbb-header-vertical-spacing);
2459
2464
  }
2460
2465
 
2461
2466
  .sbb-header-info {
@@ -3328,6 +3333,7 @@ sbb-toggle:has(:focus-visible) {
3328
3333
  color-mix(in srgb, var(--sbb-color-black) 60%, transparent),
3329
3334
  color-mix(in srgb, var(--sbb-color-white) 60%, transparent)
3330
3335
  );
3336
+ --sbb-scrollbar-track-color: transparent;
3331
3337
  }
3332
3338
 
3333
3339
  :is(.sbb-scrollbar,
package/lean-safety-theme.css CHANGED
@@ -1405,6 +1405,10 @@ summary {
1405
1405
  --sbb-header-box-shadow: var(--sbb-box-shadow-level-9-soft);
1406
1406
  --sbb-header-inset-inline-end: 0;
1407
1407
  --sbb-header-position: fixed;
1408
+ --sbb-header-padding-block-start: env(safe-area-inset-top, 0);
1409
+ --sbb-header-vertical-spacing: calc(
1410
+ var(--sbb-header-height) + var(--sbb-header-padding-block-start)
1411
+ );
1408
1412
  --sbb-header-height-s: 3.25rem;
1409
1413
  --sbb-header-height-m: var(--sbb-spacing-fixed-14x);
1410
1414
  --sbb-header-height: var(--sbb-header-height-s);
@@ -2357,6 +2361,7 @@ sbb-flip-card-summary > [slot=image] :is(sbb-image, img):not(.sbb-figure-overlap
2357
2361
  color-mix(in srgb, var(--sbb-color-black) 60%, transparent),
2358
2362
  color-mix(in srgb, var(--sbb-color-white) 60%, transparent)
2359
2363
  );
2364
+ --sbb-scrollbar-track-color: transparent;
2360
2365
  }
2361
2366
  :is(sbb-form-field, sbb-timetable-form-field) :where(textarea)::-webkit-scrollbar {
2362
2367
  width: var(--sbb-scrollbar-width);
@@ -2455,7 +2460,7 @@ sbb-flip-card-summary > [slot=image] :is(sbb-image, img):not(.sbb-figure-overlap
2455
2460
  }
2456
2461
 
2457
2462
  sbb-header + :where(sbb-sidebar-container, sbb-icon-sidebar-container) {
2458
- margin-block-start: var(--sbb-header-height);
2463
+ margin-block-start: var(--sbb-header-vertical-spacing);
2459
2464
  }
2460
2465
 
2461
2466
  .sbb-header-info {
@@ -3328,6 +3333,7 @@ sbb-toggle:has(:focus-visible) {
3328
3333
  color-mix(in srgb, var(--sbb-color-black) 60%, transparent),
3329
3334
  color-mix(in srgb, var(--sbb-color-white) 60%, transparent)
3330
3335
  );
3336
+ --sbb-scrollbar-track-color: transparent;
3331
3337
  }
3332
3338
 
3333
3339
  :is(.sbb-scrollbar,
package/lean-theme.css CHANGED
@@ -1405,6 +1405,10 @@ summary {
1405
1405
  --sbb-header-box-shadow: var(--sbb-box-shadow-level-9-soft);
1406
1406
  --sbb-header-inset-inline-end: 0;
1407
1407
  --sbb-header-position: fixed;
1408
+ --sbb-header-padding-block-start: env(safe-area-inset-top, 0);
1409
+ --sbb-header-vertical-spacing: calc(
1410
+ var(--sbb-header-height) + var(--sbb-header-padding-block-start)
1411
+ );
1408
1412
  --sbb-header-height-s: 3.25rem;
1409
1413
  --sbb-header-height-m: var(--sbb-spacing-fixed-14x);
1410
1414
  --sbb-header-height: var(--sbb-header-height-s);
@@ -2357,6 +2361,7 @@ sbb-flip-card-summary > [slot=image] :is(sbb-image, img):not(.sbb-figure-overlap
2357
2361
  color-mix(in srgb, var(--sbb-color-black) 60%, transparent),
2358
2362
  color-mix(in srgb, var(--sbb-color-white) 60%, transparent)
2359
2363
  );
2364
+ --sbb-scrollbar-track-color: transparent;
2360
2365
  }
2361
2366
  :is(sbb-form-field, sbb-timetable-form-field) :where(textarea)::-webkit-scrollbar {
2362
2367
  width: var(--sbb-scrollbar-width);
@@ -2455,7 +2460,7 @@ sbb-flip-card-summary > [slot=image] :is(sbb-image, img):not(.sbb-figure-overlap
2455
2460
  }
2456
2461
 
2457
2462
  sbb-header + :where(sbb-sidebar-container, sbb-icon-sidebar-container) {
2458
- margin-block-start: var(--sbb-header-height);
2463
+ margin-block-start: var(--sbb-header-vertical-spacing);
2459
2464
  }
2460
2465
 
2461
2466
  .sbb-header-info {
@@ -3328,6 +3333,7 @@ sbb-toggle:has(:focus-visible) {
3328
3333
  color-mix(in srgb, var(--sbb-color-black) 60%, transparent),
3329
3334
  color-mix(in srgb, var(--sbb-color-white) 60%, transparent)
3330
3335
  );
3336
+ --sbb-scrollbar-track-color: transparent;
3331
3337
  }
3332
3338
 
3333
3339
  :is(.sbb-scrollbar,
package/map-container/map-container.component.js CHANGED
@@ -1,2 +1,2 @@
1
- import { t as e } from "../map-container.component-bI8Gb4I8.js";
1
+ import { t as e } from "../map-container.component-C2_Miiv0.js";
2
2
  export { e as SbbMapContainerElement };
package/{map-container.component-bI8Gb4I8.js → map-container.component-C2_Miiv0.js} RENAMED
@@ -5,7 +5,7 @@ import { SbbElement as s, SbbLanguageController as c, forceType as l, forwardEve
5
5
  import { SbbAccentButtonElement as p } from "./button.pure.js";
6
6
  import { IntersectionController as m } from "@lit-labs/observers/intersection-controller.js";
7
7
  //#region src/elements/map-container/map-container.scss?inline
8
- var h = ":host{--sbb-map-container-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-4x) );--_sbb-map-container-map-height: calc( var(--sbb-map-container-map-height-zero) + var(--sbb-map-container-border-radius) );display:grid;grid-template-rows:auto auto}@media(min-width:37.5rem){:host{--_sbb-map-container-map-height: calc( var(--sbb-map-container-map-height-small) + var(--sbb-map-container-border-radius) )}}@media(min-width:64rem){:host{grid-template-columns:max(var(--sbb-map-container-sidebar-width)) calc(100% - var(--sbb-map-container-sidebar-width));position:fixed;inset:var(--sbb-map-container-margin-start, var(--sbb-header-height)) 0 0 0}}.sbb-map-container__sidebar-button{position:fixed;left:50%;inset-block-end:var(--sbb-spacing-fixed-5x);visibility:hidden;opacity:0;transform:translate(-50%) translateY(calc(100% + var(--sbb-spacing-fixed-5x)));transition:opacity var(--sbb-map-container-animation-duration) var(--sbb-animation-easing),visibility var(--sbb-map-container-animation-duration) var(--sbb-animation-easing) var(--sbb-map-container-animation-duration),transform var(--sbb-map-container-animation-duration) var(--sbb-animation-easing)}:host(:is(:state(scroll-up-button-visible),[state--scroll-up-button-visible])) .sbb-map-container__sidebar-button{transition:visibility var(--sbb-map-container-animation-duration) var(--sbb-animation-easing),opacity var(--sbb-map-container-animation-duration) var(--sbb-animation-easing),transform var(--sbb-map-container-animation-duration) ease-out;visibility:visible;opacity:1;transform:translate(-50%) translateY(0)}@media(min-width:64rem){.sbb-map-container__sidebar-button{display:none}}.sbb-map-container__sidebar{grid-column:1/3;grid-row:2/3;width:100%;overflow:hidden auto;position:relative;border-start-end-radius:var(--sbb-map-container-border-radius);border-start-start-radius:var(--sbb-map-container-border-radius);margin-block-start:calc(var(--sbb-map-container-border-radius) * -1);background-color:var(--sbb-map-container-sidebar-background-color)}@media(min-width:64rem){.sbb-map-container__sidebar{grid-column:1/2;grid-row:1/3;border-radius:0;margin-block-start:0;border-block-start:var(--sbb-border-width-1x) solid var(--sbb-border-color-4-inverted)}}.sbb-map-container__map{position:sticky;inset-block-start:0;inset-inline:0;grid-row:1/2;grid-column:1/3}@media(max-width:63.9375rem){.sbb-map-container__map{inset-block-start:var(--sbb-map-container-mobile-sticky-block-start, 0);height:var(--_sbb-map-container-map-height)}}@media(min-width:64rem){.sbb-map-container__map{grid-row:1/3;grid-column:2/3;position:relative}}", g = (() => {
8
+ var h = ":host{--sbb-map-container-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-4x) );--_sbb-map-container-map-height: calc( var(--sbb-map-container-map-height-zero) + var(--sbb-map-container-border-radius) );display:grid;grid-template-rows:auto auto}@media(min-width:37.5rem){:host{--_sbb-map-container-map-height: calc( var(--sbb-map-container-map-height-small) + var(--sbb-map-container-border-radius) )}}@media(min-width:64rem){:host{grid-template-columns:max(var(--sbb-map-container-sidebar-width)) calc(100% - var(--sbb-map-container-sidebar-width));position:fixed;inset:var(--sbb-map-container-margin-start, var(--sbb-header-vertical-spacing)) 0 0 0}}.sbb-map-container__sidebar-button{position:fixed;left:50%;inset-block-end:var(--sbb-spacing-fixed-5x);visibility:hidden;opacity:0;transform:translate(-50%) translateY(calc(100% + var(--sbb-spacing-fixed-5x)));transition:opacity var(--sbb-map-container-animation-duration) var(--sbb-animation-easing),visibility var(--sbb-map-container-animation-duration) var(--sbb-animation-easing) var(--sbb-map-container-animation-duration),transform var(--sbb-map-container-animation-duration) var(--sbb-animation-easing)}:host(:is(:state(scroll-up-button-visible),[state--scroll-up-button-visible])) .sbb-map-container__sidebar-button{transition:visibility var(--sbb-map-container-animation-duration) var(--sbb-animation-easing),opacity var(--sbb-map-container-animation-duration) var(--sbb-animation-easing),transform var(--sbb-map-container-animation-duration) ease-out;visibility:visible;opacity:1;transform:translate(-50%) translateY(0)}@media(min-width:64rem){.sbb-map-container__sidebar-button{display:none}}.sbb-map-container__sidebar{grid-column:1/3;grid-row:2/3;width:100%;overflow:hidden auto;position:relative;border-start-end-radius:var(--sbb-map-container-border-radius);border-start-start-radius:var(--sbb-map-container-border-radius);margin-block-start:calc(var(--sbb-map-container-border-radius) * -1);background-color:var(--sbb-map-container-sidebar-background-color)}@media(min-width:64rem){.sbb-map-container__sidebar{grid-column:1/2;grid-row:1/3;border-radius:0;margin-block-start:0;border-block-start:var(--sbb-border-width-1x) solid var(--sbb-border-color-4-inverted)}}.sbb-map-container__map{position:sticky;inset-block-start:0;inset-inline:0;grid-row:1/2;grid-column:1/3}@media(max-width:63.9375rem){.sbb-map-container__map{inset-block-start:var(--sbb-map-container-mobile-sticky-block-start, 0);height:var(--_sbb-map-container-map-height)}}@media(min-width:64rem){.sbb-map-container__map{grid-row:1/3;grid-column:2/3;position:relative}}", g = (() => {
9
9
  let g = s, _, v = [], y = [], b, x = [], S = [];
10
10
  return class extends g {
11
11
  constructor() {
package/map-container.js CHANGED
@@ -1,4 +1,4 @@
1
- import { t as e } from "./map-container.component-bI8Gb4I8.js";
1
+ import { t as e } from "./map-container.component-C2_Miiv0.js";
2
2
  import "./map-container.pure.js";
3
3
  //#region src/elements/map-container.ts
4
4
  e.define();
package/map-container.pure.js CHANGED
@@ -1,2 +1,2 @@
1
- import { t as e } from "./map-container.component-bI8Gb4I8.js";
1
+ import { t as e } from "./map-container.component-C2_Miiv0.js";
2
2
  export { e as SbbMapContainerElement };
package/off-brand-theme.css CHANGED
@@ -1405,6 +1405,10 @@ summary {
1405
1405
  --sbb-header-box-shadow: var(--sbb-box-shadow-level-9-soft);
1406
1406
  --sbb-header-inset-inline-end: 0;
1407
1407
  --sbb-header-position: fixed;
1408
+ --sbb-header-padding-block-start: env(safe-area-inset-top, 0);
1409
+ --sbb-header-vertical-spacing: calc(
1410
+ var(--sbb-header-height) + var(--sbb-header-padding-block-start)
1411
+ );
1408
1412
  --sbb-header-height-s: 3.25rem;
1409
1413
  --sbb-header-height-m: var(--sbb-spacing-fixed-14x);
1410
1414
  --sbb-header-height: var(--sbb-header-height-m);
@@ -2357,6 +2361,7 @@ sbb-flip-card-summary > [slot=image] :is(sbb-image, img):not(.sbb-figure-overlap
2357
2361
  color-mix(in srgb, var(--sbb-color-black) 60%, transparent),
2358
2362
  color-mix(in srgb, var(--sbb-color-white) 60%, transparent)
2359
2363
  );
2364
+ --sbb-scrollbar-track-color: transparent;
2360
2365
  }
2361
2366
  :is(sbb-form-field, sbb-timetable-form-field) :where(textarea)::-webkit-scrollbar {
2362
2367
  width: var(--sbb-scrollbar-width);
@@ -2455,7 +2460,7 @@ sbb-flip-card-summary > [slot=image] :is(sbb-image, img):not(.sbb-figure-overlap
2455
2460
  }
2456
2461
 
2457
2462
  sbb-header + :where(sbb-sidebar-container, sbb-icon-sidebar-container) {
2458
- margin-block-start: var(--sbb-header-height);
2463
+ margin-block-start: var(--sbb-header-vertical-spacing);
2459
2464
  }
2460
2465
 
2461
2466
  .sbb-header-info {
@@ -3328,6 +3333,7 @@ sbb-toggle:has(:focus-visible) {
3328
3333
  color-mix(in srgb, var(--sbb-color-black) 60%, transparent),
3329
3334
  color-mix(in srgb, var(--sbb-color-white) 60%, transparent)
3330
3335
  );
3336
+ --sbb-scrollbar-track-color: transparent;
3331
3337
  }
3332
3338
 
3333
3339
  :is(.sbb-scrollbar,
package/package.json CHANGED
@@ -1,12 +1,12 @@
1
1
  {
2
2
  "name": "@sbb-esta/lyne-elements-dev",
3
- "version": "5.0.0-next.3-dev.1780495434",
3
+ "version": "5.0.0-next.3-dev.1780500158",
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/ce201ab842503e5688b92ff8ef5ad95980940872"
9
+ "https://github.com/sbb-design-systems/lyne-components/commit/d2c720b1e34459b6dc5cc8da4d1dca0fab2405aa"
10
10
  ],
11
11
  "type": "module",
12
12
  "exports": {
package/safety-theme.css CHANGED
@@ -1405,6 +1405,10 @@ summary {
1405
1405
  --sbb-header-box-shadow: var(--sbb-box-shadow-level-9-soft);
1406
1406
  --sbb-header-inset-inline-end: 0;
1407
1407
  --sbb-header-position: fixed;
1408
+ --sbb-header-padding-block-start: env(safe-area-inset-top, 0);
1409
+ --sbb-header-vertical-spacing: calc(
1410
+ var(--sbb-header-height) + var(--sbb-header-padding-block-start)
1411
+ );
1408
1412
  --sbb-header-height-s: 3.25rem;
1409
1413
  --sbb-header-height-m: var(--sbb-spacing-fixed-14x);
1410
1414
  --sbb-header-height: var(--sbb-header-height-m);
@@ -2357,6 +2361,7 @@ sbb-flip-card-summary > [slot=image] :is(sbb-image, img):not(.sbb-figure-overlap
2357
2361
  color-mix(in srgb, var(--sbb-color-black) 60%, transparent),
2358
2362
  color-mix(in srgb, var(--sbb-color-white) 60%, transparent)
2359
2363
  );
2364
+ --sbb-scrollbar-track-color: transparent;
2360
2365
  }
2361
2366
  :is(sbb-form-field, sbb-timetable-form-field) :where(textarea)::-webkit-scrollbar {
2362
2367
  width: var(--sbb-scrollbar-width);
@@ -2455,7 +2460,7 @@ sbb-flip-card-summary > [slot=image] :is(sbb-image, img):not(.sbb-figure-overlap
2455
2460
  }
2456
2461
 
2457
2462
  sbb-header + :where(sbb-sidebar-container, sbb-icon-sidebar-container) {
2458
- margin-block-start: var(--sbb-header-height);
2463
+ margin-block-start: var(--sbb-header-vertical-spacing);
2459
2464
  }
2460
2465
 
2461
2466
  .sbb-header-info {
@@ -3328,6 +3333,7 @@ sbb-toggle:has(:focus-visible) {
3328
3333
  color-mix(in srgb, var(--sbb-color-black) 60%, transparent),
3329
3334
  color-mix(in srgb, var(--sbb-color-white) 60%, transparent)
3330
3335
  );
3336
+ --sbb-scrollbar-track-color: transparent;
3331
3337
  }
3332
3338
 
3333
3339
  :is(.sbb-scrollbar,
package/standard-theme.css CHANGED
@@ -1405,6 +1405,10 @@ summary {
1405
1405
  --sbb-header-box-shadow: var(--sbb-box-shadow-level-9-soft);
1406
1406
  --sbb-header-inset-inline-end: 0;
1407
1407
  --sbb-header-position: fixed;
1408
+ --sbb-header-padding-block-start: env(safe-area-inset-top, 0);
1409
+ --sbb-header-vertical-spacing: calc(
1410
+ var(--sbb-header-height) + var(--sbb-header-padding-block-start)
1411
+ );
1408
1412
  --sbb-header-height-s: 3.25rem;
1409
1413
  --sbb-header-height-m: var(--sbb-spacing-fixed-14x);
1410
1414
  --sbb-header-height: var(--sbb-header-height-m);
@@ -2357,6 +2361,7 @@ sbb-flip-card-summary > [slot=image] :is(sbb-image, img):not(.sbb-figure-overlap
2357
2361
  color-mix(in srgb, var(--sbb-color-black) 60%, transparent),
2358
2362
  color-mix(in srgb, var(--sbb-color-white) 60%, transparent)
2359
2363
  );
2364
+ --sbb-scrollbar-track-color: transparent;
2360
2365
  }
2361
2366
  :is(sbb-form-field, sbb-timetable-form-field) :where(textarea)::-webkit-scrollbar {
2362
2367
  width: var(--sbb-scrollbar-width);
@@ -2455,7 +2460,7 @@ sbb-flip-card-summary > [slot=image] :is(sbb-image, img):not(.sbb-figure-overlap
2455
2460
  }
2456
2461
 
2457
2462
  sbb-header + :where(sbb-sidebar-container, sbb-icon-sidebar-container) {
2458
- margin-block-start: var(--sbb-header-height);
2463
+ margin-block-start: var(--sbb-header-vertical-spacing);
2459
2464
  }
2460
2465
 
2461
2466
  .sbb-header-info {
@@ -3328,6 +3333,7 @@ sbb-toggle:has(:focus-visible) {
3328
3333
  color-mix(in srgb, var(--sbb-color-black) 60%, transparent),
3329
3334
  color-mix(in srgb, var(--sbb-color-white) 60%, transparent)
3330
3335
  );
3336
+ --sbb-scrollbar-track-color: transparent;
3331
3337
  }
3332
3338
 
3333
3339
  :is(.sbb-scrollbar,