@sapudex/web-components 0.127.6 → 0.143.0

package/dist/TextArea.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextArea.js","sourceRoot":"","sources":["../src/TextArea.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport getEffectiveScrollbarStyle from \"@ui5/webcomponents-base/dist/util/getEffectiveScrollbarStyle.js\";\nimport Integer from \"@ui5/webcomponents-base/dist/types/Integer.js\";\nimport { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport {\n  READ_ONLY, TEXTAREA_CHARACTERS_LEFT, VALUE_STATE_TYPE_ERROR, VALUE_STATE_TYPE_STANDARD, VALUE_STATE_TYPE_SUCCESS, VALUE_STATE_TYPE_WARNING,\n} from \"./generated/i18n/i18n-defaults.js\";\n\nimport \"@ui5/webcomponents/dist/Icon.js\";\nimport \"@ui5/webcomponents-icons/dist/accept.js\";\nimport \"@ui5/webcomponents-icons/dist/error.js\";\nimport \"@ui5/webcomponents-icons/dist/alert.js\";\n\nimport TextAreaTemplate from \"./generated/templates/TextAreaTemplate.lit.js\";\n\n// Styles\nimport TextAreaCss from \"./generated/themes/TextArea.css.js\";\nimport UDExStatusMessage from \"./StatusMessage.js\";\n\nexport enum FieldState {\n  Standard = \"Standard\",\n  Warning = \"Warning\",\n  Error = \"Error\",\n  Success = \"Success\",\n}\n\n/**\n * @class\n *\n * @constructor\n * @extends UI5Element\n * @tagname udex-text-area\n * @public\n */\n@customElement({\n  tag: \"udex-textarea\",\n  renderer: litRender,\n  styles: [TextAreaCss, getEffectiveScrollbarStyle()],\n  template: TextAreaTemplate,\n  dependencies: [UDExStatusMessage],\n})\n\nclass UDExTextArea extends UI5Element {\n  _labelActiveClassName = \"udex-textarea__label--active\";\n\n  /**\n   * Defines label text for the textarea field.\n   *\n   * @default \"\"\n   * @public\n   */\n  @property({ type: String, defaultValue: \"\" })\n    label!: string;\n\n  /**\n   * Defines the value of the component.\n   * <br><br>\n   * <b>Note:</b> The property is updated upon typing.\n   *\n   * @default \"\"\n   * @public\n   */\n  @property({ type: String, defaultValue: \"\" })\n    value!: string;\n\n  /**\n   * Defines the number of visible text lines for the component.\n   * <br><br>\n   * <b>Notes:</b>\n   * <ul>\n   * <li>If the <code>growing</code> property is enabled, this property defines the minimum rows to be displayed\n   * in the textarea.</li>\n   * <li>The CSS <code>height</code> property wins over the <code>rows</code> property, if both are set.</li>\n   * </ul>\n   *\n   * @public\n   */\n  @property({ validator: Integer })\n    rows!: number;\n\n  /**\n   * Enables the component to automatically grow and shrink dynamically with its content.\n   * <br><br>\n   *\n   * @default false\n   * @public\n   */\n  @property({ type: Boolean })\n    growing!: boolean;\n\n  /**\n   * Defines the maximum number of lines that the component can grow.\n   *\n   * @default 0\n   * @public\n   */\n  @property({ validator: Integer, defaultValue: 0 })\n    growingMaxLines!: number;\n\n  /**\n   * Defines supporting text under the input field.\n   *\n   * @default \"\"\n   * @public\n   */\n  @property({ type: String, defaultValue: \"\" })\n    supportingText!: string;\n\n  /**\n   * Sets the maximum number of characters available in the textarea.\n   *\n   * @public\n   */\n  @property({ validator: Integer })\n    maxlength?: number;\n\n  /**\n   * Defines the value state of the component.\n   *\n   * @default \"Standard\"\n   * @public\n   */\n  @property({ type: FieldState, defaultValue: FieldState.Standard })\n    fieldState!: `${FieldState}`;\n\n  /**\n   * Defines whether the component is required.\n   *\n   * @default false\n   * @public\n   */\n  @property({ type: Boolean })\n    required!: boolean;\n\n  /**\n   * Defines whether the component is in disabled state.\n   * <br><br>\n   * <b>Note:</b> A disabled component is completely noninteractive.\n   *\n   * @default false\n   * @public\n   */\n  @property({ type: Boolean })\n    disabled!: boolean;\n\n  /**\n   * Defines whether the component is read-only.\n   * <br><br>\n   * <b>Note:</b> A read-only component is not editable,\n   * but still provides visual feedback upon user interaction.\n   *\n   * @default false\n   * @public\n   */\n  @property({ type: Boolean })\n    readonly!: boolean;\n\n  /**\n   * Defines whether the component is display-only.\n   * <br><br>\n   * <b>Note:</b> A display-only component is not editable,\n   * but still provides visual feedback upon user interaction, input border is not visible.\n   *\n   * @default false\n   * @public\n   */\n  @property({ type: Boolean })\n    displayonly!: boolean;\n\n  /**\n   * Defines the inner stored value of the readonly attribute of the input.\n   *\n   * @default false\n   * @private\n   */\n  @property({ type: Boolean, noAttribute: true })\n    isInputReadonly!: boolean;\n\n  /**\n   * Defines the inner stored value of the classes of the label.\n   *\n   * @default \"\"\n   * @private\n   */\n  @property({ type: String, noAttribute: true, defaultValue: \"\" })\n    labelClasses!: string;\n\n  /**\n   * Defines the inner stored class of the label.\n   *\n   * @default \"\"\n   * @private\n   */\n  @property({ type: String, noAttribute: true, defaultValue: \"\" })\n    labelActiveClass!: string;\n\n  /**\n   * Defines the accessible ARIA name of the component.\n   * @default \"\"\n   * @public\n   */\n  @property()\n    accessibleName!: string;\n\n  /**\n   * Receives id (or many ids) of the elements that label the component.\n   * @default \"\"\n   * @public\n   */\n  @property({ defaultValue: \"\" })\n    accessibleNameRef!: string;\n\n  static i18nBundle: I18nBundle;\n\n  static async onDefine() {\n    UDExTextArea.i18nBundle = await getI18nBundle(\"sap-ui-webcomponents-bundle\");\n  }\n\n  getInputDomRef() {\n    return this.getDomRef()!.querySelector<HTMLTextAreaElement>(\"textarea\")!;\n  }\n\n  get hasValueState() {\n    return this.fieldState === FieldState.Error || this.fieldState === FieldState.Warning || this.fieldState === FieldState.Success;\n  }\n\n  get fieldStateTypeMappings() {\n    return {\n      \"Success\": UDExTextArea.i18nBundle.getText(VALUE_STATE_TYPE_SUCCESS),\n      \"Standard\": UDExTextArea.i18nBundle.getText(VALUE_STATE_TYPE_STANDARD),\n      \"Error\": UDExTextArea.i18nBundle.getText(VALUE_STATE_TYPE_ERROR),\n      \"Warning\": UDExTextArea.i18nBundle.getText(VALUE_STATE_TYPE_WARNING),\n    };\n  }\n\n  get ariaValueStateHiddenText() {\n    if (!this.hasValueState) {\n      return;\n    }\n\n    if (this.fieldState === FieldState.Standard) {\n      return;\n    }\n\n    return `${this.fieldStateTypeMappings[this.fieldState]}`;\n  }\n\n  get readOnlyText() {\n    return UDExTextArea.i18nBundle.getText(READ_ONLY);\n  }\n\n  get ariaDescribedBy() {\n    const valueStateTextDescId = this.hasValueState ? `${this._id}-valueStateDesc` : \"\";\n    const readonlyTextDescId = this.readonly ? `${this._id}-readonlyDesc` : \"\";\n    const supportingTextDescId = this._supportingText ? `${this._id}-supportingTextDesc` : \"\";\n    if (!valueStateTextDescId && !supportingTextDescId && !readonlyTextDescId) {\n      return;\n    }\n    return `${valueStateTextDescId} ${supportingTextDescId} ${readonlyTextDescId}`;\n  }\n\n  get _supportingText() {\n    if (this.supportingText.length) {\n      return this.supportingText;\n    }\n\n    const maxLength = this.maxlength;\n\n    if (maxLength !== null && maxLength !== undefined) {\n      const leftCharactersCount = maxLength - this.value.length;\n\n      if (leftCharactersCount >= 0) {\n        return UDExTextArea.i18nBundle.getText(TEXTAREA_CHARACTERS_LEFT, leftCharactersCount);\n      }\n    }\n  }\n\n  handleInput = (event: InputEvent) => {\n    this.value = (event.target as HTMLInputElement)?.value;\n  };\n\n  handleChange = () => {\n    this.fireEvent(\"change\");\n  };\n\n  handleGrowing = () => {\n    if (this.growing) {\n      const nativeTextArea = this.getInputDomRef();\n\n      if (!this.rows) {\n        this.rows = 1;\n      }\n      nativeTextArea.style.height = \"auto\";\n      // 2px - to avoid an unnecessary scrollbar, the border needs to be taken into account\n      nativeTextArea.style.height = `${nativeTextArea.scrollHeight + 2}px`;\n\n      if (this.growingMaxLines) {\n        const style = getComputedStyle(nativeTextArea);\n\n        const lineHeight = parseInt(style.lineHeight);\n        const paddingTop = parseInt(style.paddingTop);\n        const paddingBottom = parseInt(style.paddingBottom);\n\n        const heightRatio = this.growingMaxLines > this.rows ? this.growingMaxLines : this.rows;\n\n        const growingMaxHeight = lineHeight * heightRatio + paddingTop + paddingBottom;\n\n        // 2px - to avoid an unnecessary scrollbar, the border needs to be taken into account\n        nativeTextArea.style.maxHeight = `${growingMaxHeight + 2}px`;\n      }\n    }\n  };\n\n  handleFocus = () => {\n    if (!this.disabled && !this.readonly && !this.displayonly) {\n      this.labelActiveClass = this._labelActiveClassName;\n    }\n  };\n\n  handleBlur = () => {\n    if (this.value) {\n      this.labelActiveClass = this._labelActiveClassName;\n    } else {\n      this.labelActiveClass = \"\";\n    }\n  };\n\n  get ariaInvalid() {\n    return this.fieldState === FieldState.Error ? \"true\" : null;\n  }\n\n  onBeforeRendering() {\n    if (this.value && this.labelActiveClass === \"\") {\n      this.labelActiveClass = this._labelActiveClassName;\n    }\n\n    this.isInputReadonly = this.readonly || this.displayonly;\n\n    this.labelClasses = `udex-textarea__label ${this.labelActiveClass}`;\n  }\n\n  onAfterRendering() {\n    this.handleGrowing();\n  }\n}\n\nUDExTextArea.define();\n\nexport default UDExTextArea;\n"]}
+{"version":3,"file":"TextArea.js","sourceRoot":"","sources":["../src/TextArea.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport getEffectiveScrollbarStyle from \"@ui5/webcomponents-base/dist/util/getEffectiveScrollbarStyle.js\";\nimport Integer from \"@ui5/webcomponents-base/dist/types/Integer.js\";\nimport { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport { isDesktop } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport {\n  READ_ONLY, TEXTAREA_CHARACTERS_LEFT, VALUE_STATE_TYPE_ERROR, VALUE_STATE_TYPE_STANDARD, VALUE_STATE_TYPE_SUCCESS, VALUE_STATE_TYPE_WARNING,\n} from \"./generated/i18n/i18n-defaults.js\";\n\nimport \"@ui5/webcomponents/dist/Icon.js\";\nimport \"@ui5/webcomponents-icons/dist/accept.js\";\nimport \"@ui5/webcomponents-icons/dist/error.js\";\nimport \"@ui5/webcomponents-icons/dist/alert.js\";\n\nimport TextAreaTemplate from \"./generated/templates/TextAreaTemplate.lit.js\";\n\n// Styles\nimport TextAreaCss from \"./generated/themes/TextArea.css.js\";\nimport UDExStatusMessage from \"./StatusMessage.js\";\n\nexport enum FieldState {\n  Standard = \"Standard\",\n  Warning = \"Warning\",\n  Error = \"Error\",\n  Success = \"Success\",\n}\n\n/**\n * @class\n *\n * @constructor\n * @extends UI5Element\n * @tagname udex-text-area\n * @public\n */\n@customElement({\n  tag: \"udex-textarea\",\n  renderer: litRender,\n  styles: [TextAreaCss, getEffectiveScrollbarStyle()],\n  template: TextAreaTemplate,\n  dependencies: [UDExStatusMessage],\n})\n\nclass UDExTextArea extends UI5Element {\n  _labelActiveClassName = \"udex-textarea__label--active\";\n\n  /**\n   * Defines label text for the textarea field.\n   *\n   * @default \"\"\n   * @public\n   */\n  @property({ type: String, defaultValue: \"\" })\n    label!: string;\n\n  /**\n   * Defines the value of the component.\n   * <br><br>\n   * <b>Note:</b> The property is updated upon typing.\n   *\n   * @default \"\"\n   * @public\n   */\n  @property({ type: String, defaultValue: \"\" })\n    value!: string;\n\n  /**\n   * Defines the number of visible text lines for the component.\n   * <br><br>\n   * <b>Notes:</b>\n   * <ul>\n   * <li>If the <code>growing</code> property is enabled, this property defines the minimum rows to be displayed\n   * in the textarea.</li>\n   * <li>The CSS <code>height</code> property wins over the <code>rows</code> property, if both are set.</li>\n   * </ul>\n   *\n   * @public\n   */\n  @property({ validator: Integer })\n    rows!: number;\n\n  /**\n   * Enables the component to automatically grow and shrink dynamically with its content.\n   * <br><br>\n   *\n   * @default false\n   * @public\n   */\n  @property({ type: Boolean })\n    growing!: boolean;\n\n  /**\n   * Defines the maximum number of lines that the component can grow.\n   *\n   * @default 0\n   * @public\n   */\n  @property({ validator: Integer, defaultValue: 0 })\n    growingMaxLines!: number;\n\n  /**\n   * Defines supporting text under the input field.\n   *\n   * @default \"\"\n   * @public\n   */\n  @property({ type: String, defaultValue: \"\" })\n    supportingText!: string;\n\n  /**\n   * Sets the maximum number of characters available in the textarea.\n   *\n   * @public\n   */\n  @property({ validator: Integer })\n    maxlength?: number;\n\n  /**\n   * Defines the value state of the component.\n   *\n   * @default \"Standard\"\n   * @public\n   */\n  @property({ type: FieldState, defaultValue: FieldState.Standard })\n    fieldState!: `${FieldState}`;\n\n  /**\n   * Defines whether the component is required.\n   *\n   * @default false\n   * @public\n   */\n  @property({ type: Boolean })\n    required!: boolean;\n\n  /**\n   * Defines whether the component is in disabled state.\n   * <br><br>\n   * <b>Note:</b> A disabled component is completely noninteractive.\n   *\n   * @default false\n   * @public\n   */\n  @property({ type: Boolean })\n    disabled!: boolean;\n\n  /**\n   * Defines whether the component is read-only.\n   * <br><br>\n   * <b>Note:</b> A read-only component is not editable,\n   * but still provides visual feedback upon user interaction.\n   *\n   * @default false\n   * @public\n   */\n  @property({ type: Boolean })\n    readonly!: boolean;\n\n  /**\n   * Defines whether the component is display-only.\n   * <br><br>\n   * <b>Note:</b> A display-only component is not editable,\n   * but still provides visual feedback upon user interaction, input border is not visible.\n   *\n   * @default false\n   * @public\n   */\n  @property({ type: Boolean })\n    displayonly!: boolean;\n\n  /**\n   * Defines the inner stored value of the readonly attribute of the input.\n   *\n   * @default false\n   * @private\n   */\n  @property({ type: Boolean, noAttribute: true })\n    isInputReadonly!: boolean;\n\n  /**\n   * Defines the inner stored value of the classes of the label.\n   *\n   * @default \"\"\n   * @private\n   */\n  @property({ type: String, noAttribute: true, defaultValue: \"\" })\n    labelClasses!: string;\n\n  /**\n   * Defines the inner stored class of the label.\n   *\n   * @default \"\"\n   * @private\n   */\n  @property({ type: String, noAttribute: true, defaultValue: \"\" })\n    labelActiveClass!: string;\n\n  /**\n   * Defines the accessible ARIA name of the component.\n   * @default \"\"\n   * @public\n   */\n  @property()\n    accessibleName!: string;\n\n  /**\n   * Receives id (or many ids) of the elements that label the component.\n   * @default \"\"\n   * @public\n   */\n  @property({ defaultValue: \"\" })\n    accessibleNameRef!: string;\n\n  /**\n   * Defines the active (focus)\n   * @default false\n   * @private\n   */\n  @property({ type: Boolean })\n    active!: boolean;\n  /**\n   * Defines is it the touch of the textarea (only for mobile devices).\n   * @default false\n   * @private\n   */\n  @property({ type: Boolean })\n    _isTouched!: boolean;\n\n  static i18nBundle: I18nBundle;\n\n  static async onDefine() {\n    UDExTextArea.i18nBundle = await getI18nBundle(\"@udex/web-components\");\n  }\n\n  getInputDomRef() {\n    return this.getDomRef()!.querySelector<HTMLTextAreaElement>(\"textarea\")!;\n  }\n\n  get hasValueState() {\n    return this.fieldState === FieldState.Error || this.fieldState === FieldState.Warning || this.fieldState === FieldState.Success;\n  }\n\n  get fieldStateTypeMappings() {\n    return {\n      \"Success\": UDExTextArea.i18nBundle.getText(VALUE_STATE_TYPE_SUCCESS),\n      \"Standard\": UDExTextArea.i18nBundle.getText(VALUE_STATE_TYPE_STANDARD),\n      \"Error\": UDExTextArea.i18nBundle.getText(VALUE_STATE_TYPE_ERROR),\n      \"Warning\": UDExTextArea.i18nBundle.getText(VALUE_STATE_TYPE_WARNING),\n    };\n  }\n\n  get ariaValueStateHiddenText() {\n    if (!this.hasValueState) {\n      return;\n    }\n\n    if (this.fieldState === FieldState.Standard) {\n      return;\n    }\n\n    return `${this.fieldStateTypeMappings[this.fieldState]}`;\n  }\n\n  get readOnlyText() {\n    return UDExTextArea.i18nBundle.getText(READ_ONLY);\n  }\n\n  get ariaDescribedBy() {\n    const valueStateTextDescId = this.hasValueState ? `${this._id}-valueStateDesc` : \"\";\n    const readonlyTextDescId = this.readonly ? `${this._id}-readonlyDesc` : \"\";\n    const supportingTextDescId = this._supportingText ? `${this._id}-supportingTextDesc` : \"\";\n    if (!valueStateTextDescId && !supportingTextDescId && !readonlyTextDescId) {\n      return;\n    }\n    return `${valueStateTextDescId} ${supportingTextDescId} ${readonlyTextDescId}`;\n  }\n\n  get _supportingText() {\n    if (this.supportingText.length) {\n      return this.supportingText;\n    }\n\n    const maxLength = this.maxlength;\n\n    if (maxLength !== null && maxLength !== undefined) {\n      const leftCharactersCount = maxLength - this.value.length;\n\n      if (leftCharactersCount >= 0) {\n        return UDExTextArea.i18nBundle.getText(TEXTAREA_CHARACTERS_LEFT, leftCharactersCount);\n      }\n    }\n  }\n\n  handleInput = (event: InputEvent) => {\n    this.value = (event.target as HTMLInputElement)?.value;\n  };\n\n  handleChange = () => {\n    this.fireEvent(\"change\");\n  };\n\n  handleGrowing = () => {\n    if (this.growing) {\n      const nativeTextArea = this.getInputDomRef();\n\n      if (!this.rows) {\n        this.rows = 1;\n      }\n      nativeTextArea.style.height = \"auto\";\n      // 2px - to avoid an unnecessary scrollbar, the border needs to be taken into account\n      nativeTextArea.style.height = `${nativeTextArea.scrollHeight + 2}px`;\n\n      if (this.growingMaxLines) {\n        const style = getComputedStyle(nativeTextArea);\n\n        const lineHeight = parseInt(style.lineHeight);\n        const paddingTop = parseInt(style.paddingTop);\n        const paddingBottom = parseInt(style.paddingBottom);\n\n        const heightRatio = this.growingMaxLines > this.rows ? this.growingMaxLines : this.rows;\n\n        const growingMaxHeight = lineHeight * heightRatio + paddingTop + paddingBottom;\n\n        // 2px - to avoid an unnecessary scrollbar, the border needs to be taken into account\n        nativeTextArea.style.maxHeight = `${growingMaxHeight + 2}px`;\n      }\n    }\n  };\n\n  handleFocus = () => {\n    if (!this.disabled && !this.readonly && !this.displayonly) {\n      this.active = true;\n      this.labelActiveClass = this._labelActiveClassName;\n    }\n  };\n\n  handleClick(): void {\n    if (!isDesktop()) {\n      this._isTouched = true;\n    }\n  }\n\n  handleBlur = () => {\n    this._isTouched = false;\n    if (this.value) {\n      this.labelActiveClass = this._labelActiveClassName;\n    } else {\n      this.labelActiveClass = \"\";\n    }\n    this.active = false;\n  };\n\n  get ariaInvalid() {\n    return this.fieldState === FieldState.Error ? \"true\" : null;\n  }\n\n  onBeforeRendering() {\n    if (this.value && this.labelActiveClass === \"\") {\n      this.labelActiveClass = this._labelActiveClassName;\n    }\n\n    this.isInputReadonly = this.readonly || this.displayonly;\n\n    this.labelClasses = `udex-textarea__label ${this.labelActiveClass}`;\n  }\n\n  onAfterRendering() {\n    this.handleGrowing();\n  }\n}\n\nUDExTextArea.define();\n\nexport default UDExTextArea;\n"]}

package/dist/TextField.d.ts

@@ -1,5 +1,13 @@
 import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js";
+import ValueState from "./types/common.js";
+type AccInfo = {
+    ariaInvalid?: string;
+    ariaDescribedBy?: string;
+    ariaLabelledBy?: string;
+    ariaLabel?: string;
+    ariaHasPopup?: string;
+};
 /**
  * @class
  *
@@ -98,7 +106,7 @@ declare class UDExTextField extends UI5Element {
      * @default "Standard"
      * @public
      */
-    valueState: "Standard" | "Warning" | "Error" | "Success";
+    valueState: `${ValueState}`;
     /**
      * Defines supporting text under the input field.
      *
@@ -180,14 +188,20 @@ declare class UDExTextField extends UI5Element {
      * @public
      */
     ariaDescribedBy?: string;
+    /**
+     * Defines the aria-has-popup attribute of the input.
+     * @private
+     */
+    _ariaHasPopup?: string;
+    /**
+     * Defines is it the touch of the input field (only for mobile devices).
+     * @default false
+     * @private
+     */
+    _isTouched: boolean;
     static i18nBundle: I18nBundle;
     static onDefine(): Promise<void>;
-    get valueStateTypeMappings(): {
-        Success: string;
-        Standard: string;
-        Error: string;
-        Warning: string;
-    };
+    get valueStateTypeMappings(): Record<string, string>;
     get hasValueState(): boolean;
     get valueStateText(): string | undefined;
     get readOnlyStateText(): string;
@@ -195,14 +209,10 @@ declare class UDExTextField extends UI5Element {
     get supportingTextId(): string;
     get valueStateTextId(): string;
     get readOnlyStateTextId(): string;
-    get accInfo(): {
-        ariaInvalid: string | undefined;
-        ariaDescribedBy: string | undefined;
-        ariaLabelledBy: string;
-        ariaLabel: string | undefined;
-    };
+    get accInfo(): AccInfo;
     handleChange: () => void;
     handleInput: (inputEvent: InputEvent) => void;
+    handleClick: () => void;
     handleFocus: () => void;
     handleBlur: () => void;
     handleKeyDown: (keyboardEvent: KeyboardEvent) => void;

package/dist/TextField.js

@@ -14,14 +14,15 @@ import event from "@ui5/webcomponents-base/dist/decorators/event.js";
 import Icon from "@ui5/webcomponents/dist/Icon.js";
 import Float from "@ui5/webcomponents-base/dist/types/Float.js";
 import { getI18nBundle } from "@ui5/webcomponents-base/dist/i18nBundle.js";
+import { isDesktop } from "@ui5/webcomponents-base/dist/Device.js";
 import { VALUE_STATE_SUCCESS, VALUE_STATE_INFORMATION, VALUE_STATE_WARNING, VALUE_STATE_ERROR, READ_ONLY, } from "./generated/i18n/i18n-defaults.js";
 import UDExControlButton from "./ControlButton.js";
 import ValueState from "./types/common.js";
+import UDExStatusMessage from "./StatusMessage.js";
 // Template
 import TextFieldTemplate from "./generated/templates/TextFieldTemplate.lit";
 // Styles
 import TextFieldCss from "./generated/themes/TextField.css.js";
-import UDExStatusMessage from "./StatusMessage.js";
 /**
  * @class
  *
@@ -39,7 +40,11 @@ let UDExTextField = UDExTextField_1 = class UDExTextField extends UI5Element {
         };
         this.handleInput = (inputEvent) => {
             this.value = inputEvent.target?.value;
-            this.fireEvent("input");
+        };
+        this.handleClick = () => {
+            if (!isDesktop()) {
+                this._isTouched = true;
+            }
         };
         this.handleFocus = () => {
             if (!this.disabled && !this.readonly && !this.displayonly) {
@@ -55,6 +60,7 @@ let UDExTextField = UDExTextField_1 = class UDExTextField extends UI5Element {
             else {
                 this.labelActiveClass = "";
             }
+            this._isTouched = false;
         };
         this.handleKeyDown = (keyboardEvent) => {
             keyboardEvent.stopPropagation();
@@ -62,7 +68,7 @@ let UDExTextField = UDExTextField_1 = class UDExTextField extends UI5Element {
         };
     }
     static async onDefine() {
-        UDExTextField_1.i18nBundle = await getI18nBundle("sap-ui-webcomponents-bundle");
+        UDExTextField_1.i18nBundle = await getI18nBundle("@udex/web-components");
     }
     get valueStateTypeMappings() {
         return {
@@ -99,6 +105,7 @@ let UDExTextField = UDExTextField_1 = class UDExTextField extends UI5Element {
             "ariaDescribedBy": this.ariaDescribedBy ? this.ariaDescribedBy : this.ariaDescribedById || undefined,
             "ariaLabelledBy": this.accessibleNameRef,
             "ariaLabel": this.accessibleName || undefined,
+            "ariaHasPopup": this._ariaHasPopup || undefined,
         };
     }
     handleIconClick() {
@@ -160,7 +167,7 @@ __decorate([
     property({ type: Boolean })
 ], UDExTextField.prototype, "required", void 0);
 __decorate([
-    property({ type: ValueState, defaultValue: "Standard" })
+    property({ type: ValueState, defaultValue: ValueState.Standard })
 ], UDExTextField.prototype, "valueState", void 0);
 __decorate([
     property({ type: String })
@@ -201,6 +208,12 @@ __decorate([
 __decorate([
     property()
 ], UDExTextField.prototype, "ariaDescribedBy", void 0);
+__decorate([
+    property({ type: String })
+], UDExTextField.prototype, "_ariaHasPopup", void 0);
+__decorate([
+    property({ type: Boolean })
+], UDExTextField.prototype, "_isTouched", void 0);
 UDExTextField = UDExTextField_1 = __decorate([
     customElement({
         tag: "udex-text-field",

package/dist/TextField.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextField.js","sourceRoot":"","sources":["../src/TextField.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport Integer from \"@ui5/webcomponents-base/dist/types/Integer.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event.js\";\nimport Icon from \"@ui5/webcomponents/dist/Icon.js\";\nimport Float from \"@ui5/webcomponents-base/dist/types/Float.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport {\n  VALUE_STATE_SUCCESS,\n  VALUE_STATE_INFORMATION,\n  VALUE_STATE_WARNING,\n  VALUE_STATE_ERROR,\n  READ_ONLY,\n} from \"./generated/i18n/i18n-defaults.js\";\nimport UDExControlButton from \"./ControlButton.js\";\nimport ValueState from \"./types/common.js\";\n\n// Template\nimport TextFieldTemplate from \"./generated/templates/TextFieldTemplate.lit\";\n\n// Styles\nimport TextFieldCss from \"./generated/themes/TextField.css.js\";\nimport UDExStatusMessage from \"./StatusMessage.js\";\n\n/**\n * @class\n *\n * @constructor\n * @extends UI5Element\n * @tagname udex-text-field\n * @public\n */\n@customElement({\n  tag: \"udex-text-field\",\n  renderer: litRender,\n  styles: TextFieldCss,\n  template: TextFieldTemplate,\n  dependencies: [UDExControlButton, Icon, UDExStatusMessage],\n})\n\n/**\n   * Fired event when the user clicks the trigger.\n   *\n   * @public\n   */\n@event(\"click-trigger\")\n/**\n   * Fired when the value of the component changes at each keystroke.\n   *\n   * @public\n   */\n@event(\"input\")\n/**\n   * Fired when the input operation has finished by pressing Enter or on focusout.\n   *\n   * @public\n   */\n@event(\"change\")\n/**\n * Fired event when the user clicks the icon.\n *\n * @private\n */\n@event(\"click-icon\")\nclass UDExTextField extends UI5Element {\n  _labelActiveClassName = \"udex-text-field__label_active\";\n\n  /**\n   * Defines whether the component is in disabled state.\n   * <br><br>\n   * <b>Note:</b> A disabled component is completely noninteractive.\n   *\n   * @default false\n   * @public\n   */\n  @property({ type: Boolean })\n    disabled!: boolean;\n\n  /**\n   * Defines the value of the component.\n   * <br><br>\n   * <b>Note:</b> The property is updated upon typing.\n   *\n   * @default \"\"\n   * @formEvents input\n   * @formProperty\n   * @public\n   */\n  @property({ type: String })\n    value!: string;\n\n  /**\n   * Sets the maximum number of characters available in the input field.\n   * <br><br>\n   * <b>Note:</b> This property is not compatible with the ui5-input type InputType.Number. If the ui5-input type is set to Number, the maxlength value is ignored.\n   *\n   * @public\n   */\n  @property({ validator: Integer })\n    maxlength?: number;\n\n  /**\n   * Defines label text for the input field.\n   *\n   * @default \"\"\n   * @public\n   */\n  @property({ type: String })\n    label!: string;\n\n  /**\n   * Defines the accessible ARIA name of the component.\n   *\n   * @default \"\"\n   * @public\n   */\n  @property()\n    accessibleName!: string;\n\n  /**\n   * Receives id (or many ids) of the elements that label the component.\n   * @default \"\"\n   * @public\n   */\n  @property({ defaultValue: \"\" })\n    accessibleNameRef!: string;\n\n  /**\n   * Defines the accessible ARIA name of the component.\n   *\n   * @default \"\"\n   * @public\n   */\n  @property()\n    accessibleIconName!: string;\n\n  /**\n   * Defines whether the component is read-only.\n   * <br><br>\n   * <b>Note:</b> A read-only component is not editable,\n   * but still provides visual feedback upon user interaction.\n   *\n   * @default false\n   * @public\n   */\n  @property({ type: Boolean })\n    readonly!: boolean;\n\n  /**\n   * Defines whether the component is display-only.\n   * <br><br>\n   * <b>Note:</b> A display-only component is not editable,\n   * but still provides visual feedback upon user interaction, input border is not visible.\n   *\n   * @default false\n   * @public\n   */\n  @property({ type: Boolean })\n    displayonly!: boolean;\n\n  /**\n   * Defines whether the component is required.\n   *\n   * @default false\n   * @public\n   */\n  @property({ type: Boolean })\n    required!: boolean;\n\n  /**\n   * Defines the value state of the component.\n   *\n   * @default \"Standard\"\n   * @public\n   */\n  @property({ type: ValueState, defaultValue: \"Standard\" })\n    valueState!: \"Standard\" | \"Warning\" | \"Error\" | \"Success\";\n\n  /**\n   * Defines supporting text under the input field.\n   *\n   * @default \"\"\n   * @public\n   */\n  @property({ type: String })\n    supportingText!: string;\n\n  /**\n   * Defines the icon name in the text-field.\n   *\n   * @default \"\"\n   * @public\n   */\n  @property({ type: String })\n    icon!: string;\n\n  /**\n   * Defines if the text-field is active\n   *\n   * @default false\n   * @public\n   */\n  @property({ type: Boolean })\n    active!: boolean;\n\n  /**\n   * Defines the inner stored show password button tooltip.\n   *\n   * @default \"\"\n   * @private\n   */\n\n  @property({ type: String, defaultValue: \"\" })\n    showButtonTooltip!: string;\n\n  /**\n   * Defines the inner stored class of the label.\n   *\n   * @default \"\"\n   * @private\n   */\n  @property({ type: String, noAttribute: true, defaultValue: \"\" })\n    labelActiveClass!: string;\n\n  /**\n   * Defines the inner stored value of the readonly attribute of the input.\n   *\n   * @default false\n   * @private\n   */\n  @property({ type: Boolean, noAttribute: true })\n    isInputReadonly!: boolean;\n\n  /**\n   * Defines the inner stored value of the classes of the label.\n   *\n   * @default \"\"\n   * @private\n   */\n  @property({ type: String, noAttribute: true, defaultValue: \"\" })\n    labelClasses!: string;\n\n  /**\n   * Defines the inner stored value of the classes of the label.\n   *\n   * @default \"text\"\n   * @private\n   */\n  @property({ type: String, defaultValue: \"text\" })\n    type!: string;\n\n  /**\n   * Defines direction of the input.\n   *\n   * @public\n   */\n  @property({ type: String, noAttribute: true })\n    direction?: string;\n\n  /**\n   * Defines the max value for the \"number\" type of the input.\n   */\n  @property({ validator: Float })\n    max?: number;\n\n  /**\n   * Defines the min value for the \"number\" type of the input.\n   */\n  @property({ validator: Float })\n    min?: number;\n\n  /**\n   * Defines the step for the \"number\" type of the input.\n   */\n  @property({ validator: Float })\n    step?: number;\n\n  /**\n   * Allows setting the aria-describedby property on the internal input node.\n   *\n   * @default \"\"\n   * @public\n   */\n  @property()\n    ariaDescribedBy?: string;\n\n  static i18nBundle: I18nBundle;\n\n  static async onDefine() {\n    UDExTextField.i18nBundle = await getI18nBundle(\"sap-ui-webcomponents-bundle\");\n  }\n\n  get valueStateTypeMappings() {\n    return {\n      \"Success\": UDExTextField.i18nBundle.getText(VALUE_STATE_SUCCESS),\n      \"Standard\": UDExTextField.i18nBundle.getText(VALUE_STATE_INFORMATION),\n      \"Error\": UDExTextField.i18nBundle.getText(VALUE_STATE_ERROR),\n      \"Warning\": UDExTextField.i18nBundle.getText(VALUE_STATE_WARNING),\n    };\n  }\n\n  get hasValueState() {\n    return this.valueState !== ValueState.Standard;\n  }\n\n  get valueStateText() {\n    return this.valueState !== ValueState.Standard ? this.valueStateTypeMappings[this.valueState] : undefined;\n  }\n\n  get readOnlyStateText() {\n    return UDExTextField.i18nBundle.getText(READ_ONLY);\n  }\n\n  get ariaDescribedById(): string {\n    return `${this.supportingTextId} ${this.valueStateTextId} ${this.readOnlyStateTextId}`.trim();\n  }\n\n  get supportingTextId():string {\n    return this.supportingText ? `${this._id}-supportingTextDesc` : \"\";\n  }\n\n  get valueStateTextId():string {\n    return this.hasValueState ? `${this._id}-valueStateDesc` : \"\";\n  }\n\n  get readOnlyStateTextId():string {\n    return this.readonly ? `${this._id}-stateReadOnlyDesc` : \"\";\n  }\n\n  get accInfo() {\n    return {\n      \"ariaInvalid\": this.valueState === ValueState.Error ? \"true\" : undefined,\n      \"ariaDescribedBy\": this.ariaDescribedBy ? this.ariaDescribedBy : this.ariaDescribedById || undefined,\n      \"ariaLabelledBy\": this.accessibleNameRef,\n      \"ariaLabel\": this.accessibleName || undefined,\n    };\n  }\n\n  handleChange = () => {\n    this.fireEvent(\"change\");\n  };\n\n  handleInput = (inputEvent: InputEvent) => {\n    this.value = (inputEvent.target as HTMLInputElement)?.value;\n    this.fireEvent(\"input\");\n  };\n\n  handleFocus = () => {\n    if (!this.disabled && !this.readonly && !this.displayonly) {\n      this.labelActiveClass = this._labelActiveClassName;\n      this.active = true;\n    }\n  };\n\n  handleBlur = () => {\n    this.active = false;\n\n    if (this.value) {\n      this.labelActiveClass = this._labelActiveClassName;\n    } else {\n      this.labelActiveClass = \"\";\n    }\n  };\n\n  handleKeyDown = (keyboardEvent: KeyboardEvent) => {\n    keyboardEvent.stopPropagation();\n    this.fireEvent(\"click-trigger\", keyboardEvent);\n  };\n\n  handleIconClick(): void {\n    this.fireEvent(\"click-icon\");\n  }\n\n  onBeforeRendering() {\n    if ((this.value || this.active) && this.labelActiveClass === \"\") {\n      this.labelActiveClass = this._labelActiveClassName;\n    } else if (!this.active && !this.value && this.labelActiveClass.length) {\n      this.labelActiveClass = \"\";\n    }\n\n    this.isInputReadonly = this.readonly || this.displayonly;\n\n    this.labelClasses = `udex-text-field__label ${this.labelActiveClass}`;\n  }\n\n  onAfterRendering(): void {\n    const directionStyles: string = window\n      .getComputedStyle(this)\n      .getPropertyValue(\"direction\");\n\n    if (!directionStyles) {\n      this.direction = \"ltr\";\n    } else {\n      this.direction = directionStyles;\n    }\n  }\n\n  get readonlyNotDisabled() {\n    return this.isInputReadonly && !this.disabled;\n  }\n}\n\nUDExTextField.define();\n\nexport default UDExTextField;\n"]}
+{"version":3,"file":"TextField.js","sourceRoot":"","sources":["../src/TextField.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport Integer from \"@ui5/webcomponents-base/dist/types/Integer.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event.js\";\nimport Icon from \"@ui5/webcomponents/dist/Icon.js\";\nimport Float from \"@ui5/webcomponents-base/dist/types/Float.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport { isDesktop } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport {\n  VALUE_STATE_SUCCESS,\n  VALUE_STATE_INFORMATION,\n  VALUE_STATE_WARNING,\n  VALUE_STATE_ERROR,\n  READ_ONLY,\n} from \"./generated/i18n/i18n-defaults.js\";\nimport UDExControlButton from \"./ControlButton.js\";\nimport ValueState from \"./types/common.js\";\nimport UDExStatusMessage from \"./StatusMessage.js\";\n\n// Template\nimport TextFieldTemplate from \"./generated/templates/TextFieldTemplate.lit\";\n\n// Styles\nimport TextFieldCss from \"./generated/themes/TextField.css.js\";\n\ntype AccInfo = {\n  ariaInvalid?: string;\n  ariaDescribedBy?: string;\n  ariaLabelledBy?: string;\n  ariaLabel?: string;\n  ariaHasPopup?: string,\n}\n\n/**\n * @class\n *\n * @constructor\n * @extends UI5Element\n * @tagname udex-text-field\n * @public\n */\n@customElement({\n  tag: \"udex-text-field\",\n  renderer: litRender,\n  styles: TextFieldCss,\n  template: TextFieldTemplate,\n  dependencies: [UDExControlButton, Icon, UDExStatusMessage],\n})\n\n/**\n   * Fired event when the user clicks the trigger.\n   *\n   * @public\n   */\n@event(\"click-trigger\")\n/**\n   * Fired when the value of the component changes at each keystroke.\n   *\n   * @public\n   */\n@event(\"input\")\n/**\n   * Fired when the input operation has finished by pressing Enter or on focusout.\n   *\n   * @public\n   */\n@event(\"change\")\n/**\n * Fired event when the user clicks the icon.\n *\n * @private\n */\n@event(\"click-icon\")\nclass UDExTextField extends UI5Element {\n  _labelActiveClassName = \"udex-text-field__label_active\";\n\n  /**\n   * Defines whether the component is in disabled state.\n   * <br><br>\n   * <b>Note:</b> A disabled component is completely noninteractive.\n   *\n   * @default false\n   * @public\n   */\n  @property({ type: Boolean })\n    disabled!: boolean;\n\n  /**\n   * Defines the value of the component.\n   * <br><br>\n   * <b>Note:</b> The property is updated upon typing.\n   *\n   * @default \"\"\n   * @formEvents input\n   * @formProperty\n   * @public\n   */\n  @property({ type: String })\n    value!: string;\n\n  /**\n   * Sets the maximum number of characters available in the input field.\n   * <br><br>\n   * <b>Note:</b> This property is not compatible with the ui5-input type InputType.Number. If the ui5-input type is set to Number, the maxlength value is ignored.\n   *\n   * @public\n   */\n  @property({ validator: Integer })\n    maxlength?: number;\n\n  /**\n   * Defines label text for the input field.\n   *\n   * @default \"\"\n   * @public\n   */\n  @property({ type: String })\n    label!: string;\n\n  /**\n   * Defines the accessible ARIA name of the component.\n   *\n   * @default \"\"\n   * @public\n   */\n  @property()\n    accessibleName!: string;\n\n  /**\n   * Receives id (or many ids) of the elements that label the component.\n   * @default \"\"\n   * @public\n   */\n  @property({ defaultValue: \"\" })\n    accessibleNameRef!: string;\n\n  /**\n   * Defines the accessible ARIA name of the component.\n   *\n   * @default \"\"\n   * @public\n   */\n  @property()\n    accessibleIconName!: string;\n\n  /**\n   * Defines whether the component is read-only.\n   * <br><br>\n   * <b>Note:</b> A read-only component is not editable,\n   * but still provides visual feedback upon user interaction.\n   *\n   * @default false\n   * @public\n   */\n  @property({ type: Boolean })\n    readonly!: boolean;\n\n  /**\n   * Defines whether the component is display-only.\n   * <br><br>\n   * <b>Note:</b> A display-only component is not editable,\n   * but still provides visual feedback upon user interaction, input border is not visible.\n   *\n   * @default false\n   * @public\n   */\n  @property({ type: Boolean })\n    displayonly!: boolean;\n\n  /**\n   * Defines whether the component is required.\n   *\n   * @default false\n   * @public\n   */\n  @property({ type: Boolean })\n    required!: boolean;\n\n  /**\n   * Defines the value state of the component.\n   *\n   * @default \"Standard\"\n   * @public\n   */\n  @property({ type: ValueState, defaultValue: ValueState.Standard })\n    valueState!: `${ValueState}`;\n\n  /**\n   * Defines supporting text under the input field.\n   *\n   * @default \"\"\n   * @public\n   */\n  @property({ type: String })\n    supportingText!: string;\n\n  /**\n   * Defines the icon name in the text-field.\n   *\n   * @default \"\"\n   * @public\n   */\n  @property({ type: String })\n    icon!: string;\n\n  /**\n   * Defines if the text-field is active\n   *\n   * @default false\n   * @public\n   */\n  @property({ type: Boolean })\n    active!: boolean;\n\n  /**\n   * Defines the inner stored show password button tooltip.\n   *\n   * @default \"\"\n   * @private\n   */\n\n  @property({ type: String, defaultValue: \"\" })\n    showButtonTooltip!: string;\n\n  /**\n   * Defines the inner stored class of the label.\n   *\n   * @default \"\"\n   * @private\n   */\n  @property({ type: String, noAttribute: true, defaultValue: \"\" })\n    labelActiveClass!: string;\n\n  /**\n   * Defines the inner stored value of the readonly attribute of the input.\n   *\n   * @default false\n   * @private\n   */\n  @property({ type: Boolean, noAttribute: true })\n    isInputReadonly!: boolean;\n\n  /**\n   * Defines the inner stored value of the classes of the label.\n   *\n   * @default \"\"\n   * @private\n   */\n  @property({ type: String, noAttribute: true, defaultValue: \"\" })\n    labelClasses!: string;\n\n  /**\n   * Defines the inner stored value of the classes of the label.\n   *\n   * @default \"text\"\n   * @private\n   */\n  @property({ type: String, defaultValue: \"text\" })\n    type!: string;\n\n  /**\n   * Defines direction of the input.\n   *\n   * @public\n   */\n  @property({ type: String, noAttribute: true })\n    direction?: string;\n\n  /**\n   * Defines the max value for the \"number\" type of the input.\n   */\n  @property({ validator: Float })\n    max?: number;\n\n  /**\n   * Defines the min value for the \"number\" type of the input.\n   */\n  @property({ validator: Float })\n    min?: number;\n\n  /**\n   * Defines the step for the \"number\" type of the input.\n   */\n  @property({ validator: Float })\n    step?: number;\n\n  /**\n   * Allows setting the aria-describedby property on the internal input node.\n   *\n   * @default \"\"\n   * @public\n   */\n  @property()\n    ariaDescribedBy?: string;\n\n  /**\n   * Defines the aria-has-popup attribute of the input.\n   * @private\n   */\n  @property({ type: String })\n    _ariaHasPopup?: string;\n\n  /**\n   * Defines is it the touch of the input field (only for mobile devices).\n   * @default false\n   * @private\n   */\n  @property({ type: Boolean })\n    _isTouched!: boolean;\n\n  static i18nBundle: I18nBundle;\n\n  static async onDefine(): Promise<void> {\n    UDExTextField.i18nBundle = await getI18nBundle(\"@udex/web-components\");\n  }\n\n  get valueStateTypeMappings(): Record<string, string> {\n    return {\n      \"Success\": UDExTextField.i18nBundle.getText(VALUE_STATE_SUCCESS),\n      \"Standard\": UDExTextField.i18nBundle.getText(VALUE_STATE_INFORMATION),\n      \"Error\": UDExTextField.i18nBundle.getText(VALUE_STATE_ERROR),\n      \"Warning\": UDExTextField.i18nBundle.getText(VALUE_STATE_WARNING),\n    };\n  }\n\n  get hasValueState(): boolean {\n    return this.valueState !== ValueState.Standard;\n  }\n\n  get valueStateText(): string | undefined {\n    return this.valueState !== ValueState.Standard ? this.valueStateTypeMappings[this.valueState] : undefined;\n  }\n\n  get readOnlyStateText(): string {\n    return UDExTextField.i18nBundle.getText(READ_ONLY);\n  }\n\n  get ariaDescribedById(): string {\n    return `${this.supportingTextId} ${this.valueStateTextId} ${this.readOnlyStateTextId}`.trim();\n  }\n\n  get supportingTextId(): string {\n    return this.supportingText ? `${this._id}-supportingTextDesc` : \"\";\n  }\n\n  get valueStateTextId(): string {\n    return this.hasValueState ? `${this._id}-valueStateDesc` : \"\";\n  }\n\n  get readOnlyStateTextId(): string {\n    return this.readonly ? `${this._id}-stateReadOnlyDesc` : \"\";\n  }\n\n  get accInfo(): AccInfo {\n    return {\n      \"ariaInvalid\": this.valueState === ValueState.Error ? \"true\" : undefined,\n      \"ariaDescribedBy\": this.ariaDescribedBy ? this.ariaDescribedBy : this.ariaDescribedById || undefined,\n      \"ariaLabelledBy\": this.accessibleNameRef,\n      \"ariaLabel\": this.accessibleName || undefined,\n      \"ariaHasPopup\": this._ariaHasPopup || undefined,\n    };\n  }\n\n  handleChange = (): void => {\n    this.fireEvent(\"change\");\n  };\n\n  handleInput = (inputEvent: InputEvent) => {\n    this.value = (inputEvent.target as HTMLInputElement)?.value;\n  };\n\n  handleClick = (): void => {\n    if (!isDesktop()) {\n      this._isTouched = true;\n    }\n  };\n\n  handleFocus = (): void => {\n    if (!this.disabled && !this.readonly && !this.displayonly) {\n      this.labelActiveClass = this._labelActiveClassName;\n      this.active = true;\n    }\n  };\n\n  handleBlur = (): void => {\n    this.active = false;\n\n    if (this.value) {\n      this.labelActiveClass = this._labelActiveClassName;\n    } else {\n      this.labelActiveClass = \"\";\n    }\n    this._isTouched = false;\n  };\n\n  handleKeyDown = (keyboardEvent: KeyboardEvent): void => {\n    keyboardEvent.stopPropagation();\n    this.fireEvent(\"click-trigger\", keyboardEvent);\n  };\n\n  handleIconClick(): void {\n    this.fireEvent(\"click-icon\");\n  }\n\n  onBeforeRendering(): void {\n    if ((this.value || this.active) && this.labelActiveClass === \"\") {\n      this.labelActiveClass = this._labelActiveClassName;\n    } else if (!this.active && !this.value && this.labelActiveClass.length) {\n      this.labelActiveClass = \"\";\n    }\n\n    this.isInputReadonly = this.readonly || this.displayonly;\n\n    this.labelClasses = `udex-text-field__label ${this.labelActiveClass}`;\n  }\n\n  onAfterRendering(): void {\n    const directionStyles: string = window\n      .getComputedStyle(this)\n      .getPropertyValue(\"direction\");\n\n    if (!directionStyles) {\n      this.direction = \"ltr\";\n    } else {\n      this.direction = directionStyles;\n    }\n  }\n\n  get readonlyNotDisabled(): boolean {\n    return this.isInputReadonly && !this.disabled;\n  }\n}\n\nUDExTextField.define();\n\nexport default UDExTextField;\n"]}

package/dist/Tooltip.d.ts

@@ -19,7 +19,7 @@ export declare enum PlacementType {
  * For the <code>udex-tooltip</code>
  * <h3>ES6 Module Import</h3>
  *
- * <code>import @udex/web-components/dist/Tooltip.js";</code>
+ * <code>import "@udex/web-components/dist/Tooltip.js";</code>
  *
  * @constructor
  * @author SAP SE

package/dist/Tooltip.js

@@ -34,7 +34,7 @@ export var PlacementType;
  * For the <code>udex-tooltip</code>
  * <h3>ES6 Module Import</h3>
  *
- * <code>import @udex/web-components/dist/Tooltip.js";</code>
+ * <code>import "@udex/web-components/dist/Tooltip.js";</code>
  *
  * @constructor
  * @author SAP SE

package/dist/Tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../src/Tooltip.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,UAAU,MAAM,4CAA4C,CAAC;AACpE,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,IAAI,MAAM,iDAAiD,CAAC;AACnE,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,SAAS,MAAM,sDAAsD,CAAC;AAC7E,OAAO,OAAO,MAAM,oCAAoC,CAAC;AACzD,OAAO,oBAAoB,MAAM,uDAAuD,CAAC;AACzF,OAAO,sBAAsB,MAAM,yDAAyD,CAAC;AAC7F,OAAO,mBAAmB,MAAM,sDAAsD,CAAC;AAEvF,WAAW;AACX,OAAO,eAAe,MAAM,8CAA8C,CAAC;AAE3E,SAAS;AACT,OAAO,UAAU,MAAM,gCAAgC,CAAC;AAExD,MAAM,CAAN,IAAY,aAKX;AALD,WAAY,aAAa;IACvB,8BAAa,CAAA;IACb,gCAAe,CAAA;IACf,4BAAW,CAAA;IACX,kCAAiB,CAAA;AACnB,CAAC,EALW,aAAa,KAAb,aAAa,QAKxB;AAED;;;;;;;;;;;;;;;;;GAiBG;AAQH,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,UAAU;IA0ElC,UAAU;QACR,OAAO,IAAI,CAAC,UAAW,CAAC,aAAa,CACnC,eAAe,CACf,CAAC;IACL,CAAC;IAED;;OAEG;IACH,MAAM;QACJ,MAAM,OAAO,GAAG,IAAI,CAAC,UAAU,EAAE,CAAC;QAClC,OAAO,OAAO,CAAC,MAAM,EAAE,CAAC;IAC1B,CAAC;IAED;;;;OAIG;IACH,MAAM,CAAC,MAAmB;QACxB,MAAM,OAAO,GAAG,IAAI,CAAC,UAAU,EAAE,CAAC;QAClC,OAAO,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;IACzB,CAAC;IAED;;;OAGG;IACH,OAAO;QACL,MAAM,OAAO,GAAG,IAAI,CAAC,UAAU,EAAE,CAAC;QAClC,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;IACtB,CAAC;CACF,CAAA;AAnGuB;IAArB,IAAI,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC;4CAAgB;AAQS;IAA7C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,YAAY,EAAE,EAAE,EAAE,CAAC;0CAAgB;AAS3D;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;8CACN;AASpB;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,aAAa,EAAE,YAAY,EAAE,aAAa,CAAC,KAAK,EAAE,CAAC;8CACpC;AAO/B;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,sBAAsB,EAAE,YAAY,EAAE,sBAAsB,CAAC,MAAM,EAAE,CAAC;oDACxC;AAQ9C;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,oBAAoB,EAAE,YAAY,EAAE,oBAAoB,CAAC,MAAM,EAAE,CAAC;kDACxC;AAQ1C;IADD,QAAQ,CAAC,EAAE,YAAY,EAAE,SAAS,EAAE,CAAC;mDACZ;AAQxB;IADD,QAAQ,CAAC,EAAE,YAAY,EAAE,EAAE,EAAE,CAAC;sDACF;AAQ3B;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,mBAAmB,EAAE,YAAY,EAAE,mBAAmB,CAAC,MAAM,EAAE,CAAC;mDACtC;AAxExC,WAAW;IAPhB,aAAa,CAAC;QACb,GAAG,EAAE,cAAc;QACnB,QAAQ,EAAE,SAAS;QACnB,MAAM,EAAE,UAAU;QAClB,QAAQ,EAAE,eAAe;QACzB,YAAY,EAAE,CAAC,OAAO,CAAC;KACxB,CAAC;GACI,WAAW,CA0GhB;AAED,WAAW,CAAC,MAAM,EAAE,CAAC;AAErB,eAAe,WAAW,CAAC","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport Popover from \"@ui5/webcomponents/dist/Popover.js\";\nimport PopoverVerticalAlign from \"@ui5/webcomponents/dist/types/PopoverVerticalAlign.js\";\nimport PopoverHorizontalAlign from \"@ui5/webcomponents/dist/types/PopoverHorizontalAlign.js\";\nimport PopupAccessibleRole from \"@ui5/webcomponents/dist/types/PopupAccessibleRole.js\";\n\n// Template\nimport TooltipTemplate from \"./generated/templates/TooltipTemplate.lit.js\";\n\n// Styles\nimport TooltipCss from \"./generated/themes/Tooltip.css\";\n\nexport enum PlacementType {\n  Left = \"Left\",\n  Right = \"Right\",\n  Top = \"Top\",\n  Bottom = \"Bottom\",\n}\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n * <h3>Usage</h3>\n *\n * For the <code>udex-tooltip</code>\n * <h3>ES6 Module Import</h3>\n *\n * <code>import @udex/web-components/dist/Tooltip.js\";</code>\n *\n * @constructor\n * @author SAP SE\n * @extends UI5Element\n * @tagname udex-tooltip\n * @public\n */\n@customElement({\n  tag: \"udex-tooltip\",\n  renderer: litRender,\n  styles: TooltipCss,\n  template: TooltipTemplate,\n  dependencies: [Popover],\n})\nclass UDExTooltip extends UI5Element {\n  /**\n   * Defines the content of the component.\n   *\n   * @slot\n   * @public\n   */\n  @slot({ type: Node }) default!: Node;\n\n  /**\n   * Defines the Tooltip title.\n   *\n   * @default \"\"\n   * @public\n   */\n  @property({ type: String, defaultValue: \"\" }) title!: string;\n\n  /**\n   * Defines if Tooltip has an arrow or not.\n   *\n   * @default false\n   * @public\n   */\n  @property({ type: Boolean })\n    hideArrow!: boolean;\n\n  /**\n   * Determines on which side of the component the Tooltip is displayed.\n   *\n   * @default \"Right\"\n   * @public\n   */\n  @property({ type: PlacementType, defaultValue: PlacementType.Right })\n    placement!: `${PlacementType}`;\n  /**\n   * Determines the horizontal alignment of the component.\n   * @default \"Center\"\n   * @public\n   */\n  @property({ type: PopoverHorizontalAlign, defaultValue: PopoverHorizontalAlign.Center })\n    horizontalAlign!: `${PopoverHorizontalAlign}`;\n\n  /**\n   * Determines the vertical alignment of the component.\n   * @default \"Center\"\n   * @public\n   */\n  @property({ type: PopoverVerticalAlign, defaultValue: PopoverVerticalAlign.Center })\n    verticalAlign!: `${PopoverVerticalAlign}`;\n\n  /**\n   * Defines the accessible name of the component.\n   * @default undefined\n   * @public\n   */\n  @property({ defaultValue: undefined })\n    accessibleName?: string;\n\n  /**\n   * Defines the IDs of the elements that label the component.\n   * @default \"\"\n   * @public\n   */\n  @property({ defaultValue: \"\" })\n    accessibleNameRef!: string;\n\n  /**\n   * Allows setting a custom role.\n   * @default \"Dialog\"\n   * @public\n   */\n  @property({ type: PopupAccessibleRole, defaultValue: PopupAccessibleRole.Dialog })\n    accessibleRole!: `${PopupAccessibleRole}`;\n\n  getPopover() {\n    return this.shadowRoot!.querySelector<Popover>(\n      \"[ui5-popover]\",\n    )!;\n  }\n\n  /** Returns whether the tooltip is currently open.\n   * @public\n   */\n  isOpen(): boolean {\n    const popover = this.getPopover();\n    return popover.isOpen();\n  }\n\n  /**\n   * Used to open tooltip\n   * @param opener element at which the popover is shown\n   * @public\n   */\n  onOpen(opener: HTMLElement): void {\n    const popover = this.getPopover();\n    popover.showAt(opener);\n  }\n\n  /**\n   * Used to close tooltip\n   * @public\n   */\n  onClose(): void {\n    const popover = this.getPopover();\n    popover.close(true);\n  }\n}\n\nUDExTooltip.define();\n\nexport default UDExTooltip;\n"]}
+{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../src/Tooltip.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,UAAU,MAAM,4CAA4C,CAAC;AACpE,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,IAAI,MAAM,iDAAiD,CAAC;AACnE,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,SAAS,MAAM,sDAAsD,CAAC;AAC7E,OAAO,OAAO,MAAM,oCAAoC,CAAC;AACzD,OAAO,oBAAoB,MAAM,uDAAuD,CAAC;AACzF,OAAO,sBAAsB,MAAM,yDAAyD,CAAC;AAC7F,OAAO,mBAAmB,MAAM,sDAAsD,CAAC;AAEvF,WAAW;AACX,OAAO,eAAe,MAAM,8CAA8C,CAAC;AAE3E,SAAS;AACT,OAAO,UAAU,MAAM,gCAAgC,CAAC;AAExD,MAAM,CAAN,IAAY,aAKX;AALD,WAAY,aAAa;IACvB,8BAAa,CAAA;IACb,gCAAe,CAAA;IACf,4BAAW,CAAA;IACX,kCAAiB,CAAA;AACnB,CAAC,EALW,aAAa,KAAb,aAAa,QAKxB;AAED;;;;;;;;;;;;;;;;;GAiBG;AAQH,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,UAAU;IA0ElC,UAAU;QACR,OAAO,IAAI,CAAC,UAAW,CAAC,aAAa,CACnC,eAAe,CACf,CAAC;IACL,CAAC;IAED;;OAEG;IACH,MAAM;QACJ,MAAM,OAAO,GAAG,IAAI,CAAC,UAAU,EAAE,CAAC;QAClC,OAAO,OAAO,CAAC,MAAM,EAAE,CAAC;IAC1B,CAAC;IAED;;;;OAIG;IACH,MAAM,CAAC,MAAmB;QACxB,MAAM,OAAO,GAAG,IAAI,CAAC,UAAU,EAAE,CAAC;QAClC,OAAO,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;IACzB,CAAC;IAED;;;OAGG;IACH,OAAO;QACL,MAAM,OAAO,GAAG,IAAI,CAAC,UAAU,EAAE,CAAC;QAClC,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;IACtB,CAAC;CACF,CAAA;AAnGuB;IAArB,IAAI,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC;4CAAgB;AAQS;IAA7C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,YAAY,EAAE,EAAE,EAAE,CAAC;0CAAgB;AAS3D;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;8CACN;AASpB;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,aAAa,EAAE,YAAY,EAAE,aAAa,CAAC,KAAK,EAAE,CAAC;8CACpC;AAO/B;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,sBAAsB,EAAE,YAAY,EAAE,sBAAsB,CAAC,MAAM,EAAE,CAAC;oDACxC;AAQ9C;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,oBAAoB,EAAE,YAAY,EAAE,oBAAoB,CAAC,MAAM,EAAE,CAAC;kDACxC;AAQ1C;IADD,QAAQ,CAAC,EAAE,YAAY,EAAE,SAAS,EAAE,CAAC;mDACZ;AAQxB;IADD,QAAQ,CAAC,EAAE,YAAY,EAAE,EAAE,EAAE,CAAC;sDACF;AAQ3B;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,mBAAmB,EAAE,YAAY,EAAE,mBAAmB,CAAC,MAAM,EAAE,CAAC;mDACtC;AAxExC,WAAW;IAPhB,aAAa,CAAC;QACb,GAAG,EAAE,cAAc;QACnB,QAAQ,EAAE,SAAS;QACnB,MAAM,EAAE,UAAU;QAClB,QAAQ,EAAE,eAAe;QACzB,YAAY,EAAE,CAAC,OAAO,CAAC;KACxB,CAAC;GACI,WAAW,CA0GhB;AAED,WAAW,CAAC,MAAM,EAAE,CAAC;AAErB,eAAe,WAAW,CAAC","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport Popover from \"@ui5/webcomponents/dist/Popover.js\";\nimport PopoverVerticalAlign from \"@ui5/webcomponents/dist/types/PopoverVerticalAlign.js\";\nimport PopoverHorizontalAlign from \"@ui5/webcomponents/dist/types/PopoverHorizontalAlign.js\";\nimport PopupAccessibleRole from \"@ui5/webcomponents/dist/types/PopupAccessibleRole.js\";\n\n// Template\nimport TooltipTemplate from \"./generated/templates/TooltipTemplate.lit.js\";\n\n// Styles\nimport TooltipCss from \"./generated/themes/Tooltip.css\";\n\nexport enum PlacementType {\n  Left = \"Left\",\n  Right = \"Right\",\n  Top = \"Top\",\n  Bottom = \"Bottom\",\n}\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n * <h3>Usage</h3>\n *\n * For the <code>udex-tooltip</code>\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@udex/web-components/dist/Tooltip.js\";</code>\n *\n * @constructor\n * @author SAP SE\n * @extends UI5Element\n * @tagname udex-tooltip\n * @public\n */\n@customElement({\n  tag: \"udex-tooltip\",\n  renderer: litRender,\n  styles: TooltipCss,\n  template: TooltipTemplate,\n  dependencies: [Popover],\n})\nclass UDExTooltip extends UI5Element {\n  /**\n   * Defines the content of the component.\n   *\n   * @slot\n   * @public\n   */\n  @slot({ type: Node }) default!: Node;\n\n  /**\n   * Defines the Tooltip title.\n   *\n   * @default \"\"\n   * @public\n   */\n  @property({ type: String, defaultValue: \"\" }) title!: string;\n\n  /**\n   * Defines if Tooltip has an arrow or not.\n   *\n   * @default false\n   * @public\n   */\n  @property({ type: Boolean })\n    hideArrow!: boolean;\n\n  /**\n   * Determines on which side of the component the Tooltip is displayed.\n   *\n   * @default \"Right\"\n   * @public\n   */\n  @property({ type: PlacementType, defaultValue: PlacementType.Right })\n    placement!: `${PlacementType}`;\n  /**\n   * Determines the horizontal alignment of the component.\n   * @default \"Center\"\n   * @public\n   */\n  @property({ type: PopoverHorizontalAlign, defaultValue: PopoverHorizontalAlign.Center })\n    horizontalAlign!: `${PopoverHorizontalAlign}`;\n\n  /**\n   * Determines the vertical alignment of the component.\n   * @default \"Center\"\n   * @public\n   */\n  @property({ type: PopoverVerticalAlign, defaultValue: PopoverVerticalAlign.Center })\n    verticalAlign!: `${PopoverVerticalAlign}`;\n\n  /**\n   * Defines the accessible name of the component.\n   * @default undefined\n   * @public\n   */\n  @property({ defaultValue: undefined })\n    accessibleName?: string;\n\n  /**\n   * Defines the IDs of the elements that label the component.\n   * @default \"\"\n   * @public\n   */\n  @property({ defaultValue: \"\" })\n    accessibleNameRef!: string;\n\n  /**\n   * Allows setting a custom role.\n   * @default \"Dialog\"\n   * @public\n   */\n  @property({ type: PopupAccessibleRole, defaultValue: PopupAccessibleRole.Dialog })\n    accessibleRole!: `${PopupAccessibleRole}`;\n\n  getPopover() {\n    return this.shadowRoot!.querySelector<Popover>(\n      \"[ui5-popover]\",\n    )!;\n  }\n\n  /** Returns whether the tooltip is currently open.\n   * @public\n   */\n  isOpen(): boolean {\n    const popover = this.getPopover();\n    return popover.isOpen();\n  }\n\n  /**\n   * Used to open tooltip\n   * @param opener element at which the popover is shown\n   * @public\n   */\n  onOpen(opener: HTMLElement): void {\n    const popover = this.getPopover();\n    popover.showAt(opener);\n  }\n\n  /**\n   * Used to close tooltip\n   * @public\n   */\n  onClose(): void {\n    const popover = this.getPopover();\n    popover.close(true);\n  }\n}\n\nUDExTooltip.define();\n\nexport default UDExTooltip;\n"]}

package/dist/TruncatedText.js

@@ -40,7 +40,7 @@ let UDExTruncatedText = UDExTruncatedText_1 = class UDExTruncatedText extends UI
         super();
     }
     static async onDefine() {
-        UDExTruncatedText_1.i18nBundle = await getI18nBundle("sap-ui-webcomponents-bundle");
+        UDExTruncatedText_1.i18nBundle = await getI18nBundle("@udex/web-components");
     }
     get visibleText() {
         return this.initiallyExpanded ? `${this.text} ` : this.truncatedText;

package/dist/TruncatedText.js.map

@@ -1 +1 @@
-{"version":3,"file":"TruncatedText.js","sourceRoot":"","sources":["../src/TruncatedText.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport Integer from \"@ui5/webcomponents-base/dist/types/Integer.js\";\nimport I18nBundle, { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport { READ_LESS, READ_MORE } from \"./generated/i18n/i18n-defaults.js\";\n\n// Template\nimport TruncatedTextTemplate from \"./generated/templates/TruncatedTextTemplate.lit.js\";\n\n// Styles\nimport TruncatedTextCss from \"./generated/themes/TruncatedText.css.js\";\nimport UDExButton from \"./Button.js\";\n\nexport enum ErrorVariableName {\n  charLimit = \"char-limit\"\n}\n\nconst ellipsisSymbols = \"...\";\nconst lineEndRegExp = new RegExp(/($)|([,.]+)$|([,.]+)?\\s+(\\S*)$/);\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n * The <code> udex-truncated-text </code> component is a component used to limit and toggle text visibility.\n *\n * @constructor\n * @extends UI5Element\n * @tagname udex-truncated-text\n * @public\n */\n@customElement({\n  tag: \"udex-truncated-text\",\n  renderer: litRender,\n  styles: TruncatedTextCss,\n  template: TruncatedTextTemplate,\n  dependencies: [UDExButton],\n})\n\nclass UDExTruncatedText extends UI5Element {\n  /**\n  * Defines if the text is initially expanded.\n  *\n  * @public\n  */\n  @property({ type: Boolean })\n    initiallyExpanded!: boolean;\n\n  /**\n   * Defines direction of the text.\n   *\n   * @private\n   */\n  @property({ type: String })\n    _direction?: string;\n\n  /**\n  * Indicates the element text\n  *\n  * @public\n  */\n  @property({ type: String })\n    text!: string;\n\n  /**\n  * Indicates the limit for chars\n  *\n  * @public\n  * @default 150\n  */\n  @property({ defaultValue: 150, type: Integer })\n    charLimit!: Integer;\n\n  static i18nBundle: I18nBundle;\n\n  constructor() {\n    super();\n  }\n\n  static async onDefine() {\n    UDExTruncatedText.i18nBundle = await getI18nBundle(\"sap-ui-webcomponents-bundle\");\n  }\n\n  get visibleText() {\n    return this.initiallyExpanded ? `${this.text} ` : this.truncatedText;\n  }\n\n  get truncatedText() {\n    return this.text.substring(0, this.cropAfter()).replace(lineEndRegExp, ellipsisSymbols);\n  }\n\n  get buttonLabel() {\n    return this.initiallyExpanded\n      ? UDExTruncatedText.i18nBundle.getText(READ_LESS)\n      : UDExTruncatedText.i18nBundle.getText(READ_MORE);\n  }\n\n  get validatedCharLimit() {\n    return (Number(this.charLimit) < 0) ? 0 : this.charLimit;\n  }\n\n  onBeforeRendering(): void {\n    this.validateVariables(ErrorVariableName.charLimit, Number(this.charLimit));\n  }\n\n  cropAfter(): number {\n    return this.text.substring(0, Number(this.validatedCharLimit)).trim().length;\n  }\n\n  validateVariables(name: string, value: number): void {\n    if (value < 0) {\n      console.warn(`The variable ${name} cannot take a negative value`);\n    }\n  }\n\n  onToggleClick(): void {\n    this.initiallyExpanded = !this.initiallyExpanded;\n  }\n}\n\nUDExTruncatedText.define();\n\nexport default UDExTruncatedText;\n"]}
+{"version":3,"file":"TruncatedText.js","sourceRoot":"","sources":["../src/TruncatedText.ts"],"names":[],"mappings":";;;;;;;AAAA,OAAO,UAAU,MAAM,4CAA4C,CAAC;AACpE,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,SAAS,MAAM,sDAAsD,CAAC;AAC7E,OAAO,OAAO,MAAM,+CAA+C,CAAC;AACpE,OAAmB,EAAE,aAAa,EAAE,MAAM,4CAA4C,CAAC;AACvF,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,mCAAmC,CAAC;AAEzE,WAAW;AACX,OAAO,qBAAqB,MAAM,oDAAoD,CAAC;AAEvF,SAAS;AACT,OAAO,gBAAgB,MAAM,yCAAyC,CAAC;AACvE,OAAO,UAAU,MAAM,aAAa,CAAC;AAErC,MAAM,CAAN,IAAY,iBAEX;AAFD,WAAY,iBAAiB;IAC3B,6CAAwB,CAAA;AAC1B,CAAC,EAFW,iBAAiB,KAAjB,iBAAiB,QAE5B;AAED,MAAM,eAAe,GAAG,KAAK,CAAC;AAC9B,MAAM,aAAa,GAAG,IAAI,MAAM,CAAC,gCAAgC,CAAC,CAAC;AAEnE;;;;;;;;;;;GAWG;AASH,IAAM,iBAAiB,yBAAvB,MAAM,iBAAkB,SAAQ,UAAU;IAoCxC;QACE,KAAK,EAAE,CAAC;IACV,CAAC;IAED,MAAM,CAAC,KAAK,CAAC,QAAQ;QACnB,mBAAiB,CAAC,UAAU,GAAG,MAAM,aAAa,CAAC,sBAAsB,CAAC,CAAC;IAC7E,CAAC;IAED,IAAI,WAAW;QACb,OAAO,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,CAAC;IACvE,CAAC;IAED,IAAI,aAAa;QACf,OAAO,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,EAAE,IAAI,CAAC,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,aAAa,EAAE,eAAe,CAAC,CAAC;IAC1F,CAAC;IAED,IAAI,WAAW;QACb,OAAO,IAAI,CAAC,iBAAiB;YAC3B,CAAC,CAAC,mBAAiB,CAAC,UAAU,CAAC,OAAO,CAAC,SAAS,CAAC;YACjD,CAAC,CAAC,mBAAiB,CAAC,UAAU,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;IACtD,CAAC;IAED,IAAI,kBAAkB;QACpB,OAAO,CAAC,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC;IAC3D,CAAC;IAED,iBAAiB;QACf,IAAI,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,SAAS,EAAE,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC;IAC9E,CAAC;IAED,SAAS;QACP,OAAO,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,EAAE,MAAM,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC,MAAM,CAAC;IAC/E,CAAC;IAED,iBAAiB,CAAC,IAAY,EAAE,KAAa;QAC3C,IAAI,KAAK,GAAG,CAAC,EAAE;YACb,OAAO,CAAC,IAAI,CAAC,gBAAgB,IAAI,+BAA+B,CAAC,CAAC;SACnE;IACH,CAAC;IAED,aAAa;QACX,IAAI,CAAC,iBAAiB,GAAG,CAAC,IAAI,CAAC,iBAAiB,CAAC;IACnD,CAAC;CACF,CAAA;AAxEG;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;4DACE;AAQ5B;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;qDACL;AAQpB;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;+CACX;AASd;IADD,QAAQ,CAAC,EAAE,YAAY,EAAE,GAAG,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;oDACzB;AAhClB,iBAAiB;IARtB,aAAa,CAAC;QACb,GAAG,EAAE,qBAAqB;QAC1B,QAAQ,EAAE,SAAS;QACnB,MAAM,EAAE,gBAAgB;QACxB,QAAQ,EAAE,qBAAqB;QAC/B,YAAY,EAAE,CAAC,UAAU,CAAC;KAC3B,CAAC;GAEI,iBAAiB,CA+EtB;AAED,iBAAiB,CAAC,MAAM,EAAE,CAAC;AAE3B,eAAe,iBAAiB,CAAC","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport Integer from \"@ui5/webcomponents-base/dist/types/Integer.js\";\nimport I18nBundle, { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport { READ_LESS, READ_MORE } from \"./generated/i18n/i18n-defaults.js\";\n\n// Template\nimport TruncatedTextTemplate from \"./generated/templates/TruncatedTextTemplate.lit.js\";\n\n// Styles\nimport TruncatedTextCss from \"./generated/themes/TruncatedText.css.js\";\nimport UDExButton from \"./Button.js\";\n\nexport enum ErrorVariableName {\n  charLimit = \"char-limit\"\n}\n\nconst ellipsisSymbols = \"...\";\nconst lineEndRegExp = new RegExp(/($)|([,.]+)$|([,.]+)?\\s+(\\S*)$/);\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n * The <code> udex-truncated-text </code> component is a component used to limit and toggle text visibility.\n *\n * @constructor\n * @extends UI5Element\n * @tagname udex-truncated-text\n * @public\n */\n@customElement({\n  tag: \"udex-truncated-text\",\n  renderer: litRender,\n  styles: TruncatedTextCss,\n  template: TruncatedTextTemplate,\n  dependencies: [UDExButton],\n})\n\nclass UDExTruncatedText extends UI5Element {\n  /**\n  * Defines if the text is initially expanded.\n  *\n  * @public\n  */\n  @property({ type: Boolean })\n    initiallyExpanded!: boolean;\n\n  /**\n   * Defines direction of the text.\n   *\n   * @private\n   */\n  @property({ type: String })\n    _direction?: string;\n\n  /**\n  * Indicates the element text\n  *\n  * @public\n  */\n  @property({ type: String })\n    text!: string;\n\n  /**\n  * Indicates the limit for chars\n  *\n  * @public\n  * @default 150\n  */\n  @property({ defaultValue: 150, type: Integer })\n    charLimit!: Integer;\n\n  static i18nBundle: I18nBundle;\n\n  constructor() {\n    super();\n  }\n\n  static async onDefine() {\n    UDExTruncatedText.i18nBundle = await getI18nBundle(\"@udex/web-components\");\n  }\n\n  get visibleText() {\n    return this.initiallyExpanded ? `${this.text} ` : this.truncatedText;\n  }\n\n  get truncatedText() {\n    return this.text.substring(0, this.cropAfter()).replace(lineEndRegExp, ellipsisSymbols);\n  }\n\n  get buttonLabel() {\n    return this.initiallyExpanded\n      ? UDExTruncatedText.i18nBundle.getText(READ_LESS)\n      : UDExTruncatedText.i18nBundle.getText(READ_MORE);\n  }\n\n  get validatedCharLimit() {\n    return (Number(this.charLimit) < 0) ? 0 : this.charLimit;\n  }\n\n  onBeforeRendering(): void {\n    this.validateVariables(ErrorVariableName.charLimit, Number(this.charLimit));\n  }\n\n  cropAfter(): number {\n    return this.text.substring(0, Number(this.validatedCharLimit)).trim().length;\n  }\n\n  validateVariables(name: string, value: number): void {\n    if (value < 0) {\n      console.warn(`The variable ${name} cannot take a negative value`);\n    }\n  }\n\n  onToggleClick(): void {\n    this.initiallyExpanded = !this.initiallyExpanded;\n  }\n}\n\nUDExTruncatedText.define();\n\nexport default UDExTruncatedText;\n"]}