@rededor/cura 1.0.0 → 1.2.0-alpha.0

package/dist/esm/cura-input-date.entry.js

@@ -0,0 +1,184 @@
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-747aad85.js';
+import { i as isBefore, a as isAfter } from './index-fbee309a.js';
+
+const curaInputDateCss = ":host{display:block}.container{display:flex;flex-direction:column}.container .calendar{padding:0px calc(var(--base-spacing) * 3px);margin-top:-8px;border-radius:0px 0px 4px 4px;border-top:0px;border-right:2px solid #D4D4D4;border-bottom:2px solid #D4D4D4;border-left:2px solid #D4D4D4;box-shadow:0px 4px 8px 0px var(--neutral-black-shadow, rgba(38, 38, 38, 0.16))}";
+const CuraInputDateStyle0 = curaInputDateCss;
+
+const CuraInputDate = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.dateChange = createEvent(this, "dateChange", 7);
+        this.label = '';
+        this.status = 'default';
+        this.size = 'medium';
+        this.name = '';
+        this.helperText = undefined;
+        this.enableRangeDates = undefined;
+        this.disableFutureDates = undefined;
+        this.disablePassDates = undefined;
+        this.iconName = '';
+        this.placeholder = null;
+        this.styles = {};
+        this.isCalendarVisible = false;
+        this.dates = [];
+        this.value = '';
+    }
+    connectedCallback() {
+        const weights = window.CuraAPI.theme.fonts.getWeights();
+        this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();
+        this.styles['--neutral-purewhite'] = window.CuraAPI.theme.colors.getColor(`neutral-purewhite`);
+        this.styles['--neutral-lighter'] = window.CuraAPI.theme.colors.getColor(`neutral-lighter`);
+        this.styles['--neutral-base'] = window.CuraAPI.theme.colors.getColor(`neutral-base`);
+        this.styles['--font-size'] = window.CuraAPI.theme.fonts.getSize();
+        this.styles['--font-color'] = window.CuraAPI.theme.fonts.getColor();
+        this.styles['--font-family'] = window.CuraAPI.theme.fonts.getFamily();
+        this.styles['--font-weight-regular'] = weights.regular;
+    }
+    /**
+     * Callback for form association
+     */
+    formAssociatedCallback(form) {
+        form.ariaLabel = this.label;
+    }
+    /**
+     * Formats the placeholder based on the enableRangeDates flag
+     *
+     * @returns {string} A string representing the placeholder format,
+     * either for a date range ('dd/mm/yyyy - dd/mm/yyyy') or a single date ('dd/mm/yyyy')
+     */
+    setPlaceholder() {
+        if (this.placeholder) {
+            return this.placeholder;
+        }
+        return this.enableRangeDates ? 'dd/mm/aaaa - dd/mm/aaaa' : 'dd/mm/aaaa';
+    }
+    /**
+     * Sets the mask type based on the enableRangeDates flag
+     *
+     * @returns {string} The mask type, either 'dateRange' or 'date'
+     */
+    setMask() {
+        return this.enableRangeDates ? 'dateRange' : 'date';
+    }
+    /**
+     * Sets the mode type based on the enableRangeDates flag
+     *
+     * @returns {'range' | 'single'}
+     */
+    setMode() {
+        return this.enableRangeDates ? 'range' : 'single';
+    }
+    handleClick(ev) {
+        if (this.el.contains(ev.target)) {
+            return;
+        }
+        this.hideCalendar();
+    }
+    hideCalendar() {
+        this.isCalendarVisible = false;
+    }
+    showCalendar() {
+        this.isCalendarVisible = true;
+    }
+    handleInputDates(event) {
+        const inputValue = event.target.value;
+        const dateRangeRegex = /^(\d{2}\/\d{2}\/\d{4})\s*-\s*(\d{2}\/\d{2}\/\d{4})$/;
+        const simpleDateRegex = /^(\d{2}\/\d{2}\/\d{4})$/;
+        if (dateRangeRegex.test(inputValue)) {
+            const matches = inputValue.match(dateRangeRegex);
+            const startDate = this.parseStringToDate(matches[1]);
+            const endDate = this.parseStringToDate(matches[2]);
+            if (this.isDateValid(startDate) && this.isDateValid(endDate)) {
+                this.status = 'default';
+                this.dates = [startDate, endDate];
+                this.value = `${this.parseDateToString(startDate)} - ${this.parseDateToString(endDate)}`;
+                this.dateChange.emit(this.value);
+            }
+            else {
+                this.status = 'error';
+                this.dates = [];
+            }
+        }
+        else if (simpleDateRegex.test(inputValue)) {
+            const matches = inputValue.match(simpleDateRegex);
+            const singleDate = this.parseStringToDate(matches[1]);
+            if (this.isDateValid(singleDate)) {
+                this.status = 'default';
+                this.dates = [singleDate];
+                this.value = this.parseDateToString(singleDate);
+                this.dateChange.emit(this.value);
+            }
+            else {
+                this.status = 'error';
+                this.dates = [];
+            }
+        }
+        else {
+            this.dates = [];
+        }
+    }
+    handleChangeDates(event) {
+        if (event.detail === '') {
+            this.dates = [];
+            this.status = 'default';
+            this.value = '';
+            this.dateChange.emit(this.value);
+        }
+    }
+    isDateValid(date) {
+        const today = new Date();
+        today.setHours(0, 0, 0, 0);
+        if (this.disablePassDates)
+            return !isBefore(date, today);
+        if (this.disableFutureDates)
+            return !isAfter(date, today);
+        return true;
+    }
+    parseStringToDate(dateString) {
+        const [day, month, year] = dateString.split('/').map(Number);
+        return new Date(year, month - 1, day);
+    }
+    parseDateToString(date) {
+        const day = String(date.getDate()).padStart(2, '0');
+        const month = String(date.getMonth() + 1).padStart(2, '0');
+        const year = date.getFullYear();
+        return `${day}/${month}/${year}`;
+    }
+    renderCalendarOrHelperText() {
+        if (this.isCalendarVisible) {
+            return (h("div", { class: "calendar" }, h("cura-calendar", { customDates: this.dates, mode: this.setMode(), width: "100%", embedded: false, floating: false, disableFutureDates: this.disableFutureDates, disablePassDates: this.disablePassDates, onOnchangeday: e => {
+                    const days = e.detail.days;
+                    if (days.length === 1) {
+                        this.value = this.parseDateToString(days[0]);
+                    }
+                    else if (days.length > 0) {
+                        this.value = `${this.parseDateToString(days[0])} - ${this.parseDateToString(days[days.length - 1])}`;
+                    }
+                    else {
+                        this.value = '';
+                    }
+                    this.dateChange.emit(this.value);
+                } })));
+        }
+        else {
+            return this.helperText;
+        }
+    }
+    render() {
+        return (h(Host, { key: '8bf7141427b370ea271d2f589c26060111862f79' }, h("div", { key: '5c955bf76f93912512bbf18887db5305e6772faa', class: "container", style: this.styles }, h("cura-input-text", { key: 'a8c3ff65ca54123d0f7612f61e06e44275047961', label: this.label, name: this.name, status: this.status, value: this.value, onFocus: () => this.showCalendar(), size: this.size, iconName: this.iconName, placeholder: this.setPlaceholder(), "mask-preset": this.setMask(), "enable-selection-mode": true, onKeyUp: event => this.handleInputDates(event), autocomplete: "off", onValueChange: event => this.handleChangeDates(event) }, this.renderCalendarOrHelperText()))));
+    }
+    static get formAssociated() { return true; }
+    get el() { return getElement(this); }
+    static get watchers() { return {
+        "enableRangeDates": ["setPlaceholder", "setMask", "setMode"],
+        "disableFutureDates": ["isDateValid", "renderCalendarOrHelperText"],
+        "disablePassDates": ["isDateValid"],
+        "dates": ["renderCalendarOrHelperText"],
+        "isCalendarVisible": ["renderCalendarOrHelperText"]
+    }; }
+};
+CuraInputDate.style = CuraInputDateStyle0;
+
+export { CuraInputDate as cura_input_date };
+
+//# sourceMappingURL=cura-input-date.entry.js.map

package/dist/esm/cura-input-date.entry.js.map

@@ -0,0 +1 @@
+{"file":"cura-input-date.entry.js","mappings":"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","names":[],"sources":["src/components/forms/cura-input-date/cura-input-date.scss?tag=cura-input-date&encapsulation=shadow","src/components/forms/cura-input-date/cura-input-date.tsx"],"sourcesContent":["@import '../../../../src/scss/mixins/shadows.scss';\n@import '../../../../src/scss/mixins/spacing.scss';\n\n:host {\n  display: block;\n}\n\n.container{\n  display: flex;\n  flex-direction: column;\n\n  .calendar{\n    padding: #{$spacing-none} #{$spacing-xxxs};\n    margin-top: -8px;\n    border-radius: 0px 0px 4px 4px;\n    border-top: 0px;\n    border-right: 2px solid #D4D4D4;\n    border-bottom:2px solid #D4D4D4;\n    border-left: 2px solid #D4D4D4;\n    @include shadow-level3(--neutral-black-shadow);\n  }\n}\n","import { Component, Element, Host, Listen, Prop, State, Watch, h, Event, EventEmitter } from '@stencil/core';\nimport { CuraInputTextCustomEvent } from '../../../components';\nimport { isAfter, isBefore } from 'date-fns';\n\n@Component({\n  tag: 'cura-input-date',\n  styleUrl: 'cura-input-date.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class CuraInputDate {\n  @Element() el: HTMLElement;\n\n  /**\n   * Label text for the input date\n   */\n  @Prop({ reflect: true }) label?: string = '';\n\n  /**\n   * Indicates input status (default: default)\n   */\n  @Prop({ reflect: true, mutable: true }) status: 'error' | 'success' | 'default' = 'default';\n\n  /**\n   * Size of the input mode default: 'small', 'medium', or 'large' (default: 'medium')\n   */\n  @Prop({ reflect: true, mutable: true }) size: 'small' | 'medium' | 'large' = 'medium';\n\n  /**\n   * Name text for the input date\n   */\n  @Prop({ reflect: true }) name?: string = '';\n\n  /**\n   * Helper text displayed below the input\n   */\n  @Prop({ reflect: true, mutable: true }) helperText?: string;\n\n  /**\n   * Enables the date range selection mode, allowing users to select a period of dates\n   */\n  @Prop({ reflect: true, mutable: true }) enableRangeDates: boolean;\n\n  /**\n   * Controls whether future dates (dates before the current date) should be disabled\n   */\n  @Prop({ reflect: true, mutable: true }) disableFutureDates: boolean;\n\n  /**\n   * Controls whether past dates (dates before the current date) should be disabled\n   */\n  @Prop({ reflect: true, mutable: true }) disablePassDates: boolean;\n\n  /**\n   * Whether to display a cura icon (default: null)\n   */\n  @Prop({ reflect: true, mutable: true }) iconName?: string = '';\n\n  /**\n   * Placeholder text for the input\n   */\n  @Prop({ reflect: true }) placeholder?: string | null = null;\n\n  /**\n   * Emitted when the value of the input changes\n   * @type {EventEmitter<string>}\n   */\n  @Event() dateChange: EventEmitter<string>;\n\n  @State() styles = {};\n\n  @State() isCalendarVisible: boolean = false;\n\n  @State() dates: Date[] = [];\n\n  @State() value?: string = '';\n\n  connectedCallback() {\n    const weights = window.CuraAPI.theme.fonts.getWeights();\n    this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();\n    this.styles['--neutral-purewhite'] = window.CuraAPI.theme.colors.getColor(`neutral-purewhite`);\n    this.styles['--neutral-lighter'] = window.CuraAPI.theme.colors.getColor(`neutral-lighter`);\n    this.styles['--neutral-base'] = window.CuraAPI.theme.colors.getColor(`neutral-base`);\n    this.styles['--font-size'] = window.CuraAPI.theme.fonts.getSize();\n    this.styles['--font-color'] = window.CuraAPI.theme.fonts.getColor();\n    this.styles['--font-family'] = window.CuraAPI.theme.fonts.getFamily();\n    this.styles['--font-weight-regular'] = weights.regular;\n  }\n\n  /**\n   * Callback for form association\n   */\n  formAssociatedCallback(form: { ariaLabel: string }) {\n    form.ariaLabel = this.label;\n  }\n\n  /**\n   * Formats the placeholder based on the enableRangeDates flag\n   *\n   * @returns {string} A string representing the placeholder format,\n   * either for a date range ('dd/mm/yyyy - dd/mm/yyyy') or a single date ('dd/mm/yyyy')\n   */\n  @Watch('enableRangeDates')\n  setPlaceholder(): string {\n    if (this.placeholder) {\n      return this.placeholder;\n    }\n    return this.enableRangeDates ? 'dd/mm/aaaa - dd/mm/aaaa' : 'dd/mm/aaaa';\n  }\n\n  /**\n   * Sets the mask type based on the enableRangeDates flag\n   *\n   * @returns {string} The mask type, either 'dateRange' or 'date'\n   */\n  @Watch('enableRangeDates')\n  setMask(): string {\n    return this.enableRangeDates ? 'dateRange' : 'date';\n  }\n\n  /**\n   * Sets the mode type based on the enableRangeDates flag\n   *\n   * @returns {'range' | 'single'}\n   */\n  @Watch('enableRangeDates')\n  setMode(): 'range' | 'single' {\n    return this.enableRangeDates ? 'range' : 'single';\n  }\n\n  @Listen('click', { target: 'window' })\n  handleClick(ev: { target: Node }) {\n    if (this.el.contains(ev.target)) {\n      return;\n    }\n    this.hideCalendar();\n  }\n\n  hideCalendar() {\n    this.isCalendarVisible = false;\n  }\n\n  showCalendar() {\n    this.isCalendarVisible = true;\n  }\n\n  handleInputDates(event: any) {\n    const inputValue = event.target.value;\n\n    const dateRangeRegex = /^(\\d{2}\\/\\d{2}\\/\\d{4})\\s*-\\s*(\\d{2}\\/\\d{2}\\/\\d{4})$/;\n    const simpleDateRegex = /^(\\d{2}\\/\\d{2}\\/\\d{4})$/;\n\n    if (dateRangeRegex.test(inputValue)) {\n      const matches = inputValue.match(dateRangeRegex);\n      const startDate = this.parseStringToDate(matches[1]);\n      const endDate = this.parseStringToDate(matches[2]);\n      if (this.isDateValid(startDate) && this.isDateValid(endDate)) {\n        this.status = 'default';\n        this.dates = [startDate, endDate];\n        this.value = `${this.parseDateToString(startDate)} - ${this.parseDateToString(endDate)}`;\n        this.dateChange.emit(this.value);\n      } else {\n        this.status = 'error';\n        this.dates = [];\n      }\n    } else if (simpleDateRegex.test(inputValue)) {\n      const matches = inputValue.match(simpleDateRegex);\n      const singleDate = this.parseStringToDate(matches[1]);\n      if (this.isDateValid(singleDate)) {\n        this.status = 'default';\n        this.dates = [singleDate];\n        this.value = this.parseDateToString(singleDate);\n        this.dateChange.emit(this.value);\n      } else {\n        this.status = 'error';\n        this.dates = [];\n      }\n    } else {\n      this.dates = [];\n    }\n  }\n\n  handleChangeDates(event: CuraInputTextCustomEvent<string | number>) {\n    if (event.detail === '') {\n      this.dates = [];\n      this.status = 'default';\n      this.value = '';\n      this.dateChange.emit(this.value);\n    }\n  }\n\n  @Watch('disableFutureDates')\n  @Watch('disablePassDates')\n  isDateValid(date: Date) {\n    const today = new Date();\n    today.setHours(0, 0, 0, 0);\n\n    if (this.disablePassDates) return !isBefore(date, today);\n    if (this.disableFutureDates) return !isAfter(date, today);\n    return true;\n  }\n\n  parseStringToDate(dateString: string): Date {\n    const [day, month, year] = dateString.split('/').map(Number);\n    return new Date(year, month - 1, day);\n  }\n\n  parseDateToString(date: Date): string {\n    const day = String(date.getDate()).padStart(2, '0');\n    const month = String(date.getMonth() + 1).padStart(2, '0');\n    const year = date.getFullYear();\n\n    return `${day}/${month}/${year}`;\n  }\n\n  @Watch('dates')\n  @Watch('isCalendarVisible')\n  @Watch('disableFutureDates')\n  renderCalendarOrHelperText() {\n    if (this.isCalendarVisible) {\n      return (\n        <div class=\"calendar\">\n          <cura-calendar\n            customDates={this.dates}\n            mode={this.setMode()}\n            width=\"100%\"\n            embedded={false}\n            floating={false}\n            disableFutureDates={this.disableFutureDates}\n            disablePassDates={this.disablePassDates}\n            onOnchangeday={e => {\n              const days = e.detail.days;\n              if (days.length === 1) {\n                this.value = this.parseDateToString(days[0]);\n              } else if (days.length > 0) {\n                this.value = `${this.parseDateToString(days[0])} - ${this.parseDateToString(days[days.length - 1])}`;\n              } else {\n                this.value = '';\n              }\n              this.dateChange.emit(this.value);\n            }}\n          />\n        </div>\n      );\n    } else {\n      return this.helperText;\n    }\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class=\"container\" style={this.styles}>\n          <cura-input-text\n            label={this.label}\n            name={this.name}\n            status={this.status}\n            value={this.value}\n            onFocus={() => this.showCalendar()}\n            size={this.size}\n            iconName={this.iconName}\n            placeholder={this.setPlaceholder()}\n            mask-preset={this.setMask()}\n            enable-selection-mode={true}\n            onKeyUp={event => this.handleInputDates(event)}\n            autocomplete=\"off\"\n            onValueChange={event => this.handleChangeDates(event)}\n          >\n            {this.renderCalendarOrHelperText()}\n          </cura-input-text>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/cura-loader-bar.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host, g as getElement } from './index-1ad98520.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-747aad85.js';
 
 const curaLoaderBarCss = ":host{display:block}:host .progress-bar{position:absolute;left:0;bottom:0;width:100%;height:4px;background-color:var(--neutral-base)}:host .progress-bar span{position:absolute;left:0;bottom:0;width:var(--bar-width);height:100%;border-radius:0 2px 2px 0;background-color:var(--color-base);transition:width 0.2s linear}";
 const CuraLoaderBarStyle0 = curaLoaderBarCss;
@@ -21,7 +21,7 @@ const CuraLoaderBar = class {
         this.setProgress();
     }
     render() {
-        return (h(Host, { key: 'e8c5cf2c47e5b8a1a3e0ea758df9a5183b94afbe' }, h("div", { key: '4375509425a0f7f8a86ded54c792f04d8b34d004', id: "progress-bar", class: "progress-bar", style: this.styles }, h("span", { key: '2d78b8f09726918cb01ef2ba775cf061f8b1fbab', class: "progress-bar-fill" }))));
+        return (h(Host, { key: 'c98e1e2e370b5fadc87eb960d030324e36acd250' }, h("div", { key: '39dac6c361361e840305e15d6bf4ff09cfa3380e', id: "progress-bar", class: "progress-bar", style: this.styles }, h("span", { key: 'b501bd4846993c62a246a5891b9650faaca89c32', class: "progress-bar-fill" }))));
     }
     setColor() {
         this.styles = Object.assign(Object.assign({}, this.styles), { '--neutral-base': window.CuraAPI.theme.colors.getColor(`neutral-base`, 0.2), '--color-base': window.CuraAPI.theme.colors.getColor(this.color) });

package/dist/esm/cura-radio.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-1ad98520.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-747aad85.js';
 import { f as formsSizes } from './cura-forms.definitions-2f963167.js';
 
 const curaRadioCss = "@charset \"UTF-8\";:host{display:block;width:fit-content;box-sizing:border-box;}:host .container{display:flex;align-items:center;flex-direction:row-reverse;gap:var(--gap)}:host .position.container{flex-direction:row}:host .position .label-wrapper{justify-content:end}:host .position .message{text-align:right}:host .position .label{order:1}:host .info{display:flex;flex-direction:column}:host .label-wrapper{display:flex;justify-content:start;align-items:center;gap:5px}:host .control{width:fit-content;cursor:pointer;position:relative}:host .radio{margin:0;appearance:none;-webkit-appearance:none;-moz-appearance:none;border-radius:50%;border:2px solid var(--primary-base-neutral-medium);background:var(--neutral-purewhite);box-sizing:border-box;transition:border-color 0.3s;position:relative;display:flex;align-items:center;justify-content:center;cursor:pointer;width:var(--size);height:var(--size);flex:0 0 var(--size)}:host .radio::after{content:\"\";background:var(--color-base-light);border-radius:50%;opacity:0;transition:opacity 0.3s;width:var(--size-after);height:var(--size-after)}:host .radio:focus{border-color:var(--info-base) !important}:host .success .radio{border-color:var(--success-base);background:var(--success-lighter)}:host .success .radio:hover{border-color:var(--success-base) !important}:host .success.checked .radio{border-color:var(--success-base)}:host .success.checked .radio::after{background:var(--success-base)}:host .success.checked .radio:hover{background:var(--success-lighter) !important;border-color:var(--success-base) !important}:host .success.checked .radio:hover::after{background:var(--success-base) !important}:host .error .radio{border-color:var(--error-base);background:var(--error-lighter)}:host .error .radio:hover{border-color:var(--error-base) !important}:host .error.checked .radio{border-color:var(--error-base)}:host .error.checked .radio::after{background:var(--error-base)}:host .error.checked .radio:hover{background:var(--error-lighter) !important;border-color:var(--error-base) !important}:host .error.checked .radio:hover::after{background:var(--error-base) !important}:host .checked .radio::after{opacity:1;background:var(--color-base)}:host .checked .radio{border-color:var(--color-dark)}:host .checked .radio:hover{border-color:var(--color-light) !important}:host .checked .radio:hover::after{background:var(--color-light)}:host .disabled .radio{background:var(--primary-base-neutral-white);border-color:var(--primary-darker-neutral-base);cursor:not-allowed}:host .disabled .radio::after{background:var(--neutral-lighter)}:host .disabled.checked .radio{border-color:var(--primary-base-neutral-base) !important;background:var(--primary-darker-neutral-white) !important}:host .disabled.checked .radio::after{background:var(--primary-base-neutral-base) !important}:host :not(.disabled):not(.checked) .radio:hover{border-color:var(--primary-base-neutral-dark)}";
@@ -133,7 +133,7 @@ const CuraRadio = class {
         return statusColors[this.status][type];
     }
     render() {
-        return (h(Host, { key: '47a86162a780f9bfc554ab0f39e20e2f1e01a9d9' }, h("div", { key: 'a0f2860ed3ff500bfc100c1e546da8ced421b207', class: this.getClasses(), style: this.styles }, h("div", { key: '9191f64704f6c1d791922464a75e00afa0cdcb7e', class: "info" }, h("div", { key: 'c61a9ba353b49db897c27f6356bfe3d76651b186', class: "label-wrapper" }, h("cura-label", { key: 'aa942db786a175452697b17229dc05e9113e8097', class: "label", size: this.size === 'large' ? 'medium' : 'xsmall', color: this.assignColor('label') }, this.label), this.required && h("cura-paragraph", { key: 'aed6a56437cc00fb7050043ce0a89877770acc6c', lineHeight: '0%', marginBlock: '0', color: "error-base" }, "* ")), h("cura-label", { key: '4b489038012fcf112d89d5cdcce46e55b363eca0', color: this.assignColor('message'), size: "xsmall", class: "message" }, h("slot", { key: 'edff8c3ddc4875017dc7e9342fe3c9e19bdb86dc' }))), h("input", { key: '43d5c937fbaa9139abaa3c1c8b5534a39fa4017c', type: "radio", class: `radio ${this.size.toLocaleLowerCase()}`, name: this.name, value: this.value, required: this.required, tabIndex: this.ontabindex, disabled: this.disabled, checked: this.checked, onClick: this.handleClick }))));
+        return (h(Host, { key: '015424d6821feeef090b0e064cf35eb39100f918' }, h("div", { key: '85b54a48eb2c75dd98df83f7ac7557162b036300', class: this.getClasses(), style: this.styles }, h("div", { key: '84f0b0a8f5e2698fc5fcc6941b6a8b369629d6c0', class: "info" }, h("div", { key: '94194138a25b71c7a6cd1b8c191662ebcbd16b71', class: "label-wrapper" }, h("cura-label", { key: 'cd5af14f2c174bf6a2e2715f32c3f97ed42dd05e', class: "label", size: this.size === 'large' ? 'medium' : 'xsmall', color: this.assignColor('label') }, this.label), this.required && h("cura-paragraph", { key: '237bc98ab60ab07e917dcd99b1874bf6fd400ec6', lineHeight: '0%', marginBlock: '0', color: "error-base" }, "* ")), h("cura-label", { key: '88a3014b55f420ed7744090f1e54927f7f6ec767', color: this.assignColor('message'), size: "xsmall", class: "message" }, h("slot", { key: 'b505727b192c807344f328c73c44f88b72314cb3' }))), h("input", { key: '6f324f596f24328d0829e1013bf78545dda17e4b', type: "radio", class: `radio ${this.size.toLocaleLowerCase()}`, name: this.name, value: this.value, required: this.required, tabIndex: this.ontabindex, disabled: this.disabled, checked: this.checked, onClick: this.handleClick }))));
     }
     static get formAssociated() { return true; }
     get host() { return getElement(this); }

package/dist/esm/cura-switch.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, H as Host } from './index-1ad98520.js';
+import { r as registerInstance, c as createEvent, h, H as Host } from './index-747aad85.js';
 import { f as formsSizes } from './cura-forms.definitions-2f963167.js';
 
 const curaSwitchCss = "@charset \"UTF-8\";:host{display:block;width:fit-content;box-sizing:border-box}.container{display:flex;align-items:center;flex-direction:row-reverse;gap:var(--gap);text-align:left}.position{flex-direction:row}.label,.message{text-align:left}.control{width:fit-content}.track{background:var(--neutral-dark-base);border-radius:16px;transition:background-color 0.3s;align-items:flex-start;flex-shrink:0;box-sizing:border-box;width:var(--size-track);height:var(--size);position:relative}.thumb{background:var(--neutral-purewhite);border:2px solid var(--neutral-darker-medium);border-radius:50%;position:absolute;transition:transform 0.3s, outline 0.3s;display:inline-block;cursor:pointer;user-select:none;box-sizing:border-box;width:var(--size);height:var(--size);top:50%;transform:translateY(-50%)}.checked .thumb{border-color:var(--color-dark);box-shadow:0px 4px 8px 0px var(--neutral-black-shadow, rgba(38, 38, 38, 0.16));background:var(--neutral-purewhite);transform:translateX(var(--size)) translateY(-50%)}.checked .thumb:hover{background:var(--neutral-pale) !important;border-color:var(--neutral-darker-medium) !important}.checked .thumb:active{border-color:var(--color-dark);background:var(--neutral-pale)}.checked .track{background:var(--color-base-light)}.disabled .track{background:var(--neutral-black-neutral-pale)}.disabled .thumb{background:var(--neutral-black-neutral-base) !important;border-color:var(--neutral-black-neutral-pale) !important;cursor:not-allowed}.disabled.checked .track{background:var(--neutral-black-neutral-pale)}.container.disabled .thumb:focus{outline:none !important;border-color:var(--neutral-black-neutral-pale) !important}:not(.disabled):not(.checked) .thumb:hover{border-color:var(--color-dark);background:var(--neutral-pale)}:not(.disabled):not(.checked) .thumb:active{border-color:var(--color-dark);background:var(--neutral-pale)}:not(.disabled) .thumb:focus{outline:2px solid var(--info-base) !important;border:2px solid var(--neutral-darker-medium);z-index:1}:not(.disabled) .checked .thumb:focus{outline:2px solid var(--info-base) !important;border-color:var(--color-dark)}";
@@ -105,7 +105,7 @@ const CuraSwitch = class {
         return classes;
     }
     render() {
-        return (h(Host, { key: 'a18d2e4516e63c9dc080fabb97ded6cb145f096f' }, h("div", { key: 'e6cfb0bada406eef4b6dc400eae2cc8e15ff209b', class: this.getClasses(), style: this.styles }, h("div", { key: '520489765d61a4c96079cc51395c9a7038c1ec12', class: "info" }, h("cura-label", { key: '3b064a7794c262d62e4d8e04475ca20d87febc7b', style: { textAlign: this.position === 'right' ? 'right' : 'left' }, class: "label", weight: "bold", size: this.size === 'large' ? 'medium' : 'xsmall', lineHeight: "125%", color: this.assignColor('neutral-white', 'neutral-black') }, this.label), h("cura-label", { key: 'b94ac8cf1fd1e3ba0dce269b677636f09bc97597', style: { textAlign: this.position === 'right' ? 'right' : 'left' }, color: this.assignColor('primary-lighter', 'neutral-dark'), size: "xsmall", class: "message" }, h("slot", { key: '437f81a5bde1395d97c346928191c8ab0ce7219d' }))), h("div", { key: '3e36e82138a69c5f829f54ec82af0646fdea4fbb', onClick: this.toggleSwitch, class: "control" }, h("div", { key: '7068b0664ebb020037d63df565e5c835b7a4fa46', class: `track ${this.size.toLowerCase()}` }, h("div", { key: '6ce66dfe5d06bdfdb625b38b0e0adb20df7db130', class: `thumb ${this.size.toLowerCase()}`, tabIndex: this.ontabindex }))))));
+        return (h(Host, { key: '6bbc037348270c69bfac13e7466c6fd19f4dc427' }, h("div", { key: '11ada01c69ff91815ba1b1f76a6e6b448e88a361', class: this.getClasses(), style: this.styles }, h("div", { key: '34992d3d6fbf3ca7782fa4502e297d508656c34c', class: "info" }, h("cura-label", { key: '0e6a178f1f74526962d588b1fad3024920bcf815', style: { textAlign: this.position === 'right' ? 'right' : 'left' }, class: "label", weight: "bold", size: this.size === 'large' ? 'medium' : 'xsmall', lineHeight: "125%", color: this.assignColor('neutral-white', 'neutral-black') }, this.label), h("cura-label", { key: '33e7c6d7aaabd9007b0a41fb966b41b0fd947bc8', style: { textAlign: this.position === 'right' ? 'right' : 'left' }, color: this.assignColor('primary-lighter', 'neutral-dark'), size: "xsmall", class: "message" }, h("slot", { key: '66dd525702f7d53c8167cfd2aa25552d1bd79837' }))), h("div", { key: 'a3828f2e511a7e23ad5d0e04319637e1aa256c96', onClick: this.toggleSwitch, class: "control" }, h("div", { key: 'afc664ab5563591ef201eee1ca0d33a48075ad04', class: `track ${this.size.toLowerCase()}` }, h("div", { key: 'e6b7f3b67e78421283426ce1c7679cbbf8f77f5e', class: `thumb ${this.size.toLowerCase()}`, tabIndex: this.ontabindex }))))));
     }
     static get formAssociated() { return true; }
     static get watchers() { return {

package/dist/esm/cura-toast.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-1ad98520.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-747aad85.js';
 
 const curaToastCss = ":host{display:block;box-sizing:border-box}:host .container{position:fixed;z-index:99999;display:flex;box-sizing:border-box;min-width:328px;height:fit-content;padding:16px;border:1px solid var(--color-base);border-radius:12px;background-color:var(--neutral-purewhite);overflow:hidden;box-shadow:0px 8px 16px 0px var(--neutral-black-shadow-4, rgba(38, 38, 38, 0.12))}:host .container.loader{padding:16px 16px 20px}:host .container.top{top:24px}:host .container.top.center{top:-100%;left:50%;transform:translateX(-50%);opacity:0;transition:opacity 0.5s ease-in-out, top 0.5s ease-in-out}:host .container.top.center.active{top:24px;opacity:1}:host .container.bottom{bottom:24px}:host .container.bottom.center{bottom:-100%;left:50%;transform:translateX(-50%);opacity:0;transition:opacity 0.5s ease-in-out, bottom 0.5s ease-in-out}:host .container.bottom.center.active{bottom:24px;opacity:1}:host .container.left{left:-100%;opacity:0;transition:opacity 0.5s ease-in-out, left 0.5s ease-in-out}@media (max-width: 768px){:host .container.left{right:unset;left:50%;transform:translateX(-50%)}}:host .container.left.active{left:24px;opacity:1}:host .container.right{right:-100%;opacity:0;transition:opacity 0.5s ease-in-out, right 0.5s ease-in-out}@media (max-width: 768px){:host .container.right{right:unset;left:50%;transform:translateX(-50%)}}:host .container.right.active{right:24px;opacity:1}:host .container .content{flex:1 1 0;display:flex;flex-direction:column;gap:4px}:host .container .default-icon{margin-right:12px}:host .container .close-icon{margin-left:12px;cursor:pointer}";
 const CuraToastStyle0 = curaToastCss;
@@ -27,7 +27,7 @@ const CuraToast = class {
         this.setStyle();
     }
     render() {
-        return (h(Host, { key: '65417f506ab0db06fd38449643c679d4fea1fffd' }, h("div", { key: '80e509d36768bea4b99e215dc9d81aec83b9143c', class: this.getClasses(), style: this.styles }, h("cura-icon", { key: 'd2f6a36370ab4c6555bb679f481e1975fb234e41', class: "default-icon", name: this.getNameIcon(), size: 16, color: `${this.type}-dark` }), h("div", { key: 'c312e11dbb469c1a486eaf90898c6149ce099627', class: "content" }, h("cura-heading", { key: 'f0ff03c554caaf0213476c23004b1361a876cf19', level: 4, size: "xsmall", color: `${this.type}-dark`, weight: "bold", "margin-block": "0" }, this.label), h("cura-paragraph", { key: 'd94ab5591663c1135712bf54dd90182de5d18ed5', color: `${this.type}-darker`, size: "xsmall", marginBlock: "0", lineHeight: "133.33%" }, h("slot", { key: '9dc18a1ded79abcc258b4a2c892084addb194c9f' })), h("slot", { key: '829788786a56a1492b6fef2dd053f84fdafd7ea1', name: "actions" })), this.closeButton && h("cura-icon", { key: '1d507a45d3a860e859f879de15d79bc7c3a34787', class: "close-icon", name: "close", size: 16, color: "error-dark", onClick: this.handleClose }), this.loader && !!this.autoCloseDelay && h("cura-loader-bar", { key: '0ad99ff90899e19b3b2e9a13a2ac3fa76dae286d', color: `${this.type}-base`, progress: this.progress }))));
+        return (h(Host, { key: 'b875e88d00075a71d6052563a45849f0b3124f13' }, h("div", { key: 'e766c7a687ec1f9ad943dc4e2ebb87c100da5b71', class: this.getClasses(), style: this.styles }, h("cura-icon", { key: '9379419d8403c5c7b14182bb136cd3375f8aa09a', class: "default-icon", name: this.getNameIcon(), size: 16, color: `${this.type}-dark` }), h("div", { key: '38f2a177984d826209d6fbdc9ad3036ef02a1825', class: "content" }, h("cura-heading", { key: 'a4fd1cce18d6208daa527b8da5687b47fbb59968', level: 4, size: "xsmall", color: `${this.type}-dark`, weight: "bold", "margin-block": "0" }, this.label), h("cura-paragraph", { key: 'fb803bbcbe47f1d2eca897ca5679d71294fe59ab', color: `${this.type}-darker`, size: "xsmall", marginBlock: "0", lineHeight: "133.33%" }, h("slot", { key: '9ea56d9f87a423b109945cd4cf4078347a9fc1e9' })), h("slot", { key: '045b4ae11997260832288428df6672be6e918730', name: "actions" })), this.closeButton && h("cura-icon", { key: 'e326bb7786f60c95bed9d910e46f47bb4273bb7b', class: "close-icon", name: "close", size: 16, color: "error-dark", onClick: this.handleClose }), this.loader && !!this.autoCloseDelay && h("cura-loader-bar", { key: 'bf1d59681ac35d79fe240777e5d5424ee2b4a4e7', color: `${this.type}-base`, progress: this.progress }))));
     }
     componentDidLoad() {
         this.openContainer();

package/dist/esm/cura.js

@@ -1,6 +1,6 @@
-import { p as promiseResolve, b as bootstrapLazy } from './index-1ad98520.js';
-export { s as setNonce } from './index-1ad98520.js';
-import { g as globalScripts } from './app-globals-488bf508.js';
+import { p as promiseResolve, b as bootstrapLazy } from './index-747aad85.js';
+export { s as setNonce } from './index-747aad85.js';
+import { g as globalScripts } from './app-globals-6ca7103d.js';
 
 /*
  Stencil Client Patch Browser v4.22.0 | MIT Licensed | https://stenciljs.com
@@ -16,7 +16,7 @@ var patchBrowser = () => {
 
 patchBrowser().then(async (options) => {
   await globalScripts();
-  return bootstrapLazy([["cura-accordion_12",[[65,"cura-button",{"type":[513],"size":[513],"disabled":[516],"isLoading":[516,"is-loading"],"iconName":[513,"icon-name"],"iconset":[513],"iconPosition":[513,"icon-position"],"iconOnly":[516,"icon-only"],"href":[513],"target":[513],"color":[1],"background":[513],"fontColor":[513,"font-color"],"textAlign":[513,"text-align"],"justify":[516],"styles":[32],"hovered":[32]},null,{"background":["setColors"],"color":["setColors"]}],[1,"cura-accordion-item",{"label":[513],"iconSize":[514,"icon-size"],"openIcon":[513,"open-icon"],"closeIcon":[513,"close-icon"],"iconColor":[513,"icon-color"],"iconActiveColor":[513,"icon-active-color"],"colorMode":[1,"color-mode"],"opened":[1540],"styles":[32]}],[1,"cura-accordion",{"color":[513],"activeColor":[513,"active-color"],"colorMode":[513,"color-mode"],"iconSize":[514,"icon-size"],"openIcon":[513,"open-icon"],"closeIcon":[513,"close-icon"],"iconColor":[513,"icon-color"],"iconActiveColor":[513,"icon-active-color"],"behavior":[513],"styles":[32]},null,{"color":["handleChangeColor"],"activeColor":["handleChangeColor"]}],[1,"cura-page-template",{"contentwidth":[513]}],[65,"cura-input-text",{"mode":[1537],"status":[1537],"size":[1537],"type":[513],"inputMode":[513,"input-mode"],"label":[513],"name":[513],"placeholder":[513],"value":[1032],"iconName":[1537,"icon-name"],"helperText":[1537,"helper-text"],"disabled":[516],"required":[516],"maskPreset":[8,"mask-preset"],"maskRegex":[1537,"mask-regex"],"maskAdvanced":[1544,"mask-advanced"],"maxlength":[1538],"readOnly":[516,"read-only"],"isLoading":[1540,"is-loading"],"clearIcon":[1540,"clear-icon"],"hideErrorIcon":[4,"hide-error-icon"],"isHovered":[32],"isFocused":[32],"styles":[32]},null,{"styles":["connectedCallback"],"size":["getClasses"],"status":["renderIcon"],"mode":["renderIcon"],"maskPreset":["initializeMask"],"maskRegex":["initializeMask"],"maskAdvanced":["initializeMask"]}],[65,"cura-select",{"label":[513],"placeholder":[513],"value":[1537],"mode":[513],"size":[513],"status":[1537],"disabled":[516],"required":[516],"isHovered":[32],"isFocused":[32],"isOpen":[32],"options":[32],"activeIndex":[32],"textInput":[32]},null,{"activeIndex":["updateOptionHighlights"],"textInput":["filterOptions"],"value":["handleValueChange"]}],[1,"cura-select-option",{"value":[513],"selected":[516],"active":[516],"size":[1],"styles":[32]},null,{"size":["getSize"]}],[1,"cura-heading",{"level":[514],"size":[513],"weight":[513],"spotColor":[513,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}],[1,"cura-paragraph",{"size":[513],"spotColor":[513,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}],[1,"cura-loader-circle",{"size":[513],"color":[513]}],[1,"cura-icon",{"name":[513],"color":[1],"size":[8],"iconset":[513],"disabled":[4]},null,{"size":["sizeHandler"],"color":["colorHandler"],"disabled":["colorHandler"]}],[1,"cura-label",{"size":[513],"weight":[513],"spotColor":[513,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}]]],["cura-calendar",[[1,"cura-calendar",{"period":[513],"width":[513],"mode":[513],"dateFormat":[1537,"date-format"],"locale":[513],"type":[513],"disable":[16],"enable":[16],"defaultDate":[16],"limitRange":[514,"limit-range"],"disablePassDates":[1540,"disable-pass-dates"],"collapsed":[1540],"currentDate":[32],"selectedDates":[32],"rangeStart":[32],"defaultDates":[32],"selectMonth":[32],"selectYear":[32],"styles":[32]}]]],["cura-dropdown-search",[[1,"cura-dropdown-search",{"status":[513],"disabled":[516],"name":[513],"required":[1540],"selected":[1540],"value":[1537],"placeholder":[1537],"label":[1537],"iconName":[513,"icon-name"],"dropdownMaxHeight":[513,"dropdown-max-height"],"overlayVisible":[32],"isDropdownOpen":[32],"styles":[32],"isMobile":[32],"mode":[32],"inputTextRef":[32],"isOnBlurInput":[32],"hoveredIndex":[32],"options":[32]},null,{"value":["onValueChange"]}]]],["cura-icons-view",[[1,"cura-icons-view",{"selected":[32]}]]],["cura-toast",[[1,"cura-toast",{"type":[1],"position":[1],"icon":[513],"label":[513],"closeButton":[516,"close-button"],"loader":[516],"autoCloseDelay":[514,"auto-close-delay"],"styles":[32],"progress":[32]},null,{"type":["handleChangeType"],"position":["handleChangeType"]}]]],["cura-alert",[[1,"cura-alert",{"type":[1],"floating":[516],"label":[513],"closeable":[516],"icon":[513],"styles":[32]},null,{"type":["setColors"]}]]],["cura-button-outline",[[65,"cura-button-outline",{"type":[513],"size":[513],"disabled":[516],"isLoading":[516,"is-loading"],"iconName":[513,"icon-name"],"iconset":[513],"iconPosition":[513,"icon-position"],"iconOnly":[516,"icon-only"],"href":[513],"target":[513],"color":[1],"background":[1],"fontColor":[1,"font-color"],"textAlign":[513,"text-align"],"justify":[516],"styles":[32],"hovered":[32]},null,{"background":["setColors"],"color":["setColors","getSymbolColor"],"fontColor":["getSymbolColor"]}]]],["cura-checkbox",[[65,"cura-checkbox",{"checked":[1540],"indeterminate":[1540],"status":[1537],"disabled":[516],"required":[516],"label":[513],"ontabindex":[514],"position":[513],"value":[513],"name":[513],"size":[513],"background":[1],"iconColor":[1,"icon-color"],"color":[1],"styles":[32]},null,{"size":["sizeHandler"],"color":["setColors"],"background":["setColors","assignColor"],"iconColor":["assignColor"]}]]],["cura-button-select",[[1,"cura-button-select",{"size":[513],"disabled":[516],"selected":[516],"iconPosition":[513,"icon-position"],"color":[1],"background":[1],"fontcolor":[1],"hovered":[32],"styles":[32]},null,{"background":["setColors","assignColor"],"color":["setColors"],"fontcolor":["setColors","assignColor"]}]]],["cura-radio",[[65,"cura-radio",{"checked":[1540],"status":[1537],"disabled":[516],"required":[516],"label":[513],"ontabindex":[514],"position":[513],"value":[513],"name":[513],"background":[1],"size":[1],"color":[1],"styles":[32]},null,{"size":["sizeHandler"],"color":["setColors"],"background":["setColors","assignColor"]}]]],["cura-badge-distance",[[1,"cura-badge-distance",{"distance":[2],"label":[513],"styles":[32],"displayDistance":[32]},null,{"distance":["formatDistance"]}]]],["cura-dropdown-search-option",[[1,"cura-dropdown-search-option",{"value":[513],"selected":[1540],"selectable":[516],"hovered":[1540],"styles":[32]},null,{"selected":["updateIconColor"]}]]],["cura-dropdown-search-option-title",[[1,"cura-dropdown-search-option-title"]]],["cura-switch",[[65,"cura-switch",{"checked":[1540],"disabled":[516],"label":[513],"ontabindex":[514],"position":[513],"size":[513],"background":[1],"color":[1],"styles":[32]},null,{"size":["sizeHandler"],"color":["setColors"],"background":["setColors"]}]]],["cura-avatar",[[1,"cura-avatar",{"size":[1],"backgroundColor":[513,"background-color"],"borderColor":[513,"border-color"],"borderRadius":[513,"border-radius"],"border":[516],"type":[513],"imageSrc":[1537,"image-src"],"imageSrcDefault":[513,"image-src-default"],"floating":[516],"styles":[32]},null,{"size":["sizeHandler"]}]]],["cura-card",[[1,"cura-card",{"hasPadding":[1028,"has-padding"],"hasShadow":[1028,"has-shadow"],"type":[1025],"colorMode":[1025,"color-mode"],"href":[1537],"target":[513],"styles":[32]}]]],["cura-display",[[1,"cura-display",{"level":[514],"size":[513],"spotColor":[1,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}]]],["cura-loader-bar",[[1,"cura-loader-bar",{"color":[1],"progress":[2],"styles":[32]},null,{"color":["handleChangeColor"],"progress":["handleProgress"]}]]],["cura-button-transparent",[[65,"cura-button-transparent",{"type":[513],"size":[513],"disabled":[516],"isLoading":[516,"is-loading"],"iconName":[513,"icon-name"],"iconset":[513],"iconPosition":[513,"icon-position"],"iconOnly":[516,"icon-only"],"href":[513],"target":[513],"color":[513],"fontColor":[513,"font-color"],"textAlign":[513,"text-align"],"justify":[516],"hovered":[32],"styles":[32]},null,{"fontColor":["getSymbolColor"],"color":["getSymbolColor"]}]]]], options);
+  return bootstrapLazy([["cura-accordion_12",[[65,"cura-button",{"type":[513],"size":[513],"disabled":[516],"isLoading":[516,"is-loading"],"iconName":[513,"icon-name"],"iconset":[513],"iconPosition":[513,"icon-position"],"iconOnly":[516,"icon-only"],"href":[513],"target":[513],"color":[1],"background":[513],"fontColor":[513,"font-color"],"textAlign":[513,"text-align"],"justify":[516],"styles":[32],"hovered":[32]},null,{"background":["setColors"],"color":["setColors"]}],[1,"cura-accordion-item",{"label":[513],"iconSize":[514,"icon-size"],"openIcon":[513,"open-icon"],"closeIcon":[513,"close-icon"],"iconColor":[513,"icon-color"],"iconActiveColor":[513,"icon-active-color"],"colorMode":[1,"color-mode"],"opened":[1540],"styles":[32]}],[1,"cura-accordion",{"color":[513],"activeColor":[513,"active-color"],"colorMode":[513,"color-mode"],"iconSize":[514,"icon-size"],"openIcon":[513,"open-icon"],"closeIcon":[513,"close-icon"],"iconColor":[513,"icon-color"],"iconActiveColor":[513,"icon-active-color"],"behavior":[513],"styles":[32]},null,{"color":["handleChangeColor"],"activeColor":["handleChangeColor"]}],[1,"cura-page-template",{"contentwidth":[513]}],[65,"cura-input-text",{"mode":[1537],"status":[1537],"size":[1537],"type":[513],"inputMode":[513,"input-mode"],"label":[513],"name":[513],"placeholder":[513],"value":[1032],"iconName":[1537,"icon-name"],"helperText":[1537,"helper-text"],"disabled":[516],"required":[516],"maskPreset":[8,"mask-preset"],"enableSelectionMode":[1540,"enable-selection-mode"],"maskRegex":[1537,"mask-regex"],"maskAdvanced":[1544,"mask-advanced"],"maxlength":[1538],"readOnly":[516,"read-only"],"isLoading":[1540,"is-loading"],"clearIcon":[1540,"clear-icon"],"hideErrorIcon":[4,"hide-error-icon"],"autocomplete":[513],"isHovered":[32],"isFocused":[32],"styles":[32]},null,{"styles":["connectedCallback"],"size":["getClasses"],"status":["renderIcon"],"mode":["renderIcon"],"maskPreset":["initializeMask"],"maskRegex":["initializeMask"],"maskAdvanced":["initializeMask"]}],[65,"cura-select",{"label":[513],"placeholder":[513],"value":[1537],"mode":[513],"size":[513],"status":[1537],"disabled":[516],"required":[516],"searchBehavior":[516,"search-behavior"],"isHovered":[32],"isFocused":[32],"isOpen":[32],"options":[32],"activeIndex":[32],"textInput":[32]},null,{"activeIndex":["updateOptionHighlights"],"textInput":["filterOptions"],"value":["handleValueChange"]}],[1,"cura-select-option",{"value":[513],"selected":[516],"active":[516],"size":[1],"styles":[32]},null,{"size":["getSize"]}],[1,"cura-heading",{"level":[514],"size":[513],"weight":[513],"spotColor":[513,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}],[1,"cura-paragraph",{"size":[513],"spotColor":[513,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}],[1,"cura-loader-circle",{"size":[513],"color":[513]}],[1,"cura-icon",{"name":[513],"color":[1],"size":[8],"iconset":[513],"disabled":[4]},null,{"size":["sizeHandler"],"color":["colorHandler"],"disabled":["colorHandler"]}],[1,"cura-label",{"size":[513],"weight":[513],"spotColor":[513,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}]]],["cura-input-date",[[65,"cura-input-date",{"label":[513],"status":[1537],"size":[1537],"name":[513],"helperText":[1537,"helper-text"],"enableRangeDates":[1540,"enable-range-dates"],"disableFutureDates":[1540,"disable-future-dates"],"disablePassDates":[1540,"disable-pass-dates"],"iconName":[1537,"icon-name"],"placeholder":[513],"styles":[32],"isCalendarVisible":[32],"dates":[32],"value":[32]},[[8,"click","handleClick"]],{"enableRangeDates":["setPlaceholder","setMask","setMode"],"disableFutureDates":["isDateValid","renderCalendarOrHelperText"],"disablePassDates":["isDateValid"],"dates":["renderCalendarOrHelperText"],"isCalendarVisible":["renderCalendarOrHelperText"]}]]],["cura-dropdown-search",[[1,"cura-dropdown-search",{"size":[1537],"status":[513],"disabled":[516],"name":[513],"required":[1540],"selected":[1540],"value":[1537],"placeholder":[1537],"label":[1537],"iconName":[513,"icon-name"],"dropdownMaxHeight":[513,"dropdown-max-height"],"overlayVisible":[32],"isDropdownOpen":[32],"styles":[32],"isMobile":[32],"mode":[32],"inputTextRef":[32],"isOnBlurInput":[32],"hoveredIndex":[32],"options":[32]},null,{"value":["onValueChange"]}]]],["cura-icons-view",[[1,"cura-icons-view",{"selected":[32]}]]],["cura-toast",[[1,"cura-toast",{"type":[1],"position":[1],"icon":[513],"label":[513],"closeButton":[516,"close-button"],"loader":[516],"autoCloseDelay":[514,"auto-close-delay"],"styles":[32],"progress":[32]},null,{"type":["handleChangeType"],"position":["handleChangeType"]}]]],["cura-alert",[[1,"cura-alert",{"type":[1],"floating":[516],"label":[513],"closeable":[516],"icon":[513],"styles":[32]},null,{"type":["setColors"]}]]],["cura-button-outline",[[65,"cura-button-outline",{"type":[513],"size":[513],"disabled":[516],"isLoading":[516,"is-loading"],"iconName":[513,"icon-name"],"iconset":[513],"iconPosition":[513,"icon-position"],"iconOnly":[516,"icon-only"],"href":[513],"target":[513],"color":[1],"background":[1],"fontColor":[1,"font-color"],"textAlign":[513,"text-align"],"justify":[516],"styles":[32],"hovered":[32]},null,{"background":["setColors"],"color":["setColors","getSymbolColor"],"fontColor":["getSymbolColor"]}]]],["cura-button-select",[[1,"cura-button-select",{"selected":[1540],"iconName":[1537,"icon-name"],"size":[513],"counter":[1544],"disabled":[516],"background":[1],"color":[1],"hovered":[32],"styles":[32]},null,{"background":["setColors"],"color":["setColors"]}]]],["cura-checkbox",[[65,"cura-checkbox",{"checked":[1540],"indeterminate":[1540],"status":[1537],"disabled":[516],"required":[516],"label":[513],"ontabindex":[514],"position":[513],"value":[513],"name":[513],"size":[513],"background":[1],"iconColor":[1,"icon-color"],"color":[1],"styles":[32]},null,{"size":["sizeHandler"],"color":["setColors"],"background":["setColors","assignColor"],"iconColor":["assignColor"]}]]],["cura-radio",[[65,"cura-radio",{"checked":[1540],"status":[1537],"disabled":[516],"required":[516],"label":[513],"ontabindex":[514],"position":[513],"value":[513],"name":[513],"background":[1],"size":[1],"color":[1],"styles":[32]},null,{"size":["sizeHandler"],"color":["setColors"],"background":["setColors","assignColor"]}]]],["cura-badge-distance",[[1,"cura-badge-distance",{"distance":[2],"label":[513],"styles":[32],"displayDistance":[32]},null,{"distance":["formatDistance"]}]]],["cura-dropdown-search-option",[[1,"cura-dropdown-search-option",{"value":[513],"selected":[1540],"selectable":[516],"hovered":[1540],"styles":[32]},null,{"selected":["updateIconColor"]}]]],["cura-dropdown-search-option-title",[[1,"cura-dropdown-search-option-title"]]],["cura-switch",[[65,"cura-switch",{"checked":[1540],"disabled":[516],"label":[513],"ontabindex":[514],"position":[513],"size":[513],"background":[1],"color":[1],"styles":[32]},null,{"size":["sizeHandler"],"color":["setColors"],"background":["setColors"]}]]],["cura-avatar",[[1,"cura-avatar",{"size":[1],"backgroundColor":[513,"background-color"],"borderColor":[513,"border-color"],"borderRadius":[513,"border-radius"],"border":[516],"type":[513],"imageSrc":[1537,"image-src"],"imageSrcDefault":[513,"image-src-default"],"floating":[516],"styles":[32]},null,{"size":["sizeHandler"]}]]],["cura-card",[[1,"cura-card",{"hasPadding":[1028,"has-padding"],"hasShadow":[1028,"has-shadow"],"type":[1025],"colorMode":[1025,"color-mode"],"href":[1537],"target":[513],"styles":[32]}]]],["cura-display",[[1,"cura-display",{"level":[514],"size":[513],"spotColor":[1,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}]]],["cura-calendar",[[1,"cura-calendar",{"period":[513],"width":[513],"mode":[513],"dateFormat":[1537,"date-format"],"locale":[513],"type":[513],"disable":[16],"enable":[16],"defaultDate":[16],"customDates":[16],"limitRange":[514,"limit-range"],"disablePassDates":[1540,"disable-pass-dates"],"disableFutureDates":[1540,"disable-future-dates"],"collapsed":[1540],"floating":[1540],"embedded":[1540],"currentDate":[32],"selectedDates":[32],"rangeStart":[32],"defaultDates":[32],"selectMonth":[32],"selectYear":[32],"styles":[32]},null,{"customDates":["watchDefaultDatesArray"]}]]],["cura-badge-number",[[1,"cura-badge-number",{"number":[514],"color":[513]}]]],["cura-loader-bar",[[1,"cura-loader-bar",{"color":[1],"progress":[2],"styles":[32]},null,{"color":["handleChangeColor"],"progress":["handleProgress"]}]]],["cura-button-transparent",[[65,"cura-button-transparent",{"type":[513],"size":[513],"disabled":[516],"isLoading":[516,"is-loading"],"iconName":[513,"icon-name"],"iconset":[513],"iconPosition":[513,"icon-position"],"iconOnly":[516,"icon-only"],"href":[513],"target":[513],"color":[513],"fontColor":[513,"font-color"],"textAlign":[513,"text-align"],"justify":[516],"hovered":[32],"styles":[32]},null,{"fontColor":["getSymbolColor"],"color":["getSymbolColor"]}]]]], options);
 });
 
 //# sourceMappingURL=cura.js.map

package/dist/esm/{index-1ad98520.js → index-747aad85.js}

@@ -1,5 +1,5 @@
 const NAMESPACE = 'cura';
-const BUILD = /* cura */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, asyncQueue: false, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: true, cmpDidUnload: false, cmpDidUpdate: false, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: false, cmpWillUpdate: false, connectedCallback: true, constructableCSS: true, cssAnnotations: true, devTools: false, disconnectedCallback: true, element: false, event: true, experimentalScopedSlotChanges: false, experimentalSlotFixes: false, formAssociated: true, hasRenderFn: true, hostListener: false, hostListenerTarget: false, hostListenerTargetBody: false, hostListenerTargetDocument: false, hostListenerTargetParent: false, hostListenerTargetWindow: false, hotModuleReplacement: false, hydrateClientSide: true, hydrateServerSide: false, hydratedAttribute: false, hydratedClass: true, hydratedSelectorName: "hydrated", initializeNextTick: false, invisiblePrehydration: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: true, lifecycle: true, lifecycleDOMEvents: false, member: true, method: false, mode: false, observeAttribute: true, profile: false, prop: true, propBoolean: true, propMutable: true, propNumber: true, propString: true, reflect: true, scoped: false, scopedSlotTextContentFix: false, scriptDataOpts: false, shadowDelegatesFocus: false, shadowDom: true, slot: true, slotChildNodesFix: false, slotRelocation: false, state: true, style: true, svg: true, taskQueue: true, transformTagName: false, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: false, vdomKey: true, vdomListener: true, vdomPropOrAttr: true, vdomRef: true, vdomRender: true, vdomStyle: true, vdomText: true, vdomXlink: true, watchCallback: true };
+const BUILD = /* cura */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, asyncQueue: false, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: true, cmpDidUnload: false, cmpDidUpdate: false, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: false, cmpWillUpdate: false, connectedCallback: true, constructableCSS: true, cssAnnotations: true, devTools: false, disconnectedCallback: true, element: false, event: true, experimentalScopedSlotChanges: false, experimentalSlotFixes: false, formAssociated: true, hasRenderFn: true, hostListener: true, hostListenerTarget: true, hostListenerTargetBody: false, hostListenerTargetDocument: false, hostListenerTargetParent: false, hostListenerTargetWindow: true, hotModuleReplacement: false, hydrateClientSide: true, hydrateServerSide: false, hydratedAttribute: false, hydratedClass: true, hydratedSelectorName: "hydrated", initializeNextTick: false, invisiblePrehydration: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: true, lifecycle: true, lifecycleDOMEvents: false, member: true, method: false, mode: false, observeAttribute: true, profile: false, prop: true, propBoolean: true, propMutable: true, propNumber: true, propString: true, reflect: true, scoped: false, scopedSlotTextContentFix: false, scriptDataOpts: false, shadowDelegatesFocus: false, shadowDom: true, slot: true, slotChildNodesFix: false, slotRelocation: false, state: true, style: true, svg: true, taskQueue: true, transformTagName: false, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: false, vdomKey: true, vdomListener: true, vdomPropOrAttr: true, vdomRef: true, vdomRender: true, vdomStyle: true, vdomText: true, vdomXlink: true, watchCallback: true };
 
 /*
  Stencil Client Platform v4.22.0 | MIT Licensed | https://stenciljs.com
@@ -88,6 +88,22 @@ var plt = {
   ce: (eventName, opts) => new CustomEvent(eventName, opts)
 };
 var supportsShadow = BUILD.shadowDom;
+var supportsListenerOptions = /* @__PURE__ */ (() => {
+  let supportsListenerOptions2 = false;
+  try {
+    doc.addEventListener(
+      "e",
+      null,
+      Object.defineProperty({}, "passive", {
+        get() {
+          supportsListenerOptions2 = true;
+        }
+      })
+    );
+  } catch (e) {
+  }
+  return supportsListenerOptions2;
+})();
 var promiseResolve = (v) => Promise.resolve(v);
 var supportsConstructableStylesheets = /* @__PURE__ */ (() => {
   try {
@@ -991,6 +1007,13 @@ var dispatchHooks = (hostRef, isInitialLoad) => {
   }
   let maybePromise;
   if (isInitialLoad) {
+    {
+      hostRef.$flags$ |= 256 /* isListenReady */;
+      if (hostRef.$queuedListeners$) {
+        hostRef.$queuedListeners$.map(([methodName, event]) => safeCall(instance, methodName, event));
+        hostRef.$queuedListeners$ = void 0;
+      }
+    }
     {
       maybePromise = safeCall(instance, "componentWillLoad");
     }
@@ -1356,6 +1379,7 @@ var connectedCallback = (elm) => {
         initializeComponent(elm, hostRef, cmpMeta);
       }
     } else {
+      addHostEventListeners(elm, hostRef, cmpMeta.$listeners$);
       if (hostRef == null ? void 0 : hostRef.$lazyInstance$) {
         fireConnectedCallback(hostRef.$lazyInstance$);
       } else if (hostRef == null ? void 0 : hostRef.$onReadyPromise$) {
@@ -1373,6 +1397,12 @@ var disconnectInstance = (instance) => {
 var disconnectedCallback = async (elm) => {
   if ((plt.$flags$ & 1 /* isTmpDisconnected */) === 0) {
     const hostRef = getHostRef(elm);
+    {
+      if (hostRef.$rmListeners$) {
+        hostRef.$rmListeners$.map((rmListener) => rmListener());
+        hostRef.$rmListeners$ = void 0;
+      }
+    }
     if (hostRef == null ? void 0 : hostRef.$lazyInstance$) {
       disconnectInstance(hostRef.$lazyInstance$);
     } else if (hostRef == null ? void 0 : hostRef.$onReadyPromise$) {
@@ -1415,6 +1445,9 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
       {
         cmpMeta.$members$ = compactMeta[2];
       }
+      {
+        cmpMeta.$listeners$ = compactMeta[3];
+      }
       {
         cmpMeta.$attrsToReflect$ = [];
       }
@@ -1446,9 +1479,10 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
           }
         }
         connectedCallback() {
-          getHostRef(this);
+          const hostRef = getHostRef(this);
           if (!this.hasRegisteredEventListeners) {
             this.hasRegisteredEventListeners = true;
+            addHostEventListeners(this, hostRef, cmpMeta.$listeners$);
           }
           if (appLoadFallback) {
             clearTimeout(appLoadFallback);
@@ -1506,10 +1540,43 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
   }
   endBootstrap();
 };
+var addHostEventListeners = (elm, hostRef, listeners, attachParentListeners) => {
+  if (listeners) {
+    listeners.map(([flags, name, method]) => {
+      const target = getHostListenerTarget(elm, flags) ;
+      const handler = hostListenerProxy(hostRef, method);
+      const opts = hostListenerOpts(flags);
+      plt.ael(target, name, handler, opts);
+      (hostRef.$rmListeners$ = hostRef.$rmListeners$ || []).push(() => plt.rel(target, name, handler, opts));
+    });
+  }
+};
+var hostListenerProxy = (hostRef, methodName) => (ev) => {
+  var _a;
+  try {
+    {
+      if (hostRef.$flags$ & 256 /* isListenReady */) {
+        (_a = hostRef.$lazyInstance$) == null ? void 0 : _a[methodName](ev);
+      } else {
+        (hostRef.$queuedListeners$ = hostRef.$queuedListeners$ || []).push([methodName, ev]);
+      }
+    }
+  } catch (e) {
+    consoleError(e);
+  }
+};
+var getHostListenerTarget = (elm, flags) => {
+  if (flags & 8 /* TargetWindow */) return win;
+  return elm;
+};
+var hostListenerOpts = (flags) => supportsListenerOptions ? {
+  passive: (flags & 1 /* Passive */) !== 0,
+  capture: (flags & 2 /* Capture */) !== 0
+} : (flags & 2 /* Capture */) !== 0;
 
 // src/runtime/nonce.ts
 var setNonce = (nonce) => plt.$nonce$ = nonce;
 
 export { Host as H, bootstrapLazy as b, createEvent as c, getElement as g, h, promiseResolve as p, registerInstance as r, setNonce as s };
 
-//# sourceMappingURL=index-1ad98520.js.map
+//# sourceMappingURL=index-747aad85.js.map