@siemens/ix 0.0.0-20240522073858 → 0.0.0-pr-1318-20240627080522

package/dist/esm/text-field.util-6a84bffd.js

@@ -0,0 +1,167 @@
+import { h } from './index-9103b14c.js';
+import { a as a11yBoolean } from './a11y-13dedaef.js';
+import { s as shouldSuppressInternalValidation } from './validation-9db7dfa3.js';
+import { a as anime } from './anime.es-a5520566.js';
+
+/*
+ * SPDX-FileCopyrightText: 2024 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+function TextareaElement(props) {
+    return (h("textarea", Object.assign({ readOnly: props.readonly, disabled: props.disabled, maxLength: props.maxLength, minLength: props.minLength, cols: Number(props.textareaCols), rows: Number(props.textareaRows), ref: props.textAreaRef, class: {
+            'is-invalid': props.isInvalid,
+        }, required: props.required, value: props.value, placeholder: props.placeholder, onChange: (changeEvent) => {
+            const target = changeEvent.target;
+            props.valueChange(target.value);
+        }, onInput: (inputEvent) => {
+            const target = inputEvent.target;
+            props.updateFormInternalValue(target.value);
+        }, onBlur: () => props.onBlur(), style: { height: props.textareaHeight, width: props.textareaWidth } }, props.ariaAttributes)));
+}
+function InputElement(props) {
+    return (h("input", Object.assign({ id: props.id, autoComplete: "off", readOnly: props.readonly, disabled: props.disabled, min: props.min, max: props.max, maxLength: props.maxLength ? Number(props.maxLength) : undefined, minLength: props.maxLength ? Number(props.minLength) : undefined, ref: props.inputRef, pattern: props.pattern, type: props.type, class: {
+            'is-invalid': props.isInvalid,
+        }, required: props.required, value: props.value, placeholder: props.placeholder, onKeyPress: (event) => props.onKeyPress(event), onChange: (changeEvent) => {
+            const target = changeEvent.target;
+            props.valueChange(target.value);
+        }, onInput: (inputEvent) => {
+            const target = inputEvent.target;
+            props.updateFormInternalValue(target.value);
+        }, onBlur: () => props.onBlur() }, props.ariaAttributes)));
+}
+function PostfixSlot(props, children) {
+    return (h("div", { class: "postfix-container", ref: props.postfixRef },
+        h("slot", { name: "postfix", onSlotchange: props.onSlotChange }),
+        children));
+}
+function PrefixSlot(props) {
+    return (h("div", { class: "prefix-container", ref: props.prefixRef },
+        h("slot", { name: "prefix", onSlotchange: props.onSlotChange })));
+}
+
+/*
+ * SPDX-FileCopyrightText: 2024 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+function shakeInput(input) {
+    const xMax = 5;
+    anime({
+        targets: input,
+        duration: 200,
+        easing: 'easeInOutSine',
+        loop: 2,
+        translateX: [
+            {
+                value: xMax * -1,
+            },
+            {
+                value: xMax,
+            },
+            {
+                value: xMax / -2,
+            },
+            {
+                value: xMax / 2,
+            },
+            {
+                value: 0,
+            },
+        ],
+    });
+}
+
+/*
+ * SPDX-FileCopyrightText: 2024 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+function mapValidationResult(ref, result) {
+    ref.isInvalid = result.isInvalid || result.isInvalidByRequired;
+    ref.isValid = result.isValid;
+    ref.isInfo = result.isInfo;
+    ref.isWarning = result.isWarning;
+}
+function checkAllowedKeys(comp, event) {
+    if (comp.allowedCharactersPattern) {
+        const regex = new RegExp(comp.allowedCharactersPattern);
+        if (!regex.test(event.key)) {
+            event.preventDefault();
+            shakeInput(comp.inputRef.current);
+        }
+    }
+}
+async function checkInternalValidity(comp, input) {
+    const validityState = input.validity;
+    const eventResult = comp.validityStateChange.emit(validityState);
+    if (eventResult.defaultPrevented) {
+        return;
+    }
+    if (!comp.value) {
+        return;
+    }
+    const skipValidation = await shouldSuppressInternalValidation(comp);
+    if (skipValidation) {
+        return;
+    }
+    const { valid } = validityState;
+    comp.hostElement.classList.toggle('ix-invalid', !valid);
+}
+function onInputBlur(comp, input) {
+    comp.ixBlur.emit();
+    checkInternalValidity(comp, input);
+}
+function applyPostfixPadding(inputElement, width, options) {
+    var _a;
+    if (!inputElement) {
+        return;
+    }
+    if (width === 0) {
+        return;
+    }
+    const padding = `${(width + 12) / 16}rem`;
+    if (options.postfix) {
+        inputElement.style.paddingRight = `calc(${padding} + ${(_a = options.additionalPaddingRight) !== null && _a !== void 0 ? _a : '0rem'})`;
+    }
+    else {
+        inputElement.style.paddingLeft = padding;
+    }
+}
+function adjustPaddingForPrefixAndPostfix(prefixElement, postfixElement, inputElement) {
+    const prefixBoundingRect = prefixElement.getBoundingClientRect();
+    const postfixBoundingRect = postfixElement.getBoundingClientRect();
+    if (prefixBoundingRect) {
+        applyPostfixPadding(inputElement, prefixBoundingRect.width, {
+            postfix: false,
+        });
+    }
+    if (postfixBoundingRect) {
+        applyPostfixPadding(inputElement, postfixBoundingRect.width, {
+            postfix: true,
+        });
+    }
+}
+function getAriaAttributesForInput(component) {
+    const inputAria = {
+        'aria-invalid': `${a11yBoolean(component.isInvalid)}`,
+        'aria-required': `${a11yBoolean(component.required)}`,
+    };
+    if (component.isInvalid && component.invalidText) {
+        inputAria['aria-errormessage'] = component.invalidText;
+    }
+    return inputAria;
+}
+
+export { InputElement as I, PostfixSlot as P, TextareaElement as T, adjustPaddingForPrefixAndPostfix as a, PrefixSlot as b, applyPostfixPadding as c, checkAllowedKeys as d, checkInternalValidity as e, getAriaAttributesForInput as g, mapValidationResult as m, onInputBlur as o };
+
+//# sourceMappingURL=text-field.util-6a84bffd.js.map

package/dist/esm/text-field.util-6a84bffd.js.map

@@ -0,0 +1 @@
+{"file":"text-field.util-6a84bffd.js","mappings":"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","names":[],"sources":["src/components/text-field/input.fc.tsx","src/components/text-field/text-field.animation.ts","src/components/text-field/text-field.util.ts"],"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 */\nimport { h } from '@stencil/core';\nimport { MakeRef } from '../utils/make-ref';\nimport { A11yAttributes } from '../utils/a11y';\n\nexport function TextareaElement(props: {\n  textareaHeight?: string;\n  textareaWidth?: string;\n  textareaRows?: string;\n  textareaCols?: string;\n  disabled: boolean;\n  readonly: boolean;\n  maxLength?: number;\n  minLength?: number;\n  isInvalid: boolean;\n  required: boolean;\n  value: string;\n  placeholder?: string;\n  textAreaRef: (el: HTMLTextAreaElement) => void;\n  valueChange: (value: string) => void;\n  updateFormInternalValue: (value: string) => void;\n  onBlur: () => void;\n  ariaAttributes?: A11yAttributes;\n}) {\n  return (\n    <textarea\n      readOnly={props.readonly}\n      disabled={props.disabled}\n      maxLength={props.maxLength}\n      minLength={props.minLength}\n      cols={Number(props.textareaCols)}\n      rows={Number(props.textareaRows)}\n      ref={props.textAreaRef}\n      class={{\n        'is-invalid': props.isInvalid,\n      }}\n      required={props.required}\n      value={props.value}\n      placeholder={props.placeholder}\n      onChange={(changeEvent) => {\n        const target = changeEvent.target as HTMLInputElement;\n        props.valueChange(target.value);\n      }}\n      onInput={(inputEvent) => {\n        const target = inputEvent.target as HTMLInputElement;\n        props.updateFormInternalValue(target.value);\n      }}\n      onBlur={() => props.onBlur()}\n      style={{ height: props.textareaHeight, width: props.textareaWidth }}\n      {...props.ariaAttributes}\n    ></textarea>\n  );\n}\n\nexport function InputElement(props: {\n  id: string;\n  disabled: boolean;\n  readonly: boolean;\n  maxLength?: string | number;\n  minLength?: string | number;\n  max?: string | number;\n  min?: string | number;\n  pattern?: string;\n  type: string;\n  isInvalid: boolean;\n  required: boolean;\n  value: string | number;\n  placeholder?: string;\n  inputRef: (el: HTMLInputElement) => void;\n  onKeyPress: (event: KeyboardEvent) => void;\n  valueChange: (value: string) => void;\n  updateFormInternalValue: (value: string) => void;\n  onBlur: () => void;\n  ariaAttributes?: A11yAttributes;\n}) {\n  return (\n    <input\n      id={props.id}\n      autoComplete=\"off\"\n      readOnly={props.readonly}\n      disabled={props.disabled}\n      min={props.min}\n      max={props.max}\n      maxLength={props.maxLength ? Number(props.maxLength) : undefined}\n      minLength={props.maxLength ? Number(props.minLength) : undefined}\n      ref={props.inputRef}\n      pattern={props.pattern}\n      type={props.type}\n      class={{\n        'is-invalid': props.isInvalid,\n      }}\n      required={props.required}\n      value={props.value}\n      placeholder={props.placeholder}\n      onKeyPress={(event) => props.onKeyPress(event)}\n      onChange={(changeEvent) => {\n        const target = changeEvent.target as HTMLInputElement;\n        props.valueChange(target.value);\n      }}\n      onInput={(inputEvent) => {\n        const target = inputEvent.target as HTMLInputElement;\n        props.updateFormInternalValue(target.value);\n      }}\n      onBlur={() => props.onBlur()}\n      {...props.ariaAttributes}\n    ></input>\n  );\n}\n\nexport function PostfixSlot(\n  props: {\n    postfixRef: MakeRef<HTMLDivElement>;\n    onSlotChange?: (e: Event) => void;\n  },\n  children\n) {\n  return (\n    <div class=\"postfix-container\" ref={props.postfixRef}>\n      <slot name=\"postfix\" onSlotchange={props.onSlotChange}></slot>\n      {children}\n    </div>\n  );\n}\n\nexport function PrefixSlot(props: {\n  prefixRef: MakeRef<HTMLDivElement>;\n  onSlotChange?: (e: Event) => void;\n}) {\n  return (\n    <div class=\"prefix-container\" ref={props.prefixRef}>\n      <slot name=\"prefix\" onSlotchange={props.onSlotChange}></slot>\n    </div>\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 */\nimport anime from 'animejs';\n\nexport function shakeInput(input: HTMLInputElement) {\n  const xMax = 5;\n  anime({\n    targets: input,\n    duration: 200,\n    easing: 'easeInOutSine',\n    loop: 2,\n    translateX: [\n      {\n        value: xMax * -1,\n      },\n      {\n        value: xMax,\n      },\n      {\n        value: xMax / -2,\n      },\n      {\n        value: xMax / 2,\n      },\n      {\n        value: 0,\n      },\n    ],\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 { A11yAttributes, a11yBoolean } from '../utils/a11y';\nimport {\n  IxFormComponent,\n  IxInputFieldComponent,\n  ValidationResults,\n  shouldSuppressInternalValidation,\n} from '../utils/field';\nimport { generateUUID } from '../utils/uuid';\nimport { shakeInput } from './text-field.animation';\n\nexport function createIdIfNotExists(\n  element: IxFormComponent,\n  idPrefix: string = 'field'\n) {\n  return element.hasAttribute('id')\n    ? element.getAttribute('id')\n    : `${idPrefix}-${generateUUID()}`;\n}\n\nexport function mapValidationResult(\n  ref: IxInputFieldComponent<unknown>,\n  result: ValidationResults\n) {\n  ref.isInvalid = result.isInvalid || result.isInvalidByRequired;\n  ref.isValid = result.isValid;\n  ref.isInfo = result.isInfo;\n  ref.isWarning = result.isWarning;\n}\n\nexport function checkAllowedKeys(\n  comp: IxInputFieldComponent<unknown>,\n  event: KeyboardEvent\n) {\n  if (comp.allowedCharactersPattern) {\n    const regex = new RegExp(comp.allowedCharactersPattern);\n    if (!regex.test(event.key)) {\n      event.preventDefault();\n      shakeInput(comp.inputRef.current);\n    }\n  }\n}\n\nexport async function checkInternalValidity(\n  comp: IxFormComponent<unknown>,\n  input: HTMLInputElement | HTMLTextAreaElement\n) {\n  const validityState = input.validity;\n\n  const eventResult = comp.validityStateChange.emit(validityState);\n\n  if (eventResult.defaultPrevented) {\n    return;\n  }\n\n  if (!comp.value) {\n    return;\n  }\n\n  const skipValidation = await shouldSuppressInternalValidation(comp);\n  if (skipValidation) {\n    return;\n  }\n\n  const { valid } = validityState;\n  comp.hostElement.classList.toggle('ix-invalid', !valid);\n}\n\nexport function onInputBlur(\n  comp: IxInputFieldComponent<unknown>,\n  input: HTMLInputElement | HTMLTextAreaElement\n) {\n  comp.ixBlur.emit();\n  checkInternalValidity(comp, input);\n}\n\nexport function applyPostfixPadding(\n  inputElement: HTMLElement,\n  width: number,\n  options: {\n    postfix: boolean;\n    additionalPaddingRight?: string;\n  }\n) {\n  if (!inputElement) {\n    return;\n  }\n\n  if (width === 0) {\n    return;\n  }\n\n  const padding = `${(width + 12) / 16}rem`;\n\n  if (options.postfix) {\n    inputElement.style.paddingRight = `calc(${padding} + ${\n      options.additionalPaddingRight ?? '0rem'\n    })`;\n  } else {\n    inputElement.style.paddingLeft = padding;\n  }\n}\n\nexport function adjustPaddingForPrefixAndPostfix(\n  prefixElement: HTMLElement,\n  postfixElement: HTMLElement,\n  inputElement: HTMLElement\n) {\n  const prefixBoundingRect = prefixElement.getBoundingClientRect();\n  const postfixBoundingRect = postfixElement.getBoundingClientRect();\n\n  if (prefixBoundingRect) {\n    applyPostfixPadding(inputElement, prefixBoundingRect.width, {\n      postfix: false,\n    });\n  }\n\n  if (postfixBoundingRect) {\n    applyPostfixPadding(inputElement, postfixBoundingRect.width, {\n      postfix: true,\n    });\n  }\n}\n\nexport function getAriaAttributesForInput(\n  component: IxInputFieldComponent\n): A11yAttributes {\n  const inputAria: A11yAttributes = {\n    'aria-invalid': `${a11yBoolean(component.isInvalid)}`,\n    'aria-required': `${a11yBoolean(component.required)}`,\n  };\n\n  if (component.isInvalid && component.invalidText) {\n    inputAria['aria-errormessage'] = component.invalidText;\n  }\n  return inputAria;\n}\n"],"version":3}

package/dist/esm/validation-9db7dfa3.js

@@ -0,0 +1,112 @@
+import { g as getElement } from './index-9103b14c.js';
+
+/*
+ * SPDX-FileCopyrightText: 2024 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+async function shouldSuppressInternalValidation(host) {
+    if (host.getAssociatedFormElement &&
+        typeof host.getAssociatedFormElement === 'function') {
+        const form = await host.getAssociatedFormElement();
+        if (!form) {
+            return false;
+        }
+        return form.noValidate;
+    }
+    return false;
+}
+function createClassMutationObserver(element, callback, options) {
+    const observer = new MutationObserver(callback);
+    observer.observe(element, {
+        subtree: options === null || options === void 0 ? void 0 : options.includeChildren,
+        childList: options === null || options === void 0 ? void 0 : options.includeChildren,
+        attributes: true,
+        attributeFilter: ['class'],
+    });
+    return {
+        destroy() {
+            observer.disconnect();
+        },
+    };
+}
+function containsClass(hostElement, className, includeChildren) {
+    return (hostElement.classList.contains(`${className}`) ||
+        (includeChildren ? !!hostElement.querySelector(`.${className}`) : false));
+}
+function checkFieldClasses(hostElement, includeChildren = false) {
+    return {
+        isInvalid: containsClass(hostElement, 'ix-invalid', includeChildren),
+        isInvalidByRequired: containsClass(hostElement, 'ix-invalid--required', includeChildren),
+        isValid: containsClass(hostElement, 'ix-valid', includeChildren),
+        isInfo: containsClass(hostElement, 'ix-info', includeChildren),
+        isWarning: containsClass(hostElement, 'ix-warning', includeChildren),
+    };
+}
+function HookValidationLifecycle(options) {
+    return (proto, methodName) => {
+        let checkIfRequiredFunction;
+        let classMutationObserver;
+        const { componentWillLoad, disconnectedCallback, connectedCallback } = proto;
+        proto.connectedCallback = function () {
+            const host = getElement(this);
+            checkIfRequiredFunction = async () => {
+                const skipValidation = await shouldSuppressInternalValidation(host);
+                if (skipValidation) {
+                    return;
+                }
+                if (host.hasValidValue && typeof host.hasValidValue === 'function') {
+                    const hasValue = await host.hasValidValue();
+                    if (host.required) {
+                        host.classList.toggle('ix-invalid--required', !hasValue);
+                    }
+                    else {
+                        host.classList.remove('ix-invalid--required');
+                    }
+                }
+                if (host.getValidityState &&
+                    typeof host.getValidityState === 'function') {
+                    const validityState = await host.getValidityState();
+                    Object.keys(validityState)
+                        // Use only the keys that are relevant for the validation state
+                        // patternMismatch used for `ix-date-field`
+                        .filter((key) => ['patternMismatch'].includes(key))
+                        .forEach((key) => {
+                        host.classList.toggle(`ix-invalid--${key}`, validityState[key]);
+                    });
+                }
+            };
+            host.addEventListener('valueChange', checkIfRequiredFunction);
+            setTimeout(checkIfRequiredFunction);
+            return connectedCallback && connectedCallback.call(this);
+        };
+        proto.componentWillLoad = function () {
+            const host = getElement(this);
+            classMutationObserver = createClassMutationObserver(host, () => {
+                const result = checkFieldClasses(host, options === null || options === void 0 ? void 0 : options.includeChildren);
+                proto[methodName].call(this, result);
+            }, options);
+            const result = checkFieldClasses(host, options === null || options === void 0 ? void 0 : options.includeChildren);
+            proto[methodName].call(this, result);
+            return componentWillLoad && componentWillLoad.call(this);
+        };
+        proto.disconnectedCallback = function () {
+            const host = getElement(this);
+            if (host && classMutationObserver) {
+                classMutationObserver.destroy();
+                classMutationObserver = null;
+            }
+            if (host && checkIfRequiredFunction) {
+                host.removeEventListener('valueChange', checkIfRequiredFunction);
+            }
+            return disconnectedCallback && disconnectedCallback.call(this);
+        };
+    };
+}
+
+export { HookValidationLifecycle as H, checkFieldClasses as a, createClassMutationObserver as c, shouldSuppressInternalValidation as s };
+
+//# sourceMappingURL=validation-9db7dfa3.js.map

package/dist/esm/validation-9db7dfa3.js.map

@@ -0,0 +1 @@
+{"file":"validation-9db7dfa3.js","mappings":"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","names":[],"sources":["src/components/utils/field/validation.ts"],"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 */\nimport { getElement } from '@stencil/core';\nimport { HTMLIxFormComponentElement, IxFormComponent } from '.';\nimport { IxComponent } from '../internal';\n\nexport type ClassMutationObserver = {\n  destroy: () => void;\n};\n\nexport async function shouldSuppressInternalValidation(\n  host: IxFormComponent<unknown>\n) {\n  if (\n    host.getAssociatedFormElement &&\n    typeof host.getAssociatedFormElement === 'function'\n  ) {\n    const form = await host.getAssociatedFormElement();\n\n    if (!form) {\n      return false;\n    }\n\n    return form.noValidate;\n  }\n\n  return false;\n}\n\nexport function createClassMutationObserver(\n  element: HTMLElement,\n  callback: () => void,\n  options?: {\n    includeChildren?: boolean;\n  }\n): ClassMutationObserver {\n  const observer = new MutationObserver(callback);\n  observer.observe(element, {\n    subtree: options?.includeChildren,\n    childList: options?.includeChildren,\n    attributes: true,\n    attributeFilter: ['class'],\n  });\n\n  return {\n    destroy() {\n      observer.disconnect();\n    },\n  };\n}\n\nexport type ValidationResultProperty =\n  | 'isInvalid'\n  | 'isInvalidByRequired'\n  | 'isValid'\n  | 'isInfo'\n  | 'isWarning';\nexport type ValidationResults = Record<ValidationResultProperty, boolean>;\n\nfunction containsClass(\n  hostElement: HTMLIxFormComponentElement<unknown>,\n  className: string,\n  includeChildren: boolean\n) {\n  return (\n    hostElement.classList.contains(`${className}`) ||\n    (includeChildren ? !!hostElement.querySelector(`.${className}`) : false)\n  );\n}\n\nexport function checkFieldClasses(\n  hostElement: HTMLIxFormComponentElement<unknown>,\n  includeChildren = false\n): ValidationResults {\n  return {\n    isInvalid: containsClass(hostElement, 'ix-invalid', includeChildren),\n    isInvalidByRequired: containsClass(\n      hostElement,\n      'ix-invalid--required',\n      includeChildren\n    ),\n    isValid: containsClass(hostElement, 'ix-valid', includeChildren),\n    isInfo: containsClass(hostElement, 'ix-info', includeChildren),\n    isWarning: containsClass(hostElement, 'ix-warning', includeChildren),\n  };\n}\n\nexport function HookValidationLifecycle(options?: {\n  includeChildren?: boolean;\n}) {\n  return (proto: IxComponent, methodName: string) => {\n    let checkIfRequiredFunction: () => void;\n    let classMutationObserver: ClassMutationObserver | null;\n    const { componentWillLoad, disconnectedCallback, connectedCallback } =\n      proto;\n\n    proto.connectedCallback = function () {\n      const host = getElement(\n        this\n      ) as unknown as HTMLIxFormComponentElement<unknown>;\n\n      checkIfRequiredFunction = async () => {\n        const skipValidation = await shouldSuppressInternalValidation(host);\n        if (skipValidation) {\n          return;\n        }\n\n        if (host.hasValidValue && typeof host.hasValidValue === 'function') {\n          const hasValue = await host.hasValidValue();\n          if (host.required) {\n            host.classList.toggle('ix-invalid--required', !hasValue);\n          } else {\n            host.classList.remove('ix-invalid--required');\n          }\n        }\n\n        if (\n          host.getValidityState &&\n          typeof host.getValidityState === 'function'\n        ) {\n          const validityState = await host.getValidityState();\n          Object.keys(validityState)\n            // Use only the keys that are relevant for the validation state\n            // patternMismatch used for `ix-date-field`\n            .filter((key) => ['patternMismatch'].includes(key))\n            .forEach((key) => {\n              host.classList.toggle(`ix-invalid--${key}`, validityState[key]);\n            });\n        }\n      };\n\n      host.addEventListener('valueChange', checkIfRequiredFunction);\n      setTimeout(checkIfRequiredFunction);\n      return connectedCallback && connectedCallback.call(this);\n    };\n\n    proto.componentWillLoad = function () {\n      const host = getElement(\n        this\n      ) as unknown as HTMLIxFormComponentElement<unknown>;\n      classMutationObserver = createClassMutationObserver(\n        host,\n        () => {\n          const result = checkFieldClasses(host, options?.includeChildren);\n          proto[methodName].call(this, result);\n        },\n        options\n      );\n      const result = checkFieldClasses(host, options?.includeChildren);\n      proto[methodName].call(this, result);\n      return componentWillLoad && componentWillLoad.call(this);\n    };\n\n    proto.disconnectedCallback = function () {\n      const host = getElement(this);\n\n      if (host && classMutationObserver) {\n        classMutationObserver.destroy();\n        classMutationObserver = null;\n      }\n\n      if (host && checkIfRequiredFunction) {\n        host.removeEventListener('valueChange', checkIfRequiredFunction);\n      }\n\n      return disconnectedCallback && disconnectedCallback.call(this);\n    };\n  };\n}\n"],"version":3}

package/dist/siemens-ix/index.esm.js

@@ -1,2 +1,2 @@
-export{I as InputState,L as LogicalFilterOperator}from"./p-25ee1b62.js";export{F as FlipTileState}from"./p-dded1449.js";export{r as renderDefaultItem}from"./p-effd2dcf.js";export{U as UploadFileState}from"./p-ef0d5678.js";import{g as e}from"./p-6e6efb4c.js";export{c as closeModal,d as dismissModal,g as getCoreDelegate,r as registerFrameworkDelegate,a as resolveDelegate,s as showMessage,b as showModal}from"./p-6e6efb4c.js";import{A as o}from"./p-46a6cd9d.js";export{c as convertToAbbreviationString,a as convertToRemString}from"./p-360b158e.js";export{g as getCurrentSystemAppearance,t as themeSwitcher}from"./p-1da901d5.js";import"./p-c4749812.js";class n{}function i(){const e=Array.from(document.querySelectorAll("ix-toast-container"));const[t]=e;if(e.length>1){console.warn("Multiple toast containers were found. Only the first one will be used.");return t}if(!t){const e=document.createElement("ix-toast-container");document.body.appendChild(e);return e}return t}function p(e){const t=i();t.position=e}function f(e){const t=i();return t.showToast(e)}f.info=e=>f(Object.assign(Object.assign({},e),{type:"info"}));f.error=e=>f(Object.assign(Object.assign({},e),{type:"error"}));f.success=e=>f(Object.assign(Object.assign({},e),{type:"success"}));f.warning=e=>f(Object.assign(Object.assign({},e),{type:"warning"}));function l(t){const s=document.createElement("ix-modal");s.keyboard=false;const r=document.createElement("ix-modal-loading");r.innerText=t;s.appendChild(r);e().attachView(s);s.showModal();return{update:e=>r.innerHTML=e,finish:(t,a=250)=>{if(t!==undefined){r.innerText=t}else{a=0}setTimeout((()=>{s.closeModal(null);setTimeout((async()=>await e().removeView(s)),o.mediumTime)}),a)}}}export{n as FilterState,i as getToastContainer,p as setToastPosition,l as showModalLoading,f as toast};
+export{I as InputState,L as LogicalFilterOperator}from"./p-25ee1b62.js";export{F as FlipTileState}from"./p-dded1449.js";export{r as renderDefaultItem}from"./p-effd2dcf.js";export{U as UploadFileState}from"./p-ef0d5678.js";import{g as e}from"./p-6e6efb4c.js";export{c as closeModal,d as dismissModal,g as getCoreDelegate,r as registerFrameworkDelegate,a as resolveDelegate,s as showMessage,b as showModal}from"./p-6e6efb4c.js";import{A as o}from"./p-46a6cd9d.js";export{c as convertToAbbreviationString,a as convertToRemString}from"./p-360b158e.js";export{g as getCurrentSystemAppearance,t as themeSwitcher}from"./p-1da901d5.js";import"./p-c4749812.js";class n{}function i(){const e=Array.from(document.querySelectorAll("ix-toast-container"));const[t]=e;if(e.length>1){console.warn("Multiple toast containers were found. Only the first one will be used.");return t}if(!t){const e=document.createElement("ix-toast-container");document.body.appendChild(e);return e}return t}function p(e){const t=i();t.position=e}function f(e){const t=i();return t.showToast(e)}f.info=e=>f(Object.assign(Object.assign({},e),{type:"info"}));f.error=e=>f(Object.assign(Object.assign({},e),{type:"error"}));f.success=e=>f(Object.assign(Object.assign({},e),{type:"success"}));f.warning=e=>f(Object.assign(Object.assign({},e),{type:"warning"}));function l(t){const s=document.createElement("ix-modal");s.keyboard=false;const r=document.createElement("ix-modal-loading");r.innerText=t;s.appendChild(r);e().attachView(s);s.showModal();return{update:e=>r.innerHTML=e,finish:(t,a=250)=>{if(t!==undefined){r.innerText=t}else{a=0}setTimeout((()=>{s.closeModal(null);setTimeout((async()=>await e().removeView(s)),o.mediumTime)}),a)}}}async function m(){}export{n as FilterState,m as applyPolyfills,i as getToastContainer,p as setToastPosition,l as showModalLoading,f as toast};
 //# sourceMappingURL=index.esm.js.map

package/dist/siemens-ix/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"names":["FilterState","getToastContainer","containerList","Array","from","document","querySelectorAll","container","length","console","warn","toastContainer","createElement","body","appendChild","setToastPosition","position","toast","config","showToast","info","Object","assign","type","error","success","warning","showModalLoading","message","modal","keyboard","loading","innerText","getCoreDelegate","attachView","showModal","update","text","innerHTML","finish","timeout","undefined","setTimeout","closeModal","async","removeView","Animation","mediumTime"],"sources":["src/components/category-filter/filter-state.ts","src/components/toast/toast-utils.ts","src/components/utils/modal/loading.ts"],"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\nimport { LogicalFilterOperator } from './logical-filter-operator';\nexport class FilterState {\n  public tokens: string[];\n  public categories: {\n    id: string;\n    value: string;\n    operator: LogicalFilterOperator;\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 */\nimport { ShowToastResult } from './toast-container';\nexport type ToastType = 'info' | 'success' | 'error' | 'warning';\nexport type ToastPosition = 'bottom-right' | 'top-right';\n\nexport interface ToastConfig {\n  title?: string;\n  message: string | HTMLElement;\n  type?: ToastType;\n  autoClose?: boolean;\n  autoCloseDelay?: number;\n  icon?: string;\n  iconColor?: string;\n}\n\nexport function getToastContainer() {\n  const containerList = Array.from(\n    document.querySelectorAll('ix-toast-container')\n  );\n  const [container] = containerList;\n  if (containerList.length > 1) {\n    console.warn(\n      'Multiple toast containers were found. Only the first one will be used.'\n    );\n    return container;\n  }\n  if (!container) {\n    const toastContainer = document.createElement('ix-toast-container');\n    document.body.appendChild(toastContainer);\n\n    return toastContainer;\n  }\n  return container;\n}\n\nexport function setToastPosition(position: ToastPosition) {\n  const container = getToastContainer();\n  container.position = position;\n}\n\nfunction toast(config: ToastConfig): Promise<ShowToastResult> {\n  const container = getToastContainer();\n  return container.showToast(config);\n}\n\ntoast.info = (config: ToastConfig) => {\n  return toast({\n    ...config,\n    type: 'info',\n  });\n};\n\ntoast.error = (config: ToastConfig) => {\n  return toast({\n    ...config,\n    type: 'error',\n  });\n};\n\ntoast.success = (config: ToastConfig) => {\n  return toast({\n    ...config,\n    type: 'success',\n  });\n};\n\ntoast.warning = (config: ToastConfig) => {\n  return toast({\n    ...config,\n    type: 'warning',\n  });\n};\n\nexport { toast };\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 Animation from '../animation';\nimport { getCoreDelegate } from '../delegate';\n\nexport function showModalLoading(message: string) {\n  const modal = document.createElement('ix-modal');\n  modal.keyboard = false;\n\n  const loading = document.createElement('ix-modal-loading');\n  loading.innerText = message;\n  modal.appendChild(loading);\n\n  getCoreDelegate().attachView(modal);\n  modal.showModal();\n\n  return {\n    update: (text: string) => (loading.innerHTML = text),\n    finish: (text?: string, timeout: number = 250) => {\n      if (text !== undefined) {\n        loading.innerText = text;\n      } else {\n        timeout = 0;\n      }\n      setTimeout(() => {\n        modal.closeModal(null);\n        setTimeout(\n          async () => await getCoreDelegate().removeView(modal),\n          Animation.mediumTime\n        );\n      }, timeout);\n    },\n  };\n}\n"],"mappings":"kpBAUaA,G,SCYGC,IACd,MAAMC,EAAgBC,MAAMC,KAC1BC,SAASC,iBAAiB,uBAE5B,MAAOC,GAAaL,EACpB,GAAIA,EAAcM,OAAS,EAAG,CAC5BC,QAAQC,KACN,0EAEF,OAAOH,C,CAET,IAAKA,EAAW,CACd,MAAMI,EAAiBN,SAASO,cAAc,sBAC9CP,SAASQ,KAAKC,YAAYH,GAE1B,OAAOA,C,CAET,OAAOJ,CACT,C,SAEgBQ,EAAiBC,GAC/B,MAAMT,EAAYN,IAClBM,EAAUS,SAAWA,CACvB,CAEA,SAASC,EAAMC,GACb,MAAMX,EAAYN,IAClB,OAAOM,EAAUY,UAAUD,EAC7B,CAEAD,EAAMG,KAAQF,GACLD,EAAKI,OAAAC,OAAAD,OAAAC,OAAA,GACPJ,GAAM,CACTK,KAAM,UAIVN,EAAMO,MAASN,GACND,EAAKI,OAAAC,OAAAD,OAAAC,OAAA,GACPJ,GAAM,CACTK,KAAM,WAIVN,EAAMQ,QAAWP,GACRD,EAAKI,OAAAC,OAAAD,OAAAC,OAAA,GACPJ,GAAM,CACTK,KAAM,aAIVN,EAAMS,QAAWR,GACRD,EAAKI,OAAAC,OAAAD,OAAAC,OAAA,GACPJ,GAAM,CACTK,KAAM,a,SChEMI,EAAiBC,GAC/B,MAAMC,EAAQxB,SAASO,cAAc,YACrCiB,EAAMC,SAAW,MAEjB,MAAMC,EAAU1B,SAASO,cAAc,oBACvCmB,EAAQC,UAAYJ,EACpBC,EAAMf,YAAYiB,GAElBE,IAAkBC,WAAWL,GAC7BA,EAAMM,YAEN,MAAO,CACLC,OAASC,GAAkBN,EAAQO,UAAYD,EAC/CE,OAAQ,CAACF,EAAeG,EAAkB,OACxC,GAAIH,IAASI,UAAW,CACtBV,EAAQC,UAAYK,C,KACf,CACLG,EAAU,C,CAEZE,YAAW,KACTb,EAAMc,WAAW,MACjBD,YACEE,eAAkBX,IAAkBY,WAAWhB,IAC/CiB,EAAUC,WACX,GACAP,EAAQ,EAGjB,Q"}
+{"version":3,"names":["FilterState","getToastContainer","containerList","Array","from","document","querySelectorAll","container","length","console","warn","toastContainer","createElement","body","appendChild","setToastPosition","position","toast","config","showToast","info","Object","assign","type","error","success","warning","showModalLoading","message","modal","keyboard","loading","innerText","getCoreDelegate","attachView","showModal","update","text","innerHTML","finish","timeout","undefined","setTimeout","closeModal","async","removeView","Animation","mediumTime","applyPolyfills"],"sources":["src/components/category-filter/filter-state.ts","src/components/toast/toast-utils.ts","src/components/utils/modal/loading.ts","src/index.ts"],"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\nimport { LogicalFilterOperator } from './logical-filter-operator';\nexport class FilterState {\n  public tokens: string[];\n  public categories: {\n    id: string;\n    value: string;\n    operator: LogicalFilterOperator;\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 */\nimport { ShowToastResult } from './toast-container';\nexport type ToastType = 'info' | 'success' | 'error' | 'warning';\nexport type ToastPosition = 'bottom-right' | 'top-right';\n\nexport interface ToastConfig {\n  title?: string;\n  message: string | HTMLElement;\n  type?: ToastType;\n  autoClose?: boolean;\n  autoCloseDelay?: number;\n  icon?: string;\n  iconColor?: string;\n}\n\nexport function getToastContainer() {\n  const containerList = Array.from(\n    document.querySelectorAll('ix-toast-container')\n  );\n  const [container] = containerList;\n  if (containerList.length > 1) {\n    console.warn(\n      'Multiple toast containers were found. Only the first one will be used.'\n    );\n    return container;\n  }\n  if (!container) {\n    const toastContainer = document.createElement('ix-toast-container');\n    document.body.appendChild(toastContainer);\n\n    return toastContainer;\n  }\n  return container;\n}\n\nexport function setToastPosition(position: ToastPosition) {\n  const container = getToastContainer();\n  container.position = position;\n}\n\nfunction toast(config: ToastConfig): Promise<ShowToastResult> {\n  const container = getToastContainer();\n  return container.showToast(config);\n}\n\ntoast.info = (config: ToastConfig) => {\n  return toast({\n    ...config,\n    type: 'info',\n  });\n};\n\ntoast.error = (config: ToastConfig) => {\n  return toast({\n    ...config,\n    type: 'error',\n  });\n};\n\ntoast.success = (config: ToastConfig) => {\n  return toast({\n    ...config,\n    type: 'success',\n  });\n};\n\ntoast.warning = (config: ToastConfig) => {\n  return toast({\n    ...config,\n    type: 'warning',\n  });\n};\n\nexport { toast };\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 Animation from '../animation';\nimport { getCoreDelegate } from '../delegate';\n\nexport function showModalLoading(message: string) {\n  const modal = document.createElement('ix-modal');\n  modal.keyboard = false;\n\n  const loading = document.createElement('ix-modal-loading');\n  loading.innerText = message;\n  modal.appendChild(loading);\n\n  getCoreDelegate().attachView(modal);\n  modal.showModal();\n\n  return {\n    update: (text: string) => (loading.innerHTML = text),\n    finish: (text?: string, timeout: number = 250) => {\n      if (text !== undefined) {\n        loading.innerText = text;\n      } else {\n        timeout = 0;\n      }\n      setTimeout(() => {\n        modal.closeModal(null);\n        setTimeout(\n          async () => await getCoreDelegate().removeView(modal),\n          Animation.mediumTime\n        );\n      }, timeout);\n    },\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\nexport * from './components/category-filter/filter-state';\nexport * from './components/category-filter/input-state';\nexport * from './components/category-filter/logical-filter-operator';\nexport { FlipTileState } from './components/flip-tile/flip-tile-state';\nexport * from './components/toast/toast-utils';\nexport * from './components/tree-item/default-tree-item';\nexport * from './components/tree/tree-model';\nexport * from './components/upload/upload-file-state';\nexport * from './components/utils/delegate';\nexport * from './components/utils/modal';\nexport { NotificationColor } from './components/utils/notification-color';\nexport {\n  convertToAbbreviationString,\n  convertToRemString,\n} from './components/utils/rwd.util';\nexport * from './components/utils/theme-switcher';\n\nexport async function applyPolyfills() {\n  /**\n   * Placeholder to not break existing applications\n   * https://github.com/ionic-team/stencil/issues/5780\n   */\n}\n"],"mappings":"kpBAUaA,G,SCYGC,IACd,MAAMC,EAAgBC,MAAMC,KAC1BC,SAASC,iBAAiB,uBAE5B,MAAOC,GAAaL,EACpB,GAAIA,EAAcM,OAAS,EAAG,CAC5BC,QAAQC,KACN,0EAEF,OAAOH,C,CAET,IAAKA,EAAW,CACd,MAAMI,EAAiBN,SAASO,cAAc,sBAC9CP,SAASQ,KAAKC,YAAYH,GAE1B,OAAOA,C,CAET,OAAOJ,CACT,C,SAEgBQ,EAAiBC,GAC/B,MAAMT,EAAYN,IAClBM,EAAUS,SAAWA,CACvB,CAEA,SAASC,EAAMC,GACb,MAAMX,EAAYN,IAClB,OAAOM,EAAUY,UAAUD,EAC7B,CAEAD,EAAMG,KAAQF,GACLD,EAAKI,OAAAC,OAAAD,OAAAC,OAAA,GACPJ,GAAM,CACTK,KAAM,UAIVN,EAAMO,MAASN,GACND,EAAKI,OAAAC,OAAAD,OAAAC,OAAA,GACPJ,GAAM,CACTK,KAAM,WAIVN,EAAMQ,QAAWP,GACRD,EAAKI,OAAAC,OAAAD,OAAAC,OAAA,GACPJ,GAAM,CACTK,KAAM,aAIVN,EAAMS,QAAWR,GACRD,EAAKI,OAAAC,OAAAD,OAAAC,OAAA,GACPJ,GAAM,CACTK,KAAM,a,SChEMI,EAAiBC,GAC/B,MAAMC,EAAQxB,SAASO,cAAc,YACrCiB,EAAMC,SAAW,MAEjB,MAAMC,EAAU1B,SAASO,cAAc,oBACvCmB,EAAQC,UAAYJ,EACpBC,EAAMf,YAAYiB,GAElBE,IAAkBC,WAAWL,GAC7BA,EAAMM,YAEN,MAAO,CACLC,OAASC,GAAkBN,EAAQO,UAAYD,EAC/CE,OAAQ,CAACF,EAAeG,EAAkB,OACxC,GAAIH,IAASI,UAAW,CACtBV,EAAQC,UAAYK,C,KACf,CACLG,EAAU,C,CAEZE,YAAW,KACTb,EAAMc,WAAW,MACjBD,YACEE,eAAkBX,IAAkBY,WAAWhB,IAC/CiB,EAAUC,WACX,GACAP,EAAQ,EAGjB,CCdOI,eAAeI,IAKtB,Q"}

package/dist/siemens-ix/p-02ed5606.entry.js

@@ -0,0 +1,2 @@
+import{r as o,c as e,h as t,H as r}from"./p-f86a894a.js";import{D as n}from"./p-f5e574da.js";const a="label{color:var(--theme-color-soft-text);padding:2px 0px}label.label-alignment-left{padding:6px 0px}input{font-feature-settings:\"clig\" off, \"liga\" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-md);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;min-height:2rem;width:100%;padding:0.25rem 0.5rem;background-color:var(--theme-input--background);color:var(--theme-input--color);-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;text-overflow:ellipsis;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color);border-radius:var(--theme-input--border-radius);box-shadow:var(--theme-input--box-shadow)}input:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}input:-webkit-autofill,input:autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}input::-moz-placeholder{color:var(--theme-input-hint--color)}input::placeholder{color:var(--theme-input-hint--color)}input:not(.readonly):not([readonly]):not([readOnly]):not(:-moz-read-only).hover,input:not(.readonly):not([readonly]):not([readOnly]):not(:-moz-read-only):hover{border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}input:not(.readonly):not([readonly]):not([readOnly]):not(:read-only).hover,input:not(.readonly):not([readonly]):not([readOnly]):not(:read-only):hover{border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}input:not(.readonly):not([readonly]):not([readOnly]):not(:-moz-read-only).focus,input:not(.readonly):not([readonly]):not([readOnly]):not(:-moz-read-only):focus{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}input:not(.readonly):not([readonly]):not([readOnly]):not(:read-only).focus,input:not(.readonly):not([readonly]):not([readOnly]):not(:read-only):focus{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}input:-moz-read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}input.read-only,input:read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}input.read-only::-moz-placeholder,input:read-only::-moz-placeholder{color:transparent}input:-moz-read-only::placeholder{color:transparent}input.read-only::placeholder,input:read-only::placeholder{color:transparent}input:disabled{box-shadow:none;background-color:transparent;outline:none;border:none;color:var(--theme-input--color--disabled);border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled)}input:disabled::-moz-placeholder{color:transparent}input:disabled::placeholder{color:transparent}input[type=number]{text-align:right}input[type=number]::-webkit-inner-spin-button{margin-right:-2px;margin-left:2px;display:none}textarea{padding:0.375rem 1.25rem 0.375rem 0.5rem}textarea{font-feature-settings:\"clig\" off, \"liga\" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-md);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;min-height:2rem;width:100%;padding:0.25rem 0.5rem;background-color:var(--theme-input--background);color:var(--theme-input--color);-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;text-overflow:ellipsis;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color);border-radius:var(--theme-input--border-radius);box-shadow:var(--theme-input--box-shadow)}textarea:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}textarea:-webkit-autofill,textarea:autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}textarea::-moz-placeholder{color:var(--theme-input-hint--color)}textarea::placeholder{color:var(--theme-input-hint--color)}textarea:not(.readonly):not([readonly]):not([readOnly]):not(:-moz-read-only).hover,textarea:not(.readonly):not([readonly]):not([readOnly]):not(:-moz-read-only):hover{border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}textarea:not(.readonly):not([readonly]):not([readOnly]):not(:read-only).hover,textarea:not(.readonly):not([readonly]):not([readOnly]):not(:read-only):hover{border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}textarea:not(.readonly):not([readonly]):not([readOnly]):not(:-moz-read-only).focus,textarea:not(.readonly):not([readonly]):not([readOnly]):not(:-moz-read-only):focus{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}textarea:not(.readonly):not([readonly]):not([readOnly]):not(:read-only).focus,textarea:not(.readonly):not([readonly]):not([readOnly]):not(:read-only):focus{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}textarea:-moz-read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}textarea.read-only,textarea:read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}textarea.read-only::-moz-placeholder,textarea:read-only::-moz-placeholder{color:transparent}textarea:-moz-read-only::placeholder{color:transparent}textarea.read-only::placeholder,textarea:read-only::placeholder{color:transparent}textarea:disabled{box-shadow:none;background-color:transparent;outline:none;border:none;color:var(--theme-input--color--disabled);border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled)}textarea:disabled::-moz-placeholder{color:transparent}textarea:disabled::placeholder{color:transparent}textarea~.valid-feedback,textarea~.invalid-feedback,input~.valid-feedback,input~.invalid-feedback{display:none;font-feature-settings:\"clig\" off, \"liga\" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-md);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}form textarea~.valid-feedback,form input~.valid-feedback{color:var(--theme-color-success)}form textarea~.invalid-feedback,form input~.invalid-feedback{color:var(--theme-color-alarm-text)}form:not([novalidate]) :invalid,form:not([novalidate]) .is-invalid,form.was-validated :invalid,form.was-validated .is-invalid{background-color:var(--theme-input-error--background);border-color:var(--theme-input-error--border-color);background-image:url(\"data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg width='512px' height='512px' viewBox='0 0 512 512' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3C!-- Generator: sketchtool 62 (101010) - https://sketch.com --%3E%3Ctitle%3Eerror%3C/title%3E%3Cdesc%3ECreated with sketchtool.%3C/desc%3E%3Cg id='Page-1' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd' fill-opacity='0.75'%3E%3Cg id='error' fill='%23ff2640'%3E%3Cg id='error/error'%3E%3Cpath d='M256,42.6666667 C373.626371,42.6666667 469.333333,138.373627 469.333333,256 C469.333333,373.626371 373.626371,469.333333 256,469.333333 C138.373627,469.333333 42.6666667,373.626371 42.6666667,256 C42.6666667,138.373627 138.373627,42.6666667 256,42.6666667 Z M256,85.3333333 C161.559631,85.3333333 85.3333333,161.559631 85.3333333,256 C85.3333333,350.44037 161.559631,426.666667 256,426.666667 C350.44037,426.666667 426.666667,350.44037 426.666667,256 C426.666667,161.559631 350.44037,85.3333333 256,85.3333333 Z M326.248389,155.581722 L356.418278,185.751611 L286.168667,255.999667 L356.418278,326.248389 L326.248389,356.418278 L255.999667,286.168667 L185.751611,356.418278 L155.581722,326.248389 L225.829667,255.999667 L155.581722,185.751611 L185.751611,155.581722 L255.999667,225.829667 L326.248389,155.581722 Z' id='Combined-Shape'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E\") !important;background-position:left calc(0.375em + 0.1875rem) center;padding-right:0.75rem;padding-left:calc(1.5em + 0.75rem);background-size:18px;background-repeat:no-repeat}form:not([novalidate]) :invalid~.invalid-feedback,form:not([novalidate]) .is-invalid~.invalid-feedback,form.was-validated :invalid~.invalid-feedback,form.was-validated .is-invalid~.invalid-feedback{display:block}form:not([novalidate]) :valid~.valid-feedback,form:not([novalidate]) .is-valid~.valid-feedback,form.was-validated :valid~.valid-feedback,form.was-validated .is-valid~.valid-feedback{display:block}form:not(.was-validated) .invalid-feedback,form:not(.was-validated) .valid-feedback{display:none !important}textarea.ix-info:not(.disabled):not(:disabled):not([disabled]),input.ix-info:not(.disabled):not(:disabled):not([disabled]){border-color:var(--theme-input--border-color--info)}textarea.ix-info:not(.disabled):not(:disabled):not([disabled]):hover,input.ix-info:not(.disabled):not(:disabled):not([disabled]):hover{border-color:var(--theme-input--border-color--info--hover) !important}textarea.ix-info:not(.disabled):not(:disabled):not([disabled]):active,input.ix-info:not(.disabled):not(:disabled):not([disabled]):active{border-color:var(--theme-input--border-color--info--active) !important}textarea.ix-warning:not(.disabled):not(:disabled):not([disabled]),input.ix-warning:not(.disabled):not(:disabled):not([disabled]){border-color:var(--theme-input--border-color--warning--active) !important}textarea.ix-warning:not(.disabled):not(:disabled):not([disabled]):hover,input.ix-warning:not(.disabled):not(:disabled):not([disabled]):hover{border-color:var(--theme-input--border-color--warning--active) !important}textarea.ix-warning:not(.disabled):not(:disabled):not([disabled]):active,input.ix-warning:not(.disabled):not(:disabled):not([disabled]):active{border-color:var(--theme-input--border-color--warning--active) !important}textarea[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]),input[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]){background-color:var(--theme-input--background--invalid);border-color:var(--theme-input--border-color--invalid)}textarea[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]),input[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]){border-color:var(--theme-input--border-color--invalid) !important}textarea[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):hover,input[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):hover{border-color:var(--theme-input--border-color--invalid--hover) !important}textarea[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):active,input[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):active{border-color:var(--theme-input--border-color--invalid--active) !important}:host{display:block;position:relative;width:22rem}: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 ::-webkit-scrollbar{width:0.5rem;height:0.5rem}: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 ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .form-control,:host .form-control-plaintext{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text);color:var(--theme-input--color);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--theme-input--border-radius);height:2rem;min-height:2rem;min-width:2rem;background-color:var(--theme-input--background);border:solid 1px var(--theme-input--border-color);box-shadow:var(--theme-input--box-shadow);padding-inline-start:0.5rem;padding-inline-end:0.5rem}:host .form-control::-moz-placeholder,:host .form-control-plaintext::-moz-placeholder{color:var(--theme-input-hint--color)}:host .form-control::placeholder,:host .form-control-plaintext::placeholder{color:var(--theme-input-hint--color)}:host .form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled),:host .form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled){cursor:pointer}:host .form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled),:host .form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled){cursor:pointer}:host .form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover,:host .form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover{background-color:var(--theme-input--background--hover);border-color:var(--theme-input--border-color--hover);cursor:auto}:host .form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover,:host .form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover{background-color:var(--theme-input--background--hover);border-color:var(--theme-input--border-color--hover);cursor:auto}:host .form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible,:host .form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible{background-color:var(--theme-input--background--focus);border-color:var(--theme-input--border-color--focus);outline-offset:var(--theme-input--focus--outline-offset);box-shadow:var(--theme-input--box-shadow);outline:1px solid var(--theme-color-focus-bdr)}:host .form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible,:host .form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible{background-color:var(--theme-input--background--focus);border-color:var(--theme-input--border-color--focus);outline-offset:var(--theme-input--focus--outline-offset);box-shadow:var(--theme-input--box-shadow);outline:1px solid var(--theme-color-focus-bdr)}:host .form-control:focus-visible{color:var(--theme-input--color)}:host .form-control[type=number]{text-align:right}:host .form-control[type=number]::-webkit-inner-spin-button{margin-right:-2px;margin-left:2px;display:none}:host .form-control.readonly,:host .form-control[readonly]{background:transparent !important;border-block-start:none !important;border-inline-start:none !important;border-inline-end:none !important;border-radius:0rem}:host .form-control:-moz-read-only{box-shadow:none !important;outline:none !important;border-color:var(--theme-input--border-color);cursor:default !important}:host .form-control:read-only,:host .form-control[readonly],:host .form-control[readOnly],:host .form-control.readonly{box-shadow:none !important;outline:none !important;border-color:var(--theme-input--border-color);cursor:default !important}:host .form-control:read-only::-moz-placeholder,:host .form-control[readonly]::-moz-placeholder,:host .form-control[readOnly]::-moz-placeholder,:host .form-control.readonly::-moz-placeholder{color:transparent}:host .form-control:-moz-read-only::placeholder{color:transparent}:host .form-control:read-only::placeholder,:host .form-control[readonly]::placeholder,:host .form-control[readOnly]::placeholder,:host .form-control.readonly::placeholder{color:transparent}:host .form-control:disabled,:host .form-control.disabled{background:transparent !important;border-block-start:none !important;border-inline-start:none !important;border-inline-end:none !important;border-radius:0rem;color:var(--theme-color-weak-text);border-color:var(--theme-input--border-color-bottom--disabled)}:host .form-control:disabled::-moz-placeholder,:host .form-control.disabled::-moz-placeholder{color:transparent}:host .form-control:disabled::placeholder,:host .form-control.disabled::placeholder{color:transparent}:host .form-control-plaintext{outline:0}:host .form-group{position:relative}:host .input-wrapper{display:flex;position:relative;align-items:center;flex-wrap:nowrap}:host .input-wrapper>.glyph{display:block;position:absolute;margin-inline-start:0.312rem;color:var(--theme-color-std-text)}:host .input-wrapper>input{padding-inline-start:2.2rem}:host select.form-control{padding:0 0.312rem}:host textarea.form-control{padding:0.375rem 0.5rem}:host input.disabled,:host input:disabled{color:var(--theme-input--color--disabled)}:host input:-moz-read-only{cursor:default}:host input:read-only,:host input.readonly{cursor:default}@media (max-width: 576px){:host .clock{padding:1.5rem 0}:host .header{height:1.5rem !important}}@media (min-width: 576px){:host .clock{padding:4.25rem 0}:host .header{height:2.5rem !important}}:host .header{display:flex;align-items:center;justify-content:center;height:2.5rem}:host .flex{display:flex}:host .clock{display:flex;justify-content:center;align-items:center}:host input,:host .time-reference{width:2.625rem;height:1.5rem;text-align:center;margin-top:0.25rem;margin-bottom:0.25rem;}:host input::-webkit-outer-spin-button,:host input::-webkit-inner-spin-button,:host .time-reference::-webkit-outer-spin-button,:host .time-reference::-webkit-inner-spin-button{-webkit-appearance:none;margin:0 0.3125rem}:host input[type=number],:host .time-reference[type=number]{-moz-appearance:textfield}:host .form-control[type=number]{text-align:center}:host .columns{display:flex;flex-direction:column;align-items:center;justify-content:space-around}:host .column-seperator{display:flex;align-items:center;margin:0 0.25rem}:host .button{display:flex;justify-content:flex-end}:host .default-space{margin-left:1rem}:host .text-align{text-align:center}:host .hidden{display:none}:host .time-reference{margin-top:0.5rem;margin-bottom:0.5rem}";const i=a;const l=class{constructor(t){o(this,t);this.timeSelect=e(this,"timeSelect",7);this.done=e(this,"done",7);this.timeChange=e(this,"timeChange",7);this.format="TT";this.corners="rounded";this.standaloneAppearance=true;this.individual=true;this.showHour=true;this.showMinutes=true;this.showSeconds=true;this.time=n.now().toFormat(this.format);this.showTimeReference=undefined;this.timeReference=undefined;this.textSelectTime="Done";this.textTime="Time";this._time=undefined;this._timeRef=undefined;this._formattedTime=undefined}watchTimePropHandler(o){this._time=n.fromFormat(o,this.format);if(!this._time.isValid){throw new Error("Format is not supported or not correct")}}componentWillLoad(){this._time=n.fromFormat(this.time,this.format);if(!this._time.isValid){console.error(`Invalid time format. The configured format does not match the format of the passed time. ${this._time.invalidReason}: ${this._time.invalidExplanation}`);return}this._timeRef=this.format.includes("a")?n.fromFormat(this.time,this.format).toFormat("a"):undefined;this.formatTime()}formatTime(){const[o,e,t]=this._time.toFormat(this.format).split(" ")[0].split(":");this._formattedTime={hour:o,minute:e,second:t}}onInternalTimeChange(){this.timeChange.emit(this._time.toFormat(this.format));if(this._timeRef)this._timeRef=this._time.toFormat("a")}timeUpdate(o,e){let t=n.now().endOf("day").get(o);if(this._timeRef==="PM"&&o==="hour")e+=12;if(this._timeRef==="AM"&&o==="hour")t=12;if(e>t){e=t}else if(e<0){e=0}this._time=this._time.set({[o]:e});return e}changeTimeReference(){this._timeRef=this._timeRef==="AM"?"PM":"AM";if(!this._time.toFormat("a").includes(this._timeRef)){this._time=this._time.plus({hour:12})}}async getCurrentTime(){return this._time.toFormat(this.format)}render(){let o=[{unit:"hour",placeholder:"HH",hidden:!this.showHour},{unit:"minute",placeholder:"MM",hidden:!this.showMinutes},{unit:"second",placeholder:"SS",hidden:!this.showSeconds}];o=o.filter((o=>!o.hidden));return t(r,{key:"052caa67744d0fa735d2bf420b6ee8b36c589593"},t("ix-date-time-card",{key:"5d0e76c403f03b292b75ae83ea2c931f57dc512d",standaloneAppearance:this.standaloneAppearance,corners:this.corners},t("div",{key:"2d56ae54a7dc9ea16c1a2c78ffafcd9b01076075",class:"header",slot:"header"},t("ix-typography",{key:"fd875137c44524b3b9d3e256ba1d574d9bd9c0e8",variant:"default-title"},this.textTime||"Time")),t("div",{key:"96306a898cef41ad37446abacecb00bc9fb3c3e8",class:"clock"},o.map(((e,r)=>t("div",{class:"flex"},t("div",{class:{columns:true,hidden:e.hidden}},t("ix-icon-button",{size:"16",onClick:()=>this._time=this._time.plus({[e.unit]:1}),ghost:true,icon:"chevron-up",variant:"primary",class:"arrows"}),t("input",{class:"form-control",name:e.unit,type:"number",placeholder:e.placeholder,value:this._formattedTime?this._formattedTime[e.unit]:null,onKeyDown:o=>{if(o.key!=="ArrowUp"&&o.key!=="ArrowDown")return;const t=o.key==="ArrowUp"?1:-1;this._time=this._time.plus({[e.unit]:t});o.preventDefault()},onChange:o=>{let t=o.target;t.value=this.timeUpdate(e.unit,+t.value).toString()}}),t("ix-icon-button",{size:"16",onClick:()=>this._time=this._time.minus({[e.unit]:1}),ghost:true,icon:"chevron-down",variant:"primary",class:"arrows"})),r!==o.length-1&&t("div",{class:{"column-seperator":true,hidden:e.hidden}},":")))),t("div",{key:"e8edf6d77d7d6680f168555d9d893b58035dc94f",class:{columns:true,"default-space":true,hidden:this._timeRef===undefined}},t("ix-icon-button",{key:"e77e0c724e814bad7077aaace11558a01e8247e3",size:"16",onClick:()=>this.changeTimeReference(),ghost:true,icon:"chevron-up",variant:"primary",class:"arrows"}),t("div",{key:"eff1b1d2b8af04033eb17d8148d6a8e16cc5f247",class:"time-reference"},this._timeRef),t("ix-icon-button",{key:"4aa17f826e2c381ad13f4f13ea0773d5a703837a",size:"16",onClick:()=>this.changeTimeReference(),ghost:true,icon:"chevron-down",variant:"primary",class:"arrows"}))),t("div",{key:"260a32b5259c25e16aaca379c0ad4797e21f9108",class:{button:true,hidden:!this.standaloneAppearance}},t("ix-button",{key:"2568b6206b87a3661b3955141f59cfb2242edb71",onClick:()=>{this.timeSelect.emit(this._time.toFormat(this.format));this.done.emit(this._time.toFormat(this.format))}},this.textSelectTime))))}static get watchers(){return{time:["watchTimePropHandler"],_time:["formatTime","onInternalTimeChange"]}}};l.style=i;export{l as ix_time_picker};
+//# sourceMappingURL=p-02ed5606.entry.js.map

package/dist/siemens-ix/{p-4290098e.entry.js.map → p-02ed5606.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["timePickerCss","IxTimePickerStyle0","TimePicker","DateTime","now","toFormat","this","format","undefined","watchTimePropHandler","newValue","_time","fromFormat","isValid","Error","componentWillLoad","time","console","error","invalidReason","invalidExplanation","_timeRef","includes","formatTime","hour","minute","second","split","_formattedTime","onInternalTimeChange","timeChange","emit","timeUpdate","unit","value","maxValue","endOf","get","set","changeTimeReference","plus","getCurrentTime","render","timepickerInformation","placeholder","hidden","showHour","showMinutes","showSeconds","filter","item","h","Host","key","standaloneAppearance","corners","class","slot","variant","textTime","map","descriptor","index","columns","size","onClick","ghost","icon","name","type","onKeyDown","e","preventDefault","onChange","inputElement","target","toString","minus","length","button","timeSelect","done","textSelectTime"],"sources":["src/components/time-picker/time-picker.scss?tag=ix-time-picker&encapsulation=shadow","src/components/time-picker/time-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@import 'common-variables';\n@import 'mixins/shadow-dom/component';\n@import 'components/form/input';\n\n:host {\n  @include ix-component;\n  @import 'legacy/components/forms';\n\n  display: block;\n  position: relative;\n  width: 22rem;\n\n  @media (max-width: 576px) {\n    .clock {\n      padding: 1.5rem 0;\n    }\n\n    .header {\n      height: $medium-control-height !important;\n    }\n  }\n\n  @media (min-width: 576px) {\n    .clock {\n      padding: 4.25rem 0;\n    }\n\n    .header {\n      height: $large-control-height !important;\n    }\n  }\n\n  .header {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    height: $large-control-height;\n  }\n\n  .flex {\n    display: flex;\n  }\n\n  .clock {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n  }\n\n  input,\n  .time-reference {\n    width: 2.625rem;\n    height: $large-space;\n    text-align: center;\n    margin-top: 0.25rem;\n    margin-bottom: 0.25rem;\n\n    /* Chrome, Safari, Edge, Opera */\n    &::-webkit-outer-spin-button,\n    &::-webkit-inner-spin-button {\n      -webkit-appearance: none;\n      margin: 0 0.3125rem;\n    }\n\n    /* Firefox */\n    &[type='number'] {\n      -moz-appearance: textfield;\n    }\n  }\n\n  .form-control[type='number'] {\n    text-align: center;\n  }\n\n  .columns {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: space-around;\n  }\n\n  .column-seperator {\n    display: flex;\n    align-items: center;\n    margin: 0 $tiny-space;\n  }\n\n  .button {\n    display: flex;\n    justify-content: flex-end;\n  }\n\n  .default-space {\n    margin-left: $default-space;\n  }\n\n  .text-align {\n    text-align: center;\n  }\n\n  .hidden {\n    display: none;\n  }\n\n  .time-reference {\n    margin-top: 0.5rem;\n    margin-bottom: 0.5rem;\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 {\n  Component,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\nimport { DateTime } from 'luxon';\nimport { DateTimeCardCorners } from '../date-time-card/date-time-card';\n\nexport type TimePickerCorners = DateTimeCardCorners;\n\ninterface TimePickerDescriptor {\n  unit: 'hour' | 'minute' | 'second';\n  placeholder: string;\n  hidden: boolean;\n}\n\ninterface TimeOutputFormat {\n  hour: string;\n  minute: string;\n  second: string;\n}\n\n@Component({\n  tag: 'ix-time-picker',\n  styleUrl: 'time-picker.scss',\n  shadow: true,\n})\nexport class TimePicker {\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   * @since 1.1.0\n   */\n  @Prop() format: string = 'TT';\n\n  /**\n   * Corner style\n   */\n  @Prop() corners: TimePickerCorners = 'rounded';\n\n  /**\n   * Controls the visual presentation and styling of the component when it is displayed as a standalone element\n   */\n  @Prop() standaloneAppearance: boolean = true;\n\n  /**\n   * @deprecated Not supported since 2.0.0.\n   */\n  @Prop() individual: boolean = true;\n\n  /**\n   * Show hour input\n   */\n  @Prop() showHour = true;\n\n  /**\n   * Show minutes input\n   */\n  @Prop() showMinutes = true;\n\n  /**\n   * Show seconds input\n   */\n  @Prop() showSeconds = true;\n\n  /**\n   * Select time with format string\n   * Format has to match the `format` property.\n   *\n   * @since 1.1.0\n   */\n  @Prop() time: string = DateTime.now().toFormat(this.format);\n\n  @Watch('time')\n  watchTimePropHandler(newValue: string) {\n    this._time = DateTime.fromFormat(newValue, this.format);\n    if (!this._time.isValid) {\n      throw new Error('Format is not supported or not correct');\n    }\n  }\n\n  /**\n   * Show time reference input\n   *\n   * @since 1.1.0 time reference is default aligned with format tt\n   * @deprecated Since 2.0.0 time reference will be displayed depending on format.\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable\n  @Prop({ mutable: true }) showTimeReference?: boolean = undefined;\n\n  /**\n   * Set time reference\n   */\n  @Prop() timeReference: 'AM' | 'PM' | undefined;\n\n  /**\n   * Text of date select button\n   *\n   * @since 1.1.0\n   */\n  @Prop() textSelectTime = 'Done';\n\n  /**\n   * Text for top label\n   *\n   * @since 2.1.0\n   */\n  @Prop() textTime: string = 'Time';\n\n  /**\n   * Time event\n   */\n  @Event() timeSelect: EventEmitter<string>;\n\n  /**\n   * Time event\n   * @deprecated Will be removed in 3.0.0. Use `time-select` event.\n   */\n  @Event() done: EventEmitter<string>;\n\n  /**\n   * Time change event\n   */\n  @Event() timeChange: EventEmitter<string>;\n\n  @State() private _time: DateTime;\n  @State() private _timeRef: 'AM' | 'PM' | undefined;\n  @State() private _formattedTime: TimeOutputFormat;\n\n  componentWillLoad() {\n    this._time = DateTime.fromFormat(this.time, this.format);\n\n    if (!this._time.isValid) {\n      console.error(\n        `Invalid time format. The configured format does not match the format of the passed time. ${this._time.invalidReason}: ${this._time.invalidExplanation}`\n      );\n      return;\n    }\n\n    this._timeRef = this.format.includes('a')\n      ? (DateTime.fromFormat(this.time, this.format).toFormat('a') as\n          | 'AM'\n          | 'PM')\n      : undefined;\n    this.formatTime();\n  }\n\n  @Watch('_time')\n  formatTime() {\n    const [hour, minute, second] = this._time\n      .toFormat(this.format)\n      .split(' ')[0]\n      .split(':');\n\n    this._formattedTime = {\n      hour: hour,\n      minute: minute,\n      second: second,\n    };\n  }\n\n  @Watch('_time')\n  onInternalTimeChange() {\n    this.timeChange.emit(this._time.toFormat(this.format));\n    if (this._timeRef) this._timeRef = this._time.toFormat('a') as 'AM' | 'PM';\n  }\n\n  timeUpdate(unit: 'hour' | 'minute' | 'second', value: number): number {\n    let maxValue = DateTime.now().endOf('day').get(unit);\n\n    if (this._timeRef === 'PM' && unit === 'hour') value += 12;\n    if (this._timeRef === 'AM' && unit === 'hour') maxValue = 12;\n\n    if (value > maxValue) {\n      value = maxValue;\n    } else if (value < 0) {\n      value = 0;\n    }\n\n    this._time = this._time.set({\n      [unit]: value,\n    });\n    return value;\n  }\n\n  changeTimeReference() {\n    this._timeRef = this._timeRef === 'AM' ? 'PM' : 'AM';\n\n    if (!this._time.toFormat('a').includes(this._timeRef)) {\n      this._time = this._time.plus({\n        hour: 12,\n      });\n    }\n  }\n\n  /**\n   * Get the current time based on the wanted format\n   */\n  @Method()\n  async getCurrentTime() {\n    return this._time.toFormat(this.format);\n  }\n\n  render() {\n    let timepickerInformation: TimePickerDescriptor[] = [\n      {\n        unit: 'hour',\n        placeholder: 'HH',\n        hidden: !this.showHour,\n      },\n      {\n        unit: 'minute',\n        placeholder: 'MM',\n        hidden: !this.showMinutes,\n      },\n      {\n        unit: 'second',\n        placeholder: 'SS',\n        hidden: !this.showSeconds,\n      },\n    ];\n\n    timepickerInformation = timepickerInformation.filter(\n      (item) => !item.hidden\n    );\n\n    return (\n      <Host>\n        <ix-date-time-card\n          standaloneAppearance={this.standaloneAppearance}\n          corners={this.corners}\n        >\n          <div class=\"header\" slot=\"header\">\n            <ix-typography variant=\"default-title\">\n              {this.textTime || 'Time'}\n            </ix-typography>\n          </div>\n          <div class=\"clock\">\n            {timepickerInformation.map((descriptor, index: number) => (\n              <div class=\"flex\">\n                <div class={{ columns: true, hidden: descriptor.hidden }}>\n                  <ix-icon-button\n                    size=\"16\"\n                    onClick={() =>\n                      (this._time = this._time.plus({\n                        [descriptor.unit]: 1,\n                      }))\n                    }\n                    ghost\n                    icon=\"chevron-up\"\n                    variant=\"primary\"\n                    class=\"arrows\"\n                  ></ix-icon-button>\n\n                  <input\n                    class=\"form-control\"\n                    name={descriptor.unit}\n                    type=\"number\"\n                    placeholder={descriptor.placeholder}\n                    value={\n                      this._formattedTime\n                        ? this._formattedTime[descriptor.unit]\n                        : null\n                    }\n                    onKeyDown={(e) => {\n                      if (e.key !== 'ArrowUp' && e.key !== 'ArrowDown') return;\n\n                      const value = e.key === 'ArrowUp' ? 1 : -1;\n                      this._time = this._time.plus({\n                        [descriptor.unit]: value,\n                      });\n                      e.preventDefault();\n                    }}\n                    onChange={(e: any) => {\n                      let inputElement = e.target as HTMLInputElement;\n                      inputElement.value = this.timeUpdate(\n                        descriptor.unit,\n                        +inputElement.value\n                      ).toString();\n                    }}\n                  ></input>\n\n                  <ix-icon-button\n                    size=\"16\"\n                    onClick={() =>\n                      (this._time = this._time.minus({\n                        [descriptor.unit]: 1,\n                      }))\n                    }\n                    ghost\n                    icon=\"chevron-down\"\n                    variant=\"primary\"\n                    class=\"arrows\"\n                  ></ix-icon-button>\n                </div>\n\n                {index !== timepickerInformation.length - 1 && (\n                  <div\n                    class={{\n                      'column-seperator': true,\n                      hidden: descriptor.hidden,\n                    }}\n                  >\n                    :\n                  </div>\n                )}\n              </div>\n            ))}\n\n            <div\n              class={{\n                columns: true,\n                'default-space': true,\n                hidden: this._timeRef === undefined,\n              }}\n            >\n              <ix-icon-button\n                size=\"16\"\n                onClick={() => this.changeTimeReference()}\n                ghost\n                icon=\"chevron-up\"\n                variant=\"primary\"\n                class=\"arrows\"\n              ></ix-icon-button>\n              <div class=\"time-reference\">{this._timeRef}</div>\n              <ix-icon-button\n                size=\"16\"\n                onClick={() => this.changeTimeReference()}\n                ghost\n                icon=\"chevron-down\"\n                variant=\"primary\"\n                class=\"arrows\"\n              ></ix-icon-button>\n            </div>\n          </div>\n          <div class={{ button: true, hidden: !this.standaloneAppearance }}>\n            <ix-button\n              onClick={() => {\n                this.timeSelect.emit(this._time.toFormat(this.format));\n                this.done.emit(this._time.toFormat(this.format));\n              }}\n            >\n              {this.textSelectTime}\n            </ix-button>\n          </div>\n        </ix-date-time-card>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}
+{"version":3,"names":["timePickerCss","IxTimePickerStyle0","TimePicker","DateTime","now","toFormat","this","format","undefined","watchTimePropHandler","newValue","_time","fromFormat","isValid","Error","componentWillLoad","time","console","error","invalidReason","invalidExplanation","_timeRef","includes","formatTime","hour","minute","second","split","_formattedTime","onInternalTimeChange","timeChange","emit","timeUpdate","unit","value","maxValue","endOf","get","set","changeTimeReference","plus","getCurrentTime","render","timepickerInformation","placeholder","hidden","showHour","showMinutes","showSeconds","filter","item","h","Host","key","standaloneAppearance","corners","class","slot","variant","textTime","map","descriptor","index","columns","size","onClick","ghost","icon","name","type","onKeyDown","e","preventDefault","onChange","inputElement","target","toString","minus","length","button","timeSelect","done","textSelectTime"],"sources":["src/components/time-picker/time-picker.scss?tag=ix-time-picker&encapsulation=shadow","src/components/time-picker/time-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@import 'common-variables';\n@import 'mixins/shadow-dom/component';\n@import 'components/form/input';\n\n:host {\n  @include ix-component;\n  @import 'legacy/components/forms';\n\n  display: block;\n  position: relative;\n  width: 22rem;\n\n  @media (max-width: 576px) {\n    .clock {\n      padding: 1.5rem 0;\n    }\n\n    .header {\n      height: $medium-control-height !important;\n    }\n  }\n\n  @media (min-width: 576px) {\n    .clock {\n      padding: 4.25rem 0;\n    }\n\n    .header {\n      height: $large-control-height !important;\n    }\n  }\n\n  .header {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    height: $large-control-height;\n  }\n\n  .flex {\n    display: flex;\n  }\n\n  .clock {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n  }\n\n  input,\n  .time-reference {\n    width: 2.625rem;\n    height: $large-space;\n    text-align: center;\n    margin-top: 0.25rem;\n    margin-bottom: 0.25rem;\n\n    /* Chrome, Safari, Edge, Opera */\n    &::-webkit-outer-spin-button,\n    &::-webkit-inner-spin-button {\n      -webkit-appearance: none;\n      margin: 0 0.3125rem;\n    }\n\n    /* Firefox */\n    &[type='number'] {\n      -moz-appearance: textfield;\n    }\n  }\n\n  .form-control[type='number'] {\n    text-align: center;\n  }\n\n  .columns {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: space-around;\n  }\n\n  .column-seperator {\n    display: flex;\n    align-items: center;\n    margin: 0 $tiny-space;\n  }\n\n  .button {\n    display: flex;\n    justify-content: flex-end;\n  }\n\n  .default-space {\n    margin-left: $default-space;\n  }\n\n  .text-align {\n    text-align: center;\n  }\n\n  .hidden {\n    display: none;\n  }\n\n  .time-reference {\n    margin-top: 0.5rem;\n    margin-bottom: 0.5rem;\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 {\n  Component,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\nimport { DateTime } from 'luxon';\nimport { DateTimeCardCorners } from '../date-time-card/date-time-card';\n\nexport type TimePickerCorners = DateTimeCardCorners;\n\ninterface TimePickerDescriptor {\n  unit: 'hour' | 'minute' | 'second';\n  placeholder: string;\n  hidden: boolean;\n}\n\ninterface TimeOutputFormat {\n  hour: string;\n  minute: string;\n  second: string;\n}\n\n@Component({\n  tag: 'ix-time-picker',\n  styleUrl: 'time-picker.scss',\n  shadow: true,\n})\nexport class TimePicker {\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   * @since 1.1.0\n   */\n  @Prop() format: string = 'TT';\n\n  /**\n   * Corner style\n   */\n  @Prop() corners: TimePickerCorners = 'rounded';\n\n  /**\n   * Controls the visual presentation and styling of the component when it is displayed as a standalone element\n   */\n  @Prop() standaloneAppearance: boolean = true;\n\n  /**\n   * @deprecated Not supported since 2.0.0.\n   */\n  @Prop() individual: boolean = true;\n\n  /**\n   * Show hour input\n   */\n  @Prop() showHour = true;\n\n  /**\n   * Show minutes input\n   */\n  @Prop() showMinutes = true;\n\n  /**\n   * Show seconds input\n   */\n  @Prop() showSeconds = true;\n\n  /**\n   * Select time with format string\n   * Format has to match the `format` property.\n   *\n   * @since 1.1.0\n   */\n  @Prop() time: string = DateTime.now().toFormat(this.format);\n\n  @Watch('time')\n  watchTimePropHandler(newValue: string) {\n    this._time = DateTime.fromFormat(newValue, this.format);\n    if (!this._time.isValid) {\n      throw new Error('Format is not supported or not correct');\n    }\n  }\n\n  /**\n   * Show time reference input\n   *\n   * @since 1.1.0 time reference is default aligned with format tt\n   * @deprecated Since 2.0.0 time reference will be displayed depending on format.\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable\n  @Prop({ mutable: true }) showTimeReference?: boolean = undefined;\n\n  /**\n   * Set time reference\n   */\n  @Prop() timeReference: 'AM' | 'PM' | undefined;\n\n  /**\n   * Text of date select button\n   *\n   * @since 1.1.0\n   */\n  @Prop() textSelectTime = 'Done';\n\n  /**\n   * Text for top label\n   *\n   * @since 2.1.0\n   */\n  @Prop() textTime: string = 'Time';\n\n  /**\n   * Time event\n   */\n  @Event() timeSelect: EventEmitter<string>;\n\n  /**\n   * Time event\n   * @deprecated Will be removed in 3.0.0. Use `time-select` event.\n   */\n  @Event() done: EventEmitter<string>;\n\n  /**\n   * Time change event\n   */\n  @Event() timeChange: EventEmitter<string>;\n\n  @State() private _time: DateTime;\n  @State() private _timeRef: 'AM' | 'PM' | undefined;\n  @State() private _formattedTime: TimeOutputFormat;\n\n  componentWillLoad() {\n    this._time = DateTime.fromFormat(this.time, this.format);\n\n    if (!this._time.isValid) {\n      console.error(\n        `Invalid time format. The configured format does not match the format of the passed time. ${this._time.invalidReason}: ${this._time.invalidExplanation}`\n      );\n      return;\n    }\n\n    this._timeRef = this.format.includes('a')\n      ? (DateTime.fromFormat(this.time, this.format).toFormat('a') as\n          | 'AM'\n          | 'PM')\n      : undefined;\n    this.formatTime();\n  }\n\n  @Watch('_time')\n  formatTime() {\n    const [hour, minute, second] = this._time\n      .toFormat(this.format)\n      .split(' ')[0]\n      .split(':');\n\n    this._formattedTime = {\n      hour: hour,\n      minute: minute,\n      second: second,\n    };\n  }\n\n  @Watch('_time')\n  onInternalTimeChange() {\n    this.timeChange.emit(this._time.toFormat(this.format));\n    if (this._timeRef) this._timeRef = this._time.toFormat('a') as 'AM' | 'PM';\n  }\n\n  timeUpdate(unit: 'hour' | 'minute' | 'second', value: number): number {\n    let maxValue = DateTime.now().endOf('day').get(unit);\n\n    if (this._timeRef === 'PM' && unit === 'hour') value += 12;\n    if (this._timeRef === 'AM' && unit === 'hour') maxValue = 12;\n\n    if (value > maxValue) {\n      value = maxValue;\n    } else if (value < 0) {\n      value = 0;\n    }\n\n    this._time = this._time.set({\n      [unit]: value,\n    });\n    return value;\n  }\n\n  changeTimeReference() {\n    this._timeRef = this._timeRef === 'AM' ? 'PM' : 'AM';\n\n    if (!this._time.toFormat('a').includes(this._timeRef)) {\n      this._time = this._time.plus({\n        hour: 12,\n      });\n    }\n  }\n\n  /**\n   * Get the current time based on the wanted format\n   */\n  @Method()\n  async getCurrentTime() {\n    return this._time.toFormat(this.format);\n  }\n\n  render() {\n    let timepickerInformation: TimePickerDescriptor[] = [\n      {\n        unit: 'hour',\n        placeholder: 'HH',\n        hidden: !this.showHour,\n      },\n      {\n        unit: 'minute',\n        placeholder: 'MM',\n        hidden: !this.showMinutes,\n      },\n      {\n        unit: 'second',\n        placeholder: 'SS',\n        hidden: !this.showSeconds,\n      },\n    ];\n\n    timepickerInformation = timepickerInformation.filter(\n      (item) => !item.hidden\n    );\n\n    return (\n      <Host>\n        <ix-date-time-card\n          standaloneAppearance={this.standaloneAppearance}\n          corners={this.corners}\n        >\n          <div class=\"header\" slot=\"header\">\n            <ix-typography variant=\"default-title\">\n              {this.textTime || 'Time'}\n            </ix-typography>\n          </div>\n          <div class=\"clock\">\n            {timepickerInformation.map((descriptor, index: number) => (\n              <div class=\"flex\">\n                <div class={{ columns: true, hidden: descriptor.hidden }}>\n                  <ix-icon-button\n                    size=\"16\"\n                    onClick={() =>\n                      (this._time = this._time.plus({\n                        [descriptor.unit]: 1,\n                      }))\n                    }\n                    ghost\n                    icon=\"chevron-up\"\n                    variant=\"primary\"\n                    class=\"arrows\"\n                  ></ix-icon-button>\n\n                  <input\n                    class=\"form-control\"\n                    name={descriptor.unit}\n                    type=\"number\"\n                    placeholder={descriptor.placeholder}\n                    value={\n                      this._formattedTime\n                        ? this._formattedTime[descriptor.unit]\n                        : null\n                    }\n                    onKeyDown={(e) => {\n                      if (e.key !== 'ArrowUp' && e.key !== 'ArrowDown') return;\n\n                      const value = e.key === 'ArrowUp' ? 1 : -1;\n                      this._time = this._time.plus({\n                        [descriptor.unit]: value,\n                      });\n                      e.preventDefault();\n                    }}\n                    onChange={(e: any) => {\n                      let inputElement = e.target as HTMLInputElement;\n                      inputElement.value = this.timeUpdate(\n                        descriptor.unit,\n                        +inputElement.value\n                      ).toString();\n                    }}\n                  ></input>\n\n                  <ix-icon-button\n                    size=\"16\"\n                    onClick={() =>\n                      (this._time = this._time.minus({\n                        [descriptor.unit]: 1,\n                      }))\n                    }\n                    ghost\n                    icon=\"chevron-down\"\n                    variant=\"primary\"\n                    class=\"arrows\"\n                  ></ix-icon-button>\n                </div>\n\n                {index !== timepickerInformation.length - 1 && (\n                  <div\n                    class={{\n                      'column-seperator': true,\n                      hidden: descriptor.hidden,\n                    }}\n                  >\n                    :\n                  </div>\n                )}\n              </div>\n            ))}\n\n            <div\n              class={{\n                columns: true,\n                'default-space': true,\n                hidden: this._timeRef === undefined,\n              }}\n            >\n              <ix-icon-button\n                size=\"16\"\n                onClick={() => this.changeTimeReference()}\n                ghost\n                icon=\"chevron-up\"\n                variant=\"primary\"\n                class=\"arrows\"\n              ></ix-icon-button>\n              <div class=\"time-reference\">{this._timeRef}</div>\n              <ix-icon-button\n                size=\"16\"\n                onClick={() => this.changeTimeReference()}\n                ghost\n                icon=\"chevron-down\"\n                variant=\"primary\"\n                class=\"arrows\"\n              ></ix-icon-button>\n            </div>\n          </div>\n          <div class={{ button: true, hidden: !this.standaloneAppearance }}>\n            <ix-button\n              onClick={() => {\n                this.timeSelect.emit(this._time.toFormat(this.format));\n                this.done.emit(this._time.toFormat(this.format));\n              }}\n            >\n              {this.textSelectTime}\n            </ix-button>\n          </div>\n        </ix-date-time-card>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/siemens-ix/p-0681f4d8.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as t,h as o,H as r}from"./p-f86a894a.js";const a=":host{display:flex;align-items:center;height:32px;width:100%;cursor:pointer}: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 ::-webkit-scrollbar{width:0.5rem;height:0.5rem}: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 ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .tree-node-container{display:flex;align-items:center;height:2rem;flex-grow:1;align-items:center}:host .icon-toggle-container{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem}:host .icon-toggle-container ix-icon{transition:transform var(--theme-default-time) ease-in-out}:host .icon-toggle-container ix-icon.icon-toggle-down{transform:rotate(90deg)}:host(:not(.disabled):not(:disabled):not(.selected).hover),:host(:not(.disabled):not(:disabled):not(.selected):hover){background-color:var(--theme-tree-item--background--hover)}:host(:not(.disabled):not(:disabled):not(.selected).active),:host(:not(.disabled):not(:disabled):not(.selected):active){background-color:var(--theme-tree-item--background--active)}:host(.selected){background-color:var(--theme-tree-item--background--selected)}:host(.selected.hover),:host(.selected:hover){background-color:var(--theme-tree-item--background--selected-hover)}:host(.selected.active),:host(.selected:active){background-color:var(--theme-tree-item--background--selected-active)}";const s=a;const c=class{constructor(o){e(this,o);this.toggle=t(this,"toggle",7);this.itemClick=t(this,"itemClick",7);this.text=undefined;this.hasChildren=undefined;this.context=undefined}render(){var e,t,a;return o(r,{key:"4facce4de72cf050f1ca5160c23d513a51619182",class:{selected:(e=this.context)===null||e===void 0?void 0:e.isSelected}},o("div",{key:"6a5a090480876f134e2900b9ee04d529029b623b",class:"icon-toggle-container",onClick:e=>{e.preventDefault();this.toggle.emit()}},this.hasChildren?o("ix-icon",{name:"chevron-right",size:"16",class:{["icon-toggle-down"]:(t=this.context)===null||t===void 0?void 0:t.isExpanded},color:`color-${((a=this.context)===null||a===void 0?void 0:a.isExpanded)?"primary":"std-text"}`}):null),o("div",{key:"b46d172c5cb6685270e9259b7a5d9d27a4fab5aa",class:"tree-node-container",onClick:()=>{this.itemClick.emit()}},this.text,o("slot",{key:"a766a38ebb4913509fe9dceb9e2079653eca9423"})))}};c.style=s;export{c as ix_tree_item};
+//# sourceMappingURL=p-0681f4d8.entry.js.map

package/dist/siemens-ix/{p-cbbe9dee.entry.js.map → p-0681f4d8.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["treeItemCss","IxTreeItemStyle0","TreeItem","render","h","Host","key","class","selected","_a","this","context","isSelected","onClick","e","preventDefault","toggle","emit","hasChildren","name","size","_b","isExpanded","color","_c","itemClick","text"],"sources":["src/components/tree-item/tree-item.scss?tag=ix-tree-item&encapsulation=shadow","src/components/tree-item/tree-item.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@import 'common-variables';\n@import 'mixins/text-truncation';\n@import 'mixins/shadow-dom/component';\n\n:host {\n  @include ix-component;\n\n  display: flex;\n  align-items: center;\n\n  height: 32px;\n  width: 100%;\n\n  cursor: pointer;\n\n  .tree-node-container {\n    display: flex;\n    align-items: center;\n    height: $x-large-space;\n    flex-grow: 1;\n    align-items: center;\n  }\n\n  .icon-toggle-container {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 2rem;\n    height: 2rem;\n\n    ix-icon {\n      transition: transform var(--theme-default-time) ease-in-out;\n\n      &.icon-toggle-down {\n        transform: rotate(90deg);\n      }\n    }\n  }\n}\n\n:host(:not(.disabled):not(:disabled):not(.selected).hover),\n:host(:not(.disabled):not(:disabled):not(.selected):hover) {\n  background-color: var(--theme-tree-item--background--hover);\n}\n\n:host(:not(.disabled):not(:disabled):not(.selected).active),\n:host(:not(.disabled):not(:disabled):not(.selected):active) {\n  background-color: var(--theme-tree-item--background--active);\n}\n\n:host(.selected) {\n  background-color: var(--theme-tree-item--background--selected);\n}\n\n:host(.selected.hover),\n:host(.selected:hover) {\n  background-color: var(--theme-tree-item--background--selected-hover);\n}\n\n:host(.selected.active),\n:host(.selected:active) {\n  background-color: var(--theme-tree-item--background--selected-active);\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 { TreeItemContext } from '../tree/tree-model';\n\n@Component({\n  tag: 'ix-tree-item',\n  styleUrl: 'tree-item.scss',\n  shadow: true,\n})\nexport class TreeItem {\n  /**\n   * Text\n   */\n  @Prop() text: string;\n\n  /**\n   * Has tree item children\n   */\n  @Prop() hasChildren: boolean;\n\n  /**\n   * Context\n   */\n  @Prop() context: TreeItemContext;\n\n  /**\n   * Expand/Collapsed toggled\n   */\n  @Event() toggle: EventEmitter<void>;\n\n  /**\n   * Clicked\n   */\n  @Event() itemClick: EventEmitter<void>;\n\n  render() {\n    return (\n      <Host\n        class={{\n          selected: this.context?.isSelected,\n        }}\n      >\n        <div\n          class=\"icon-toggle-container\"\n          onClick={(e) => {\n            e.preventDefault();\n            this.toggle.emit();\n          }}\n        >\n          {this.hasChildren ? (\n            <ix-icon\n              name={'chevron-right'}\n              size=\"16\"\n              class={{\n                ['icon-toggle-down']: this.context?.isExpanded,\n              }}\n              color={`color-${\n                this.context?.isExpanded ? 'primary' : 'std-text'\n              }`}\n            />\n          ) : null}\n        </div>\n        <div\n          class=\"tree-node-container\"\n          onClick={() => {\n            this.itemClick.emit();\n          }}\n        >\n          {this.text}\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAc,qsDACpB,MAAAC,EAAeD,E,MCgBFE,EAAQ,M,mKA0BnB,MAAAC,G,UACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACLC,UAAUC,EAAAC,KAAKC,WAAO,MAAAF,SAAA,SAAAA,EAAEG,aAG1BR,EAAA,OAAAE,IAAA,2CACEC,MAAM,wBACNM,QAAUC,IACRA,EAAEC,iBACFL,KAAKM,OAAOC,MAAM,GAGnBP,KAAKQ,YACJd,EAAA,WACEe,KAAM,gBACNC,KAAK,KACLb,MAAO,CACL,CAAC,qBAAqBc,EAAAX,KAAKC,WAAO,MAAAU,SAAA,SAAAA,EAAEC,YAEtCC,MAAO,WACLC,EAAAd,KAAKC,WAAO,MAAAa,SAAA,SAAAA,EAAEF,YAAa,UAAY,eAGzC,MAENlB,EAAA,OAAAE,IAAA,2CACEC,MAAM,sBACNM,QAAS,KACPH,KAAKe,UAAUR,MAAM,GAGtBP,KAAKgB,KACNtB,EAAA,QAAAE,IAAA,8C"}
+{"version":3,"names":["treeItemCss","IxTreeItemStyle0","TreeItem","render","h","Host","key","class","selected","_a","this","context","isSelected","onClick","e","preventDefault","toggle","emit","hasChildren","name","size","_b","isExpanded","color","_c","itemClick","text"],"sources":["src/components/tree-item/tree-item.scss?tag=ix-tree-item&encapsulation=shadow","src/components/tree-item/tree-item.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@import 'common-variables';\n@import 'mixins/text-truncation';\n@import 'mixins/shadow-dom/component';\n\n:host {\n  @include ix-component;\n\n  display: flex;\n  align-items: center;\n\n  height: 32px;\n  width: 100%;\n\n  cursor: pointer;\n\n  .tree-node-container {\n    display: flex;\n    align-items: center;\n    height: $x-large-space;\n    flex-grow: 1;\n    align-items: center;\n  }\n\n  .icon-toggle-container {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 2rem;\n    height: 2rem;\n\n    ix-icon {\n      transition: transform var(--theme-default-time) ease-in-out;\n\n      &.icon-toggle-down {\n        transform: rotate(90deg);\n      }\n    }\n  }\n}\n\n:host(:not(.disabled):not(:disabled):not(.selected).hover),\n:host(:not(.disabled):not(:disabled):not(.selected):hover) {\n  background-color: var(--theme-tree-item--background--hover);\n}\n\n:host(:not(.disabled):not(:disabled):not(.selected).active),\n:host(:not(.disabled):not(:disabled):not(.selected):active) {\n  background-color: var(--theme-tree-item--background--active);\n}\n\n:host(.selected) {\n  background-color: var(--theme-tree-item--background--selected);\n}\n\n:host(.selected.hover),\n:host(.selected:hover) {\n  background-color: var(--theme-tree-item--background--selected-hover);\n}\n\n:host(.selected.active),\n:host(.selected:active) {\n  background-color: var(--theme-tree-item--background--selected-active);\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 { TreeItemContext } from '../tree/tree-model';\n\n@Component({\n  tag: 'ix-tree-item',\n  styleUrl: 'tree-item.scss',\n  shadow: true,\n})\nexport class TreeItem {\n  /**\n   * Text\n   */\n  @Prop() text: string;\n\n  /**\n   * Has tree item children\n   */\n  @Prop() hasChildren: boolean;\n\n  /**\n   * Context\n   */\n  @Prop() context: TreeItemContext;\n\n  /**\n   * Expand/Collapsed toggled\n   */\n  @Event() toggle: EventEmitter<void>;\n\n  /**\n   * Clicked\n   */\n  @Event() itemClick: EventEmitter<void>;\n\n  render() {\n    return (\n      <Host\n        class={{\n          selected: this.context?.isSelected,\n        }}\n      >\n        <div\n          class=\"icon-toggle-container\"\n          onClick={(e) => {\n            e.preventDefault();\n            this.toggle.emit();\n          }}\n        >\n          {this.hasChildren ? (\n            <ix-icon\n              name={'chevron-right'}\n              size=\"16\"\n              class={{\n                ['icon-toggle-down']: this.context?.isExpanded,\n              }}\n              color={`color-${\n                this.context?.isExpanded ? 'primary' : 'std-text'\n              }`}\n            />\n          ) : null}\n        </div>\n        <div\n          class=\"tree-node-container\"\n          onClick={() => {\n            this.itemClick.emit();\n          }}\n        >\n          {this.text}\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAc,i2DACpB,MAAAC,EAAeD,E,MCgBFE,EAAQ,M,mKA0BnB,MAAAC,G,UACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACLC,UAAUC,EAAAC,KAAKC,WAAO,MAAAF,SAAA,SAAAA,EAAEG,aAG1BR,EAAA,OAAAE,IAAA,2CACEC,MAAM,wBACNM,QAAUC,IACRA,EAAEC,iBACFL,KAAKM,OAAOC,MAAM,GAGnBP,KAAKQ,YACJd,EAAA,WACEe,KAAM,gBACNC,KAAK,KACLb,MAAO,CACL,CAAC,qBAAqBc,EAAAX,KAAKC,WAAO,MAAAU,SAAA,SAAAA,EAAEC,YAEtCC,MAAO,WACLC,EAAAd,KAAKC,WAAO,MAAAa,SAAA,SAAAA,EAAEF,YAAa,UAAY,eAGzC,MAENlB,EAAA,OAAAE,IAAA,2CACEC,MAAM,sBACNM,QAAS,KACPH,KAAKe,UAAUR,MAAM,GAGtBP,KAAKgB,KACNtB,EAAA,QAAAE,IAAA,8C"}

package/dist/siemens-ix/p-06965e5f.entry.js

@@ -0,0 +1,2 @@
+import{r as e,h as t,H as o,g as r,c as s}from"./p-f86a894a.js";import{g as i}from"./p-712e0ee0.js";const n=":host{display:block;position:relative;height:2rem;width:2rem;margin-block-start:0.3125rem;margin-inline-end:0.3125rem;margin-inline-start:auto}:host .hide{visibility:collapse}:host ::slotted(ix-dropdown){cursor:default}";const a=n;const c=class{constructor(t){e(this,t);this.showContextMenu=false}getTrigger(){return this.hostElement}configureDropdown(e,t){e.positioningStrategy="fixed";e.trigger=t}onSlotChange(){const e=this.hostElement.shadowRoot.querySelector("slot");if(!e){return}const t=i(e);this.showContextMenu=t.length!==0;const o=t.find((e=>e.tagName==="IX-DROPDOWN"));const r=this.getTrigger();if(!r){return}if(!o){return}this.configureDropdown(o,r)}render(){return t(o,{key:"91faa519a271c40f61260874a328628727a4e16b"},t("ix-icon-button",{key:"b167218e0cdf54bf73caa35140f62669661e4780",class:{hide:!this.showContextMenu},size:"24",ghost:true,icon:"context-menu"}),t("slot",{key:"3992d4aeeacc8531d9d36c86c66d5da6584c5591",onSlotchange:()=>this.onSlotChange()}))}get hostElement(){return r(this)}};c.style=a;const l=":host{display:flex;min-height:2.25rem;height:2.25rem}: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 ::-webkit-scrollbar{width:0.5rem;height:0.5rem}: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 ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host>button{display:flex;height:100%;width:100%;align-items:center;justify-content:flex-start;position:relative;outline:none;background-color:var(--theme-group-item--background);border:1px solid transparent;color:var(--theme-color-std-text);cursor:pointer;padding-left:2.5rem}:host>button:focus-visible{border:1px solid var(--theme-color-focus-bdr)}:host ix-icon{margin-right:0.25rem;margin-top:-0.125rem}:host .group-entry-selection-indicator{position:absolute;left:-1px;height:calc(100% + 2px);width:0.25rem}:host .group-entry-text{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .group-entry-text-secondary{display:flex;justify-content:flex-end;flex-grow:1;white-space:nowrap;color:var(--theme-color-soft-text)}:host .group-entry-text-secondary,:host .group-entry-text-secondary span{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host(.suppress-selection){pointer-events:none}:host(.selected){border-top-width:0.062rem !important;background-color:var(--theme-color-ghost--selected)}:host(.selected) .group-entry-selection-indicator{background-color:var(--theme-group-item-indicator--background--selected)}:host(:hover){background-color:var(--theme-color-ghost--selected-hover);border-color:var(--theme-group-item--border-color--hover)}:host(.selected:hover){background-color:var(--theme-color-ghost--selected-hover)}:host(:active){background-color:var(--theme-color-ghost--selected-active);border-color:var(--theme-group-item--border-color--active)}:host(.selected:active){background-color:var(--theme-color-ghost--selected-active)}";const h=l;const d=class{constructor(t){e(this,t);this.selectedChanged=s(this,"selectedChanged",7);this.icon=undefined;this.text=undefined;this.secondaryText=undefined;this.suppressSelection=false;this.selected=undefined;this.focusable=true;this.index=undefined}clickListen(){if(this.suppressSelection){return}this.selectedChanged.emit(this.hostElement)}render(){return t(o,{key:"b4760747ee4ee151144eb9053c8513b4f4793ce5",class:{selected:this.selected&&!this.suppressSelection,"suppress-selection":this.suppressSelection}},t("button",{key:"4b15db955d4b86689adeea7d250dc6aa50892a79",tabindex:this.focusable?0:-1},t("div",{key:"bd1b475fb73766ebeba146cae8f387af513db318",class:"group-entry-selection-indicator"}),this.icon?t("ix-icon",{size:"16",name:this.icon}):null,this.text?t("span",{class:"group-entry-text"},t("span",{title:this.text},this.text)):null,this.secondaryText?t("span",{class:"group-entry-text-secondary"},t("span",{title:this.secondaryText},this.secondaryText)):null,t("slot",{key:"a9c6d0549435095079fadf6275f08d71136206d5"})))}get hostElement(){return r(this)}};d.style=h;export{c as ix_group_context_menu,d as ix_group_item};
+//# sourceMappingURL=p-06965e5f.entry.js.map