@siemens/ix 0.0.0-pr-1318-20240627080522 → 0.0.0-pr-1373-20240705054533

package/dist/collection/components/date-field/date-field.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"date-field.js","sourceRoot":"","sources":["../../../src/components/date-field/date-field.tsx"],"names":[],"mappings":"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","sourcesContent":["/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  AttachInternals,\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  Method,\n  Prop,\n  State,\n  Watch,\n  h,\n} from '@stencil/core';\nimport { DateTime } from 'luxon';\nimport { dropdownController } from '../dropdown/dropdown-controller';\nimport { makeRef } from '../utils/make-ref';\nimport {\n  ClassMutationObserver,\n  HookValidationLifecycle,\n  IxInputFieldComponent,\n  ValidationResults,\n  createClassMutationObserver,\n} from '../utils/field';\nimport { PostfixSlot, PrefixSlot } from '../text-field/input.fc';\nimport { adjustPaddingForPrefixAndPostfix } from '../text-field/text-field.util';\nimport { iconCalendar } from '@siemens/ix-icons/icons';\n\nexport type DateFieldValidityState = {\n  patternMismatch: boolean;\n  invalidReason?: string;\n};\n\n/**\n * @since 2.4.0\n * @form-ready 2.4.0\n */\n@Component({\n  tag: 'ix-date-field',\n  styleUrl: 'date-field.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class DateField implements IxInputFieldComponent<string> {\n  @Element() hostElement!: HTMLIxDateFieldElement;\n  @AttachInternals() formInternals!: ElementInternals;\n\n  /**\n   * name of the input element\n   */\n  @Prop({ reflect: true }) name?: string;\n\n  /**\n   * placeholder of the input element\n   */\n  @Prop({ reflect: true }) placeholder?: string;\n\n  /**\n   * value of the input element\n   */\n  @Prop({ reflect: true, mutable: true }) value: string = '';\n\n  /**\n   * Date format string.\n   * See {@link \"https://moment.github.io/luxon/#/formatting?id=table-of-tokens\"} for all available tokens.\n   */\n  @Prop() format: string = 'yyyy/LL/dd';\n\n  /**\n   * required attribute\n   */\n  @Prop() required?: boolean;\n\n  /**\n   * helper text below the input field\n   */\n  @Prop() helperText?: string;\n\n  /**\n   * label of the input field\n   */\n  @Prop() label?: string;\n\n  /**\n   * error text below the input field\n   */\n  @Prop({ reflect: true }) invalidText?: string;\n\n  /**\n   * readonly attribute\n   */\n  @Prop() readonly: boolean = false;\n\n  /**\n   * disabled attribute\n   */\n  @Prop() disabled: boolean = false;\n\n  /**\n   * info text below the input field\n   */\n  @Prop() infoText?: string;\n\n  /**\n   * warning text below the input field\n   */\n  @Prop() warningText?: string;\n\n  /**\n   * valid text below the input field\n   */\n  @Prop() validText?: string;\n\n  /**\n   * show text as tooltip\n   */\n  @Prop() showTextAsTooltip?: boolean;\n\n  /**\n   * i18n string for the error message when the date is not parsable\n   */\n  @Prop({ attribute: 'i18n-error-date-unparsable' }) i18nErrorDateUnparsable =\n    'Date is not valid';\n\n  /**\n   * Input change event.\n   */\n  @Event({ cancelable: false }) valueChange!: EventEmitter<string>;\n\n  /**\n   * Validation state change event.\n   */\n  @Event() validityStateChange!: EventEmitter<DateFieldValidityState>;\n\n  /** @internal */\n  @Event() ixFocus!: EventEmitter<void>;\n\n  /** @internal */\n  @Event() ixBlur!: EventEmitter<void>;\n\n  @State() show = false;\n  @State() from: string | null = null;\n  @State() isInputInvalid = false;\n  @State() isInvalid = false;\n  @State() isValid = false;\n  @State() isInfo = false;\n  @State() isWarning = false;\n  @State() focus = false;\n\n  private prefixRef = makeRef<HTMLDivElement>();\n  private postfixRef = makeRef<HTMLDivElement>();\n\n  private datepickerRef = makeRef<HTMLIxDatePickerElement>();\n\n  private inputElementRef = makeRef<HTMLInputElement>();\n  private dropdownElementRef = makeRef<HTMLIxDropdownElement>();\n  private classObserver?: ClassMutationObserver;\n  private invalidReason?: string;\n\n  updateFormInternalValue(value: string): void {\n    this.formInternals.setFormValue(value);\n    this.value = value;\n  }\n\n  connectedCallback(): void {\n    this.classObserver = createClassMutationObserver(this.hostElement, () =>\n      this.checkClassList()\n    );\n  }\n\n  componentWillLoad(): void {\n    this.onInput(this.value);\n    if (this.isInputInvalid) {\n      this.from = null;\n    } else {\n      this.watchValue();\n    }\n\n    this.checkClassList();\n    this.updateFormInternalValue(this.value);\n  }\n\n  componentDidRender(): void {\n    setTimeout(() => this.updatePaddings());\n  }\n\n  private updatePaddings() {\n    adjustPaddingForPrefixAndPostfix(\n      this.prefixRef.current,\n      this.postfixRef.current,\n      this.inputElementRef.current\n    );\n  }\n\n  disconnectedCallback(): void {\n    if (this.classObserver) {\n      this.classObserver.destroy();\n    }\n  }\n\n  @Watch('value')\n  watchValue() {\n    this.from = this.value;\n  }\n\n  /** @internal */\n  @Method()\n  hasValidValue(): Promise<boolean> {\n    return Promise.resolve(!!this.value);\n  }\n\n  /** @internal */\n  @Method()\n  getAssociatedFormElement(): Promise<HTMLFormElement | null> {\n    return Promise.resolve(this.formInternals.form);\n  }\n\n  async onInput(value: string) {\n    this.value = value;\n    if (!value) {\n      this.valueChange.emit(value);\n      return;\n    }\n\n    if (!this.format) {\n      return;\n    }\n\n    const date = DateTime.fromFormat(value, this.format);\n    if (date.isValid) {\n      this.isInputInvalid = false;\n\n      this.updateFormInternalValue(value);\n      this.closeDropdown();\n    } else {\n      this.isInputInvalid = true;\n      this.invalidReason = date.invalidReason;\n    }\n\n    this.valueChange.emit(value);\n  }\n\n  async openDropdown() {\n    const dropdownElement = await this.dropdownElementRef.waitForCurrent();\n    const id = dropdownElement.getAttribute('data-ix-dropdown');\n\n    dropdownController.dismissAll();\n    if (!id) {\n      return;\n    }\n\n    const dropdown = dropdownController.getDropdownById(id);\n    if (!dropdown) {\n      return;\n    }\n    dropdownController.present(dropdown);\n  }\n\n  async closeDropdown() {\n    const dropdownElement = await this.dropdownElementRef.waitForCurrent();\n    const id = dropdownElement.getAttribute('data-ix-dropdown');\n\n    if (!id) {\n      return;\n    }\n\n    const dropdown = dropdownController.getDropdownById(id);\n    if (!dropdown) {\n      return;\n    }\n    dropdownController.dismiss(dropdown);\n  }\n\n  private checkClassList() {\n    this.isInvalid = this.hostElement.classList.contains('ix-invalid');\n  }\n\n  private renderInput() {\n    return (\n      <div class=\"input-wrapper\">\n        <PrefixSlot\n          prefixRef={this.prefixRef}\n          onSlotChange={() => this.updatePaddings()}\n        ></PrefixSlot>\n        <input\n          autoComplete=\"off\"\n          class={{\n            'is-invalid': this.isInputInvalid,\n          }}\n          disabled={this.disabled}\n          readOnly={this.readonly}\n          readonly={this.readonly}\n          required={this.required}\n          ref={this.inputElementRef}\n          type=\"text\"\n          value={this.value}\n          onInput={(event) => {\n            const target = event.target as HTMLInputElement;\n            this.onInput(target.value);\n          }}\n          onClick={(event) => {\n            if (this.show) {\n              event.stopPropagation();\n              event.preventDefault();\n            }\n          }}\n          onFocus={async () => {\n            this.openDropdown();\n            this.ixFocus.emit();\n          }}\n          onBlur={() => this.ixBlur.emit()}\n        ></input>\n        <PostfixSlot\n          postfixRef={this.postfixRef}\n          onSlotChange={() => this.updatePaddings()}\n        >\n          {this.disabled || this.readonly ? null : (\n            <ix-icon-button\n              data-testid=\"open-calendar\"\n              ghost\n              icon={iconCalendar}\n              onClick={(event) => {\n                if (!this.show) {\n                  event.stopPropagation();\n                  event.preventDefault();\n                  this.openDropdown();\n                  this.inputElementRef.current.focus();\n                }\n              }}\n            ></ix-icon-button>\n          )}\n        </PostfixSlot>\n      </div>\n    );\n  }\n\n  @HookValidationLifecycle()\n  hookValidationLifecycle({\n    isInfo,\n    isInvalid,\n    isInvalidByRequired,\n    isValid,\n    isWarning,\n  }: ValidationResults) {\n    this.isInvalid = isInvalid || isInvalidByRequired || this.isInputInvalid;\n    this.isInfo = isInfo;\n    this.isValid = isValid;\n    this.isWarning = isWarning;\n  }\n\n  @Watch('isInputInvalid')\n  async onInputValidationChange() {\n    const state = await this.getValidityState();\n    this.validityStateChange.emit({\n      patternMismatch: state.patternMismatch,\n      invalidReason: this.invalidReason,\n    });\n  }\n\n  /** @internal */\n  @Method()\n  getValidityState(): Promise<ValidityState> {\n    return Promise.resolve({\n      badInput: false,\n      customError: false,\n      patternMismatch: this.isInputInvalid,\n      rangeOverflow: false,\n      rangeUnderflow: false,\n      stepMismatch: false,\n      tooLong: false,\n      tooShort: false,\n      typeMismatch: false,\n      valid: !this.isInputInvalid,\n      valueMissing: !!this.required && !this.value,\n    });\n  }\n\n  /**\n   * Get the native input element\n   */\n  @Method()\n  getNativeInputElement(): Promise<HTMLInputElement> {\n    return this.inputElementRef.waitForCurrent();\n  }\n\n  render() {\n    const invalidText = this.isInputInvalid\n      ? this.i18nErrorDateUnparsable\n      : this.invalidText;\n\n    return (\n      <Host\n        class={{\n          disabled: this.disabled,\n          readonly: this.readonly,\n        }}\n      >\n        <ix-field-wrapper\n          label={this.label}\n          helperText={this.helperText}\n          isInvalid={this.isInvalid}\n          invalidText={invalidText}\n          infoText={this.infoText}\n          isInfo={this.isInfo}\n          isWarning={this.isWarning}\n          warningText={this.warningText}\n          validText={this.validText}\n          showTextAsTooltip={this.showTextAsTooltip}\n          required={this.required}\n          controlRef={this.inputElementRef}\n        >\n          <slot name=\"label\" slot=\"label\"></slot>\n\n          {this.renderInput()}\n        </ix-field-wrapper>\n        <ix-dropdown\n          data-testid=\"date-dropdown\"\n          trigger={this.inputElementRef.waitForCurrent()}\n          ref={this.dropdownElementRef}\n          closeBehavior=\"outside\"\n          show={this.show}\n          onShowChanged={(event) => {\n            this.show = event.detail;\n          }}\n        >\n          <ix-date-picker\n            ref={this.datepickerRef}\n            format={this.format}\n            range={false}\n            from={this.from ?? ''}\n            onDateChange={(event) => {\n              const { from } = event.detail;\n              this.onInput(from);\n            }}\n          ></ix-date-picker>\n        </ix-dropdown>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/date-field/tests/date-field.ct.js

@@ -1,114 +0,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.
- */
-import { expect } from "@playwright/test";
-import { getFormValue, preventFormSubmission, test } from "../../../tests/utils/test/index";
-const createDateFieldAccessor = async (dateField) => {
-    const handle = {
-        openByCalender: async () => {
-            const trigger = dateField.getByTestId('open-calendar');
-            await trigger.click();
-        },
-        selectDay: async (day) => {
-            const dayButton = dateField
-                .locator('ix-dropdown')
-                .filter({ hasText: day.toString() })
-                .getByText(day.toString());
-            await dayButton.click();
-        },
-    };
-    return handle;
-};
-test('renders', async ({ mount, page }) => {
-    await mount(`<ix-date-field value="2024/05/05"></ix-date-field>`);
-    const dateFieldElement = page.locator('ix-date-field');
-    await expect(dateFieldElement).toHaveClass(/hydrated/);
-});
-test('select date by open calendar trigger', async ({ mount, page }) => {
-    await mount(`<ix-date-field value="2024/05/05"></ix-date-field>`);
-    const dateFieldElement = page.locator('ix-date-field');
-    await expect(dateFieldElement).toHaveClass(/hydrated/);
-    const dateField = await createDateFieldAccessor(dateFieldElement);
-    await dateField.openByCalender();
-    await dateField.selectDay(10);
-    await expect(dateFieldElement).toHaveAttribute('value', '2024/05/10');
-});
-test('select date by focus', async ({ mount, page }) => {
-    await mount(`<ix-date-field value="2024/05/05"></ix-date-field>`);
-    const dateFieldElement = page.locator('ix-date-field');
-    await expect(dateFieldElement).toHaveClass(/hydrated/);
-    const dateField = await createDateFieldAccessor(dateFieldElement);
-    await dateFieldElement.locator('input').focus();
-    await dateField.selectDay(10);
-    await expect(dateFieldElement).toHaveAttribute('value', '2024/05/10');
-    await expect(dateFieldElement.getByTestId('date-dropdown')).not.toHaveClass(/show/);
-});
-test('select date by input', async ({ mount, page }) => {
-    await mount(`<ix-date-field value="2024/05/05"></ix-date-field>`);
-    const dateFieldElement = page.locator('ix-date-field');
-    await expect(dateFieldElement).toHaveClass(/hydrated/);
-    const dateField = await createDateFieldAccessor(dateFieldElement);
-    await dateFieldElement.locator('input').focus();
-    await expect(dateFieldElement.getByTestId('date-dropdown')).toHaveClass(/show/);
-    await dateFieldElement.locator('input').fill('2025/10/10');
-    await expect(dateFieldElement.getByTestId('date-dropdown')).not.toHaveClass(/show/);
-    await expect(dateFieldElement).toHaveAttribute('value', '2025/10/10');
-    await dateField.openByCalender();
-    await expect(dateFieldElement.locator('.calendar-item.selected')).toHaveText('10');
-});
-test('select date by input with invalid date', async ({ mount, page }) => {
-    await mount(`<ix-date-field value="2024/05/05"></ix-date-field>`);
-    const dateFieldElement = page.locator('ix-date-field');
-    await expect(dateFieldElement).toHaveClass(/hydrated/);
-    const dateField = await createDateFieldAccessor(dateFieldElement);
-    await dateFieldElement.locator('input').fill('2025/10/10/10');
-    await dateField.openByCalender();
-    await expect(dateFieldElement).toHaveAttribute('value', '2025/10/10/10');
-    await expect(dateFieldElement
-        .locator('ix-field-wrapper')
-        .locator('ix-typography')
-        .filter({ hasText: 'Date is not valid' })).toHaveText('Date is not valid');
-});
-test('select date by input with invalid date - i18n', async ({ mount, page, }) => {
-    await mount(`<ix-date-field value="2024/05/05" i18n-error-date-unparsable="Datum nicht korrekt!"></ix-date-field>`);
-    const dateFieldElement = page.locator('ix-date-field');
-    await expect(dateFieldElement).toHaveClass(/hydrated/);
-    const dateField = await createDateFieldAccessor(dateFieldElement);
-    await dateFieldElement.locator('input').fill('2025/10/10/10');
-    await dateField.openByCalender();
-    await expect(dateFieldElement).toHaveAttribute('value', '2025/10/10/10');
-    await expect(dateFieldElement
-        .locator('ix-field-wrapper')
-        .locator('ix-typography')
-        .filter({ hasText: 'Datum nicht korrekt!' })).toHaveText('Datum nicht korrekt!');
-});
-test('required', async ({ mount, page }) => {
-    await mount(`<ix-date-field required label="MyLabel"></ix-date-field>`);
-    const dateFieldElement = page.locator('ix-date-field');
-    await expect(dateFieldElement).toHaveAttribute('required');
-    await expect(dateFieldElement.locator('ix-field-label')).toHaveText('MyLabel *');
-    await expect(dateFieldElement).toHaveClass(/ix-invalid--required/);
-});
-test(`form-ready - ix-date-field`, async ({ mount, page }) => {
-    await mount(`<form><ix-date-field name="my-field-name"></ix-date-field></form>`);
-    const formElement = page.locator('form');
-    preventFormSubmission(formElement);
-    const input = page.locator('ix-date-field').locator('input');
-    await input.fill('2024/05/05');
-    await input.blur();
-    const formData = await getFormValue(formElement, 'my-field-name');
-    expect(formData).toBe('2024/05/05');
-});
-test(`form-ready - ix-date-field initial value`, async ({ mount, page }) => {
-    await mount(`<form><ix-date-field name="my-field-name" value="2024/12/12"></ix-date-field></form>`);
-    const formElement = page.locator('form');
-    preventFormSubmission(formElement);
-    const formData = await getFormValue(formElement, 'my-field-name');
-    expect(formData).toBe('2024/12/12');
-});
-//# sourceMappingURL=date-field.ct.js.map

package/dist/collection/components/date-field/tests/date-field.ct.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"date-field.ct.js","sourceRoot":"","sources":["../../../../src/components/date-field/tests/date-field.ct.ts"],"names":[],"mappings":"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","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 { Locator, expect } from '@playwright/test';\nimport { getFormValue, preventFormSubmission, test } from '@utils/test';\n\nconst createDateFieldAccessor = async (dateField: Locator) => {\n  const handle = {\n    openByCalender: async () => {\n      const trigger = dateField.getByTestId('open-calendar');\n      await trigger.click();\n    },\n    selectDay: async (day: number) => {\n      const dayButton = dateField\n        .locator('ix-dropdown')\n        .filter({ hasText: day.toString() })\n        .getByText(day.toString());\n      await dayButton.click();\n    },\n  };\n\n  return handle;\n};\n\ntest('renders', async ({ mount, page }) => {\n  await mount(`<ix-date-field value=\"2024/05/05\"></ix-date-field>`);\n  const dateFieldElement = page.locator('ix-date-field');\n  await expect(dateFieldElement).toHaveClass(/hydrated/);\n});\n\ntest('select date by open calendar trigger', async ({ mount, page }) => {\n  await mount(`<ix-date-field value=\"2024/05/05\"></ix-date-field>`);\n  const dateFieldElement = page.locator('ix-date-field');\n  await expect(dateFieldElement).toHaveClass(/hydrated/);\n\n  const dateField = await createDateFieldAccessor(dateFieldElement);\n  await dateField.openByCalender();\n\n  await dateField.selectDay(10);\n  await expect(dateFieldElement).toHaveAttribute('value', '2024/05/10');\n});\n\ntest('select date by focus', async ({ mount, page }) => {\n  await mount(`<ix-date-field value=\"2024/05/05\"></ix-date-field>`);\n  const dateFieldElement = page.locator('ix-date-field');\n  await expect(dateFieldElement).toHaveClass(/hydrated/);\n\n  const dateField = await createDateFieldAccessor(dateFieldElement);\n  await dateFieldElement.locator('input').focus();\n\n  await dateField.selectDay(10);\n  await expect(dateFieldElement).toHaveAttribute('value', '2024/05/10');\n  await expect(dateFieldElement.getByTestId('date-dropdown')).not.toHaveClass(\n    /show/\n  );\n});\n\ntest('select date by input', async ({ mount, page }) => {\n  await mount(`<ix-date-field value=\"2024/05/05\"></ix-date-field>`);\n  const dateFieldElement = page.locator('ix-date-field');\n  await expect(dateFieldElement).toHaveClass(/hydrated/);\n\n  const dateField = await createDateFieldAccessor(dateFieldElement);\n  await dateFieldElement.locator('input').focus();\n  await expect(dateFieldElement.getByTestId('date-dropdown')).toHaveClass(\n    /show/\n  );\n  await dateFieldElement.locator('input').fill('2025/10/10');\n\n  await expect(dateFieldElement.getByTestId('date-dropdown')).not.toHaveClass(\n    /show/\n  );\n  await expect(dateFieldElement).toHaveAttribute('value', '2025/10/10');\n\n  await dateField.openByCalender();\n\n  await expect(dateFieldElement.locator('.calendar-item.selected')).toHaveText(\n    '10'\n  );\n});\n\ntest('select date by input with invalid date', async ({ mount, page }) => {\n  await mount(`<ix-date-field value=\"2024/05/05\"></ix-date-field>`);\n  const dateFieldElement = page.locator('ix-date-field');\n  await expect(dateFieldElement).toHaveClass(/hydrated/);\n\n  const dateField = await createDateFieldAccessor(dateFieldElement);\n  await dateFieldElement.locator('input').fill('2025/10/10/10');\n  await dateField.openByCalender();\n  await expect(dateFieldElement).toHaveAttribute('value', '2025/10/10/10');\n\n  await expect(\n    dateFieldElement\n      .locator('ix-field-wrapper')\n      .locator('ix-typography')\n      .filter({ hasText: 'Date is not valid' })\n  ).toHaveText('Date is not valid');\n});\n\ntest('select date by input with invalid date - i18n', async ({\n  mount,\n  page,\n}) => {\n  await mount(\n    `<ix-date-field value=\"2024/05/05\" i18n-error-date-unparsable=\"Datum nicht korrekt!\"></ix-date-field>`\n  );\n  const dateFieldElement = page.locator('ix-date-field');\n  await expect(dateFieldElement).toHaveClass(/hydrated/);\n\n  const dateField = await createDateFieldAccessor(dateFieldElement);\n  await dateFieldElement.locator('input').fill('2025/10/10/10');\n  await dateField.openByCalender();\n  await expect(dateFieldElement).toHaveAttribute('value', '2025/10/10/10');\n\n  await expect(\n    dateFieldElement\n      .locator('ix-field-wrapper')\n      .locator('ix-typography')\n      .filter({ hasText: 'Datum nicht korrekt!' })\n  ).toHaveText('Datum nicht korrekt!');\n});\n\ntest('required', async ({ mount, page }) => {\n  await mount(`<ix-date-field required label=\"MyLabel\"></ix-date-field>`);\n  const dateFieldElement = page.locator('ix-date-field');\n  await expect(dateFieldElement).toHaveAttribute('required');\n\n  await expect(dateFieldElement.locator('ix-field-label')).toHaveText(\n    'MyLabel *'\n  );\n\n  await expect(dateFieldElement).toHaveClass(/ix-invalid--required/);\n});\n\ntest(`form-ready - ix-date-field`, async ({ mount, page }) => {\n  await mount(\n    `<form><ix-date-field name=\"my-field-name\"></ix-date-field></form>`\n  );\n\n  const formElement = page.locator('form');\n  preventFormSubmission(formElement);\n  const input = page.locator('ix-date-field').locator('input');\n  await input.fill('2024/05/05');\n  await input.blur();\n\n  const formData = await getFormValue(formElement, 'my-field-name');\n  expect(formData).toBe('2024/05/05');\n});\n\ntest(`form-ready - ix-date-field initial value`, async ({ mount, page }) => {\n  await mount(\n    `<form><ix-date-field name=\"my-field-name\" value=\"2024/12/12\"></ix-date-field></form>`\n  );\n\n  const formElement = page.locator('form');\n  preventFormSubmission(formElement);\n  const formData = await getFormValue(formElement, 'my-field-name');\n  expect(formData).toBe('2024/12/12');\n});\n"]}

package/dist/collection/components/field-label/field-label.css

@@ -1,14 +0,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.
- */
-:host {
-  display: inline-block;
-  position: relative;
-  margin-top: 0.5rem;
-  margin-bottom: 0.25rem;
-}

package/dist/collection/components/field-label/field-label.js

@@ -1,173 +0,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.
- */
-import { Host, h } from "@stencil/core";
-import { isIxInputFieldComponent, } from "../utils/field";
-import { a11yHostAttributes } from "../utils/a11y";
-import { makeRef } from "../utils/make-ref";
-export class FormFieldLabel {
-    constructor() {
-        this.observer = new MutationObserver(() => this.checkForRequired());
-        this.a11yAttributes = {};
-        this.labelRef = makeRef();
-        this.required = undefined;
-        this.htmlFor = undefined;
-        this.controlRef = undefined;
-    }
-    connectedCallback() {
-        this.registerObserver();
-    }
-    disconnectedCallback() {
-        this.destroyObserver();
-    }
-    componentWillRender() {
-        this.checkForRequired();
-    }
-    componentWillLoad() {
-        this.a11yAttributes = a11yHostAttributes(this.hostElement);
-    }
-    destroyObserver() {
-        if (this.observer) {
-            this.observer.disconnect();
-        }
-    }
-    registerObserver() {
-        if (typeof window === 'undefined') {
-            return;
-        }
-        this.destroyObserver();
-        if (!this.htmlFor) {
-            return;
-        }
-        this.observer.observe(window.document, {
-            childList: true,
-            subtree: true,
-        });
-    }
-    async checkForRequired() {
-        if (this.htmlFor) {
-            const forElement = document.getElementById(this.htmlFor);
-            if (forElement && typeof forElement.required === 'boolean') {
-                this.required = forElement.required;
-            }
-        }
-        if (this.controlRef) {
-            const input = await this.controlRef.waitForCurrent();
-            this.required = input.required;
-        }
-    }
-    async focusOnClick() {
-        if (this.htmlFor) {
-            const target = document.getElementById(this.htmlFor);
-            if (target) {
-                let input = null;
-                if (isIxInputFieldComponent(target)) {
-                    input = await target.getNativeInputElement();
-                }
-                else {
-                    input = target;
-                }
-                if (typeof input.focus === 'function') {
-                    input.focus();
-                }
-            }
-        }
-        if (this.controlRef) {
-            (await this.controlRef.waitForCurrent()).focus();
-        }
-    }
-    render() {
-        return (h(Host, { key: '592ea81fa356fe38e4285116d8adea47b220dbd7', onClick: () => this.focusOnClick() }, h("label", Object.assign({ key: '2324be02438bc1807946b721a97c59b691d45db3', htmlFor: this.htmlFor }, this.a11yAttributes, { ref: this.labelRef }), h("ix-typography", { key: '3f4eeee6788394ee0afc92898f98284432213670', color: "soft", format: "label" }, h("slot", { key: '8a48ad5fe9ae212e0efb7cd9d507d5de3ef7ce99' }), this.required && h("span", { key: 'c387f27c7d1fef89f3ed5ecde0d113116a7b83fd' }, "\u00A0*")))));
-    }
-    static get is() { return "ix-field-label"; }
-    static get encapsulation() { return "shadow"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["field-label.scss"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["field-label.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "required": {
-                "type": "boolean",
-                "mutable": true,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "A value is required or must be checked for the form to be submittable"
-                },
-                "attribute": "required",
-                "reflect": true
-            },
-            "htmlFor": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "The id of the form element that the label is associated with"
-                },
-                "attribute": "html-for",
-                "reflect": true
-            },
-            "controlRef": {
-                "type": "unknown",
-                "mutable": false,
-                "complexType": {
-                    "original": "MakeRef<HTMLElement>",
-                    "resolved": "{ (ref: HTMLElement): void; current: HTMLElement; waitForCurrent(): Promise<HTMLElement>; }",
-                    "references": {
-                        "MakeRef": {
-                            "location": "import",
-                            "path": "../utils/make-ref",
-                            "id": "src/components/utils/make-ref.ts::MakeRef"
-                        },
-                        "HTMLElement": {
-                            "location": "global",
-                            "id": "global::HTMLElement"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [{
-                            "name": "internal",
-                            "text": undefined
-                        }],
-                    "text": ""
-                }
-            }
-        };
-    }
-    static get elementRef() { return "hostElement"; }
-    static get watchers() {
-        return [{
-                "propName": "htmlFor",
-                "methodName": "registerObserver"
-            }];
-    }
-}
-//# sourceMappingURL=field-label.js.map

package/dist/collection/components/field-label/field-label.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"field-label.js","sourceRoot":"","sources":["../../../src/components/field-label/field-label.tsx"],"names":[],"mappings":"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","sourcesContent":["/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, Host, Prop, h, Element, Watch } from '@stencil/core';\nimport { IxComponent } from '../utils/internal';\nimport {\n  HTMLIxFormComponentElement,\n  isIxInputFieldComponent,\n} from '../utils/field';\nimport { A11yAttributes, a11yHostAttributes } from '../utils/a11y';\nimport { MakeRef, makeRef } from '../utils/make-ref';\n\n@Component({\n  tag: 'ix-field-label',\n  styleUrl: 'field-label.scss',\n  shadow: true,\n})\nexport class FormFieldLabel implements IxComponent {\n  @Element() hostElement!: HTMLIxFieldLabelElement;\n\n  /**\n   * A value is required or must be checked for the form to be submittable\n   */\n  @Prop({ reflect: true, mutable: true }) required?: boolean;\n\n  /**\n   * The id of the form element that the label is associated with\n   */\n  @Prop({ reflect: true }) htmlFor?: string;\n\n  /** @internal */\n  @Prop() controlRef?: MakeRef<HTMLElement>;\n\n  private observer = new MutationObserver(() => this.checkForRequired());\n  private a11yAttributes: A11yAttributes = {};\n  private labelRef = makeRef<HTMLLabelElement>();\n\n  connectedCallback() {\n    this.registerObserver();\n  }\n\n  disconnectedCallback(): void {\n    this.destroyObserver();\n  }\n\n  componentWillRender() {\n    this.checkForRequired();\n  }\n\n  componentWillLoad(): void | Promise<void> {\n    this.a11yAttributes = a11yHostAttributes(this.hostElement);\n  }\n\n  private destroyObserver() {\n    if (this.observer) {\n      this.observer.disconnect();\n    }\n  }\n\n  @Watch('htmlFor')\n  private registerObserver() {\n    if (typeof window === 'undefined') {\n      return;\n    }\n\n    this.destroyObserver();\n\n    if (!this.htmlFor) {\n      return;\n    }\n\n    this.observer.observe(window.document, {\n      childList: true,\n      subtree: true,\n    });\n  }\n\n  private async checkForRequired() {\n    if (this.htmlFor) {\n      const forElement = document.getElementById(\n        this.htmlFor\n      ) as HTMLIxFormComponentElement<unknown>;\n      if (forElement && typeof forElement.required === 'boolean') {\n        this.required = forElement.required;\n      }\n    }\n\n    if (this.controlRef) {\n      const input = await this.controlRef.waitForCurrent();\n      this.required = (\n        input as HTMLInputElement | HTMLTextAreaElement\n      ).required;\n    }\n  }\n\n  private async focusOnClick() {\n    if (this.htmlFor) {\n      const target = document.getElementById(this.htmlFor);\n      if (target) {\n        let input: HTMLElement | null = null;\n        if (isIxInputFieldComponent(target)) {\n          input = await target.getNativeInputElement();\n        } else {\n          input = target;\n        }\n        if (typeof input.focus === 'function') {\n          input.focus();\n        }\n      }\n    }\n\n    if (this.controlRef) {\n      (await this.controlRef.waitForCurrent()).focus();\n    }\n  }\n\n  render() {\n    return (\n      <Host onClick={() => this.focusOnClick()}>\n        <label\n          htmlFor={this.htmlFor}\n          {...this.a11yAttributes}\n          ref={this.labelRef}\n        >\n          <ix-typography color=\"soft\" format=\"label\">\n            <slot></slot>\n            {this.required && <span>&nbsp;*</span>}\n          </ix-typography>\n        </label>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/field-label/tests/field-label.ct.js

@@ -1,70 +0,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.
- */
-import { expect } from "@playwright/test";
-import { test } from "../../../tests/utils/test/index";
-test('renders', async ({ mount, page }) => {
-    await mount(`<ix-field-label>My Label</ix-field-label>`);
-    const fieldLabelElement = page.locator('ix-field-label');
-    await expect(fieldLabelElement).toHaveClass(/hydrated/);
-    await expect(fieldLabelElement.locator('label').locator('ix-typography')).toHaveClass(/typography-label/);
-    await expect(fieldLabelElement.filter({ hasText: 'My Label' })).toHaveText('My Label');
-});
-test('required', async ({ mount, page }) => {
-    await mount(`<ix-field-label required>MyLabel</ix-field-label>`);
-    const labelElement = page.locator('ix-field-label');
-    await expect(labelElement).toHaveText('MyLabel *');
-});
-test('focus native input by label click', async ({ mount, page }) => {
-    await mount(`
-    <ix-field-label html-for="input">MyLabel</ix-field-label>
-    <input data-testid="input" id="input" />
-  `);
-    const labelElement = page.locator('ix-field-label');
-    await labelElement.click();
-    const inputElement = page.getByTestId('input');
-    await expect(inputElement).toBeFocused();
-});
-test.describe('click label', () => {
-    [
-        'ix-text-field',
-        'ix-number-field',
-        'ix-date-field',
-        'ix-textarea-field',
-    ].forEach((selector) => {
-        test(`focus ${selector} by external label click`, async ({ mount, page, }) => {
-            await mount(`
-        <ix-field-label html-for="input">MyLabel</ix-field-label>
-        <${selector} id="input"></${selector}>
-      `);
-            const labelElement = page.locator('ix-field-label');
-            await labelElement.click();
-            const component = page.locator(selector);
-            const focusElement = selector !== 'ix-textarea-field'
-                ? component.locator('input')
-                : component.locator('textarea');
-            await expect(focusElement).toBeFocused();
-        });
-        test(`focus ${selector} by embedded label click`, async ({ mount, page, }) => {
-            await mount(`
-        <${selector} label="MyLabel"></${selector}>
-      `);
-            const component = page.locator(selector);
-            await expect(component).toHaveClass(/hydrated/);
-            const labelElement = component
-                .locator('ix-field-wrapper')
-                .locator('ix-field-label');
-            await labelElement.click();
-            const focusElement = selector !== 'ix-textarea-field'
-                ? component.locator('input')
-                : component.locator('textarea');
-            await expect(focusElement).toBeFocused();
-        });
-    });
-});
-//# sourceMappingURL=field-label.ct.js.map

package/dist/collection/components/field-label/tests/field-label.ct.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"field-label.ct.js","sourceRoot":"","sources":["../../../../src/components/field-label/tests/field-label.ct.ts"],"names":[],"mappings":"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","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 { expect } from '@playwright/test';\nimport { test } from '@utils/test';\n\ntest('renders', async ({ mount, page }) => {\n  await mount(`<ix-field-label>My Label</ix-field-label>`);\n  const fieldLabelElement = page.locator('ix-field-label');\n  await expect(fieldLabelElement).toHaveClass(/hydrated/);\n  await expect(\n    fieldLabelElement.locator('label').locator('ix-typography')\n  ).toHaveClass(/typography-label/);\n  await expect(fieldLabelElement.filter({ hasText: 'My Label' })).toHaveText(\n    'My Label'\n  );\n});\n\ntest('required', async ({ mount, page }) => {\n  await mount(`<ix-field-label required>MyLabel</ix-field-label>`);\n  const labelElement = page.locator('ix-field-label');\n  await expect(labelElement).toHaveText('MyLabel *');\n});\n\ntest('focus native input by label click', async ({ mount, page }) => {\n  await mount(`\n    <ix-field-label html-for=\"input\">MyLabel</ix-field-label>\n    <input data-testid=\"input\" id=\"input\" />\n  `);\n  const labelElement = page.locator('ix-field-label');\n  await labelElement.click();\n\n  const inputElement = page.getByTestId('input');\n  await expect(inputElement).toBeFocused();\n});\n\ntest.describe('click label', () => {\n  [\n    'ix-text-field',\n    'ix-number-field',\n    'ix-date-field',\n    'ix-textarea-field',\n  ].forEach((selector) => {\n    test(`focus ${selector} by external label click`, async ({\n      mount,\n      page,\n    }) => {\n      await mount(`\n        <ix-field-label html-for=\"input\">MyLabel</ix-field-label>\n        <${selector} id=\"input\"></${selector}>\n      `);\n      const labelElement = page.locator('ix-field-label');\n      await labelElement.click();\n\n      const component = page.locator(selector);\n      const focusElement =\n        selector !== 'ix-textarea-field'\n          ? component.locator('input')\n          : component.locator('textarea');\n      await expect(focusElement).toBeFocused();\n    });\n\n    test(`focus ${selector} by embedded label click`, async ({\n      mount,\n      page,\n    }) => {\n      await mount(`\n        <${selector} label=\"MyLabel\"></${selector}>\n      `);\n\n      const component = page.locator(selector);\n      await expect(component).toHaveClass(/hydrated/);\n\n      const labelElement = component\n        .locator('ix-field-wrapper')\n        .locator('ix-field-label');\n\n      await labelElement.click();\n\n      const focusElement =\n        selector !== 'ix-textarea-field'\n          ? component.locator('input')\n          : component.locator('textarea');\n\n      await expect(focusElement).toBeFocused();\n    });\n  });\n});\n"]}

package/dist/collection/components/field-wrapper/field-wrapper.css

@@ -1,71 +0,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.
- */
-:host {
-  display: flex;
-  position: relative;
-  flex-direction: column;
-}
-:host .slot-wrapper {
-  display: flex;
-  position: relative;
-  align-items: center;
-  justify-content: flex-start;
-  gap: 0.25rem;
-}
-:host .field-bottom,
-:host .field-top {
-  display: flex;
-  flex-direction: row;
-  position: relative;
-  align-items: baseline;
-  justify-content: space-between;
-  gap: 1rem;
-  width: -moz-min-content;
-  width: min-content;
-  min-width: 100%;
-}
-:host .field-bottom .bottom-right {
-  margin-left: auto;
-  margin-right: 0px;
-}
-:host .bottom-text {
-  display: flex;
-  position: relative;
-  align-items: flex-start;
-  justify-content: flex-start;
-  gap: 0.25rem;
-  margin-right: 0.25rem;
-}
-:host .text-icon {
-  margin: 0.125rem;
-}
-:host .text-icon.invalid {
-  color: var(--theme-helper-icon--color--invalid);
-}
-:host .text-icon.info {
-  color: var(--theme-helper-icon--color--info);
-}
-:host .text-icon.warning {
-  color: var(--theme-helper-icon--color--warning);
-}
-:host .text-icon.valid {
-  color: var(--theme-helper-icon--color--valid);
-}
-:host .bottom-text {
-  margin-top: 0.25rem;
-}
-
-:host(.text-behind-slotted-element) {
-  flex-direction: row;
-  align-items: flex-start;
-}
-:host(.text-behind-slotted-element) .bottom-text {
-  margin-top: 0.5rem;
-  margin-left: 0.5rem;
-}