@swisspost/design-system-components 10.0.0-next.70 → 10.0.0-next.72

package/dist/esm/breakpoints-BQ3HlJPr.js

@@ -0,0 +1,202 @@
+/* eslint-disable no-undefined,no-param-reassign,no-shadow */
+
+/**
+ * Throttle execution of a function. Especially useful for rate limiting
+ * execution of handlers on events like resize and scroll.
+ *
+ * @param {number} delay -                  A zero-or-greater delay in milliseconds. For event callbacks, values around 100 or 250 (or even higher)
+ *                                            are most useful.
+ * @param {Function} callback -               A function to be executed after delay milliseconds. The `this` context and all arguments are passed through,
+ *                                            as-is, to `callback` when the throttled-function is executed.
+ * @param {object} [options] -              An object to configure options.
+ * @param {boolean} [options.noTrailing] -   Optional, defaults to false. If noTrailing is true, callback will only execute every `delay` milliseconds
+ *                                            while the throttled-function is being called. If noTrailing is false or unspecified, callback will be executed
+ *                                            one final time after the last throttled-function call. (After the throttled-function has not been called for
+ *                                            `delay` milliseconds, the internal counter is reset).
+ * @param {boolean} [options.noLeading] -   Optional, defaults to false. If noLeading is false, the first throttled-function call will execute callback
+ *                                            immediately. If noLeading is true, the first the callback execution will be skipped. It should be noted that
+ *                                            callback will never executed if both noLeading = true and noTrailing = true.
+ * @param {boolean} [options.debounceMode] - If `debounceMode` is true (at begin), schedule `clear` to execute after `delay` ms. If `debounceMode` is
+ *                                            false (at end), schedule `callback` to execute after `delay` ms.
+ *
+ * @returns {Function} A new, throttled, function.
+ */
+function throttle (delay, callback, options) {
+  var _ref = options || {},
+    _ref$noTrailing = _ref.noTrailing,
+    noTrailing = _ref$noTrailing === void 0 ? false : _ref$noTrailing,
+    _ref$noLeading = _ref.noLeading,
+    noLeading = _ref$noLeading === void 0 ? false : _ref$noLeading,
+    _ref$debounceMode = _ref.debounceMode,
+    debounceMode = _ref$debounceMode === void 0 ? undefined : _ref$debounceMode;
+  /*
+   * After wrapper has stopped being called, this timeout ensures that
+   * `callback` is executed at the proper times in `throttle` and `end`
+   * debounce modes.
+   */
+  var timeoutID;
+  var cancelled = false;
+
+  // Keep track of the last time `callback` was executed.
+  var lastExec = 0;
+
+  // Function to clear existing timeout
+  function clearExistingTimeout() {
+    if (timeoutID) {
+      clearTimeout(timeoutID);
+    }
+  }
+
+  // Function to cancel next exec
+  function cancel(options) {
+    var _ref2 = options || {},
+      _ref2$upcomingOnly = _ref2.upcomingOnly,
+      upcomingOnly = _ref2$upcomingOnly === void 0 ? false : _ref2$upcomingOnly;
+    clearExistingTimeout();
+    cancelled = !upcomingOnly;
+  }
+
+  /*
+   * The `wrapper` function encapsulates all of the throttling / debouncing
+   * functionality and when executed will limit the rate at which `callback`
+   * is executed.
+   */
+  function wrapper() {
+    for (var _len = arguments.length, arguments_ = new Array(_len), _key = 0; _key < _len; _key++) {
+      arguments_[_key] = arguments[_key];
+    }
+    var self = this;
+    var elapsed = Date.now() - lastExec;
+    if (cancelled) {
+      return;
+    }
+
+    // Execute `callback` and update the `lastExec` timestamp.
+    function exec() {
+      lastExec = Date.now();
+      callback.apply(self, arguments_);
+    }
+
+    /*
+     * If `debounceMode` is true (at begin) this is used to clear the flag
+     * to allow future `callback` executions.
+     */
+    function clear() {
+      timeoutID = undefined;
+    }
+    if (!noLeading && debounceMode && !timeoutID) {
+      /*
+       * Since `wrapper` is being called for the first time and
+       * `debounceMode` is true (at begin), execute `callback`
+       * and noLeading != true.
+       */
+      exec();
+    }
+    clearExistingTimeout();
+    if (debounceMode === undefined && elapsed > delay) {
+      if (noLeading) {
+        /*
+         * In throttle mode with noLeading, if `delay` time has
+         * been exceeded, update `lastExec` and schedule `callback`
+         * to execute after `delay` ms.
+         */
+        lastExec = Date.now();
+        if (!noTrailing) {
+          timeoutID = setTimeout(debounceMode ? clear : exec, delay);
+        }
+      } else {
+        /*
+         * In throttle mode without noLeading, if `delay` time has been exceeded, execute
+         * `callback`.
+         */
+        exec();
+      }
+    } else if (noTrailing !== true) {
+      /*
+       * In trailing throttle mode, since `delay` time has not been
+       * exceeded, schedule `callback` to execute `delay` ms after most
+       * recent execution.
+       *
+       * If `debounceMode` is true (at begin), schedule `clear` to execute
+       * after `delay` ms.
+       *
+       * If `debounceMode` is false (at end), schedule `callback` to
+       * execute after `delay` ms.
+       */
+      timeoutID = setTimeout(debounceMode ? clear : exec, debounceMode === undefined ? delay - elapsed : delay);
+    }
+  }
+  wrapper.cancel = cancel;
+
+  // Return the wrapper function.
+  return wrapper;
+}
+
+/* eslint-disable no-undefined */
+
+/**
+ * Debounce execution of a function. Debouncing, unlike throttling,
+ * guarantees that a function is only executed a single time, either at the
+ * very beginning of a series of calls, or at the very end.
+ *
+ * @param {number} delay -               A zero-or-greater delay in milliseconds. For event callbacks, values around 100 or 250 (or even higher) are most useful.
+ * @param {Function} callback -          A function to be executed after delay milliseconds. The `this` context and all arguments are passed through, as-is,
+ *                                        to `callback` when the debounced-function is executed.
+ * @param {object} [options] -           An object to configure options.
+ * @param {boolean} [options.atBegin] -  Optional, defaults to false. If atBegin is false or unspecified, callback will only be executed `delay` milliseconds
+ *                                        after the last debounced-function call. If atBegin is true, callback will be executed only at the first debounced-function call.
+ *                                        (After the throttled-function has not been called for `delay` milliseconds, the internal counter is reset).
+ *
+ * @returns {Function} A new, debounced function.
+ */
+function debounce (delay, callback, options) {
+  var _ref = {},
+    _ref$atBegin = _ref.atBegin,
+    atBegin = _ref$atBegin === void 0 ? false : _ref$atBegin;
+  return throttle(delay, callback, {
+    debounceMode: atBegin !== false
+  });
+}
+
+class Breakpoint {
+    constructor() {
+        this.breakpoints = [
+            { key: 'xl', device: 'desktop', minWidth: 1280 },
+            { key: 'lg', device: 'desktop', minWidth: 1024 },
+            { key: 'md', device: 'tablet', minWidth: 780 },
+            { key: 'sm', device: 'tablet', minWidth: 600 },
+            { key: 'xs', device: 'mobile', minWidth: 0 },
+        ];
+        this.resizeObserver = globalThis.ResizeObserver
+            ? new ResizeObserver(() => this.updateCurrentBreakpoint())
+            : null;
+        this.updateCurrentBreakpoint = throttle(50, (options = { emitEvents: true }) => {
+            const previousBreakpoint = this.currentBreakpoint;
+            const newBreakpoint = this.breakpoints.find(breakpoint => {
+                return breakpoint.minWidth <= innerWidth;
+            });
+            if (!newBreakpoint)
+                return;
+            this.currentBreakpoint = newBreakpoint;
+            if (!options.emitEvents)
+                return;
+            Object.keys(this.currentBreakpoint)
+                .filter(key => !previousBreakpoint || this.currentBreakpoint[key] !== previousBreakpoint[key])
+                .forEach((key) => this.dispatchEvent(key));
+        });
+        if (this.resizeObserver) {
+            this.updateCurrentBreakpoint({ emitEvents: false });
+            this.resizeObserver.observe(document.body);
+        }
+    }
+    dispatchEvent(property) {
+        globalThis.dispatchEvent(new CustomEvent(`postBreakpoint:${property}`, { detail: this.currentBreakpoint[property] }));
+    }
+    get(property) {
+        this.updateCurrentBreakpoint({ emitEvents: false });
+        return this.currentBreakpoint[property];
+    }
+}
+const breakpoint = new Breakpoint();
+
+export { breakpoint as b, debounce as d, throttle as t };

package/dist/esm/component-on-ready-lpWRZjJp.js

@@ -0,0 +1,22 @@
+/**
+ * Invoke the `componentOnReady` method if it is available, simulate it otherwise
+ * @see https://stenciljs.com/docs/api#componentonready
+ */
+function componentOnReady(el) {
+    if (typeof el.componentOnReady === 'function') {
+        return el.componentOnReady();
+    }
+    else {
+        return new Promise(resolve => customOnReady(() => {
+            resolve(el);
+        }));
+    }
+}
+function customOnReady(callback) {
+    if (typeof requestAnimationFrame === 'function') {
+        return requestAnimationFrame(callback);
+    }
+    return setTimeout(callback);
+}
+
+export { componentOnReady as c };

package/dist/esm/create-validator-decorator-D8qwF5Qe.js

@@ -0,0 +1,218 @@
+import { a as getElement } from './index-BbDawWJ5.js';
+
+const EMPTY_VALUES = [undefined, null, '', Number.NaN];
+function isValueEmpty(value) {
+    return EMPTY_VALUES.some(v => Object.is(v, value));
+}
+
+/** Tracks prototypes whose `componentDidLoad` lifecycle has already been wrapped. */
+const patchedTargets = new WeakSet();
+/** Tracks component instances that already completed the first load cycle. */
+const loadedInstances = new WeakSet();
+/** Stores validators per component prototype and property name. */
+const validatorsByTarget = new WeakMap();
+/** Stores all properties that use a validator decorator for each component prototype. */
+const decoratedPropertiesByTarget = new WeakMap();
+/** Stores per-instance property values captured by dynamically created accessors. */
+const propertyValuesByInstance = new WeakMap();
+/** Stores dependency relationships per prototype: dependencyProp -> Set<dependentProp>. */
+const dependenciesByTarget = new WeakMap();
+/**
+ * Returns the value for a key in a {@link WeakMap} and lazily creates it when missing.
+ *
+ * @template K WeakMap key type.
+ * @template T WeakMap value type.
+ * @param map WeakMap used as storage.
+ * @param key Object key used to retrieve or initialize the value.
+ * @param factory Factory creating the value when no entry exists for the key.
+ * @returns Existing or newly created value associated with the key.
+ */
+function getOrCreate(map, key, factory) {
+    let value = map.get(key);
+    if (!value) {
+        value = factory();
+        map.set(key, value);
+    }
+    return value;
+}
+/**
+ * Returns the mutable validator list registered for a property on a component prototype.
+ *
+ * @param target Component prototype where decorators were applied.
+ * @param property Decorated property name.
+ * @returns Validator list for the property.
+ */
+function getValidators(target, property) {
+    const validatorsByProperty = getOrCreate(validatorsByTarget, target, () => new Map());
+    return getOrCreate(validatorsByProperty, property, () => []);
+}
+/**
+ * Returns all property names decorated with validator decorators for a prototype.
+ *
+ * @param target Component prototype where decorators were applied.
+ * @returns Set of decorated property names.
+ */
+function getDecoratedProperties(target) {
+    return getOrCreate(decoratedPropertiesByTarget, target, () => new Set());
+}
+/**
+ * Returns the map containing tracked property values for a component instance.
+ *
+ * @param instance Component instance.
+ * @returns Map keyed by property name with last assigned values.
+ */
+function getValuesByProperty(instance) {
+    return getOrCreate(propertyValuesByInstance, instance, () => new Map());
+}
+/**
+ * Registers that `dependentProp` should be re-validated when `dependencyProp` changes.
+ * Ensures the dependency property has an accessor so its setter can trigger dependents.
+ */
+function registerDependency(target, dependencyProp, dependentProp) {
+    // Ensure dependency has an accessor so its setter can run dependent validators
+    createPropertyAccessor(target, dependencyProp);
+    const depsByProp = getOrCreate(dependenciesByTarget, target, () => new Map());
+    const dependents = getOrCreate(depsByProp, dependencyProp, () => new Set());
+    dependents.add(dependentProp);
+}
+/**
+ * Defines an accessor for a decorated property that stores values per instance and
+ * triggers validation after the component first loads.
+ *
+ * Accessor creation is skipped when a getter already exists to avoid overriding
+ * component-defined accessors.
+ *
+ * @param target Component prototype receiving the accessor.
+ * @param property Decorated property name.
+ */
+function createPropertyAccessor(target, property) {
+    const descriptor = Object.getOwnPropertyDescriptor(target, property);
+    if (descriptor && descriptor.get)
+        return;
+    Object.defineProperty(target, property, {
+        get() {
+            return getValuesByProperty(this).get(property);
+        },
+        set(newValue) {
+            getValuesByProperty(this).set(property, newValue);
+            if (loadedInstances.has(this)) {
+                runValidators(this, property);
+                // Run validators for any properties that depend on this property.
+                const proto = Object.getPrototypeOf(this);
+                const depsByProp = dependenciesByTarget.get(proto);
+                if (depsByProp) {
+                    const dependents = depsByProp.get(property);
+                    if (dependents) {
+                        for (const dependent of dependents) {
+                            runValidators(this, dependent);
+                        }
+                    }
+                }
+            }
+        },
+        enumerable: true,
+        configurable: true,
+    });
+}
+/**
+ * Wraps `componentDidLoad` once per prototype to execute validators on initial render.
+ *
+ * Existing `componentDidLoad` behavior is preserved and called after validation.
+ *
+ * @param target Component prototype to patch.
+ */
+function patchComponentDidLoad(target) {
+    if (patchedTargets.has(target))
+        return;
+    patchedTargets.add(target);
+    const original = 'componentDidLoad' in target && typeof target.componentDidLoad === 'function'
+        ? target.componentDidLoad
+        : undefined;
+    Object.defineProperty(target, 'componentDidLoad', {
+        writable: true,
+        configurable: true,
+        value: function (...args) {
+            loadedInstances.add(this);
+            const decoratedProperties = getDecoratedProperties(Object.getPrototypeOf(this));
+            for (const property of decoratedProperties) {
+                runValidators(this, property);
+            }
+            if (original) {
+                return original.apply(this, args);
+            }
+        },
+    });
+}
+/**
+ * Executes all validators for a property in ascending priority order.
+ *
+ * Validation is skipped for empty values unless a validator explicitly opts in via
+ * `validateEmptyValues`. Execution stops when a blocking validator fails.
+ *
+ * @param component Component instance.
+ * @param property Property name to validate.
+ */
+function runValidators(component, property) {
+    const prototype = Object.getPrototypeOf(component);
+    const validatorsByProperty = validatorsByTarget.get(prototype);
+    if (!validatorsByProperty)
+        return;
+    const validators = validatorsByProperty.get(property);
+    if (!validators || validators.length === 0)
+        return;
+    const sortedValidators = [...validators].sort((a, b) => a.priority - b.priority);
+    const value = component[property];
+    const valueIsEmpty = isValueEmpty(value);
+    for (const validator of sortedValidators) {
+        if (valueIsEmpty && !validator.validateEmptyValues) {
+            continue;
+        }
+        const passed = validator.run(component, property);
+        if (!passed && validator.blocking)
+            break;
+    }
+}
+/**
+ * Creates a property decorator that registers a validator for a component property.
+ *
+ * The returned decorator ensures property access is intercepted, initial-load
+ * validation is enabled, and the provided validator is stored for execution.
+ *
+ * @param validator Validator definition to register.
+ * @returns Property decorator compatible with TypeScript decorator syntax.
+ */
+function createValidatorDecorator(validator) {
+    return function (target, property) {
+        createPropertyAccessor(target, property);
+        patchComponentDidLoad(target);
+        getDecoratedProperties(target).add(property);
+        getValidators(target, property).push(validator);
+    };
+}
+/**
+ * Builds a validation context for a decorated component property.
+ *
+ * The returned context includes:
+ * - `value`: current property value.
+ * - `showError(constraint)`: helper that logs a consistent error format and includes
+ *   the host element for easier debugging in browser consoles.
+ *
+ * Message format: `[componentName] Property "property" <constraint>. Received: <value>.`
+ *
+ * @param component Component instance containing the validated property.
+ * @param property Property name being validated.
+ * @returns Validation context used by individual validator implementations.
+ */
+function getValidationContext(component, property) {
+    const host = getElement(component);
+    const componentName = host.localName;
+    const value = component[property];
+    return {
+        value,
+        showError(constraint) {
+            console.error(`[${componentName}] Property "${String(property)}" ${constraint}. Received: ${JSON.stringify(value)}.`, host);
+        },
+    };
+}
+
+export { createValidatorDecorator as c, getValidationContext as g, isValueEmpty as i, registerDependency as r };

package/dist/esm/{focusable-BD_WT2MO.js → focusable-C7afHKmo.js}

@@ -1,6 +1,21 @@
 import { c as commonjsGlobal, g as getDefaultExportFromCjs } from './_commonjsHelpers-BFTU3MAI.js';
 
-var focusable = {exports: {}};
+function _mergeNamespaces(n, m) {
+  m.forEach(function (e) {
+    e && typeof e !== 'string' && !Array.isArray(e) && Object.keys(e).forEach(function (k) {
+      if (k !== 'default' && !(k in n)) {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  });
+  return Object.freeze(n);
+}
+
+var focusable$1 = {exports: {}};
 
 var focusRelevant = {exports: {}};
 
@@ -4793,7 +4808,7 @@ function requireOnlyTabbable () {
 var hasRequiredFocusable;
 
 function requireFocusable () {
-	if (hasRequiredFocusable) return focusable.exports;
+	if (hasRequiredFocusable) return focusable$1.exports;
 	hasRequiredFocusable = 1;
 	(function (module, exports) {
 
@@ -5004,11 +5019,16 @@ function requireFocusable () {
 		exports.default = isFocusable;
 		module.exports = exports['default'];
 		
-	} (focusable, focusable.exports));
-	return focusable.exports;
+	} (focusable$1, focusable$1.exports));
+	return focusable$1.exports;
 }
 
 var focusableExports = requireFocusable();
 var isFocusable = /*@__PURE__*/getDefaultExportFromCjs(focusableExports);
 
-export { isFocusable as i };
+var focusable = /*#__PURE__*/_mergeNamespaces({
+  __proto__: null,
+  default: isFocusable
+}, [focusableExports]);
+
+export { focusable as f, isFocusable as i };

package/dist/esm/{index-DmAi35UF.js → index-BbDawWJ5.js}

@@ -2,7 +2,7 @@ const NAMESPACE = 'post-components';
 const BUILD = /* post-components */ { hotModuleReplacement: false, hydratedSelectorName: "data-hydrated", lazyLoad: true, propChangeCallback: true, slotRelocation: true, state: true, updatable: true};
 
 const globalScripts = () => {};
-const globalStyles = ":where(post-accordion,post-accordion-item,post-autocomplete,post-avatar,post-back-to-top,post-banner,post-breadcrumb-item,post-breadcrumbs,post-closebutton,post-collapsible,post-collapsible-trigger,post-date-picker,post-footer,post-header,post-icon,post-language-menu,post-language-menu-item,post-linkarea,post-listbox,post-listbox-option,post-login-widget,post-logo,post-mainnavigation,post-megadropdown,post-megadropdown-trigger,post-menu,post-menu-item,post-menu-trigger,post-number-input,post-pagination,post-popover,post-popover-trigger,post-popovercontainer,post-rating,post-stepper,post-stepper-item,post-tab-item,post-tab-panel,post-tabs,post-togglebutton,post-tooltip,post-tooltip-trigger):not(:defined):not(.hydrated,[data-hydrated]){visibility:hidden}@media (scripting: none){:where(post-accordion,post-accordion-item,post-autocomplete,post-avatar,post-back-to-top,post-banner,post-breadcrumb-item,post-breadcrumbs,post-closebutton,post-collapsible,post-collapsible-trigger,post-date-picker,post-footer,post-header,post-icon,post-language-menu,post-language-menu-item,post-linkarea,post-listbox,post-listbox-option,post-login-widget,post-logo,post-mainnavigation,post-megadropdown,post-megadropdown-trigger,post-menu,post-menu-item,post-menu-trigger,post-number-input,post-pagination,post-popover,post-popover-trigger,post-popovercontainer,post-rating,post-stepper,post-stepper-item,post-tab-item,post-tab-panel,post-tabs,post-togglebutton,post-tooltip,post-tooltip-trigger):not(:defined):not(.hydrated,[data-hydrated]){visibility:visible}}post-accordion:not([multiple]):not(:has([collapsed]))>post-accordion-item~post-accordion-item{--post-collapsible-initial-height:0;--post-collapsible-initial-overflow:hidden;--post-accordion-icon-initial-transform:rotate(-180deg)}.form-label:has(+post-number-input){display:block}.form-label:has(+post-number-input.number-input-sm){padding-inline:var(--post-device-spacing-padding-2);padding-block:var(--post-device-spacing-padding-30);font-weight:var(--post-device-font-weight-bold);font-size:var(--post-device-font-size-7)}.form-label:has(+post-number-input.disabled){color:var(--post-scheme-color-interactive-input-disabled-fg)}post-number-input.form-floating>input.form-control{padding:var(--post-device-spacing-padding-block-29) var(--post-device-spacing-padding-inline-1) var(--post-device-spacing-padding-block-3)}post-number-input.form-floating>input.form-control:focus~label,post-number-input.form-floating>input.form-control:not(:placeholder-shown)~label{padding-block-start:var(--post-device-spacing-padding-block-3);padding-inline:var(--post-device-spacing-padding-inline-1) var(--post-device-spacing-padding-15);font-size:var(--post-device-font-size-10)}post-number-input.form-floating::after{width:var(--post-device-sizing-notification-1);height:var(--post-device-sizing-notification-1)}post-number-input.form-floating:has(>input.form-control.is-valid:not(:disabled))::after,post-number-input.form-floating:has(>input.form-control:-webkit-autofill.is-valid)::after,post-number-input.form-floating:has(>input.form-control.is-invalid:not(:disabled))::after,post-number-input.form-floating:has(>input.form-control:-webkit-autofill.is-invalid)::after{top:calc(var(--post-device-sizing-interactive-button-height-6) / 2);right:calc(\n      var(--post-device-spacing-padding-inline-1) +\n        (var(--post-device-spacing-padding-23)* 2) +\n        var(--post-device-sizing-interactive-icon-size6) +\n        (var(--post-device-border-width-default) * 2)\n    )}post-number-input input[type=number]{appearance:textfield}post-number-input input[type=number]::-webkit-inner-spin-button,post-number-input input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}post-login-widget>[slot=unauthenticated]{display:inline-flex;position:relative;align-items:center;justify-content:center;max-width:100%;overflow:hidden;transition:opacity 250ms,border-color 250ms,background-color 250ms,color 250ms;border-width:var(--post-device-border-width-default);border-style:solid;border-color:rgba(0,0,0,0);border-radius:var(--post-device-border-radius-round);background-color:rgba(0,0,0,0);box-shadow:none;font-family:inherit;font-weight:var(--post-device-font-weight-bold);text-decoration:none;white-space:nowrap;cursor:pointer;border:unset;font-weight:unset;display:flex;padding:.25rem .625rem;gap:.375rem;font-size:1rem;border-color:var(--post-scheme-color-interactive-button-tertiary-enabled-stroke);background-color:var(--post-scheme-color-interactive-button-tertiary-enabled-bg);color:var(--post-scheme-color-interactive-button-tertiary-enabled-fg)}post-login-widget>[slot=unauthenticated]:hover{text-decoration:none}post-login-widget>[slot=unauthenticated]:disabled{border-style:var(--post-core-border-style-dash)}post-login-widget>[slot=unauthenticated]{outline-offset:var(--post-device-spacing-padding-2) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}post-login-widget>[slot=unauthenticated]:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-login-widget>[slot=unauthenticated]:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){post-login-widget>[slot=unauthenticated]:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-login-widget>[slot=unauthenticated]:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-login-widget>[slot=unauthenticated]:is(a){color:LinkText;border:unset}post-login-widget>[slot=unauthenticated]:is(button){background-color:ButtonFace !important;border:1px solid ButtonBorder !important}post-login-widget>[slot=unauthenticated]:not(:disabled,.disabled):is(button):hover{background-color:Highlight !important}post-login-widget>[slot=unauthenticated]:not(:disabled,.disabled):is(button):hover>post-icon{color:HighlightText !important}}post-login-widget>[slot=unauthenticated]:hover{border-color:var(--post-scheme-color-interactive-button-tertiary-hover-stroke);background-color:var(--post-scheme-color-interactive-button-tertiary-hover-bg);color:var(--post-scheme-color-interactive-button-tertiary-hover-fg)}post-login-widget>[slot=unauthenticated]:is([aria-current],[aria-pressed=true],[aria-expanded=true],.active){box-shadow:var(--post-device-elevation-100);border-color:var(--post-scheme-color-interactive-button-primary-enabled-stroke);background-color:var(--post-scheme-color-interactive-button-primary-enabled-bg);color:var(--post-scheme-color-interactive-button-primary-enabled-fg)}post-login-widget>[slot=unauthenticated]:is([aria-current],[aria-pressed=true],[aria-expanded=true],.active):hover{border-color:var(--post-scheme-color-interactive-button-primary-hover-stroke);background-color:var(--post-scheme-color-interactive-button-primary-hover-bg);color:var(--post-scheme-color-interactive-button-primary-hover-fg)}post-login-widget>[slot=unauthenticated]{width:fit-content}@media screen and (min-width: 0)and (max-width: 599.98px){post-login-widget>[slot=unauthenticated]>:not(post-icon){position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}post-login-widget>[slot=unauthenticated]>post-icon{font-size:1.5rem}}post-login-widget>[slot=authenticated]>post-menu-trigger>button{border-radius:var(--post-device-border-radius-round) !important}";
+const globalStyles = ":where(post-accordion,post-accordion-item,post-autocomplete,post-avatar,post-back-to-top,post-banner,post-breadcrumb-item,post-breadcrumbs,post-closebutton,post-collapsible,post-collapsible-trigger,post-date-picker,post-footer,post-header,post-icon,post-language-menu,post-language-menu-item,post-linkarea,post-listbox,post-listbox-option,post-login-widget,post-logo,post-mainnavigation,post-megadropdown,post-megadropdown-trigger,post-menu,post-menu-item,post-menu-trigger,post-number-input,post-pagination,post-popover,post-popover-trigger,post-popovercontainer,post-progressbar,post-rating,post-stepper,post-stepper-item,post-tab-item,post-tab-panel,post-tabs,post-togglebutton,post-tooltip,post-tooltip-trigger):not(:defined):not(.hydrated,[data-hydrated]){visibility:hidden}@media (scripting: none){:where(post-accordion,post-accordion-item,post-autocomplete,post-avatar,post-back-to-top,post-banner,post-breadcrumb-item,post-breadcrumbs,post-closebutton,post-collapsible,post-collapsible-trigger,post-date-picker,post-footer,post-header,post-icon,post-language-menu,post-language-menu-item,post-linkarea,post-listbox,post-listbox-option,post-login-widget,post-logo,post-mainnavigation,post-megadropdown,post-megadropdown-trigger,post-menu,post-menu-item,post-menu-trigger,post-number-input,post-pagination,post-popover,post-popover-trigger,post-popovercontainer,post-progressbar,post-rating,post-stepper,post-stepper-item,post-tab-item,post-tab-panel,post-tabs,post-togglebutton,post-tooltip,post-tooltip-trigger):not(:defined):not(.hydrated,[data-hydrated]){visibility:visible}}post-accordion:not([multiple]):not(:has([collapsed]))>post-accordion-item~post-accordion-item{--post-collapsible-initial-height:0;--post-collapsible-initial-overflow:hidden;--post-accordion-icon-initial-transform:rotate(-180deg)}.form-label:has(+post-number-input){display:block}.form-label:has(+post-number-input.number-input-sm){padding-inline:var(--post-device-spacing-padding-2);padding-block:var(--post-device-spacing-padding-30);font-weight:var(--post-device-font-weight-bold);font-size:var(--post-device-font-size-7)}.form-label:has(+post-number-input.disabled){color:var(--post-scheme-color-interactive-input-disabled-fg)}post-number-input.form-floating>input.form-control{padding:var(--post-device-spacing-padding-block-29) var(--post-device-spacing-padding-inline-1) var(--post-device-spacing-padding-block-3)}post-number-input.form-floating>input.form-control:focus~label,post-number-input.form-floating>input.form-control:not(:placeholder-shown)~label{padding-block-start:var(--post-device-spacing-padding-block-3);padding-inline:var(--post-device-spacing-padding-inline-1) var(--post-device-spacing-padding-15);font-size:var(--post-device-font-size-10)}post-number-input.form-floating::after{width:var(--post-device-sizing-notification-1);height:var(--post-device-sizing-notification-1)}post-number-input.form-floating:has(>input.form-control.is-valid:not(:disabled))::after,post-number-input.form-floating:has(>input.form-control:-webkit-autofill.is-valid)::after,post-number-input.form-floating:has(>input.form-control.is-invalid:not(:disabled))::after,post-number-input.form-floating:has(>input.form-control:-webkit-autofill.is-invalid)::after{top:calc(var(--post-device-sizing-interactive-button-height-6) / 2);right:calc(\n      var(--post-device-spacing-padding-inline-1) +\n        (var(--post-device-spacing-padding-23)* 2) +\n        var(--post-device-sizing-interactive-icon-size6) +\n        (var(--post-device-border-width-default) * 2)\n    )}post-number-input input[type=number]{appearance:textfield}post-number-input input[type=number]::-webkit-inner-spin-button,post-number-input input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}post-login-widget>[slot=login-link]{display:inline-flex;position:relative;align-items:center;justify-content:center;max-width:100%;overflow:hidden;transition:opacity 250ms,border-color 250ms,background-color 250ms,color 250ms;border-width:var(--post-device-border-width-default);border-style:solid;border-color:rgba(0,0,0,0);border-radius:var(--post-device-border-radius-round);background-color:rgba(0,0,0,0);box-shadow:none;font-family:inherit;font-weight:var(--post-device-font-weight-bold);text-decoration:none;white-space:nowrap;cursor:pointer;border:unset;font-weight:unset;display:flex;padding:.25rem .625rem;gap:.375rem;font-size:1rem;border-color:var(--post-scheme-color-interactive-button-tertiary-enabled-stroke);background-color:var(--post-scheme-color-interactive-button-tertiary-enabled-bg);color:var(--post-scheme-color-interactive-button-tertiary-enabled-fg)}post-login-widget>[slot=login-link]:hover{text-decoration:none}post-login-widget>[slot=login-link]:disabled{border-style:var(--post-core-border-style-dash)}post-login-widget>[slot=login-link]{outline-offset:var(--post-device-spacing-padding-2) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}post-login-widget>[slot=login-link]:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-login-widget>[slot=login-link]:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){post-login-widget>[slot=login-link]:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-login-widget>[slot=login-link]:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-login-widget>[slot=login-link]:is(a){color:LinkText;border:unset}post-login-widget>[slot=login-link]:is(button){background-color:ButtonFace !important;border:1px solid ButtonBorder !important}post-login-widget>[slot=login-link]:not(:disabled,.disabled):is(button):hover{background-color:Highlight !important}post-login-widget>[slot=login-link]:not(:disabled,.disabled):is(button):hover>post-icon{color:HighlightText !important}}post-login-widget>[slot=login-link]:hover{border-color:var(--post-scheme-color-interactive-button-tertiary-hover-stroke);background-color:var(--post-scheme-color-interactive-button-tertiary-hover-bg);color:var(--post-scheme-color-interactive-button-tertiary-hover-fg)}post-login-widget>[slot=login-link]:is([aria-current],[aria-pressed=true],[aria-expanded=true],.active){box-shadow:var(--post-device-elevation-100);border-color:var(--post-scheme-color-interactive-button-primary-enabled-stroke);background-color:var(--post-scheme-color-interactive-button-primary-enabled-bg);color:var(--post-scheme-color-interactive-button-primary-enabled-fg)}post-login-widget>[slot=login-link]:is([aria-current],[aria-pressed=true],[aria-expanded=true],.active):hover{border-color:var(--post-scheme-color-interactive-button-primary-hover-stroke);background-color:var(--post-scheme-color-interactive-button-primary-hover-bg);color:var(--post-scheme-color-interactive-button-primary-hover-fg)}post-login-widget>[slot=login-link]{width:fit-content}@media screen and (min-width: 0)and (max-width: 599.98px){post-login-widget>[slot=login-link]>:not(post-icon){position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}post-login-widget>[slot=login-link]>post-icon{font-size:1.5rem}}";
 
 /*
  Stencil Client Platform v4.43.3 | MIT Licensed | https://stenciljs.com
@@ -139,10 +139,6 @@ var loadModule = (cmpMeta, hostRef, hmrVersionId) => {
           }
           switch(bundleId) {
               
-                case 'post-login-widget':
-                    return import(
-                      /* webpackMode: "lazy" */
-                      './post-login-widget.entry.js').then(processMod, consoleError);
                 case 'post-autocomplete':
                     return import(
                       /* webpackMode: "lazy" */
@@ -171,6 +167,10 @@ var loadModule = (cmpMeta, hostRef, hmrVersionId) => {
                     return import(
                       /* webpackMode: "lazy" */
                       './post-listbox-option.entry.js').then(processMod, consoleError);
+                case 'post-login-widget':
+                    return import(
+                      /* webpackMode: "lazy" */
+                      './post-login-widget.entry.js').then(processMod, consoleError);
                 case 'post-pagination':
                     return import(
                       /* webpackMode: "lazy" */
@@ -203,6 +203,10 @@ var loadModule = (cmpMeta, hostRef, hmrVersionId) => {
                     return import(
                       /* webpackMode: "lazy" */
                       './post-tab-panel.entry.js').then(processMod, consoleError);
+                case 'post-tabs':
+                    return import(
+                      /* webpackMode: "lazy" */
+                      './post-tabs.entry.js').then(processMod, consoleError);
                 case 'post-tooltip':
                     return import(
                       /* webpackMode: "lazy" */
@@ -211,22 +215,22 @@ var loadModule = (cmpMeta, hostRef, hmrVersionId) => {
                     return import(
                       /* webpackMode: "lazy" */
                       './post-tooltip-trigger.entry.js').then(processMod, consoleError);
-                case 'post-breadcrumb-item':
+                case 'post-banner':
                     return import(
                       /* webpackMode: "lazy" */
-                      './post-breadcrumb-item.entry.js').then(processMod, consoleError);
-                case 'post-avatar':
+                      './post-banner.entry.js').then(processMod, consoleError);
+                case 'post-breadcrumb-item':
                     return import(
                       /* webpackMode: "lazy" */
-                      './post-avatar.entry.js').then(processMod, consoleError);
-                case 'post-banner':
+                      './post-breadcrumb-item.entry.js').then(processMod, consoleError);
+                case 'post-progressbar':
                     return import(
                       /* webpackMode: "lazy" */
-                      './post-banner.entry.js').then(processMod, consoleError);
-                case 'post-tabs':
+                      './post-progressbar.entry.js').then(processMod, consoleError);
+                case 'post-avatar':
                     return import(
                       /* webpackMode: "lazy" */
-                      './post-tabs.entry.js').then(processMod, consoleError);
+                      './post-avatar.entry.js').then(processMod, consoleError);
                 case 'post-number-input':
                     return import(
                       /* webpackMode: "lazy" */