@sbb-esta/lyne-elements 2.8.0 → 2.9.0

package/development/alert/alert-group/alert-group.component.js

@@ -0,0 +1,183 @@
+var __typeError = (msg) => {
+  throw TypeError(msg);
+};
+var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
+var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
+var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
+var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
+import { __esDecorate, __runInitializers } from "tslib";
+import { css, LitElement, nothing } from "lit";
+import { customElement, property, state } from "lit/decorators.js";
+import { unsafeStatic, html } from "lit/static-html.js";
+import { forceType } from "../../core/decorators.js";
+import { EventEmitter, isEventPrevented } from "../../core/eventing.js";
+import { SbbHydrationMixin } from "../../core/mixins.js";
+const style = css`*,
+::before,
+::after {
+  box-sizing: border-box;
+}
+
+:host {
+  --sbb-alert-group-gap: var(--sbb-spacing-fixed-3x);
+  --sbb-alert-group-border-radius: var(--sbb-border-radius-4x);
+  display: block;
+}
+
+.sbb-alert-group {
+  display: flex;
+  flex-direction: column;
+  gap: var(--sbb-alert-group-gap);
+}
+
+:host(:focus-visible:not([data-empty])) {
+  outline-offset: var(--sbb-focus-outline-offset);
+  outline: var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);
+  border-radius: var(--sbb-alert-group-border-radius);
+}
+
+.sbb-alert-group__title {
+  border: 0;
+  clip: rect(0 0 0 0);
+  height: 1px;
+  margin: -1px;
+  overflow: hidden;
+  padding: 0;
+  position: absolute;
+  white-space: nowrap;
+  width: 1px;
+}`;
+let SbbAlertGroupElement = (() => {
+  var _role_accessor_storage, _accessibilityTitle_accessor_storage, _accessibilityTitleLevel_accessor_storage, __hasAlerts_accessor_storage, _a;
+  let _classDecorators = [customElement("sbb-alert-group")];
+  let _classDescriptor;
+  let _classExtraInitializers = [];
+  let _classThis;
+  let _classSuper = SbbHydrationMixin(LitElement);
+  let _role_decorators;
+  let _role_initializers = [];
+  let _role_extraInitializers = [];
+  let _accessibilityTitle_decorators;
+  let _accessibilityTitle_initializers = [];
+  let _accessibilityTitle_extraInitializers = [];
+  let _accessibilityTitleLevel_decorators;
+  let _accessibilityTitleLevel_initializers = [];
+  let _accessibilityTitleLevel_extraInitializers = [];
+  let __hasAlerts_decorators;
+  let __hasAlerts_initializers = [];
+  let __hasAlerts_extraInitializers = [];
+  var SbbAlertGroupElement2 = (_a = class extends _classSuper {
+    constructor() {
+      var _a2;
+      super();
+      __privateAdd(this, _role_accessor_storage);
+      __privateAdd(this, _accessibilityTitle_accessor_storage);
+      __privateAdd(this, _accessibilityTitleLevel_accessor_storage);
+      __privateAdd(this, __hasAlerts_accessor_storage);
+      __privateSet(this, _role_accessor_storage, __runInitializers(this, _role_initializers, "status"));
+      __privateSet(this, _accessibilityTitle_accessor_storage, (__runInitializers(this, _role_extraInitializers), __runInitializers(this, _accessibilityTitle_initializers, "")));
+      __privateSet(this, _accessibilityTitleLevel_accessor_storage, (__runInitializers(this, _accessibilityTitle_extraInitializers), __runInitializers(this, _accessibilityTitleLevel_initializers, "2")));
+      __privateSet(this, __hasAlerts_accessor_storage, (__runInitializers(this, _accessibilityTitleLevel_extraInitializers), __runInitializers(this, __hasAlerts_initializers, false)));
+      this._empty = (__runInitializers(this, __hasAlerts_extraInitializers), new EventEmitter(this, SbbAlertGroupElement2.events.empty));
+      (_a2 = this.addEventListener) == null ? void 0 : _a2.call(this, "didClose", async (e) => {
+        if (!await isEventPrevented(e)) {
+          this._alertClosed(e);
+        }
+      }, {
+        // We use capture here, because didClose does not bubble.
+        capture: true
+      });
+    }
+    /**
+     * The role attribute defines how to announce alerts to the user.
+     *
+     * 'status': sets aria-live to polite and aria-atomic to true.
+     * 'alert': sets aria-live to assertive and aria-atomic to true.
+     */
+    get role() {
+      return __privateGet(this, _role_accessor_storage);
+    }
+    set role(value) {
+      __privateSet(this, _role_accessor_storage, value);
+    }
+    /** Title for this alert group which is only visible for screen reader users. */
+    get accessibilityTitle() {
+      return __privateGet(this, _accessibilityTitle_accessor_storage);
+    }
+    set accessibilityTitle(value) {
+      __privateSet(this, _accessibilityTitle_accessor_storage, value);
+    }
+    /** Level of the accessibility title, will be rendered as heading tag (e.g. h2). Defaults to level 2. */
+    get accessibilityTitleLevel() {
+      return __privateGet(this, _accessibilityTitleLevel_accessor_storage);
+    }
+    set accessibilityTitleLevel(value) {
+      __privateSet(this, _accessibilityTitleLevel_accessor_storage, value);
+    }
+    /** Whether the group currently has any alerts. */
+    get _hasAlerts() {
+      return __privateGet(this, __hasAlerts_accessor_storage);
+    }
+    set _hasAlerts(value) {
+      __privateSet(this, __hasAlerts_accessor_storage, value);
+    }
+    _alertClosed(event) {
+      const target = event.target;
+      const hasFocusInsideAlertGroup = document.activeElement === target;
+      if (hasFocusInsideAlertGroup) {
+        this.tabIndex = 0;
+        this.focus();
+        this.addEventListener("blur", () => this.removeAttribute("tabindex"), {
+          once: true
+        });
+      }
+    }
+    _slotChanged(event) {
+      const hadAlerts = this._hasAlerts;
+      this._hasAlerts = event.target.assignedElements().filter((e) => e instanceof Element && e.localName === "sbb-alert").length > 0;
+      if (!this._hasAlerts && hadAlerts) {
+        this._empty.emit();
+      }
+      this.toggleAttribute("data-empty", !this._hasAlerts);
+    }
+    render() {
+      const TITLE_TAG_NAME = `h${this.accessibilityTitleLevel}`;
+      return html`
+      <div class="sbb-alert-group">
+        ${this._hasAlerts ? html`<${unsafeStatic(TITLE_TAG_NAME)} class="sbb-alert-group__title">
+              <slot name="accessibility-title">${this.accessibilityTitle}</slot>
+            </${unsafeStatic(TITLE_TAG_NAME)}>` : nothing}
+        <slot @slotchange=${(event) => this._slotChanged(event)}></slot>
+      </div>
+    `;
+    }
+  }, _role_accessor_storage = new WeakMap(), _accessibilityTitle_accessor_storage = new WeakMap(), _accessibilityTitleLevel_accessor_storage = new WeakMap(), __hasAlerts_accessor_storage = new WeakMap(), _classThis = _a, (() => {
+    const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+    _role_decorators = [property({ reflect: true })];
+    _accessibilityTitle_decorators = [forceType(), property({ attribute: "accessibility-title" })];
+    _accessibilityTitleLevel_decorators = [property({ attribute: "accessibility-title-level" })];
+    __hasAlerts_decorators = [state()];
+    __esDecorate(_a, null, _role_decorators, { kind: "accessor", name: "role", static: false, private: false, access: { has: (obj) => "role" in obj, get: (obj) => obj.role, set: (obj, value) => {
+      obj.role = value;
+    } }, metadata: _metadata }, _role_initializers, _role_extraInitializers);
+    __esDecorate(_a, null, _accessibilityTitle_decorators, { kind: "accessor", name: "accessibilityTitle", static: false, private: false, access: { has: (obj) => "accessibilityTitle" in obj, get: (obj) => obj.accessibilityTitle, set: (obj, value) => {
+      obj.accessibilityTitle = value;
+    } }, metadata: _metadata }, _accessibilityTitle_initializers, _accessibilityTitle_extraInitializers);
+    __esDecorate(_a, null, _accessibilityTitleLevel_decorators, { kind: "accessor", name: "accessibilityTitleLevel", static: false, private: false, access: { has: (obj) => "accessibilityTitleLevel" in obj, get: (obj) => obj.accessibilityTitleLevel, set: (obj, value) => {
+      obj.accessibilityTitleLevel = value;
+    } }, metadata: _metadata }, _accessibilityTitleLevel_initializers, _accessibilityTitleLevel_extraInitializers);
+    __esDecorate(_a, null, __hasAlerts_decorators, { kind: "accessor", name: "_hasAlerts", static: false, private: false, access: { has: (obj) => "_hasAlerts" in obj, get: (obj) => obj._hasAlerts, set: (obj, value) => {
+      obj._hasAlerts = value;
+    } }, metadata: _metadata }, __hasAlerts_initializers, __hasAlerts_extraInitializers);
+    __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
+    SbbAlertGroupElement2 = _classThis = _classDescriptor.value;
+    if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+  })(), _a.styles = style, _a.events = {
+    empty: "empty"
+  }, __runInitializers(_classThis, _classExtraInitializers), _a);
+  return SbbAlertGroupElement2 = _classThis;
+})();
+export {
+  SbbAlertGroupElement
+};
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYWxlcnQtZ3JvdXAuY29tcG9uZW50LmpzIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9zcmMvZWxlbWVudHMvYWxlcnQvYWxlcnQtZ3JvdXAvYWxlcnQtZ3JvdXAuY29tcG9uZW50LnRzIl0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB0eXBlIHsgQ1NTUmVzdWx0R3JvdXAsIFRlbXBsYXRlUmVzdWx0IH0gZnJvbSAnbGl0JztcbmltcG9ydCB7IExpdEVsZW1lbnQsIG5vdGhpbmcgfSBmcm9tICdsaXQnO1xuaW1wb3J0IHsgY3VzdG9tRWxlbWVudCwgcHJvcGVydHksIHN0YXRlIH0gZnJvbSAnbGl0L2RlY29yYXRvcnMuanMnO1xuaW1wb3J0IHsgaHRtbCwgdW5zYWZlU3RhdGljIH0gZnJvbSAnbGl0L3N0YXRpYy1odG1sLmpzJztcblxuaW1wb3J0IHsgZm9yY2VUeXBlIH0gZnJvbSAnLi4vLi4vY29yZS9kZWNvcmF0b3JzLmpzJztcbmltcG9ydCB7IEV2ZW50RW1pdHRlciwgaXNFdmVudFByZXZlbnRlZCB9IGZyb20gJy4uLy4uL2NvcmUvZXZlbnRpbmcuanMnO1xuaW1wb3J0IHsgU2JiSHlkcmF0aW9uTWl4aW4gfSBmcm9tICcuLi8uLi9jb3JlL21peGlucy5qcyc7XG5pbXBvcnQgdHlwZSB7IFNiYlRpdGxlTGV2ZWwgfSBmcm9tICcuLi8uLi90aXRsZS5qcyc7XG5pbXBvcnQgdHlwZSB7IFNiYkFsZXJ0RWxlbWVudCB9IGZyb20gJy4uL2FsZXJ0LmpzJztcblxuaW1wb3J0IHN0eWxlIGZyb20gJy4vYWxlcnQtZ3JvdXAuc2Nzcz9saXQmaW5saW5lJztcblxuLyoqXG4gKiBJdCBjYW4gYmUgdXNlZCBhcyBhIGNvbnRhaW5lciBmb3Igb25lIG9yIG1vcmUgYHNiYi1hbGVydGAgY29tcG9uZW50LlxuICpcbiAqIEBzbG90IC0gVXNlIHRoZSB1bm5hbWVkIHNsb3QgdG8gYWRkIGBzYmItYWxlcnRgIGVsZW1lbnRzIHRvIHRoZSBgc2JiLWFsZXJ0LWdyb3VwYC5cbiAqIEBzbG90IGFjY2Vzc2liaWxpdHktdGl0bGUgLSB0aXRsZSBmb3IgdGhpcyBgc2JiLWFsZXJ0LWdyb3VwYCB3aGljaCBpcyBvbmx5IHZpc2libGUgZm9yIHNjcmVlbiByZWFkZXIgdXNlcnMuXG4gKiBAZXZlbnQge0N1c3RvbUV2ZW50PHZvaWQ+fSBlbXB0eSAtIEVtaXRzIHdoZW4gYHNiYi1hbGVydC1ncm91cGAgYmVjb21lcyBlbXB0eS5cbiAqL1xuZXhwb3J0XG5AY3VzdG9tRWxlbWVudCgnc2JiLWFsZXJ0LWdyb3VwJylcbmNsYXNzIFNiYkFsZXJ0R3JvdXBFbGVtZW50IGV4dGVuZHMgU2JiSHlkcmF0aW9uTWl4aW4oTGl0RWxlbWVudCkge1xuICBwdWJsaWMgc3RhdGljIG92ZXJyaWRlIHN0eWxlczogQ1NTUmVzdWx0R3JvdXAgPSBzdHlsZTtcbiAgcHVibGljIHN0YXRpYyByZWFkb25seSBldmVudHMgPSB7XG4gICAgZW1wdHk6ICdlbXB0eScsXG4gIH0gYXMgY29uc3Q7XG5cbiAgLyoqXG4gICAqIFRoZSByb2xlIGF0dHJpYnV0ZSBkZWZpbmVzIGhvdyB0byBhbm5vdW5jZSBhbGVydHMgdG8gdGhlIHVzZXIuXG4gICAqXG4gICAqICdzdGF0dXMnOiBzZXRzIGFyaWEtbGl2ZSB0byBwb2xpdGUgYW5kIGFyaWEtYXRvbWljIHRvIHRydWUuXG4gICAqICdhbGVydCc6IHNldHMgYXJpYS1saXZlIHRvIGFzc2VydGl2ZSBhbmQgYXJpYS1hdG9taWMgdG8gdHJ1ZS5cbiAgICovXG4gIEBwcm9wZXJ0eSh7IHJlZmxlY3Q6IHRydWUgfSlcbiAgcHVibGljIG92ZXJyaWRlIGFjY2Vzc29yIHJvbGU6ICdhbGVydCcgfCAnc3RhdHVzJyB8IHN0cmluZyA9ICdzdGF0dXMnO1xuXG4gIC8qKiBUaXRsZSBmb3IgdGhpcyBhbGVydCBncm91cCB3aGljaCBpcyBvbmx5IHZpc2libGUgZm9yIHNjcmVlbiByZWFkZXIgdXNlcnMuICovXG4gIEBmb3JjZVR5cGUoKVxuICBAcHJvcGVydHkoeyBhdHRyaWJ1dGU6ICdhY2Nlc3NpYmlsaXR5LXRpdGxlJyB9KVxuICBwdWJsaWMgYWNjZXNzb3IgYWNjZXNzaWJpbGl0eVRpdGxlOiBzdHJpbmcgPSAnJztcblxuICAvKiogTGV2ZWwgb2YgdGhlIGFjY2Vzc2liaWxpdHkgdGl0bGUsIHdpbGwgYmUgcmVuZGVyZWQgYXMgaGVhZGluZyB0YWcgKGUuZy4gaDIpLiBEZWZhdWx0cyB0byBsZXZlbCAyLiAqL1xuICBAcHJvcGVydHkoeyBhdHRyaWJ1dGU6ICdhY2Nlc3NpYmlsaXR5LXRpdGxlLWxldmVsJyB9KVxuICBwdWJsaWMgYWNjZXNzb3IgYWNjZXNzaWJpbGl0eVRpdGxlTGV2ZWw6IFNiYlRpdGxlTGV2ZWwgPSAnMic7XG5cbiAgLyoqIFdoZXRoZXIgdGhlIGdyb3VwIGN1cnJlbnRseSBoYXMgYW55IGFsZXJ0cy4gKi9cbiAgQHN0YXRlKCkgcHJpdmF0ZSBhY2Nlc3NvciBfaGFzQWxlcnRzOiBib29sZWFuID0gZmFsc2U7XG5cbiAgLyoqIEVtaXRzIHdoZW4gYHNiYi1hbGVydC1ncm91cGAgYmVjb21lcyBlbXB0eS4gKi9cbiAgcHJpdmF0ZSBfZW1wdHk6IEV2ZW50RW1pdHRlcjx2b2lkPiA9IG5ldyBFdmVudEVtaXR0ZXIodGhpcywgU2JiQWxlcnRHcm91cEVsZW1lbnQuZXZlbnRzLmVtcHR5KTtcblxuICBwdWJsaWMgY29uc3RydWN0b3IoKSB7XG4gICAgc3VwZXIoKTtcbiAgICB0aGlzLmFkZEV2ZW50TGlzdGVuZXI/LihcbiAgICAgICdkaWRDbG9zZScsXG4gICAgICBhc3luYyAoZTogQ3VzdG9tRXZlbnQ8dm9pZD4pID0+IHtcbiAgICAgICAgaWYgKCEoYXdhaXQgaXNFdmVudFByZXZlbnRlZChlKSkpIHtcbiAgICAgICAgICB0aGlzLl9hbGVydENsb3NlZChlKTtcbiAgICAgICAgfVxuICAgICAgfSxcbiAgICAgIHtcbiAgICAgICAgLy8gV2UgdXNlIGNhcHR1cmUgaGVyZSwgYmVjYXVzZSBkaWRDbG9zZSBkb2VzIG5vdCBidWJibGUuXG4gICAgICAgIGNhcHR1cmU6IHRydWUsXG4gICAgICB9LFxuICAgICk7XG4gIH1cblxuICBwcml2YXRlIF9hbGVydENsb3NlZChldmVudDogRXZlbnQpOiB2b2lkIHtcbiAgICBjb25zdCB0YXJnZXQgPSBldmVudC50YXJnZXQgYXMgU2JiQWxlcnRFbGVtZW50O1xuICAgIGNvbnN0IGhhc0ZvY3VzSW5zaWRlQWxlcnRHcm91cCA9IGRvY3VtZW50LmFjdGl2ZUVsZW1lbnQgPT09IHRhcmdldDtcblxuICAgIC8vIFJlc3RvcmUgZm9jdXNcbiAgICBpZiAoaGFzRm9jdXNJbnNpZGVBbGVydEdyb3VwKSB7XG4gICAgICAvLyBTZXQgdGFiaW5kZXggdG8gMCB0aGUgbWFrZSBpdCBmb2N1c2FibGUgYW5kIGFmdGVyd2FyZHMgZm9jdXMgaXQuXG4gICAgICAvLyBUaGlzIGlzIGRvbmUgdG8gbm90IGNvbXBsZXRlbHkgbG9zZSBmb2N1cyBhZnRlciByZW1vdmFsIG9mIGFuIGFsZXJ0LlxuICAgICAgLy8gT25jZSB0aGUgc2JiLWFsZXJ0LWdyb3VwIHdhcyBibHVycmVkLCBtYWtlIHRoZSBhbGVydCBncm91cCBub3QgZm9jdXNhYmxlIGFnYWluLlxuICAgICAgdGhpcy50YWJJbmRleCA9IDA7XG4gICAgICB0aGlzLmZvY3VzKCk7XG4gICAgICB0aGlzLmFkZEV2ZW50TGlzdGVuZXIoJ2JsdXInLCAoKSA9PiB0aGlzLnJlbW92ZUF0dHJpYnV0ZSgndGFiaW5kZXgnKSwge1xuICAgICAgICBvbmNlOiB0cnVlLFxuICAgICAgfSk7XG4gICAgfVxuICB9XG5cbiAgcHJpdmF0ZSBfc2xvdENoYW5nZWQoZXZlbnQ6IEV2ZW50KTogdm9pZCB7XG4gICAgY29uc3QgaGFkQWxlcnRzID0gdGhpcy5faGFzQWxlcnRzO1xuICAgIHRoaXMuX2hhc0FsZXJ0cyA9XG4gICAgICAoZXZlbnQudGFyZ2V0IGFzIEhUTUxTbG90RWxlbWVudClcbiAgICAgICAgLmFzc2lnbmVkRWxlbWVudHMoKVxuICAgICAgICAuZmlsdGVyKChlKSA9PiBlIGluc3RhbmNlb2YgRWxlbWVudCAmJiBlLmxvY2FsTmFtZSA9PT0gJ3NiYi1hbGVydCcpLmxlbmd0aCA+IDA7XG4gICAgaWYgKCF0aGlzLl9oYXNBbGVydHMgJiYgaGFkQWxlcnRzKSB7XG4gICAgICB0aGlzLl9lbXB0eS5lbWl0KCk7XG4gICAgfVxuXG4gICAgdGhpcy50b2dnbGVBdHRyaWJ1dGUoJ2RhdGEtZW1wdHknLCAhdGhpcy5faGFzQWxlcnRzKTtcbiAgfVxuXG4gIHByb3RlY3RlZCBvdmVycmlkZSByZW5kZXIoKTogVGVtcGxhdGVSZXN1bHQge1xuICAgIGNvbnN0IFRJVExFX1RBR19OQU1FID0gYGgke3RoaXMuYWNjZXNzaWJpbGl0eVRpdGxlTGV2ZWx9YDtcblxuICAgIC8qIGVzbGludC1kaXNhYmxlIGxpdC9iaW5kaW5nLXBvc2l0aW9ucyAqL1xuICAgIHJldHVybiBodG1sYFxuICAgICAgPGRpdiBjbGFzcz1cInNiYi1hbGVydC1ncm91cFwiPlxuICAgICAgICAke3RoaXMuX2hhc0FsZXJ0c1xuICAgICAgICAgID8gaHRtbGA8JHt1bnNhZmVTdGF0aWMoVElUTEVfVEFHX05BTUUpfSBjbGFzcz1cInNiYi1hbGVydC1ncm91cF9fdGl0bGVcIj5cbiAgICAgICAgICAgICAgPHNsb3QgbmFtZT1cImFjY2Vzc2liaWxpdHktdGl0bGVcIj4ke3RoaXMuYWNjZXNzaWJpbGl0eVRpdGxlfTwvc2xvdD5cbiAgICAgICAgICAgIDwvJHt1bnNhZmVTdGF0aWMoVElUTEVfVEFHX05BTUUpfT5gXG4gICAgICAgICAgOiBub3RoaW5nfVxuICAgICAgICA8c2xvdCBAc2xvdGNoYW5nZT0keyhldmVudDogRXZlbnQpID0+IHRoaXMuX3Nsb3RDaGFuZ2VkKGV2ZW50KX0+PC9zbG90PlxuICAgICAgPC9kaXY+XG4gICAgYDtcbiAgfVxufVxuXG5kZWNsYXJlIGdsb2JhbCB7XG4gIGludGVyZmFjZSBIVE1MRWxlbWVudFRhZ05hbWVNYXAge1xuICAgIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBAdHlwZXNjcmlwdC1lc2xpbnQvbmFtaW5nLWNvbnZlbnRpb25cbiAgICAnc2JiLWFsZXJ0LWdyb3VwJzogU2JiQWxlcnRHcm91cEVsZW1lbnQ7XG4gIH1cbn1cbiJdLCJuYW1lcyI6WyJTYmJBbGVydEdyb3VwRWxlbWVudCIsIl9hIl0sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0lBc0JNLHdCQUFvQixNQUFBOzswQkFEekIsY0FBYyxpQkFBaUIsQ0FBQzs7OztvQkFDRSxrQkFBa0IsVUFBVTs7Ozs7Ozs7Ozs7OztBQUFwQ0EsTUFBQUEseUJBQUEsbUJBQVEsWUFBNkI7QUFBQSxJQThCOUQsY0FBQTs7O0FBakJBO0FBS0E7QUFJQTtBQUdTO0FBWmdCLHlCQUFBLHdCQUFBLGtCQUFBLE1BQUEsb0JBQW9DLFFBQVE7QUFLckQseUJBQUEsdUNBQUEsa0JBQUEsTUFBQSx1QkFBQSxHQUFBLGtCQUFBLE1BQUEsa0NBQTZCLEVBQUU7QUFJL0IseUJBQUEsNENBQUEsa0JBQUEsTUFBQSxxQ0FBQSxHQUFBLGtCQUFBLE1BQUEsdUNBQXlDLEdBQUc7QUFHbEMseUJBQUEsK0JBQUEsa0JBQUEsTUFBQSwwQ0FBQSxHQUFBLGtCQUFBLE1BQUEsMEJBQXNCLEtBQUs7QUFHN0MsV0FBQSxVQUE2QixrQkFBQSxNQUFBLDZCQUFBLEdBQUEsSUFBSSxhQUFhLE1BQU1BLHNCQUFxQixPQUFPLEtBQUs7QUFJdEYsT0FBQUMsTUFBQSxLQUFBLHFCQUFBLGdCQUFBQSxJQUFBLFdBQ0gsWUFDQSxPQUFPLE1BQXdCO0FBQzdCLFlBQUksQ0FBRSxNQUFNLGlCQUFpQixDQUFDLEdBQUk7QUFDaEMsZUFBSyxhQUFhLENBQUM7QUFBQSxRQUFBO0FBQUEsTUFDckIsR0FFRjtBQUFBO0FBQUEsUUFFRSxTQUFTO0FBQUEsTUFBQTtBQUFBLElBQ1Y7QUFBQTtBQUFBO0FBQUE7QUFBQTtBQUFBO0FBQUE7QUFBQSxJQTdCTCxJQUF5QixPQUE2QztBQUFBLGFBQUEsbUJBQUE7QUFBQSxJQUFBO0FBQUEs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

package/development/alert/alert-group.d.ts

@@ -1,5 +1,5 @@
 /**
  * @entrypoint
  */
-export * from './alert-group/alert-group.js';
+export * from './alert-group/alert-group.component.js';
 //# sourceMappingURL=alert-group.d.ts.map

package/development/alert/alert-group.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"alert-group.d.ts","sourceRoot":"","sources":["../../../../src/elements/alert/alert-group.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,cAAc,8BAA8B,CAAC"}
+{"version":3,"file":"alert-group.d.ts","sourceRoot":"","sources":["../../../../src/elements/alert/alert-group.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,cAAc,wCAAwC,CAAC"}

package/development/alert/alert-group.js

@@ -1,4 +1,4 @@
-import { SbbAlertGroupElement } from "./alert-group/alert-group.js";
+import { SbbAlertGroupElement } from "./alert-group/alert-group.component.js";
 export {
   SbbAlertGroupElement
 };

package/development/alert/alert.d.ts

@@ -1,5 +1,5 @@
 /**
  * @entrypoint
  */
-export * from './alert/alert.js';
+export * from './alert/alert.component.js';
 //# sourceMappingURL=alert.d.ts.map

package/development/alert/alert.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"alert.d.ts","sourceRoot":"","sources":["../../../../src/elements/alert/alert.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,cAAc,kBAAkB,CAAC"}
+{"version":3,"file":"alert.d.ts","sourceRoot":"","sources":["../../../../src/elements/alert/alert.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,cAAc,4BAA4B,CAAC"}

package/development/alert/alert.js

@@ -1,4 +1,4 @@
-import { SbbAlertElement } from "./alert/alert.js";
+import { SbbAlertElement } from "./alert/alert.component.js";
 export {
   SbbAlertElement
 };

package/development/alert.js

@@ -1,5 +1,5 @@
-import { SbbAlertElement } from "./alert/alert/alert.js";
-import { SbbAlertGroupElement } from "./alert/alert-group/alert-group.js";
+import { SbbAlertElement } from "./alert/alert/alert.component.js";
+import { SbbAlertGroupElement } from "./alert/alert-group/alert-group.component.js";
 export {
   SbbAlertElement,
   SbbAlertGroupElement

package/development/autocomplete/autocomplete.component.d.ts

@@ -0,0 +1,33 @@
+import { SbbOptionElement } from '../option.js';
+import { SbbAutocompleteBaseElement } from './autocomplete-base-element.js';
+/**
+ * Combined with a native input, it displays a panel with a list of available options.
+ *
+ * @slot - Use the unnamed slot to add `sbb-option` or `sbb-optgroup` elements to the `sbb-autocomplete`.
+ * @event {CustomEvent<void>} willOpen - Emits whenever the `sbb-autocomplete` starts the opening transition. Can be canceled.
+ * @event {CustomEvent<void>} didOpen - Emits whenever the `sbb-autocomplete` is opened.
+ * @event {CustomEvent<void>} willClose - Emits whenever the `sbb-autocomplete` begins the closing transition. Can be canceled.
+ * @event {CustomEvent<void>} didClose - Emits whenever the `sbb-autocomplete` is closed.
+ * @cssprop [--sbb-autocomplete-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 SbbAutocompleteElement extends SbbAutocompleteBaseElement {
+    protected overlayId: string;
+    protected panelRole: string;
+    private _activeItemIndex;
+    protected get options(): SbbOptionElement[];
+    constructor();
+    protected syncNegative(): void;
+    protected openedPanelKeyboardInteraction(event: KeyboardEvent): void;
+    protected selectByKeyboard(event: KeyboardEvent): void;
+    protected setNextActiveOption(event: KeyboardEvent): void;
+    protected resetActiveElement(): void;
+    protected setTriggerAttributes(element: HTMLInputElement): void;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'sbb-autocomplete': SbbAutocompleteElement;
+    }
+}
+//# sourceMappingURL=autocomplete.component.d.ts.map

package/development/autocomplete/autocomplete.component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"autocomplete.component.d.ts","sourceRoot":"","sources":["../../../../src/elements/autocomplete/autocomplete.component.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAsB,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAEzE,OAAO,EAAE,0BAA0B,EAAE,MAAM,gCAAgC,CAAC;AAU5E;;;;;;;;;;;GAWG;AACH,qBAKM,sBAAuB,SAAQ,0BAA0B;IAC7D,SAAS,CAAC,SAAS,SAAkC;IACrD,SAAS,CAAC,SAAS,SAAa;IAChC,OAAO,CAAC,gBAAgB,CAAM;IAE9B,SAAS,KAAK,OAAO,IAAI,gBAAgB,EAAE,CAE1C;;IASD,SAAS,CAAC,YAAY,IAAI,IAAI;IAQ9B,SAAS,CAAC,8BAA8B,CAAC,KAAK,EAAE,aAAa,GAAG,IAAI;IAqBpE,SAAS,CAAC,gBAAgB,CAAC,KAAK,EAAE,aAAa,GAAG,IAAI;IAStD,SAAS,CAAC,mBAAmB,CAAC,KAAK,EAAE,aAAa,GAAG,IAAI;IAqBzD,SAAS,CAAC,kBAAkB,IAAI,IAAI;IAUpC,SAAS,CAAC,oBAAoB,CAAC,OAAO,EAAE,gBAAgB,GAAG,IAAI;CAGhE;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,kBAAkB,EAAE,sBAAsB,CAAC;KAC5C;CACF"}

package/development/autocomplete/autocomplete.component.js

@@ -0,0 +1,99 @@
+import { __esDecorate, __runInitializers } from "tslib";
+import { customElement } from "lit/decorators.js";
+import { getNextElementIndex } from "../core/a11y.js";
+import { hostAttributes } from "../core/decorators.js";
+import { isSafari } from "../core/dom.js";
+import { setAriaComboBoxAttributes } from "../core/overlay.js";
+import { SbbAutocompleteBaseElement } from "./autocomplete-base-element.js";
+let nextId = 0;
+const ariaRoleOnHost = isSafari;
+let SbbAutocompleteElement = (() => {
+  var _a;
+  let _classDecorators = [customElement("sbb-autocomplete"), hostAttributes({
+    role: ariaRoleOnHost ? "listbox" : null
+  })];
+  let _classDescriptor;
+  let _classExtraInitializers = [];
+  let _classThis;
+  let _classSuper = SbbAutocompleteBaseElement;
+  _a = class extends _classSuper {
+    get options() {
+      var _a2;
+      return Array.from(((_a2 = this.querySelectorAll) == null ? void 0 : _a2.call(this, "sbb-option")) ?? []);
+    }
+    constructor() {
+      var _a2;
+      super();
+      this.overlayId = `sbb-autocomplete-${++nextId}`;
+      this.panelRole = "listbox";
+      this._activeItemIndex = -1;
+      (_a2 = this.addEventListener) == null ? void 0 : _a2.call(this, "optionSelectionChange", (e) => this.onOptionSelected(e));
+    }
+    syncNegative() {
+      var _a2, _b;
+      (_a2 = this.querySelectorAll) == null ? void 0 : _a2.call(this, "sbb-divider").forEach((divider) => divider.negative = this.negative);
+      (_b = this.querySelectorAll) == null ? void 0 : _b.call(this, "sbb-option, sbb-optgroup").forEach((element) => element.toggleAttribute("data-negative", this.negative));
+    }
+    openedPanelKeyboardInteraction(event) {
+      if (this.state !== "opened") {
+        return;
+      }
+      switch (event.key) {
+        case "Tab":
+          this.close();
+          break;
+        case "Enter":
+          this.selectByKeyboard(event);
+          break;
+        case "ArrowDown":
+        case "ArrowUp":
+          this.setNextActiveOption(event);
+          break;
+      }
+    }
+    selectByKeyboard(event) {
+      event.preventDefault();
+      const activeOption = this.options[this._activeItemIndex];
+      if (activeOption) {
+        activeOption.setSelectedViaUserInteraction(true);
+      }
+    }
+    setNextActiveOption(event) {
+      var _a2;
+      const filteredOptions = this.options.filter((opt) => !opt.disabled && !opt.hasAttribute("data-group-disabled"));
+      const next = getNextElementIndex(event, this._activeItemIndex, filteredOptions.length);
+      const nextActiveOption = filteredOptions[next];
+      nextActiveOption.setActive(true);
+      (_a2 = this.triggerElement) == null ? void 0 : _a2.setAttribute("aria-activedescendant", nextActiveOption.id);
+      nextActiveOption.scrollIntoView({ block: "nearest" });
+      const lastActiveOption = filteredOptions[this._activeItemIndex];
+      if (lastActiveOption) {
+        lastActiveOption.setActive(false);
+      }
+      this._activeItemIndex = next;
+    }
+    resetActiveElement() {
+      var _a2;
+      const activeElement = this.options[this._activeItemIndex];
+      if (activeElement) {
+        activeElement.setActive(false);
+      }
+      this._activeItemIndex = -1;
+      (_a2 = this.triggerElement) == null ? void 0 : _a2.removeAttribute("aria-activedescendant");
+    }
+    setTriggerAttributes(element) {
+      setAriaComboBoxAttributes(element, ariaRoleOnHost ? this.id : this.overlayId, false);
+    }
+  }, _classThis = _a, (() => {
+    const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+    __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
+    _classThis = _classDescriptor.value;
+    if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+    __runInitializers(_classThis, _classExtraInitializers);
+  })(), _a;
+  return _classThis;
+})();
+export {
+  SbbAutocompleteElement
+};
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYXV0b2NvbXBsZXRlLmNvbXBvbmVudC5qcyIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vc3JjL2VsZW1lbnRzL2F1dG9jb21wbGV0ZS9hdXRvY29tcGxldGUuY29tcG9uZW50LnRzIl0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGN1c3RvbUVsZW1lbnQgfSBmcm9tICdsaXQvZGVjb3JhdG9ycy5qcyc7XG5cbmltcG9ydCB7IGdldE5leHRFbGVtZW50SW5kZXggfSBmcm9tICcuLi9jb3JlL2ExMXkuanMnO1xuaW1wb3J0IHsgaG9zdEF0dHJpYnV0ZXMgfSBmcm9tICcuLi9jb3JlL2RlY29yYXRvcnMuanMnO1xuaW1wb3J0IHsgaXNTYWZhcmkgfSBmcm9tICcuLi9jb3JlL2RvbS5qcyc7XG5pbXBvcnQgeyBzZXRBcmlhQ29tYm9Cb3hBdHRyaWJ1dGVzIH0gZnJvbSAnLi4vY29yZS9vdmVybGF5LmpzJztcbmltcG9ydCB0eXBlIHsgU2JiT3B0R3JvdXBFbGVtZW50LCBTYmJPcHRpb25FbGVtZW50IH0gZnJvbSAnLi4vb3B0aW9uLmpzJztcblxuaW1wb3J0IHsgU2JiQXV0b2NvbXBsZXRlQmFzZUVsZW1lbnQgfSBmcm9tICcuL2F1dG9jb21wbGV0ZS1iYXNlLWVsZW1lbnQuanMnO1xuXG5sZXQgbmV4dElkID0gMDtcblxuLyoqXG4gKiBPbiBTYWZhcmksIHRoZSBhcmlhIHJvbGUgJ2xpc3Rib3gnIG11c3QgYmUgb24gdGhlIGhvc3QgZWxlbWVudCwgb3IgZWxzZSBWb2ljZU92ZXIgd29uJ3Qgd29yayBhdCBhbGwuXG4gKiBPbiB0aGUgb3RoZXIgaGFuZCwgSkFXUyBhbmQgTlZEQSBuZWVkIHRoZSByb2xlIHRvIGJlIFwiY2xvc2VyXCIgdG8gdGhlIG9wdGlvbnMsIG9yIGVsc2Ugb3B0Z3JvdXBzIHdvbid0IHdvcmsuXG4gKi9cbmNvbnN0IGFyaWFSb2xlT25Ib3N0ID0gaXNTYWZhcmk7XG5cbi8qKlxuICogQ29tYmluZWQgd2l0aCBhIG5hdGl2ZSBpbnB1dCwgaXQgZGlzcGxheXMgYSBwYW5lbCB3aXRoIGEgbGlzdCBvZiBhdmFpbGFibGUgb3B0aW9ucy5cbiAqXG4gKiBAc2xvdCAtIFVzZSB0aGUgdW5uYW1lZCBzbG90IHRvIGFkZCBgc2JiLW9wdGlvbmAgb3IgYHNiYi1vcHRncm91cGAgZWxlbWVudHMgdG8gdGhlIGBzYmItYXV0b2NvbXBsZXRlYC5cbiAqIEBldmVudCB7Q3VzdG9tRXZlbnQ8dm9pZD59IHdpbGxPcGVuIC0gRW1pdHMgd2hlbmV2ZXIgdGhlIGBzYmItYXV0b2NvbXBsZXRlYCBzdGFydHMgdGhlIG9wZW5pbmcgdHJhbnNpdGlvbi4gQ2FuIGJlIGNhbmNlbGVkLlxuICogQGV2ZW50IHtDdXN0b21FdmVudDx2b2lkPn0gZGlkT3BlbiAtIEVtaXRzIHdoZW5ldmVyIHRoZSBgc2JiLWF1dG9jb21wbGV0ZWAgaXMgb3BlbmVkLlxuICogQGV2ZW50IHtDdXN0b21FdmVudDx2b2lkPn0gd2lsbENsb3NlIC0gRW1pdHMgd2hlbmV2ZXIgdGhlIGBzYmItYXV0b2NvbXBsZXRlYCBiZWdpbnMgdGhlIGNsb3NpbmcgdHJhbnNpdGlvbi4gQ2FuIGJlIGNhbmNlbGVkLlxuICogQGV2ZW50IHtDdXN0b21FdmVudDx2b2lkPn0gZGlkQ2xvc2UgLSBFbWl0cyB3aGVuZXZlciB0aGUgYHNiYi1hdXRvY29tcGxldGVgIGlzIGNsb3NlZC5cbiAqIEBjc3Nwcm9wIFstLXNiYi1hdXRvY29tcGxldGUtei1pbmRleD12YXIoLS1zYmItb3ZlcmxheS1kZWZhdWx0LXotaW5kZXgpXSAtIFRvIHNwZWNpZnkgYSBjdXN0b20gc3RhY2sgb3JkZXIsXG4gKiB0aGUgYHotaW5kZXhgIGNhbiBiZSBvdmVycmlkZGVuIGJ5IGRlZmluaW5nIHRoaXMgQ1NTIHZhcmlhYmxlLiBUaGUgZGVmYXVsdCBgei1pbmRleGAgb2YgdGhlXG4gKiBjb21wb25lbnQgaXMgc2V0IHRvIGB2YXIoLS1zYmItb3ZlcmxheS1kZWZhdWx0LXotaW5kZXgpYCB3aXRoIGEgdmFsdWUgb2YgYDEwMDBgLlxuICovXG5leHBvcnRcbkBjdXN0b21FbGVtZW50KCdzYmItYXV0b2NvbXBsZXRlJylcbkBob3N0QXR0cmlidXRlcyh7XG4gIHJvbGU6IGFyaWFSb2xlT25Ib3N0ID8gJ2xpc3Rib3gnIDogbnVsbCxcbn0pXG5jbGFzcyBTYmJBdXRvY29tcGxldGVFbGVtZW50IGV4dGVuZHMgU2JiQXV0b2NvbXBsZXRlQmFzZUVsZW1lbnQge1xuICBwcm90ZWN0ZWQgb3ZlcmxheUlkID0gYHNiYi1hdXRvY29tcGxldGUtJHsrK25leHRJZH1gO1xuICBwcm90ZWN0ZWQgcGFuZWxSb2xlID0gJ2xpc3Rib3gnO1xuICBwcml2YXRlIF9hY3RpdmVJdGVtSW5kZXggPSAtMTtcblxuICBwcm90ZWN0ZWQgZ2V0IG9wdGlvbnMoKTogU2JiT3B0aW9uRWxlbWVudFtdIHtcbiAgICByZXR1cm4gQXJyYXkuZnJvbSh0aGlzLnF1ZXJ5U2VsZWN0b3JBbGw/Lignc2JiLW9wdGlvbicpID8/IFtdKTtcbiAgfVxuXG4gIHB1YmxpYyBjb25zdHJ1Y3RvcigpIHtcbiAgICBzdXBlcigpO1xuICAgIHRoaXMuYWRkRXZlbnRMaXN0ZW5lcj8uKCdvcHRpb25TZWxlY3Rpb25DaGFuZ2UnLCAoZTogQ3VzdG9tRXZlbnQ8dm9pZD4pID0+XG4gICAgICB0aGlzLm9uT3B0aW9uU2VsZWN0ZWQoZSksXG4gICAgKTtcbiAgfVxuXG4gIHByb3RlY3RlZCBzeW5jTmVnYXRpdmUoKTogdm9pZCB7XG4gICAgdGhpcy5xdWVyeVNlbGVjdG9yQWxsPy4oJ3NiYi1kaXZpZGVyJykuZm9yRWFjaCgoZGl2aWRlcikgPT4gKGRpdmlkZXIubmVnYXRpdmUgPSB0aGlzLm5lZ2F0aXZlKSk7XG5cbiAgICB0aGlzLnF1ZXJ5U2VsZWN0b3JBbGw/LjxTYmJPcHRpb25FbGVtZW50IHwgU2JiT3B0R3JvdXBFbGVtZW50PihcbiAgICAgICdzYmItb3B0aW9uLCBzYmItb3B0Z3JvdXAnLFxuICAgICkuZm9yRWFjaCgoZWxlbWVudCkgPT4gZWxlbWVudC50b2dnbGVBdHRyaWJ1dGUoJ2RhdGEtbmVnYXRpdmUnLCB0aGlzLm5lZ2F0aXZlKSk7XG4gIH1cblxuICBwcm90ZWN0ZWQgb3BlbmVkUGFuZWxLZXlib2FyZEludGVyYWN0aW9uKGV2ZW50OiBLZXlib2FyZEV2ZW50KTogdm9pZCB7XG4gICAgaWYgKHRoaXMuc3RhdGUgIT09ICdvcGVuZWQnKSB7XG4gICAgICByZXR1cm47XG4gICAgfVxuXG4gICAgc3dpdGNoIChldmVudC5rZXkpIHtcbiAgICAgIGNhc2UgJ1RhYic6XG4gICAgICAgIHRoaXMuY2xvc2UoKTtcbiAgICAgICAgYnJlYWs7XG5cbiAgICAgIGNhc2UgJ0VudGVyJzpcbiAgICAgICAgdGhpcy5zZWxlY3RCeUtleWJvYXJkKGV2ZW50KTtcbiAgICAgICAgYnJlYWs7XG5cbiAgICAgIGNhc2UgJ0Fycm93RG93bic6XG4gICAgICBjYXNlICdBcnJvd1VwJzpcbiAgICAgICAgdGhpcy5zZXROZXh0QWN0aXZlT3B0aW9uKGV2ZW50KTtcbiAgICAgICAgYnJlYWs7XG4gICAgfVxuICB9XG5cbiAgcHJvdGVjdGVkIHNlbGVjdEJ5S2V5Ym9hcmQoZXZlbnQ6IEtleWJvYXJkRXZlbnQpOiB2b2lkIHtcbiAgICBldmVudC5wcmV2ZW50RGVmYXVsdCgpO1xuICAgIGNvbnN0IGFjdGl2ZU9wdGlvbiA9IHRoaXMub3B0aW9uc1t0aGlzLl9hY3RpdmVJdGVtSW5kZXhdO1xuXG4gICAgaWYgKGFjdGl2ZU9wdGlvbikge1xuICAgICAgYWN0aXZlT3B0aW9uLnNldFNlbGVjdGVkVmlhVXNlckludGVyYWN0aW9uKHRydWUpO1xuICAgIH1cbiAgfVxuXG4gIHByb3RlY3RlZCBzZXROZXh0QWN0aXZlT3B0aW9uKGV2ZW50OiBLZXlib2FyZEV2ZW50KTogdm9pZCB7XG4gICAgY29uc3QgZmlsdGVyZWRPcHRpb25zID0gdGhpcy5vcHRpb25zLmZpbHRlcihcbiAgICAgIChvcHQpID0+ICFvcHQuZGlzYWJsZWQgJiYgIW9wdC5oYXNBdHRyaWJ1dGUoJ2RhdGEtZ3JvdXAtZGlzYWJsZWQnKSxcbiAgICApO1xuXG4gICAgLy8gR2V0IGFuZCBhY3RpdmF0ZSB0aGUgbmV4dCBhY3RpdmUgb3B0aW9uXG4gICAgY29uc3QgbmV4dCA9IGdldE5leHRFbGVtZW50SW5kZXgoZXZlbnQsIHRoaXMuX2FjdGl2ZUl0ZW1JbmRleCwgZmlsdGVyZWRPcHRpb25zLmxlbmd0aCk7XG4gICAgY29uc3QgbmV4dEFjdGl2ZU9wdGlvbiA9IGZpbHRlcmVkT3B0aW9uc1tuZXh0XTtcbiAgICBuZXh0QWN0aXZlT3B0aW9uLnNldEFjdGl2ZSh0cnVlKTtcbiAgICB0aGlzLnRyaWdnZXJFbGVtZW50Py5zZXRBdHRyaWJ1dGUoJ2FyaWEtYWN0aXZlZGVzY2VuZGFudCcsIG5leHRBY3RpdmVPcHRpb24uaWQpO1xuICAgIG5leHRBY3RpdmVPcHRpb24uc2Nyb2xsSW50b1ZpZXcoeyBibG9jazogJ25lYXJlc3QnIH0pO1xuXG4gICAgLy8gUmVzZXQgdGhlIHByZXZpb3VzIGFjdGl2ZSBvcHRpb25cbiAgICBjb25zdCBsYXN0QWN0aXZlT3B0aW9uID0gZmlsdGVyZWRPcHRpb25zW3RoaXMuX2FjdGl2ZUl0ZW1JbmRleF07XG4gICAgaWYgKGxhc3RBY3RpdmVPcHRpb24pIHtcbiAgICAgIGxhc3RBY3RpdmVPcHRpb24uc2V0QWN0aXZlKGZhbHNlKTtcbiAgICB9XG5cbiAgICB0aGlzLl9hY3RpdmVJdGVtSW5kZXggPSBuZXh0O1xuICB9XG5cbiAgcHJvdGVjdGVkIHJlc2V0QWN0aXZlRWxlbWVudCgpOiB2b2lkIHtcbiAgICBjb25zdCBhY3RpdmVFbGVtZW50ID0gdGhpcy5vcHRpb25zW3RoaXMuX2FjdGl2ZUl0ZW1JbmRleF07XG5cbiAgICBpZiAoYWN0aXZlRWxlbWVudCkge1xuICAgICAgYWN0aXZlRWxlbWVudC5zZXRBY3RpdmUoZmFsc2UpO1xuICAgIH1cbiAgICB0aGlzLl9hY3RpdmVJdGVtSW5kZXggPSAtMTtcbiAgICB0aGlzLnRyaWdnZXJFbGVtZW50Py5yZW1vdmVBdHRyaWJ1dGUoJ2FyaWEtYWN0aXZlZGVzY2VuZGFudCcpO1xuICB9XG5cbiAgcHJvdGVjdGVkIHNldFRyaWdnZXJBdHRyaWJ1dGVzKGVsZW1lbnQ6IEhUTUxJbnB1dEVsZW1lbnQpOiB2b2lkIHtcbiAgICBzZXRBcmlhQ29tYm9Cb3hBdHRyaWJ1dGVzKGVsZW1lbnQsIGFyaWFSb2xlT25Ib3N0ID8gdGhpcy5pZCA6IHRoaXMub3ZlcmxheUlkLCBmYWxzZSk7XG4gIH1cbn1cblxuZGVjbGFyZSBnbG9iYWwge1xuICBpbnRlcmZhY2UgSFRNTEVsZW1lbnRUYWdOYW1lTWFwIHtcbiAgICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgQHR5cGVzY3JpcHQtZXNsaW50L25hbWluZy1jb252ZW50aW9uXG4gICAgJ3NiYi1hdXRvY29tcGxldGUnOiBTYmJBdXRvY29tcGxldGVFbGVtZW50O1xuICB9XG59XG4iXSwibmFtZXMiOlsiX2EiXSwibWFwcGluZ3MiOiI7Ozs7Ozs7QUFVQSxJQUFJLFNBQVM7QUFNYixNQUFNLGlCQUFpQjtJQW1CakIsMEJBQXNCLE1BQUE7O0FBSjNCLE1BQUEsbUJBQUEsQ0FBQSxjQUFjLGtCQUFrQixHQUNoQyxlQUFlO0FBQUEsSUFDZCxNQUFNLGlCQUFpQixZQUFZO0FBQUEsRUFBQSxDQUNwQyxDQUFDOzs7O29CQUNtQztBQUFSLEVBQUEsbUJBQVEsWUFBMEI7QUFBQSxJQUs3RCxJQUFjLFVBQU87O0FBQ25CLGFBQU8sTUFBTSxPQUFLQSxNQUFBLEtBQUsscUJBQUwsZ0JBQUFBLElBQUEsV0FBd0Isa0JBQWlCLEVBQUU7QUFBQSxJQUFBO0FBQUEsSUFHL0QsY0FBQTs7O0FBUlUsV0FBQSxZQUFZLG9CQUFvQixFQUFFLE1BQU07QUFDeEMsV0FBUyxZQUFHO0FBQ2QsV0FBZ0IsbUJBQUc7QUFRekIsT0FBQUEsTUFBQSxLQUFLLHFCQUFMLGdCQUFBQSxJQUFBLFdBQXdCLHlCQUF5QixDQUFDLE1BQ2hELEtBQUssaUJBQWlCLENBQUM7QUFBQSxJQUFDO0FBQUEsSUFJbEIsZUFBWTs7QUFDZixPQUFBQSxNQUFBLEtBQUEscUJBQUEsZ0JBQUFBLElBQUEsV0FBbUIsZUFBZSxRQUFRLENBQUMsWUFBYSxRQUFRLFdBQVcsS0FBSztBQUVoRixpQkFBQSxxQkFBQSw4QkFDSCw0QkFDQSxRQUFRLENBQUMsWUFBWSxRQUFRLGdCQUFnQixpQkFBaUIsS0FBSyxRQUFRO0FBQUEsSUFBQztBQUFBLElBR3RFLCtCQUErQixPQUFvQjtBQUN2RCxVQUFBLEtBQUssVUFBVSxVQUFVO0FBQzNCO0FBQUEsTUFBQTtBQUdGLGNBQVEsTUFBTSxLQUFLO0FBQUEsUUFDakIsS0FBSztBQUNILGVBQUssTUFBSztBQUNWO0FBQUEsUUFFRixLQUFLO0FBQ0gsZUFBSyxpQkFBaUIsS0FBSztBQUMzQjtBQUFBLFFBRUYsS0FBSztBQUFBLFFBQ0wsS0FBSztBQUNILGVBQUssb0JBQW9CLEtBQUs7QUFDOUI7QUFBQSxNQUFBO0FBQUEsSUFDSjtBQUFBLElBR1EsaUJBQWlCLE9BQW9CO0FBQzdDLFlBQU0sZUFBYztBQUNwQixZQUFNLGVBQWUsS0FBSyxRQUFRLEtBQUssZ0JBQWdCO0FBRXZELFVBQUksY0FBYztBQUNoQixxQkFBYSw4QkFBOEIsSUFBSTtBQUFBLE1BQUE7QUFBQSxJQUNqRDtBQUFBLElBR1Esb0JBQW9CLE9BQW9COztBQUNoRCxZQUFNLGtCQUFrQixLQUFLLFFBQVEsT0FDbkMsQ0FBQyxRQUFRLENBQUMsSUFBSSxZQUFZLENBQUMsSUFBSSxhQUFhLHFCQUFxQixDQUFDO0FBSXBFLFlBQU0sT0FBTyxvQkFBb0IsT0FBTyxLQUFLLGtCQUFrQixnQkFBZ0IsTUFBTTtBQUMvRSxZQUFBLG1CQUFtQixnQkFBZ0IsSUFBSTtBQUM3Qyx1QkFBaUIsVUFBVSxJQUFJO0FBQy9CLE9BQUFBLE1BQUEsS0FBSyxtQkFBTCxnQkFBQUEsSUFBcUIsYUFBYSx5QkFBeUIsaUJBQWlCO0FBQzVFLHVCQUFpQixlQUFlLEVBQUUsT0FBTyxVQUFBLENBQVc7QUFHOUMsWUFBQSxtQkFBbUIsZ0JBQWdCLEtBQUssZ0JBQWdCO0FBQzlELFVBQUksa0JBQWtCO0FBQ3BCLHlCQUFpQixVQUFVLEtBQUs7QUFBQSxNQUFBO0FBR2xDLFdBQUssbUJBQW1CO0FBQUEsSUFBQTtBQUFBLElBR2hCLHFCQUFrQjs7QUFDMUIsWUFBTSxnQkFBZ0IsS0FBSyxRQUFRLEtBQUssZ0JBQWdCO0FBRXhELFVBQUksZUFBZTtBQUNqQixzQkFBYyxVQUFVLEtBQUs7QUFBQSxNQUFBO0FBRS9CLFdBQUssbUJBQW1CO0FBQ25CLE9BQUFBLE1BQUEsS0FBQSxtQkFBQSxnQkFBQUEsSUFBZ0IsZ0JBQWdCO0FBQUEsSUFBdUI7QUFBQSxJQUdwRCxxQkFBcUIsU0FBeUI7QUFDdEQsZ0NBQTBCLFNBQVMsaUJBQWlCLEtBQUssS0FBSyxLQUFLLFdBQVcsS0FBSztBQUFBLElBQUE7QUFBQSxFQUNyRjs7QUF2RkYsaUJBd0ZDLE1BQUEsbUJBQUEsRUFBQSxPQUFBLFdBQUEsR0FBQSxrQkFBQSxFQUFBLE1BQUEsU0FBQSxNQUFBLFdBQUEsTUFBQSxVQUFBLFVBQUEsR0FBQSxNQUFBLHVCQUFBOzs7QUF4Rkssc0JBQXNCLFlBQUEsdUJBQUE7QUFBQSxFQUFBLE1BQUM7OzsifQ==

package/development/autocomplete-grid/autocomplete-grid/autocomplete-grid.component.d.ts

@@ -0,0 +1,43 @@
+import { SbbAutocompleteBaseElement } from '../../autocomplete.js';
+import { SbbAutocompleteGridOptionElement } from '../autocomplete-grid-option.js';
+/**
+ * Combined with a native input, it displays a panel with a list of available options with connected buttons.
+ *
+ * @slot - Use the unnamed slot to add `sbb-autocomplete-grid-row` or `sbb-autocomplete-grid-optgroup` elements to the `sbb-autocomplete-grid`.
+ * @event {CustomEvent<void>} willOpen - Emits whenever the `sbb-autocomplete-grid` starts the opening transition. Can be canceled.
+ * @event {CustomEvent<void>} didOpen - Emits whenever the `sbb-autocomplete-grid` is opened.
+ * @event {CustomEvent<void>} willClose - Emits whenever the `sbb-autocomplete-grid` begins the closing transition. Can be canceled.
+ * @event {CustomEvent<void>} didClose - Emits whenever the `sbb-autocomplete-grid` is closed.
+ * @cssprop [--sbb-autocomplete-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 SbbAutocompleteGridElement extends SbbAutocompleteBaseElement {
+    protected overlayId: string;
+    protected panelRole: string;
+    private _activeItemIndex;
+    private _activeColumnIndex;
+    protected get options(): SbbAutocompleteGridOptionElement[];
+    private get _row();
+    constructor();
+    protected syncNegative(): void;
+    protected openedPanelKeyboardInteraction(event: KeyboardEvent): void;
+    /**
+     * Select an element on 'Enter' keypress.
+     *
+     * Due to keyboard navigation code, the `_activeColumnIndex` is zero when an option is 'focused'
+     * and greater than zero when a button is 'focused', so asking for `querySelectorAll(...)[this._activeColumnIndex]`
+     * would always return a `SbbAutocompleteGridButtonElement`.
+     */
+    protected selectByKeyboard(event: KeyboardEvent): void;
+    protected setNextActiveOption(event: KeyboardEvent): void;
+    private _setNextHorizontalActiveElement;
+    protected resetActiveElement(): void;
+    protected setTriggerAttributes(element: HTMLInputElement): void;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'sbb-autocomplete-grid': SbbAutocompleteGridElement;
+    }
+}
+//# sourceMappingURL=autocomplete-grid.component.d.ts.map

package/development/autocomplete-grid/autocomplete-grid/autocomplete-grid.component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"autocomplete-grid.component.d.ts","sourceRoot":"","sources":["../../../../../src/elements/autocomplete-grid/autocomplete-grid/autocomplete-grid.component.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,0BAA0B,EAAE,MAAM,uBAAuB,CAAC;AAQnE,OAAO,EAAE,gCAAgC,EAAE,MAAM,gCAAgC,CAAC;AAWlF;;;;;;;;;;;GAWG;AACH,qBAKM,0BAA2B,SAAQ,0BAA0B;IACjE,SAAS,CAAC,SAAS,SAAuC;IAC1D,SAAS,CAAC,SAAS,SAAU;IAC7B,OAAO,CAAC,gBAAgB,CAAM;IAC9B,OAAO,CAAC,kBAAkB,CAAK;IAE/B,SAAS,KAAK,OAAO,IAAI,gCAAgC,EAAE,CAE1D;IAED,OAAO,KAAK,IAAI,GAMf;;IASD,SAAS,CAAC,YAAY,IAAI,IAAI;IAU9B,SAAS,CAAC,8BAA8B,CAAC,KAAK,EAAE,aAAa,GAAG,IAAI;IA0BpE;;;;;;OAMG;IACH,SAAS,CAAC,gBAAgB,CAAC,KAAK,EAAE,aAAa,GAAG,IAAI;IActD,SAAS,CAAC,mBAAmB,CAAC,KAAK,EAAE,aAAa,GAAG,IAAI;IA8BzD,OAAO,CAAC,+BAA+B;IAmCvC,SAAS,CAAC,kBAAkB,IAAI,IAAI;IAkBpC,SAAS,CAAC,oBAAoB,CAAC,OAAO,EAAE,gBAAgB,GAAG,IAAI;CAGhE;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,uBAAuB,EAAE,0BAA0B,CAAC;KACrD;CACF"}