@baloise/ds-core 20.0.0-next.10 → 20.0.0-next.11

package/dist/esm/breakpoints.subject-CgNq7C9X.js

@@ -1,269 +0,0 @@
-/*!
- * (C) Helvetia Design System https://design.baloise.dev/ - Apache License 2.0
- */
-import { d as dsBrowser, Q as debounce, R as addEventListener, S as removeEventListener } from './index-DYOV_tWc.js';
-import { L as ListenerAbstract, S as Subject } from './listener-nZ8kL6Qe.js';
-import { d as dsDevice } from './device-ckOLnxX9.js';
-
-class WindowResizeHandler {
-    constructor(options = {}) {
-        this.previousWidth = dsBrowser.window.width;
-        this.previousHeight = dsBrowser.window.height;
-        this.previousIsLandscape = this.isLandscape;
-        this.options = {
-            onlyListenToWidthChanges: false,
-        };
-        this.options = Object.assign(Object.assign({}, this.options), options);
-    }
-    async hasResized() {
-        if (dsDevice.hasTouchScreen) {
-            if (!this.sameWidth || this.previousIsLandscape !== this.isLandscape) {
-                this.resetPreviousValues();
-                return true;
-            }
-        }
-        else {
-            if (this.options.onlyListenToWidthChanges) {
-                if (!this.sameWidth) {
-                    this.resetPreviousValues();
-                    return true;
-                }
-            }
-            else {
-                if (!this.sameWidth || !this.sameHeight) {
-                    this.resetPreviousValues();
-                    return true;
-                }
-            }
-        }
-        return false;
-    }
-    get isLandscape() {
-        return dsBrowser.window.width > dsBrowser.window.height;
-    }
-    get sameWidth() {
-        return this.previousWidth === dsBrowser.window.width;
-    }
-    get sameHeight() {
-        return this.previousHeight === dsBrowser.window.height;
-    }
-    resetPreviousValues() {
-        this.previousWidth = dsBrowser.window.width;
-        this.previousHeight = dsBrowser.window.height;
-        this.previousIsLandscape = this.isLandscape;
-    }
-}
-
-class WindowResizeListener extends ListenerAbstract {
-    constructor() {
-        super(...arguments);
-        this.resizeHandler = new WindowResizeHandler({ onlyListenToWidthChanges: true });
-        this.debouncedNotify = debounce(() => this.notify(), 100);
-        this.notify = async () => {
-            if (await this.resizeHandler.hasResized()) {
-                super.notify(undefined);
-            }
-        };
-    }
-    connect(el) {
-        super.connect(el);
-        if (this.el) {
-            addEventListener(this.el, 'resize', this.debouncedNotify, { passive: true });
-        }
-    }
-    disconnect() {
-        super.disconnect();
-        if (this.el) {
-            removeEventListener(this.el, 'resize', this.debouncedNotify);
-        }
-    }
-}
-
-/**
- * Do not edit directly, this file was auto-generated.
- */
-
-const DsAliasBreakpointTablet = 769;
-const DsAliasBreakpointDesktop = 1024;
-const DsAliasBreakpointDesktopLg = 1280;
-const DsAliasBreakpointDesktopXl = 1440;
-const DsAliasBreakpointDesktop2Xl = 1920;
-const DsComponentLogoColorPrimary = "#000d6e";
-const DsComponentLogoColorInverted = "#ffffff";
-const DsComponentLogoSizeBaseMobile = 24;
-const DsComponentLogoSizeBaseDesktop = 32;
-const DsComponentLogoSizeSmMobile = 24;
-const DsComponentLogoSizeSmDesktop = 24;
-const DsComponentLogoSizeLgMobile = 32;
-const DsComponentLogoSizeLgDesktop = 48;
-
-const breakpointTablet = DsAliasBreakpointTablet;
-const breakpointDesktop = DsAliasBreakpointDesktop;
-const breakpointDesktopLg = DsAliasBreakpointDesktopLg;
-const breakpointDesktopXl = DsAliasBreakpointDesktopXl;
-const breakpointDesktop2Xl = DsAliasBreakpointDesktop2Xl;
-const isMobile = (win) => {
-    const width = win.innerWidth;
-    return width < breakpointTablet;
-};
-const isTablet = (win) => {
-    const width = win.innerWidth;
-    return width >= breakpointTablet && width < breakpointDesktop;
-};
-const isTouch = (win) => isMobile(win) || isTablet(win);
-const isDesktop = (win) => !isTouch(win);
-const isDesktopLg = (win) => {
-    const width = win.innerWidth;
-    return width >= breakpointDesktopLg && width < breakpointDesktopXl;
-};
-const isDesktopXl = (win) => {
-    const width = win.innerWidth;
-    return width >= breakpointDesktopXl && width < breakpointDesktop2Xl;
-};
-const isDesktop2Xl = (win) => {
-    const width = win.innerWidth;
-    return width >= breakpointDesktop2Xl;
-};
-const BREAKPOINTS_MAP = {
-    mobile: isMobile,
-    tablet: isTablet,
-    touch: isTouch,
-    desktop: isDesktop,
-    desktopLg: isDesktopLg,
-    desktopXl: isDesktopXl,
-    desktop2Xl: isDesktop2Xl,
-};
-
-class DsBreakpointsUtil {
-    constructor() {
-        this.breakpoints = [];
-        if (dsBrowser.hasWindow) {
-            this.win = window;
-            this.win.DesignSystem = this.win.DesignSystem || {};
-            this.detect();
-        }
-    }
-    /**
-     * Is true when mobile breakpoint is active
-     */
-    get isMobile() {
-        return this.includes('mobile');
-    }
-    /**
-     * Is true when tablet breakpoint is active
-     */
-    get isTablet() {
-        return this.includes('tablet');
-    }
-    /**
-     * Is true when mobile or tablet breakpoint is active
-     */
-    get isTouch() {
-        return this.includes('touch');
-    }
-    /**
-     * Is true when desktop, desktopLg, desktopXl or desktop2Xl breakpoint is active
-     */
-    get isDesktop() {
-        return this.includes('desktop');
-    }
-    /**
-     * Is true when desktopLg breakpoint is active
-     */
-    get isDesktopLg() {
-        return this.includes('desktopLg');
-    }
-    /**
-     * Is true when desktopXl breakpoint is active
-     */
-    get isDesktopXl() {
-        return this.includes('desktopXl');
-    }
-    /**
-     * Is true when desktop2Xl breakpoint is active
-     */
-    get isDesktop2Xl() {
-        return this.includes('desktop2Xl');
-    }
-    /**
-     * Verifies if given breakpoint is active
-     * @param breakpoint
-     * @returns boolean: True if breakpoint is active
-     */
-    includes(breakpoint) {
-        var _a;
-        this.detect();
-        return !!((_a = this.breakpoints) === null || _a === void 0 ? void 0 : _a.includes(breakpoint));
-    }
-    /**
-     * Detects breakpoints and updates state
-     * @returns breakpoints: list of breakpoints which are active
-     */
-    detect() {
-        if (this.win) {
-            this.breakpoints = Object.keys(BREAKPOINTS_MAP).filter(p => BREAKPOINTS_MAP[p](this.win));
-            this.win.DesignSystem.breakpoints = this.breakpoints;
-            this.win.DesignSystem.platforms = this.breakpoints;
-        }
-        return this.breakpoints;
-    }
-    /**
-     * Turns the breakpoints array to a object.
-     * @returns Object with all the breakpoints
-     */
-    toObject() {
-        return {
-            mobile: this.breakpoints.includes('mobile'),
-            tablet: this.breakpoints.includes('tablet'),
-            touch: this.breakpoints.includes('touch'),
-            desktop: this.breakpoints.includes('desktop'),
-            desktopLg: this.breakpoints.includes('desktopLg'),
-            desktopXl: this.breakpoints.includes('desktopXl'),
-            desktop2Xl: this.breakpoints.includes('desktop2Xl'),
-        };
-    }
-}
-const dsBreakpoints = /*@__PURE__*/ new DsBreakpointsUtil();
-
-const initialBreakpoints = {
-    mobile: false,
-    tablet: false,
-    touch: false,
-    desktop: false,
-    desktopLg: false,
-    desktopXl: false,
-    desktop2Xl: false,
-};
-
-class DsBreakpointSubject extends Subject {
-    constructor() {
-        super(observer => observer.listenToBreakpoint(this.state));
-        this.state = initialBreakpoints;
-        this.listener = new WindowResizeListener();
-        this.debouncedNotify = debounce(() => this.notify(), 50);
-        this.listener.connect();
-        this.listener.add(() => {
-            dsBreakpoints.detect();
-            const newState = dsBreakpoints.toObject();
-            if (!this.isEqual(newState)) {
-                this.state = newState;
-                this.debouncedNotify();
-            }
-        });
-    }
-    attach(observer) {
-        super.attach(observer);
-        dsBreakpoints.detect();
-        const newState = dsBreakpoints.toObject();
-        if (!this.isEqual(newState)) {
-            this.state = newState;
-            this.debouncedNotify();
-        }
-    }
-    isEqual(newState) {
-        return JSON.stringify(this.state) === JSON.stringify(newState);
-    }
-}
-const dsBreakpointSubject = new DsBreakpointSubject();
-
-export { DsBreakpointSubject as D, WindowResizeListener as W, dsBreakpointSubject as a, DsBreakpointsUtil as b, DsComponentLogoColorInverted as c, dsBreakpoints as d, DsComponentLogoColorPrimary as e, DsComponentLogoSizeSmMobile as f, DsComponentLogoSizeSmDesktop as g, DsComponentLogoSizeLgMobile as h, initialBreakpoints as i, DsComponentLogoSizeLgDesktop as j, DsComponentLogoSizeBaseMobile as k, DsComponentLogoSizeBaseDesktop as l };

package/dist/esm/config.utils-CB-CXrKY.js

@@ -1,129 +0,0 @@
-/*!
- * (C) Helvetia Design System https://design.baloise.dev/ - Apache License 2.0
- */
-import { d as dsBrowser } from './index-DYOV_tWc.js';
-
-function ListenToConfig() {
-    return function (target, _propertyKey, _descriptor) {
-        const { connectedCallback, disconnectedCallback } = target;
-        target.connectedCallback = function () {
-            attachComponentToConfig(this);
-            return connectedCallback && connectedCallback.call(this);
-        };
-        target.disconnectedCallback = function () {
-            detachComponentFromConfig(this);
-            return disconnectedCallback && disconnectedCallback.call(this);
-        };
-    };
-}
-
-const onDsConfigChange = (callback) => {
-    attachToConfig({
-        configChanged(state) {
-            callback(state);
-        },
-    });
-};
-const useDsConfig = () => {
-    if (!dsBrowser.hasWindow) {
-        return undefined;
-    }
-    const win = window;
-    return win && win.DesignSystem && win.DesignSystem.config;
-};
-const attachToConfig = (observer) => {
-    const config = useDsConfig();
-    if (config) {
-        config.attach(observer);
-    }
-};
-const detachFromConfig = (observer) => {
-    const config = useDsConfig();
-    if (config) {
-        config.detach(observer);
-    }
-};
-const attachComponentToConfig = (observer) => {
-    const config = useDsConfig();
-    if (config) {
-        config.attachComponent(observer);
-    }
-};
-const detachComponentFromConfig = (observer) => {
-    const config = useDsConfig();
-    if (config) {
-        config.detachComponent(observer);
-    }
-};
-const updateDsBrand = (brand) => {
-    const config = useDsConfig();
-    if (config) {
-        config.brand = brand;
-    }
-};
-const updateDsLanguage = (language) => {
-    const config = useDsConfig();
-    if (config) {
-        config.language = language;
-    }
-};
-const updateDsFallbackLanguage = (fallbackLanguage) => {
-    const config = useDsConfig();
-    if (config) {
-        config.fallbackLanguage = fallbackLanguage;
-    }
-};
-const updateDsRegion = (region) => {
-    const config = useDsConfig();
-    if (config) {
-        config.region = region;
-    }
-};
-const updateDsAllowedLanguages = (allowedLanguages) => {
-    const config = useDsConfig();
-    if (config) {
-        config.allowedLanguages = allowedLanguages;
-    }
-};
-const updateDsIcons = (icons) => {
-    const config = useDsConfig();
-    if (config) {
-        config.icons = Object.assign(Object.assign({}, config.icons), icons);
-    }
-};
-const updateDsAnimated = (animated) => {
-    const config = useDsConfig();
-    if (config) {
-        config.animated = animated;
-    }
-};
-const updateDsLogger = (components) => {
-    const config = useDsConfig();
-    if (config) {
-        config.logger.components = components;
-        config.logger.render = true;
-        config.logger.custom = true;
-        config.logger.event = true;
-        config.logger.lifecycle = true;
-    }
-};
-const updateDsLegalLinks = (legalLinks) => {
-    const config = useDsConfig();
-    if (config) {
-        config.legalLinks = legalLinks;
-    }
-};
-const updateDsLegalText = (legalText) => {
-    const config = useDsConfig();
-    if (config) {
-        config.legalText = legalText;
-    }
-};
-const updateDsSocialLinks = (socialLinks) => {
-    const config = useDsConfig();
-    if (config) {
-        config.socialLinks = socialLinks;
-    }
-};
-
-export { ListenToConfig as L, attachToConfig as a, attachComponentToConfig as b, detachComponentFromConfig as c, detachFromConfig as d, updateDsBrand as e, updateDsLanguage as f, updateDsFallbackLanguage as g, updateDsRegion as h, updateDsAllowedLanguages as i, updateDsIcons as j, updateDsAnimated as k, updateDsLogger as l, updateDsLegalLinks as m, updateDsLegalText as n, onDsConfigChange as o, updateDsSocialLinks as p, useDsConfig as u };

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

@@ -1,208 +0,0 @@
-/*!
- * (C) Helvetia Design System https://design.baloise.dev/ - Apache License 2.0
- */
-import { I as getElement } from './index-DYOV_tWc.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());
-}
-/**
- * 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 };

package/dist/esm/device-ckOLnxX9.js

@@ -1,54 +0,0 @@
-/*!
- * (C) Helvetia Design System https://design.baloise.dev/ - Apache License 2.0
- */
-import { d as dsBrowser } from './index-DYOV_tWc.js';
-
-class DsOrientation {
-    /**
-     * Is true when the orientation is in portrait mode
-     */
-    get isPortrait() {
-        if (dsBrowser.hasWindow && window.matchMedia) {
-            return window.matchMedia('(orientation: portrait)').matches;
-        }
-        return false;
-    }
-    /**
-     * Is true when the orientation is in landscape mode
-     */
-    get isLandscape() {
-        if (dsBrowser.hasWindow && window.matchMedia) {
-            return window.matchMedia('(orientation: landscape)').matches;
-        }
-        return true;
-    }
-    toObject() {
-        return {
-            landscape: this.isLandscape,
-            portrait: this.isPortrait,
-        };
-    }
-}
-class DsDevice {
-    constructor() {
-        this.orientation = new DsOrientation();
-    }
-    /**
-     * Is true if it is a native mobile device like a iPhone
-     */
-    get isMobile() {
-        return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|OperaMini/i.test(dsBrowser.userAgent);
-    }
-    /**
-     * Is true if the device supports touchscreen
-     */
-    get hasTouchScreen() {
-        if (dsBrowser.hasWindow && dsBrowser.hasNavigator) {
-            return !!('ontouchstart' in window || navigator.msMaxTouchPoints);
-        }
-        return false;
-    }
-}
-const dsDevice = new DsDevice();
-
-export { DsDevice as D, dsDevice as d };

package/dist/esm/field.util-OTyuJ6iL.js

@@ -1,17 +0,0 @@
-/*!
- * (C) Helvetia Design System https://design.baloise.dev/ - Apache License 2.0
- */
-import { F as h, G as Host } from './index-DYOV_tWc.js';
-import { a as ariaBooleanToString } from './aria-DYfTMCkl.js';
-import { I as I18nDsLabel } from './label.i18n-C7I7OlaM.js';
-
-const Field = (props, children) => {
-    var _a;
-    const inputId = (_a = props.inputId) !== null && _a !== void 0 ? _a : 'input';
-    const role = props.role === 'fieldset' ? 'group' : undefined;
-    const RoleTag = props.role === 'fieldset' ? 'fieldset' : 'div';
-    return (h(Host, { class: Object.assign({ 'ds-field ': true, 'is-disabled': !!props.disabled, 'is-danger': props.color === 'danger' || !!props.invalid, 'is-success': props.color === 'success' && !props.invalid, 'is-warning': props.color === 'warning' && !props.invalid }, props.cssClasses) }, h(RoleTag, { id: "inner", part: "inner", role: role, "aria-disabled": ariaBooleanToString(props.disabled), "aria-invalid": ariaBooleanToString(props.invalid), "aria-labelledby": "label", "aria-describedby": "description", onClick: (ev) => { var _a; return (_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, ev); } }, props.label &&
-        (props.role === 'fieldset' ? (h("legend", { part: "label", id: "label" }, h("slot", { name: "label" }, props.label), !props.required && h("span", null, I18nDsLabel[props.language].optional || ''))) : (h("label", { htmlFor: inputId, part: "label", id: "label" }, h("slot", { name: "label" }, props.label), !props.required && h("span", null, I18nDsLabel[props.language].optional || '')))), h("div", { id: "container", part: "control" }, h("slot", { name: "start" }), children, h("slot", { name: "end" }), props.loading === true && (h("ds-spinner", { size: "sm", variation: "circle", color: props.disabled ? 'inverted' : 'primary' }))), props.label && (h("span", { id: "description", part: "description", role: props.invalid && props.invalidText ? 'alert' : undefined }, props.invalid && props.invalidText && h("ds-icon", { name: "alert" }), props.invalid ? (h("slot", { name: "invalid-text" }, props.invalidText || props.description)) : (h("slot", { name: "description" }, props.description)))))));
-};
-
-export { Field as F };