@siemens/ix 0.0.0-pr-2269-20251117133306 → 0.0.0-pr-2297-20251204163058

package/dist/cjs/ix-col_4.cjs.entry.js

@@ -70,7 +70,7 @@ const Col = class {
 Col.Breakpoints = ['', 'sm', 'md', 'lg'];
 Col.style = colCss;
 
-const datePickerCss = ":host{display:block;position:relative}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host{}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host{}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host{}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host{}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .header{display:flex;align-items:center;justify-content:space-between}:host .disabled-item{pointer-events:none;background-color:var(--theme-datepicker-day--background--disabled);color:var(--theme-datepicker-day--color--disabled);cursor:default}:host .selector{flex-basis:100%;display:flex;align-items:center;justify-content:center;padding:0 1rem}:host .selector .dropdown{color:var(--theme-menu-item--color);font-size:14px;line-height:20px}:host .selector .capitalize{text-transform:capitalize}:host .selector .month-dropdown-item{margin-left:4px;margin-right:4px}:host .selector .month-dropdown-item:focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .selector .arrowYear{display:flex;position:relative;padding:0.75rem 2rem;align-items:center;cursor:pointer}:host .selector .arrowYear:hover{background-color:var(--theme-select-list-item--background--hover)}:host .selector .arrowYear.selected{background-color:var(--theme-select-list-item--background--selected)}:host .selector .arrowYear .arrowPosition{position:absolute;left:calc(1rem - 6px);top:calc(50% - 6px)}:host .selector .arrowYear .checkPosition{position:absolute;left:calc(1rem - 6px);top:calc(50% - 8px)}:host .selector .arrowYear .monthMargin{margin-left:10px}:host .wrapper{display:flex}:host .wrapper .overflow{overflow-y:scroll;max-height:250px}:host .grid{display:grid;grid-template-columns:repeat(7, 40px);grid-template-rows:repeat(7, 40px);align-items:center;justify-items:center;justify-content:center;color:var(--theme-datepicker-today--color)}:host .grid--show-week-numbers{grid-template-columns:24px repeat(7, 40px)}:host .grid .calendar-item{position:relative;display:flex;justify-content:center;align-items:center;background-color:var(--theme-datepicker-day--background);border:1px solid var(--theme-datepicker-day--background);width:40px;height:40px;cursor:pointer}:host .grid .calendar-item:focus-visible{outline:1px solid var(--theme-color-focus-bdr);box-shadow:inset 0 0 0 1px var(--theme-color-inv-contrast-text);background-color:var(--theme-datepicker-day--background--selected);border:inset 1px solid var(--theme-datepicker-day--border-color--selected);color:var(--theme-datepicker-day--color--selected);font-size:14px;line-height:20px;letter-spacing:0}:host .grid .calendar-item.today{border:1px solid var(--theme-datepicker-today--border-color)}:host .grid .calendar-item.today:hover{background-color:var(--theme-datepicker-day--background--hover)}:host .grid .calendar-item.today:active{background-color:var(--theme-datepicker-day--background--active)}:host .grid .calendar-item.today.selected{box-shadow:inset 0 0 0 1px white}:host .grid .calendar-item.today.selected:hover{background-color:var(--theme-datepicker-day--background--selected-hover)}:host .grid .calendar-item.today.selected:active{background-color:var(--theme-datepicker-day--background--selected-active)}:host .grid .calendar-item.today.selected.disabled{pointer-events:none;background-color:var(--theme-datepicker-day--background--selected-disabled);border:1px solid var(--theme-datepicker-day--background--selected-disabled);color:var(--theme-datepicker-day--color--selected-disabled)}:host .grid .calendar-item.today.range{background-color:var(--theme-datepicker-day--background--range);color:var(--theme-datepicker-day--color--range);border:1px solid var(--theme-datepicker-today--border-color--range);box-shadow:inset 0 0 0 1px white}:host .grid .calendar-item.today.range:hover{background-color:var(--theme-datepicker-day--background--range-hover);border:1px solid var(--theme-datepicker-today--border-color--range-hover)}:host .grid .calendar-item.today.range:active{background-color:var(--theme-datepicker-day--background--range-active);border:1px solid var(--theme-datepicker-today--border-color--range-active)}:host .grid .calendar-item.today.range.disabled{background-color:var(--theme-datepicker-day--background--range-disabled);color:var(--theme-datepicker-day--color--range-disabled);border:1px solid var(--theme-datepicker-today--border-color--range-disabled)}:host .grid .calendar-item.today.disabled{pointer-events:none;background-color:var(--theme-datepicker-day--background--disabled);color:var(--theme-datepicker-day--color--disabled);cursor:default}:host .grid .calendar-item:hover{background-color:var(--theme-datepicker-day--background--hover)}:host .grid .calendar-item:active{background-color:var(--theme-datepicker-day--background--active)}:host .grid .calendar-item.selected{background-color:var(--theme-datepicker-day--background--selected);color:var(--theme-datepicker-day--color--selected);border:1px solid var(--theme-datepicker-day--background--selected);font-weight:var(--theme-font-weight-bold)}:host .grid .calendar-item.selected:hover{background-color:var(--theme-datepicker-day--background--selected-hover)}:host .grid .calendar-item.selected:active{background-color:var(--theme-datepicker-day--background--selected-active)}:host .grid .calendar-item.selected.disabled{pointer-events:none;background-color:var(--theme-datepicker-day--background--selected-disabled);color:var(--theme-datepicker-day--color--selected-disabled)}:host .grid .calendar-item.range{background-color:var(--theme-datepicker-day--background--range);color:var(--theme-datepicker-day--color--range)}:host .grid .calendar-item.range:hover{background-color:var(--theme-datepicker-day--background--range-hover)}:host .grid .calendar-item.range:active{background-color:var(--theme-datepicker-day--background--range-active)}:host .grid .calendar-item.range.disabled{pointer-events:none;background-color:var(--theme-datepicker-day--background--range-disabled);color:var(--theme-datepicker-day--color--range-disabled)}:host .grid .calendar-item.disabled{pointer-events:none;background-color:var(--theme-datepicker-day--background--disabled);color:var(--theme-datepicker-day--color--disabled)}:host .grid .calendar-item.week-day{color:var(--theme-datepicker-weekday--color);font-size:var(--theme-ms-0);line-height:143%;border:none;background:none;cursor:initial}:host .grid .calendar-item.week-day .overflow{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .grid .calendar-item.empty-day{border:none;background:none;cursor:initial}:host .grid .calendar-item.week-number{font-size:10px;line-height:14px;color:var(--theme-datepicker-weekday--color);border:none;background:none;cursor:initial;width:1.5rem}:host .button{display:flex;justify-content:flex-end;margin-top:1rem}:host .hidden{display:none}";
+const datePickerCss = ":host{display:block;position:relative;max-width:21rem}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host{}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host{}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host{}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host{}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .header{display:flex;align-items:center;justify-content:space-between}:host .disabled-item{pointer-events:none;background-color:var(--theme-datepicker-day--background--disabled);color:var(--theme-datepicker-day--color--disabled);cursor:default}:host .selector{flex-basis:100%;display:flex;align-items:center;justify-content:center;padding:0 1rem}:host .selector .dropdown{color:var(--theme-menu-item--color);font-size:14px;line-height:20px}:host .selector .capitalize{text-transform:capitalize}:host .selector .month-dropdown-item{margin-left:4px;margin-right:4px}:host .selector .month-dropdown-item:focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .selector .arrowYear{display:flex;position:relative;padding:0.75rem 2rem;align-items:center;cursor:pointer}:host .selector .arrowYear:hover{background-color:var(--theme-select-list-item--background--hover)}:host .selector .arrowYear.selected{background-color:var(--theme-select-list-item--background--selected)}:host .selector .arrowYear .arrowPosition{position:absolute;left:calc(1rem - 6px);top:calc(50% - 6px)}:host .selector .arrowYear .checkPosition{position:absolute;left:calc(1rem - 6px);top:calc(50% - 8px)}:host .selector .arrowYear .monthMargin{margin-left:10px}:host .wrapper{display:flex}:host .wrapper .overflow{overflow-y:scroll;max-height:250px}:host .grid{display:grid;grid-template-columns:repeat(7, 40px);grid-template-rows:repeat(7, 40px);align-items:center;justify-items:center;justify-content:center;color:var(--theme-datepicker-today--color)}:host .grid--show-week-numbers{grid-template-columns:24px repeat(7, 40px)}:host .grid .calendar-item{position:relative;display:flex;justify-content:center;align-items:center;background-color:var(--theme-datepicker-day--background);border:1px solid var(--theme-datepicker-day--background);width:40px;height:40px;cursor:pointer}:host .grid .calendar-item:focus-visible{outline:1px solid var(--theme-color-focus-bdr);box-shadow:inset 0 0 0 1px var(--theme-color-inv-contrast-text);background-color:var(--theme-datepicker-day--background--selected);border:inset 1px solid var(--theme-datepicker-day--border-color--selected);color:var(--theme-datepicker-day--color--selected);font-size:14px;line-height:20px;letter-spacing:0}:host .grid .calendar-item.today{border:1px solid var(--theme-datepicker-today--border-color)}:host .grid .calendar-item.today:hover{background-color:var(--theme-datepicker-day--background--hover)}:host .grid .calendar-item.today:active{background-color:var(--theme-datepicker-day--background--active)}:host .grid .calendar-item.today.selected{box-shadow:inset 0 0 0 1px white}:host .grid .calendar-item.today.selected:hover{background-color:var(--theme-datepicker-day--background--selected-hover)}:host .grid .calendar-item.today.selected:active{background-color:var(--theme-datepicker-day--background--selected-active)}:host .grid .calendar-item.today.selected.disabled{pointer-events:none;background-color:var(--theme-datepicker-day--background--selected-disabled);border:1px solid var(--theme-datepicker-day--background--selected-disabled);color:var(--theme-datepicker-day--color--selected-disabled)}:host .grid .calendar-item.today.range{background-color:var(--theme-datepicker-day--background--range);color:var(--theme-datepicker-day--color--range);border:1px solid var(--theme-datepicker-today--border-color--range);box-shadow:inset 0 0 0 1px white}:host .grid .calendar-item.today.range:hover{background-color:var(--theme-datepicker-day--background--range-hover);border:1px solid var(--theme-datepicker-today--border-color--range-hover)}:host .grid .calendar-item.today.range:active{background-color:var(--theme-datepicker-day--background--range-active);border:1px solid var(--theme-datepicker-today--border-color--range-active)}:host .grid .calendar-item.today.range.disabled{background-color:var(--theme-datepicker-day--background--range-disabled);color:var(--theme-datepicker-day--color--range-disabled);border:1px solid var(--theme-datepicker-today--border-color--range-disabled)}:host .grid .calendar-item.today.disabled{pointer-events:none;background-color:var(--theme-datepicker-day--background--disabled);color:var(--theme-datepicker-day--color--disabled);cursor:default}:host .grid .calendar-item:hover{background-color:var(--theme-datepicker-day--background--hover)}:host .grid .calendar-item:active{background-color:var(--theme-datepicker-day--background--active)}:host .grid .calendar-item.selected{background-color:var(--theme-datepicker-day--background--selected);color:var(--theme-datepicker-day--color--selected);border:1px solid var(--theme-datepicker-day--background--selected);font-weight:var(--theme-font-weight-bold)}:host .grid .calendar-item.selected:hover{background-color:var(--theme-datepicker-day--background--selected-hover)}:host .grid .calendar-item.selected:active{background-color:var(--theme-datepicker-day--background--selected-active)}:host .grid .calendar-item.selected.disabled{pointer-events:none;background-color:var(--theme-datepicker-day--background--selected-disabled);color:var(--theme-datepicker-day--color--selected-disabled)}:host .grid .calendar-item.range{background-color:var(--theme-datepicker-day--background--range);color:var(--theme-datepicker-day--color--range)}:host .grid .calendar-item.range:hover{background-color:var(--theme-datepicker-day--background--range-hover)}:host .grid .calendar-item.range:active{background-color:var(--theme-datepicker-day--background--range-active)}:host .grid .calendar-item.range.disabled{pointer-events:none;background-color:var(--theme-datepicker-day--background--range-disabled);color:var(--theme-datepicker-day--color--range-disabled)}:host .grid .calendar-item.disabled{pointer-events:none;background-color:var(--theme-datepicker-day--background--disabled);color:var(--theme-datepicker-day--color--disabled)}:host .grid .calendar-item.week-day{color:var(--theme-datepicker-weekday--color);font-size:var(--theme-ms-0);line-height:143%;border:none;background:none;cursor:initial}:host .grid .calendar-item.week-day .overflow{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .grid .calendar-item.empty-day{border:none;background:none;cursor:initial}:host .grid .calendar-item.week-number{font-size:10px;line-height:14px;color:var(--theme-datepicker-weekday--color);border:none;background:none;cursor:initial;width:1.5rem}:host .button{display:flex;justify-content:flex-end;margin-top:1rem}:host .hidden{display:none}";
 
 /*
  * SPDX-FileCopyrightText: 2023 Siemens AG

package/dist/cjs/ix-custom-field.cjs.entry.js

@@ -1,7 +1,7 @@
 'use strict';
 
 var index = require('./index-C8Xo8L1k.js');
-var validation = require('./validation-CfL71_0d.js');
+var validation = require('./validation-DTmSqO2d.js');
 
 const customFieldCss = ":host{display:block;width:-moz-fit-content;width:fit-content;height:-moz-fit-content;height:fit-content}";
 

package/dist/cjs/ix-date-input.cjs.entry.js

@@ -3,8 +3,8 @@
 var index = require('./index-C8Xo8L1k.js');
 var index$1 = require('./index-Dyz3z1FD.js');
 var datetime = require('./datetime-Dvtv5O8f.js');
-var input_fc = require('./input.fc-BzxtQeW-.js');
-var validation = require('./validation-CfL71_0d.js');
+var input_fc = require('./input.fc-DrxRYq_G.js');
+var validation = require('./validation-DTmSqO2d.js');
 var makeRef = require('./make-ref-BaH6_YJk.js');
 var pickerInput_util = require('./picker-input.util-DJNAVluZ.js');
 require('./a11y-B_6chCvu.js');
@@ -259,15 +259,13 @@ const DateInput = class {
     }
     render() {
         var _a;
-        const invalidText = this.isInputInvalid
-            ? this.i18nErrorDateUnparsable
-            : this.invalidText;
-        return (index.h(index.Host, { key: '011a0643000de99532a82efcecdcc48d20a817e1', class: {
+        const invalidText = validation.getValidationText(this.isInputInvalid, this.invalidText, this.i18nErrorDateUnparsable);
+        return (index.h(index.Host, { key: '4a7f986c62a82763e46faa0203a5b6ff82415aaf', class: {
                 disabled: this.disabled,
                 readonly: this.readonly,
-            } }, index.h("ix-field-wrapper", { key: '08411e49b366d385cb96355bd4bd869d70bcee34', label: this.label, helperText: this.helperText, isInvalid: this.isInvalid, invalidText: invalidText, infoText: this.infoText, isInfo: this.isInfo, isWarning: this.isWarning, warningText: this.warningText, isValid: this.isValid, validText: this.validText, showTextAsTooltip: this.showTextAsTooltip, required: this.required, controlRef: this.inputElementRef }, this.renderInput()), index.h("ix-dropdown", { key: 'b471b5b81f4b4ad45a9403d54be147658f3b3e42', "data-testid": "date-dropdown", trigger: this.inputElementRef.waitForCurrent(), ref: this.dropdownElementRef, closeBehavior: "outside", suppressOverflowBehavior: true, show: this.show, onShowChanged: (event) => {
+            } }, index.h("ix-field-wrapper", { key: 'c366d9ef3a538fd71e8d0f33d305e46da824421e', label: this.label, helperText: this.helperText, isInvalid: this.isInvalid, invalidText: invalidText, infoText: this.infoText, isInfo: this.isInfo, isWarning: this.isWarning, warningText: this.warningText, isValid: this.isValid, validText: this.validText, showTextAsTooltip: this.showTextAsTooltip, required: this.required, controlRef: this.inputElementRef }, this.renderInput()), index.h("ix-dropdown", { key: '6f10990b1e667f0e079f951d920707c15e24e50e', "data-testid": "date-dropdown", trigger: this.inputElementRef.waitForCurrent(), ref: this.dropdownElementRef, closeBehavior: "outside", suppressOverflowBehavior: true, show: this.show, onShowChanged: (event) => {
                 this.show = event.detail;
-            } }, index.h("ix-date-picker", { key: '24ca8c4f0301ec042f13401e80463e85aa8a5d44', ref: this.datepickerRef, format: this.format, locale: this.locale, singleSelection: true, from: (_a = this.from) !== null && _a !== void 0 ? _a : '', minDate: this.minDate, maxDate: this.maxDate, onDateChange: (event) => {
+            } }, index.h("ix-date-picker", { key: 'df14f590271c8177fa10360e72b0338088ed79be', ref: this.datepickerRef, format: this.format, locale: this.locale, singleSelection: true, from: (_a = this.from) !== null && _a !== void 0 ? _a : '', minDate: this.minDate, maxDate: this.maxDate, onDateChange: (event) => {
                 const { from } = event.detail;
                 this.onInput(from);
             }, showWeekNumbers: this.showWeekNumbers, ariaLabelNextMonthButton: this.ariaLabelNextMonthButton, ariaLabelPreviousMonthButton: this.ariaLabelPreviousMonthButton, embedded: true }))));

package/dist/cjs/ix-date-input.entry.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"ix-date-input.entry.cjs.js","sources":["src/components/date-input/date-input.scss?tag=ix-date-input&encapsulation=shadow","src/components/date-input/date-input.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@use 'mixins/shadow-dom/component';\n@use 'mixins/input';\n@use './../input/input.mixins.scss' as input-mixins;\n\n@include input-mixins.input-field;\n\n:host {\n  display: inline-block;\n  position: relative;\n\n  @include component.ix-component;\n\n  input {\n    width: 100%;\n    height: 100%;\n  }\n\n  .calendar-hidden {\n    display: none;\n  }\n}\n\n:host(.readonly) {\n  input {\n    pointer-events: none;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { iconCalendar } from '@siemens/ix-icons/icons';\nimport {\n  AttachInternals,\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  Method,\n  Prop,\n  State,\n  Watch,\n  h,\n} from '@stencil/core';\nimport { DateTime } from 'luxon';\nimport { SlotEnd, SlotStart } from '../input/input.fc';\nimport {\n  DisposableChangesAndVisibilityObservers,\n  addDisposableChangesAndVisibilityObservers,\n  adjustPaddingForStartAndEnd,\n  handleSubmitOnEnterKeydown,\n} from '../input/input.util';\nimport {\n  ClassMutationObserver,\n  HookValidationLifecycle,\n  IxInputFieldComponent,\n  ValidationResults,\n  createClassMutationObserver,\n} from '../utils/input';\nimport { makeRef } from '../utils/make-ref';\nimport type { DateInputValidityState } from './date-input.types';\nimport {\n  closeDropdown as closeDropdownUtil,\n  createValidityState,\n  handleIconClick,\n  openDropdown as openDropdownUtil,\n} from '../utils/input/picker-input.util';\n\n/**\n * @form-ready\n *\n * @slot start - Element will be displayed at the start of the input\n * @slot end - Element will be displayed at the end of the input\n */\n@Component({\n  tag: 'ix-date-input',\n  styleUrl: 'date-input.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class DateInput implements IxInputFieldComponent<string | undefined> {\n  @Element() hostElement!: HTMLIxDateInputElement;\n  @AttachInternals() formInternals!: ElementInternals;\n\n  /**\n   * Name of the input element\n   */\n  @Prop({ reflect: true }) name?: string;\n\n  /**\n   * Placeholder of the input element\n   */\n  @Prop({ reflect: true }) placeholder?: string;\n\n  /**\n   * Value of the input element\n   */\n  @Prop({ reflect: true, mutable: true }) value?: string = '';\n\n  @Watch('value') watchValuePropHandler(newValue: string) {\n    this.onInput(newValue);\n  }\n\n  /**\n   * The earliest date that can be selected by the date input/picker.\n   * If not set there will be no restriction.\n   */\n  @Prop() minDate = '';\n\n  /**\n   * The latest date that can be selected by the date input/picker.\n   * If not set there will be no restriction.\n   */\n  @Prop() maxDate = '';\n\n  /**\n   * Locale identifier (e.g. 'en' or 'de').\n   * The locale is used to translate the labels for weekdays and months.\n   * It also determines the default order of weekdays based on the locale's conventions.\n   * When the locale changes, the weekday labels are rotated according to the `weekStartIndex`.\n   * It does not affect the values returned by methods and events.\n   */\n  @Prop() locale?: string;\n\n  /**\n   * Date format string.\n   * See {@link https://moment.github.io/luxon/#/formatting?id=table-of-tokens} for all available tokens.\n   */\n  @Prop() format: string = 'yyyy/LL/dd';\n\n  /**\n   * Required attribute\n   */\n  @Prop() required?: boolean;\n\n  /**\n   * Helper text below the input field\n   */\n  @Prop() helperText?: string;\n\n  /**\n   * Label of the input field\n   */\n  @Prop() label?: string;\n\n  /**\n   * ARIA label for the calendar icon button\n   * Will be set as aria-label on the nested HTML button element\n   *\n   * @since 3.2.0\n   */\n  @Prop() ariaLabelCalendarButton?: string;\n\n  /**\n   * Error text below the input field\n   */\n  @Prop({ reflect: true }) invalidText?: string;\n\n  /**\n   * Readonly attribute\n   */\n  @Prop() readonly: boolean = false;\n\n  /**\n   * Disabled attribute\n   */\n  @Prop() disabled: boolean = false;\n\n  /**\n   * Info text below the input field\n   */\n  @Prop() infoText?: string;\n\n  /**\n   * Warning text below the input field\n   */\n  @Prop() warningText?: string;\n\n  /**\n   * Valid text below the input field\n   */\n  @Prop() validText?: string;\n\n  /**\n   * Show text as tooltip\n   */\n  @Prop() showTextAsTooltip?: boolean;\n\n  /**\n   * I18n string for the error message when the date is not parsable\n   */\n  @Prop({ attribute: 'i18n-error-date-unparsable' }) i18nErrorDateUnparsable =\n    'Date is not valid';\n\n  /**\n   * Shows week numbers displayed on the left side of the date picker\n   *\n   * @since 3.0.0\n   */\n  @Prop() showWeekNumbers = false;\n\n  /**\n   * The index of which day to start the week on, based on the Locale#weekdays array.\n   * E.g. if the locale is en-us, weekStartIndex = 1 results in starting the week on monday.\n   */\n  @Prop() weekStartIndex = 0;\n\n  /**\n   * ARIA label for the previous month icon button\n   * Will be set as aria-label on the nested HTML button element\n   */\n  @Prop() ariaLabelPreviousMonthButton?: string;\n\n  /**\n   * ARIA label for the next month icon button\n   * Will be set as aria-label on the nested HTML button element\n   */\n  @Prop() ariaLabelNextMonthButton?: string;\n\n  /**\n   * If false, pressing Enter will submit the form (if inside a form).\n   * Set to true to suppress submit on Enter.\n   */\n  @Prop({ reflect: true }) suppressSubmitOnEnter: boolean = false;\n\n  /**\n   * Text alignment within the date input. 'start' aligns the text to the start of the input, 'end' aligns the text to the end of the input.\n   */\n  @Prop() textAlignment: 'start' | 'end' = 'start';\n\n  /**\n   * Input change event.\n   */\n  @Event({ cancelable: false }) valueChange!: EventEmitter<string | undefined>;\n\n  /**\n   * Validation state change event.\n   */\n  @Event() validityStateChange!: EventEmitter<DateInputValidityState>;\n\n  /** @internal */\n  @Event() ixFocus!: EventEmitter<void>;\n\n  /** @internal */\n  @Event() ixBlur!: EventEmitter<void>;\n\n  @State() show = false;\n  @State() from?: string | null = null;\n  @State() isInputInvalid = false;\n  @State() isInvalid = false;\n  @State() isValid = false;\n  @State() isInfo = false;\n  @State() isWarning = false;\n  @State() focus = false;\n\n  private readonly slotStartRef = makeRef<HTMLDivElement>();\n  private readonly slotEndRef = makeRef<HTMLDivElement>();\n\n  private readonly datepickerRef = makeRef<HTMLIxDatePickerElement>();\n\n  private readonly inputElementRef = makeRef<HTMLInputElement>();\n  private readonly dropdownElementRef = makeRef<HTMLIxDropdownElement>();\n  private classObserver?: ClassMutationObserver;\n  private invalidReason?: string;\n  private touched = false;\n\n  private disposableChangesAndVisibilityObservers?: DisposableChangesAndVisibilityObservers;\n\n  updateFormInternalValue(value: string | undefined): void {\n    if (value) {\n      this.formInternals.setFormValue(value);\n    } else {\n      this.formInternals.setFormValue(null);\n    }\n    this.value = value;\n  }\n\n  connectedCallback(): void {\n    this.classObserver = createClassMutationObserver(this.hostElement, () =>\n      this.checkClassList()\n    );\n\n    this.disposableChangesAndVisibilityObservers =\n      addDisposableChangesAndVisibilityObservers(\n        this.hostElement,\n        this.updatePaddings.bind(this)\n      );\n  }\n\n  componentWillLoad(): void {\n    this.onInput(this.value);\n    if (this.isInputInvalid) {\n      this.from = null;\n    } else {\n      this.watchValue();\n    }\n\n    this.checkClassList();\n    this.updateFormInternalValue(this.value);\n  }\n\n  private updatePaddings() {\n    adjustPaddingForStartAndEnd(\n      this.slotStartRef.current,\n      this.slotEndRef.current,\n      this.inputElementRef.current\n    );\n  }\n\n  disconnectedCallback(): void {\n    this.classObserver?.destroy();\n    this.disposableChangesAndVisibilityObservers?.();\n  }\n\n  @Watch('value')\n  watchValue() {\n    this.from = this.value;\n  }\n\n  /** @internal */\n  @Method()\n  hasValidValue(): Promise<boolean> {\n    return Promise.resolve(!!this.value);\n  }\n\n  /** @internal */\n  @Method()\n  getAssociatedFormElement(): Promise<HTMLFormElement | null> {\n    return Promise.resolve(this.formInternals.form);\n  }\n\n  async onInput(value: string | undefined) {\n    this.value = value;\n    if (!value) {\n      this.valueChange.emit(value);\n      return;\n    }\n\n    if (!this.format) {\n      return;\n    }\n\n    const date = DateTime.fromFormat(value, this.format);\n    const minDate = DateTime.fromFormat(this.minDate, this.format);\n    const maxDate = DateTime.fromFormat(this.maxDate, this.format);\n\n    this.isInputInvalid = !date.isValid || date < minDate || date > maxDate;\n\n    if (this.isInputInvalid) {\n      this.invalidReason = date.invalidReason || undefined;\n      this.from = undefined;\n    } else {\n      this.updateFormInternalValue(value);\n      this.closeDropdown();\n    }\n\n    this.valueChange.emit(value);\n  }\n\n  onCalenderClick(event: Event) {\n    handleIconClick(\n      event,\n      this.show,\n      () => this.openDropdown(),\n      this.inputElementRef\n    );\n  }\n\n  async openDropdown() {\n    return openDropdownUtil(this.dropdownElementRef);\n  }\n\n  async closeDropdown() {\n    return closeDropdownUtil(this.dropdownElementRef);\n  }\n\n  private checkClassList() {\n    this.isInvalid = this.hostElement.classList.contains('ix-invalid');\n  }\n\n  private handleInputKeyDown(event: KeyboardEvent) {\n    handleSubmitOnEnterKeydown(\n      event,\n      this.suppressSubmitOnEnter,\n      this.formInternals.form\n    );\n  }\n\n  private renderInput() {\n    return (\n      <div class=\"input-wrapper\">\n        <SlotStart\n          slotStartRef={this.slotStartRef}\n          onSlotChange={() => this.updatePaddings()}\n        ></SlotStart>\n        <input\n          autoComplete=\"off\"\n          class={{\n            'is-invalid': this.isInputInvalid,\n          }}\n          disabled={this.disabled}\n          readOnly={this.readonly}\n          readonly={this.readonly}\n          required={this.required}\n          ref={this.inputElementRef}\n          type=\"text\"\n          value={this.value ?? ''}\n          placeholder={this.placeholder}\n          name={this.name}\n          onInput={(event) => {\n            const target = event.target as HTMLInputElement;\n            this.onInput(target.value);\n          }}\n          onClick={(event) => {\n            if (this.show) {\n              event.stopPropagation();\n              event.preventDefault();\n            }\n          }}\n          onFocus={async () => {\n            this.openDropdown();\n            this.ixFocus.emit();\n          }}\n          onBlur={() => {\n            this.ixBlur.emit();\n            this.touched = true;\n          }}\n          onKeyDown={(event) => this.handleInputKeyDown(event)}\n          style={{\n            textAlign: this.textAlignment,\n          }}\n        ></input>\n        <SlotEnd\n          slotEndRef={this.slotEndRef}\n          onSlotChange={() => this.updatePaddings()}\n        >\n          <ix-icon-button\n            data-testid=\"open-calendar\"\n            class={{ 'calendar-hidden': this.disabled || this.readonly }}\n            variant=\"subtle-tertiary\"\n            icon={iconCalendar}\n            onClick={(event) => this.onCalenderClick(event)}\n            aria-label={this.ariaLabelCalendarButton}\n          ></ix-icon-button>\n        </SlotEnd>\n      </div>\n    );\n  }\n\n  @HookValidationLifecycle()\n  hookValidationLifecycle({\n    isInfo,\n    isInvalid,\n    isInvalidByRequired,\n    isValid,\n    isWarning,\n  }: ValidationResults) {\n    this.isInvalid = isInvalid || isInvalidByRequired || this.isInputInvalid;\n    this.isInfo = isInfo;\n    this.isValid = isValid;\n    this.isWarning = isWarning;\n  }\n\n  @Watch('isInputInvalid')\n  async onInputValidationChange() {\n    const state = await this.getValidityState();\n    this.validityStateChange.emit({\n      patternMismatch: state.patternMismatch,\n      invalidReason: this.invalidReason,\n    });\n  }\n\n  /** @internal */\n  @Method()\n  getValidityState(): Promise<ValidityState> {\n    return Promise.resolve(\n      createValidityState(this.isInputInvalid, !!this.required, this.value)\n    );\n  }\n\n  /**\n   * Get the native input element\n   */\n  @Method()\n  getNativeInputElement(): Promise<HTMLInputElement> {\n    return this.inputElementRef.waitForCurrent();\n  }\n\n  /**\n   * Focuses the input field\n   */\n  @Method()\n  async focusInput(): Promise<void> {\n    return (await this.getNativeInputElement()).focus();\n  }\n\n  /**\n   * Returns whether the text field has been touched.\n   * @internal\n   */\n  @Method()\n  isTouched(): Promise<boolean> {\n    return Promise.resolve(this.touched);\n  }\n\n  render() {\n    const invalidText = this.isInputInvalid\n      ? this.i18nErrorDateUnparsable\n      : this.invalidText;\n\n    return (\n      <Host\n        class={{\n          disabled: this.disabled,\n          readonly: this.readonly,\n        }}\n      >\n        <ix-field-wrapper\n          label={this.label}\n          helperText={this.helperText}\n          isInvalid={this.isInvalid}\n          invalidText={invalidText}\n          infoText={this.infoText}\n          isInfo={this.isInfo}\n          isWarning={this.isWarning}\n          warningText={this.warningText}\n          isValid={this.isValid}\n          validText={this.validText}\n          showTextAsTooltip={this.showTextAsTooltip}\n          required={this.required}\n          controlRef={this.inputElementRef}\n        >\n          {this.renderInput()}\n        </ix-field-wrapper>\n        <ix-dropdown\n          data-testid=\"date-dropdown\"\n          trigger={this.inputElementRef.waitForCurrent()}\n          ref={this.dropdownElementRef}\n          closeBehavior=\"outside\"\n          suppressOverflowBehavior={true}\n          show={this.show}\n          onShowChanged={(event) => {\n            this.show = event.detail;\n          }}\n        >\n          <ix-date-picker\n            ref={this.datepickerRef}\n            format={this.format}\n            locale={this.locale}\n            singleSelection\n            from={this.from ?? ''}\n            minDate={this.minDate}\n            maxDate={this.maxDate}\n            onDateChange={(event) => {\n              const { from } = event.detail;\n              this.onInput(from);\n            }}\n            showWeekNumbers={this.showWeekNumbers}\n            ariaLabelNextMonthButton={this.ariaLabelNextMonthButton}\n            ariaLabelPreviousMonthButton={this.ariaLabelPreviousMonthButton}\n            embedded\n          ></ix-date-picker>\n        </ix-dropdown>\n      </Host>\n    );\n  }\n}\n"],"names":["makeRef","createClassMutationObserver","addDisposableChangesAndVisibilityObservers","adjustPaddingForStartAndEnd","DateTime","handleIconClick","openDropdownUtil","closeDropdownUtil","handleSubmitOnEnterKeydown","h","SlotStart","SlotEnd","iconCalendar","createValidityState","Host","HookValidationLifecycle"],"mappings":"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"}
+{"version":3,"file":"ix-date-input.entry.cjs.js","sources":["src/components/date-input/date-input.scss?tag=ix-date-input&encapsulation=shadow","src/components/date-input/date-input.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@use 'mixins/shadow-dom/component';\n@use 'mixins/input';\n@use './../input/input.mixins.scss' as input-mixins;\n\n@include input-mixins.input-field;\n\n:host {\n  display: inline-block;\n  position: relative;\n\n  @include component.ix-component;\n\n  input {\n    width: 100%;\n    height: 100%;\n  }\n\n  .calendar-hidden {\n    display: none;\n  }\n}\n\n:host(.readonly) {\n  input {\n    pointer-events: none;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { iconCalendar } from '@siemens/ix-icons/icons';\nimport {\n  AttachInternals,\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  Method,\n  Prop,\n  State,\n  Watch,\n  h,\n} from '@stencil/core';\nimport { DateTime } from 'luxon';\nimport { SlotEnd, SlotStart } from '../input/input.fc';\nimport {\n  DisposableChangesAndVisibilityObservers,\n  addDisposableChangesAndVisibilityObservers,\n  adjustPaddingForStartAndEnd,\n  handleSubmitOnEnterKeydown,\n} from '../input/input.util';\nimport {\n  ClassMutationObserver,\n  HookValidationLifecycle,\n  IxInputFieldComponent,\n  ValidationResults,\n  createClassMutationObserver,\n  getValidationText,\n} from '../utils/input';\nimport { makeRef } from '../utils/make-ref';\nimport type { DateInputValidityState } from './date-input.types';\nimport {\n  closeDropdown as closeDropdownUtil,\n  createValidityState,\n  handleIconClick,\n  openDropdown as openDropdownUtil,\n} from '../utils/input/picker-input.util';\n\n/**\n * @form-ready\n *\n * @slot start - Element will be displayed at the start of the input\n * @slot end - Element will be displayed at the end of the input\n */\n@Component({\n  tag: 'ix-date-input',\n  styleUrl: 'date-input.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class DateInput implements IxInputFieldComponent<string | undefined> {\n  @Element() hostElement!: HTMLIxDateInputElement;\n  @AttachInternals() formInternals!: ElementInternals;\n\n  /**\n   * Name of the input element\n   */\n  @Prop({ reflect: true }) name?: string;\n\n  /**\n   * Placeholder of the input element\n   */\n  @Prop({ reflect: true }) placeholder?: string;\n\n  /**\n   * Value of the input element\n   */\n  @Prop({ reflect: true, mutable: true }) value?: string = '';\n\n  @Watch('value') watchValuePropHandler(newValue: string) {\n    this.onInput(newValue);\n  }\n\n  /**\n   * The earliest date that can be selected by the date input/picker.\n   * If not set there will be no restriction.\n   */\n  @Prop() minDate = '';\n\n  /**\n   * The latest date that can be selected by the date input/picker.\n   * If not set there will be no restriction.\n   */\n  @Prop() maxDate = '';\n\n  /**\n   * Locale identifier (e.g. 'en' or 'de').\n   * The locale is used to translate the labels for weekdays and months.\n   * It also determines the default order of weekdays based on the locale's conventions.\n   * When the locale changes, the weekday labels are rotated according to the `weekStartIndex`.\n   * It does not affect the values returned by methods and events.\n   */\n  @Prop() locale?: string;\n\n  /**\n   * Date format string.\n   * See {@link https://moment.github.io/luxon/#/formatting?id=table-of-tokens} for all available tokens.\n   */\n  @Prop() format: string = 'yyyy/LL/dd';\n\n  /**\n   * Required attribute\n   */\n  @Prop() required?: boolean;\n\n  /**\n   * Helper text below the input field\n   */\n  @Prop() helperText?: string;\n\n  /**\n   * Label of the input field\n   */\n  @Prop() label?: string;\n\n  /**\n   * ARIA label for the calendar icon button\n   * Will be set as aria-label on the nested HTML button element\n   *\n   * @since 3.2.0\n   */\n  @Prop() ariaLabelCalendarButton?: string;\n\n  /**\n   * Error text below the input field\n   */\n  @Prop({ reflect: true }) invalidText?: string;\n\n  /**\n   * Readonly attribute\n   */\n  @Prop() readonly: boolean = false;\n\n  /**\n   * Disabled attribute\n   */\n  @Prop() disabled: boolean = false;\n\n  /**\n   * Info text below the input field\n   */\n  @Prop() infoText?: string;\n\n  /**\n   * Warning text below the input field\n   */\n  @Prop() warningText?: string;\n\n  /**\n   * Valid text below the input field\n   */\n  @Prop() validText?: string;\n\n  /**\n   * Show text as tooltip\n   */\n  @Prop() showTextAsTooltip?: boolean;\n\n  /**\n   * I18n string for the error message when the date is not parsable\n   */\n  @Prop({ attribute: 'i18n-error-date-unparsable' }) i18nErrorDateUnparsable =\n    'Date is not valid';\n\n  /**\n   * Shows week numbers displayed on the left side of the date picker\n   *\n   * @since 3.0.0\n   */\n  @Prop() showWeekNumbers = false;\n\n  /**\n   * The index of which day to start the week on, based on the Locale#weekdays array.\n   * E.g. if the locale is en-us, weekStartIndex = 1 results in starting the week on monday.\n   */\n  @Prop() weekStartIndex = 0;\n\n  /**\n   * ARIA label for the previous month icon button\n   * Will be set as aria-label on the nested HTML button element\n   */\n  @Prop() ariaLabelPreviousMonthButton?: string;\n\n  /**\n   * ARIA label for the next month icon button\n   * Will be set as aria-label on the nested HTML button element\n   */\n  @Prop() ariaLabelNextMonthButton?: string;\n\n  /**\n   * If false, pressing Enter will submit the form (if inside a form).\n   * Set to true to suppress submit on Enter.\n   */\n  @Prop({ reflect: true }) suppressSubmitOnEnter: boolean = false;\n\n  /**\n   * Text alignment within the date input. 'start' aligns the text to the start of the input, 'end' aligns the text to the end of the input.\n   */\n  @Prop() textAlignment: 'start' | 'end' = 'start';\n\n  /**\n   * Input change event.\n   */\n  @Event({ cancelable: false }) valueChange!: EventEmitter<string | undefined>;\n\n  /**\n   * Validation state change event.\n   */\n  @Event() validityStateChange!: EventEmitter<DateInputValidityState>;\n\n  /** @internal */\n  @Event() ixFocus!: EventEmitter<void>;\n\n  /** @internal */\n  @Event() ixBlur!: EventEmitter<void>;\n\n  @State() show = false;\n  @State() from?: string | null = null;\n  @State() isInputInvalid = false;\n  @State() isInvalid = false;\n  @State() isValid = false;\n  @State() isInfo = false;\n  @State() isWarning = false;\n  @State() focus = false;\n\n  private readonly slotStartRef = makeRef<HTMLDivElement>();\n  private readonly slotEndRef = makeRef<HTMLDivElement>();\n\n  private readonly datepickerRef = makeRef<HTMLIxDatePickerElement>();\n\n  private readonly inputElementRef = makeRef<HTMLInputElement>();\n  private readonly dropdownElementRef = makeRef<HTMLIxDropdownElement>();\n  private classObserver?: ClassMutationObserver;\n  private invalidReason?: string;\n  private touched = false;\n\n  private disposableChangesAndVisibilityObservers?: DisposableChangesAndVisibilityObservers;\n\n  updateFormInternalValue(value: string | undefined): void {\n    if (value) {\n      this.formInternals.setFormValue(value);\n    } else {\n      this.formInternals.setFormValue(null);\n    }\n    this.value = value;\n  }\n\n  connectedCallback(): void {\n    this.classObserver = createClassMutationObserver(this.hostElement, () =>\n      this.checkClassList()\n    );\n\n    this.disposableChangesAndVisibilityObservers =\n      addDisposableChangesAndVisibilityObservers(\n        this.hostElement,\n        this.updatePaddings.bind(this)\n      );\n  }\n\n  componentWillLoad(): void {\n    this.onInput(this.value);\n    if (this.isInputInvalid) {\n      this.from = null;\n    } else {\n      this.watchValue();\n    }\n\n    this.checkClassList();\n    this.updateFormInternalValue(this.value);\n  }\n\n  private updatePaddings() {\n    adjustPaddingForStartAndEnd(\n      this.slotStartRef.current,\n      this.slotEndRef.current,\n      this.inputElementRef.current\n    );\n  }\n\n  disconnectedCallback(): void {\n    this.classObserver?.destroy();\n    this.disposableChangesAndVisibilityObservers?.();\n  }\n\n  @Watch('value')\n  watchValue() {\n    this.from = this.value;\n  }\n\n  /** @internal */\n  @Method()\n  hasValidValue(): Promise<boolean> {\n    return Promise.resolve(!!this.value);\n  }\n\n  /** @internal */\n  @Method()\n  getAssociatedFormElement(): Promise<HTMLFormElement | null> {\n    return Promise.resolve(this.formInternals.form);\n  }\n\n  async onInput(value: string | undefined) {\n    this.value = value;\n    if (!value) {\n      this.valueChange.emit(value);\n      return;\n    }\n\n    if (!this.format) {\n      return;\n    }\n\n    const date = DateTime.fromFormat(value, this.format);\n    const minDate = DateTime.fromFormat(this.minDate, this.format);\n    const maxDate = DateTime.fromFormat(this.maxDate, this.format);\n\n    this.isInputInvalid = !date.isValid || date < minDate || date > maxDate;\n\n    if (this.isInputInvalid) {\n      this.invalidReason = date.invalidReason || undefined;\n      this.from = undefined;\n    } else {\n      this.updateFormInternalValue(value);\n      this.closeDropdown();\n    }\n\n    this.valueChange.emit(value);\n  }\n\n  onCalenderClick(event: Event) {\n    handleIconClick(\n      event,\n      this.show,\n      () => this.openDropdown(),\n      this.inputElementRef\n    );\n  }\n\n  async openDropdown() {\n    return openDropdownUtil(this.dropdownElementRef);\n  }\n\n  async closeDropdown() {\n    return closeDropdownUtil(this.dropdownElementRef);\n  }\n\n  private checkClassList() {\n    this.isInvalid = this.hostElement.classList.contains('ix-invalid');\n  }\n\n  private handleInputKeyDown(event: KeyboardEvent) {\n    handleSubmitOnEnterKeydown(\n      event,\n      this.suppressSubmitOnEnter,\n      this.formInternals.form\n    );\n  }\n\n  private renderInput() {\n    return (\n      <div class=\"input-wrapper\">\n        <SlotStart\n          slotStartRef={this.slotStartRef}\n          onSlotChange={() => this.updatePaddings()}\n        ></SlotStart>\n        <input\n          autoComplete=\"off\"\n          class={{\n            'is-invalid': this.isInputInvalid,\n          }}\n          disabled={this.disabled}\n          readOnly={this.readonly}\n          readonly={this.readonly}\n          required={this.required}\n          ref={this.inputElementRef}\n          type=\"text\"\n          value={this.value ?? ''}\n          placeholder={this.placeholder}\n          name={this.name}\n          onInput={(event) => {\n            const target = event.target as HTMLInputElement;\n            this.onInput(target.value);\n          }}\n          onClick={(event) => {\n            if (this.show) {\n              event.stopPropagation();\n              event.preventDefault();\n            }\n          }}\n          onFocus={async () => {\n            this.openDropdown();\n            this.ixFocus.emit();\n          }}\n          onBlur={() => {\n            this.ixBlur.emit();\n            this.touched = true;\n          }}\n          onKeyDown={(event) => this.handleInputKeyDown(event)}\n          style={{\n            textAlign: this.textAlignment,\n          }}\n        ></input>\n        <SlotEnd\n          slotEndRef={this.slotEndRef}\n          onSlotChange={() => this.updatePaddings()}\n        >\n          <ix-icon-button\n            data-testid=\"open-calendar\"\n            class={{ 'calendar-hidden': this.disabled || this.readonly }}\n            variant=\"subtle-tertiary\"\n            icon={iconCalendar}\n            onClick={(event) => this.onCalenderClick(event)}\n            aria-label={this.ariaLabelCalendarButton}\n          ></ix-icon-button>\n        </SlotEnd>\n      </div>\n    );\n  }\n\n  @HookValidationLifecycle()\n  hookValidationLifecycle({\n    isInfo,\n    isInvalid,\n    isInvalidByRequired,\n    isValid,\n    isWarning,\n  }: ValidationResults) {\n    this.isInvalid = isInvalid || isInvalidByRequired || this.isInputInvalid;\n    this.isInfo = isInfo;\n    this.isValid = isValid;\n    this.isWarning = isWarning;\n  }\n\n  @Watch('isInputInvalid')\n  async onInputValidationChange() {\n    const state = await this.getValidityState();\n    this.validityStateChange.emit({\n      patternMismatch: state.patternMismatch,\n      invalidReason: this.invalidReason,\n    });\n  }\n\n  /** @internal */\n  @Method()\n  getValidityState(): Promise<ValidityState> {\n    return Promise.resolve(\n      createValidityState(this.isInputInvalid, !!this.required, this.value)\n    );\n  }\n\n  /**\n   * Get the native input element\n   */\n  @Method()\n  getNativeInputElement(): Promise<HTMLInputElement> {\n    return this.inputElementRef.waitForCurrent();\n  }\n\n  /**\n   * Focuses the input field\n   */\n  @Method()\n  async focusInput(): Promise<void> {\n    return (await this.getNativeInputElement()).focus();\n  }\n\n  /**\n   * Returns whether the text field has been touched.\n   * @internal\n   */\n  @Method()\n  isTouched(): Promise<boolean> {\n    return Promise.resolve(this.touched);\n  }\n\n  render() {\n    const invalidText = getValidationText(\n      this.isInputInvalid,\n      this.invalidText,\n      this.i18nErrorDateUnparsable\n    );\n\n    return (\n      <Host\n        class={{\n          disabled: this.disabled,\n          readonly: this.readonly,\n        }}\n      >\n        <ix-field-wrapper\n          label={this.label}\n          helperText={this.helperText}\n          isInvalid={this.isInvalid}\n          invalidText={invalidText}\n          infoText={this.infoText}\n          isInfo={this.isInfo}\n          isWarning={this.isWarning}\n          warningText={this.warningText}\n          isValid={this.isValid}\n          validText={this.validText}\n          showTextAsTooltip={this.showTextAsTooltip}\n          required={this.required}\n          controlRef={this.inputElementRef}\n        >\n          {this.renderInput()}\n        </ix-field-wrapper>\n        <ix-dropdown\n          data-testid=\"date-dropdown\"\n          trigger={this.inputElementRef.waitForCurrent()}\n          ref={this.dropdownElementRef}\n          closeBehavior=\"outside\"\n          suppressOverflowBehavior={true}\n          show={this.show}\n          onShowChanged={(event) => {\n            this.show = event.detail;\n          }}\n        >\n          <ix-date-picker\n            ref={this.datepickerRef}\n            format={this.format}\n            locale={this.locale}\n            singleSelection\n            from={this.from ?? ''}\n            minDate={this.minDate}\n            maxDate={this.maxDate}\n            onDateChange={(event) => {\n              const { from } = event.detail;\n              this.onInput(from);\n            }}\n            showWeekNumbers={this.showWeekNumbers}\n            ariaLabelNextMonthButton={this.ariaLabelNextMonthButton}\n            ariaLabelPreviousMonthButton={this.ariaLabelPreviousMonthButton}\n            embedded\n          ></ix-date-picker>\n        </ix-dropdown>\n      </Host>\n    );\n  }\n}\n"],"names":["makeRef","createClassMutationObserver","addDisposableChangesAndVisibilityObservers","adjustPaddingForStartAndEnd","DateTime","handleIconClick","openDropdownUtil","closeDropdownUtil","handleSubmitOnEnterKeydown","h","SlotStart","SlotEnd","iconCalendar","createValidityState","getValidationText","Host","HookValidationLifecycle"],"mappings":"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"}

package/dist/cjs/ix-datetime-picker.cjs.entry.js

@@ -2,7 +2,7 @@
 
 var index = require('./index-C8Xo8L1k.js');
 
-const datetimePickerCss = ":host{display:block;background-color:var(--theme-menu--background);border-radius:4px;position:relative;width:-moz-min-content;width:min-content}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host{}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host{}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host{}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host{}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host ix-layout-grid{border-radius:0.25rem;box-shadow:var(--theme-shadow-4)}:host ix-time-picker{width:100%}:host .no-padding{padding:0}:host ix-col{display:flex;flex-direction:column;padding:0}:host .flex{display:flex;justify-content:center;flex-direction:column}@media (min-width: 576px){:host{min-width:-moz-max-content;min-width:max-content}:host .btn-select-date-container{display:inline-flex;flex-grow:1}:host .btn-select-date-container ix-button{margin-left:auto;margin-top:auto}:host .min-width{width:-moz-min-content;width:min-content}:host ix-time-picker{width:initial}}:host .individual{box-shadow:none;border:none}:host .btn-select-date-container{padding:1rem}@media (max-width: 576px){:host .btn-select-date-container .btn-select-date{width:100%}}:host .row-separator{border-bottom:1px solid var(--theme-datepicker-separator--background)}:host .col-separator{border-right:1px solid var(--theme-datepicker-separator--background)}";
+const datetimePickerCss = ":host{display:block;background-color:var(--theme-menu--background);border-radius:4px;position:relative;width:-moz-min-content;width:min-content}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host{}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host{}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host{}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host{}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host ix-layout-grid{border-radius:0.25rem;box-shadow:var(--theme-shadow-4)}:host ix-time-picker{width:100%}:host .no-padding{padding:0}:host ix-col{display:flex;flex-direction:column;padding:0}:host .flex{display:flex;justify-content:center;flex-direction:column}:host .row-separator,:host .col-separator{border-bottom:0.0625rem solid var(--theme-datepicker-separator--background)}:host .col-separator{border-right:none}@media (min-width: 576px){:host{min-width:-moz-max-content;min-width:max-content}:host .btn-select-date-container{display:inline-flex;flex-grow:1}:host .btn-select-date-container ix-button{margin-left:auto;margin-top:auto}:host .min-width{width:-moz-min-content;width:min-content}:host ix-time-picker{width:initial}:host .col-separator{border-right:0.0625rem solid var(--theme-datepicker-separator--background);border-bottom:none}}:host .individual{box-shadow:none;border:none}:host .btn-select-date-container{padding:1rem}@media (max-width: 576px){:host .btn-select-date-container .btn-select-date{width:100%}}";
 
 const DatetimePicker = class {
     constructor(hostRef) {

package/dist/cjs/ix-datetime-picker.entry.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"ix-datetime-picker.entry.cjs.js","sources":["src/components/datetime-picker/datetime-picker.scss?tag=ix-datetime-picker&encapsulation=shadow","src/components/datetime-picker/datetime-picker.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@use './common-variables' as vars;\n@use 'mixins/shadow-dom/component';\n\n:host {\n  display: block;\n  background-color: var(--theme-menu--background);\n  border-radius: 4px;\n  position: relative;\n  width: min-content;\n\n  @include component.ix-component;\n\n  ix-layout-grid {\n    border-radius: 0.25rem;\n    box-shadow: var(--theme-shadow-4);\n  }\n\n  ix-time-picker {\n    width: 100%;\n  }\n\n  .no-padding {\n    padding: 0;\n  }\n\n  ix-col {\n    display: flex;\n    flex-direction: column;\n    padding: 0;\n  }\n\n  .flex {\n    display: flex;\n    justify-content: center;\n    flex-direction: column;\n  }\n\n  @media (min-width: 576px) {\n    min-width: max-content;\n\n    .btn-select-date-container {\n      display: inline-flex;\n      flex-grow: 1;\n\n      ix-button {\n        margin-left: auto;\n        margin-top: auto;\n      }\n    }\n\n    .min-width {\n      width: min-content;\n    }\n\n    ix-time-picker {\n      width: initial;\n    }\n  }\n\n  .individual {\n    box-shadow: none;\n    border: none;\n  }\n\n  .btn-select-date-container {\n    padding: vars.$default-space;\n\n    @media (max-width: 576px) {\n      & .btn-select-date {\n        width: 100%;\n      }\n    }\n  }\n\n  .row-separator {\n    border-bottom: 1px solid var(--theme-datepicker-separator--background);\n  }\n\n  .col-separator {\n    border-right: 1px solid var(--theme-datepicker-separator--background);\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\nimport { IxDatePickerComponent } from '../date-picker/date-picker-component';\nimport type { DateChangeEvent } from '../date-picker/date-picker.events';\nimport type {\n  DateTimeDateChangeEvent,\n  DateTimeSelectEvent,\n} from './datetime-picker.types';\n\n@Component({\n  tag: 'ix-datetime-picker',\n  styleUrl: 'datetime-picker.scss',\n  shadow: true,\n})\nexport class DatetimePicker\n  implements Omit<IxDatePickerComponent, 'corners' | 'format'>\n{\n  /**\n   * If true disables date range selection (from/to).\n   */\n  @Prop() singleSelection = false;\n\n  /**\n   * The earliest date that can be selected by the date picker.\n   * If not set there will be no restriction.\n   */\n  @Prop() minDate?: string;\n\n  /**\n   * The latest date that can be selected by the date picker.\n   * If not set there will be no restriction.\n   */\n  @Prop() maxDate?: string;\n\n  /**\n   * Date format string.\n   * See {@link https://moment.github.io/luxon/#/formatting?id=table-of-tokens} for all available tokens.\n   */\n  @Prop() dateFormat: string = 'yyyy/LL/dd';\n\n  /**\n   * Time format string.\n   * See {@link https://moment.github.io/luxon/#/formatting?id=table-of-tokens} for all available tokens.\n   */\n  @Prop() timeFormat: string = 'HH:mm:ss';\n\n  /**\n   * The selected starting date. If the picker is not in range mode this is the selected date.\n   * Format has to match the `format` property.\n   */\n  @Prop() from?: string;\n\n  /**\n   * The selected end date. If the the picker is not in range mode this property has no impact.\n   * Format has to match the `format` property.\n   */\n  @Prop() to?: string;\n\n  /**\n   * Select time with format string\n   */\n  @Prop() time?: string;\n\n  /**\n   * Show time reference input\n   * Time reference is default aligned with @see {this.timeFormat}\n   */\n  @Prop() showTimeReference: boolean = false;\n\n  /**\n   * Set time reference\n   */\n  @Prop() timeReference?: 'AM' | 'PM';\n\n  /**\n   * Text of date select button\n   */\n  @Prop({ attribute: 'i18n-done' }) i18nDone: string = 'Done';\n\n  /**\n   * Top label of time picker\n   *\n   * @since 3.0.0\n   */\n  @Prop({ attribute: 'i18n-time' }) i18nTime: string = 'Time';\n\n  /**\n   * ARIA label for the previous month icon button\n   * Will be set as aria-label on the nested HTML button element\n   */\n  @Prop() ariaLabelPreviousMonthButton?: string;\n\n  /**\n   * ARIA label for the next month icon button\n   * Will be set as aria-label on the nested HTML button element\n   */\n  @Prop() ariaLabelNextMonthButton?: string;\n\n  /**\n   * The index of which day to start the week on, based on the Locale#weekdays array.\n   * E.g. if the locale is en-us, weekStartIndex = 1 results in starting the week on monday.\n   */\n  @Prop() weekStartIndex = 0;\n\n  /**\n   * Format of time string\n   * See {@link https://moment.github.io/luxon/#/formatting?id=table-of-tokens} for all available tokens.\n   */\n  @Prop() locale?: string;\n\n  /**\n   * Shows week numbers displayed on the left side of the date picker\n   *\n   * @since 3.0.0\n   */\n  @Prop() showWeekNumbers = false;\n\n  /**\n   * Time change\n   */\n  @Event() timeChange!: EventEmitter<string>;\n\n  /**\n   * Date change\n   */\n  @Event() dateChange!: EventEmitter<DateTimeDateChangeEvent>;\n\n  /**\n   * Datetime selection event is fired after confirm button is pressed\n   */\n  @Event() dateSelect!: EventEmitter<DateTimeSelectEvent>;\n\n  private datePickerElement?: HTMLIxDatePickerElement;\n  private timePickerElement?: HTMLIxTimePickerElement;\n\n  private async onDone() {\n    const date = await this.datePickerElement?.getCurrentDate();\n    const time = await this.timePickerElement?.getCurrentTime();\n\n    this.dateSelect.emit({\n      from: date?.from ?? '',\n      to: date?.to ?? '',\n      time: time ?? '',\n    });\n  }\n\n  private async onDateChange(event: CustomEvent<string | DateChangeEvent>) {\n    event.preventDefault();\n    event.stopPropagation();\n\n    const { detail: date } = event;\n    this.dateChange.emit(date);\n  }\n\n  private async onTimeChange(event: CustomEvent<string>) {\n    event.preventDefault();\n    event.stopPropagation();\n\n    const { detail: time } = event;\n    this.timeChange.emit(time);\n  }\n\n  render() {\n    return (\n      <Host>\n        <ix-layout-grid class=\"no-padding\">\n          <ix-row class=\"row-separator\">\n            <ix-col class=\"col-separator\">\n              <ix-date-picker\n                ref={(ref) => (this.datePickerElement = ref)}\n                corners=\"left\"\n                singleSelection={this.singleSelection}\n                onDateChange={(event) => this.onDateChange(event)}\n                from={this.from}\n                to={this.to}\n                format={this.dateFormat}\n                minDate={this.minDate}\n                maxDate={this.maxDate}\n                weekStartIndex={this.weekStartIndex}\n                embedded\n                locale={this.locale}\n                showWeekNumbers={this.showWeekNumbers}\n                ariaLabelPreviousMonthButton={this.ariaLabelPreviousMonthButton}\n                ariaLabelNextMonthButton={this.ariaLabelNextMonthButton}\n              ></ix-date-picker>\n            </ix-col>\n\n            <ix-col>\n              <ix-time-picker\n                class=\"min-width\"\n                ref={(ref) => (this.timePickerElement = ref)}\n                embedded\n                dateTimePickerAppearance={true}\n                onTimeChange={(event) => this.onTimeChange(event)}\n                format={this.timeFormat}\n                time={this.time}\n              ></ix-time-picker>\n            </ix-col>\n          </ix-row>\n          <ix-row>\n            <ix-col>\n              <div class=\"btn-select-date-container\">\n                <ix-button\n                  class=\"btn-select-date\"\n                  onClick={() => this.onDone()}\n                >\n                  {this.i18nDone}\n                </ix-button>\n              </div>\n            </ix-col>\n          </ix-row>\n        </ix-layout-grid>\n      </Host>\n    );\n  }\n}\n"],"names":["h","Host"],"mappings":"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"}
+{"version":3,"file":"ix-datetime-picker.entry.cjs.js","sources":["src/components/datetime-picker/datetime-picker.scss?tag=ix-datetime-picker&encapsulation=shadow","src/components/datetime-picker/datetime-picker.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@use './common-variables' as vars;\n@use 'mixins/shadow-dom/component';\n\n:host {\n  display: block;\n  background-color: var(--theme-menu--background);\n  border-radius: 4px;\n  position: relative;\n  width: min-content;\n\n  @include component.ix-component;\n\n  ix-layout-grid {\n    border-radius: 0.25rem;\n    box-shadow: var(--theme-shadow-4);\n  }\n\n  ix-time-picker {\n    width: 100%;\n  }\n\n  .no-padding {\n    padding: 0;\n  }\n\n  ix-col {\n    display: flex;\n    flex-direction: column;\n    padding: 0;\n  }\n\n  .flex {\n    display: flex;\n    justify-content: center;\n    flex-direction: column;\n  }\n\n  .row-separator,\n  .col-separator {\n    border-bottom: 0.0625rem solid var(--theme-datepicker-separator--background);\n  }\n\n  .col-separator {\n    border-right: none;\n  }\n\n  @media (min-width: 576px) {\n    min-width: max-content;\n\n    .btn-select-date-container {\n      display: inline-flex;\n      flex-grow: 1;\n\n      ix-button {\n        margin-left: auto;\n        margin-top: auto;\n      }\n    }\n\n    .min-width {\n      width: min-content;\n    }\n\n    ix-time-picker {\n      width: initial;\n    }\n\n    .col-separator {\n      border-right: 0.0625rem solid\n        var(--theme-datepicker-separator--background);\n      border-bottom: none;\n    }\n  }\n\n  .individual {\n    box-shadow: none;\n    border: none;\n  }\n\n  .btn-select-date-container {\n    padding: vars.$default-space;\n\n    @media (max-width: 576px) {\n      & .btn-select-date {\n        width: 100%;\n      }\n    }\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\nimport { IxDatePickerComponent } from '../date-picker/date-picker-component';\nimport type { DateChangeEvent } from '../date-picker/date-picker.events';\nimport type {\n  DateTimeDateChangeEvent,\n  DateTimeSelectEvent,\n} from './datetime-picker.types';\n\n@Component({\n  tag: 'ix-datetime-picker',\n  styleUrl: 'datetime-picker.scss',\n  shadow: true,\n})\nexport class DatetimePicker\n  implements Omit<IxDatePickerComponent, 'corners' | 'format'>\n{\n  /**\n   * If true disables date range selection (from/to).\n   */\n  @Prop() singleSelection = false;\n\n  /**\n   * The earliest date that can be selected by the date picker.\n   * If not set there will be no restriction.\n   */\n  @Prop() minDate?: string;\n\n  /**\n   * The latest date that can be selected by the date picker.\n   * If not set there will be no restriction.\n   */\n  @Prop() maxDate?: string;\n\n  /**\n   * Date format string.\n   * See {@link https://moment.github.io/luxon/#/formatting?id=table-of-tokens} for all available tokens.\n   */\n  @Prop() dateFormat: string = 'yyyy/LL/dd';\n\n  /**\n   * Time format string.\n   * See {@link https://moment.github.io/luxon/#/formatting?id=table-of-tokens} for all available tokens.\n   */\n  @Prop() timeFormat: string = 'HH:mm:ss';\n\n  /**\n   * The selected starting date. If the picker is not in range mode this is the selected date.\n   * Format has to match the `format` property.\n   */\n  @Prop() from?: string;\n\n  /**\n   * The selected end date. If the the picker is not in range mode this property has no impact.\n   * Format has to match the `format` property.\n   */\n  @Prop() to?: string;\n\n  /**\n   * Select time with format string\n   */\n  @Prop() time?: string;\n\n  /**\n   * Show time reference input\n   * Time reference is default aligned with @see {this.timeFormat}\n   */\n  @Prop() showTimeReference: boolean = false;\n\n  /**\n   * Set time reference\n   */\n  @Prop() timeReference?: 'AM' | 'PM';\n\n  /**\n   * Text of date select button\n   */\n  @Prop({ attribute: 'i18n-done' }) i18nDone: string = 'Done';\n\n  /**\n   * Top label of time picker\n   *\n   * @since 3.0.0\n   */\n  @Prop({ attribute: 'i18n-time' }) i18nTime: string = 'Time';\n\n  /**\n   * ARIA label for the previous month icon button\n   * Will be set as aria-label on the nested HTML button element\n   */\n  @Prop() ariaLabelPreviousMonthButton?: string;\n\n  /**\n   * ARIA label for the next month icon button\n   * Will be set as aria-label on the nested HTML button element\n   */\n  @Prop() ariaLabelNextMonthButton?: string;\n\n  /**\n   * The index of which day to start the week on, based on the Locale#weekdays array.\n   * E.g. if the locale is en-us, weekStartIndex = 1 results in starting the week on monday.\n   */\n  @Prop() weekStartIndex = 0;\n\n  /**\n   * Format of time string\n   * See {@link https://moment.github.io/luxon/#/formatting?id=table-of-tokens} for all available tokens.\n   */\n  @Prop() locale?: string;\n\n  /**\n   * Shows week numbers displayed on the left side of the date picker\n   *\n   * @since 3.0.0\n   */\n  @Prop() showWeekNumbers = false;\n\n  /**\n   * Time change\n   */\n  @Event() timeChange!: EventEmitter<string>;\n\n  /**\n   * Date change\n   */\n  @Event() dateChange!: EventEmitter<DateTimeDateChangeEvent>;\n\n  /**\n   * Datetime selection event is fired after confirm button is pressed\n   */\n  @Event() dateSelect!: EventEmitter<DateTimeSelectEvent>;\n\n  private datePickerElement?: HTMLIxDatePickerElement;\n  private timePickerElement?: HTMLIxTimePickerElement;\n\n  private async onDone() {\n    const date = await this.datePickerElement?.getCurrentDate();\n    const time = await this.timePickerElement?.getCurrentTime();\n\n    this.dateSelect.emit({\n      from: date?.from ?? '',\n      to: date?.to ?? '',\n      time: time ?? '',\n    });\n  }\n\n  private async onDateChange(event: CustomEvent<string | DateChangeEvent>) {\n    event.preventDefault();\n    event.stopPropagation();\n\n    const { detail: date } = event;\n    this.dateChange.emit(date);\n  }\n\n  private async onTimeChange(event: CustomEvent<string>) {\n    event.preventDefault();\n    event.stopPropagation();\n\n    const { detail: time } = event;\n    this.timeChange.emit(time);\n  }\n\n  render() {\n    return (\n      <Host>\n        <ix-layout-grid class=\"no-padding\">\n          <ix-row class=\"row-separator\">\n            <ix-col class=\"col-separator\">\n              <ix-date-picker\n                ref={(ref) => (this.datePickerElement = ref)}\n                corners=\"left\"\n                singleSelection={this.singleSelection}\n                onDateChange={(event) => this.onDateChange(event)}\n                from={this.from}\n                to={this.to}\n                format={this.dateFormat}\n                minDate={this.minDate}\n                maxDate={this.maxDate}\n                weekStartIndex={this.weekStartIndex}\n                embedded\n                locale={this.locale}\n                showWeekNumbers={this.showWeekNumbers}\n                ariaLabelPreviousMonthButton={this.ariaLabelPreviousMonthButton}\n                ariaLabelNextMonthButton={this.ariaLabelNextMonthButton}\n              ></ix-date-picker>\n            </ix-col>\n\n            <ix-col>\n              <ix-time-picker\n                class=\"min-width\"\n                ref={(ref) => (this.timePickerElement = ref)}\n                embedded\n                dateTimePickerAppearance={true}\n                onTimeChange={(event) => this.onTimeChange(event)}\n                format={this.timeFormat}\n                time={this.time}\n              ></ix-time-picker>\n            </ix-col>\n          </ix-row>\n          <ix-row>\n            <ix-col>\n              <div class=\"btn-select-date-container\">\n                <ix-button\n                  class=\"btn-select-date\"\n                  onClick={() => this.onDone()}\n                >\n                  {this.i18nDone}\n                </ix-button>\n              </div>\n            </ix-col>\n          </ix-row>\n        </ix-layout-grid>\n      </Host>\n    );\n  }\n}\n"],"names":["h","Host"],"mappings":";;;;AAAA,MAAM,iBAAiB,GAAG,86DAA86D;;MCsB37D,cAAc,GAAA,MAAA;AAL3B,IAAA,WAAA,CAAA,OAAA,EAAA;;;;;AAQE;;AAEG;AACK,QAAA,IAAe,CAAA,eAAA,GAAG,KAAK;AAc/B;;;AAGG;AACK,QAAA,IAAU,CAAA,UAAA,GAAW,YAAY;AAEzC;;;AAGG;AACK,QAAA,IAAU,CAAA,UAAA,GAAW,UAAU;AAmBvC;;;AAGG;AACK,QAAA,IAAiB,CAAA,iBAAA,GAAY,KAAK;AAO1C;;AAEG;AAC+B,QAAA,IAAQ,CAAA,QAAA,GAAW,MAAM;AAE3D;;;;AAIG;AAC+B,QAAA,IAAQ,CAAA,QAAA,GAAW,MAAM;AAc3D;;;AAGG;AACK,QAAA,IAAc,CAAA,cAAA,GAAG,CAAC;AAQ1B;;;;AAIG;AACK,QAAA,IAAe,CAAA,eAAA,GAAG,KAAK;AAoGhC;AAhFS,IAAA,MAAM,MAAM,GAAA;;AAClB,QAAA,MAAM,IAAI,GAAG,OAAM,CAAA,EAAA,GAAA,IAAI,CAAC,iBAAiB,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,cAAc,EAAE,CAAA;AAC3D,QAAA,MAAM,IAAI,GAAG,OAAM,CAAA,EAAA,GAAA,IAAI,CAAC,iBAAiB,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,cAAc,EAAE,CAAA;AAE3D,QAAA,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC;AACnB,YAAA,IAAI,EAAE,CAAA,EAAA,GAAA,IAAI,KAAJ,IAAA,IAAA,IAAI,uBAAJ,IAAI,CAAE,IAAI,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,EAAE;AACtB,YAAA,EAAE,EAAE,CAAA,EAAA,GAAA,IAAI,KAAJ,IAAA,IAAA,IAAI,uBAAJ,IAAI,CAAE,EAAE,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,EAAE;AAClB,YAAA,IAAI,EAAE,IAAI,KAAA,IAAA,IAAJ,IAAI,KAAJ,MAAA,GAAA,IAAI,GAAI,EAAE;AACjB,SAAA,CAAC;;IAGI,MAAM,YAAY,CAAC,KAA4C,EAAA;QACrE,KAAK,CAAC,cAAc,EAAE;QACtB,KAAK,CAAC,eAAe,EAAE;AAEvB,QAAA,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,KAAK;AAC9B,QAAA,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC;;IAGpB,MAAM,YAAY,CAAC,KAA0B,EAAA;QACnD,KAAK,CAAC,cAAc,EAAE;QACtB,KAAK,CAAC,eAAe,EAAE;AAEvB,QAAA,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,KAAK;AAC9B,QAAA,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC;;IAG5B,MAAM,GAAA;AACJ,QAAA,QACEA,QAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACHD,OAAgB,CAAA,gBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,YAAY,EAAA,EAChCA,OAAQ,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,eAAe,EAAA,EAC3BA,OAAQ,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,eAAe,EAAA,EAC3BA,OACE,CAAA,gBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,GAAG,EAAE,CAAC,GAAG,MAAM,IAAI,CAAC,iBAAiB,GAAG,GAAG,CAAC,EAC5C,OAAO,EAAC,MAAM,EACd,eAAe,EAAE,IAAI,CAAC,eAAe,EACrC,YAAY,EAAE,CAAC,KAAK,KAAK,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,EACjD,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,EAAE,EAAE,IAAI,CAAC,EAAE,EACX,MAAM,EAAE,IAAI,CAAC,UAAU,EACvB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,cAAc,EAAE,IAAI,CAAC,cAAc,EACnC,QAAQ,QACR,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,eAAe,EAAE,IAAI,CAAC,eAAe,EACrC,4BAA4B,EAAE,IAAI,CAAC,4BAA4B,EAC/D,wBAAwB,EAAE,IAAI,CAAC,wBAAwB,EAAA,CACvC,CACX,EAETA,OAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACEA,OACE,CAAA,gBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,WAAW,EACjB,GAAG,EAAE,CAAC,GAAG,MAAM,IAAI,CAAC,iBAAiB,GAAG,GAAG,CAAC,EAC5C,QAAQ,EACR,IAAA,EAAA,wBAAwB,EAAE,IAAI,EAC9B,YAAY,EAAE,CAAC,KAAK,KAAK,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,EACjD,MAAM,EAAE,IAAI,CAAC,UAAU,EACvB,IAAI,EAAE,IAAI,CAAC,IAAI,EACC,CAAA,CACX,CACF,EACTA,OAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACEA,OAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACEA,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,2BAA2B,EAAA,EACpCA,OACE,CAAA,WAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,iBAAiB,EACvB,OAAO,EAAE,MAAM,IAAI,CAAC,MAAM,EAAE,EAE3B,EAAA,IAAI,CAAC,QAAQ,CACJ,CACR,CACC,CACF,CACM,CACZ;;;;;;;"}

package/dist/cjs/ix-field-label_2.cjs.entry.js

@@ -3,7 +3,7 @@
 var index = require('./index-C8Xo8L1k.js');
 var a11y = require('./a11y-B_6chCvu.js');
 var makeRef = require('./make-ref-BaH6_YJk.js');
-var validation = require('./validation-CfL71_0d.js');
+var validation = require('./validation-DTmSqO2d.js');
 var helperTextUtil = require('./helper-text-util-D2W-yNmK.js');
 require('./index-Dyz3z1FD.js');
 

package/dist/cjs/ix-helper-text.cjs.entry.js

@@ -1,7 +1,7 @@
 'use strict';
 
 var index = require('./index-C8Xo8L1k.js');
-var validation = require('./validation-CfL71_0d.js');
+var validation = require('./validation-DTmSqO2d.js');
 var helperTextUtil = require('./helper-text-util-D2W-yNmK.js');
 require('./index-Dyz3z1FD.js');
 

package/dist/cjs/ix-input.cjs.entry.js

@@ -2,9 +2,9 @@
 
 var index = require('./index-C8Xo8L1k.js');
 var index$1 = require('./index-Dyz3z1FD.js');
-var validation = require('./validation-CfL71_0d.js');
+var validation = require('./validation-DTmSqO2d.js');
 var makeRef = require('./make-ref-BaH6_YJk.js');
-var input_fc = require('./input.fc-BzxtQeW-.js');
+var input_fc = require('./input.fc-DrxRYq_G.js');
 require('./a11y-B_6chCvu.js');
 require('./mutation-observer-DE0YMfYu.js');
 require('./rwd.util-GTn-vgCJ.js');

package/dist/cjs/ix-link-button.cjs.entry.js

@@ -3,7 +3,7 @@
 var index = require('./index-C8Xo8L1k.js');
 var index$1 = require('./index-Dyz3z1FD.js');
 
-const linkButtonCss = ":host{display:inline-flex;height:2rem;font-size:0.875rem;font-weight:400;min-width:2rem}:host .link-button{display:inline-flex;position:relative;width:100%;padding:0 0.25rem 0 0;align-items:center;justify-content:center;background-color:transparent;color:var(--theme-color-primary);cursor:pointer;text-decoration:none}:host .link-button .link{display:block;position:relative;width:100%;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}:host .link-button:not(.disabled):not(:disabled){cursor:pointer}:host .link-button:not(.disabled):not(:disabled):hover,:host .link-button:not(.disabled):not(:disabled).hover{color:var(--theme-color-dynamic--hover)}:host .link-button:not(.disabled):not(:disabled):hover .link,:host .link-button:not(.disabled):not(:disabled).hover .link{text-decoration:underline;text-underline-offset:0.2rem}:host .link-button:not(.disabled):not(:disabled){cursor:pointer}:host .link-button:not(.disabled):not(:disabled):active,:host .link-button:not(.disabled):not(:disabled).active{color:var(--theme-color-dynamic--active)}:host .link-button:not(.disabled):not(:disabled):active .link,:host .link-button:not(.disabled):not(:disabled).active .link{text-decoration:underline;text-underline-offset:0.2rem}:host .link-button.disabled{cursor:default;color:var(--theme-color-weak-text)}:host .link-button a{all:unset}:host :focus-visible{outline:1px solid var(--theme-color-focus-bdr)}";
+const linkButtonCss = ":host{display:inline-flex;height:2rem;font-size:0.875rem;font-weight:400;min-width:2rem}:host .link-button{display:inline-flex;position:relative;width:100%;padding:0 0.25rem 0 0;align-items:center;justify-content:center;background-color:transparent;color:var(--theme-color-primary);cursor:pointer;text-decoration:none}:host .link-button .link{display:block;position:relative;width:100%;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;text-decoration:underline;text-underline-offset:0.2rem}:host .link-button:not(.disabled):not(:disabled){cursor:pointer}:host .link-button:not(.disabled):not(:disabled):hover,:host .link-button:not(.disabled):not(:disabled).hover{color:var(--theme-color-dynamic--hover)}:host .link-button:not(.disabled):not(:disabled){cursor:pointer}:host .link-button:not(.disabled):not(:disabled):active,:host .link-button:not(.disabled):not(:disabled).active{color:var(--theme-color-dynamic--active)}:host .link-button.disabled{cursor:default;color:var(--theme-color-weak-text)}:host .link-button a{all:unset}:host :focus-visible{outline:1px solid var(--theme-color-focus-bdr)}";
 
 const LinkButton = class {
     constructor(hostRef) {

package/dist/cjs/ix-link-button.entry.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"ix-link-button.entry.cjs.js","sources":["src/components/link-button/link-button.scss?tag=ix-link-button&encapsulation=shadow","src/components/link-button/link-button.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@use 'common-variables' as vars;\n@use 'mixins/hover';\n\n:host {\n  display: inline-flex;\n  height: vars.$x-large-space;\n  font-size: vars.$font-size-default;\n  font-weight: vars.$font-weight-normal;\n  min-width: vars.$x-large-space;\n\n  .link-button {\n    display: inline-flex;\n    position: relative;\n    width: 100%;\n    padding: 0 vars.$tiny-space 0 0;\n    align-items: center;\n    justify-content: center;\n    background-color: transparent;\n    color: var(--theme-color-primary);\n    cursor: pointer;\n    text-decoration: none;\n\n    .link {\n      display: block;\n      position: relative;\n      width: 100%;\n      white-space: nowrap;\n      text-overflow: ellipsis;\n      overflow: hidden;\n    }\n\n    @include hover.hover {\n      color: var(--theme-color-dynamic--hover);\n\n      .link {\n        text-decoration: underline;\n        text-underline-offset: 0.2rem;\n      }\n    }\n\n    @include hover.active {\n      color: var(--theme-color-dynamic--active);\n\n      .link {\n        text-decoration: underline;\n        text-underline-offset: 0.2rem;\n      }\n    }\n\n    &.disabled {\n      cursor: default;\n      color: var(--theme-color-weak-text);\n    }\n\n    a {\n      all: unset;\n    }\n  }\n\n  :focus-visible {\n    outline: 1px solid var(--theme-color-focus-bdr);\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { iconChevronRightSmall } from '@siemens/ix-icons/icons';\nimport { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'ix-link-button',\n  styleUrl: 'link-button.scss',\n  shadow: true,\n})\nexport class LinkButton {\n  /**\n   * Disable the link button\n   */\n  @Prop() disabled = false;\n\n  /**\n   * Url for the link button\n   */\n  @Prop() url?: string;\n\n  /**\n   * Specifies where to open the link\n   *\n   * https://www.w3schools.com/html/html_links.asp\n   */\n  @Prop() target: '_self' | '_blank' | '_parent' | '_top' = '_self';\n\n  render() {\n    return (\n      <Host>\n        <a\n          title={this.url}\n          tabindex=\"0\"\n          class={{\n            'link-button': true,\n            disabled: this.disabled,\n          }}\n          href={this.disabled ? undefined : this.url}\n          target={this.target}\n        >\n          <ix-icon\n            class=\"icon\"\n            name={iconChevronRightSmall}\n            size=\"16\"\n            aria-hidden=\"true\"\n          ></ix-icon>\n          <div\n            class={{\n              link: true,\n              disabled: this.disabled,\n            }}\n          >\n            <slot></slot>\n          </div>\n        </a>\n      </Host>\n    );\n  }\n}\n"],"names":["h","Host","iconChevronRightSmall"],"mappings":";;;;;AAAA,MAAM,aAAa,GAAG,k4CAAk4C;;MCiB34C,UAAU,GAAA,MAAA;AALvB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAME;;AAEG;AACK,QAAA,IAAQ,CAAA,QAAA,GAAG,KAAK;AAOxB;;;;AAIG;AACK,QAAA,IAAM,CAAA,MAAA,GAA4C,OAAO;AAiClE;IA/BC,MAAM,GAAA;AACJ,QAAA,QACEA,QAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACHD,OACE,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,IAAI,CAAC,GAAG,EACf,QAAQ,EAAC,GAAG,EACZ,KAAK,EAAE;AACL,gBAAA,aAAa,EAAE,IAAI;gBACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ;AACxB,aAAA,EACD,IAAI,EAAE,IAAI,CAAC,QAAQ,GAAG,SAAS,GAAG,IAAI,CAAC,GAAG,EAC1C,MAAM,EAAE,IAAI,CAAC,MAAM,EAAA,EAEnBA,OAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,MAAM,EACZ,IAAI,EAAEE,6BAAqB,EAC3B,IAAI,EAAC,IAAI,EAAA,aAAA,EACG,MAAM,EACT,CAAA,EACXF,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE;AACL,gBAAA,IAAI,EAAE,IAAI;gBACV,QAAQ,EAAE,IAAI,CAAC,QAAQ;AACxB,aAAA,EAAA,EAEDA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACT,CACJ,CACC;;;;;;;"}
+{"version":3,"file":"ix-link-button.entry.cjs.js","sources":["src/components/link-button/link-button.scss?tag=ix-link-button&encapsulation=shadow","src/components/link-button/link-button.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@use 'common-variables' as vars;\n@use 'mixins/hover';\n\n:host {\n  display: inline-flex;\n  height: vars.$x-large-space;\n  font-size: vars.$font-size-default;\n  font-weight: vars.$font-weight-normal;\n  min-width: vars.$x-large-space;\n\n  .link-button {\n    display: inline-flex;\n    position: relative;\n    width: 100%;\n    padding: 0 vars.$tiny-space 0 0;\n    align-items: center;\n    justify-content: center;\n    background-color: transparent;\n    color: var(--theme-color-primary);\n    cursor: pointer;\n    text-decoration: none;\n\n    .link {\n      display: block;\n      position: relative;\n      width: 100%;\n      white-space: nowrap;\n      text-overflow: ellipsis;\n      overflow: hidden;\n      text-decoration: underline;\n      text-underline-offset: 0.2rem;\n    }\n\n    @include hover.hover {\n      color: var(--theme-color-dynamic--hover);\n    }\n\n    @include hover.active {\n      color: var(--theme-color-dynamic--active);\n    }\n\n    &.disabled {\n      cursor: default;\n      color: var(--theme-color-weak-text);\n    }\n\n    a {\n      all: unset;\n    }\n  }\n\n  :focus-visible {\n    outline: 1px solid var(--theme-color-focus-bdr);\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { iconChevronRightSmall } from '@siemens/ix-icons/icons';\nimport { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'ix-link-button',\n  styleUrl: 'link-button.scss',\n  shadow: true,\n})\nexport class LinkButton {\n  /**\n   * Disable the link button\n   */\n  @Prop() disabled = false;\n\n  /**\n   * Url for the link button\n   */\n  @Prop() url?: string;\n\n  /**\n   * Specifies where to open the link\n   *\n   * https://www.w3schools.com/html/html_links.asp\n   */\n  @Prop() target: '_self' | '_blank' | '_parent' | '_top' = '_self';\n\n  render() {\n    return (\n      <Host>\n        <a\n          title={this.url}\n          tabindex=\"0\"\n          class={{\n            'link-button': true,\n            disabled: this.disabled,\n          }}\n          href={this.disabled ? undefined : this.url}\n          target={this.target}\n        >\n          <ix-icon\n            class=\"icon\"\n            name={iconChevronRightSmall}\n            size=\"16\"\n            aria-hidden=\"true\"\n          ></ix-icon>\n          <div\n            class={{\n              link: true,\n              disabled: this.disabled,\n            }}\n          >\n            <slot></slot>\n          </div>\n        </a>\n      </Host>\n    );\n  }\n}\n"],"names":["h","Host","iconChevronRightSmall"],"mappings":";;;;;AAAA,MAAM,aAAa,GAAG,qlCAAqlC;;MCiB9lC,UAAU,GAAA,MAAA;AALvB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAME;;AAEG;AACK,QAAA,IAAQ,CAAA,QAAA,GAAG,KAAK;AAOxB;;;;AAIG;AACK,QAAA,IAAM,CAAA,MAAA,GAA4C,OAAO;AAiClE;IA/BC,MAAM,GAAA;AACJ,QAAA,QACEA,QAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACHD,OACE,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,IAAI,CAAC,GAAG,EACf,QAAQ,EAAC,GAAG,EACZ,KAAK,EAAE;AACL,gBAAA,aAAa,EAAE,IAAI;gBACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ;AACxB,aAAA,EACD,IAAI,EAAE,IAAI,CAAC,QAAQ,GAAG,SAAS,GAAG,IAAI,CAAC,GAAG,EAC1C,MAAM,EAAE,IAAI,CAAC,MAAM,EAAA,EAEnBA,OAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,MAAM,EACZ,IAAI,EAAEE,6BAAqB,EAC3B,IAAI,EAAC,IAAI,EAAA,aAAA,EACG,MAAM,EACT,CAAA,EACXF,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE;AACL,gBAAA,IAAI,EAAE,IAAI;gBACV,QAAQ,EAAE,IAAI,CAAC,QAAQ;AACxB,aAAA,EAAA,EAEDA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACT,CACJ,CACC;;;;;;;"}

package/dist/cjs/ix-number-input.cjs.entry.js

@@ -2,9 +2,9 @@
 
 var index = require('./index-C8Xo8L1k.js');
 var index$1 = require('./index-Dyz3z1FD.js');
-var validation = require('./validation-CfL71_0d.js');
+var validation = require('./validation-DTmSqO2d.js');
 var makeRef = require('./make-ref-BaH6_YJk.js');
-var input_fc = require('./input.fc-BzxtQeW-.js');
+var input_fc = require('./input.fc-DrxRYq_G.js');
 require('./a11y-B_6chCvu.js');
 require('./mutation-observer-DE0YMfYu.js');
 require('./rwd.util-GTn-vgCJ.js');

package/dist/cjs/ix-pagination.cjs.entry.js

@@ -56,6 +56,13 @@ const Pagination = class {
          * i18n label for 'Items'
          */
         this.i18nItems = 'Items';
+        /**
+         * ARIA label for the page selection input
+         * Will be set as aria-label on the nested HTML input element
+         *
+         * @since 4.1.0
+         */
+        this.ariaLabelPageSelection = 'Page selection input';
     }
     selectPage(index) {
         const oldIndex = this.selectedPage;
@@ -145,17 +152,32 @@ const Pagination = class {
         }
         return index.h("span", { class: "page-buttons" }, pageButtons);
     }
+    handlePageInput(inputValue) {
+        const value = Number.parseInt(inputValue, 10);
+        if (!Number.isNaN(value)) {
+            const clampedValue = Math.max(1, Math.min(value, this.count));
+            this.selectPage(clampedValue - 1);
+        }
+    }
     render() {
-        return (index.h(index.Host, { key: '3b7b85de6237c20d4724a61c87bfcdf11cdc541e' }, index.h("ix-icon-button", { key: 'c86d688bb3d1679271f084a3329f001a9c56436f', disabled: !this.count || this.selectedPage === 0, variant: "subtle-tertiary", icon: index$1.iconChevronLeftSmall, onClick: () => this.decrease(), "aria-label": this.ariaLabelChevronLeftIconButton }), this.advanced ? (index.h("div", { class: "advanced-pagination" }, index.h("ix-typography", { format: "body" }, this.i18nPage), index.h("input", { class: "ix-form-control page-selection", type: "number", min: "1", max: this.count, value: this.selectedPage + 1, onChange: (event) => {
-                const eventTarget = event.target;
-                if (eventTarget) {
-                    const index = Number.parseInt(eventTarget.value);
-                    this.selectPage(index - 1);
+        return (index.h(index.Host, { key: 'e9b053fdf801e514af1abef2e163a903f7d5f976' }, index.h("ix-icon-button", { key: 'a880a444f946f7d228a746b8d45d7328bdc26295', disabled: !this.count || this.selectedPage === 0, variant: "subtle-tertiary", icon: index$1.iconChevronLeftSmall, onClick: () => this.decrease(), "aria-label": this.ariaLabelChevronLeftIconButton }), this.advanced ? (index.h("div", { class: "advanced-pagination" }, index.h("ix-typography", { format: "body" }, this.i18nPage), index.h("input", { "aria-label": this.ariaLabelPageSelection, class: "ix-form-control page-selection", type: "number", min: "1", max: this.count, value: this.selectedPage + 1, onChange: (event) => {
+                const inputElement = event.target;
+                this.handlePageInput(inputElement.value);
+            }, onKeyDown: (event) => {
+                if (['e', 'E', '+', '-', '.'].includes(event.key))
+                    event.preventDefault();
+                if (event.key === 'Enter') {
+                    const inputElement = event.target;
+                    this.handlePageInput(inputElement.value);
+                    inputElement.blur();
                 }
-            } }), index.h("span", { class: "total-count" }, index.h("ix-typography", { format: "body" }, this.i18nOf, " ", this.count)))) : (index.h("span", { class: "basic-pagination" }, this.renderPageButtons(), " ")), index.h("ix-icon-button", { key: '79f45cd49b633ad363e419b7993b9e5b5f357584', disabled: !this.count || this.selectedPage === this.count - 1, variant: "subtle-tertiary", icon: index$1.iconChevronRightSmall, onClick: () => this.increase(), "aria-label": this.ariaLabelChevronRightIconButton }), this.advanced && !this.hideItemCount && (index.h("span", { key: '7798393982b1e815e9b711c14fa3cc9dc4401694', class: "item-count" }, index.h("ix-typography", { key: 'e80f02fdb0eaccd6035d4b3942072b3517065c1c', format: "body" }, this.i18nItems), index.h("ix-select", { key: 'a382ad98077334cfedc01777706dce02e94c7fe1', hideListHeader: true, i18nPlaceholder: "", i18nSelectListHeader: "", value: `${this.itemCount}`, onValueChange: (e) => {
+            }, onBlur: (e) => {
+                const inputElement = e.target;
+                inputElement.value = (this.selectedPage + 1).toString();
+            } }), index.h("span", { class: "total-count" }, index.h("ix-typography", { format: "body" }, this.i18nOf, " ", this.count)))) : (index.h("span", { class: "basic-pagination" }, this.renderPageButtons(), " ")), index.h("ix-icon-button", { key: 'dd75eb48382320194812f9eb4c644b7d37f0c84a', disabled: !this.count || this.selectedPage === this.count - 1, variant: "subtle-tertiary", icon: index$1.iconChevronRightSmall, onClick: () => this.increase(), "aria-label": this.ariaLabelChevronRightIconButton }), this.advanced && !this.hideItemCount && (index.h("span", { key: '018574c07720618970be857f7536fdf9b71e1542', class: "item-count" }, index.h("ix-typography", { key: '343a05e008f258ab9a56045cac1a8785c9855169', format: "body" }, this.i18nItems), index.h("ix-select", { key: '2d8a5efe84ea53ea85b9f4c75f1c84800c858846', hideListHeader: true, i18nPlaceholder: "", i18nSelectListHeader: "", value: `${this.itemCount}`, onValueChange: (e) => {
                 const count = Number.parseInt(Array.isArray(e.detail) ? e.detail[0] : e.detail);
                 this.itemCountChanged.emit(count);
-            } }, index.h("ix-select-item", { key: 'b92ffd334dea8716afe032eab22045fb23bda316', label: "10", value: "10" }), index.h("ix-select-item", { key: 'f9073c19c7acc679f5f949a22e99b85e1bcd7206', label: "15", value: "15" }), index.h("ix-select-item", { key: '333413b44060fb4287fc6ae4cd7fe6ea8d0120f6', label: "20", value: "20" }), index.h("ix-select-item", { key: 'ec142ad02ca10f22e35c6da4fb43bc8c8e7328e1', label: "40", value: "40" }), index.h("ix-select-item", { key: '8e26b4508d233d8d42098eb37d4c9d7c9a04c849', label: "100", value: "100" }))))));
+            } }, index.h("ix-select-item", { key: '9106274e93a00e5cb62f7cd19082f43e2920076b', label: "10", value: "10" }), index.h("ix-select-item", { key: '452779779ea63e45d408d60b5faed2d30ea6bcc9', label: "15", value: "15" }), index.h("ix-select-item", { key: '0658cd6473b508ec6c01c83d99bce4bfa8a54940', label: "20", value: "20" }), index.h("ix-select-item", { key: '316b1e9a882ae3a516f8a3ff3997ab0fe95c20de', label: "40", value: "40" }), index.h("ix-select-item", { key: 'a5dbea62134178911100a1fb369d258b0ee74b8d', label: "100", value: "100" }))))));
     }
     get hostElement() { return index.getElement(this); }
 };

package/dist/cjs/ix-pagination.entry.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"ix-pagination.entry.cjs.js","sources":["src/components/pagination/pagination.scss?tag=ix-pagination&encapsulation=shadow","src/components/pagination/pagination.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2022 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@use './common-variables' as vars;\n@use 'legacy/components/forms';\n@use '../icon-button/icon-button';\n@use 'mixins/shadow-dom/component';\n\n:host {\n  @include component.ix-component;\n\n  &,\n  .advanced-pagination,\n  .item-count {\n    display: inline-flex;\n    align-items: center;\n  }\n\n  .basic-pagination {\n    padding: 0 0.125rem;\n  }\n\n  .advanced-pagination {\n    padding: 0 vars.$medium-space;\n  }\n\n  .page-selection {\n    width: 4.125rem;\n    text-align: center;\n    margin: 0 vars.$small-space;\n    -moz-appearance: textfield;\n    -webkit-appearance: textfield;\n  }\n\n  .page-buttons {\n    white-space: nowrap;\n  }\n\n  .total-count {\n    white-space: nowrap;\n  }\n\n  .item-count {\n    flex-grow: 1;\n    justify-content: flex-end;\n    margin-inline-start: vars.$large-space;\n\n    ix-select {\n      width: 4.5rem;\n      margin-inline-start: vars.$large-space;\n    }\n  }\n\n  button {\n    width: auto;\n    min-width: 2rem;\n    height: 2rem;\n    padding: 0 0.5rem;\n  }\n\n  button + button {\n    margin-inline-start: 0.125rem;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2022 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Prop,\n} from '@stencil/core';\nimport { BaseButton, BaseButtonProps } from '../button/base-button';\nimport { a11yBoolean } from '../utils/a11y';\nimport {\n  iconChevronLeftSmall,\n  iconChevronRightSmall,\n} from '@siemens/ix-icons/icons';\n\n@Component({\n  tag: 'ix-pagination',\n  styleUrl: 'pagination.scss',\n  shadow: true,\n})\nexport class Pagination {\n  private readonly baseButtonConfig: BaseButtonProps = {\n    variant: 'subtle-tertiary',\n    iconOnly: true,\n    iconOval: false,\n    disabled: false,\n    icon: '',\n    loading: false,\n    selected: false,\n    type: 'button',\n  };\n\n  private readonly maxCountPages = 7;\n\n  @Element() hostElement!: HTMLIxPaginationElement;\n\n  /**\n   * Advanced mode\n   */\n  @Prop() advanced = false;\n\n  /**\n   * Number of items shown at once.\n   * Can only be changed in advaced mode.\n   */\n  @Prop() itemCount = 15;\n\n  /**\n   * Hide item count in advanced mode\n   */\n  @Prop() hideItemCount = false;\n\n  /**\n   * Total number of pages\n   */\n  @Prop() count: number = 0;\n\n  /**\n   * Zero based index of currently selected page\n   */\n  @Prop({ mutable: true }) selectedPage = 0;\n\n  /**\n   * i18n label for 'Page'\n   */\n  @Prop({ attribute: 'i18n-page' }) i18nPage = 'Page';\n\n  /**\n   * i18n label for 'of'\n   */\n  @Prop({ attribute: 'i18n-of' }) i18nOf = 'of';\n\n  /**\n   * i18n label for 'Items'\n   */\n  @Prop({ attribute: 'i18n-items' }) i18nItems = 'Items';\n\n  /**\n   * ARIA label for the chevron left icon button\n   * Will be set as aria-label on the nested HTML button element\n   *\n   * @since 3.2.0\n   */\n  @Prop() ariaLabelChevronLeftIconButton?: string;\n\n  /**\n   * ARIA label for the chevron right icon button\n   * Will be set as aria-label on the nested HTML button element\n   *\n   * @since 3.2.0\n   */\n  @Prop() ariaLabelChevronRightIconButton?: string;\n\n  /**\n   * Page selection event\n   */\n  @Event() pageSelected!: EventEmitter<number>;\n\n  /**\n   * Item count change event\n   */\n  @Event() itemCountChanged!: EventEmitter<number>;\n\n  private selectPage(index: number) {\n    const oldIndex = this.selectedPage;\n\n    if (index < 0) {\n      this.selectedPage = 0;\n    } else if (index > this.count - 1) {\n      this.selectedPage = this.count - 1;\n    } else {\n      this.selectedPage = index;\n    }\n\n    const { defaultPrevented } = this.pageSelected.emit(this.selectedPage);\n\n    if (defaultPrevented) {\n      this.selectedPage = oldIndex;\n    }\n  }\n\n  private increase() {\n    if (this.selectedPage === this.count - 1) {\n      return;\n    }\n\n    this.selectPage(this.selectedPage + 1);\n  }\n\n  private decrease() {\n    if (this.selectedPage === 0) {\n      return;\n    }\n\n    this.selectPage(this.selectedPage - 1);\n  }\n\n  private getPageButton(index: number) {\n    const baseButtonProps: BaseButtonProps = {\n      ...this.baseButtonConfig,\n      onClick: () => this.selectPage(index),\n      selected: this.selectedPage === index,\n      ariaAttributes: {\n        'aria-pressed': a11yBoolean(this.selectedPage === index),\n      },\n    };\n\n    return <BaseButton {...baseButtonProps}>{index + 1}</BaseButton>;\n  }\n\n  private renderPageButtons() {\n    const pagesBeforeOverflow = Math.floor(this.maxCountPages / 2);\n    const hasOverflow = this.count > this.maxCountPages;\n    const hasOverflowStart =\n      hasOverflow && this.selectedPage > pagesBeforeOverflow;\n    const hasOverflowEnd =\n      hasOverflow && this.selectedPage < this.count - pagesBeforeOverflow - 1;\n    const pageButtons = [];\n\n    let start = 0;\n    let end = Math.min(this.count, this.maxCountPages);\n    let pageCount = Math.floor((this.maxCountPages - 4) / 2);\n\n    if (hasOverflowStart) {\n      const baseButtonProps = {\n        ...this.baseButtonConfig,\n        onClick: () => {\n          if (hasOverflowEnd) {\n            this.selectPage(this.selectedPage - Math.max(0, 2 * pageCount + 1));\n          } else {\n            this.selectPage(this.count - this.maxCountPages);\n          }\n        },\n      };\n      pageButtons.push(this.getPageButton(0));\n      pageButtons.push(<BaseButton {...baseButtonProps}>...</BaseButton>);\n\n      if (hasOverflowEnd) {\n        start = this.count - this.maxCountPages + 2;\n      } else {\n        start = this.count - this.maxCountPages + 2;\n        end = this.count;\n      }\n    }\n\n    if (hasOverflowEnd) {\n      if (hasOverflowStart) {\n        start = this.selectedPage - pageCount;\n        end = this.selectedPage + pageCount + 1;\n      } else {\n        end = this.maxCountPages - 2;\n      }\n    }\n\n    for (let i = start; i < end; i++) {\n      pageButtons.push(this.getPageButton(i));\n    }\n\n    if (hasOverflowEnd) {\n      const baseButtonProps = {\n        ...this.baseButtonConfig,\n        onClick: () => {\n          if (hasOverflowStart) {\n            this.selectPage(this.selectedPage + Math.max(0, 2 * pageCount + 1));\n          } else {\n            this.selectPage(this.maxCountPages - 1);\n          }\n        },\n      };\n      pageButtons.push(<BaseButton {...baseButtonProps}>...</BaseButton>);\n      pageButtons.push(this.getPageButton(this.count - 1));\n    }\n\n    return <span class=\"page-buttons\">{pageButtons}</span>;\n  }\n\n  render() {\n    return (\n      <Host>\n        <ix-icon-button\n          disabled={!this.count || this.selectedPage === 0}\n          variant=\"subtle-tertiary\"\n          icon={iconChevronLeftSmall}\n          onClick={() => this.decrease()}\n          aria-label={this.ariaLabelChevronLeftIconButton}\n        ></ix-icon-button>\n\n        {this.advanced ? (\n          <div class=\"advanced-pagination\">\n            <ix-typography format=\"body\">{this.i18nPage}</ix-typography>\n            <input\n              class=\"ix-form-control page-selection\"\n              type=\"number\"\n              min=\"1\"\n              max={this.count}\n              value={this.selectedPage + 1}\n              onChange={(event: Event) => {\n                const eventTarget = event.target as HTMLInputElement;\n                if (eventTarget) {\n                  const index = Number.parseInt(eventTarget.value);\n                  this.selectPage(index - 1);\n                }\n              }}\n            />\n            <span class=\"total-count\">\n              <ix-typography format=\"body\">\n                {this.i18nOf} {this.count}\n              </ix-typography>\n            </span>\n          </div>\n        ) : (\n          <span class=\"basic-pagination\">{this.renderPageButtons()} </span>\n        )}\n\n        <ix-icon-button\n          disabled={!this.count || this.selectedPage === this.count - 1}\n          variant=\"subtle-tertiary\"\n          icon={iconChevronRightSmall}\n          onClick={() => this.increase()}\n          aria-label={this.ariaLabelChevronRightIconButton}\n        ></ix-icon-button>\n\n        {this.advanced && !this.hideItemCount && (\n          <span class=\"item-count\">\n            <ix-typography format=\"body\">{this.i18nItems}</ix-typography>\n            <ix-select\n              hideListHeader\n              i18nPlaceholder=\"\"\n              i18nSelectListHeader=\"\"\n              value={`${this.itemCount}`}\n              onValueChange={(e) => {\n                const count = Number.parseInt(\n                  Array.isArray(e.detail) ? e.detail[0] : e.detail\n                );\n\n                this.itemCountChanged.emit(count);\n              }}\n            >\n              <ix-select-item label=\"10\" value=\"10\"></ix-select-item>\n              <ix-select-item label=\"15\" value=\"15\"></ix-select-item>\n              <ix-select-item label=\"20\" value=\"20\"></ix-select-item>\n              <ix-select-item label=\"40\" value=\"40\"></ix-select-item>\n              <ix-select-item label=\"100\" value=\"100\"></ix-select-item>\n            </ix-select>\n          </span>\n        )}\n      </Host>\n    );\n  }\n}\n"],"names":["index","a11yBoolean","h","BaseButton","Host","iconChevronLeftSmall","iconChevronRightSmall"],"mappings":"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"}
+{"version":3,"file":"ix-pagination.entry.cjs.js","sources":["src/components/pagination/pagination.scss?tag=ix-pagination&encapsulation=shadow","src/components/pagination/pagination.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2022 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@use './common-variables' as vars;\n@use 'legacy/components/forms';\n@use '../icon-button/icon-button';\n@use 'mixins/shadow-dom/component';\n\n:host {\n  @include component.ix-component;\n\n  &,\n  .advanced-pagination,\n  .item-count {\n    display: inline-flex;\n    align-items: center;\n  }\n\n  .basic-pagination {\n    padding: 0 0.125rem;\n  }\n\n  .advanced-pagination {\n    padding: 0 vars.$medium-space;\n  }\n\n  .page-selection {\n    width: 4.125rem;\n    text-align: center;\n    margin: 0 vars.$small-space;\n    -moz-appearance: textfield;\n    -webkit-appearance: textfield;\n  }\n\n  .page-buttons {\n    white-space: nowrap;\n  }\n\n  .total-count {\n    white-space: nowrap;\n  }\n\n  .item-count {\n    flex-grow: 1;\n    justify-content: flex-end;\n    margin-inline-start: vars.$large-space;\n\n    ix-select {\n      width: 4.5rem;\n      margin-inline-start: vars.$large-space;\n    }\n  }\n\n  button {\n    width: auto;\n    min-width: 2rem;\n    height: 2rem;\n    padding: 0 0.5rem;\n  }\n\n  button + button {\n    margin-inline-start: 0.125rem;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2022 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Prop,\n} from '@stencil/core';\nimport { BaseButton, BaseButtonProps } from '../button/base-button';\nimport { a11yBoolean } from '../utils/a11y';\nimport {\n  iconChevronLeftSmall,\n  iconChevronRightSmall,\n} from '@siemens/ix-icons/icons';\n\n@Component({\n  tag: 'ix-pagination',\n  styleUrl: 'pagination.scss',\n  shadow: true,\n})\nexport class Pagination {\n  private readonly baseButtonConfig: BaseButtonProps = {\n    variant: 'subtle-tertiary',\n    iconOnly: true,\n    iconOval: false,\n    disabled: false,\n    icon: '',\n    loading: false,\n    selected: false,\n    type: 'button',\n  };\n\n  private readonly maxCountPages = 7;\n\n  @Element() hostElement!: HTMLIxPaginationElement;\n\n  /**\n   * Advanced mode\n   */\n  @Prop() advanced = false;\n\n  /**\n   * Number of items shown at once.\n   * Can only be changed in advaced mode.\n   */\n  @Prop() itemCount = 15;\n\n  /**\n   * Hide item count in advanced mode\n   */\n  @Prop() hideItemCount = false;\n\n  /**\n   * Total number of pages\n   */\n  @Prop() count: number = 0;\n\n  /**\n   * Zero based index of currently selected page\n   */\n  @Prop({ mutable: true }) selectedPage = 0;\n\n  /**\n   * i18n label for 'Page'\n   */\n  @Prop({ attribute: 'i18n-page' }) i18nPage = 'Page';\n\n  /**\n   * i18n label for 'of'\n   */\n  @Prop({ attribute: 'i18n-of' }) i18nOf = 'of';\n\n  /**\n   * i18n label for 'Items'\n   */\n  @Prop({ attribute: 'i18n-items' }) i18nItems = 'Items';\n\n  /**\n   * ARIA label for the chevron left icon button\n   * Will be set as aria-label on the nested HTML button element\n   *\n   * @since 3.2.0\n   */\n  @Prop() ariaLabelChevronLeftIconButton?: string;\n\n  /**\n   * ARIA label for the chevron right icon button\n   * Will be set as aria-label on the nested HTML button element\n   *\n   * @since 3.2.0\n   */\n  @Prop() ariaLabelChevronRightIconButton?: string;\n\n  /**\n   * ARIA label for the page selection input\n   * Will be set as aria-label on the nested HTML input element\n   *\n   * @since 4.1.0\n   */\n  @Prop() ariaLabelPageSelection = 'Page selection input';\n  /**\n   * Page selection event\n   */\n  @Event() pageSelected!: EventEmitter<number>;\n\n  /**\n   * Item count change event\n   */\n  @Event() itemCountChanged!: EventEmitter<number>;\n\n  private selectPage(index: number) {\n    const oldIndex = this.selectedPage;\n\n    if (index < 0) {\n      this.selectedPage = 0;\n    } else if (index > this.count - 1) {\n      this.selectedPage = this.count - 1;\n    } else {\n      this.selectedPage = index;\n    }\n\n    const { defaultPrevented } = this.pageSelected.emit(this.selectedPage);\n\n    if (defaultPrevented) {\n      this.selectedPage = oldIndex;\n    }\n  }\n\n  private increase() {\n    if (this.selectedPage === this.count - 1) {\n      return;\n    }\n\n    this.selectPage(this.selectedPage + 1);\n  }\n\n  private decrease() {\n    if (this.selectedPage === 0) {\n      return;\n    }\n\n    this.selectPage(this.selectedPage - 1);\n  }\n\n  private getPageButton(index: number) {\n    const baseButtonProps: BaseButtonProps = {\n      ...this.baseButtonConfig,\n      onClick: () => this.selectPage(index),\n      selected: this.selectedPage === index,\n      ariaAttributes: {\n        'aria-pressed': a11yBoolean(this.selectedPage === index),\n      },\n    };\n\n    return <BaseButton {...baseButtonProps}>{index + 1}</BaseButton>;\n  }\n\n  private renderPageButtons() {\n    const pagesBeforeOverflow = Math.floor(this.maxCountPages / 2);\n    const hasOverflow = this.count > this.maxCountPages;\n    const hasOverflowStart =\n      hasOverflow && this.selectedPage > pagesBeforeOverflow;\n    const hasOverflowEnd =\n      hasOverflow && this.selectedPage < this.count - pagesBeforeOverflow - 1;\n    const pageButtons = [];\n\n    let start = 0;\n    let end = Math.min(this.count, this.maxCountPages);\n    let pageCount = Math.floor((this.maxCountPages - 4) / 2);\n\n    if (hasOverflowStart) {\n      const baseButtonProps = {\n        ...this.baseButtonConfig,\n        onClick: () => {\n          if (hasOverflowEnd) {\n            this.selectPage(this.selectedPage - Math.max(0, 2 * pageCount + 1));\n          } else {\n            this.selectPage(this.count - this.maxCountPages);\n          }\n        },\n      };\n      pageButtons.push(this.getPageButton(0));\n      pageButtons.push(<BaseButton {...baseButtonProps}>...</BaseButton>);\n\n      if (hasOverflowEnd) {\n        start = this.count - this.maxCountPages + 2;\n      } else {\n        start = this.count - this.maxCountPages + 2;\n        end = this.count;\n      }\n    }\n\n    if (hasOverflowEnd) {\n      if (hasOverflowStart) {\n        start = this.selectedPage - pageCount;\n        end = this.selectedPage + pageCount + 1;\n      } else {\n        end = this.maxCountPages - 2;\n      }\n    }\n\n    for (let i = start; i < end; i++) {\n      pageButtons.push(this.getPageButton(i));\n    }\n\n    if (hasOverflowEnd) {\n      const baseButtonProps = {\n        ...this.baseButtonConfig,\n        onClick: () => {\n          if (hasOverflowStart) {\n            this.selectPage(this.selectedPage + Math.max(0, 2 * pageCount + 1));\n          } else {\n            this.selectPage(this.maxCountPages - 1);\n          }\n        },\n      };\n      pageButtons.push(<BaseButton {...baseButtonProps}>...</BaseButton>);\n      pageButtons.push(this.getPageButton(this.count - 1));\n    }\n\n    return <span class=\"page-buttons\">{pageButtons}</span>;\n  }\n\n  private handlePageInput(inputValue: string) {\n    const value = Number.parseInt(inputValue, 10);\n    if (!Number.isNaN(value)) {\n      const clampedValue = Math.max(1, Math.min(value, this.count));\n      this.selectPage(clampedValue - 1);\n    }\n  }\n\n  render() {\n    return (\n      <Host>\n        <ix-icon-button\n          disabled={!this.count || this.selectedPage === 0}\n          variant=\"subtle-tertiary\"\n          icon={iconChevronLeftSmall}\n          onClick={() => this.decrease()}\n          aria-label={this.ariaLabelChevronLeftIconButton}\n        ></ix-icon-button>\n\n        {this.advanced ? (\n          <div class=\"advanced-pagination\">\n            <ix-typography format=\"body\">{this.i18nPage}</ix-typography>\n            <input\n              aria-label={this.ariaLabelPageSelection}\n              class=\"ix-form-control page-selection\"\n              type=\"number\"\n              min=\"1\"\n              max={this.count}\n              value={this.selectedPage + 1}\n              onChange={(event: Event) => {\n                const inputElement = event.target as HTMLInputElement;\n                this.handlePageInput(inputElement.value);\n              }}\n              onKeyDown={(event: KeyboardEvent) => {\n                if (['e', 'E', '+', '-', '.'].includes(event.key))\n                  event.preventDefault();\n                if (event.key === 'Enter') {\n                  const inputElement = event.target as HTMLInputElement;\n                  this.handlePageInput(inputElement.value);\n                  inputElement.blur();\n                }\n              }}\n              onBlur={(e: Event) => {\n                const inputElement = e.target as HTMLInputElement;\n                inputElement.value = (this.selectedPage + 1).toString();\n              }}\n            />\n            <span class=\"total-count\">\n              <ix-typography format=\"body\">\n                {this.i18nOf} {this.count}\n              </ix-typography>\n            </span>\n          </div>\n        ) : (\n          <span class=\"basic-pagination\">{this.renderPageButtons()} </span>\n        )}\n\n        <ix-icon-button\n          disabled={!this.count || this.selectedPage === this.count - 1}\n          variant=\"subtle-tertiary\"\n          icon={iconChevronRightSmall}\n          onClick={() => this.increase()}\n          aria-label={this.ariaLabelChevronRightIconButton}\n        ></ix-icon-button>\n\n        {this.advanced && !this.hideItemCount && (\n          <span class=\"item-count\">\n            <ix-typography format=\"body\">{this.i18nItems}</ix-typography>\n            <ix-select\n              hideListHeader\n              i18nPlaceholder=\"\"\n              i18nSelectListHeader=\"\"\n              value={`${this.itemCount}`}\n              onValueChange={(e) => {\n                const count = Number.parseInt(\n                  Array.isArray(e.detail) ? e.detail[0] : e.detail\n                );\n\n                this.itemCountChanged.emit(count);\n              }}\n            >\n              <ix-select-item label=\"10\" value=\"10\"></ix-select-item>\n              <ix-select-item label=\"15\" value=\"15\"></ix-select-item>\n              <ix-select-item label=\"20\" value=\"20\"></ix-select-item>\n              <ix-select-item label=\"40\" value=\"40\"></ix-select-item>\n              <ix-select-item label=\"100\" value=\"100\"></ix-select-item>\n            </ix-select>\n          </span>\n        )}\n      </Host>\n    );\n  }\n}\n"],"names":["index","a11yBoolean","h","BaseButton","Host","iconChevronLeftSmall","iconChevronRightSmall"],"mappings":"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"}

package/dist/cjs/ix-radio-group.cjs.entry.js

@@ -1,7 +1,7 @@
 'use strict';
 
 var index = require('./index-C8Xo8L1k.js');
-var validation = require('./validation-CfL71_0d.js');
+var validation = require('./validation-DTmSqO2d.js');
 var makeRef = require('./make-ref-BaH6_YJk.js');
 
 const radioGroupCss = ":host{display:inline-block;position:relative}:host .checkbox-container{display:flex;flex-direction:column;gap:0.5rem 1rem;margin:0.375rem 0;flex-wrap:wrap}:host .checkbox-container.row-layout{flex-direction:row}";

package/dist/cjs/ix-radio.cjs.entry.js

@@ -2,7 +2,7 @@
 
 var index = require('./index-C8Xo8L1k.js');
 var a11y = require('./a11y-B_6chCvu.js');
-var validation = require('./validation-CfL71_0d.js');
+var validation = require('./validation-DTmSqO2d.js');
 
 const radioCss = ":host{display:inline-block;position:relative}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host{}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host{}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host{}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host{}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .radio-checkmark{all:unset;display:inline-flex;position:relative;align-items:center;justify-content:center;width:1.125rem;min-width:1.125rem;max-width:1.125rem;height:1.125rem;min-height:1.125rem;max-height:1.125rem;border:1px solid white;border-radius:100px}:host .radio-button{height:1.5rem;width:1.5rem;display:flex;align-items:center;justify-content:center}:host label{display:flex;justify-content:flex-start;align-items:center;width:100%;height:100%}:host .checkmark{border-radius:100px;background-color:var(--theme-color-primary--contrast);width:0.5rem;height:0.5rem}:host .radio-checkmark{background-color:var(--theme-radiobtn-unchecked--background);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-unchecked--border-color)}:host(:hover) .radio-checkmark{background-color:var(--theme-radiobtn-unchecked--background--hover);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-unchecked--border-color--hover)}:host(:active) .radio-checkmark{background-color:var(--theme-radiobtn-unchecked--background--active);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-unchecked--border-color--active)}:host(.checked) .radio-checkmark,:host([indeterminate]) .radio-checkmark{background-color:var(--theme-radiobtn-checked--background);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-checked--border-color)}:host(.checked:hover) .radio-checkmark,:host([indeterminate]:hover) .radio-checkmark{background-color:var(--theme-radiobtn-checked--background--hover);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-checked--border-color--hover)}:host(.checked:active) .radio-checkmark,:host([indeterminate]:active) .radio-checkmark{background-color:var(--theme-radiobtn-checked--background--active);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-checked--border-color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .radio-checkmark{background-color:var(--theme-radiobtn-unchecked--background--disabled);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-unchecked--border-color--disabled)}:host(.checked.disabled) .radio-checkmark,:host([indeterminate].disabled) .radio-checkmark{background-color:var(--theme-radiobtn-checked--background--disabled);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-checked--border-color--disabled)}:host(:focus-visible){outline:0.0625rem solid var(--theme-color-focus-bdr);outline-offset:var(--theme-radiobtn--focus--outline-offset)}ix-typography{margin:0.125rem 0 0.125rem 0.5rem}:host(.ix-info:not(.disabled)) .radio-checkmark{--theme-radiobtn-unchecked--background:var(\n    --theme-radiobtn-unchecked--background--info\n  );--theme-radiobtn-unchecked--background--hover:var(\n    --theme-radiobtn-unchecked--background--info--hover\n  );--theme-radiobtn-unchecked--background--active:var(\n    --theme-radiobtn-unchecked--background--info--active\n  );--theme-radiobtn-unchecked--border-color:var(\n    --theme-radiobtn-unchecked--border-color--info\n  );--theme-radiobtn-unchecked--border-color--hover:var(\n    --theme-radiobtn-unchecked--border-color--info--hover\n  );--theme-radiobtn-unchecked--border-color--active:var(\n    --theme-radiobtn-unchecked--border-color--info--active\n  );--theme-radiobtn-checked--background:var(\n    --theme-radiobtn-checked--background--info\n  );--theme-radiobtn-checked--background--hover:var(\n    --theme-radiobtn-checked--background--info--hover\n  );--theme-radiobtn-checked--background--active:var(\n    --theme-radiobtn-checked--background--info--active\n  );--theme-radiobtn-checked--border-color:var(\n    --theme-radiobtn-checked--border-color--info\n  );--theme-radiobtn-checked--border-color--hover:var(\n    --theme-radiobtn-checked--border-color--info--hover\n  );--theme-radiobtn-checked--border-color--active:var(\n    --theme-radiobtn-checked--border-color--info--active\n  );--theme-radiobtn-mixed--background:var(\n    --theme-radiobtn-mixed--background--info\n  );--theme-radiobtn-mixed--background--hover:var(\n    --theme-radiobtn-mixed--background--info--hover\n  );--theme-radiobtn-mixed--background--active:var(\n    --theme-radiobtn-mixed--background--info--active\n  );--theme-radiobtn-mixed--border-color:var(\n    --theme-radiobtn-mixed--border-color--info\n  );--theme-radiobtn-mixed--border-color--hover:var(\n    --theme-radiobtn-mixed--border-color--info--hover\n  );--theme-radiobtn-mixed--border-color--active:var(\n    --theme-radiobtn-mixed--border-color--info--active\n  )}:host(.ix-info) .radio-checkmark{background-color:var(--theme-radiobtn-unchecked--background);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-unchecked--border-color)}:host(.ix-info:hover) .radio-checkmark{background-color:var(--theme-radiobtn-unchecked--background--hover);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-unchecked--border-color--hover)}:host(.ix-info:active) .radio-checkmark{background-color:var(--theme-radiobtn-unchecked--background--active);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-unchecked--border-color--active)}:host(.ix-info.checked) .radio-checkmark,:host(.ix-info[indeterminate]) .radio-checkmark{background-color:var(--theme-radiobtn-checked--background);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-checked--border-color)}:host(.ix-info.checked:hover) .radio-checkmark,:host(.ix-info[indeterminate]:hover) .radio-checkmark{background-color:var(--theme-radiobtn-checked--background--hover);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-checked--border-color--hover)}:host(.ix-info.checked:active) .radio-checkmark,:host(.ix-info[indeterminate]:active) .radio-checkmark{background-color:var(--theme-radiobtn-checked--background--active);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-checked--border-color--active)}:host(.ix-info.disabled) .radio-checkmark{background-color:var(--theme-radiobtn-unchecked--background--disabled);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-unchecked--border-color--disabled)}:host(.ix-info.checked.disabled) .radio-checkmark,:host(.ix-info[indeterminate].disabled) .radio-checkmark{background-color:var(--theme-radiobtn-checked--background--disabled);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-checked--border-color--disabled)}:host(.ix-warning:not(.disabled)) .radio-checkmark{--theme-radiobtn-unchecked--background:var(\n    --theme-radiobtn-unchecked--background--warning\n  );--theme-radiobtn-unchecked--background--hover:var(\n    --theme-radiobtn-unchecked--background--warning--hover\n  );--theme-radiobtn-unchecked--background--active:var(\n    --theme-radiobtn-unchecked--background--warning--active\n  );--theme-radiobtn-unchecked--border-color:var(\n    --theme-radiobtn-unchecked--border-color--warning\n  );--theme-radiobtn-unchecked--border-color--hover:var(\n    --theme-radiobtn-unchecked--border-color--warning--hover\n  );--theme-radiobtn-unchecked--border-color--active:var(\n    --theme-radiobtn-unchecked--border-color--warning--active\n  );--theme-radiobtn-checked--background:var(\n    --theme-radiobtn-checked--background--warning\n  );--theme-radiobtn-checked--background--hover:var(\n    --theme-radiobtn-checked--background--warning--hover\n  );--theme-radiobtn-checked--background--active:var(\n    --theme-radiobtn-checked--background--warning--active\n  );--theme-radiobtn-checked--border-color:var(\n    --theme-radiobtn-checked--border-color--warning\n  );--theme-radiobtn-checked--border-color--hover:var(\n    --theme-radiobtn-checked--border-color--warning--hover\n  );--theme-radiobtn-checked--border-color--active:var(\n    --theme-radiobtn-checked--border-color--warning--active\n  );--theme-radiobtn-mixed--background:var(\n    --theme-radiobtn-mixed--background--warning\n  );--theme-radiobtn-mixed--background--hover:var(\n    --theme-radiobtn-mixed--background--warning--hover\n  );--theme-radiobtn-mixed--background--active:var(\n    --theme-radiobtn-mixed--background--warning--active\n  );--theme-radiobtn-mixed--border-color:var(\n    --theme-radiobtn-mixed--border-color--warning\n  );--theme-radiobtn-mixed--border-color--hover:var(\n    --theme-radiobtn-mixed--border-color--warning--hover\n  );--theme-radiobtn-mixed--border-color--active:var(\n    --theme-radiobtn-mixed--border-color--warning--active\n  )}:host(.ix-warning) .radio-checkmark{background-color:var(--theme-radiobtn-unchecked--background);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-unchecked--border-color)}:host(.ix-warning:hover) .radio-checkmark{background-color:var(--theme-radiobtn-unchecked--background--hover);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-unchecked--border-color--hover)}:host(.ix-warning:active) .radio-checkmark{background-color:var(--theme-radiobtn-unchecked--background--active);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-unchecked--border-color--active)}:host(.ix-warning.checked) .radio-checkmark,:host(.ix-warning[indeterminate]) .radio-checkmark{background-color:var(--theme-radiobtn-checked--background);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-checked--border-color)}:host(.ix-warning.checked:hover) .radio-checkmark,:host(.ix-warning[indeterminate]:hover) .radio-checkmark{background-color:var(--theme-radiobtn-checked--background--hover);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-checked--border-color--hover)}:host(.ix-warning.checked:active) .radio-checkmark,:host(.ix-warning[indeterminate]:active) .radio-checkmark{background-color:var(--theme-radiobtn-checked--background--active);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-checked--border-color--active)}:host(.ix-warning.disabled) .radio-checkmark{background-color:var(--theme-radiobtn-unchecked--background--disabled);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-unchecked--border-color--disabled)}:host(.ix-warning.checked.disabled) .radio-checkmark,:host(.ix-warning[indeterminate].disabled) .radio-checkmark{background-color:var(--theme-radiobtn-checked--background--disabled);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-checked--border-color--disabled)}:host(.ix-invalid--required:not(.disabled)) .radio-checkmark{--theme-radiobtn-unchecked--background:var(\n    --theme-radiobtn-unchecked--background--invalid\n  );--theme-radiobtn-unchecked--background--hover:var(\n    --theme-radiobtn-unchecked--background--invalid--hover\n  );--theme-radiobtn-unchecked--background--active:var(\n    --theme-radiobtn-unchecked--background--invalid--active\n  );--theme-radiobtn-unchecked--border-color:var(\n    --theme-radiobtn-unchecked--border-color--invalid\n  );--theme-radiobtn-unchecked--border-color--hover:var(\n    --theme-radiobtn-unchecked--border-color--invalid--hover\n  );--theme-radiobtn-unchecked--border-color--active:var(\n    --theme-radiobtn-unchecked--border-color--invalid--active\n  );--theme-radiobtn-checked--background:var(\n    --theme-radiobtn-checked--background--invalid\n  );--theme-radiobtn-checked--background--hover:var(\n    --theme-radiobtn-checked--background--invalid--hover\n  );--theme-radiobtn-checked--background--active:var(\n    --theme-radiobtn-checked--background--invalid--active\n  );--theme-radiobtn-checked--border-color:var(\n    --theme-radiobtn-checked--border-color--invalid\n  );--theme-radiobtn-checked--border-color--hover:var(\n    --theme-radiobtn-checked--border-color--invalid--hover\n  );--theme-radiobtn-checked--border-color--active:var(\n    --theme-radiobtn-checked--border-color--invalid--active\n  );--theme-radiobtn-mixed--background:var(\n    --theme-radiobtn-mixed--background--invalid\n  );--theme-radiobtn-mixed--background--hover:var(\n    --theme-radiobtn-mixed--background--invalid--hover\n  );--theme-radiobtn-mixed--background--active:var(\n    --theme-radiobtn-mixed--background--invalid--active\n  );--theme-radiobtn-mixed--border-color:var(\n    --theme-radiobtn-mixed--border-color--invalid\n  );--theme-radiobtn-mixed--border-color--hover:var(\n    --theme-radiobtn-mixed--border-color--invalid--hover\n  );--theme-radiobtn-mixed--border-color--active:var(\n    --theme-radiobtn-mixed--border-color--invalid--active\n  )}:host(.ix-invalid--required) .radio-checkmark{background-color:var(--theme-radiobtn-unchecked--background);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-unchecked--border-color)}:host(.ix-invalid--required:hover) .radio-checkmark{background-color:var(--theme-radiobtn-unchecked--background--hover);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-unchecked--border-color--hover)}:host(.ix-invalid--required:active) .radio-checkmark{background-color:var(--theme-radiobtn-unchecked--background--active);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-unchecked--border-color--active)}:host(.ix-invalid--required.checked) .radio-checkmark,:host(.ix-invalid--required[indeterminate]) .radio-checkmark{background-color:var(--theme-radiobtn-checked--background);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-checked--border-color)}:host(.ix-invalid--required.checked:hover) .radio-checkmark,:host(.ix-invalid--required[indeterminate]:hover) .radio-checkmark{background-color:var(--theme-radiobtn-checked--background--hover);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-checked--border-color--hover)}:host(.ix-invalid--required.checked:active) .radio-checkmark,:host(.ix-invalid--required[indeterminate]:active) .radio-checkmark{background-color:var(--theme-radiobtn-checked--background--active);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-checked--border-color--active)}:host(.ix-invalid--required.disabled) .radio-checkmark{background-color:var(--theme-radiobtn-unchecked--background--disabled);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-unchecked--border-color--disabled)}:host(.ix-invalid--required.checked.disabled) .radio-checkmark,:host(.ix-invalid--required[indeterminate].disabled) .radio-checkmark{background-color:var(--theme-radiobtn-checked--background--disabled);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-checked--border-color--disabled)}:host(.ix-invalid:not(.disabled)) .radio-checkmark{--theme-radiobtn-unchecked--background:var(\n    --theme-radiobtn-unchecked--background--invalid\n  );--theme-radiobtn-unchecked--background--hover:var(\n    --theme-radiobtn-unchecked--background--invalid--hover\n  );--theme-radiobtn-unchecked--background--active:var(\n    --theme-radiobtn-unchecked--background--invalid--active\n  );--theme-radiobtn-unchecked--border-color:var(\n    --theme-radiobtn-unchecked--border-color--invalid\n  );--theme-radiobtn-unchecked--border-color--hover:var(\n    --theme-radiobtn-unchecked--border-color--invalid--hover\n  );--theme-radiobtn-unchecked--border-color--active:var(\n    --theme-radiobtn-unchecked--border-color--invalid--active\n  );--theme-radiobtn-checked--background:var(\n    --theme-radiobtn-checked--background--invalid\n  );--theme-radiobtn-checked--background--hover:var(\n    --theme-radiobtn-checked--background--invalid--hover\n  );--theme-radiobtn-checked--background--active:var(\n    --theme-radiobtn-checked--background--invalid--active\n  );--theme-radiobtn-checked--border-color:var(\n    --theme-radiobtn-checked--border-color--invalid\n  );--theme-radiobtn-checked--border-color--hover:var(\n    --theme-radiobtn-checked--border-color--invalid--hover\n  );--theme-radiobtn-checked--border-color--active:var(\n    --theme-radiobtn-checked--border-color--invalid--active\n  );--theme-radiobtn-mixed--background:var(\n    --theme-radiobtn-mixed--background--invalid\n  );--theme-radiobtn-mixed--background--hover:var(\n    --theme-radiobtn-mixed--background--invalid--hover\n  );--theme-radiobtn-mixed--background--active:var(\n    --theme-radiobtn-mixed--background--invalid--active\n  );--theme-radiobtn-mixed--border-color:var(\n    --theme-radiobtn-mixed--border-color--invalid\n  );--theme-radiobtn-mixed--border-color--hover:var(\n    --theme-radiobtn-mixed--border-color--invalid--hover\n  );--theme-radiobtn-mixed--border-color--active:var(\n    --theme-radiobtn-mixed--border-color--invalid--active\n  )}:host(.ix-invalid) .radio-checkmark{background-color:var(--theme-radiobtn-unchecked--background);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-unchecked--border-color)}:host(.ix-invalid:hover) .radio-checkmark{background-color:var(--theme-radiobtn-unchecked--background--hover);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-unchecked--border-color--hover)}:host(.ix-invalid:active) .radio-checkmark{background-color:var(--theme-radiobtn-unchecked--background--active);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-unchecked--border-color--active)}:host(.ix-invalid.checked) .radio-checkmark,:host(.ix-invalid[indeterminate]) .radio-checkmark{background-color:var(--theme-radiobtn-checked--background);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-checked--border-color)}:host(.ix-invalid.checked:hover) .radio-checkmark,:host(.ix-invalid[indeterminate]:hover) .radio-checkmark{background-color:var(--theme-radiobtn-checked--background--hover);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-checked--border-color--hover)}:host(.ix-invalid.checked:active) .radio-checkmark,:host(.ix-invalid[indeterminate]:active) .radio-checkmark{background-color:var(--theme-radiobtn-checked--background--active);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-checked--border-color--active)}:host(.ix-invalid.disabled) .radio-checkmark{background-color:var(--theme-radiobtn-unchecked--background--disabled);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-unchecked--border-color--disabled)}:host(.ix-invalid.checked.disabled) .radio-checkmark,:host(.ix-invalid[indeterminate].disabled) .radio-checkmark{background-color:var(--theme-radiobtn-checked--background--disabled);border:var(--theme-radiobtn--border-thickness) solid var(--theme-radiobtn-checked--border-color--disabled)}";