@sbb-esta/lyne-elements-dev 0.0.0 → 4.5.1-dev.1771859294

package/development/checkbox.js

@@ -0,0 +1,13 @@
+import { SbbCheckboxElement } from "./checkbox/checkbox/checkbox.component.js";
+import { SbbCheckboxGroupElement } from "./checkbox/checkbox-group/checkbox-group.component.js";
+import { SbbCheckboxPanelElement } from "./checkbox/checkbox-panel/checkbox-panel.component.js";
+import { SbbCheckboxCommonElementMixin } from "./checkbox/common/checkbox-common.js";
+import { c } from "./checkbox-common-D2-QcV8n.js";
+export {
+  SbbCheckboxCommonElementMixin,
+  SbbCheckboxElement,
+  SbbCheckboxGroupElement,
+  SbbCheckboxPanelElement,
+  c as checkboxCommonStyle
+};
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2hlY2tib3guanMiLCJzb3VyY2VzIjpbXSwic291cmNlc0NvbnRlbnQiOltdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7OzsifQ==

package/development/chip/chip/chip.component.d.ts

@@ -0,0 +1,30 @@
+import { CSSResultGroup, LitElement, PropertyValues, TemplateResult } from 'lit';
+declare const SbbChipElement_base: import('../../core/mixins.ts').AbstractConstructor<import('../../core/mixins.ts').SbbNegativeMixinType> & import('../../core/mixins.ts').AbstractConstructor<import('../../core/mixins.ts').SbbDisabledMixinType> & import('../../core/mixins.ts').AbstractConstructor<import('../../core/mixins.ts').SbbReadonlyMixinType> & import('../../core/mixins.ts').AbstractConstructor<import('../../core/mixins.ts').SbbElementInternalsMixinType> & typeof LitElement & import('../../core/mixins.ts').SbbElementInternalsConstructor;
+/**
+ * It displays a chip. Usually used in combination with `sbb-chip-group`.
+ *
+ * @slot - Use the unnamed slot to add the display value. If not provided, the 'value' will be used.
+ * @overrideType value - (T = string) | null
+ */
+export declare class SbbChipElement<T = string> extends SbbChipElement_base {
+    static readonly role = "option";
+    static styles: CSSResultGroup;
+    static readonly events: {
+        readonly requestdelete: "requestdelete";
+    };
+    /** The value of chip. Will be used as label if nothing is slotted. */
+    accessor value: T | null;
+    private _language;
+    protected willUpdate(changedProperties: PropertyValues<this>): void;
+    protected firstUpdated(_changedProperties: PropertyValues): void;
+    private _deleteButton;
+    private _handleDeleteButtonClick;
+    protected render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'sbb-chip': SbbChipElement;
+    }
+}
+export {};
+//# sourceMappingURL=chip.component.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"chip.component.d.ts","sourceRoot":"","sources":["../../../../../src/elements/chip/chip/chip.component.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,cAAc,EAEnB,UAAU,EACV,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;AAab,OAAO,6BAA6B,CAAC;AACrC,OAAO,6BAA6B,CAAC;;AAIrC;;;;;GAKG;AACH,qBAEM,cAAc,CAAC,CAAC,GAAG,MAAM,CAAE,SAAQ,mBAExC;IACC,gBAAgC,IAAI,YAAY;IAChD,OAAuB,MAAM,EAAE,cAAc,CAA4B;IACzE,gBAAuB,MAAM;;MAElB;IAEX,sEAAsE;IACtE,SAA4B,KAAK,EAAE,CAAC,GAAG,IAAI,CAAQ;IAEnD,OAAO,CAAC,SAAS,CAAmC;cAEjC,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;cAYzD,YAAY,CAAC,kBAAkB,EAAE,cAAc,GAAG,IAAI;IAQzE,OAAO,CAAC,aAAa;IAIrB,OAAO,CAAC,wBAAwB;cAKb,MAAM,IAAI,cAAc;CAiB5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,UAAU,EAAE,cAAc,CAAC;KAC5B;CACF"}

package/development/chip/chip/chip.component.js

@@ -0,0 +1,170 @@
+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 { __runInitializers, __esDecorate } from "tslib";
+import { css, LitElement, html } from "lit";
+import { customElement, property } from "lit/decorators.js";
+import { SbbLanguageController } from "../../core/controllers.js";
+import { i18nChipDelete } from "../../core/i18n.js";
+import { SbbNegativeMixin, SbbDisabledMixin, SbbReadonlyMixin, SbbElementInternalsMixin } from "../../core/mixins.js";
+import { boxSizingStyles } from "../../core/styles.js";
+import "../../button/mini-button.js";
+import "../../screen-reader-only.js";
+const style = css`:host {
+  --sbb-chip-border: var(--sbb-border-width-1x) solid var(--sbb-chip-border-color);
+  --sbb-chip-transition-duration: var(
+    --sbb-disable-animation-duration,
+    var(--sbb-animation-duration-2x)
+  );
+  display: inline-flex;
+  align-items: stretch;
+  background-color: var(--sbb-chip-background-color);
+  border-radius: var(--sbb-chip-border-radius);
+  color: var(--sbb-chip-color);
+  height: var(--sbb-chip-height);
+}
+
+:host(:focus) {
+  outline-offset: var(--sbb-focus-outline-offset);
+  outline: var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);
+  --sbb-focus-outline-offset: -0.0625rem;
+  --sbb-focus-outline-style: initial;
+}
+
+:host([negative]) {
+  --sbb-chip-border-color: var(--sbb-border-color-4-negative-inverted);
+  --sbb-chip-background-color: var(--sbb-background-color-3-negative);
+  --sbb-chip-color: var(--sbb-color-4-negative);
+  --sbb-chip-color-hover: var(--sbb-color-2-negative);
+  --sbb-chip-background-color-active: var(--sbb-background-color-1-negative);
+  --sbb-chip-background-color-hover: var(--sbb-background-color-1-negative);
+  --sbb-focus-outline-color: var(--sbb-focus-outline-color-dark);
+}
+
+.sbb-chip__label-wrapper {
+  border: var(--sbb-chip-border);
+  border-inline-end: none;
+  border-radius: var(--sbb-chip-border-radius) 0 0 var(--sbb-chip-border-radius);
+  display: flex;
+  align-items: center;
+  padding-inline: var(--sbb-chip-label-padding-inline);
+  outline: none;
+  overflow: hidden;
+}
+:host(:is([disabled], [readonly])) .sbb-chip__label-wrapper {
+  border: var(--sbb-chip-border);
+  border-radius: var(--sbb-chip-border-radius);
+}
+
+.sbb-chip__label {
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  display: inline-block;
+  font-size: var(--sbb-chip-font-size);
+  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  transition: transform var(--sbb-chip-transition-duration) var(--sbb-animation-easing);
+}
+
+.sbb-chip__delete {
+  --sbb-mini-button-border-radius: 0 var(--sbb-chip-border-radius) var(--sbb-chip-border-radius) 0;
+  --sbb-mini-button-color-text: var(--sbb-chip-color);
+  --sbb-mini-button-color-active-background: var(--sbb-chip-background-color-active);
+  --sbb-mini-button-color-hover-background: var(--sbb-chip-background-color-hover);
+  --sbb-icon-svg-width: calc(var(--sbb-size-icon-ui-small) - var(--sbb-border-width-1x) * 2);
+  --sbb-icon-svg-height: calc(var(--sbb-size-icon-ui-small) - var(--sbb-border-width-1x) * 2);
+  --_sbb-mini-button-image-size: ;
+  border: var(--sbb-chip-border);
+  border-radius: 0 var(--sbb-chip-border-radius) var(--sbb-chip-border-radius) 0;
+}
+:host(:is([disabled], [readonly])) .sbb-chip__delete {
+  display: none;
+}
+@media (any-hover: hover) {
+  :host(:not([disabled])) .sbb-chip__delete:hover {
+    --sbb-mini-button-color-text: var(--sbb-chip-color-hover);
+  }
+}`;
+let SbbChipElement = (() => {
+  var _value_accessor_storage, _a;
+  let _classDecorators = [customElement("sbb-chip")];
+  let _classDescriptor;
+  let _classExtraInitializers = [];
+  let _classThis;
+  let _classSuper = SbbNegativeMixin(SbbDisabledMixin(SbbReadonlyMixin(SbbElementInternalsMixin(LitElement))));
+  let _value_decorators;
+  let _value_initializers = [];
+  let _value_extraInitializers = [];
+  _a = class extends _classSuper {
+    constructor() {
+      super(...arguments);
+      __privateAdd(this, _value_accessor_storage);
+      __privateSet(this, _value_accessor_storage, __runInitializers(this, _value_initializers, null));
+      this._language = (__runInitializers(this, _value_extraInitializers), new SbbLanguageController(this));
+    }
+    /** The value of chip. Will be used as label if nothing is slotted. */
+    get value() {
+      return __privateGet(this, _value_accessor_storage);
+    }
+    set value(value) {
+      __privateSet(this, _value_accessor_storage, value);
+    }
+    willUpdate(changedProperties) {
+      super.willUpdate(changedProperties);
+      if (changedProperties.has("disabled")) {
+        if (this.disabled) {
+          this.removeAttribute("tabindex");
+        } else {
+          this.setAttribute("tabindex", "-1");
+        }
+      }
+    }
+    firstUpdated(_changedProperties) {
+      super.firstUpdated(_changedProperties);
+      setTimeout(() => this._deleteButton().removeAttribute("tabindex"));
+    }
+    _deleteButton() {
+      return this.shadowRoot.querySelector("sbb-mini-button");
+    }
+    _handleDeleteButtonClick() {
+      this.dispatchEvent(new Event("requestdelete", { bubbles: true, composed: true }));
+    }
+    render() {
+      return html`
+      <div class="sbb-chip__label-wrapper">
+        <span class="sbb-chip__label">
+          <slot>${this.value ?? ""}</slot>
+        </span>
+      </div>
+      <sbb-mini-button
+        aria-hidden="true"
+        class="sbb-chip__delete"
+        icon-name="cross-tiny-small"
+        @click=${this._handleDeleteButtonClick}
+      >
+      </sbb-mini-button>
+      <sbb-screen-reader-only>, ${i18nChipDelete[this._language.current]}</sbb-screen-reader-only>
+    `;
+    }
+  }, _value_accessor_storage = new WeakMap(), _classThis = _a, (() => {
+    const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+    _value_decorators = [property()];
+    __esDecorate(_a, null, _value_decorators, { kind: "accessor", name: "value", static: false, private: false, access: { has: (obj) => "value" in obj, get: (obj) => obj.value, set: (obj, value) => {
+      obj.value = value;
+    } }, metadata: _metadata }, _value_initializers, _value_extraInitializers);
+    __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 });
+  })(), _a.role = "option", _a.styles = [boxSizingStyles, style], _a.events = {
+    requestdelete: "requestdelete"
+  }, __runInitializers(_classThis, _classExtraInitializers), _a;
+  return _classThis;
+})();
+export {
+  SbbChipElement
+};
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2hpcC5jb21wb25lbnQuanMiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3NyYy9lbGVtZW50cy9jaGlwL2NoaXAvY2hpcC5jb21wb25lbnQudHMiXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgdHlwZSBDU1NSZXN1bHRHcm91cCxcbiAgaHRtbCxcbiAgTGl0RWxlbWVudCxcbiAgdHlwZSBQcm9wZXJ0eVZhbHVlcyxcbiAgdHlwZSBUZW1wbGF0ZVJlc3VsdCxcbn0gZnJvbSAnbGl0JztcbmltcG9ydCB7IGN1c3RvbUVsZW1lbnQsIHByb3BlcnR5IH0gZnJvbSAnbGl0L2RlY29yYXRvcnMuanMnO1xuXG5pbXBvcnQgeyBTYmJMYW5ndWFnZUNvbnRyb2xsZXIgfSBmcm9tICcuLi8uLi9jb3JlL2NvbnRyb2xsZXJzLnRzJztcbmltcG9ydCB7IGkxOG5DaGlwRGVsZXRlIH0gZnJvbSAnLi4vLi4vY29yZS9pMThuLnRzJztcbmltcG9ydCB7XG4gIFNiYkRpc2FibGVkTWl4aW4sXG4gIFNiYkVsZW1lbnRJbnRlcm5hbHNNaXhpbixcbiAgU2JiTmVnYXRpdmVNaXhpbixcbiAgU2JiUmVhZG9ubHlNaXhpbixcbn0gZnJvbSAnLi4vLi4vY29yZS9taXhpbnMudHMnO1xuaW1wb3J0IHsgYm94U2l6aW5nU3R5bGVzIH0gZnJvbSAnLi4vLi4vY29yZS9zdHlsZXMudHMnO1xuXG5pbXBvcnQgJy4uLy4uL2J1dHRvbi9taW5pLWJ1dHRvbi50cyc7XG5pbXBvcnQgJy4uLy4uL3NjcmVlbi1yZWFkZXItb25seS50cyc7XG5cbmltcG9ydCBzdHlsZSBmcm9tICcuL2NoaXAuc2Nzcz9saXQmaW5saW5lJztcblxuLyoqXG4gKiBJdCBkaXNwbGF5cyBhIGNoaXAuIFVzdWFsbHkgdXNlZCBpbiBjb21iaW5hdGlvbiB3aXRoIGBzYmItY2hpcC1ncm91cGAuXG4gKlxuICogQHNsb3QgLSBVc2UgdGhlIHVubmFtZWQgc2xvdCB0byBhZGQgdGhlIGRpc3BsYXkgdmFsdWUuIElmIG5vdCBwcm92aWRlZCwgdGhlICd2YWx1ZScgd2lsbCBiZSB1c2VkLlxuICogQG92ZXJyaWRlVHlwZSB2YWx1ZSAtIChUID0gc3RyaW5nKSB8IG51bGxcbiAqL1xuZXhwb3J0XG5AY3VzdG9tRWxlbWVudCgnc2JiLWNoaXAnKVxuY2xhc3MgU2JiQ2hpcEVsZW1lbnQ8VCA9IHN0cmluZz4gZXh0ZW5kcyBTYmJOZWdhdGl2ZU1peGluKFxuICBTYmJEaXNhYmxlZE1peGluKFNiYlJlYWRvbmx5TWl4aW4oU2JiRWxlbWVudEludGVybmFsc01peGluKExpdEVsZW1lbnQpKSksXG4pIHtcbiAgcHVibGljIHN0YXRpYyBvdmVycmlkZSByZWFkb25seSByb2xlID0gJ29wdGlvbic7XG4gIHB1YmxpYyBzdGF0aWMgb3ZlcnJpZGUgc3R5bGVzOiBDU1NSZXN1bHRHcm91cCA9IFtib3hTaXppbmdTdHlsZXMsIHN0eWxlXTtcbiAgcHVibGljIHN0YXRpYyByZWFkb25seSBldmVudHMgPSB7XG4gICAgcmVxdWVzdGRlbGV0ZTogJ3JlcXVlc3RkZWxldGUnLFxuICB9IGFzIGNvbnN0O1xuXG4gIC8qKiBUaGUgdmFsdWUgb2YgY2hpcC4gV2lsbCBiZSB1c2VkIGFzIGxhYmVsIGlmIG5vdGhpbmcgaXMgc2xvdHRlZC4gKi9cbiAgQHByb3BlcnR5KCkgcHVibGljIGFjY2Vzc29yIHZhbHVlOiBUIHwgbnVsbCA9IG51bGw7XG5cbiAgcHJpdmF0ZSBfbGFuZ3VhZ2UgPSBuZXcgU2JiTGFuZ3VhZ2VDb250cm9sbGVyKHRoaXMpO1xuXG4gIHByb3RlY3RlZCBvdmVycmlkZSB3aWxsVXBkYXRlKGNoYW5nZWRQcm9wZXJ0aWVzOiBQcm9wZXJ0eVZhbHVlczx0aGlzPik6IHZvaWQge1xuICAgIHN1cGVyLndpbGxVcGRhdGUoY2hhbmdlZFByb3BlcnRpZXMpO1xuXG4gICAgaWYgKGNoYW5nZWRQcm9wZXJ0aWVzLmhhcygnZGlzYWJsZWQnKSkge1xuICAgICAgaWYgKHRoaXMuZGlzYWJsZWQpIHtcbiAgICAgICAgdGhpcy5yZW1vdmVBdHRyaWJ1dGUoJ3RhYmluZGV4Jyk7XG4gICAgICB9IGVsc2Uge1xuICAgICAgICB0aGlzLnNldEF0dHJpYnV0ZSgndGFiaW5kZXgnLCAnLTEnKTtcbiAgICAgIH1cbiAgICB9XG4gIH1cblxuICBwcm90ZWN0ZWQgb3ZlcnJpZGUgZmlyc3RVcGRhdGVkKF9jaGFuZ2VkUHJvcGVydGllczogUHJvcGVydHlWYWx1ZXMpOiB2b2lkIHtcbiAgICBzdXBlci5maXJzdFVwZGF0ZWQoX2NoYW5nZWRQcm9wZXJ0aWVzKTtcblxuICAgIC8vIFJlbW92ZSB0aGUgZGVsZXRlIGJ1dHRvbiBmcm9tIHRoZSB0YWIgb3JkZXIuXG4gICAgLy8gU2V0VGltZW91dCBpcyBuZWVkZWQgdG8gb3ZlcnJpZGUgdGhlIGJ1dHRvbiB0YWJpbmRleCBpbml0aWFsaXphdGlvblxuICAgIHNldFRpbWVvdXQoKCkgPT4gdGhpcy5fZGVsZXRlQnV0dG9uKCkucmVtb3ZlQXR0cmlidXRlKCd0YWJpbmRleCcpKTtcbiAgfVxuXG4gIHByaXZhdGUgX2RlbGV0ZUJ1dHRvbigpOiBIVE1MRWxlbWVudCB7XG4gICAgcmV0dXJuIHRoaXMuc2hhZG93Um9vdCEucXVlcnlTZWxlY3Rvcignc2JiLW1pbmktYnV0dG9uJykhO1xuICB9XG5cbiAgcHJpdmF0ZSBfaGFuZGxlRGVsZXRlQnV0dG9uQ2xpY2soKTogdm9pZCB7XG4gICAgLyoqIEBpbnRlcm5hbCAqL1xuICAgIHRoaXMuZGlzcGF0Y2hFdmVudChuZXcgRXZlbnQoJ3JlcXVlc3RkZWxldGUnLCB7IGJ1YmJsZXM6IHRydWUsIGNvbXBvc2VkOiB0cnVlIH0pKTtcbiAgfVxuXG4gIHByb3RlY3RlZCBvdmVycmlkZSByZW5kZXIoKTogVGVtcGxhdGVSZXN1bHQge1xuICAgIHJldHVybiBodG1sYFxuICAgICAgPGRpdiBjbGFzcz1cInNiYi1jaGlwX19sYWJlbC13cmFwcGVyXCI+XG4gICAgICAgIDxzcGFuIGNsYXNzPVwic2JiLWNoaXBfX2xhYmVsXCI+XG4gICAgICAgICAgPHNsb3Q+JHt0aGlzLnZhbHVlID8/ICcnfTwvc2xvdD5cbiAgICAgICAgPC9zcGFuPlxuICAgICAgPC9kaXY+XG4gICAgICA8c2JiLW1pbmktYnV0dG9uXG4gICAgICAgIGFyaWEtaGlkZGVuPVwidHJ1ZVwiXG4gICAgICAgIGNsYXNzPVwic2JiLWNoaXBfX2RlbGV0ZVwiXG4gICAgICAgIGljb24tbmFtZT1cImNyb3NzLXRpbnktc21hbGxcIlxuICAgICAgICBAY2xpY2s9JHt0aGlzLl9oYW5kbGVEZWxldGVCdXR0b25DbGlja31cbiAgICAgID5cbiAgICAgIDwvc2JiLW1pbmktYnV0dG9uPlxuICAgICAgPHNiYi1zY3JlZW4tcmVhZGVyLW9ubHk+LCAke2kxOG5DaGlwRGVsZXRlW3RoaXMuX2xhbmd1YWdlLmN1cnJlbnRdfTwvc2JiLXNjcmVlbi1yZWFkZXItb25seT5cbiAgICBgO1xuICB9XG59XG5cbmRlY2xhcmUgZ2xvYmFsIHtcbiAgaW50ZXJmYWNlIEhUTUxFbGVtZW50VGFnTmFtZU1hcCB7XG4gICAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIEB0eXBlc2NyaXB0LWVzbGludC9uYW1pbmctY29udmVudGlvblxuICAgICdzYmItY2hpcCc6IFNiYkNoaXBFbGVtZW50O1xuICB9XG59XG4iXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztJQWdDTSxrQkFBYyxNQUFBOzswQkFEbkIsY0FBYyxVQUFVLENBQUM7Ozs7b0JBQ2UsaUJBQ3ZDLGlCQUFpQixpQkFBaUIseUJBQXlCLFVBQVUsQ0FBQyxDQUFDLENBQUM7Ozs7QUFEekMsRUFBQSxtQkFBUSxZQUV4QztBQUFBOztBQVFhO0FBQWdCLHlCQUFBLHlCQUFBLGtCQUFBLE1BQUEscUJBQWtCLElBQUk7QUFFMUMsV0FBQSxnRUFBWSxJQUFJLHNCQUFzQixJQUFJO0FBQUEsSUFnRHBEO0FBQUE7QUFBQSxJQWxEYyxJQUFnQixRQUFLO0FBQUEsYUFBQSxtQkFBQTtBQUFBLElBQUE7QUFBQSxJQUFyQixJQUFnQixNQUFLLE9BQUE7QUFBQSx5QkFBQSx5QkFBQTtBQUFBLElBQUE7QUFBQSxJQUlkLFdBQVcsbUJBQXVDO0FBQ25FLFlBQU0sV0FBVyxpQkFBaUI7QUFFbEMsVUFBSSxrQkFBa0IsSUFBSSxVQUFVLEdBQUc7QUFDckMsWUFBSSxLQUFLLFVBQVU7QUFDakIsZUFBSyxnQkFBZ0IsVUFBVTtBQUFBLFFBQ2pDLE9BQU87QUFDTCxlQUFLLGFBQWEsWUFBWSxJQUFJO0FBQUEsUUFDcEM7QUFBQSxNQUNGO0FBQUEsSUFDRjtBQUFBLElBRW1CLGFBQWEsb0JBQWtDO0FBQ2hFLFlBQU0sYUFBYSxrQkFBa0I7QUFJckMsaUJBQVcsTUFBTSxLQUFLLGNBQUEsRUFBZ0IsZ0JBQWdCLFVBQVUsQ0FBQztBQUFBLElBQ25FO0FBQUEsSUFFUSxnQkFBYTtBQUNuQixhQUFPLEtBQUssV0FBWSxjQUFjLGlCQUFpQjtBQUFBLElBQ3pEO0FBQUEsSUFFUSwyQkFBd0I7QUFFOUIsV0FBSyxjQUFjLElBQUksTUFBTSxpQkFBaUIsRUFBRSxTQUFTLE1BQU0sVUFBVSxLQUFBLENBQU0sQ0FBQztBQUFBLElBQ2xGO0FBQUEsSUFFbUIsU0FBTTtBQUN2QixhQUFPO0FBQUE7QUFBQTtBQUFBLGtCQUdPLEtBQUssU0FBUyxFQUFFO0FBQUE7QUFBQTtBQUFBO0FBQUE7QUFBQTtBQUFBO0FBQUEsaUJBT2pCLEtBQUssd0JBQXdCO0FBQUE7QUFBQTtBQUFBLGtDQUdaLGVBQWUsS0FBSyxVQUFVLE9BQU8sQ0FBQztBQUFBO0FBQUEsSUFFdEU7QUFBQSxLQWpEWTs7QUFBWCx3QkFBQSxDQUFBLFVBQVU7QUFBQyxpQkFBQSxJQUFBLE1BQUEsbUJBQUEsRUFBQSxNQUFBLFlBQUEsTUFBQSxTQUFBLFFBQUEsT0FBQSxTQUFBLE9BQUEsUUFBQSxFQUFBLEtBQUEsQ0FBQSxRQUFBLFdBQUEsS0FBQSxLQUFBLENBQUEsUUFBQSxJQUFnQixPQUFLLEtBQUEsQ0FBQSxLQUFBLFVBQUE7QUFBQSxVQUFMLFFBQUs7QUFBQSxJQUFBLEtBQUEsVUFBQSxVQUFBLEdBQUEscUJBQUEsd0JBQUE7QUFWbkMsaUJBQUEsTUFBQSxtQkFBQSxFQUFBLE9BQUEsV0FBQSxHQUFBLGtCQUFBLEVBQUEsTUFBQSxTQUFBLE1BQUEsV0FBQSxNQUFBLFVBQUEsVUFBQSxHQUFBLE1BQUEsdUJBQUE7OztRQUdrQyxHQUFBLE9BQU8sVUFDaEIsR0FBQSxTQUF5QixDQUFDLGlCQUFpQixLQUFLLEdBQ2hELEdBQUEsU0FBUztBQUFBLElBQzlCLGVBQWU7QUFBQSxFQUFBLEdBTmIsa0JBQUEsWUFBQSx1QkFBQSxHQUEyQjs7OyJ9

package/development/chip/chip-group/chip-group.component.d.ts

@@ -0,0 +1,102 @@
+import { CSSResultGroup, LitElement, PropertyValues, TemplateResult } from 'lit';
+import { FormRestoreReason, FormRestoreState } from '../../core/mixins.ts';
+export interface SbbChipInputTokenEndEventDetails<T = string> {
+    /** The element that triggered the chip creation */
+    origin: 'input' | 'autocomplete';
+    /**
+     * The value of the new chip. Either the input or the option value depending on the origin.
+     * Either the value from the input which is always `string` or the value from the selected option
+     * from an autocomplete, which can be either a string or any other type.
+     */
+    value: T | string;
+    label?: string;
+    /** Set a new value for the chip that will be created */
+    setValue(value: T): void;
+    /** Set a label for the chip that will be created */
+    setLabel(value: string): void;
+}
+declare const SbbChipGroupElement_base: import('../../core/mixins.ts').AbstractConstructor<import('../../core/mixins.ts').SbbRequiredMixinType> & import('../../core/mixins.ts').AbstractConstructor<import('../../core/mixins.ts').SbbDisabledMixinType> & import('../../core/mixins.ts').AbstractConstructor<import('../../core/mixins.ts').SbbNegativeMixinType> & import('../../core/mixins.ts').AbstractConstructor<import('../../core/mixins.ts').SbbFormAssociatedMixinType> & import('../../core/mixins.ts').AbstractConstructor<import('../../core/mixins.ts').SbbElementInternalsMixinType> & typeof LitElement & import('../../core/mixins.ts').SbbElementInternalsConstructor;
+/**
+ * The `sbb-chip-group` component is used as a container for one or multiple `sbb-chip`.
+ *
+ * @slot - Use the unnamed slot to add `sbb-chip` elements.
+ * @overrideType value - (T = string[]) | null
+ */
+export declare class SbbChipGroupElement<T = string> extends SbbChipGroupElement_base {
+    static readonly role = "listbox";
+    static styles: CSSResultGroup;
+    static readonly events: {
+        readonly input: "input";
+        readonly change: "change";
+        readonly chipinputtokenend: "chipinputtokenend";
+    };
+    /** Value of the form element. */
+    set value(value: (T | null)[] | null);
+    get value(): (T | null)[];
+    /** Function that maps a chip's value to its display value. */
+    accessor displayWith: ((value: T) => string) | null;
+    /** The array of keys that will trigger a `chipinputtokenend` event. Default `['Enter']` */
+    accessor separatorKeys: string[];
+    /**
+     * Listens to the changes on `readonly` and `disabled` attributes of `<input>`.
+     */
+    private _inputAttributeObserver;
+    private _inputElement;
+    private _inputAbortController;
+    private _language;
+    private _previousSize?;
+    constructor();
+    private _updateLabelState;
+    connectedCallback(): void;
+    protected willUpdate(changedProperties: PropertyValues): void;
+    /** @internal */
+    formResetCallback(): void;
+    /** @internal */
+    formStateRestoreCallback(state: FormRestoreState | null, _reason: FormRestoreReason): void;
+    private _readFormData;
+    protected shouldValidate(name: PropertyKey | undefined): boolean;
+    protected validate(): void;
+    /** Return the list of chip elements **/
+    private _chipElements;
+    /** Return the list of enabled chip elements **/
+    private _enabledChipElements;
+    private _setupComponent;
+    /**
+     * Listen for keyboard events on the chip elements
+     **/
+    private _onChipKeyDown;
+    /**
+     * Listen for keyboard events on the input
+     **/
+    private _onInputKeyDown;
+    /**
+     * If the input is not empty, create a chip with its value
+     */
+    private _createChipFromInput;
+    private _dispatchChipInputTokenEnd;
+    private _deleteChip;
+    /**
+     * Focus an enabled chip. If none are present, focus the input
+     * @param index The index of the enabled chip. If null, focus the last one.
+     */
+    private _focusChip;
+    private _emitInputEvents;
+    private _createChipElement;
+    private _reactToInputChanges;
+    private _proxyStateToChips;
+    private _updateSize;
+    private _updateInputDescription;
+    protected render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'sbb-chip-group': SbbChipGroupElement;
+    }
+}
+declare global {
+    interface HTMLElementEventMap {
+        chipinputtokenend: CustomEvent<SbbChipInputTokenEndEventDetails<any>>;
+    }
+}
+export {};
+//# sourceMappingURL=chip-group.component.d.ts.map

package/development/chip/chip-group/chip-group.component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"chip-group.component.d.ts","sourceRoot":"","sources":["../../../../../src/elements/chip/chip-group/chip-group.component.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,cAAc,EAGnB,UAAU,EACV,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;AAOb,OAAO,EACL,KAAK,iBAAiB,EACtB,KAAK,gBAAgB,EAMtB,MAAM,sBAAsB,CAAC;AAU9B,MAAM,WAAW,gCAAgC,CAAC,CAAC,GAAG,MAAM;IAC1D,mDAAmD;IACnD,MAAM,EAAE,OAAO,GAAG,cAAc,CAAC;IACjC;;;;OAIG;IACH,KAAK,EAAE,CAAC,GAAG,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,wDAAwD;IACxD,QAAQ,CAAC,KAAK,EAAE,CAAC,GAAG,IAAI,CAAC;IACzB,oDAAoD;IACpD,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;CAC/B;;AAED;;;;;GAKG;AACH,qBAEM,mBAAmB,CAAC,CAAC,GAAG,MAAM,CAAE,SAAQ,wBAE7C;IACC,gBAAgC,IAAI,aAAa;IACjD,OAAuB,MAAM,EAAE,cAAc,CAA4B;IACzE,gBAAuB,MAAM;;;;MAIlB;IAEX,iCAAiC;IACjC,IACW,KAAK,CAAC,KAAK,EAAE,CAAC,CAAC,GAAG,IAAI,CAAC,EAAE,GAAG,IAAI,EA2B1C;IACD,IAAW,KAAK,IAAI,CAAC,CAAC,GAAG,IAAI,CAAC,EAAE,CAE/B;IAED,8DAA8D;IAC9D,SACgB,WAAW,EAAE,CAAC,CAAC,KAAK,EAAE,CAAC,KAAK,MAAM,CAAC,GAAG,IAAI,CAAQ;IAElE,2FAA2F;IAC3F,SACgB,aAAa,EAAE,MAAM,EAAE,CAAa;IAEpD;;OAEG;IACH,OAAO,CAAC,uBAAuB,CAEtB;IAET,OAAO,CAAC,aAAa,CAA+B;IACpD,OAAO,CAAC,qBAAqB,CAA8B;IAC3D,OAAO,CAAC,SAAS,CAAmC;IACpD,OAAO,CAAC,aAAa,CAAC,CAA8B;;IAoBpD,OAAO,CAAC,iBAAiB;IAIT,iBAAiB,IAAI,IAAI;cAKtB,UAAU,CAAC,iBAAiB,EAAE,cAAc,GAAG,IAAI;IAYtE,gBAAgB;IACT,iBAAiB,IAAI,IAAI;IAIhC,gBAAgB;IACT,wBAAwB,CAC7B,KAAK,EAAE,gBAAgB,GAAG,IAAI,EAC9B,OAAO,EAAE,iBAAiB,GACzB,IAAI;YASO,aAAa;cAUR,cAAc,CAAC,IAAI,EAAE,WAAW,GAAG,SAAS,GAAG,OAAO;cAItD,QAAQ,IAAI,IAAI;IASnC,wCAAwC;IACxC,OAAO,CAAC,aAAa;IAIrB,gDAAgD;IAChD,OAAO,CAAC,oBAAoB;IAI5B,OAAO,CAAC,eAAe;IAwCvB;;QAEI;IACJ,OAAO,CAAC,cAAc;IAyBtB;;QAEI;IACJ,OAAO,CAAC,eAAe;IAoBvB;;OAEG;IACH,OAAO,CAAC,oBAAoB;IAuB5B,OAAO,CAAC,0BAA0B;IAelC,OAAO,CAAC,WAAW;IAOnB;;;OAGG;IACH,OAAO,CAAC,UAAU;IAgBlB,OAAO,CAAC,gBAAgB;IAYxB,OAAO,CAAC,kBAAkB;IAwB1B,OAAO,CAAC,oBAAoB;IAK5B,OAAO,CAAC,kBAAkB;IAQ1B,OAAO,CAAC,WAAW;IAUnB,OAAO,CAAC,uBAAuB;cAUZ,MAAM,IAAI,cAAc;CAG5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,gBAAgB,EAAE,mBAAmB,CAAC;KACvC;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,mBAAmB;QAC3B,iBAAiB,EAAE,WAAW,CAAC,gCAAgC,CAAC,GAAG,CAAC,CAAC,CAAC;KACvE;CACF"}