@sbb-esta/lyne-elements 0.0.0 → 0.52.0

package/development/visual-checkbox/visual-checkbox.d.ts

@@ -0,0 +1,21 @@
+import { CSSResultGroup, TemplateResult, LitElement } from 'lit';
+
+declare const SbbVisualCheckboxElement_base: import('../core/mixins.js').AbstractConstructor<import('../core/mixins.js').SbbDisabledMixinType> & import('../core/mixins.js').AbstractConstructor<import('../core/mixins.js').SbbNegativeMixinType> & typeof LitElement;
+/**
+ * It visually displays a non-interactive checkbox.
+ */
+export declare class SbbVisualCheckboxElement extends SbbVisualCheckboxElement_base {
+    static styles: CSSResultGroup;
+    /** Checked state. */
+    checked: boolean;
+    /** Indeterminate state. */
+    indeterminate: boolean;
+    protected render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'sbb-visual-checkbox': SbbVisualCheckboxElement;
+    }
+}
+export {};
+//# sourceMappingURL=visual-checkbox.d.ts.map

package/development/visual-checkbox/visual-checkbox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"visual-checkbox.d.ts","sourceRoot":"","sources":["../../../../src/elements/visual-checkbox/visual-checkbox.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1D,OAAO,EAAQ,UAAU,EAAW,MAAM,KAAK,CAAC;;AAOhD;;GAEG;AACH,qBACa,wBAAyB,SAAQ,6BAA8C;IAC1F,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,qBAAqB;IAC8B,OAAO,EAAE,OAAO,CAAS;IAE5E,2BAA2B;IACwB,aAAa,UAAS;cAEtD,MAAM,IAAI,cAAc;CAwB5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,qBAAqB,EAAE,wBAAwB,CAAC;KACjD;CACF"}

package/development/visual-checkbox.d.ts

@@ -0,0 +1,2 @@
+export * from './visual-checkbox/visual-checkbox.js';
+//# sourceMappingURL=visual-checkbox.d.ts.map

package/development/visual-checkbox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"visual-checkbox.d.ts","sourceRoot":"","sources":["../../../src/elements/visual-checkbox.ts"],"names":[],"mappings":"AAAA,cAAc,sCAAsC,CAAC"}

package/development/visual-checkbox.js

@@ -0,0 +1,181 @@
+import { css, LitElement, html, nothing } from "lit";
+import { property, customElement } from "lit/decorators.js";
+import { SbbDisabledMixin, SbbNegativeMixin } from "./core/mixins.js";
+const style = css`/**
+ * Better font rendering (on OS X)
+ * http://maximilianhoffmann.com/posts/better-font-rendering-on-osx
+ *
+ * Usage:
+ *
+ * .var_dark_on_light {
+ * 	@include font-smoothing;
+ * }
+ * .var_light_on_dark {
+ * 	@include font-smoothing-reset;
+ * }
+ */
+/** This mixin can be used to avoid spacing problems by inserting an invisible space as pseudo element. */
+*,
+::before,
+::after {
+  box-sizing: border-box;
+}
+
+:host {
+  --sbb-visual-checkbox-dimension: var(--sbb-size-icon-ui-small);
+  --sbb-visual-checkbox-background-color: var(--sbb-color-white);
+  --sbb-visual-checkbox-border-color: var(--sbb-color-smoke);
+  --sbb-visual-checkbox-border-style: solid;
+  --sbb-visual-checkbox-border-width: var(--sbb-border-width-1x);
+  --sbb-visual-checkbox-selection-color: var(--sbb-color-red);
+  --sbb-visual-checkbox-cursor: pointer;
+  display: block;
+}
+@media (forced-colors: active) {
+  :host {
+    --sbb-visual-checkbox-selection-color: Canvas;
+    --sbb-visual-checkbox-border-width: 0;
+  }
+}
+
+:host([negative]) {
+  --sbb-visual-checkbox-background-color: var(--sbb-color-midnight);
+  --sbb-visual-checkbox-border-color: var(--sbb-color-smoke);
+  --sbb-visual-checkbox-selection-color: var(--sbb-color-red);
+}
+@media (forced-colors: active) {
+  :host([negative]) {
+    --sbb-visual-checkbox-selection-color: Canvas;
+  }
+}
+
+:host([disabled]) {
+  --sbb-visual-checkbox-background-color: var(--sbb-color-milk);
+  --sbb-visual-checkbox-border-color: var(--sbb-color-smoke);
+  --sbb-visual-checkbox-border-style: dashed;
+  --sbb-visual-checkbox-selection-color: var(--sbb-color-charcoal);
+  --sbb-visual-checkbox-cursor: default;
+}
+@media (forced-colors: active) {
+  :host([disabled]) {
+    --sbb-visual-checkbox-selection-color: Canvas;
+  }
+}
+
+:host([disabled][negative]) {
+  --sbb-visual-checkbox-background-color: var(--sbb-color-charcoal);
+  --sbb-visual-checkbox-border-color: var(--sbb-color-smoke);
+  --sbb-visual-checkbox-selection-color: var(--sbb-color-white);
+}
+@media (forced-colors: active) {
+  :host([disabled][negative]) {
+    --sbb-visual-checkbox-selection-color: Canvas;
+  }
+}
+
+@media (forced-colors: active) {
+  :host([indeterminate]) {
+    --sbb-visual-checkbox-selection-color: ButtonBorder;
+  }
+}
+
+@media (forced-colors: active) {
+  :host([indeterminate][disabled]) {
+    --sbb-visual-checkbox-selection-color: GrayText;
+  }
+}
+
+.sbb-visual-checkbox {
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: var(--sbb-visual-checkbox-dimension);
+  height: var(--sbb-visual-checkbox-dimension);
+  border-radius: var(--sbb-border-radius-2x);
+  border: var(--sbb-visual-checkbox-border-width) var(--sbb-visual-checkbox-border-style) var(--sbb-visual-checkbox-border-color);
+  background-color: var(--sbb-visual-checkbox-background-color);
+  cursor: var(--sbb-visual-checkbox-cursor);
+}
+@media (forced-colors: active) {
+  .sbb-visual-checkbox {
+    outline: var(--sbb-border-width-2x) solid ButtonBorder;
+    outline-offset: calc(-1 * var(--sbb-border-width-2x));
+  }
+  :host([checked]) .sbb-visual-checkbox {
+    background-color: HighLight;
+    outline: none;
+  }
+  :host([disabled]) .sbb-visual-checkbox {
+    outline-color: GrayText;
+  }
+  :host([checked][disabled]) .sbb-visual-checkbox {
+    background-color: GrayText;
+  }
+}
+
+.sbb-visual-checkbox__icon {
+  display: inline-flex;
+  width: var(--sbb-visual-checkbox-dimension);
+  height: var(--sbb-visual-checkbox-dimension);
+}
+.sbb-visual-checkbox__icon svg {
+  margin: auto;
+}
+.sbb-visual-checkbox__icon path {
+  stroke: var(--sbb-visual-checkbox-selection-color);
+}`;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result)
+    __defProp(target, key, result);
+  return result;
+};
+let SbbVisualCheckboxElement = class extends SbbDisabledMixin(SbbNegativeMixin(LitElement)) {
+  constructor() {
+    super(...arguments);
+    this.checked = false;
+    this.indeterminate = false;
+  }
+  render() {
+    return html`
+      <span class="sbb-visual-checkbox">
+        <span class="sbb-visual-checkbox__icon">
+          ${this.checked || this.indeterminate ? html`<svg
+                width="24"
+                height="24"
+                viewBox="0 0 24 24"
+                fill="none"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  d=${this.indeterminate ? "M9 12H15" : "M8 12.3304L10.4615 15L16 9"}
+                  stroke-width="2"
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                />
+              </svg>` : nothing}
+        </span>
+      </span>
+    `;
+  }
+};
+SbbVisualCheckboxElement.styles = style;
+__decorateClass([
+  property({ reflect: true, type: Boolean })
+], SbbVisualCheckboxElement.prototype, "checked", 2);
+__decorateClass([
+  property({ reflect: true, type: Boolean })
+], SbbVisualCheckboxElement.prototype, "indeterminate", 2);
+SbbVisualCheckboxElement = __decorateClass([
+  customElement("sbb-visual-checkbox")
+], SbbVisualCheckboxElement);
+export {
+  SbbVisualCheckboxElement
+};
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidmlzdWFsLWNoZWNrYm94LmpzIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvZWxlbWVudHMvdmlzdWFsLWNoZWNrYm94L3Zpc3VhbC1jaGVja2JveC50cyJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgdHlwZSB7IENTU1Jlc3VsdEdyb3VwLCBUZW1wbGF0ZVJlc3VsdCB9IGZyb20gJ2xpdCc7XG5pbXBvcnQgeyBodG1sLCBMaXRFbGVtZW50LCBub3RoaW5nIH0gZnJvbSAnbGl0JztcbmltcG9ydCB7IGN1c3RvbUVsZW1lbnQsIHByb3BlcnR5IH0gZnJvbSAnbGl0L2RlY29yYXRvcnMuanMnO1xuXG5pbXBvcnQgeyBTYmJEaXNhYmxlZE1peGluLCBTYmJOZWdhdGl2ZU1peGluIH0gZnJvbSAnLi4vY29yZS9taXhpbnMuanMnO1xuXG5pbXBvcnQgc3R5bGUgZnJvbSAnLi92aXN1YWwtY2hlY2tib3guc2Nzcz9saXQmaW5saW5lJztcblxuLyoqXG4gKiBJdCB2aXN1YWxseSBkaXNwbGF5cyBhIG5vbi1pbnRlcmFjdGl2ZSBjaGVja2JveC5cbiAqL1xuQGN1c3RvbUVsZW1lbnQoJ3NiYi12aXN1YWwtY2hlY2tib3gnKVxuZXhwb3J0IGNsYXNzIFNiYlZpc3VhbENoZWNrYm94RWxlbWVudCBleHRlbmRzIFNiYkRpc2FibGVkTWl4aW4oU2JiTmVnYXRpdmVNaXhpbihMaXRFbGVtZW50KSkge1xuICBwdWJsaWMgc3RhdGljIG92ZXJyaWRlIHN0eWxlczogQ1NTUmVzdWx0R3JvdXAgPSBzdHlsZTtcblxuICAvKiogQ2hlY2tlZCBzdGF0ZS4gKi9cbiAgQHByb3BlcnR5KHsgcmVmbGVjdDogdHJ1ZSwgdHlwZTogQm9vbGVhbiB9KSBwdWJsaWMgY2hlY2tlZDogYm9vbGVhbiA9IGZhbHNlO1xuXG4gIC8qKiBJbmRldGVybWluYXRlIHN0YXRlLiAqL1xuICBAcHJvcGVydHkoeyByZWZsZWN0OiB0cnVlLCB0eXBlOiBCb29sZWFuIH0pIHB1YmxpYyBpbmRldGVybWluYXRlID0gZmFsc2U7XG5cbiAgcHJvdGVjdGVkIG92ZXJyaWRlIHJlbmRlcigpOiBUZW1wbGF0ZVJlc3VsdCB7XG4gICAgcmV0dXJuIGh0bWxgXG4gICAgICA8c3BhbiBjbGFzcz1cInNiYi12aXN1YWwtY2hlY2tib3hcIj5cbiAgICAgICAgPHNwYW4gY2xhc3M9XCJzYmItdmlzdWFsLWNoZWNrYm94X19pY29uXCI+XG4gICAgICAgICAgJHt0aGlzLmNoZWNrZWQgfHwgdGhpcy5pbmRldGVybWluYXRlXG4gICAgICAgICAgICA/IGh0bWxgPHN2Z1xuICAgICAgICAgICAgICAgIHdpZHRoPVwiMjRcIlxuICAgICAgICAgICAgICAgIGhlaWdodD1cIjI0XCJcbiAgICAgICAgICAgICAgICB2aWV3Qm94PVwiMCAwIDI0IDI0XCJcbiAgICAgICAgICAgICAgICBmaWxsPVwibm9uZVwiXG4gICAgICAgICAgICAgICAgeG1sbnM9XCJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Z1wiXG4gICAgICAgICAgICAgID5cbiAgICAgICAgICAgICAgICA8cGF0aFxuICAgICAgICAgICAgICAgICAgZD0ke3RoaXMuaW5kZXRlcm1pbmF0ZSA/ICdNOSAxMkgxNScgOiAnTTggMTIuMzMwNEwxMC40NjE1IDE1TDE2IDknfVxuICAgICAgICAgICAgICAgICAgc3Ryb2tlLXdpZHRoPVwiMlwiXG4gICAgICAgICAgICAgICAgICBzdHJva2UtbGluZWNhcD1cInJvdW5kXCJcbiAgICAgICAgICAgICAgICAgIHN0cm9rZS1saW5lam9pbj1cInJvdW5kXCJcbiAgICAgICAgICAgICAgICAvPlxuICAgICAgICAgICAgICA8L3N2Zz5gXG4gICAgICAgICAgICA6IG5vdGhpbmd9XG4gICAgICAgIDwvc3Bhbj5cbiAgICAgIDwvc3Bhbj5cbiAgICBgO1xuICB9XG59XG5cbmRlY2xhcmUgZ2xvYmFsIHtcbiAgaW50ZXJmYWNlIEhUTUxFbGVtZW50VGFnTmFtZU1hcCB7XG4gICAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIEB0eXBlc2NyaXB0LWVzbGludC9uYW1pbmctY29udmVudGlvblxuICAgICdzYmItdmlzdWFsLWNoZWNrYm94JzogU2JiVmlzdWFsQ2hlY2tib3hFbGVtZW50O1xuICB9XG59XG4iXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0FBWU8sSUFBTSwyQkFBTixjQUF1QyxpQkFBaUIsaUJBQWlCLFVBQVUsQ0FBQyxFQUFFO0FBQUEsRUFBdEYsY0FBQTtBQUFBLFVBQUEsR0FBQSxTQUFBO0FBSXVDLFNBQU8sVUFBbUI7QUFHMUIsU0FBTyxnQkFBZ0I7QUFBQSxFQUFBO0FBQUEsRUFFaEQsU0FBeUI7QUFDbkMsV0FBQTtBQUFBO0FBQUE7QUFBQSxZQUdDLEtBQUssV0FBVyxLQUFLLGdCQUNuQjtBQUFBO0FBQUE7QUFBQTtBQUFBO0FBQUE7QUFBQTtBQUFBO0FBQUEsc0JBUVEsS0FBSyxnQkFBZ0IsYUFBYSw0QkFBNEI7QUFBQTtBQUFBO0FBQUE7QUFBQTtBQUFBLHdCQU10RSxPQUFPO0FBQUE7QUFBQTtBQUFBO0FBQUEsRUFJbkI7QUFDRjtBQWpDYSx5QkFDWSxTQUF5QjtBQUdHLGdCQUFBO0FBQUEsRUFBbEQsU0FBUyxFQUFFLFNBQVMsTUFBTSxNQUFNLFNBQVM7QUFBQSxHQUovQix5QkFJd0MsV0FBQSxXQUFBLENBQUE7QUFHQSxnQkFBQTtBQUFBLEVBQWxELFNBQVMsRUFBRSxTQUFTLE1BQU0sTUFBTSxTQUFTO0FBQUEsR0FQL0IseUJBT3dDLFdBQUEsaUJBQUEsQ0FBQTtBQVB4QywyQkFBTixnQkFBQTtBQUFBLEVBRE4sY0FBYyxxQkFBcUI7QUFBQSxHQUN2Qix3QkFBQTsifQ==

package/dialog/dialog/dialog.d.ts

@@ -0,0 +1,54 @@
+import { CSSResultGroup, PropertyValues, TemplateResult } from 'lit';
+import { SbbOverlayBaseElement } from '../../overlay.js';
+
+/**
+ * It displays an interactive overlay element.
+ *
+ * @slot - Use the unnamed slot to provide a `sbb-dialog-title`, `sbb-dialog-content` and an optional `sbb-dialog-actions`.
+ * @event {CustomEvent<void>} willOpen - Emits whenever the `sbb-dialog` starts the opening transition. Can be canceled.
+ * @event {CustomEvent<void>} didOpen - Emits whenever the `sbb-dialog` is opened.
+ * @event {CustomEvent<void>} willClose - Emits whenever the `sbb-dialog` begins the closing transition. Can be canceled.
+ * @event {CustomEvent<SbbOverlayCloseEventDetails>} didClose - Emits whenever the `sbb-dialog` is closed.
+ * @cssprop [--sbb-dialog-z-index=var(--sbb-overlay-default-z-index)] - To specify a custom stack order,
+ * the `z-index` can be overridden by defining this CSS variable. The default `z-index` of the
+ * component is set to `var(--sbb-overlay-default-z-index)` with a value of `1000`.
+ */
+export declare class SbbDialogElement extends SbbOverlayBaseElement {
+    static styles: CSSResultGroup;
+    /** Backdrop click action. */
+    backdropAction: 'close' | 'none';
+    private _dialogContentResizeObserver;
+    private _dialogTitleElement;
+    private _dialogTitleHeight?;
+    private _dialogContentElement;
+    private _dialogActionsElement;
+    private _isPointerDownEventOnDialog;
+    private _overflows;
+    private _lastScroll;
+    private _dialogId;
+    protected closeAttribute: string;
+    /** Opens the component. */
+    open(): void;
+    connectedCallback(): void;
+    protected firstUpdated(changedProperties: PropertyValues<this>): void;
+    protected willUpdate(changedProperties: PropertyValues<this>): void;
+    disconnectedCallback(): void;
+    protected attachOpenOverlayEvents(): void;
+    protected onOverlayAnimationEnd(event: AnimationEvent): void;
+    protected setOverlayFocus(): void;
+    private _syncNegative;
+    private _onContentScroll;
+    private _pointerDownListener;
+    private _closeOnBackdropClick;
+    private _setDialogHeaderHeight;
+    private _onContentResize;
+    private _setHideHeaderDataAttribute;
+    private _setOverflowsDataAttribute;
+    protected render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'sbb-dialog': SbbDialogElement;
+    }
+}
+//# sourceMappingURL=dialog.d.ts.map

package/dialog/dialog/dialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog.d.ts","sourceRoot":"","sources":["../../../../src/elements/dialog/dialog/dialog.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAQ1E,OAAO,EAAe,qBAAqB,EAAE,MAAM,kBAAkB,CAAC;AAMtE,OAAO,6BAA6B,CAAC;AAIrC;;;;;;;;;;;GAWG;AACH,qBACa,gBAAiB,SAAQ,qBAAqB;IACzD,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,6BAA6B;IACsB,cAAc,EAAE,OAAO,GAAG,MAAM,CAAW;IAM9F,OAAO,CAAC,4BAA4B,CAElC;IAEF,OAAO,CAAC,mBAAmB,CAAsC;IACjE,OAAO,CAAC,kBAAkB,CAAC,CAAS;IACpC,OAAO,CAAC,qBAAqB,CAA4B;IACzD,OAAO,CAAC,qBAAqB,CAAwC;IACrE,OAAO,CAAC,2BAA2B,CAAkB;IACrD,OAAO,CAAC,UAAU,CAAkB;IACpC,OAAO,CAAC,WAAW,CAAK;IACxB,OAAO,CAAC,SAAS,CAA4B;IAC7C,SAAS,CAAC,cAAc,EAAE,MAAM,CAAsB;IAEtD,2BAA2B;IACpB,IAAI,IAAI,IAAI;IA2BH,iBAAiB,IAAI,IAAI;cAYtB,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;cAO3D,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAQ5D,oBAAoB,IAAI,IAAI;cAKzB,uBAAuB,IAAI,IAAI;IAgBlD,SAAS,CAAC,qBAAqB,CAAC,KAAK,EAAE,cAAc,GAAG,IAAI;IAoC5D,SAAS,CAAC,eAAe,IAAI,IAAI;IAQjC,OAAO,CAAC,aAAa;IAUrB,OAAO,CAAC,gBAAgB;IAqCxB,OAAO,CAAC,oBAAoB,CAS1B;IAGF,OAAO,CAAC,qBAAqB,CAc3B;IAEF,OAAO,CAAC,sBAAsB;IAK9B,OAAO,CAAC,gBAAgB;IASxB,OAAO,CAAC,2BAA2B;IAWnC,OAAO,CAAC,0BAA0B;cAMf,MAAM,IAAI,cAAc;CAmB5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,YAAY,EAAE,gBAAgB,CAAC;KAChC;CACF"}

package/dialog/dialog-actions/dialog-actions.d.ts

@@ -0,0 +1,18 @@
+import { CSSResultGroup, TemplateResult } from 'lit';
+import { SbbActionGroupElement } from '../../action-group.js';
+
+/**
+ * Use this component to display a footer into an `sbb-dialog` with an action group.
+ *
+ * @slot - Use the unnamed slot to add `sbb-block-link` or `sbb-button` elements to the `sbb-dialog-actions`.
+ */
+export declare class SbbDialogActionsElement extends SbbActionGroupElement {
+    static styles: CSSResultGroup;
+    protected render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'sbb-dialog-actions': SbbDialogActionsElement;
+    }
+}
+//# sourceMappingURL=dialog-actions.d.ts.map

package/dialog/dialog-actions/dialog-actions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog-actions.d.ts","sourceRoot":"","sources":["../../../../src/elements/dialog/dialog-actions/dialog-actions.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAI1D,OAAO,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;AAI9D;;;;GAIG;AACH,qBACa,uBAAwB,SAAQ,qBAAqB;IAChE,OAAuB,MAAM,EAAE,cAAc,CAAyC;cAEnE,MAAM,IAAI,cAAc;CAG5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,oBAAoB,EAAE,uBAAuB,CAAC;KAC/C;CACF"}

package/dialog/dialog-actions.d.ts

@@ -0,0 +1,2 @@
+export * from './dialog-actions/dialog-actions.js';
+//# sourceMappingURL=dialog-actions.d.ts.map

package/dialog/dialog-actions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog-actions.d.ts","sourceRoot":"","sources":["../../../src/elements/dialog/dialog-actions.ts"],"names":[],"mappings":"AAAA,cAAc,oCAAoC,CAAC"}

package/dialog/dialog-actions.js

@@ -0,0 +1,21 @@
+import { css as i, html as v } from "lit";
+import { customElement as n } from "lit/decorators.js";
+import { SbbActionGroupElement as d } from "../action-group.js";
+const c = i`*,:before,:after{box-sizing:border-box}:host{display:contents}@media (forced-colors: active){:host{--sbb-dialog-actions-border: var(--sbb-border-width-1x) solid CanvasText}}.sbb-dialog-actions{padding-inline:var(--sbb-dialog-padding-inline);padding-block:var(--sbb-spacing-responsive-s);margin-block-start:auto;background-color:var(--sbb-dialog-background-color);border-block-start:var(--sbb-dialog-actions-border)}:host([data-overflows]:not([data-negative])) .sbb-dialog-actions{box-shadow:var(--sbb-shadow-elevation-level-9-shadow-2-offset-x) var(--sbb-shadow-elevation-level-9-shadow-2-offset-y) var(--sbb-shadow-elevation-level-9-shadow-2-blur) var(--sbb-shadow-elevation-level-9-shadow-2-spread) var(--sbb-shadow-elevation-level-9-soft-2-color),var(--sbb-shadow-elevation-level-9-shadow-1-offset-x) var(--sbb-shadow-elevation-level-9-shadow-1-offset-y) var(--sbb-shadow-elevation-level-9-shadow-1-blur) var(--sbb-shadow-elevation-level-9-shadow-1-spread) var(--sbb-shadow-elevation-level-9-soft-1-color)}`;
+var h = Object.defineProperty, w = Object.getOwnPropertyDescriptor, f = (t, e, a, s) => {
+  for (var o = s > 1 ? void 0 : s ? w(e, a) : e, r = t.length - 1, l; r >= 0; r--)
+    (l = t[r]) && (o = (s ? l(e, a, o) : l(o)) || o);
+  return s && o && h(e, a, o), o;
+};
+let b = class extends d {
+  render() {
+    return v` <div class="sbb-dialog-actions">${super.render()}</div> `;
+  }
+};
+b.styles = [d.styles, c];
+b = f([
+  n("sbb-dialog-actions")
+], b);
+export {
+  b as SbbDialogActionsElement
+};

package/dialog/dialog-content/dialog-content.d.ts

@@ -0,0 +1,17 @@
+import { CSSResultGroup, TemplateResult, LitElement } from 'lit';
+
+/**
+ * Use this component to provide a content for an `sbb-dialog`.
+ *
+ * @slot - Use the unnamed slot to provide a dialog content.
+ */
+export declare class SbbDialogContentElement extends LitElement {
+    static styles: CSSResultGroup;
+    protected render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'sbb-dialog-content': SbbDialogContentElement;
+    }
+}
+//# sourceMappingURL=dialog-content.d.ts.map

package/dialog/dialog-content/dialog-content.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog-content.d.ts","sourceRoot":"","sources":["../../../../src/elements/dialog/dialog-content/dialog-content.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1D,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAKvC;;;;GAIG;AACH,qBACa,uBAAwB,SAAQ,UAAU;IACrD,OAAuB,MAAM,EAAE,cAAc,CAAS;cAEnC,MAAM,IAAI,cAAc;CAO5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,oBAAoB,EAAE,uBAAuB,CAAC;KAC/C;CACF"}

package/dialog/dialog-content.d.ts

@@ -0,0 +1,2 @@
+export * from './dialog-content/dialog-content.js';
+//# sourceMappingURL=dialog-content.d.ts.map

package/dialog/dialog-content.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog-content.d.ts","sourceRoot":"","sources":["../../../src/elements/dialog/dialog-content.ts"],"names":[],"mappings":"AAAA,cAAc,oCAAoC,CAAC"}

package/dialog/dialog-content.js

@@ -0,0 +1,24 @@
+import { css as n, LitElement as e, html as i } from "lit";
+import { customElement as d } from "lit/decorators.js";
+const g = n`*,:before,:after{box-sizing:border-box}:host{display:contents}.sbb-dialog-content{--sbb-scrollbar-width: var(--sbb-spacing-fixed-3x);padding-inline:var(--sbb-dialog-padding-inline);padding-block:var(--sbb-dialog-padding-block);overflow:auto;margin-block:var(--sbb-dialog-header-margin-block-start) 0;transition:margin var(--sbb-dialog-animation-duration) var(--sbb-dialog-animation-easing)}.sbb-dialog-content::-webkit-scrollbar{width:var(--sbb-scrollbar-width);height:var(--sbb-scrollbar-width);background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-dialog-content::-webkit-scrollbar-corner{background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-dialog-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-dialog-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-dialog-content::-webkit-scrollbar-button,.sbb-dialog-content::-webkit-scrollbar-corner{display:none}@supports not selector(::-webkit-scrollbar){.sbb-dialog-content{scrollbar-width:var(--sbb-scrollbar-width-firefox);scrollbar-color:var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent)}}`;
+var v = Object.defineProperty, h = Object.getOwnPropertyDescriptor, p = (c, o, a, b) => {
+  for (var r = b > 1 ? void 0 : b ? h(o, a) : o, l = c.length - 1, t; l >= 0; l--)
+    (t = c[l]) && (r = (b ? t(o, a, r) : t(r)) || r);
+  return b && r && v(o, a, r), r;
+};
+let s = class extends e {
+  render() {
+    return i`
+      <div class="sbb-dialog-content">
+        <slot></slot>
+      </div>
+    `;
+  }
+};
+s.styles = g;
+s = p([
+  d("sbb-dialog-content")
+], s);
+export {
+  s as SbbDialogContentElement
+};

package/dialog/dialog-title/dialog-title.d.ts

@@ -0,0 +1,43 @@
+import { CSSResultGroup, PropertyValues, TemplateResult } from 'lit';
+import { Breakpoint } from '../../core/dom.js';
+import { SbbTitleBase } from '../../title.js';
+
+/**
+ * It displays a title inside a dialog header.
+ *
+ * @event {CustomEvent<void>} requestBackAction - Emits whenever the back button is clicked.
+ */
+export declare class SbbDialogTitleElement extends SbbTitleBase {
+    static styles: CSSResultGroup;
+    static readonly events: Record<string, string>;
+    /**
+     * Whether a back button is displayed next to the title.
+     */
+    backButton: boolean;
+    /**
+     * This will be forwarded as aria-label to the close button element.
+     */
+    accessibilityCloseLabel: string | undefined;
+    /**
+     * This will be forwarded as aria-label to the back button element.
+     */
+    accessibilityBackLabel: string | undefined;
+    /**
+     * Whether to hide the title up to a certain breakpoint.
+     */
+    set hideOnScroll(value: '' | Breakpoint | boolean);
+    get hideOnScroll(): Breakpoint | boolean;
+    private _hideOnScroll;
+    private _backClick;
+    private _language;
+    constructor();
+    connectedCallback(): void;
+    protected willUpdate(changedProperties: PropertyValues<this>): void;
+    protected render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'sbb-dialog-title': SbbDialogTitleElement;
+    }
+}
+//# sourceMappingURL=dialog-title.d.ts.map

package/dialog/dialog-title/dialog-title.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog-title.d.ts","sourceRoot":"","sources":["../../../../src/elements/dialog/dialog-title/dialog-title.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAO1E,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAGpD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAI9C,OAAO,kCAAkC,CAAC;AAC1C,OAAO,oCAAoC,CAAC;AAE5C;;;;GAIG;AACH,qBACa,qBAAsB,SAAQ,YAAY;IACrD,OAAuB,MAAM,EAAE,cAAc,CAAgC;IAC7E,gBAAuB,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAE1C;IAEX;;OAEG;IAC2D,UAAU,UAAS;IAEjF;;OAEG;IAC0D,uBAAuB,EAChF,MAAM,GACN,SAAS,CAAC;IAEd;;OAEG;IACyD,sBAAsB,EAC9E,MAAM,GACN,SAAS,CAAC;IAEd;;OAEG;IACH,IACW,YAAY,CAAC,KAAK,EAAE,EAAE,GAAG,UAAU,GAAG,OAAO,EAEvD;IACD,IAAW,YAAY,IAAI,UAAU,GAAG,OAAO,CAE9C;IACD,OAAO,CAAC,aAAa,CAA+B;IAEpD,OAAO,CAAC,UAAU,CAGhB;IACF,OAAO,CAAC,SAAS,CAAmC;;IAQpC,iBAAiB,IAAI,IAAI;cAKtB,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;cAQzD,MAAM,IAAI,cAAc;CAmC5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,kBAAkB,EAAE,qBAAqB,CAAC;KAC3C;CACF"}

package/dialog/dialog-title.d.ts

@@ -0,0 +1,2 @@
+export * from './dialog-title/dialog-title.js';
+//# sourceMappingURL=dialog-title.d.ts.map

package/dialog/dialog-title.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog-title.d.ts","sourceRoot":"","sources":["../../../src/elements/dialog/dialog-title.ts"],"names":[],"mappings":"AAAA,cAAc,gCAAgC,CAAC"}

package/dialog/dialog-title.js

@@ -0,0 +1,86 @@
+import { css as v, nothing as g } from "lit";
+import { property as b, customElement as u } from "lit/decorators.js";
+import { html as c, unsafeStatic as r } from "lit/static-html.js";
+import { SbbFocusVisibleWithinController as p } from "../core/a11y.js";
+import { SbbLanguageController as f } from "../core/controllers.js";
+import { EventEmitter as m } from "../core/eventing.js";
+import { i18nCloseDialog as w, i18nGoBack as _ } from "../core/i18n.js";
+import { SbbTitleBase as h } from "../title.js";
+import "../button/secondary-button.js";
+import "../button/transparent-button.js";
+const k = v`:host{--sbb-dialog-title-padding-block: var(--sbb-spacing-responsive-s) 0;display:contents}:host([data-overflows]){--sbb-dialog-title-padding-block: var(--sbb-spacing-responsive-s)}.sbb-title{flex:1;overflow:hidden;align-self:center;margin:0}.sbb-dialog__header{display:flex;gap:var(--sbb-spacing-fixed-6x);align-items:start;justify-content:space-between;padding-inline:var(--sbb-dialog-padding-inline);padding-block:var(--sbb-dialog-title-padding-block);background-color:var(--sbb-dialog-background-color);border-block-end:var(--sbb-dialog-title-border);z-index:var(--sbb-dialog-z-index, var(--sbb-overlay-default-z-index))}:host(:not([data-has-visible-focus-within])) .sbb-dialog__header{transform:translateY(var(--sbb-dialog-header-margin-block-start));transition-property:box-shadow,transform;transition-duration:var(--sbb-dialog-animation-duration);transition-timing-function:var(--sbb-dialog-animation-easing)}:host([data-overflows][data-has-visible-focus-within]) .sbb-dialog__header,:host([data-overflows]:not([negative],[data-hide-header])) .sbb-dialog__header{box-shadow:var(--sbb-shadow-elevation-level-9-shadow-2-offset-x) var(--sbb-shadow-elevation-level-9-shadow-2-offset-y) var(--sbb-shadow-elevation-level-9-shadow-2-blur) var(--sbb-shadow-elevation-level-9-shadow-2-spread) var(--sbb-shadow-elevation-level-9-soft-2-color),var(--sbb-shadow-elevation-level-9-shadow-1-offset-x) var(--sbb-shadow-elevation-level-9-shadow-1-offset-y) var(--sbb-shadow-elevation-level-9-shadow-1-blur) var(--sbb-shadow-elevation-level-9-shadow-1-spread) var(--sbb-shadow-elevation-level-9-soft-1-color)}@media (forced-colors: active){:host([data-overflows][data-has-visible-focus-within]) .sbb-dialog__header,:host([data-overflows]:not([negative],[data-hide-header])) .sbb-dialog__header{--sbb-dialog-title-border: var(--sbb-border-width-1x) solid CanvasText}}@media (min-width: 52.5rem){.sbb-dialog__header{border-radius:var(--sbb-dialog-border-radius) var(--sbb-dialog-border-radius) 0 0}}.sbb-dialog__close{margin-inline-start:auto}`;
+var y = Object.defineProperty, B = Object.getOwnPropertyDescriptor, o = (e, s, i, l) => {
+  for (var t = l > 1 ? void 0 : l ? B(s, i) : s, n = e.length - 1, d; n >= 0; n--)
+    (d = e[n]) && (t = (l ? d(s, i, t) : d(t)) || t);
+  return l && t && y(s, i, t), t;
+};
+let a = class extends h {
+  constructor() {
+    super(), this.backButton = !1, this._hideOnScroll = !1, this._backClick = new m(
+      this,
+      a.events.backClick
+    ), this._language = new f(this), this.level = "2", this.visualLevel = "3";
+  }
+  set hideOnScroll(e) {
+    this._hideOnScroll = e === "" ? !0 : e;
+  }
+  get hideOnScroll() {
+    return this._hideOnScroll;
+  }
+  connectedCallback() {
+    super.connectedCallback(), new p(this);
+  }
+  willUpdate(e) {
+    super.willUpdate(e), (e.has("backButton") || e.has("accessibilityBackLabel")) && (this.backButton = !this.backButton && this.accessibilityBackLabel ? !0 : this.backButton);
+  }
+  render() {
+    const e = this.negative ? "sbb-transparent-button" : "sbb-secondary-button", s = c`
+      <${r(e)}
+        class="sbb-dialog__close"
+        aria-label=${this.accessibilityCloseLabel || w[this._language.current]}
+        ?negative=${this.negative}
+        size="m"
+        type="button"
+        icon-name="cross-small"
+        sbb-dialog-close
+      ></${r(e)}>
+    `, i = c`
+      <${r(e)}
+        class="sbb-dialog__back"
+        aria-label=${this.accessibilityBackLabel || _[this._language.current]}
+        ?negative=${this.negative}
+        size="m"
+        type="button"
+        icon-name="chevron-small-left-small"
+        @click=${() => this._backClick.emit()}
+      ></${r(e)}>
+    `;
+    return c`
+      <div class="sbb-dialog__header">
+        ${this.backButton ? i : g} ${super.render()} ${s}
+      </div>
+    `;
+  }
+};
+a.styles = [h.styles, k];
+a.events = {
+  backClick: "requestBackAction"
+};
+o([
+  b({ attribute: "back-button", type: Boolean })
+], a.prototype, "backButton", 2);
+o([
+  b({ attribute: "accessibility-close-label" })
+], a.prototype, "accessibilityCloseLabel", 2);
+o([
+  b({ attribute: "accessibility-back-label" })
+], a.prototype, "accessibilityBackLabel", 2);
+o([
+  b({ attribute: "hide-on-scroll" })
+], a.prototype, "hideOnScroll", 1);
+a = o([
+  u("sbb-dialog-title")
+], a);
+export {
+  a as SbbDialogTitleElement
+};

package/dialog/dialog.d.ts

@@ -0,0 +1,2 @@
+export * from './dialog/dialog.js';
+//# sourceMappingURL=dialog.d.ts.map

package/dialog/dialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog.d.ts","sourceRoot":"","sources":["../../../src/elements/dialog/dialog.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC"}