@sbb-esta/lyne-elements 2.7.1 → 2.8.0

package/development/toggle/toggle-option/toggle-option.js

@@ -6,6 +6,7 @@ var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read fr
 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 { ResizeController } from "@lit-labs/observers/resize-controller.js";
 import { css, LitElement, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
 import { slotState, forceType } from "../../core/decorators.js";
@@ -22,12 +23,8 @@ const style = css`*,
   --sbb-toggle-option-cursor: pointer;
   --sbb-toggle-option-color: var(--sbb-color-anthracite);
   --sbb-toggle-option-icon-min-size: var(--sbb-size-icon-ui-small);
-  --sbb-toggle-option-border-radius: var(--sbb-border-radius-infinity);
-  --sbb-toggle-option-line-height: calc(1em * var(--sbb-typo-line-height-body-text));
   display: inline-block;
-  min-width: var(--sbb-toggle-min-width);
   overflow: hidden;
-  z-index: 1;
   outline: none !important;
 }
 
@@ -40,18 +37,6 @@ const style = css`*,
   --sbb-toggle-option-color: var(--sbb-color-granite);
 }
 
-input[type=radio] {
-  border: 0;
-  clip: rect(0 0 0 0);
-  height: 1px;
-  margin: -1px;
-  overflow: hidden;
-  padding: 0;
-  position: absolute;
-  white-space: nowrap;
-  width: 1px;
-}
-
 .sbb-toggle-option {
   --sbb-text-font-size: var(--sbb-font-size-text-xs);
   font-family: var(--sbb-typo-font-family);
@@ -66,7 +51,6 @@ input[type=radio] {
   align-items: center;
   height: var(--sbb-toggle-height);
   padding-inline: var(--sbb-toggle-padding-inline);
-  border-radius: var(--sbb-toggle-option-border-radius);
   color: var(--sbb-toggle-option-color);
 }
 :host([data-slot-names~=unnamed]:where([data-slot-names~=icon], [icon-name])) .sbb-toggle-option {
@@ -78,15 +62,6 @@ input[type=radio] {
   white-space: nowrap;
   text-overflow: ellipsis;
 }
-:host(:focus-visible) .sbb-toggle-option__label::before {
-  outline-offset: var(--sbb-focus-outline-offset);
-  outline: var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);
-  content: "";
-  position: absolute;
-  pointer-events: none;
-  inset: calc(-2 * var(--sbb-toggle-border-width));
-  border-radius: var(--sbb-toggle-option-border-radius);
-}
 
 sbb-icon,
 ::slotted(sbb-icon) {
@@ -114,7 +89,7 @@ let SbbToggleOptionElement = (() => {
       __privateAdd(this, _value_accessor_storage);
       __privateSet(this, _checked_accessor_storage, __runInitializers(this, _checked_initializers, false));
       __privateSet(this, _value_accessor_storage, (__runInitializers(this, _checked_extraInitializers), __runInitializers(this, _value_initializers, "")));
-      this._toggle = __runInitializers(this, _value_extraInitializers);
+      this._toggle = (__runInitializers(this, _value_extraInitializers), null);
       const internals = this.attachInternals();
       internals.role = "radio";
       (_a2 = this.addEventListener) == null ? void 0 : _a2.call(this, "input", () => this._handleInput());
@@ -123,6 +98,13 @@ let SbbToggleOptionElement = (() => {
           this.dispatchEvent(new InputEvent("input", { bubbles: true, composed: true }));
         }
       });
+      this.addController(new ResizeController(this, {
+        skipInitial: true,
+        callback: () => {
+          var _a3;
+          return (_a3 = this._toggle) == null ? void 0 : _a3.updatePillPosition(true);
+        }
+      }));
     }
     /** Whether the toggle-option is checked. */
     get checked() {
@@ -141,9 +123,13 @@ let SbbToggleOptionElement = (() => {
     connectedCallback() {
       var _a2;
       super.connectedCallback();
-      this._toggle = ((_a2 = this.closest) == null ? void 0 : _a2.call(this, "sbb-toggle")) ?? void 0;
+      this._toggle = ((_a2 = this.closest) == null ? void 0 : _a2.call(this, "sbb-toggle")) ?? null;
       this._verifyTabindex();
     }
+    disconnectedCallback() {
+      super.disconnectedCallback();
+      this._toggle = null;
+    }
     willUpdate(changedProperties) {
       super.willUpdate(changedProperties);
       if (changedProperties.has("checked")) {
@@ -205,4 +191,4 @@ let SbbToggleOptionElement = (() => {
 export {
   SbbToggleOptionElement
 };
-//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidG9nZ2xlLW9wdGlvbi5qcyIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vc3JjL2VsZW1lbnRzL3RvZ2dsZS90b2dnbGUtb3B0aW9uL3RvZ2dsZS1vcHRpb24udHMiXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHR5cGUgeyBDU1NSZXN1bHRHcm91cCwgUHJvcGVydHlWYWx1ZXMsIFRlbXBsYXRlUmVzdWx0IH0gZnJvbSAnbGl0JztcbmltcG9ydCB7IGh0bWwsIExpdEVsZW1lbnQgfSBmcm9tICdsaXQnO1xuaW1wb3J0IHsgY3VzdG9tRWxlbWVudCwgcHJvcGVydHkgfSBmcm9tICdsaXQvZGVjb3JhdG9ycy5qcyc7XG5cbmltcG9ydCB7IGZvcmNlVHlwZSwgc2xvdFN0YXRlIH0gZnJvbSAnLi4vLi4vY29yZS9kZWNvcmF0b3JzLmpzJztcbmltcG9ydCB7IHNldE9yUmVtb3ZlQXR0cmlidXRlIH0gZnJvbSAnLi4vLi4vY29yZS9kb20uanMnO1xuaW1wb3J0IHsgU2JiRGlzYWJsZWRNaXhpbiB9IGZyb20gJy4uLy4uL2NvcmUvbWl4aW5zLmpzJztcbmltcG9ydCB7IFNiYkljb25OYW1lTWl4aW4gfSBmcm9tICcuLi8uLi9pY29uLmpzJztcbmltcG9ydCB0eXBlIHsgU2JiVG9nZ2xlRWxlbWVudCB9IGZyb20gJy4uL3RvZ2dsZS5qcyc7XG5cbmltcG9ydCBzdHlsZSBmcm9tICcuL3RvZ2dsZS1vcHRpb24uc2Nzcz9saXQmaW5saW5lJztcblxuLyoqXG4gKiBJdCBkaXNwbGF5cyBhIHRvZ2dsZSBvcHRpb24gd2l0aGluIGEgYHNiYi10b2dnbGVgLlxuICpcbiAqIEBzbG90IC0gVXNlIHRoZSB1bm5hbWVkIHNsb3QgdG8gYWRkIGNvbnRlbnQgdG8gdGhlIGxhYmVsIG9mIHRoZSB0b2dnbGUgb3B0aW9uLlxuICogQHNsb3QgaWNvbiAtIFNsb3QgdXNlZCB0byByZW5kZXIgdGhlIGBzYmItaWNvbmAuXG4gKi9cbmV4cG9ydFxuQGN1c3RvbUVsZW1lbnQoJ3NiYi10b2dnbGUtb3B0aW9uJylcbkBzbG90U3RhdGUoKVxuY2xhc3MgU2JiVG9nZ2xlT3B0aW9uRWxlbWVudCBleHRlbmRzIFNiYkRpc2FibGVkTWl4aW4oU2JiSWNvbk5hbWVNaXhpbihMaXRFbGVtZW50KSkge1xuICBwdWJsaWMgc3RhdGljIG92ZXJyaWRlIHN0eWxlczogQ1NTUmVzdWx0R3JvdXAgPSBzdHlsZTtcblxuICAvKiogV2hldGhlciB0aGUgdG9nZ2xlLW9wdGlvbiBpcyBjaGVja2VkLiAqL1xuICBAZm9yY2VUeXBlKClcbiAgQHByb3BlcnR5KHsgcmVmbGVjdDogdHJ1ZSwgdHlwZTogQm9vbGVhbiB9KVxuICBwdWJsaWMgYWNjZXNzb3IgY2hlY2tlZDogYm9vbGVhbiA9IGZhbHNlO1xuXG4gIC8qKiBWYWx1ZSBvZiB0b2dnbGUtb3B0aW9uLiAqL1xuICBAZm9yY2VUeXBlKClcbiAgQHByb3BlcnR5KClcbiAgcHVibGljIGFjY2Vzc29yIHZhbHVlOiBzdHJpbmcgPSAnJztcblxuICBwcml2YXRlIF90b2dnbGU/OiBTYmJUb2dnbGVFbGVtZW50O1xuXG4gIHB1YmxpYyBjb25zdHJ1Y3RvcigpIHtcbiAgICBzdXBlcigpO1xuICAgIGNvbnN0IGludGVybmFsczogRWxlbWVudEludGVybmFscyA9IHRoaXMuYXR0YWNoSW50ZXJuYWxzKCk7XG4gICAgLyoqIEBpbnRlcm5hbCAqL1xuICAgIGludGVybmFscy5yb2xlID0gJ3JhZGlvJztcblxuICAgIC8vIFdlIG5lZWQgdG8gbGlzdGVuIGlucHV0IGV2ZW50IG9uIGhvc3QgYXMgd2l0aCBrZXlib2FyZCBuYXZpZ2F0aW9uXG4gICAgLy8gdGhlIElucHV0IEV2ZW50IGlzIHRyaWdnZXJlZCBmcm9tIHNiYi10b2dnbGUuXG4gICAgdGhpcy5hZGRFdmVudExpc3RlbmVyPy4oJ2lucHV0JywgKCkgPT4gdGhpcy5faGFuZGxlSW5wdXQoKSk7XG4gICAgdGhpcy5hZGRFdmVudExpc3RlbmVyPy4oJ2NsaWNrJywgKCkgPT4ge1xuICAgICAgaWYgKCF0aGlzLmRpc2FibGVkICYmICF0aGlzLmNoZWNrZWQpIHtcbiAgICAgICAgdGhpcy5kaXNwYXRjaEV2ZW50KG5ldyBJbnB1dEV2ZW50KCdpbnB1dCcsIHsgYnViYmxlczogdHJ1ZSwgY29tcG9zZWQ6IHRydWUgfSkpO1xuICAgICAgfVxuICAgIH0pO1xuICB9XG5cbiAgcHVibGljIG92ZXJyaWRlIGNvbm5lY3RlZENhbGxiYWNrKCk6IHZvaWQge1xuICAgIHN1cGVyLmNvbm5lY3RlZENhbGxiYWNrKCk7XG5cbiAgICAvLyBXZSBjYW4gdXNlIGNsb3Nlc3QgaGVyZSwgYXMgd2UgZXhwZWN0IHRoZSBwYXJlbnQgc2JiLXRvZ2dsZSB0byBiZSBpbiBsaWdodCBET00uXG4gICAgdGhpcy5fdG9nZ2xlID0gdGhpcy5jbG9zZXN0Py4oJ3NiYi10b2dnbGUnKSA/PyB1bmRlZmluZWQ7XG4gICAgdGhpcy5fdmVyaWZ5VGFiaW5kZXgoKTtcbiAgfVxuXG4gIHByb3RlY3RlZCBvdmVycmlkZSB3aWxsVXBkYXRlKGNoYW5nZWRQcm9wZXJ0aWVzOiBQcm9wZXJ0eVZhbHVlczx0aGlzPik6IHZvaWQge1xuICAgIHN1cGVyLndpbGxVcGRhdGUoY2hhbmdlZFByb3BlcnRpZXMpO1xuXG4gICAgaWYgKGNoYW5nZWRQcm9wZXJ0aWVzLmhhcygnY2hlY2tlZCcpKSB7XG4gICAgICB0aGlzLnNldEF0dHJpYnV0ZSgnYXJpYS1jaGVja2VkJywgYCR7dGhpcy5jaGVja2VkfWApO1xuICAgICAgdGhpcy5fdmVyaWZ5VGFiaW5kZXgoKTtcbiAgICAgIGlmICh0aGlzLmNoZWNrZWQpIHtcbiAgICAgICAgdGhpcy5fdW5jaGVja090aGVyT3B0aW9ucygpO1xuICAgICAgfVxuICAgIH1cbiAgICBpZiAoY2hhbmdlZFByb3BlcnRpZXMuaGFzKCdkaXNhYmxlZCcpKSB7XG4gICAgICB0aGlzLl9oYW5kbGVEaXNhYmxlZENoYW5nZSgpO1xuICAgIH1cbiAgfVxuXG4gIHByaXZhdGUgX3VuY2hlY2tPdGhlck9wdGlvbnMoKTogdm9pZCB7XG4gICAgdGhpcy5fdG9nZ2xlPy5vcHRpb25zLmZpbHRlcigobykgPT4gbyAhPT0gdGhpcykuZm9yRWFjaCgobykgPT4gKG8uY2hlY2tlZCA9IGZhbHNlKSk7XG4gICAgdGhpcy5fdG9nZ2xlPy5zdGF0dXNDaGFuZ2VkKCk7XG4gIH1cblxuICBwcml2YXRlIF9oYW5kbGVEaXNhYmxlZENoYW5nZSgpOiB2b2lkIHtcbiAgICBzZXRPclJlbW92ZUF0dHJpYnV0ZSh0aGlzLCAnYXJpYS1kaXNhYmxlZCcsIHRoaXMuZGlzYWJsZWQgPyBgdHJ1ZWAgOiBudWxsKTtcbiAgICB0aGlzLl92ZXJpZnlUYWJpbmRleCgpO1xuICB9XG5cbiAgcHJpdmF0ZSBfaGFuZGxlSW5wdXQoKTogdm9pZCB7XG4gICAgaWYgKHRoaXMuZGlzYWJsZWQpIHtcbiAgICAgIHJldHVybjtcbiAgICB9XG4gICAgdGhpcy5jaGVja2VkID0gdHJ1ZTtcbiAgICB0aGlzLl91bmNoZWNrT3RoZXJPcHRpb25zKCk7XG4gIH1cblxuICBwcml2YXRlIF92ZXJpZnlUYWJpbmRleCgpOiB2b2lkIHtcbiAgICB0aGlzLnRhYkluZGV4ID0gdGhpcy5jaGVja2VkICYmICF0aGlzLmRpc2FibGVkID8gMCA6IC0xO1xuICB9XG5cbiAgcHJvdGVjdGVkIG92ZXJyaWRlIHJlbmRlcigpOiBUZW1wbGF0ZVJlc3VsdCB7XG4gICAgcmV0dXJuIGh0bWxgXG4gICAgICA8ZGl2IGNsYXNzPVwic2JiLXRvZ2dsZS1vcHRpb25cIj5cbiAgICAgICAgJHt0aGlzLnJlbmRlckljb25TbG90KCl9XG4gICAgICAgIDxzcGFuIGNsYXNzPVwic2JiLXRvZ2dsZS1vcHRpb25fX2xhYmVsXCI+XG4gICAgICAgICAgPHNsb3Q+PC9zbG90PlxuICAgICAgICA8L3NwYW4+XG4gICAgICA8L2Rpdj5cbiAgICBgO1xuICB9XG59XG5cbmRlY2xhcmUgZ2xvYmFsIHtcbiAgaW50ZXJmYWNlIEhUTUxFbGVtZW50VGFnTmFtZU1hcCB7XG4gICAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIEB0eXBlc2NyaXB0LWVzbGludC9uYW1pbmctY29udmVudGlvblxuICAgICdzYmItdG9nZ2xlLW9wdGlvbic6IFNiYlRvZ2dsZU9wdGlvbkVsZW1lbnQ7XG4gIH1cbn1cbiJdLCJuYW1lcyI6WyJfYSJdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7SUFxQk0sMEJBQXNCLE1BQUE7O0FBRjNCLE1BQUEsbUJBQUEsQ0FBQSxjQUFjLG1CQUFtQixHQUNqQyxXQUFXOzs7O0FBQ3lCLE1BQUEsY0FBQSxpQkFBaUIsaUJBQWlCLFVBQVUsQ0FBQzs7Ozs7OztBQUFyRCxFQUFBLG1CQUFRLFlBQThDO0FBQUEsSUFlakYsY0FBQTs7O0FBVEE7QUFLQTtBQUxnQix5QkFBQSwyQkFBQSxrQkFBQSxNQUFBLHVCQUFtQixLQUFLO0FBS3hCLHlCQUFBLDBCQUFBLGtCQUFBLE1BQUEsMEJBQUEsR0FBQSxrQkFBQSxNQUFBLHFCQUFnQixFQUFFO0FBRTFCLFdBQUEsVUFBMkIsa0JBQUEsTUFBQSx3QkFBQTtBQUkzQixZQUFBLFlBQThCLEtBQUs7QUFFekMsZ0JBQVUsT0FBTztBQUlqQixPQUFBQSxNQUFBLEtBQUsscUJBQUwsZ0JBQUFBLElBQUEsV0FBd0IsU0FBUyxNQUFNLEtBQUs7QUFDdkMsaUJBQUEscUJBQUEsOEJBQW1CLFNBQVMsTUFBSztBQUNwQyxZQUFJLENBQUMsS0FBSyxZQUFZLENBQUMsS0FBSyxTQUFTO0FBQzlCLGVBQUEsY0FBYyxJQUFJLFdBQVcsU0FBUyxFQUFFLFNBQVMsTUFBTSxVQUFVLEtBQU0sQ0FBQSxDQUFDO0FBQUEsUUFBQTtBQUFBLE1BQy9FO0FBQUEsSUFDRDtBQUFBO0FBQUEsSUF0QkgsSUFBZ0IsVUFBeUI7QUFBQSxhQUFBLG1CQUFBO0FBQUEsSUFBQTtBQUFBLElBQXpDLElBQWdCLFFBQXlCLE9BQUE7QUFBQSx5QkFBQSwyQkFBQTtBQUFBLElBQUE7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
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidG9nZ2xlLW9wdGlvbi5qcyIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vc3JjL2VsZW1lbnRzL3RvZ2dsZS90b2dnbGUtb3B0aW9uL3RvZ2dsZS1vcHRpb24udHMiXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgUmVzaXplQ29udHJvbGxlciB9IGZyb20gJ0BsaXQtbGFicy9vYnNlcnZlcnMvcmVzaXplLWNvbnRyb2xsZXIuanMnO1xuaW1wb3J0IHR5cGUgeyBDU1NSZXN1bHRHcm91cCwgUHJvcGVydHlWYWx1ZXMsIFRlbXBsYXRlUmVzdWx0IH0gZnJvbSAnbGl0JztcbmltcG9ydCB7IGh0bWwsIExpdEVsZW1lbnQgfSBmcm9tICdsaXQnO1xuaW1wb3J0IHsgY3VzdG9tRWxlbWVudCwgcHJvcGVydHkgfSBmcm9tICdsaXQvZGVjb3JhdG9ycy5qcyc7XG5cbmltcG9ydCB7IGZvcmNlVHlwZSwgc2xvdFN0YXRlIH0gZnJvbSAnLi4vLi4vY29yZS9kZWNvcmF0b3JzLmpzJztcbmltcG9ydCB7IHNldE9yUmVtb3ZlQXR0cmlidXRlIH0gZnJvbSAnLi4vLi4vY29yZS9kb20uanMnO1xuaW1wb3J0IHsgU2JiRGlzYWJsZWRNaXhpbiB9IGZyb20gJy4uLy4uL2NvcmUvbWl4aW5zLmpzJztcbmltcG9ydCB7IFNiYkljb25OYW1lTWl4aW4gfSBmcm9tICcuLi8uLi9pY29uLmpzJztcbmltcG9ydCB0eXBlIHsgU2JiVG9nZ2xlRWxlbWVudCB9IGZyb20gJy4uL3RvZ2dsZS5qcyc7XG5cbmltcG9ydCBzdHlsZSBmcm9tICcuL3RvZ2dsZS1vcHRpb24uc2Nzcz9saXQmaW5saW5lJztcblxuLyoqXG4gKiBJdCBkaXNwbGF5cyBhIHRvZ2dsZSBvcHRpb24gd2l0aGluIGEgYHNiYi10b2dnbGVgLlxuICpcbiAqIEBzbG90IC0gVXNlIHRoZSB1bm5hbWVkIHNsb3QgdG8gYWRkIGNvbnRlbnQgdG8gdGhlIGxhYmVsIG9mIHRoZSB0b2dnbGUgb3B0aW9uLlxuICogQHNsb3QgaWNvbiAtIFNsb3QgdXNlZCB0byByZW5kZXIgdGhlIGBzYmItaWNvbmAuXG4gKi9cbmV4cG9ydFxuQGN1c3RvbUVsZW1lbnQoJ3NiYi10b2dnbGUtb3B0aW9uJylcbkBzbG90U3RhdGUoKVxuY2xhc3MgU2JiVG9nZ2xlT3B0aW9uRWxlbWVudCBleHRlbmRzIFNiYkRpc2FibGVkTWl4aW4oU2JiSWNvbk5hbWVNaXhpbihMaXRFbGVtZW50KSkge1xuICBwdWJsaWMgc3RhdGljIG92ZXJyaWRlIHN0eWxlczogQ1NTUmVzdWx0R3JvdXAgPSBzdHlsZTtcblxuICAvKiogV2hldGhlciB0aGUgdG9nZ2xlLW9wdGlvbiBpcyBjaGVja2VkLiAqL1xuICBAZm9yY2VUeXBlKClcbiAgQHByb3BlcnR5KHsgcmVmbGVjdDogdHJ1ZSwgdHlwZTogQm9vbGVhbiB9KVxuICBwdWJsaWMgYWNjZXNzb3IgY2hlY2tlZDogYm9vbGVhbiA9IGZhbHNlO1xuXG4gIC8qKiBWYWx1ZSBvZiB0b2dnbGUtb3B0aW9uLiAqL1xuICBAZm9yY2VUeXBlKClcbiAgQHByb3BlcnR5KClcbiAgcHVibGljIGFjY2Vzc29yIHZhbHVlOiBzdHJpbmcgPSAnJztcblxuICBwcml2YXRlIF90b2dnbGU6IFNiYlRvZ2dsZUVsZW1lbnQgfCBudWxsID0gbnVsbDtcblxuICBwdWJsaWMgY29uc3RydWN0b3IoKSB7XG4gICAgc3VwZXIoKTtcbiAgICBjb25zdCBpbnRlcm5hbHM6IEVsZW1lbnRJbnRlcm5hbHMgPSB0aGlzLmF0dGFjaEludGVybmFscygpO1xuICAgIC8qKiBAaW50ZXJuYWwgKi9cbiAgICBpbnRlcm5hbHMucm9sZSA9ICdyYWRpbyc7XG5cbiAgICAvLyBXZSBuZWVkIHRvIGxpc3RlbiBpbnB1dCBldmVudCBvbiBob3N0IGFzIHdpdGgga2V5Ym9hcmQgbmF2aWdhdGlvblxuICAgIC8vIHRoZSBJbnB1dCBFdmVudCBpcyB0cmlnZ2VyZWQgZnJvbSBzYmItdG9nZ2xlLlxuICAgIHRoaXMuYWRkRXZlbnRMaXN0ZW5lcj8uKCdpbnB1dCcsICgpID0+IHRoaXMuX2hhbmRsZUlucHV0KCkpO1xuICAgIHRoaXMuYWRkRXZlbnRMaXN0ZW5lcj8uKCdjbGljaycsICgpID0+IHtcbiAgICAgIGlmICghdGhpcy5kaXNhYmxlZCAmJiAhdGhpcy5jaGVja2VkKSB7XG4gICAgICAgIHRoaXMuZGlzcGF0Y2hFdmVudChuZXcgSW5wdXRFdmVudCgnaW5wdXQnLCB7IGJ1YmJsZXM6IHRydWUsIGNvbXBvc2VkOiB0cnVlIH0pKTtcbiAgICAgIH1cbiAgICB9KTtcblxuICAgIHRoaXMuYWRkQ29udHJvbGxlcihcbiAgICAgIG5ldyBSZXNpemVDb250cm9sbGVyKHRoaXMsIHtcbiAgICAgICAgc2tpcEluaXRpYWw6IHRydWUsXG4gICAgICAgIGNhbGxiYWNrOiAoKSA9PiB0aGlzLl90b2dnbGU/LnVwZGF0ZVBpbGxQb3NpdGlvbih0cnVlKSxcbiAgICAgIH0pLFxuICAgICk7XG4gIH1cblxuICBwdWJsaWMgb3ZlcnJpZGUgY29ubmVjdGVkQ2FsbGJhY2soKTogdm9pZCB7XG4gICAgc3VwZXIuY29ubmVjdGVkQ2FsbGJhY2soKTtcblxuICAgIC8vIFdlIGNhbiB1c2UgY2xvc2VzdCBoZXJlLCBhcyB3ZSBleHBlY3QgdGhlIHBhcmVudCBzYmItdG9nZ2xlIHRvIGJlIGluIGxpZ2h0IERPTS5cbiAgICB0aGlzLl90b2dnbGUgPSB0aGlzLmNsb3Nlc3Q/Lignc2JiLXRvZ2dsZScpID8/IG51bGw7XG4gICAgdGhpcy5fdmVyaWZ5VGFiaW5kZXgoKTtcbiAgfVxuXG4gIHB1YmxpYyBvdmVycmlkZSBkaXNjb25uZWN0ZWRDYWxsYmFjaygpOiB2b2lkIHtcbiAgICBzdXBlci5kaXNjb25uZWN0ZWRDYWxsYmFjaygpO1xuICAgIHRoaXMuX3RvZ2dsZSA9IG51bGw7XG4gIH1cblxuICBwcm90ZWN0ZWQgb3ZlcnJpZGUgd2lsbFVwZGF0ZShjaGFuZ2VkUHJvcGVydGllczogUHJvcGVydHlWYWx1ZXM8dGhpcz4pOiB2b2lkIHtcbiAgICBzdXBlci53aWxsVXBkYXRlKGNoYW5nZWRQcm9wZXJ0aWVzKTtcblxuICAgIGlmIChjaGFuZ2VkUHJvcGVydGllcy5oYXMoJ2NoZWNrZWQnKSkge1xuICAgICAgdGhpcy5zZXRBdHRyaWJ1dGUoJ2FyaWEtY2hlY2tlZCcsIGAke3RoaXMuY2hlY2tlZH1gKTtcbiAgICAgIHRoaXMuX3ZlcmlmeVRhYmluZGV4KCk7XG4gICAgICBpZiAodGhpcy5jaGVja2VkKSB7XG4gICAgICAgIHRoaXMuX3VuY2hlY2tPdGhlck9wdGlvbnMoKTtcbiAgICAgIH1cbiAgICB9XG4gICAgaWYgKGNoYW5nZWRQcm9wZXJ0aWVzLmhhcygnZGlzYWJsZWQnKSkge1xuICAgICAgdGhpcy5faGFuZGxlRGlzYWJsZWRDaGFuZ2UoKTtcbiAgICB9XG4gIH1cblxuICBwcml2YXRlIF91bmNoZWNrT3RoZXJPcHRpb25zKCk6IHZvaWQge1xuICAgIHRoaXMuX3RvZ2dsZT8ub3B0aW9ucy5maWx0ZXIoKG8pID0+IG8gIT09IHRoaXMpLmZvckVhY2goKG8pID0+IChvLmNoZWNrZWQgPSBmYWxzZSkpO1xuICAgIHRoaXMuX3RvZ2dsZT8uc3RhdHVzQ2hhbmdlZCgpO1xuICB9XG5cbiAgcHJpdmF0ZSBfaGFuZGxlRGlzYWJsZWRDaGFuZ2UoKTogdm9pZCB7XG4gICAgc2V0T3JSZW1vdmVBdHRyaWJ1dGUodGhpcywgJ2FyaWEtZGlzYWJsZWQnLCB0aGlzLmRpc2FibGVkID8gYHRydWVgIDogbnVsbCk7XG4gICAgdGhpcy5fdmVyaWZ5VGFiaW5kZXgoKTtcbiAgfVxuXG4gIHByaXZhdGUgX2hhbmRsZUlucHV0KCk6IHZvaWQge1xuICAgIGlmICh0aGlzLmRpc2FibGVkKSB7XG4gICAgICByZXR1cm47XG4gICAgfVxuICAgIHRoaXMuY2hlY2tlZCA9IHRydWU7XG4gICAgdGhpcy5fdW5jaGVja090aGVyT3B0aW9ucygpO1xuICB9XG5cbiAgcHJpdmF0ZSBfdmVyaWZ5VGFiaW5kZXgoKTogdm9pZCB7XG4gICAgdGhpcy50YWJJbmRleCA9IHRoaXMuY2hlY2tlZCAmJiAhdGhpcy5kaXNhYmxlZCA/IDAgOiAtMTtcbiAgfVxuXG4gIHByb3RlY3RlZCBvdmVycmlkZSByZW5kZXIoKTogVGVtcGxhdGVSZXN1bHQge1xuICAgIHJldHVybiBodG1sYFxuICAgICAgPGRpdiBjbGFzcz1cInNiYi10b2dnbGUtb3B0aW9uXCI+XG4gICAgICAgICR7dGhpcy5yZW5kZXJJY29uU2xvdCgpfVxuICAgICAgICA8c3BhbiBjbGFzcz1cInNiYi10b2dnbGUtb3B0aW9uX19sYWJlbFwiPlxuICAgICAgICAgIDxzbG90Pjwvc2xvdD5cbiAgICAgICAgPC9zcGFuPlxuICAgICAgPC9kaXY+XG4gICAgYDtcbiAgfVxufVxuXG5kZWNsYXJlIGdsb2JhbCB7XG4gIGludGVyZmFjZSBIVE1MRWxlbWVudFRhZ05hbWVNYXAge1xuICAgIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBAdHlwZXNjcmlwdC1lc2xpbnQvbmFtaW5nLWNvbnZlbnRpb25cbiAgICAnc2JiLXRvZ2dsZS1vcHRpb24nOiBTYmJUb2dnbGVPcHRpb25FbGVtZW50O1xuICB9XG59XG4iXSwibmFtZXMiOlsiX2EiXSwibWFwcGluZ3MiOiI7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7SUFzQk0sMEJBQXNCLE1BQUE7O0FBRjNCLE1BQUEsbUJBQUEsQ0FBQSxjQUFjLG1CQUFtQixHQUNqQyxXQUFXOzs7O0FBQ3lCLE1BQUEsY0FBQSxpQkFBaUIsaUJBQWlCLFVBQVUsQ0FBQzs7Ozs7OztBQUFyRCxFQUFBLG1CQUFRLFlBQThDO0FBQUEsSUFlakYsY0FBQTs7O0FBVEE7QUFLQTtBQUxnQix5QkFBQSwyQkFBQSxrQkFBQSxNQUFBLHVCQUFtQixLQUFLO0FBS3hCLHlCQUFBLDBCQUFBLGtCQUFBLE1BQUEsMEJBQUEsR0FBQSxrQkFBQSxNQUFBLHFCQUFnQixFQUFFO0FBRTFCLFdBQU8sV0FBQSxrQkFBQSxNQUFBLHdCQUFBLEdBQTRCO0FBSW5DLFlBQUEsWUFBOEIsS0FBSztB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

package/icon/icon-base.js

@@ -2,43 +2,43 @@ var A = (s) => {
   throw TypeError(s);
 };
 var $ = (s, a, i) => a.has(s) || A("Cannot " + i);
-var h = (s, a, i) => ($(s, a, "read from private field"), i ? i.call(s) : a.get(s)), u = (s, a, i) => a.has(s) ? A("Cannot add the same private member more than once") : a instanceof WeakSet ? a.add(s) : a.set(s, i), p = (s, a, i, n) => ($(s, a, "write to private field"), n ? n.call(s, i) : a.set(s, i), i);
-import { __esDecorate as d, __runInitializers as l } from "tslib";
+var g = (s, a, i) => ($(s, a, "read from private field"), i ? i.call(s) : a.get(s)), d = (s, a, i) => a.has(s) ? A("Cannot add the same private member more than once") : a instanceof WeakSet ? a.add(s) : a.set(s, i), u = (s, a, i, n) => ($(s, a, "write to private field"), n ? n.call(s, i) : a.set(s, i), i);
+import { __esDecorate as p, __runInitializers as l } from "tslib";
 import { css as j, LitElement as B, html as D } from "lit";
 import { state as E, property as L } from "lit/decorators.js";
 import { unsafeHTML as O } from "lit/directives/unsafe-html.js";
 import { until as U } from "lit/directives/until.js";
 import { hostAttributes as C, forceType as H } from "../core/decorators.js";
 import { getSvgContent as M } from "./icon-request.js";
-const P = j`*,:before,:after{box-sizing:border-box}:host{display:inline-block;line-height:0;-webkit-tap-highlight-color:transparent}:host([data-empty]){--sbb-icon-default-dimension: 0}:host([data-empty][data-namespace=default][name$=-small]){--sbb-icon-default-dimension: var(--sbb-size-icon-ui-small)}:host([data-empty][data-namespace=default][name$=-medium]){--sbb-icon-default-dimension: var(--sbb-size-icon-ui-medium)}:host([data-empty][data-namespace=default][name$=-large]){--sbb-icon-default-dimension: var(--sbb-size-icon-ui-large)}svg{width:var(--sbb-icon-svg-width, var(--sbb-icon-default-dimension));height:var(--sbb-icon-svg-height, var(--sbb-icon-default-dimension));stroke:var(--sbb-icon-svg-stroke-color);stroke-width:var(--sbb-icon-svg-stroke-width)}svg:not(.color-immutable) [fill]:not([fill=none]){fill:currentcolor}svg:not(.color-immutable) [stroke]:not([stroke=none]){stroke:currentcolor}svg:not(.color-immutable)>:where(path,polygon,polyline):where(:not([stroke]):not([fill])),svg:not(.color-immutable) :where(:not([stroke]):not([fill])) :where(path,polygon,polyline):where(:not([stroke]):not([fill])){fill:currentcolor}`, _ = "default";
+const P = j`*,:before,:after{box-sizing:border-box}:host{display:inline-block;line-height:0;-webkit-tap-highlight-color:transparent}:host([data-empty]){--sbb-icon-default-dimension: 0}:host([data-empty][data-namespace=default][name$=-extra-small]){--sbb-icon-default-dimension: var(--sbb-size-icon-ui-extra-small)}:host([data-empty][data-namespace=default][name$=-small]){--sbb-icon-default-dimension: var(--sbb-size-icon-ui-small)}:host([data-empty][data-namespace=default][name$=-medium]){--sbb-icon-default-dimension: var(--sbb-size-icon-ui-medium)}:host([data-empty][data-namespace=default][name$=-large]){--sbb-icon-default-dimension: var(--sbb-size-icon-ui-large)}svg{width:var(--sbb-icon-svg-width, var(--sbb-icon-default-dimension));height:var(--sbb-icon-svg-height, var(--sbb-icon-default-dimension));stroke:var(--sbb-icon-svg-stroke-color);stroke-width:var(--sbb-icon-svg-stroke-width)}svg:not(.color-immutable) [fill]:not([fill=none]){fill:currentcolor}svg:not(.color-immutable) [stroke]:not([stroke=none]){stroke:currentcolor}svg:not(.color-immutable)>:where(path,polygon,polyline):where(:not([stroke]):not([fill])),svg:not(.color-immutable) :where(:not([stroke]):not([fill])) :where(path,polygon,polyline):where(:not([stroke]):not([fill])){fill:currentcolor}`, _ = "default";
 let X = (() => {
-  var c, m, g, o;
+  var c, m, h, o;
   let s = [C({
     "data-namespace": _,
     "data-empty": ""
-  })], a, i = [], n, v = B, b, f = [], y = [], I, z = [], S = [], k, w = [], N = [];
-  return o = class extends v {
+  })], a, i = [], n, b = B, v, f = [], y = [], z, I = [], S = [], k, w = [], N = [];
+  return o = class extends b {
     constructor() {
       super(...arguments);
-      u(this, c, l(this, f, _));
-      u(this, m, (l(this, y), l(this, z, null)));
-      u(this, g, (l(this, S), l(this, w, !1)));
+      d(this, c, l(this, f, _));
+      d(this, m, (l(this, y), l(this, I, null)));
+      d(this, h, (l(this, S), l(this, w, !1)));
       l(this, N);
     }
     get _svgNamespace() {
-      return h(this, c);
+      return g(this, c);
     }
     set _svgNamespace(e) {
-      p(this, c, e);
+      u(this, c, e);
     }
     /**
      * The icon svg content rendered on the page: <svg>...</svg>.
      */
     get _svgIcon() {
-      return h(this, m);
+      return g(this, m);
     }
     set _svgIcon(e) {
-      p(this, m, e);
+      u(this, m, e);
     }
     /**
      * When set to `true`, SVG content that is HTTP fetched will not be checked
@@ -47,10 +47,10 @@ let X = (() => {
      * @default false
      */
     get noSanitize() {
-      return h(this, g);
+      return g(this, h);
     }
     set noSanitize(e) {
-      p(this, g, e);
+      u(this, h, e);
     }
     async loadSvgIcon(e) {
       if (!e)
@@ -93,15 +93,15 @@ let X = (() => {
       )}</span
     >`;
     }
-  }, c = new WeakMap(), m = new WeakMap(), g = new WeakMap(), n = o, (() => {
-    const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(v[Symbol.metadata] ?? null) : void 0;
-    b = [E()], I = [E()], k = [H(), L({ attribute: "no-sanitize", type: Boolean })], d(o, null, b, { kind: "accessor", name: "_svgNamespace", static: !1, private: !1, access: { has: (t) => "_svgNamespace" in t, get: (t) => t._svgNamespace, set: (t, r) => {
+  }, c = new WeakMap(), m = new WeakMap(), h = new WeakMap(), n = o, (() => {
+    const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(b[Symbol.metadata] ?? null) : void 0;
+    v = [E()], z = [E()], k = [H(), L({ attribute: "no-sanitize", type: Boolean })], p(o, null, v, { kind: "accessor", name: "_svgNamespace", static: !1, private: !1, access: { has: (t) => "_svgNamespace" in t, get: (t) => t._svgNamespace, set: (t, r) => {
       t._svgNamespace = r;
-    } }, metadata: e }, f, y), d(o, null, I, { kind: "accessor", name: "_svgIcon", static: !1, private: !1, access: { has: (t) => "_svgIcon" in t, get: (t) => t._svgIcon, set: (t, r) => {
+    } }, metadata: e }, f, y), p(o, null, z, { kind: "accessor", name: "_svgIcon", static: !1, private: !1, access: { has: (t) => "_svgIcon" in t, get: (t) => t._svgIcon, set: (t, r) => {
       t._svgIcon = r;
-    } }, metadata: e }, z, S), d(o, null, k, { kind: "accessor", name: "noSanitize", static: !1, private: !1, access: { has: (t) => "noSanitize" in t, get: (t) => t.noSanitize, set: (t, r) => {
+    } }, metadata: e }, I, S), p(o, null, k, { kind: "accessor", name: "noSanitize", static: !1, private: !1, access: { has: (t) => "noSanitize" in t, get: (t) => t.noSanitize, set: (t, r) => {
       t.noSanitize = r;
-    } }, metadata: e }, w, N), d(null, a = { value: n }, s, { kind: "class", name: n.name, metadata: e }, null, i), n = a.value, e && Object.defineProperty(n, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
+    } }, metadata: e }, w, N), p(null, a = { value: n }, s, { kind: "class", name: n.name, metadata: e }, null, i), n = a.value, e && Object.defineProperty(n, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
   })(), o.styles = P, l(n, i), n;
 })();
 export {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sbb-esta/lyne-elements",
-  "version": "2.7.1",
+  "version": "2.8.0",
   "description": "Lyne Design System",
   "keywords": [
     "design system",

package/paginator/common/paginator-common.d.ts

@@ -10,8 +10,18 @@ export declare abstract class SbbPaginatorCommonElementMixinType {
     accessor pageIndex: number;
     accessor pagerPosition: 'start' | 'end';
     accessor size: 'm' | 's';
+    nextPage(): void;
+    previousPage(): void;
+    firstPage(): void;
+    lastPage(): void;
+    selectPage(index: number): void;
+    hasPreviousPage(): boolean;
+    hasNextPage(): boolean;
+    numberOfPages(): number;
     protected language: SbbLanguageController;
-    protected numberOfPages(): number;
+    /**
+     * @deprecated Will be removed with next major change.
+     */
     protected pageIndexChanged(value: number): void;
     protected emitPageEvent(previousPageIndex: number): void;
     protected renderPrevNextButtons(): TemplateResult;

package/paginator/common/paginator-common.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"paginator-common.d.ts","sourceRoot":"","sources":["../../../../src/elements/paginator/common/paginator-common.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,KAAK,UAAU,EAAuB,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAGtF,OAAO,EAAE,qBAAqB,EAAE,MAAM,2BAA2B,CAAC;AAKlE,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,0BAA0B,CAAC;AAC7E,OAAO,EAAE,KAAK,mBAAmB,EAAsC,MAAM,sBAAsB,CAAC;AAEpG,OAAO,6BAA6B,CAAC;AACrC,OAAO,mCAAmC,CAAC;AAC3C,OAAO,kBAAkB,CAAC;AAE1B,MAAM,CAAC,OAAO,CAAC,QAAQ,OAAO,kCAAkC;IAC9D,SAAgB,QAAQ,EAAE,OAAO,CAAC;IAClC,SAAgB,QAAQ,EAAE,OAAO,CAAC;IAClC,SAAgB,MAAM,EAAE,MAAM,CAAC;IAC/B,SAAgB,QAAQ,EAAE,MAAM,CAAC;IACjC,SAAgB,SAAS,EAAE,MAAM,CAAC;IAClC,SAAgB,aAAa,EAAE,OAAO,GAAG,KAAK,CAAC;IAC/C,SAAgB,IAAI,EAAE,GAAG,GAAG,GAAG,CAAC;IAChC,SAAS,CAAC,QAAQ,EAAE,qBAAqB,CAAC;IAC1C,SAAS,CAAC,aAAa,IAAI,MAAM;IACjC,SAAS,CAAC,gBAAgB,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAC/C,SAAS,CAAC,aAAa,CAAC,iBAAiB,EAAE,MAAM,GAAG,IAAI;IACxD,SAAS,CAAC,qBAAqB,IAAI,cAAc;IACjD,SAAS,CAAC,QAAQ,CAAC,eAAe,IAAI,cAAc;CACrD;AAGD,eAAO,MAAM,8BAA8B,GAAI,CAAC,SAAS,mBAAmB,CAAC,UAAU,CAAC,EACtF,YAAY,CAAC,KACZ,mBAAmB,CAAC,kCAAkC,CAAC,GAAG,CAqJ5D,CAAC;AAEF,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,mBAAmB;QAC3B,IAAI,EAAE,WAAW,CAAC,4BAA4B,CAAC,CAAC;KACjD;CACF"}
+{"version":3,"file":"paginator-common.d.ts","sourceRoot":"","sources":["../../../../src/elements/paginator/common/paginator-common.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,KAAK,UAAU,EAAuB,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAGtF,OAAO,EAAE,qBAAqB,EAAE,MAAM,2BAA2B,CAAC;AAKlE,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,0BAA0B,CAAC;AAC7E,OAAO,EAAE,KAAK,mBAAmB,EAAsC,MAAM,sBAAsB,CAAC;AAEpG,OAAO,6BAA6B,CAAC;AACrC,OAAO,mCAAmC,CAAC;AAC3C,OAAO,kBAAkB,CAAC;AAE1B,MAAM,CAAC,OAAO,CAAC,QAAQ,OAAO,kCAAkC;IAC9D,SAAgB,QAAQ,EAAE,OAAO,CAAC;IAClC,SAAgB,QAAQ,EAAE,OAAO,CAAC;IAClC,SAAgB,MAAM,EAAE,MAAM,CAAC;IAC/B,SAAgB,QAAQ,EAAE,MAAM,CAAC;IACjC,SAAgB,SAAS,EAAE,MAAM,CAAC;IAClC,SAAgB,aAAa,EAAE,OAAO,GAAG,KAAK,CAAC;IAC/C,SAAgB,IAAI,EAAE,GAAG,GAAG,GAAG,CAAC;IACzB,QAAQ,IAAI,IAAI;IAChB,YAAY,IAAI,IAAI;IACpB,SAAS,IAAI,IAAI;IACjB,QAAQ,IAAI,IAAI;IAChB,UAAU,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAC/B,eAAe,IAAI,OAAO;IAC1B,WAAW,IAAI,OAAO;IACtB,aAAa,IAAI,MAAM;IAC9B,SAAS,CAAC,QAAQ,EAAE,qBAAqB,CAAC;IAC1C;;OAEG;IACH,SAAS,CAAC,gBAAgB,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAC/C,SAAS,CAAC,aAAa,CAAC,iBAAiB,EAAE,MAAM,GAAG,IAAI;IACxD,SAAS,CAAC,qBAAqB,IAAI,cAAc;IACjD,SAAS,CAAC,QAAQ,CAAC,eAAe,IAAI,cAAc;CACrD;AAGD,eAAO,MAAM,8BAA8B,GAAI,CAAC,SAAS,mBAAmB,CAAC,UAAU,CAAC,EACtF,YAAY,CAAC,KACZ,mBAAmB,CAAC,kCAAkC,CAAC,GAAG,CAwL5D,CAAC;AAEF,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,mBAAmB;QAC3B,IAAI,EAAE,WAAW,CAAC,4BAA4B,CAAC,CAAC;KACjD;CACF"}

package/paginator/common/paginator-common.js

@@ -1,11 +1,11 @@
-var $ = (a) => {
+var k = (a) => {
   throw TypeError(a);
 };
-var k = (a, i, s) => i.has(a) || $("Cannot " + s);
-var _ = (a, i, s) => (k(a, i, "read from private field"), s ? s.call(a) : i.get(a)), x = (a, i, s) => i.has(a) ? $("Cannot add the same private member more than once") : i instanceof WeakSet ? i.add(a) : i.set(a, s), d = (a, i, s, m) => (k(a, i, "write to private field"), m ? m.call(a, s) : i.set(a, s), s);
+var C = (a, i, s) => i.has(a) || k("Cannot " + s);
+var x = (a, i, s) => (C(a, i, "read from private field"), s ? s.call(a) : i.get(a)), _ = (a, i, s) => i.has(a) ? k("Cannot add the same private member more than once") : i instanceof WeakSet ? i.add(a) : i.set(a, s), d = (a, i, s, m) => (C(a, i, "write to private field"), m ? m.call(a, s) : i.set(a, s), s);
 import { __runInitializers as h, __esDecorate as p } from "tslib";
 import { html as O } from "lit";
-import { property as c } from "lit/decorators.js";
+import { property as u } from "lit/decorators.js";
 import { SbbLanguageController as w } from "../../core/controllers.js";
 import { hostAttributes as D } from "../../core/decorators.js";
 import { isLean as L } from "../../core/dom.js";
@@ -16,16 +16,16 @@ import "../../button/mini-button.js";
 import "../../button/mini-button-group.js";
 import "../../divider.js";
 const ae = (a) => (() => {
-  var l, g, n;
+  var o, l, n;
   let s = [D({
     role: "group"
-  })], m, z = [], o, I = B(T(a)), u = [], f, P, S, v, y = [], E = [], N, C = [], M = [];
-  var b = (n = class extends I {
+  })], m, P = [], g, z = B(T(a)), c = [], I, f, S, v, y = [], N = [], E, M = [], $ = [];
+  var b = (n = class extends z {
     constructor() {
       super(...arguments);
-      x(this, l);
-      x(this, g);
-      this._length = (h(this, u), 0), this._pageSize = 10, this._pageIndex = 0, d(this, l, h(this, y, "start")), d(this, g, (h(this, E), h(this, C, L() ? "s" : "m"))), this._page = (h(this, M), new R(this, b.events.page, { composed: !0, bubbles: !0 })), this.language = new w(this);
+      _(this, o);
+      _(this, l);
+      this._length = (h(this, c), 0), this._pageSize = 10, this._pageIndex = 0, d(this, o, h(this, y, "start")), d(this, l, (h(this, N), h(this, M, L() ? "s" : "m"))), this._page = (h(this, $), new R(this, b.events.page, { composed: !0, bubbles: !0 })), this.language = new w(this);
     }
     /** Total number of items. */
     set length(e) {
@@ -44,27 +44,28 @@ const ae = (a) => (() => {
     }
     /** Current page index. */
     set pageIndex(e) {
-      this._pageIndex = this._coercePageIndexInRange(e);
+      const t = this._pageIndex;
+      this._pageIndex = this._coercePageIndexInRange(e), this.emitPageEvent(t);
     }
     get pageIndex() {
       return this._pageIndex;
     }
     /** Position of the prev/next buttons. */
     get pagerPosition() {
-      return _(this, l);
+      return x(this, o);
     }
     set pagerPosition(e) {
-      d(this, l, e);
+      d(this, o, e);
     }
     /**
      * Size variant, either m or s.
      * @default 'm' / 's' (lean)
      */
     get size() {
-      return _(this, g);
+      return x(this, l);
     }
     set size(e) {
-      d(this, g, e);
+      d(this, l, e);
     }
     updated(e) {
       super.updated(e), this.shadowRoot.querySelector("sbb-screen-reader-only").textContent = this._currentPageLabel();
@@ -76,6 +77,35 @@ const ae = (a) => (() => {
     _currentPageLabel() {
       return j(this.pageIndex + 1)[this.language.current];
     }
+    /** Advances to the next page if it exists. */
+    nextPage() {
+      this.pageIndex = this.pageIndex + 1;
+    }
+    /** Move back to the previous page if it exists. */
+    previousPage() {
+      this.pageIndex = this.pageIndex - 1;
+    }
+    /** Move to the first page if not already there. */
+    firstPage() {
+      this.pageIndex = 0;
+    }
+    /** Move to the last page if not already there. */
+    lastPage() {
+      this.pageIndex = this.numberOfPages() - 1;
+    }
+    /** Move to a specific page index. */
+    selectPage(e) {
+      this.pageIndex = e;
+    }
+    /** Whether there is a previous page. */
+    hasPreviousPage() {
+      return this.pageIndex >= 1 && this.pageSize !== 0;
+    }
+    /** Whether there is a next page. */
+    hasNextPage() {
+      const e = this.numberOfPages() - 1;
+      return this.pageIndex < e && this.pageSize !== 0;
+    }
     /**
      * Calculates the current number of pages based on the `length` and the `pageSize`;
      * value must be rounded up (e.g. `length = 21` and `pageSize = 10` means 3 pages).
@@ -86,10 +116,10 @@ const ae = (a) => (() => {
     /**
      * If the `pageIndex` changes due to user interaction,
      * emit the `page` event and then update the `pageIndex` value.
+     * @deprecated Will be removed with next major change.
      */
     pageIndexChanged(e) {
-      const t = this.pageIndex;
-      this.pageIndex = e, t !== this.pageIndex && this.emitPageEvent(t);
+      this.pageIndex = e;
     }
     emitPageEvent(e) {
       this._page.emit({
@@ -106,16 +136,16 @@ const ae = (a) => (() => {
             id="sbb-paginator-prev-page"
             aria-label=${q[this.language.current]}
             icon-name="chevron-small-left-small"
-            ?disabled=${this.disabled || this.pageIndex === 0}
-            @click=${() => this.pageIndexChanged(this._pageIndex - 1)}
+            ?disabled=${this.disabled || !this.hasPreviousPage()}
+            @click=${() => this.previousPage()}
           ></sbb-mini-button>
           <sbb-divider orientation="vertical"></sbb-divider>
           <sbb-mini-button
             id="sbb-paginator-next-page"
             aria-label=${A[this.language.current]}
             icon-name="chevron-small-right-small"
-            ?disabled=${this.disabled || this.pageIndex === this.numberOfPages() - 1}
-            @click=${() => this.pageIndexChanged(this._pageIndex + 1)}
+            ?disabled=${this.disabled || !this.hasNextPage()}
+            @click=${() => this.nextPage()}
           ></sbb-mini-button>
         </sbb-mini-button-group>
       `;
@@ -126,23 +156,23 @@ const ae = (a) => (() => {
         <sbb-screen-reader-only role="status"></sbb-screen-reader-only>
       `;
     }
-  }, l = new WeakMap(), g = new WeakMap(), o = n, (() => {
-    const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(I[Symbol.metadata] ?? null) : void 0;
-    f = [c({ type: Number })], P = [c({ attribute: "page-size", type: Number })], S = [c({ attribute: "page-index", type: Number })], v = [c({ attribute: "pager-position", reflect: !0 })], N = [c({ reflect: !0 })], p(n, null, f, { kind: "setter", name: "length", static: !1, private: !1, access: { has: (t) => "length" in t, set: (t, r) => {
+  }, o = new WeakMap(), l = new WeakMap(), g = n, (() => {
+    const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(z[Symbol.metadata] ?? null) : void 0;
+    I = [u({ type: Number })], f = [u({ attribute: "page-size", type: Number })], S = [u({ attribute: "page-index", type: Number })], v = [u({ attribute: "pager-position", reflect: !0 })], E = [u({ reflect: !0 })], p(n, null, I, { kind: "setter", name: "length", static: !1, private: !1, access: { has: (t) => "length" in t, set: (t, r) => {
       t.length = r;
-    } }, metadata: e }, null, u), p(n, null, P, { kind: "setter", name: "pageSize", static: !1, private: !1, access: { has: (t) => "pageSize" in t, set: (t, r) => {
+    } }, metadata: e }, null, c), p(n, null, f, { kind: "setter", name: "pageSize", static: !1, private: !1, access: { has: (t) => "pageSize" in t, set: (t, r) => {
       t.pageSize = r;
-    } }, metadata: e }, null, u), p(n, null, S, { kind: "setter", name: "pageIndex", static: !1, private: !1, access: { has: (t) => "pageIndex" in t, set: (t, r) => {
+    } }, metadata: e }, null, c), p(n, null, S, { kind: "setter", name: "pageIndex", static: !1, private: !1, access: { has: (t) => "pageIndex" in t, set: (t, r) => {
       t.pageIndex = r;
-    } }, metadata: e }, null, u), p(n, null, v, { kind: "accessor", name: "pagerPosition", static: !1, private: !1, access: { has: (t) => "pagerPosition" in t, get: (t) => t.pagerPosition, set: (t, r) => {
+    } }, metadata: e }, null, c), p(n, null, v, { kind: "accessor", name: "pagerPosition", static: !1, private: !1, access: { has: (t) => "pagerPosition" in t, get: (t) => t.pagerPosition, set: (t, r) => {
       t.pagerPosition = r;
-    } }, metadata: e }, y, E), p(n, null, N, { kind: "accessor", name: "size", static: !1, private: !1, access: { has: (t) => "size" in t, get: (t) => t.size, set: (t, r) => {
+    } }, metadata: e }, y, N), p(n, null, E, { kind: "accessor", name: "size", static: !1, private: !1, access: { has: (t) => "size" in t, get: (t) => t.size, set: (t, r) => {
       t.size = r;
-    } }, metadata: e }, C, M), p(null, m = { value: o }, s, { kind: "class", name: o.name, metadata: e }, null, z), b = o = m.value, e && Object.defineProperty(o, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
+    } }, metadata: e }, M, $), p(null, m = { value: g }, s, { kind: "class", name: g.name, metadata: e }, null, P), b = g = m.value, e && Object.defineProperty(g, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
   })(), n.events = {
     page: "page"
-  }, h(o, z), n);
-  return b = o;
+  }, h(g, P), n);
+  return b = g;
 })();
 export {
   ae as SbbPaginatorCommonElementMixin

package/paginator/paginator/paginator.js

@@ -14,7 +14,7 @@ import "../../form-field.js";
 import "../../select.js";
 import "../../option.js";
 import "../../screen-reader-only.js";
-const C = E`*,:before,:after{box-sizing:border-box}:host{display:block;--sbb-paginator-height: var(--sbb-size-element-m);--sbb-paginator-page-color: var(--sbb-color-metal);--sbb-paginator-page-background-color: transparent;--sbb-paginator-page-border-width: 0;--sbb-paginator-page-border-style: none;--sbb-paginator-page-border-color: none;--sbb-paginator-page-cursor: pointer;--sbb-paginator-page-inset: 0;--sbb-paginator-animation-easing: var(--sbb-animation-easing);--sbb-paginator-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-2x) );--sbb-paginator-justify-content: start;--sbb-paginator-wrapping-group-wrap: wrap-reverse;--sbb-paginator-wrap: wrap}:host([size=s]){--sbb-paginator-height: var(--sbb-size-element-xs)}:host([negative]){--sbb-paginator-page-color: var(--sbb-color-smoke);--sbb-focus-outline-color: var(--sbb-focus-outline-color-dark)}:host([pager-position=end]){--sbb-paginator-justify-content: end;--sbb-paginator-wrapping-group-wrap: wrap;--sbb-paginator-wrap: wrap-reverse}.sbb-paginator,.sbb-paginator__wrapping-group{display:flex;gap:var(--sbb-spacing-fixed-3x) var(--sbb-spacing-fixed-6x);justify-content:var(--sbb-paginator-justify-content)}.sbb-paginator{flex-wrap:var(--sbb-paginator-wrap);min-height:var(--sbb-paginator-height)}.sbb-paginator__wrapping-group{flex-wrap:var(--sbb-paginator-wrapping-group-wrap)}.sbb-paginator__page-size-options{--sbb-text-font-size: var(--sbb-font-size-text-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);display:flex;align-items:center;gap:var(--sbb-spacing-fixed-2x);white-space:nowrap;color:var(--sbb-paginator-page-color)}.sbb-paginator__page-size-options sbb-select{--sbb-text-font-size: var(--sbb-font-size-text-m);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);color:var(--sbb-form-field-text-color);font-size:var(--sbb-form-field-input-text-size);padding-inline-end:var(--sbb-form-field-select-inline-padding-end)}.sbb-paginator__pages{list-style:none;margin:0;padding:0;font-size:inherit;display:flex;align-items:center;justify-content:center;gap:var(--sbb-spacing-fixed-1x);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.sbb-paginator__page--ellipsis,.sbb-paginator__page--number{--sbb-text-font-size: var(--sbb-font-size-text-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);position:relative;color:var(--sbb-paginator-page-color)}.sbb-paginator__page--ellipsis-item,.sbb-paginator__page--number-item{display:flex;justify-content:center;align-items:center;width:var(--sbb-size-element-xxs);height:var(--sbb-size-element-xxs)}.sbb-paginator__page--number-item{-webkit-appearance:none;-moz-appearance:none;box-sizing:border-box;margin:0;outline:none;border:none;border-radius:0;padding:0;background:none;-webkit-tap-highlight-color:transparent;color:inherit;--sbb-text-font-size: var(--sbb-font-size-text-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);position:relative;cursor:var(--sbb-paginator-page-cursor);outline:none!important;color:var(--sbb-paginator-page-color);transition:color var(--sbb-paginator-animation-duration) var(--sbb-paginator-animation-easing)}.sbb-paginator__page--number-item:before{content:"";position:absolute;background-color:var(--sbb-paginator-page-background-color);border:var(--sbb-paginator-page-border-width) var(--sbb-paginator-page-border-style) var(--sbb-paginator-page-border-color);border-radius:var(--sbb-border-radius-infinity);inset:var(--sbb-paginator-page-inset);transition-property:background-color,border,inset;transition-duration:var(--sbb-paginator-animation-duration);transition-timing-function:var(--sbb-paginator-animation-easing)}.sbb-paginator__page--number-item:focus-visible:before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);outline-offset:var(--sbb-border-width-2x)}.sbb-paginator__page--number-item[data-selected]{font-weight:700;--sbb-paginator-page-color: var(--sbb-color-charcoal);--sbb-paginator-page-border-width: var(--sbb-border-width-2x);--sbb-paginator-page-border-style: solid;--sbb-paginator-page-border-color: var(--sbb-color-charcoal)}:host([negative]) .sbb-paginator__page--number-item[data-selected]{--sbb-paginator-page-color: var(--sbb-color-milk);--sbb-paginator-page-border-color: var(--sbb-color-white)}@media (forced-colors: active){.sbb-paginator__page--number-item[data-selected]{--sbb-paginator-page-border-color: Highlight !important}}.sbb-paginator__page--number-item:disabled{--sbb-paginator-page-color: var(--sbb-color-smoke);--sbb-paginator-page-border-style: dashed;--sbb-paginator-page-border-color: var(--sbb-color-smoke);--sbb-paginator-page-background-color: var(--sbb-color-milk);--sbb-paginator-page-cursor: default}.sbb-paginator__page--number-item:disabled:not([data-selected]){--sbb-paginator-page-border-width: var(--sbb-border-width-1x)}:host([negative]) .sbb-paginator__page--number-item:disabled{--sbb-paginator-page-color: var(--sbb-color-aluminium);--sbb-paginator-page-background-color: var(--sbb-color-charcoal)}@media (forced-colors: active){.sbb-paginator__page--number-item:disabled{--sbb-paginator-page-border-color: GrayText;--sbb-paginator-page-color: GrayText;--sbb-paginator-page-background-color: Canvas}}@media (any-hover: hover){.sbb-paginator__page--number-item:not(:disabled):hover{--sbb-paginator-page-background-color: var(--sbb-color-milk);--sbb-paginator-page-inset: calc(var(--sbb-border-width-2x) * -1);--sbb-paginator-translate-y-content-hover: -.0625rem}:host([negative]) .sbb-paginator__page--number-item:not(:disabled):hover{--sbb-paginator-page-background-color: var(--sbb-color-charcoal)}}@media (any-hover: hover) and (forced-colors: active){.sbb-paginator__page--number-item:not(:disabled):hover{--sbb-paginator-page-background-color: Highlight !important}}.sbb-paginator__page--number-item:not(:disabled):active{--sbb-paginator-page-color: var(--sbb-color-charcoal);--sbb-paginator-page-background-color: var(--sbb-color-cloud);--sbb-paginator-page-inset: 0;--sbb-paginator-translate-y-content-hover: 0}:host([negative]) .sbb-paginator__page--number-item:not(:disabled):active{--sbb-paginator-page-color: var(--sbb-color-milk);--sbb-paginator-page-background-color: var(--sbb-color-iron)}@media (forced-colors: active){.sbb-paginator__page--number-item:not(:disabled):active{--sbb-paginator-page-background-color: Highlight !important}}.sbb-paginator__page--number-item-label{transition:transform var(--sbb-paginator-animation-duration) var(--sbb-paginator-animation-easing);transform:translateY(var(--sbb-paginator-translate-y-content-hover, 0rem))}.sbb-screen-reader-only{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}`, l = 3;
+const M = E`*,:before,:after{box-sizing:border-box}:host{display:block;--sbb-paginator-height: var(--sbb-size-element-m);--sbb-paginator-page-color: var(--sbb-color-metal);--sbb-paginator-page-background-color: transparent;--sbb-paginator-page-border-width: 0;--sbb-paginator-page-border-style: none;--sbb-paginator-page-border-color: none;--sbb-paginator-page-cursor: pointer;--sbb-paginator-page-inset: 0;--sbb-paginator-animation-easing: var(--sbb-animation-easing);--sbb-paginator-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-2x) );--sbb-paginator-justify-content: start;--sbb-paginator-wrapping-group-wrap: wrap-reverse;--sbb-paginator-wrap: wrap}:host([size=s]){--sbb-paginator-height: var(--sbb-size-element-xs)}:host([negative]){--sbb-paginator-page-color: var(--sbb-color-smoke);--sbb-focus-outline-color: var(--sbb-focus-outline-color-dark)}:host([pager-position=end]){--sbb-paginator-justify-content: end;--sbb-paginator-wrapping-group-wrap: wrap;--sbb-paginator-wrap: wrap-reverse}.sbb-paginator,.sbb-paginator__wrapping-group{display:flex;gap:var(--sbb-spacing-fixed-3x) var(--sbb-spacing-fixed-6x);justify-content:var(--sbb-paginator-justify-content)}.sbb-paginator{flex-wrap:var(--sbb-paginator-wrap);min-height:var(--sbb-paginator-height)}.sbb-paginator__wrapping-group{flex-wrap:var(--sbb-paginator-wrapping-group-wrap)}.sbb-paginator__page-size-options{--sbb-text-font-size: var(--sbb-font-size-text-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);display:flex;align-items:center;gap:var(--sbb-spacing-fixed-2x);white-space:nowrap;color:var(--sbb-paginator-page-color)}.sbb-paginator__page-size-options sbb-select{--sbb-text-font-size: var(--sbb-font-size-text-m);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);color:var(--sbb-form-field-text-color);font-size:var(--sbb-form-field-input-text-size);padding-inline-end:var(--sbb-form-field-select-inline-padding-end)}.sbb-paginator__pages{list-style:none;margin:0;padding:0;font-size:inherit;display:flex;align-items:center;justify-content:center;gap:var(--sbb-spacing-fixed-1x);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.sbb-paginator__page--ellipsis,.sbb-paginator__page--number{--sbb-text-font-size: var(--sbb-font-size-text-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);position:relative;color:var(--sbb-paginator-page-color)}.sbb-paginator__page--ellipsis-item,.sbb-paginator__page--number-item{display:flex;justify-content:center;align-items:center;width:var(--sbb-size-element-xxs);height:var(--sbb-size-element-xxs)}.sbb-paginator__page--number-item{-webkit-appearance:none;-moz-appearance:none;box-sizing:border-box;margin:0;outline:none;border:none;border-radius:0;padding:0;background:none;-webkit-tap-highlight-color:transparent;color:inherit;--sbb-text-font-size: var(--sbb-font-size-text-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);position:relative;cursor:var(--sbb-paginator-page-cursor);outline:none!important;color:var(--sbb-paginator-page-color);transition:color var(--sbb-paginator-animation-duration) var(--sbb-paginator-animation-easing)}.sbb-paginator__page--number-item:before{content:"";position:absolute;background-color:var(--sbb-paginator-page-background-color);border:var(--sbb-paginator-page-border-width) var(--sbb-paginator-page-border-style) var(--sbb-paginator-page-border-color);border-radius:var(--sbb-border-radius-infinity);inset:var(--sbb-paginator-page-inset);transition-property:background-color,border,inset;transition-duration:var(--sbb-paginator-animation-duration);transition-timing-function:var(--sbb-paginator-animation-easing)}.sbb-paginator__page--number-item:focus-visible:before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);outline-offset:var(--sbb-border-width-2x)}.sbb-paginator__page--number-item[data-selected]{font-weight:700;--sbb-paginator-page-color: var(--sbb-color-charcoal);--sbb-paginator-page-border-width: var(--sbb-border-width-2x);--sbb-paginator-page-border-style: solid;--sbb-paginator-page-border-color: var(--sbb-color-charcoal)}:host([negative]) .sbb-paginator__page--number-item[data-selected]{--sbb-paginator-page-color: var(--sbb-color-milk);--sbb-paginator-page-border-color: var(--sbb-color-white)}@media (forced-colors: active){.sbb-paginator__page--number-item[data-selected]{--sbb-paginator-page-border-color: Highlight !important}}.sbb-paginator__page--number-item:disabled{--sbb-paginator-page-color: var(--sbb-color-smoke);--sbb-paginator-page-border-style: dashed;--sbb-paginator-page-border-color: var(--sbb-color-smoke);--sbb-paginator-page-background-color: var(--sbb-color-milk);--sbb-paginator-page-cursor: default}.sbb-paginator__page--number-item:disabled:not([data-selected]){--sbb-paginator-page-border-width: var(--sbb-border-width-1x)}:host([negative]) .sbb-paginator__page--number-item:disabled{--sbb-paginator-page-color: var(--sbb-color-aluminium);--sbb-paginator-page-background-color: var(--sbb-color-charcoal)}@media (forced-colors: active){.sbb-paginator__page--number-item:disabled{--sbb-paginator-page-border-color: GrayText;--sbb-paginator-page-color: GrayText;--sbb-paginator-page-background-color: Canvas}}@media (any-hover: hover){.sbb-paginator__page--number-item:not(:disabled):hover{--sbb-paginator-page-background-color: var(--sbb-color-milk);--sbb-paginator-page-inset: calc(var(--sbb-border-width-2x) * -1);--sbb-paginator-translate-y-content-hover: -.0625rem}:host([negative]) .sbb-paginator__page--number-item:not(:disabled):hover{--sbb-paginator-page-background-color: var(--sbb-color-charcoal)}}@media (any-hover: hover) and (forced-colors: active){.sbb-paginator__page--number-item:not(:disabled):hover{--sbb-paginator-page-background-color: Highlight !important}}.sbb-paginator__page--number-item:not(:disabled):active{--sbb-paginator-page-color: var(--sbb-color-charcoal);--sbb-paginator-page-background-color: var(--sbb-color-cloud);--sbb-paginator-page-inset: 0;--sbb-paginator-translate-y-content-hover: 0}:host([negative]) .sbb-paginator__page--number-item:not(:disabled):active{--sbb-paginator-page-color: var(--sbb-color-milk);--sbb-paginator-page-background-color: var(--sbb-color-iron)}@media (forced-colors: active){.sbb-paginator__page--number-item:not(:disabled):active{--sbb-paginator-page-background-color: Highlight !important}}.sbb-paginator__page--number-item-label{transition:transform var(--sbb-paginator-animation-duration) var(--sbb-paginator-animation-easing);transform:translateY(var(--sbb-paginator-translate-y-content-hover, 0rem))}.sbb-screen-reader-only{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}`, l = 3;
 let Q = (() => {
   var p, g, s;
   let t = [A("sbb-paginator")], r, i = [], o, v = T(j), f, _ = [], y = [], x, z = [], w = [];
@@ -130,7 +130,7 @@ let Q = (() => {
                       data-index=${e}
                       aria-label="${N[this.language.current]} ${e + 1}"
                       aria-current=${this.pageIndex === e ? "true" : S}
-                      @click=${() => this.pageIndexChanged(e)}
+                      @click=${() => this.pageIndex = e}
                       @keyup=${this._handleKeyUp}
                     >
                       <span class="sbb-paginator__page--number-item-label">${e + 1}</span>
@@ -160,7 +160,7 @@ let Q = (() => {
     } }, metadata: e }, _, y), h(s, null, x, { kind: "accessor", name: "pagerPosition", static: !1, private: !1, access: { has: (a) => "pagerPosition" in a, get: (a) => a.pagerPosition, set: (a, n) => {
       a.pagerPosition = n;
     } }, metadata: e }, z, w), h(null, r = { value: o }, t, { kind: "class", name: o.name, metadata: e }, null, i), o = r.value, e && Object.defineProperty(o, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
-  })(), s.styles = C, s.events = {
+  })(), s.styles = M, s.events = {
     page: "page"
   }, d(o, i), o;
 })();

package/standard-theme.css

@@ -106,7 +106,7 @@ summary {
 
 /**
  * Do not edit directly
- * Generated on Wed, 19 Mar 2025 15:25:09 GMT
+ * Generated on Thu, 17 Apr 2025 11:20:53 GMT
  */
 *,
 ::before,
@@ -685,6 +685,10 @@ summary {
    * Original Value: 64px
    */
   --sbb-size-element-l-ultra: 4rem;
+  /**
+   * Original Value: 16px
+   */
+  --sbb-size-icon-ui-extra-small: 1rem;
   /**
    * Original Value: 24px
    */
@@ -1219,7 +1223,7 @@ summary {
   --sbb-time-input-max-width: 3.625rem;
   --sbb-time-input-s-max-width: 3.1875rem;
   --sbb-overlay-default-z-index: 1000;
-  --sbb-border-radius-infinity: 10000000em;
+  --sbb-border-radius-infinity: 100000em;
 }
 :root:has(sbb-header[size=s]) {
   --sbb-header-height: 3.25rem;
@@ -1650,6 +1654,12 @@ sbb-form-field .sbb-select-trigger {
   top: 0;
 }
 
+sbb-toggle:has(:focus-visible) {
+  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.3125rem;
+}
+
 sub {
   bottom: -0.36em;
 }

package/table/table-wrapper/table-wrapper.d.ts

@@ -1,15 +1,18 @@
 import { CSSResultGroup, LitElement, PropertyValues, TemplateResult } from 'lit';
 declare const SbbTableWrapperElement_base: import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbNegativeMixinType> & typeof LitElement;
 /**
- * Wraps a table to enhance its functionality
+ * Wraps a table to enhance its functionality.
  *
  * @slot - Use the unnamed slot to add the table.
  */
 export declare class SbbTableWrapperElement extends SbbTableWrapperElement_base {
     static styles: CSSResultGroup;
-    private _resizeObserver;
-    private _tableWrapper;
-    protected firstUpdated(changedProperties: PropertyValues<this>): void;
+    /** Whether the table wrapper is focusable. */
+    accessor focusable: boolean;
+    constructor();
+    connectedCallback(): void;
+    protected willUpdate(changedProperties: PropertyValues<this>): void;
+    private _updateScrollbarClass;
     /**
      *  Calculates whether the table is horizontally scrolled and adds the
      *  corresponding class `sbb-table-wrapper-offset-${none | left | right | both}`

package/table/table-wrapper/table-wrapper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"table-wrapper.d.ts","sourceRoot":"","sources":["../../../../src/elements/table/table-wrapper/table-wrapper.ts"],"names":[],"mappings":"AACA,OAAO,EACL,KAAK,cAAc,EAEnB,UAAU,EACV,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;;AAOb;;;;GAIG;AACH,qBAEM,sBAAuB,SAAQ,2BAA4B;IAC/D,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,OAAO,CAAC,eAAe,CAIpB;IACH,OAAO,CAAC,aAAa,CAAe;cAEjB,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAU9E;;;OAGG;IACH,OAAO,CAAC,+BAA+B;IAWvC,OAAO,CAAC,sBAAsB;cAiBX,MAAM,IAAI,cAAc;CAK5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,mBAAmB,EAAE,sBAAsB,CAAC;KAC7C;CACF"}
+{"version":3,"file":"table-wrapper.d.ts","sourceRoot":"","sources":["../../../../src/elements/table/table-wrapper/table-wrapper.ts"],"names":[],"mappings":"AACA,OAAO,EACL,KAAK,cAAc,EAGnB,UAAU,EACV,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;;AAQb;;;;GAIG;AACH,qBAEM,sBAAuB,SAAQ,2BAA4B;IAC/D,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,8CAA8C;IAC9C,SAEgB,SAAS,EAAE,OAAO,CAAS;;IAqB3B,iBAAiB,IAAI,IAAI;cAStB,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAkB5E,OAAO,CAAC,qBAAqB;IAa7B;;;OAGG;IACH,OAAO,CAAC,+BAA+B;IAWvC,OAAO,CAAC,sBAAsB;cAeX,MAAM,IAAI,cAAc;CAG5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,mBAAmB,EAAE,sBAAsB,CAAC;KAC7C;CACF"}