@sbb-esta/lyne-elements 4.0.2 → 4.0.4
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.
- package/_index.scss +1 -1
- package/autocomplete/autocomplete-base-element.d.ts.map +1 -1
- package/autocomplete/autocomplete-base-element.js +11 -6
- package/autocomplete/autocomplete.component.d.ts +2 -0
- package/autocomplete/autocomplete.component.d.ts.map +1 -1
- package/autocomplete/autocomplete.component.js +6 -9
- package/calendar/calendar.component.d.ts +2 -0
- package/calendar/calendar.component.d.ts.map +1 -1
- package/calendar/calendar.component.js +95 -92
- package/core/overlay/overlay-option-panel.js +3 -3
- package/core/styles/core.scss +1 -1
- package/core/styles/mixins/lists.scss +15 -3
- package/core/styles/mixins/overlay.scss +6 -3
- package/core.css +1 -1
- package/custom-elements.json +7404 -7385
- package/development/autocomplete/autocomplete-base-element.d.ts.map +1 -1
- package/development/autocomplete/autocomplete-base-element.js +20 -9
- package/development/autocomplete/autocomplete.component.d.ts +2 -0
- package/development/autocomplete/autocomplete.component.d.ts.map +1 -1
- package/development/autocomplete/autocomplete.component.js +6 -7
- package/development/calendar/calendar.component.d.ts +2 -0
- package/development/calendar/calendar.component.d.ts.map +1 -1
- package/development/calendar/calendar.component.js +40 -33
- package/development/core/overlay/overlay-option-panel.js +2 -2
- package/development/dialog/dialog/dialog.component.d.ts.map +1 -1
- package/development/dialog/dialog/dialog.component.js +5 -2
- package/development/header/common/header-action-common.js +30 -32
- package/development/notification/notification.component.js +9 -11
- package/development/option/option/option-base-element.js +2 -2
- package/development/overlay/overlay-base-element.d.ts +1 -1
- package/development/overlay/overlay-base-element.d.ts.map +1 -1
- package/development/overlay/overlay-base-element.js +12 -1
- package/development/overlay/overlay.component.d.ts +2 -1
- package/development/overlay/overlay.component.d.ts.map +1 -1
- package/development/overlay/overlay.component.js +7 -1
- package/development/popover/popover.component.d.ts.map +1 -1
- package/development/popover/popover.component.js +8 -2
- package/development/select/select.component.d.ts +3 -1
- package/development/select/select.component.d.ts.map +1 -1
- package/development/select/select.component.js +19 -13
- package/development/tabs/tab/tab.component.js +2 -1
- package/dialog/dialog/dialog.component.d.ts.map +1 -1
- package/dialog/dialog/dialog.component.js +2 -2
- package/header/common/header-action-common.js +20 -20
- package/loading-indicator-circle/loading-indicator-circle.component.js +1 -1
- package/notification/notification.component.js +1 -1
- package/off-brand-theme.css +1 -1
- package/option/option/option-base-element.js +1 -1
- package/overlay/overlay-base-element.d.ts +1 -1
- package/overlay/overlay-base-element.d.ts.map +1 -1
- package/overlay/overlay-base-element.js +24 -22
- package/overlay/overlay.component.d.ts +2 -1
- package/overlay/overlay.component.d.ts.map +1 -1
- package/overlay/overlay.component.js +28 -25
- package/package.json +3 -3
- package/popover/popover.component.d.ts.map +1 -1
- package/popover/popover.component.js +3 -3
- package/safety-theme.css +1 -1
- package/select/select.component.d.ts +3 -1
- package/select/select.component.d.ts.map +1 -1
- package/select/select.component.js +10 -7
- package/standard-theme.css +1 -1
- package/tabs/tab/tab.component.js +4 -4
|
@@ -8,7 +8,7 @@ import { css as k, LitElement as y, html as w } from "lit";
|
|
|
8
8
|
import { customElement as S, property as x } from "lit/decorators.js";
|
|
9
9
|
import { SbbElementInternalsMixin as z } from "../core/mixins.js";
|
|
10
10
|
import { boxSizingStyles as E } from "../core/styles.js";
|
|
11
|
-
const I = k`:host{display:inline-block;line-height:0;--sbb-loading-indicator-circle-color: var(--sbb-color-primary);--sbb-loading-indicator-circle-padding: .125rem;--sbb-loading-indicator-circle-duration: var(--sbb-disable-animation-duration, 1.5s);--sbb-loading-indicator-circle-background-color: var(--sbb-color-white);--sbb-loading-indicator-circle-background: conic-gradient( from 90deg, transparent, var(--sbb-loading-indicator-circle-color) );--sbb-loading-indicator-circle-animated-width: .1875em;--sbb-loading-indicator-circle-animated-height: .1875em;--sbb-loading-indicator-circle-animated-border-radius: 50%}@media(forced-colors:active){:host{--sbb-loading-indicator-circle-color: CanvasText !important;--sbb-loading-indicator-circle-animated-width: 50%;--sbb-loading-indicator-circle-animated-height: 100%;--sbb-loading-indicator-circle-animated-border-radius: 0;--sbb-loading-indicator-circle-background: transparent}}:host([color=smoke]){--sbb-loading-indicator-circle-color: var(--sbb-color-smoke)}:host([color=white]){--sbb-loading-indicator-circle-color: var(--sbb-color-white)}:host([color=white]){--sbb-loading-indicator-circle-background-color: var(--sbb-color-iron)}.sbb-loading-indicator{display:inline-flex;padding:var(--sbb-loading-indicator-circle-padding);vertical-align:middle;line-height:1}.sbb-loading-indicator__animated-element{width:1.25em;height:1.25em;display:inline-block;color:transparent;position:relative;margin:0 auto;overflow:hidden;border-radius:50%;background:var(--sbb-loading-indicator-circle-background);mask:radial-gradient(circle .4375em,rgba(0,0,0,0) 98%,var(--sbb-loading-indicator-circle-background-color));animation:rotation var(--sbb-loading-indicator-circle-duration) infinite linear}.sbb-loading-indicator__animated-element:after{content:"";width:var(--sbb-loading-indicator-circle-animated-width);height:var(--sbb-loading-indicator-circle-animated-height);background:var(--sbb-loading-indicator-circle-color);border-radius:var(--sbb-loading-indicator-circle-animated-border-radius);position:absolute;top:50%;right:0;translate:0 -50%;overflow:hidden;margin:auto}@keyframes rotation{0%{rotate:0deg}to{rotate:359deg}}`;
|
|
11
|
+
const I = k`:host{display:inline-block;line-height:0;--sbb-loading-indicator-circle-color: var(--sbb-color-primary);--sbb-loading-indicator-circle-padding: .125rem;--sbb-loading-indicator-circle-duration: var(--sbb-disable-animation-duration, 1.5s);--sbb-loading-indicator-circle-background-color: var(--sbb-color-white);--sbb-loading-indicator-circle-background: conic-gradient( from 90deg, transparent, var(--sbb-loading-indicator-circle-color) );--sbb-loading-indicator-circle-animated-width: .1875em;--sbb-loading-indicator-circle-animated-height: .1875em;--sbb-loading-indicator-circle-animated-border-radius: 50%}@media(forced-colors:active){:host{--sbb-loading-indicator-circle-color: CanvasText !important;--sbb-loading-indicator-circle-animated-width: 50%;--sbb-loading-indicator-circle-animated-height: 100%;--sbb-loading-indicator-circle-animated-border-radius: 0;--sbb-loading-indicator-circle-background: transparent}}:host([color=smoke]){--sbb-loading-indicator-circle-color: var(--sbb-color-smoke)}:host([color=white]){--sbb-loading-indicator-circle-color: var(--sbb-color-white)}:host([color=white]){--sbb-loading-indicator-circle-background-color: var(--sbb-color-iron)}.sbb-loading-indicator{display:inline-flex;padding:var(--sbb-loading-indicator-circle-padding);vertical-align:middle;line-height:1}.sbb-loading-indicator__animated-element{width:1.25em;height:1.25em;display:inline-block;color:transparent;position:relative;margin:0 auto;overflow:hidden;border-radius:50%;background:var(--sbb-loading-indicator-circle-background);-webkit-mask:radial-gradient(circle .4375em,rgba(0,0,0,0) 98%,var(--sbb-loading-indicator-circle-background-color));mask:radial-gradient(circle .4375em,rgba(0,0,0,0) 98%,var(--sbb-loading-indicator-circle-background-color));animation:rotation var(--sbb-loading-indicator-circle-duration) infinite linear}.sbb-loading-indicator__animated-element:after{content:"";width:var(--sbb-loading-indicator-circle-animated-width);height:var(--sbb-loading-indicator-circle-animated-height);background:var(--sbb-loading-indicator-circle-color);border-radius:var(--sbb-loading-indicator-circle-animated-border-radius);position:absolute;top:50%;right:0;translate:0 -50%;overflow:hidden;margin:auto}@keyframes rotation{0%{rotate:0deg}to{rotate:359deg}}`;
|
|
12
12
|
let M = (() => {
|
|
13
13
|
var n, t;
|
|
14
14
|
let i = [S("sbb-loading-indicator-circle")], a, r = [], o, d = z(y), s, b = [], g = [];
|
|
@@ -15,7 +15,7 @@ import { boxSizingStyles as B } from "../core/styles.js";
|
|
|
15
15
|
import { SbbIconNameMixin as j } from "../icon.js";
|
|
16
16
|
import "../button/secondary-button.js";
|
|
17
17
|
import "../divider.js";
|
|
18
|
-
const q = $`:host{--sbb-notification-margin: 0;--sbb-notification-padding-block: var(--sbb-spacing-responsive-xxs);--sbb-notification-padding-inline: var(--sbb-spacing-responsive-xs);--sbb-notification-color: var(--sbb-color-2-negative-inverted);--sbb-notification-background-color: color-mix(in srgb, var(--sbb-notification-type-color) 5%, white);--sbb-notification-background-color: light-dark( color-mix(in srgb, var(--sbb-notification-type-color) 5%, white), color-mix(in srgb, var(--sbb-notification-type-color) 35%, white) );--sbb-notification-icon-color: var(--sbb-notification-type-color);--sbb-notification-border-width: var(--sbb-border-width-1x);--sbb-notification-border: var(--sbb-notification-border-width) solid var(--sbb-notification-type-color);--sbb-notification-base-radius: var(--sbb-border-radius-4x);--sbb-notification-border-radius: calc(var(--sbb-notification-base-
|
|
18
|
+
const q = $`:host{--sbb-notification-margin: 0;--sbb-notification-padding-block: var(--sbb-spacing-responsive-xxs);--sbb-notification-padding-inline: var(--sbb-spacing-responsive-xs);--sbb-notification-color: var(--sbb-color-2-negative-inverted);--sbb-notification-background-color: color-mix(in srgb, var(--sbb-notification-type-color) 5%, white);--sbb-notification-background-color: light-dark( color-mix(in srgb, var(--sbb-notification-type-color) 5%, white), color-mix(in srgb, var(--sbb-notification-type-color) 35%, white) );--sbb-notification-icon-color: var(--sbb-notification-type-color);--sbb-notification-border-width: var(--sbb-border-width-1x);--sbb-notification-border: var(--sbb-notification-border-width) solid var(--sbb-notification-type-color);--sbb-notification-base-border-radius: var(--sbb-border-radius-4x);--sbb-notification-border-radius-start: calc(var(--sbb-notification-base-border-radius) / 2);--sbb-notification-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-4x) );--sbb-notification-timing-function: ease-in;--sbb-notification-content-padding-inline: var(--sbb-spacing-responsive-xxxs) var(--sbb-spacing-responsive-xs);--_sbb-notification-icon-authoritative-font-size: 1em;--_sbb-notification-icon-authoritative-line-height: var(--sbb-typo-line-height-text);--sbb-focus-outline-color: var(--sbb-focus-outline-color-default);display:block}:host(:is(:state(state-opening),[state--state-opening]):not([animation=open],[animation=all])){--sbb-disable-animation-duration: 0s}:host(:is(:state(state-closing),[state--state-closing]):not([animation=close],[animation=all])){--sbb-disable-animation-duration: 0s}:host(:is(:state(resize-disable-animation),[state--resize-disable-animation])){--sbb-disable-animation-duration: 0s}:host(:is(:not([type]),[type=info])){--sbb-notification-type-color: var(--sbb-color-smoke);--sbb-notification-icon-color: var(--sbb-notification-color);--sbb-notification-divider-opacity-light: 20%;--sbb-notification-divider-opacity-dark: 20%}:host([type=note]){--sbb-notification-type-color: var(--sbb-color-sky);--sbb-notification-divider-opacity-light: 20%;--sbb-notification-divider-opacity-dark: 20%}:host([type=success]){--sbb-notification-type-color: var(--sbb-color-success);--sbb-notification-divider-opacity-light: 15%;--sbb-notification-divider-opacity-dark: 30%}:host([type=warn]){--sbb-notification-type-color: var(--sbb-color-warning);--sbb-notification-icon-color: var(--sbb-notification-color);--sbb-notification-divider-opacity-light: 25%;--sbb-notification-divider-opacity-dark: 40%}:host([type=error]){--sbb-notification-type-color: var(--sbb-color-error);--sbb-notification-divider-opacity-light: 10%;--sbb-notification-divider-opacity-dark: 25%}:host([size=s]){--sbb-notification-padding-block: var(--sbb-spacing-responsive-xxxs);--sbb-notification-padding-inline: var(--sbb-spacing-responsive-xxs) var(--sbb-spacing-responsive-xxxs);--sbb-notification-content-padding-inline: var(--sbb-spacing-responsive-xxxs) var(--sbb-spacing-responsive-xxs)}@media(min-width:37.5rem){:host([size=s]){--sbb-notification-padding-inline: var(--sbb-spacing-responsive-xxs)}}.sbb-notification__wrapper{position:relative;inset-inline-start:calc(var(--sbb-notification-base-border-radius) - var(--sbb-notification-border-width));width:calc(100% - (var(--sbb-notification-base-border-radius) - var(--sbb-notification-border-width)));border:var(--sbb-notification-border);border-radius:var(--sbb-notification-border-radius-start) var(--sbb-notification-base-border-radius) var(--sbb-notification-base-border-radius) var(--sbb-notification-border-radius-start);opacity:0;max-height:0;margin:0}.sbb-notification__wrapper:before{content:"";position:absolute;inset:calc(var(--sbb-notification-border-width) * -1) var(--sbb-notification-base-border-radius) calc(var(--sbb-notification-border-width) * -1) calc(var(--sbb-notification-base-border-radius) * -1);background-color:var(--sbb-notification-type-color);border:var(--sbb-notification-border);border-radius:var(--sbb-notification-base-border-radius)}:host(:is(:is(:state(state-opened),[state--state-opened]),:is(:state(state-closing),[state--state-closing]))) .sbb-notification__wrapper{opacity:1;max-height:calc(var(--sbb-notification-height) + var(--sbb-notification-border-width) * 2);margin:var(--sbb-notification-margin, 0)}:host(:is(:state(state-opening),[state--state-opening])) .sbb-notification__wrapper{animation-name:open;animation-fill-mode:forwards;animation-duration:var(--sbb-notification-animation-duration);animation-timing-function:var(--sbb-notification-timing-function)}:host(:is(:state(state-closing),[state--state-closing])) .sbb-notification__wrapper{animation-name:close,close-height;animation-fill-mode:forwards;animation-duration:var(--sbb-notification-animation-duration);animation-timing-function:var(--sbb-notification-timing-function);animation-delay:0s,var(--sbb-disable-animation-duration, var(--sbb-animation-duration-2x))}.sbb-notification{--sbb-text-font-size: var(--sbb-text-font-size-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size);position:relative;display:grid;grid-template-columns:1fr auto;align-items:center;padding-block:var(--sbb-notification-padding-block);padding-inline:var(--sbb-notification-padding-inline);color:var(--sbb-notification-color);border-radius:var(--sbb-notification-border-radius-start) calc(var(--sbb-notification-base-border-radius) - var(--sbb-notification-border-width)) calc(var(--sbb-notification-base-border-radius) - var(--sbb-notification-border-width)) var(--sbb-notification-border-radius-start);overflow:hidden;background-color:var(--sbb-notification-background-color)}@media(min-width:37.5rem){.sbb-notification{grid-template-columns:auto 1fr auto;align-items:flex-start}}:host([size=s]) .sbb-notification{--sbb-text-font-size: var(--sbb-text-font-size-xs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size)}.sbb-notification__icon,::slotted(sbb-icon){color:var(--sbb-notification-icon-color);--sbb-icon-svg-width: var(--sbb-notification-icon-size)}@media(min-width:37.5rem){.sbb-notification__icon,::slotted(sbb-icon){margin-block-start:max(0rem,(var(--_sbb-notification-icon-authoritative-font-size) * var(--_sbb-notification-icon-authoritative-line-height) - var(--sbb-size-icon-ui-small)) / 2)}}.sbb-notification__content{color-scheme:only light;order:3;grid-area:2/1/3/3;margin-block-start:var(--sbb-spacing-fixed-2x)}@media(min-width:37.5rem){.sbb-notification__content{order:initial;grid-area:initial;margin-block-start:0;padding-inline:var(--sbb-notification-content-padding-inline)}}.sbb-notification__text{display:inline;margin:0;padding:0}.sbb-notification__close-wrapper{display:flex;align-items:center;gap:var(--sbb-spacing-responsive-xxs);height:100%}.sbb-notification__divider{--sbb-divider-color: color-mix( in srgb, var(--sbb-notification-type-color) var(--sbb-notification-divider-opacity-light), var(--sbb-notification-background-color) );--sbb-divider-color: light-dark( color-mix( in srgb, var(--sbb-notification-type-color) var(--sbb-notification-divider-opacity-light), var(--sbb-notification-background-color) ), color-mix( in srgb, var(--sbb-notification-type-color) var(--sbb-notification-divider-opacity-dark), var(--sbb-notification-background-color) ) );display:none;position:relative;inset-inline-start:var(--sbb-border-width-1x)}@media(min-width:37.5rem){.sbb-notification__divider{display:block;height:calc(100% - var(--sbb-spacing-fixed-1x) * 2)}}@keyframes open{0%{opacity:0;max-height:0;margin:0}to{opacity:1;max-height:calc(var(--sbb-notification-height) + var(--sbb-notification-border-width) * 2);margin:var(--sbb-notification-margin, 0)}}@keyframes close{0%{opacity:1;margin:var(--sbb-notification-margin, 0)}to{opacity:0;margin:0}}@keyframes close-height{0%{max-height:calc(var(--sbb-notification-height) + var(--sbb-notification-border-width) * 2)}to{max-height:0}}::slotted(sbb-title){margin:0}`, P = /* @__PURE__ */ new Map([
|
|
19
19
|
["info", "circle-information-small"],
|
|
20
20
|
["note", "circle-information-small"],
|
|
21
21
|
["success", "circle-tick-small"],
|
package/off-brand-theme.css
CHANGED
|
@@ -1931,7 +1931,7 @@ sbb-dialog:has(> sbb-dialog-close-button) > sbb-dialog-title, sbb-dialog:is(:sta
|
|
|
1931
1931
|
}
|
|
1932
1932
|
|
|
1933
1933
|
sbb-dialog:has(> sbb-dialog-title) > sbb-dialog-content, sbb-dialog:is(:state(has-intermediate-element),[state--has-intermediate-element]):has(> * > sbb-dialog-title) > * > sbb-dialog-content {
|
|
1934
|
-
padding-block-start:
|
|
1934
|
+
padding-block-start: var(--sbb-spacing-fixed-1x);
|
|
1935
1935
|
}
|
|
1936
1936
|
sbb-dialog[negative] > sbb-dialog-content, sbb-dialog[negative]:is(:state(has-intermediate-element),[state--has-intermediate-element]) > * > sbb-dialog-content {
|
|
1937
1937
|
--sbb-scrollbar-color: color-mix(in srgb, var(--sbb-color-white) 30%, transparent);
|
|
@@ -141,7 +141,7 @@ let ut = (() => {
|
|
|
141
141
|
this.updateDisableHighlight(!0);
|
|
142
142
|
return;
|
|
143
143
|
}
|
|
144
|
-
this.label = e.map((i) => i.wholeText).filter((i) => i.trim()).join();
|
|
144
|
+
this.label = e.map((i) => i.wholeText).filter((i) => i.trim()).join("");
|
|
145
145
|
}
|
|
146
146
|
getHighlightedLabel() {
|
|
147
147
|
if (!this._highlightString || !this._highlightString.trim())
|
|
@@ -31,7 +31,7 @@ export declare abstract class SbbOverlayBaseElement extends SbbOverlayBaseElemen
|
|
|
31
31
|
protected inertController: SbbInertController;
|
|
32
32
|
protected escapableOverlayController: SbbEscapableOverlayController;
|
|
33
33
|
private _ariaLiveRefToggle;
|
|
34
|
-
private _ariaLiveRef
|
|
34
|
+
private _ariaLiveRef?;
|
|
35
35
|
private _triggerElement;
|
|
36
36
|
private _triggerAbortController;
|
|
37
37
|
protected abstract closeAttribute: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"overlay-base-element.d.ts","sourceRoot":"","sources":["../../../src/elements/overlay/overlay-base-element.ts"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,mBAAmB,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAG9E,OAAO,EAAE,sBAAsB,EAAE,MAAM,iBAAiB,CAAC;AACzD,OAAO,EAA6B,uBAAuB,EAAE,MAAM,0BAA0B,CAAC;AAC9F,OAAO,EACL,6BAA6B,EAC7B,kBAAkB,EAClB,qBAAqB,EACtB,MAAM,wBAAwB,CAAC;AAEhC,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAElD,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,uBAAuB,CAAC;AASzE,eAAO,MAAM,WAAW,EAAE,qBAAqB,EAAO,CAAC;;AAEvD,8BAAsB,qBAAsB,SAAQ,0BAAyC;IAC3F;;;;OAIG;IACH,SAEgB,OAAO,EAAE,WAAW,GAAG,IAAI,CAAQ;IAEnD,kHAAkH;IAClH,SAEgB,kBAAkB,EAAE,MAAM,CAAM;IAEhD;;;;OAIG;IACH,SAEgB,oBAAoB,EAAE,OAAO,CAAS;IAGtD,SAAS,CAAC,kBAAkB,CAAC,EAAE,WAAW,CAAC;IAC3C,SAAS,CAAC,mBAAmB,CAAC,EAAE,WAAW,CAAC;IAC5C,SAAS,CAAC,qBAAqB,EAAG,eAAe,CAAC;IAClD,SAAS,CAAC,mBAAmB,yBAAoC;IACjE,SAAS,CAAC,aAAa,mBAA0B;IACjD,SAAS,CAAC,WAAW,EAAE,GAAG,CAAC;IAC3B,SAAS,CAAC,QAAQ,wBAAmC;IACrD,SAAS,CAAC,eAAe,qBAAgC;IACzD,SAAS,CAAC,0BAA0B,gCAA2C;IAE/E,OAAO,CAAC,kBAAkB,CAAS;IACnC,OAAO,CAAC,YAAY,
|
|
1
|
+
{"version":3,"file":"overlay-base-element.d.ts","sourceRoot":"","sources":["../../../src/elements/overlay/overlay-base-element.ts"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,mBAAmB,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAG9E,OAAO,EAAE,sBAAsB,EAAE,MAAM,iBAAiB,CAAC;AACzD,OAAO,EAA6B,uBAAuB,EAAE,MAAM,0BAA0B,CAAC;AAC9F,OAAO,EACL,6BAA6B,EAC7B,kBAAkB,EAClB,qBAAqB,EACtB,MAAM,wBAAwB,CAAC;AAEhC,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAElD,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,uBAAuB,CAAC;AASzE,eAAO,MAAM,WAAW,EAAE,qBAAqB,EAAO,CAAC;;AAEvD,8BAAsB,qBAAsB,SAAQ,0BAAyC;IAC3F;;;;OAIG;IACH,SAEgB,OAAO,EAAE,WAAW,GAAG,IAAI,CAAQ;IAEnD,kHAAkH;IAClH,SAEgB,kBAAkB,EAAE,MAAM,CAAM;IAEhD;;;;OAIG;IACH,SAEgB,oBAAoB,EAAE,OAAO,CAAS;IAGtD,SAAS,CAAC,kBAAkB,CAAC,EAAE,WAAW,CAAC;IAC3C,SAAS,CAAC,mBAAmB,CAAC,EAAE,WAAW,CAAC;IAC5C,SAAS,CAAC,qBAAqB,EAAG,eAAe,CAAC;IAClD,SAAS,CAAC,mBAAmB,yBAAoC;IACjE,SAAS,CAAC,aAAa,mBAA0B;IACjD,SAAS,CAAC,WAAW,EAAE,GAAG,CAAC;IAC3B,SAAS,CAAC,QAAQ,wBAAmC;IACrD,SAAS,CAAC,eAAe,qBAAgC;IACzD,SAAS,CAAC,0BAA0B,gCAA2C;IAE/E,OAAO,CAAC,kBAAkB,CAAS;IACnC,OAAO,CAAC,YAAY,CAAC,CAA6B;IAClD,OAAO,CAAC,eAAe,CAA4B;IACnD,OAAO,CAAC,uBAAuB,CAAmB;IAElD,SAAS,CAAC,QAAQ,CAAC,cAAc,EAAE,MAAM,CAAC;IAC1C,SAAS,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAC5B,SAAS,CAAC,QAAQ,CAAC,aAAa,IAAI,IAAI;IACxC,SAAS,CAAC,QAAQ,CAAC,aAAa,IAAI,IAAI;IACxC,SAAS,CAAC,QAAQ,CAAC,uBAAuB,IAAI,OAAO;IAErD,2BAA2B;IACpB,IAAI,IAAI,IAAI;IA2BnB,4BAA4B;IACrB,KAAK,CAAC,MAAM,CAAC,EAAE,GAAG,EAAE,MAAM,CAAC,EAAE,WAAW,GAAG,GAAG;IA0BrC,iBAAiB,IAAI,IAAI;IASzC,OAAO,CAAC,iBAAiB;cAoBN,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAiB9D,oBAAoB,IAAI,IAAI;IAS5B,aAAa,CAC3B,IAAI,CAAC,EAAE,WAAW,EAClB,QAAQ,CAAC,EAAE,OAAO,EAClB,OAAO,CAAC,EAAE,mBAAmB,GAC5B,IAAI;IAQP,SAAS,CAAC,uBAAuB,IAAI,IAAI;IAiBzC,SAAS,CAAC,kCAAkC,IAAI,IAAI;IAKpD,SAAS,CAAC,2BAA2B,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI;IA0BzD,SAAS,CAAC,wBAAwB,IAAI,IAAI;IAO1C,SAAS,CAAC,qBAAqB,CAAC,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI;IAiBrD,SAAS,CAAC,qBAAqB,CAAC,KAAK,EAAE,cAAc,GAAG,IAAI;cAQzC,wBAAwB,CAAC,MAAM,CAAC,EAAE,2BAA2B,GAAG,OAAO;cAOvE,kBAAkB,CAAC,MAAM,CAAC,EAAE,2BAA2B,GAAG,OAAO;CAIrF"}
|
|
@@ -1,30 +1,30 @@
|
|
|
1
1
|
var A = (i) => {
|
|
2
2
|
throw TypeError(i);
|
|
3
3
|
};
|
|
4
|
-
var k = (i,
|
|
5
|
-
var
|
|
4
|
+
var k = (i, r, s) => r.has(i) || A("Cannot " + s);
|
|
5
|
+
var d = (i, r, s) => (k(i, r, "read from private field"), s ? s.call(i) : r.get(i)), b = (i, r, s) => r.has(i) ? A("Cannot add the same private member more than once") : r instanceof WeakSet ? r.add(i) : r.set(i, s), l = (i, r, s, u) => (k(i, r, "write to private field"), u ? u.call(i, s) : r.set(i, s), s);
|
|
6
6
|
import { __runInitializers as g, __esDecorate as f } from "tslib";
|
|
7
7
|
import { isServer as O } from "lit";
|
|
8
8
|
import { property as v } from "lit/decorators.js";
|
|
9
|
-
import { SbbFocusTrapController as
|
|
10
|
-
import { SbbOpenCloseBaseElement as
|
|
11
|
-
import { SbbLanguageController as
|
|
12
|
-
import { idReference as
|
|
9
|
+
import { SbbFocusTrapController as T } from "../core/a11y.js";
|
|
10
|
+
import { SbbOpenCloseBaseElement as F } from "../core/base-elements.js";
|
|
11
|
+
import { SbbLanguageController as S, SbbInertController as x, SbbEscapableOverlayController as I } from "../core/controllers.js";
|
|
12
|
+
import { idReference as z, forceType as w } from "../core/decorators.js";
|
|
13
13
|
import { SbbScrollHandler as U } from "../core/dom.js";
|
|
14
14
|
import { i18nDialog as D } from "../core/i18n.js";
|
|
15
15
|
import { SbbNegativeMixin as H } from "../core/mixins.js";
|
|
16
16
|
import { removeAriaOverlayTriggerAttributes as N, setAriaOverlayTriggerAttributes as $ } from "../core/overlay.js";
|
|
17
|
-
const
|
|
17
|
+
const p = [];
|
|
18
18
|
let Y = (() => {
|
|
19
19
|
var n, c, h, a;
|
|
20
|
-
let i = H(
|
|
20
|
+
let i = H(F), r, s = [], u = [], _, C = [], y = [], E, L = [], R = [];
|
|
21
21
|
return a = class extends i {
|
|
22
22
|
constructor() {
|
|
23
23
|
super(...arguments);
|
|
24
24
|
b(this, n);
|
|
25
25
|
b(this, c);
|
|
26
26
|
b(this, h);
|
|
27
|
-
l(this, n, g(this,
|
|
27
|
+
l(this, n, g(this, s, null)), l(this, c, (g(this, u), g(this, C, ""))), l(this, h, (g(this, y), g(this, L, !1))), this.lastFocusedElement = g(this, R), this.focusTrapController = new T(this), this.scrollHandler = new U(), this.language = new S(this), this.inertController = new x(this), this.escapableOverlayController = new I(this), this._ariaLiveRefToggle = !1, this._triggerElement = null;
|
|
28
28
|
}
|
|
29
29
|
/**
|
|
30
30
|
* The element that will trigger the menu overlay.
|
|
@@ -32,14 +32,14 @@ let Y = (() => {
|
|
|
32
32
|
* For attribute usage, provide an id reference.
|
|
33
33
|
*/
|
|
34
34
|
get trigger() {
|
|
35
|
-
return
|
|
35
|
+
return d(this, n);
|
|
36
36
|
}
|
|
37
37
|
set trigger(e) {
|
|
38
38
|
l(this, n, e);
|
|
39
39
|
}
|
|
40
40
|
/** This will be forwarded as aria-label to the relevant nested element to describe the purpose of the overlay. */
|
|
41
41
|
get accessibilityLabel() {
|
|
42
|
-
return
|
|
42
|
+
return d(this, c);
|
|
43
43
|
}
|
|
44
44
|
set accessibilityLabel(e) {
|
|
45
45
|
l(this, c, e);
|
|
@@ -50,14 +50,14 @@ let Y = (() => {
|
|
|
50
50
|
* you provide your own equivalent, if you decide to turn it off.
|
|
51
51
|
*/
|
|
52
52
|
get skipFocusRestoration() {
|
|
53
|
-
return
|
|
53
|
+
return d(this, h);
|
|
54
54
|
}
|
|
55
55
|
set skipFocusRestoration(e) {
|
|
56
56
|
l(this, h, e);
|
|
57
57
|
}
|
|
58
58
|
/** Opens the component. */
|
|
59
59
|
open() {
|
|
60
|
-
this.state === "closed" && (this.lastFocusedElement = document.activeElement, this.dispatchBeforeOpenEvent() && (this.showPopover?.(), this.state = "opening", this._triggerElement?.setAttribute("aria-expanded", "true"),
|
|
60
|
+
this.state === "closed" && (this.lastFocusedElement = document.activeElement, this.dispatchBeforeOpenEvent() && (this.showPopover?.(), this.state = "opening", this._triggerElement?.setAttribute("aria-expanded", "true"), p.push(this), this.scrollHandler.disableScroll(), this.isZeroAnimationDuration() && this.handleOpening()));
|
|
61
61
|
}
|
|
62
62
|
/** Closes the component. */
|
|
63
63
|
close(e, t) {
|
|
@@ -80,7 +80,9 @@ let Y = (() => {
|
|
|
80
80
|
})));
|
|
81
81
|
}
|
|
82
82
|
firstUpdated(e) {
|
|
83
|
-
super.firstUpdated(e), this._ariaLiveRef = this.shadowRoot.querySelector("sbb-screen-reader-only"), this._configureTrigger()
|
|
83
|
+
super.firstUpdated(e), this._ariaLiveRef = this.shadowRoot.querySelector("sbb-screen-reader-only"), this._configureTrigger(), this.isOpen && setTimeout(() => {
|
|
84
|
+
this.focusTrapController.focusInitialElement();
|
|
85
|
+
}, 0);
|
|
84
86
|
}
|
|
85
87
|
disconnectedCallback() {
|
|
86
88
|
super.disconnectedCallback(), this.openOverlayController?.abort(), this.removeInstanceFromGlobalCollection(), this.scrollHandler.enableScroll(), this._triggerElement = null, this._triggerAbortController?.abort();
|
|
@@ -98,21 +100,21 @@ let Y = (() => {
|
|
|
98
100
|
});
|
|
99
101
|
}
|
|
100
102
|
removeInstanceFromGlobalCollection() {
|
|
101
|
-
|
|
103
|
+
p.splice(p.indexOf(this), 1);
|
|
102
104
|
}
|
|
103
105
|
// Close the component on click of any element that has the `closeAttribute` attribute.
|
|
104
106
|
closeOnSbbOverlayCloseClick(e) {
|
|
105
|
-
const t = e.composedPath().filter((
|
|
107
|
+
const t = e.composedPath().filter((m) => m instanceof window.HTMLElement).find((m) => (m.hasAttribute(this.closeAttribute) || m.localName === this.closeTag) && !m.hasAttribute("disabled"));
|
|
106
108
|
if (!t || t.closest(this.localName) !== this && !this.shadowRoot?.contains(t))
|
|
107
109
|
return;
|
|
108
110
|
const o = t.getAttribute("type") === "submit" ? t.form ?? null : null;
|
|
109
|
-
|
|
111
|
+
p[p.length - 1].close(o, t);
|
|
110
112
|
}
|
|
111
113
|
removeAriaLiveRefContent() {
|
|
112
|
-
this._ariaLiveRef.textContent = "";
|
|
114
|
+
this._ariaLiveRef && (this._ariaLiveRef.textContent = "");
|
|
113
115
|
}
|
|
114
116
|
setAriaLiveRefContent(e) {
|
|
115
|
-
this._ariaLiveRefToggle = !this._ariaLiveRefToggle, this._ariaLiveRef.textContent = `${D[this.language.current]}${e ? `, ${e}` : ""}${this._ariaLiveRefToggle ? " " : ""}
|
|
117
|
+
this._ariaLiveRef && (this._ariaLiveRefToggle = !this._ariaLiveRefToggle, this._ariaLiveRef.textContent = `${D[this.language.current]}${e ? `, ${e}` : ""}${this._ariaLiveRefToggle ? " " : ""}`);
|
|
116
118
|
}
|
|
117
119
|
// Wait for dialog transition to complete.
|
|
118
120
|
// In rare cases, it can be that the animationEnd event is triggered twice.
|
|
@@ -128,9 +130,9 @@ let Y = (() => {
|
|
|
128
130
|
}
|
|
129
131
|
}, n = new WeakMap(), c = new WeakMap(), h = new WeakMap(), (() => {
|
|
130
132
|
const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(i[Symbol.metadata] ?? null) : void 0;
|
|
131
|
-
|
|
133
|
+
r = [z(), v()], _ = [w(), v({ attribute: "accessibility-label" })], E = [w(), v({ type: Boolean })], f(a, null, r, { kind: "accessor", name: "trigger", static: !1, private: !1, access: { has: (t) => "trigger" in t, get: (t) => t.trigger, set: (t, o) => {
|
|
132
134
|
t.trigger = o;
|
|
133
|
-
} }, metadata: e },
|
|
135
|
+
} }, metadata: e }, s, u), f(a, null, _, { kind: "accessor", name: "accessibilityLabel", static: !1, private: !1, access: { has: (t) => "accessibilityLabel" in t, get: (t) => t.accessibilityLabel, set: (t, o) => {
|
|
134
136
|
t.accessibilityLabel = o;
|
|
135
137
|
} }, metadata: e }, C, y), f(a, null, E, { kind: "accessor", name: "skipFocusRestoration", static: !1, private: !1, access: { has: (t) => "skipFocusRestoration" in t, get: (t) => t.skipFocusRestoration, set: (t, o) => {
|
|
136
138
|
t.skipFocusRestoration = o;
|
|
@@ -139,5 +141,5 @@ let Y = (() => {
|
|
|
139
141
|
})();
|
|
140
142
|
export {
|
|
141
143
|
Y as SbbOverlayBaseElement,
|
|
142
|
-
|
|
144
|
+
p as overlayRefs
|
|
143
145
|
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { CSSResultGroup, TemplateResult } from 'lit';
|
|
1
|
+
import { CSSResultGroup, PropertyValues, TemplateResult } from 'lit';
|
|
2
2
|
import { SbbOverlayBaseElement } from './overlay-base-element.ts';
|
|
3
3
|
/**
|
|
4
4
|
* It displays an interactive overlay element.
|
|
@@ -26,6 +26,7 @@ export declare class SbbOverlayElement extends SbbOverlayBaseElement {
|
|
|
26
26
|
protected closeAttribute: string;
|
|
27
27
|
private _overlayContentElement;
|
|
28
28
|
connectedCallback(): void;
|
|
29
|
+
protected firstUpdated(changedProperties: PropertyValues<this>): void;
|
|
29
30
|
protected isZeroAnimationDuration(): boolean;
|
|
30
31
|
protected handleOpening(): void;
|
|
31
32
|
protected handleClosing(): void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"overlay.component.d.ts","sourceRoot":"","sources":["../../../src/elements/overlay/overlay.component.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;
|
|
1
|
+
{"version":3,"file":"overlay.component.d.ts","sourceRoot":"","sources":["../../../src/elements/overlay/overlay.component.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAW1E,OAAO,EAAe,qBAAqB,EAAE,MAAM,2BAA2B,CAAC;AAG/E,OAAO,+BAA+B,CAAC;AACvC,OAAO,iCAAiC,CAAC;AACzC,OAAO,iBAAiB,CAAC;AACzB,OAAO,0BAA0B,CAAC;AAIlC;;;;;;;GAOG;AACH,qBAEM,iBAAkB,SAAQ,qBAAqB;IACnD,OAAuB,MAAM,EAAE,cAAc,CAA4B;IAGzE,gBAAgC,MAAM;;;;;MAK3B;IAEX;;;OAGG;IACH,SAEgB,QAAQ,EAAE,OAAO,CAAS;IAE1C,wEAAwE;IACxE,SAEgB,uBAAuB,EAAE,MAAM,CAAM;IAErD,SAAS,CAAC,cAAc,EAAE,MAAM,CAAuB;IACvD,OAAO,CAAC,sBAAsB,CAA4B;IAE1C,iBAAiB,IAAI,IAAI;cAMtB,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAS9E,SAAS,CAAC,uBAAuB,IAAI,OAAO;IAI5C,SAAS,CAAC,aAAa,IAAI,IAAI;cAYZ,aAAa,IAAI,IAAI;cAuBrB,MAAM,IAAI,cAAc;CAuC5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,aAAa,EAAE,iBAAiB,CAAC;KAClC;CACF"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
var k = (e) => {
|
|
2
2
|
throw TypeError(e);
|
|
3
3
|
};
|
|
4
|
-
var w = (e,
|
|
5
|
-
var
|
|
4
|
+
var w = (e, a, s) => a.has(e) || k("Cannot " + s);
|
|
5
|
+
var v = (e, a, s) => (w(e, a, "read from private field"), s ? s.call(e) : a.get(e)), p = (e, a, s) => a.has(e) ? k("Cannot add the same private member more than once") : a instanceof WeakSet ? a.add(e) : a.set(e, s), b = (e, a, s, r) => (w(e, a, "write to private field"), r ? r.call(e, s) : a.set(e, s), s);
|
|
6
6
|
import { __runInitializers as c, __esDecorate as h } from "tslib";
|
|
7
7
|
import { customElement as O, property as C } from "lit/decorators.js";
|
|
8
8
|
import { ref as L } from "lit/directives/ref.js";
|
|
@@ -12,16 +12,16 @@ import { isZeroAnimationDuration as S } from "../core/dom.js";
|
|
|
12
12
|
import { forwardEvent as T } from "../core/eventing.js";
|
|
13
13
|
import { i18nCloseDialog as $ } from "../core/i18n.js";
|
|
14
14
|
import { boxSizingStyles as I } from "../core/styles.js";
|
|
15
|
-
import { SbbOverlayBaseElement as
|
|
16
|
-
import { css as
|
|
15
|
+
import { SbbOverlayBaseElement as A, overlayRefs as D } from "./overlay-base-element.js";
|
|
16
|
+
import { css as R } from "lit";
|
|
17
17
|
import "../button/secondary-button.js";
|
|
18
18
|
import "../button/transparent-button.js";
|
|
19
19
|
import "../container.js";
|
|
20
20
|
import "../screen-reader-only.js";
|
|
21
|
-
const
|
|
22
|
-
let
|
|
21
|
+
const Y = R`:host{--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-black) 30%, transparent);--sbb-scrollbar-color: light-dark( color-mix(in srgb, var(--sbb-color-black) 30%, transparent), color-mix(in srgb, var(--sbb-color-white) 30%, transparent) );--sbb-scrollbar-color-hover: color-mix(in srgb, var(--sbb-color-black) 60%, transparent);--sbb-scrollbar-color-hover: light-dark( color-mix(in srgb, var(--sbb-color-black) 60%, transparent), color-mix(in srgb, var(--sbb-color-white) 60%, transparent) );--sbb-scrollbar-track-color: transparent;--sbb-overlay-background-color: var(--sbb-background-color-3);--sbb-overlay-height: 100%;--sbb-overlay-inset: 0 auto auto 0;--sbb-overlay-padding-block: calc(var(--sbb-spacing-fixed-14x) + var(--sbb-spacing-responsive-l));--sbb-overlay-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-6x) );--sbb-overlay-animation-easing: ease;--sbb-overlay-pointer-events: none;display:none;position:fixed;inset:var(--sbb-overlay-inset);z-index:var(--sbb-overlay-z-index, var(--sbb-overlay-default-z-index))}: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(:is(:state(state-opening),[state--state-opening]),:is(:state(state-opened),[state--state-opened]))){--sbb-overlay-pointer-events: all}:host([negative]){--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-focus-outline-color: var(--sbb-focus-outline-color-dark);--sbb-overlay-color: var(--sbb-color-1-negative);--sbb-overlay-background-color: var(--sbb-background-color-3-negative)}:host(:not(:is(:state(state-closed),[state--state-closed]))){--sbb-overlay-inset: 0}.sbb-overlay__container{background-color:var(--sbb-overlay-background-color);pointer-events:var(--sbb-overlay-pointer-events);display:none;align-items:center;position:fixed;inset:var(--sbb-overlay-inset)}:host(:is(:is(:state(state-opening),[state--state-opening]),:is(:state(state-opened),[state--state-opened]),:is(:state(state-closing),[state--state-closing]))) .sbb-overlay__container{display:flex;animation-name:open;animation-duration:var(--sbb-overlay-animation-duration);animation-timing-function:var(--sbb-overlay-animation-easing)}:host(:is(:state(state-closing),[state--state-closing])) .sbb-overlay__container{pointer-events:none;animation-name:close}.sbb-overlay{position:absolute;inset-inline:0;margin:auto;padding:0;border:none;height:var(--sbb-overlay-height);overflow:auto;color:var(--sbb-overlay-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-overlay{animation-name:open-move-in;animation-duration:var(--sbb-overlay-animation-duration);animation-timing-function:var(--sbb-overlay-animation-easing)}:host(:is(:state(state-closing),[state--state-closing])) .sbb-overlay{animation-name:close-move-out}.sbb-overlay__wrapper{display:flex;flex-direction:column;width:100%;height:var(--sbb-overlay-height);outline:none;position:fixed}@media(min-width:64rem){.sbb-overlay__wrapper{position:sticky;inset-block-start:0;height:auto}}.sbb-overlay__header{position:absolute;inset-inline-start:0;display:flex;pointer-events:none;align-items:start;justify-content:space-between;width:100%;padding:var(--sbb-spacing-responsive-xs);padding-block-end:0;z-index:1}.sbb-overlay__header *{pointer-events:all}.sbb-overlay__close{margin-inline-start:auto}.sbb-overlay__content{--sbb-scrollbar-width: var(--sbb-spacing-fixed-3x)}.sbb-overlay__content::-webkit-scrollbar{width:var(--sbb-scrollbar-width);height:var(--sbb-scrollbar-width);background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-overlay__content::-webkit-scrollbar-corner{background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-overlay__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-overlay__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-overlay__content::-webkit-scrollbar-button,.sbb-overlay__content::-webkit-scrollbar-corner{display:none}@supports not selector(::-webkit-scrollbar){.sbb-overlay__content{scrollbar-width:var(--sbb-scrollbar-width-firefox);scrollbar-color:var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent)}}.sbb-overlay__content{height:100vh;overflow:auto;-webkit-overflow-scrolling:touch}.sbb-overlay__content-container{padding-block:var(--sbb-overlay-padding-block)}@keyframes open{0%{opacity:0}to{opacity:1}}@keyframes open-move-in{0%{transform:translateY(var(--sbb-spacing-fixed-4x))}to{transform:translateY(0)}}@keyframes close{0%{opacity:1}to{opacity:0}}@keyframes close-move-out{0%{transform:translateY(0)}to{transform:translateY(var(--sbb-spacing-fixed-4x))}}`;
|
|
22
|
+
let j = 0, te = (() => {
|
|
23
23
|
var l, n, i;
|
|
24
|
-
let e = [O("sbb-overlay")],
|
|
24
|
+
let e = [O("sbb-overlay")], a, s = [], r, m = A, y, u = [], g = [], _, f = [], x = [];
|
|
25
25
|
return i = class extends m {
|
|
26
26
|
constructor() {
|
|
27
27
|
super(...arguments);
|
|
@@ -34,20 +34,23 @@ let F = 0, te = (() => {
|
|
|
34
34
|
* By default, the content has the appropriate page size.
|
|
35
35
|
*/
|
|
36
36
|
get expanded() {
|
|
37
|
-
return
|
|
37
|
+
return v(this, l);
|
|
38
38
|
}
|
|
39
|
-
set expanded(
|
|
40
|
-
b(this, l,
|
|
39
|
+
set expanded(t) {
|
|
40
|
+
b(this, l, t);
|
|
41
41
|
}
|
|
42
42
|
/** This will be forwarded as aria-label to the close button element. */
|
|
43
43
|
get accessibilityCloseLabel() {
|
|
44
|
-
return
|
|
44
|
+
return v(this, n);
|
|
45
45
|
}
|
|
46
|
-
set accessibilityCloseLabel(
|
|
47
|
-
b(this, n,
|
|
46
|
+
set accessibilityCloseLabel(t) {
|
|
47
|
+
b(this, n, t);
|
|
48
48
|
}
|
|
49
49
|
connectedCallback() {
|
|
50
|
-
this.id ||= `sbb-overlay-${
|
|
50
|
+
this.id ||= `sbb-overlay-${j++}`, super.connectedCallback();
|
|
51
|
+
}
|
|
52
|
+
firstUpdated(t) {
|
|
53
|
+
super.firstUpdated(t), this.isOpen && this.setAriaLiveRefContent();
|
|
51
54
|
}
|
|
52
55
|
isZeroAnimationDuration() {
|
|
53
56
|
return S(this, "--sbb-overlay-animation-duration");
|
|
@@ -56,7 +59,7 @@ let F = 0, te = (() => {
|
|
|
56
59
|
this.state = "opened", this.inertController.activate(), this.escapableOverlayController.connect(), this.attachOpenOverlayEvents(), this.focusTrapController.focusInitialElement(), setTimeout(() => this.setAriaLiveRefContent(this.accessibilityLabel)), this.focusTrapController.enabled = !0, this.dispatchOpenEvent();
|
|
57
60
|
}
|
|
58
61
|
handleClosing() {
|
|
59
|
-
this._overlayContentElement?.scrollTo(0, 0), this.state = "closed", this.hidePopover?.(), this.inertController.deactivate(), this.skipFocusRestoration || this.lastFocusedElement?.focus(), this.openOverlayController?.abort(), this.focusTrapController.enabled = !1, this.removeInstanceFromGlobalCollection(),
|
|
62
|
+
this._overlayContentElement?.scrollTo(0, 0), this.state = "closed", this.hidePopover?.(), this.inertController.deactivate(), this.skipFocusRestoration || this.lastFocusedElement?.focus(), this.openOverlayController?.abort(), this.focusTrapController.enabled = !1, this.removeInstanceFromGlobalCollection(), D.length || this.scrollHandler.enableScroll(), this.escapableOverlayController.disconnect(), this.dispatchCloseEvent({
|
|
60
63
|
returnValue: this.returnValue,
|
|
61
64
|
closeTarget: this.overlayCloseElement
|
|
62
65
|
});
|
|
@@ -66,7 +69,7 @@ let F = 0, te = (() => {
|
|
|
66
69
|
<div class="sbb-overlay__container" @animationend=${this.onOverlayAnimationEnd}>
|
|
67
70
|
<div class="sbb-overlay">
|
|
68
71
|
<div
|
|
69
|
-
@click=${(
|
|
72
|
+
@click=${(t) => this.closeOnSbbOverlayCloseClick(t)}
|
|
70
73
|
class="sbb-overlay__wrapper"
|
|
71
74
|
>
|
|
72
75
|
<div class="sbb-overlay__header">
|
|
@@ -82,8 +85,8 @@ let F = 0, te = (() => {
|
|
|
82
85
|
</div>
|
|
83
86
|
<div
|
|
84
87
|
class="sbb-overlay__content"
|
|
85
|
-
${L((
|
|
86
|
-
@scroll=${(
|
|
88
|
+
${L((t) => this._overlayContentElement = t)}
|
|
89
|
+
@scroll=${(t) => T(t, document)}
|
|
87
90
|
>
|
|
88
91
|
<sbb-container
|
|
89
92
|
class="sbb-overlay__content-container"
|
|
@@ -100,13 +103,13 @@ let F = 0, te = (() => {
|
|
|
100
103
|
`;
|
|
101
104
|
}
|
|
102
105
|
}, l = new WeakMap(), n = new WeakMap(), r = i, (() => {
|
|
103
|
-
const
|
|
104
|
-
y = [E(), C({ reflect: !0, type: Boolean })], _ = [E(), C({ attribute: "accessibility-close-label" })], h(i, null, y, { kind: "accessor", name: "expanded", static: !1, private: !1, access: { has: (o) => "expanded" in o, get: (o) => o.expanded, set: (o,
|
|
105
|
-
o.expanded =
|
|
106
|
-
} }, metadata:
|
|
107
|
-
o.accessibilityCloseLabel =
|
|
108
|
-
} }, metadata:
|
|
109
|
-
})(), i.styles = [I,
|
|
106
|
+
const t = typeof Symbol == "function" && Symbol.metadata ? Object.create(m[Symbol.metadata] ?? null) : void 0;
|
|
107
|
+
y = [E(), C({ reflect: !0, type: Boolean })], _ = [E(), C({ attribute: "accessibility-close-label" })], h(i, null, y, { kind: "accessor", name: "expanded", static: !1, private: !1, access: { has: (o) => "expanded" in o, get: (o) => o.expanded, set: (o, d) => {
|
|
108
|
+
o.expanded = d;
|
|
109
|
+
} }, metadata: t }, u, g), h(i, null, _, { kind: "accessor", name: "accessibilityCloseLabel", static: !1, private: !1, access: { has: (o) => "accessibilityCloseLabel" in o, get: (o) => o.accessibilityCloseLabel, set: (o, d) => {
|
|
110
|
+
o.accessibilityCloseLabel = d;
|
|
111
|
+
} }, metadata: t }, f, x), h(null, a = { value: r }, e, { kind: "class", name: r.name, metadata: t }, null, s), r = a.value, t && Object.defineProperty(r, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
|
|
112
|
+
})(), i.styles = [I, Y], i.events = {
|
|
110
113
|
beforeopen: "beforeopen",
|
|
111
114
|
open: "open",
|
|
112
115
|
beforeclose: "beforeclose",
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sbb-esta/lyne-elements",
|
|
3
|
-
"version": "4.0.
|
|
3
|
+
"version": "4.0.4",
|
|
4
4
|
"description": "Lyne Design System",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"design system",
|
|
@@ -11,8 +11,8 @@
|
|
|
11
11
|
"type": "module",
|
|
12
12
|
"customElements": "custom-elements.json",
|
|
13
13
|
"dependencies": {
|
|
14
|
-
"@lit-labs/observers": "^2.0
|
|
15
|
-
"lit": "^3.3.
|
|
14
|
+
"@lit-labs/observers": "^2.1.0",
|
|
15
|
+
"lit": "^3.3.2",
|
|
16
16
|
"tslib": "^2.8.1"
|
|
17
17
|
},
|
|
18
18
|
"publishConfig": {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"popover.component.d.ts","sourceRoot":"","sources":["../../../src/elements/popover/popover.component.ts"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"popover.component.d.ts","sourceRoot":"","sources":["../../../src/elements/popover/popover.component.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,mBAAmB,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAW/F,OAAO,EAAE,uBAAuB,EAAE,MAAM,0BAA0B,CAAC;AAsBnE,OAAO,+BAA+B,CAAC;;AAUvC,8BAAsB,qBAAsB,SAAQ,0BAA0C;IAC5F,OAAuB,MAAM,EAAE,cAAc,CAA4B;IAEzE;;;;OAIG;IACH,SAEgB,OAAO,EAAE,WAAW,GAAG,IAAI,CAAQ;IAGnD,OAAO,CAAC,mBAAmB,CAAC,CAAc;IAC1C,OAAO,CAAC,eAAe,CAAkB;IACzC,OAAO,CAAC,oBAAoB,CAAC,CAAc;IAC3C,OAAO,CAAC,4BAA4B,CAAC,CAAU;IAC/C,OAAO,CAAC,eAAe,CAAC,CAAqB;IAC7C,OAAO,CAAC,uBAAuB,CAAmB;IAClD,OAAO,CAAC,oBAAoB,CAAmB;IAC/C,OAAO,CAAC,2BAA2B,CAA2C;IAC9E,OAAO,CAAC,oBAAoB,CAAoC;IAChE,OAAO,CAAC,YAAY,CAA8C;IAClE,SAAS,CAAC,YAAY,CAAC,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;IACvD,SAAS,CAAC,OAAO,CAAC,EAAE,cAAc,CAAC;IAEnC,0CAA0C;IACnC,IAAI,IAAI,IAAI;IA+BnB,0BAA0B;IACnB,KAAK,CAAC,MAAM,CAAC,EAAE,WAAW,GAAG,IAAI;IAqBxC,OAAO,CAAC,wBAAwB;IAIhC,OAAO,CAAC,cAAc;IAoBtB,OAAO,CAAC,cAAc;IAUN,iBAAiB,IAAI,IAAI;IAWzB,aAAa,CAC3B,IAAI,CAAC,EAAE,WAAW,EAClB,QAAQ,CAAC,EAAE,OAAO,EAClB,OAAO,CAAC,EAAE,mBAAmB,GAC5B,IAAI;cAUY,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAK9D,oBAAoB,IAAI,IAAI;IAY5C,OAAO,CAAC,iBAAiB;IAWzB,SAAS,CAAC,gBAAgB,CAAC,WAAW,EAAE,WAAW,GAAG,IAAI,GAAG,IAAI;IAejE,SAAS,CAAC,wBAAwB,CAAC,MAAM,EAAE,WAAW,GAAG,IAAI;IAI7D,OAAO,CAAC,mBAAmB;IAuB3B,OAAO,CAAC,4BAA4B;IAUpC,OAAO,CAAC,oBAAoB,CAE1B;IAGF,OAAO,CAAC,qBAAqB,CAS3B;IAMF,OAAO,CAAC,sBAAsB;IAS9B,OAAO,CAAC,gBAAgB;IA0CxB,OAAO,CAAC,mBAAmB;IAiC3B,SAAS,CAAC,QAAQ,CAAC,aAAa,IAAI,cAAc;cAE/B,wBAAwB,CAAC,MAAM,CAAC,EAAE;QACnD,WAAW,EAAE,WAAW,GAAG,IAAI,CAAC;KACjC,GAAG,OAAO;cAaQ,kBAAkB,CAAC,MAAM,CAAC,EAAE;QAAE,WAAW,EAAE,WAAW,GAAG,IAAI,CAAA;KAAE,GAAG,OAAO;cAUzE,MAAM,IAAI,cAAc;CAmB5C;AAED;;;;;;;GAOG;AACH,qBAEM,iBAAkB,SAAQ,qBAAqB;IACnD,iDAAiD;IACjD,SAEgB,eAAe,EAAE,OAAO,CAAS;IAEjD,wDAAwD;IACxD,SAEgB,YAAY,EAAE,OAAO,CAAS;IAE9C;;;;;OAKG;IACH,IACW,SAAS,CAAC,KAAK,EAAE,MAAM,EAEjC;IACD,IAAW,SAAS,IAAI,MAAM,CAE7B;IACD,OAAO,CAAC,UAAU,CAAC,CAAS;IAE5B;;;;;OAKG;IACH,IACW,UAAU,CAAC,KAAK,EAAE,MAAM,EAElC;IACD,IAAW,UAAU,IAAI,MAAM,CAE9B;IACD,OAAO,CAAC,WAAW,CAAC,CAAS;IAE7B,wEAAwE;IACxE,SAEgB,uBAAuB,EAAE,MAAM,CAAM;IAErD,OAAO,CAAC,aAAa,CAAS;IAC9B,OAAO,CAAC,YAAY,CAAC,CAAgC;IACrD,OAAO,CAAC,SAAS,CAAmC;IACpD,OAAO,CAAC,uBAAuB,CAAgC;cAE5C,gBAAgB,CAAC,UAAU,EAAE,WAAW,GAAG,IAAI,GAAG,IAAI;IAmBzE,OAAO,CAAC,yBAAyB;cAcd,wBAAwB,CAAC,MAAM,EAAE,WAAW,GAAG,IAAI;cA4BnD,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAM9D,IAAI,IAAI,IAAI;IAQZ,KAAK,IAAI,IAAI;IAM7B,OAAO,CAAC,oBAAoB,CAW1B;IAEF,OAAO,CAAC,oBAAoB,CAM1B;IAEF,OAAO,CAAC,oBAAoB,CAI1B;IAEF,OAAO,CAAC,oBAAoB,CAI1B;cAEiB,aAAa,IAAI,cAAc;CAkBnD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,aAAa,EAAE,iBAAiB,CAAC;KAClC;CACF"}
|
|
@@ -19,7 +19,7 @@ import { SbbHydrationMixin as te, ɵstateController as I } from "../core/mixins.
|
|
|
19
19
|
import { isEventOnElement as $, removeAriaOverlayTriggerAttributes as oe, setAriaOverlayTriggerAttributes as re, getElementPosition as se } from "../core/overlay.js";
|
|
20
20
|
import { boxSizingStyles as ie } from "../core/styles.js";
|
|
21
21
|
import "../button/secondary-button.js";
|
|
22
|
-
const ae = U`:host{--sbb-popover-position: absolute;--sbb-popover-position-x: 0;--sbb-popover-position-y: 0;--sbb-popover-arrow-size: var(--sbb-spacing-fixed-4x);--sbb-popover-arrow-position-x: 0;--sbb-popover-max-width: calc(100% - var(--sbb-spacing-fixed-2x));--sbb-popover-inset: 0 auto auto 0;--sbb-popover-border-radius: var(--sbb-border-radius-8x);--sbb-popover-padding: var(--sbb-spacing-fixed-4x);--sbb-popover-background: var(--sbb-background-color-1);--sbb-popover-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-4x) );--sbb-popover-animation-easing: ease-out;--sbb-popover-transform: translateY(var(--sbb-spacing-fixed-2x));--sbb-focus-outline-color: var(--sbb-focus-outline-color-default);--sbb-focus-outline-color: light-dark( var(--sbb-focus-outline-color-default), var(--sbb-focus-outline-color-dark) );outline:none!important;display:none}: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;--sbb-popover-inset: 0}:host(:is(:state(position-above),[state--position-above])){--sbb-popover-transform: translateY(calc(var(--sbb-spacing-fixed-2x) * -1))}.sbb-popover:after,.sbb-popover__content:before{content:"";position:absolute;display:block;width:var(--sbb-popover-arrow-size);height:var(--sbb-popover-arrow-size);left:var(--sbb-popover-arrow-position-x);bottom:calc(100% - var(--sbb-popover-arrow-size) / 2);background-color:var(--sbb-popover-background);border-radius:var(--sbb-border-radius-2x) 0;transform:rotate(45deg)}.sbb-popover__container{position:fixed;inset:var(--sbb-popover-inset);pointer-events:none;z-index:var(--sbb-popover-z-index, var(--sbb-overlay-default-z-index))}.sbb-popover{box-shadow:var(--sbb-box-shadow-level-5-hard);display:none;position:var(--sbb-popover-position);pointer-events:all;top:var(--sbb-popover-position-y);bottom:unset;left:var(--sbb-popover-position-x);right:unset;border:none;border-radius:var(--sbb-popover-border-radius);padding:0;max-width:var(--sbb-popover-max-width);width:max-content;background-color:var(--sbb-popover-background);outline:none}:host(:focus-visible) .sbb-popover{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width)}:host(:is(:is(:state(state-opening),[state--state-opening]),:is(:state(state-opened),[state--state-opened]),:is(:state(state-closing),[state--state-closing]))) .sbb-popover{display:block;animation-name:open;animation-duration:var(--sbb-popover-animation-duration);animation-timing-function:var(--sbb-popover-animation-easing)}:host(:is(:state(state-closing),[state--state-closing])) .sbb-popover{pointer-events:none;animation-name:close;animation-duration:var(--sbb-popover-animation-duration);animation-timing-function:var(--sbb-popover-animation-easing)}.sbb-popover:after{z-index:-1;box-shadow:var(--sbb-box-shadow-level-5-hard)}@media(forced-colors:active){.sbb-popover:after{outline:var(--sbb-border-width-1x) solid CanvasText}}:host(:is(:state(position-above),[state--position-above])) .sbb-popover:after{top:calc(100% - var(--sbb-popover-arrow-size) / 2)}@media(forced-colors:active){.sbb-popover{outline:var(--sbb-border-width-1x) solid CanvasText}}.sbb-popover:before{content:"";display:block;position:absolute;inset:0;z-index:-1;background-color:transparent}:host(:is(:state(position-below),[state--position-below])) .sbb-popover:before{inset-block-start:calc(-1 * var(--sbb-spacing-fixed-6x))}:host(:is(:state(position-above),[state--position-above])) .sbb-popover:before{inset-block-end:calc(-1 * var(--sbb-spacing-fixed-6x))}.sbb-popover__content{display:flex;gap:var(--sbb-spacing-fixed-4x);border-radius:var(--sbb-popover-border-radius);padding-block:var(--sbb-popover-padding) 0;padding-inline:var(--sbb-popover-padding);outline:none;background-color:var(--sbb-popover-background);flex-direction:row-reverse}:host(:is(:state(position-above),[state--position-above])) .sbb-popover__content:before{top:calc(100% - var(--sbb-popover-arrow-size) / 2)}.sbb-popover__scrollable-content{--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-black) 30%, transparent);--sbb-scrollbar-color: light-dark( color-mix(in srgb, var(--sbb-color-black) 30%, transparent), color-mix(in srgb, var(--sbb-color-white) 30%, transparent) );--sbb-scrollbar-color-hover: color-mix(in srgb, var(--sbb-color-black) 60%, transparent);--sbb-scrollbar-color-hover: light-dark( color-mix(in srgb, var(--sbb-color-black) 60%, transparent), color-mix(in srgb, var(--sbb-color-white) 60%, transparent) );--sbb-scrollbar-track-color: transparent;--sbb-scrollbar-width: var(--sbb-spacing-fixed-3x)}.sbb-popover__scrollable-content::-webkit-scrollbar{width:var(--sbb-scrollbar-width);height:var(--sbb-scrollbar-width);background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-popover__scrollable-content::-webkit-scrollbar-corner{background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-popover__scrollable-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-popover__scrollable-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-popover__scrollable-content::-webkit-scrollbar-button,.sbb-popover__scrollable-content::-webkit-scrollbar-corner{display:none}@supports not selector(::-webkit-scrollbar){.sbb-popover__scrollable-content{scrollbar-width:var(--sbb-scrollbar-width-firefox);scrollbar-color:var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent)}}.sbb-popover__scrollable-content{display:block;padding-block-end:var(--sbb-popover-padding);max-height:calc(var(--sbb-popover-max-height));overflow:auto}@keyframes open{0%{opacity:0;transform:var(--sbb-popover-transform)}to{opacity:1;transform:translateY(0)}}@keyframes close{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:var(--sbb-popover-transform)}}`, ne = 16, le = 32;
|
|
22
|
+
const ae = U`:host{--sbb-popover-position: absolute;--sbb-popover-position-x: 0;--sbb-popover-position-y: 0;--sbb-popover-arrow-size: var(--sbb-spacing-fixed-4x);--sbb-popover-arrow-position-x: 0;--sbb-popover-max-width: calc(100% - var(--sbb-spacing-fixed-2x));--sbb-popover-inset: 0 auto auto 0;--sbb-popover-border-radius: var(--sbb-border-radius-8x);--sbb-popover-padding: var(--sbb-spacing-fixed-4x);--sbb-popover-background: var(--sbb-background-color-1);--sbb-popover-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-4x) );--sbb-popover-animation-easing: ease-out;--sbb-popover-transform: translateY(var(--sbb-spacing-fixed-2x));--sbb-focus-outline-color: var(--sbb-focus-outline-color-default);--sbb-focus-outline-color: light-dark( var(--sbb-focus-outline-color-default), var(--sbb-focus-outline-color-dark) );outline:none!important;display:none}: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;--sbb-popover-inset: 0}:host(:is(:state(position-above),[state--position-above])){--sbb-popover-transform: translateY(calc(var(--sbb-spacing-fixed-2x) * -1))}:host(:not([hide-close-button],:is(:state(hover-trigger),[state--hover-trigger]))){--sbb-popover-min-height: calc(var(--sbb-size-element-xs) + 2 * var(--sbb-popover-padding))}.sbb-popover:after,.sbb-popover__content:before{content:"";position:absolute;display:block;width:var(--sbb-popover-arrow-size);height:var(--sbb-popover-arrow-size);left:var(--sbb-popover-arrow-position-x);bottom:calc(100% - var(--sbb-popover-arrow-size) / 2);background-color:var(--sbb-popover-background);border-radius:var(--sbb-border-radius-2x) 0;transform:rotate(45deg)}.sbb-popover__container{position:fixed;inset:var(--sbb-popover-inset);pointer-events:none;z-index:var(--sbb-popover-z-index, var(--sbb-overlay-default-z-index))}.sbb-popover{box-shadow:var(--sbb-box-shadow-level-5-hard);display:none;position:var(--sbb-popover-position);pointer-events:all;top:var(--sbb-popover-position-y);bottom:unset;left:var(--sbb-popover-position-x);right:unset;border:none;border-radius:var(--sbb-popover-border-radius);padding:0;max-width:var(--sbb-popover-max-width);width:max-content;background-color:var(--sbb-popover-background);outline:none}:host(:focus-visible) .sbb-popover{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width)}:host(:is(:is(:state(state-opening),[state--state-opening]),:is(:state(state-opened),[state--state-opened]),:is(:state(state-closing),[state--state-closing]))) .sbb-popover{display:block;animation-name:open;animation-duration:var(--sbb-popover-animation-duration);animation-timing-function:var(--sbb-popover-animation-easing)}:host(:is(:state(state-closing),[state--state-closing])) .sbb-popover{pointer-events:none;animation-name:close;animation-duration:var(--sbb-popover-animation-duration);animation-timing-function:var(--sbb-popover-animation-easing)}.sbb-popover:after{z-index:-1;box-shadow:var(--sbb-box-shadow-level-5-hard)}@media(forced-colors:active){.sbb-popover:after{outline:var(--sbb-border-width-1x) solid CanvasText}}:host(:is(:state(position-above),[state--position-above])) .sbb-popover:after{top:calc(100% - var(--sbb-popover-arrow-size) / 2)}@media(forced-colors:active){.sbb-popover{outline:var(--sbb-border-width-1x) solid CanvasText}}.sbb-popover:before{content:"";display:block;position:absolute;inset:0;z-index:-1;background-color:transparent}:host(:is(:state(position-below),[state--position-below])) .sbb-popover:before{inset-block-start:calc(-1 * var(--sbb-spacing-fixed-6x))}:host(:is(:state(position-above),[state--position-above])) .sbb-popover:before{inset-block-end:calc(-1 * var(--sbb-spacing-fixed-6x))}.sbb-popover__content{display:flex;gap:var(--sbb-spacing-fixed-4x);border-radius:var(--sbb-popover-border-radius);padding-block:var(--sbb-popover-padding) 0;padding-inline:var(--sbb-popover-padding);outline:none;background-color:var(--sbb-popover-background);flex-direction:row-reverse;min-height:var(--sbb-popover-min-height)}:host(:is(:state(position-above),[state--position-above])) .sbb-popover__content:before{top:calc(100% - var(--sbb-popover-arrow-size) / 2)}.sbb-popover__scrollable-content{--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-black) 30%, transparent);--sbb-scrollbar-color: light-dark( color-mix(in srgb, var(--sbb-color-black) 30%, transparent), color-mix(in srgb, var(--sbb-color-white) 30%, transparent) );--sbb-scrollbar-color-hover: color-mix(in srgb, var(--sbb-color-black) 60%, transparent);--sbb-scrollbar-color-hover: light-dark( color-mix(in srgb, var(--sbb-color-black) 60%, transparent), color-mix(in srgb, var(--sbb-color-white) 60%, transparent) );--sbb-scrollbar-track-color: transparent;--sbb-scrollbar-width: var(--sbb-spacing-fixed-3x)}.sbb-popover__scrollable-content::-webkit-scrollbar{width:var(--sbb-scrollbar-width);height:var(--sbb-scrollbar-width);background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-popover__scrollable-content::-webkit-scrollbar-corner{background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-popover__scrollable-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-popover__scrollable-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-popover__scrollable-content::-webkit-scrollbar-button,.sbb-popover__scrollable-content::-webkit-scrollbar-corner{display:none}@supports not selector(::-webkit-scrollbar){.sbb-popover__scrollable-content{scrollbar-width:var(--sbb-scrollbar-width-firefox);scrollbar-color:var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent)}}.sbb-popover__scrollable-content{display:block;padding-block-end:var(--sbb-popover-padding);max-height:calc(var(--sbb-popover-max-height));overflow:auto}@keyframes open{0%{opacity:0;transform:var(--sbb-popover-transform)}to{opacity:1;transform:translateY(0)}}@keyframes close{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:var(--sbb-popover-transform)}}`, ne = 16, le = 32;
|
|
23
23
|
let be = 0;
|
|
24
24
|
const E = /* @__PURE__ */ new Set(), ce = k ? !1 : matchMedia(Q).matches;
|
|
25
25
|
let pe = (() => {
|
|
@@ -253,7 +253,7 @@ let pe = (() => {
|
|
|
253
253
|
}
|
|
254
254
|
configureTrigger(o) {
|
|
255
255
|
const t = this.hoverTrigger && !ce;
|
|
256
|
-
this.trigger === o && t === this._hoverTrigger || (this._hoverTrigger !== t && (this._hoverTrigger = t, this._registerOverlayListeners()), super.configureTrigger(o));
|
|
256
|
+
this.trigger === o && t === this._hoverTrigger || (this._hoverTrigger !== t && (this._hoverTrigger = t, this.toggleState("hover-trigger", this._hoverTrigger), this._registerOverlayListeners()), super.configureTrigger(o));
|
|
257
257
|
}
|
|
258
258
|
_registerOverlayListeners() {
|
|
259
259
|
this._overlayAbortController?.abort(), this._hoverTrigger && (this._overlayAbortController = new AbortController(), this.overlay?.addEventListener("mouseenter", () => this._onOverlayMouseEnter(), {
|
|
@@ -297,7 +297,7 @@ let pe = (() => {
|
|
|
297
297
|
}
|
|
298
298
|
}, u = new WeakMap(), m = new WeakMap(), _ = new WeakMap(), n = b, (() => {
|
|
299
299
|
const o = typeof Symbol == "function" && Symbol.metadata ? Object.create(p[Symbol.metadata] ?? null) : void 0;
|
|
300
|
-
S = [w(), f({ attribute: "hide-close-button", type: Boolean })], r = [w(), f({ attribute: "hover-trigger", type: Boolean })], O = [f({ attribute: "open-delay", type: Number })], D = [f({ attribute: "close-delay", type: Number })], P = [w(), f({ attribute: "accessibility-close-label" })], g(b, null, S, { kind: "accessor", name: "hideCloseButton", static: !1, private: !1, access: { has: (t) => "hideCloseButton" in t, get: (t) => t.hideCloseButton, set: (t, h) => {
|
|
300
|
+
S = [w(), f({ attribute: "hide-close-button", type: Boolean, reflect: !0 })], r = [w(), f({ attribute: "hover-trigger", type: Boolean })], O = [f({ attribute: "open-delay", type: Number })], D = [f({ attribute: "close-delay", type: Number })], P = [w(), f({ attribute: "accessibility-close-label" })], g(b, null, S, { kind: "accessor", name: "hideCloseButton", static: !1, private: !1, access: { has: (t) => "hideCloseButton" in t, get: (t) => t.hideCloseButton, set: (t, h) => {
|
|
301
301
|
t.hideCloseButton = h;
|
|
302
302
|
} }, metadata: o }, T, e), g(b, null, r, { kind: "accessor", name: "hoverTrigger", static: !1, private: !1, access: { has: (t) => "hoverTrigger" in t, get: (t) => t.hoverTrigger, set: (t, h) => {
|
|
303
303
|
t.hoverTrigger = h;
|
package/safety-theme.css
CHANGED
|
@@ -1931,7 +1931,7 @@ sbb-dialog:has(> sbb-dialog-close-button) > sbb-dialog-title, sbb-dialog:is(:sta
|
|
|
1931
1931
|
}
|
|
1932
1932
|
|
|
1933
1933
|
sbb-dialog:has(> sbb-dialog-title) > sbb-dialog-content, sbb-dialog:is(:state(has-intermediate-element),[state--has-intermediate-element]):has(> * > sbb-dialog-title) > * > sbb-dialog-content {
|
|
1934
|
-
padding-block-start:
|
|
1934
|
+
padding-block-start: var(--sbb-spacing-fixed-1x);
|
|
1935
1935
|
}
|
|
1936
1936
|
sbb-dialog[negative] > sbb-dialog-content, sbb-dialog[negative]:is(:state(has-intermediate-element),[state--has-intermediate-element]) > * > sbb-dialog-content {
|
|
1937
1937
|
--sbb-scrollbar-color: color-mix(in srgb, var(--sbb-color-white) 30%, transparent);
|
|
@@ -10,6 +10,8 @@ declare const SbbSelectElement_base: import('../core/mixins.ts').AbstractConstru
|
|
|
10
10
|
* @cssprop [--sbb-select-z-index=var(--sbb-overlay-default-z-index)] - To specify a custom stack order,
|
|
11
11
|
* the `z-index` can be overridden by defining this CSS variable. The default `z-index` of the
|
|
12
12
|
* component is set to `var(--sbb-overlay-default-z-index)` with a value of `1000`.
|
|
13
|
+
* @cssprop [--sbb-options-panel-max-height] - Maximum height of the options panel.
|
|
14
|
+
* If the calculated remaining space is smaller, the value gets ignored.
|
|
13
15
|
* @overrideType value - (T = string | string[]) | null
|
|
14
16
|
*/
|
|
15
17
|
export declare class SbbSelectElement<T = string> extends SbbSelectElement_base {
|
|
@@ -50,7 +52,7 @@ export declare class SbbSelectElement<T = string> extends SbbSelectElement_base
|
|
|
50
52
|
private _optionContainer;
|
|
51
53
|
private _originElement;
|
|
52
54
|
private _triggerElement;
|
|
53
|
-
private _openPanelEventsController
|
|
55
|
+
private _openPanelEventsController?;
|
|
54
56
|
private _escapableOverlayController;
|
|
55
57
|
private _overlayId;
|
|
56
58
|
private _activeItemIndex;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select.component.d.ts","sourceRoot":"","sources":["../../../src/elements/select/select.component.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,mBAAmB,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAO/F,OAAO,EAAE,uBAAuB,EAAE,MAAM,0BAA0B,CAAC;AAenE,OAAO,EACL,KAAK,iBAAiB,EACtB,KAAK,gBAAgB,EAQtB,MAAM,mBAAmB,CAAC;AAK3B,OAAO,KAAK,EAAE,gBAAgB,EAAwB,MAAM,cAAc,CAAC;;AAY3E
|
|
1
|
+
{"version":3,"file":"select.component.d.ts","sourceRoot":"","sources":["../../../src/elements/select/select.component.ts"],"names":[],"mappings":"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"}
|