@sapudex/web-components 2.47.0 → 2.48.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (107) hide show
  1. package/cypress/specs/DatePicker.cy.tsx +62 -0
  2. package/cypress/specs/Tag.cy.tsx +34 -3
  3. package/cypress/specs/TextField.cy.tsx +68 -0
  4. package/dist/Carousel.d.ts +48 -3
  5. package/dist/Carousel.js +149 -7
  6. package/dist/Carousel.js.map +1 -1
  7. package/dist/CarouselTemplate.js +9 -2
  8. package/dist/CarouselTemplate.js.map +1 -1
  9. package/dist/DatePicker.d.ts +5 -0
  10. package/dist/DatePicker.js +10 -0
  11. package/dist/DatePicker.js.map +1 -1
  12. package/dist/DatePickerTemplate.js +1 -1
  13. package/dist/DatePickerTemplate.js.map +1 -1
  14. package/dist/Tag.js +3 -2
  15. package/dist/Tag.js.map +1 -1
  16. package/dist/TagTemplate.js +2 -2
  17. package/dist/TagTemplate.js.map +1 -1
  18. package/dist/TextField.d.ts +12 -0
  19. package/dist/TextField.js +15 -0
  20. package/dist/TextField.js.map +1 -1
  21. package/dist/TextFieldTemplate.js +1 -1
  22. package/dist/TextFieldTemplate.js.map +1 -1
  23. package/dist/assets/{InputSuggestions-CbKVAumI.js → InputSuggestions-BcK6O4Bk.js} +1 -1
  24. package/dist/assets/{ListItemStandardExpandableTextTemplate-C3-WJZBS.js → ListItemStandardExpandableTextTemplate-u600dmHC.js} +1 -1
  25. package/dist/assets/{bundle.esm-D8jQybCx.js → bundle.esm-C6Ie2WeI.js} +230 -230
  26. package/dist/assets/messagebundle_en-DoNTK1BE.js +1 -0
  27. package/dist/assets/messagebundle_pl-CsXeN1y6.js +1 -0
  28. package/dist/assets/messagebundle_pt_PT-CQ5YAsmx.js +1 -0
  29. package/dist/css/themes/Carousel.css +1 -1
  30. package/dist/css/themes/MastheadItem.css +1 -1
  31. package/dist/css/themes/MastheadProfileMenu.css +1 -1
  32. package/dist/css/themes/Table.css +1 -1
  33. package/dist/css/themes/TableCell.css +1 -1
  34. package/dist/css/themes/TableGroupRow.css +1 -1
  35. package/dist/css/themes/TableHeaderCell.css +1 -1
  36. package/dist/css/themes/Tag.css +1 -1
  37. package/dist/custom-elements-internal.json +85 -0
  38. package/dist/custom-elements.json +71 -0
  39. package/dist/generated/assets/i18n/messagebundle_en.json +1 -1
  40. package/dist/generated/assets/i18n/messagebundle_pl.json +1 -1
  41. package/dist/generated/assets/i18n/messagebundle_pt_PT.json +1 -1
  42. package/dist/generated/i18n/i18n-defaults.d.ts +3 -1
  43. package/dist/generated/i18n/i18n-defaults.js +3 -1
  44. package/dist/generated/i18n/i18n-defaults.js.map +1 -1
  45. package/dist/generated/themes/Carousel.css.d.ts +1 -1
  46. package/dist/generated/themes/Carousel.css.js +1 -1
  47. package/dist/generated/themes/Carousel.css.js.map +1 -1
  48. package/dist/generated/themes/MastheadItem.css.d.ts +1 -1
  49. package/dist/generated/themes/MastheadItem.css.js +1 -1
  50. package/dist/generated/themes/MastheadItem.css.js.map +1 -1
  51. package/dist/generated/themes/MastheadProfileMenu.css.d.ts +1 -1
  52. package/dist/generated/themes/MastheadProfileMenu.css.js +1 -1
  53. package/dist/generated/themes/MastheadProfileMenu.css.js.map +1 -1
  54. package/dist/generated/themes/Table.css.d.ts +1 -1
  55. package/dist/generated/themes/Table.css.js +1 -1
  56. package/dist/generated/themes/Table.css.js.map +1 -1
  57. package/dist/generated/themes/TableCell.css.d.ts +1 -1
  58. package/dist/generated/themes/TableCell.css.js +1 -1
  59. package/dist/generated/themes/TableCell.css.js.map +1 -1
  60. package/dist/generated/themes/TableGroupRow.css.d.ts +1 -1
  61. package/dist/generated/themes/TableGroupRow.css.js +1 -1
  62. package/dist/generated/themes/TableGroupRow.css.js.map +1 -1
  63. package/dist/generated/themes/TableHeaderCell.css.d.ts +1 -1
  64. package/dist/generated/themes/TableHeaderCell.css.js +1 -1
  65. package/dist/generated/themes/TableHeaderCell.css.js.map +1 -1
  66. package/dist/generated/themes/Tag.css.d.ts +1 -1
  67. package/dist/generated/themes/Tag.css.js +1 -1
  68. package/dist/generated/themes/Tag.css.js.map +1 -1
  69. package/dist/messagebundle.properties +3 -0
  70. package/dist/messagebundle_en.properties +2 -0
  71. package/dist/messagebundle_pl.properties +134 -1
  72. package/dist/messagebundle_pt_PT.properties +126 -1
  73. package/dist/vscode.html-custom-data.json +16 -1
  74. package/dist/web-types.json +40 -2
  75. package/package.json +1 -1
  76. package/src/Carousel.ts +180 -9
  77. package/src/CarouselTemplate.tsx +66 -27
  78. package/src/DatePicker.ts +9 -0
  79. package/src/DatePickerTemplate.tsx +2 -1
  80. package/src/Tag.ts +3 -2
  81. package/src/TagTemplate.tsx +2 -0
  82. package/src/TextField.ts +26 -1
  83. package/src/TextFieldTemplate.tsx +1 -0
  84. package/src/generated/i18n/i18n-defaults.ts +2 -2
  85. package/src/generated/themes/Carousel.css.ts +1 -1
  86. package/src/generated/themes/MastheadItem.css.ts +1 -1
  87. package/src/generated/themes/MastheadProfileMenu.css.ts +1 -1
  88. package/src/generated/themes/Table.css.ts +1 -1
  89. package/src/generated/themes/TableCell.css.ts +1 -1
  90. package/src/generated/themes/TableGroupRow.css.ts +1 -1
  91. package/src/generated/themes/TableHeaderCell.css.ts +1 -1
  92. package/src/generated/themes/Tag.css.ts +1 -1
  93. package/src/i18n/messagebundle.properties +3 -0
  94. package/src/i18n/messagebundle_en.properties +2 -0
  95. package/src/i18n/messagebundle_pl.properties +134 -1
  96. package/src/i18n/messagebundle_pt_PT.properties +126 -1
  97. package/src/themes/Carousel.css +20 -8
  98. package/src/themes/MastheadItem.css +7 -4
  99. package/src/themes/MastheadProfileMenu.css +0 -13
  100. package/src/themes/Table.css +1 -1
  101. package/src/themes/TableCell.css +3 -3
  102. package/src/themes/TableGroupRow.css +1 -1
  103. package/src/themes/TableHeaderCell.css +3 -4
  104. package/src/themes/Tag.css +24 -0
  105. package/dist/assets/messagebundle_en-BZqDcZHN.js +0 -1
  106. package/dist/assets/messagebundle_pl-BmaELnDD.js +0 -1
  107. package/dist/assets/messagebundle_pt_PT-DcVh6BH6.js +0 -1
@@ -136,6 +136,11 @@ declare class UDExDatePicker extends DateComponentBase {
136
136
  * @private
137
137
  */
138
138
  _tempValue: string;
139
+ /**
140
+ * Tracks whether the calendar popover is currently open, used to reflect aria-expanded on the control button.
141
+ * @private
142
+ */
143
+ _isPopoverOpen: boolean;
139
144
  static i18nBundle: I18nBundle;
140
145
  responsivePopover?: UDExDropdown;
141
146
  private _getCurrentFormat;
@@ -88,6 +88,11 @@ let UDExDatePicker = UDExDatePicker_1 = class UDExDatePicker extends DateCompone
88
88
  */
89
89
  this.valueState = UDExValueState.Standard;
90
90
  this.formatPattern = UDExDatePicker_1.DEFAULT_FORMAT_PATTERN;
91
+ /**
92
+ * Tracks whether the calendar popover is currently open, used to reflect aria-expanded on the control button.
93
+ * @private
94
+ */
95
+ this._isPopoverOpen = false;
91
96
  }
92
97
  _getCurrentFormat() { return this.getFormat(); }
93
98
  _getResponsePopover() {
@@ -101,12 +106,14 @@ let UDExDatePicker = UDExDatePicker_1 = class UDExDatePicker extends DateCompone
101
106
  return this.shadowRoot.querySelector("[udex-text-field]");
102
107
  }
103
108
  _afterDropdownClose() {
109
+ this._isPopoverOpen = false;
104
110
  this._dropdownTrigger.active = false;
105
111
  this._dropdownTrigger.iconActive = false;
106
112
  this._dropdownTrigger.shadowRoot?.querySelector("input")?.blur();
107
113
  this._tempValue = "";
108
114
  }
109
115
  _afterDropdownOpen() {
116
+ this._isPopoverOpen = true;
110
117
  this._dropdownTrigger.iconActive = true;
111
118
  }
112
119
  _closeRespPopover() {
@@ -417,6 +424,9 @@ __decorate([
417
424
  __decorate([
418
425
  property()
419
426
  ], UDExDatePicker.prototype, "_tempValue", void 0);
427
+ __decorate([
428
+ property({ type: Boolean, noAttribute: true })
429
+ ], UDExDatePicker.prototype, "_isPopoverOpen", void 0);
420
430
  __decorate([
421
431
  i18n("@sapudex/web-components")
422
432
  ], UDExDatePicker, "i18nBundle", void 0);
@@ -1 +1 @@
1
- {"version":3,"file":"DatePicker.js","sourceRoot":"","sources":["../src/DatePicker.ts"],"names":[],"mappings":"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","sourcesContent":["import DateComponentBase from \"@ui5/webcomponents/dist/DateComponentBase.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport type { CalendarSelectionChangeEventDetail } from \"@ui5/webcomponents/dist/Calendar.js\";\nimport \"@ui5/webcomponents/dist/Icon.js\";\nimport \"@ui5/webcomponents-icons/dist/appointment-2.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type DateFormat from \"@ui5/webcomponents-localization/dist/DateFormat.js\";\nimport { CALENDAR_ICON, DATEPICKER_DATE_DESCRIPTION } from \"./generated/i18n/i18n-defaults.js\";\nimport type UDExTextField from \"./TextField.js\";\nimport type UDExDropdown from \"./Dropdown.js\";\nimport UDExValueState from \"./types/common.js\";\nimport translate from \"./utils/translate.js\";\nimport DatePickerTemplate from \"./DatePickerTemplate.js\";\nimport DatePickerCss from \"./generated/themes/DatePicker.css.js\";\nimport DatePickerPopoverCss from \"./generated/themes/DatePickerPopover.css.js\";\n\n// DateFormat's published type declaration omits the runtime parse/format methods\n// and the oFormatOptions property (they come from the underlying SAP core type).\n// This intersection adds the missing members without widening to `any`.\ntype DateFormatFull = DateFormat & {\n parse(value: string, utc?: boolean): Date | null;\n format(date: Date, utc?: boolean): string;\n oFormatOptions: { pattern?: string };\n};\n\nexport enum UDExDatePickerSelectionMode {\n Single = \"Single\",\n Range = \"Range\",\n}\n\ntype UDExDatePickerSelectionChangeEventDetail = {\n selectedValues: Array<string>;\n selectedDates: Array<number | undefined>;\n timestamp: number | undefined;\n};\n\ntype UDExDatePickerValueStateChangeEventDetail = {\n valueState: `${UDExValueState}`,\n valid: boolean\n}\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n *\n * <h3>Usage</h3>\n *\n * For the <code>udex-date-picker</code>\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@sapudex/web-components/dist/DatePicker.js\";</code>\n *\n * @constructor\n * @author SAP SE\n * @extends DateComponentBase\n * @tagname udex-date-picker\n * @public\n */\n@customElement({\n tag: \"udex-date-picker\",\n renderer: jsxRenderer,\n styles: [DatePickerCss, DatePickerPopoverCss],\n template: DatePickerTemplate,\n})\n/**\n * Fired when the selected dates change.\n *\n * @allowPreventDefault\n * @param {Array<string>} selectedValues The selected dates\n * @param {Array<number>} selectedDates The selected dates as UTC timestamps\n * @param {number} timestamp The last selected date as UTC timestamp\n * @public\n */\n@event(\"selection-change\", { cancelable: true, bubbles: true })\n\n/**\n * Fired before the value state of the component is updated internally.\n * The event is preventable, meaning that if it's default action is\n * prevented, the component will not update the value state.\n * @allowPreventDefault\n * @public\n * @param {UDExValueState} valueState The new `UDExValueState` that will be set.\n * @param {boolean} valid Indicator if the value is in between the min and max value.\n */\n@event(\"value-state-change\", { bubbles: true })\n\nclass UDExDatePicker extends DateComponentBase {\n eventDetails!: {\n \"selection-change\": UDExDatePickerSelectionChangeEventDetail,\n \"value-state-change\": UDExDatePickerValueStateChangeEventDetail,\n };\n /**\n * Defines selection mode of the calendar component.\n *\n * @default \"Single\"\n * @public\n */\n @property()\n selectionMode: `${UDExDatePickerSelectionMode}` = \"Single\";\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 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 supporting text under the input field.\n *\n * @default \"\"\n * @public\n */\n @property({ type: String })\n supportingText: string = \"\";\n\n /**\n * Defines the value of the input.\n *\n * @default \"\"\n * @public\n */\n @property({ type: String })\n value: string = \"\";\n\n /**\n * Sets the accessible ARIA name of the component.\n *\n * @default undefined\n * @public\n */\n @property({ type: String })\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()\n accessibleNameRef: string = \"\";\n\n /**\n * Defines label text for the input field.\n *\n * @default undefined\n * @public\n */\n @property({ type: String })\n label?: string;\n\n /**\n * Defines selected dates values.\n *\n * @default \"\"\n * @private\n */\n @property({ type: String, noAttribute: true })\n selectedDates: string = \"\";\n\n /**\n * Defines the value state of the component.\n *\n * @default \"Standard\"\n * @public\n */\n @property()\n valueState: `${UDExValueState}` = UDExValueState.Standard;\n\n /**\n * Defines the date format pattern (e.g., \\\"MMM dd, yyyy\\\" or \\\"MM/dd/yyyy\\\").\n * @default \"MMM dd, yyyy\"\n * @public\n */\n static readonly DEFAULT_FORMAT_PATTERN = \"MMM dd, yyyy\";\n\n @property({ type: String })\n formatPattern: string = UDExDatePicker.DEFAULT_FORMAT_PATTERN;\n\n /**\n * The first date in the range during selection (this is a temporary value, not the first date in the value range)\n * @private\n */\n @property()\n _tempValue!: string;\n\n @i18n(\"@sapudex/web-components\")\n static i18nBundle: I18nBundle;\n\n responsivePopover?: UDExDropdown;\n\n private _getCurrentFormat(): DateFormatFull { return this.getFormat() as DateFormatFull; }\n\n private _prevDelimiter!: string | null;\n\n _getResponsePopover(): UDExDropdown {\n return this.shadowRoot!.querySelector<UDExDropdown>(`#udex-${this.__id!}-calendar__popover`)!;\n }\n\n /**\n * Getter for the interactive element that opens the overflow\n * @private\n */\n get _dropdownTrigger(): UDExTextField {\n return this.shadowRoot!.querySelector<UDExTextField>(\"[udex-text-field]\")!;\n }\n\n _afterDropdownClose(): void {\n this._dropdownTrigger.active = false;\n this._dropdownTrigger.iconActive = false;\n this._dropdownTrigger.shadowRoot?.querySelector(\"input\")?.blur();\n this._tempValue = \"\";\n }\n\n _afterDropdownOpen(): void {\n this._dropdownTrigger.iconActive = true;\n }\n\n _closeRespPopover(): void {\n if (this.responsivePopover) {\n this.responsivePopover.open = false;\n }\n }\n\n _openRespPopover(): void {\n this._dropdownTrigger.active = true;\n this.responsivePopover = this._getResponsePopover();\n this.responsivePopover.opener = this._dropdownTrigger._inputHolder;\n this.responsivePopover.open = true;\n }\n\n hideCalendar(): void {\n this._closeRespPopover();\n }\n\n showCalendar(): void {\n this._openRespPopover();\n }\n\n handleCalendarChange(e: CustomEvent<CalendarSelectionChangeEventDetail>): void {\n e.preventDefault();\n if (this.selectionMode === UDExDatePickerSelectionMode.Single) {\n const newValue = e.detail.selectedValues && e.detail.selectedValues[0];\n this._updateValueAndFireDecoratorEvents(newValue, true, e);\n }\n\n if (this.selectionMode === UDExDatePickerSelectionMode.Range) {\n const values = e.detail.selectedValues;\n\n if (values.length === 0) {\n return;\n }\n\n if (values.length === 1) { // Do nothing until the user selects 2 dates, we don't change any state at all for one date\n this._tempValue = values[0];\n return;\n }\n\n const newValue = this._buildValue(e.detail.selectedDates[0], e.detail.selectedDates[1]);\n this._updateValueAndFireDecoratorEvents(newValue, true, e);\n }\n\n this.hideCalendar();\n }\n\n get _effectiveDelimiter(): string {\n return \"-\";\n }\n\n _getInput(): HTMLInputElement | null | undefined {\n return this._dropdownTrigger.shadowRoot?.querySelector(\"input\");\n }\n\n _splitValueByDelimiter(value: string) {\n const valuesArray: Array<string> = [];\n const partsArray = value.split(this._prevDelimiter || this._effectiveDelimiter);\n\n // if format successfully parse the value, the value contains only single date\n if (this._getCurrentFormat().parse(value)) {\n valuesArray[0] = partsArray.join(this._effectiveDelimiter);\n valuesArray[1] = \"\";\n\n return valuesArray;\n }\n\n valuesArray[0] = partsArray.slice(0, partsArray.length / 2).join(this._effectiveDelimiter);\n valuesArray[1] = partsArray.slice(partsArray.length / 2).join(this._effectiveDelimiter);\n\n return valuesArray;\n }\n\n /**\n * Returns a UTC timestamp, representing the last date in the value string or undefined if the value is empty or there is just one date\n * @private\n */\n _extractLastTimestamp(value: string) {\n if (!value || !this._checkValueValidity(value)) {\n return undefined;\n }\n\n const dateStrings = this._splitValueByDelimiter(value);\n if (dateStrings[1]) {\n const parsedDate = this._getCurrentFormat().parse(dateStrings[1], true) as Date;\n return parsedDate.getTime() / 1000;\n }\n\n return undefined;\n }\n\n /**\n * Returns a UTC timestamp, representing the first date in the value string or undefined if the value is empty\n * @private\n */\n _extractFirstTimestamp(value: string) {\n if (!value || !this._checkValueValidity(value)) {\n return undefined;\n }\n\n const dateStrings = this._splitValueByDelimiter(value); // at least one item guaranteed due to the checks above (non-empty and valid)\n\n const parsedDate = this._getCurrentFormat().parse(dateStrings[0], true) as Date;\n return parsedDate.getTime() / 1000;\n }\n\n /**\n * Checks if a value is valid against the current date format of the DatePicker.\n * @public\n * @param value A value to be tested against the current date format\n */\n isValid(value: string): boolean {\n if (value === \"\" || value === undefined) {\n return true;\n }\n\n return !!this._getCurrentFormat().parse(value);\n }\n\n isValidRange(value: string): boolean {\n const parts = this._splitValueByDelimiter(value);\n return parts.length <= 2 && parts.every(dateString => this.isValid(dateString)); // must be at most 2 dates and each must be valid\n }\n\n isInValidRange(value: string): boolean {\n if (value === \"\" || value === undefined) {\n return true;\n }\n\n const calendarDate = this._getCalendarDateFromString(value);\n\n if (!calendarDate || !this._minDate || !this._maxDate) {\n return false;\n }\n\n return calendarDate.valueOf() >= this._minDate.valueOf() && calendarDate.valueOf() <= this._maxDate.valueOf();\n }\n\n /**\n * Checks if a date is between the minimum and maximum date.\n * @public\n * @param value A value to be checked\n */\n isInValidRangeRange(value: string): boolean {\n return this._splitValueByDelimiter(value).every(dateString => this.isInValidRange(dateString));\n }\n\n _checkValueValidity(value: string): boolean {\n let result = false;\n if (value === \"\") {\n return true;\n }\n if (this.selectionMode === UDExDatePickerSelectionMode.Single) {\n result = this.isValid(value) && this.isInValidRange(value);\n }\n if (this.selectionMode === UDExDatePickerSelectionMode.Range) {\n result = this.isValidRange(value) && this.isInValidRangeRange(value);\n }\n return result;\n }\n\n /**\n * Builds a string value out of two UTC timestamps - this method is the counterpart to _extractFirstTimestamp/_extractLastTimestamp\n * @private\n */\n _buildValue(firstDateTimestamp: number | undefined, lastDateTimestamp: number | undefined) {\n this._prevDelimiter = this._effectiveDelimiter;\n if (firstDateTimestamp) {\n const firstDateString = this._getStringFromTimestamp(firstDateTimestamp * 1000);\n\n if (!lastDateTimestamp) {\n return firstDateString;\n }\n\n const lastDateString = this._getStringFromTimestamp(lastDateTimestamp * 1000);\n return `${firstDateString} ${this._effectiveDelimiter} ${lastDateString}`;\n }\n\n return \"\";\n }\n\n /**\n * The parser understands many formats, but we need one format OR extract both dates as timestamps, flip if necessary, and build (which will use the desired format so we enforce the format too)\n * @protected\n */\n normalizeValue(value: string) {\n let result = \"\";\n if (this.selectionMode === UDExDatePickerSelectionMode.Single) {\n if (value === \"\") {\n return value;\n }\n result = this._getCurrentFormat().format(this._getCurrentFormat().parse(value, true) as Date, true); // it is important to both parse and format the date as UTC\n }\n if (this.selectionMode === UDExDatePickerSelectionMode.Range) {\n const firstDateTimestamp = this._extractFirstTimestamp(value);\n const lastDateTimestamp = this._extractLastTimestamp(value);\n if (firstDateTimestamp && lastDateTimestamp && firstDateTimestamp > lastDateTimestamp) { // if both are timestamps (not undefined), flip if necessary\n return this._buildValue(lastDateTimestamp, firstDateTimestamp);\n }\n result = this._buildValue(firstDateTimestamp, lastDateTimestamp);\n }\n return result;\n }\n\n _updateValueState() {\n const valid = this._checkValueValidity(this.value);\n const previousValueState = this.valueState;\n\n this.valueState = valid ? UDExValueState.Standard : UDExValueState.Error;\n\n const eventPrevented = !this.fireDecoratorEvent(\"value-state-change\", { valueState: this.valueState, valid });\n\n if (eventPrevented) {\n this.valueState = previousValueState;\n }\n }\n\n _buildEventData(value: string): UDExDatePickerSelectionChangeEventDetail {\n if (this.selectionMode === UDExDatePickerSelectionMode.Range) {\n return {\n selectedDates: [this._extractFirstTimestamp(value), this._extractLastTimestamp(value)],\n selectedValues: this._splitValueByDelimiter(this.value),\n timestamp: this._extractLastTimestamp(value),\n };\n }\n return {\n selectedDates: [this._extractFirstTimestamp(value)],\n selectedValues: [value],\n timestamp: this._extractFirstTimestamp(value),\n };\n }\n\n _updateValueAndFireDecoratorEvents(value: string, normalizeValue: boolean, e?: CustomEvent | null) {\n const valid = this._checkValueValidity(value);\n\n if (valid && normalizeValue) {\n value = this.normalizeValue(value); // transform valid values (in any format) to the correct format\n }\n\n this.value = value;\n this._updateValueState(); // Change the value state to Error/None, but only if needed\n\n if (!valid) { return; }\n\n if (e) {\n const { selectedDates, timestamp, selectedValues } = e.detail;\n\n this.fireDecoratorEvent(\n \"selection-change\",\n {\n timestamp,\n selectedDates,\n selectedValues,\n },\n );\n } else {\n this.fireDecoratorEvent(\n \"selection-change\",\n this._buildEventData(value),\n );\n }\n }\n\n _onInputChange(e: Event) {\n this._updateValueAndFireDecoratorEvents((e.target as UDExTextField).value, true);\n }\n\n handleInputClick(e: CustomEvent<void>): void {\n e.preventDefault();\n\n if (this.disabled || this.readonly) {\n return;\n }\n\n if (this.responsivePopover?.open) {\n this.hideCalendar();\n } else {\n this.showCalendar();\n }\n }\n\n /**\n * Used to provide selectedDates to the calendar based on the component's state\n * Override in derivatives to provide different rules for setting the calendar's selected dates\n * @protected\n */\n get _calendarSelectedDates(): Array<string> {\n if (this._tempValue) {\n return [this._tempValue];\n }\n\n if (this.value && this._checkValueValidity(this.value)) {\n return this.value.split(\" - \");\n }\n\n return [];\n }\n\n get startValue(): string {\n return this._calendarSelectedDates[0] || \"\";\n }\n\n get endValue(): string {\n return this._calendarSelectedDates[1] || \"\";\n }\n\n get accessibleIconName(): string {\n return translate(UDExDatePicker, CALENDAR_ICON);\n }\n\n get dateAccessibleName(): string {\n return this.accessibleName || translate(UDExDatePicker, DATEPICKER_DATE_DESCRIPTION);\n }\n\n get isRangeMode(): boolean {\n return this.selectionMode === UDExDatePickerSelectionMode.Range;\n }\n\n get _calendarTimestamp(): number | undefined {\n return this._extractFirstTimestamp(this.value);\n }\n\n get _effectivePlaceholder(): string {\n return this.formatPattern || UDExDatePicker.DEFAULT_FORMAT_PATTERN;\n }\n}\n\nUDExDatePicker.define();\n\nexport default UDExDatePicker;\nexport type { UDExDatePickerSelectionChangeEventDetail, UDExDatePickerValueStateChangeEventDetail };\n"]}
1
+ {"version":3,"file":"DatePicker.js","sourceRoot":"","sources":["../src/DatePicker.ts"],"names":[],"mappings":"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","sourcesContent":["import DateComponentBase from \"@ui5/webcomponents/dist/DateComponentBase.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport type { CalendarSelectionChangeEventDetail } from \"@ui5/webcomponents/dist/Calendar.js\";\nimport \"@ui5/webcomponents/dist/Icon.js\";\nimport \"@ui5/webcomponents-icons/dist/appointment-2.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type DateFormat from \"@ui5/webcomponents-localization/dist/DateFormat.js\";\nimport { CALENDAR_ICON, DATEPICKER_DATE_DESCRIPTION } from \"./generated/i18n/i18n-defaults.js\";\nimport type UDExTextField from \"./TextField.js\";\nimport type UDExDropdown from \"./Dropdown.js\";\nimport UDExValueState from \"./types/common.js\";\nimport translate from \"./utils/translate.js\";\nimport DatePickerTemplate from \"./DatePickerTemplate.js\";\nimport DatePickerCss from \"./generated/themes/DatePicker.css.js\";\nimport DatePickerPopoverCss from \"./generated/themes/DatePickerPopover.css.js\";\n\n// DateFormat's published type declaration omits the runtime parse/format methods\n// and the oFormatOptions property (they come from the underlying SAP core type).\n// This intersection adds the missing members without widening to `any`.\ntype DateFormatFull = DateFormat & {\n parse(value: string, utc?: boolean): Date | null;\n format(date: Date, utc?: boolean): string;\n oFormatOptions: { pattern?: string };\n};\n\nexport enum UDExDatePickerSelectionMode {\n Single = \"Single\",\n Range = \"Range\",\n}\n\ntype UDExDatePickerSelectionChangeEventDetail = {\n selectedValues: Array<string>;\n selectedDates: Array<number | undefined>;\n timestamp: number | undefined;\n};\n\ntype UDExDatePickerValueStateChangeEventDetail = {\n valueState: `${UDExValueState}`,\n valid: boolean\n}\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n *\n * <h3>Usage</h3>\n *\n * For the <code>udex-date-picker</code>\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@sapudex/web-components/dist/DatePicker.js\";</code>\n *\n * @constructor\n * @author SAP SE\n * @extends DateComponentBase\n * @tagname udex-date-picker\n * @public\n */\n@customElement({\n tag: \"udex-date-picker\",\n renderer: jsxRenderer,\n styles: [DatePickerCss, DatePickerPopoverCss],\n template: DatePickerTemplate,\n})\n/**\n * Fired when the selected dates change.\n *\n * @allowPreventDefault\n * @param {Array<string>} selectedValues The selected dates\n * @param {Array<number>} selectedDates The selected dates as UTC timestamps\n * @param {number} timestamp The last selected date as UTC timestamp\n * @public\n */\n@event(\"selection-change\", { cancelable: true, bubbles: true })\n\n/**\n * Fired before the value state of the component is updated internally.\n * The event is preventable, meaning that if it's default action is\n * prevented, the component will not update the value state.\n * @allowPreventDefault\n * @public\n * @param {UDExValueState} valueState The new `UDExValueState` that will be set.\n * @param {boolean} valid Indicator if the value is in between the min and max value.\n */\n@event(\"value-state-change\", { bubbles: true })\n\nclass UDExDatePicker extends DateComponentBase {\n eventDetails!: {\n \"selection-change\": UDExDatePickerSelectionChangeEventDetail,\n \"value-state-change\": UDExDatePickerValueStateChangeEventDetail,\n };\n /**\n * Defines selection mode of the calendar component.\n *\n * @default \"Single\"\n * @public\n */\n @property()\n selectionMode: `${UDExDatePickerSelectionMode}` = \"Single\";\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 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 supporting text under the input field.\n *\n * @default \"\"\n * @public\n */\n @property({ type: String })\n supportingText: string = \"\";\n\n /**\n * Defines the value of the input.\n *\n * @default \"\"\n * @public\n */\n @property({ type: String })\n value: string = \"\";\n\n /**\n * Sets the accessible ARIA name of the component.\n *\n * @default undefined\n * @public\n */\n @property({ type: String })\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()\n accessibleNameRef: string = \"\";\n\n /**\n * Defines label text for the input field.\n *\n * @default undefined\n * @public\n */\n @property({ type: String })\n label?: string;\n\n /**\n * Defines selected dates values.\n *\n * @default \"\"\n * @private\n */\n @property({ type: String, noAttribute: true })\n selectedDates: string = \"\";\n\n /**\n * Defines the value state of the component.\n *\n * @default \"Standard\"\n * @public\n */\n @property()\n valueState: `${UDExValueState}` = UDExValueState.Standard;\n\n /**\n * Defines the date format pattern (e.g., \\\"MMM dd, yyyy\\\" or \\\"MM/dd/yyyy\\\").\n * @default \"MMM dd, yyyy\"\n * @public\n */\n static readonly DEFAULT_FORMAT_PATTERN = \"MMM dd, yyyy\";\n\n @property({ type: String })\n formatPattern: string = UDExDatePicker.DEFAULT_FORMAT_PATTERN;\n\n /**\n * The first date in the range during selection (this is a temporary value, not the first date in the value range)\n * @private\n */\n @property()\n _tempValue!: string;\n\n /**\n * Tracks whether the calendar popover is currently open, used to reflect aria-expanded on the control button.\n * @private\n */\n @property({ type: Boolean, noAttribute: true })\n _isPopoverOpen: boolean = false;\n\n @i18n(\"@sapudex/web-components\")\n static i18nBundle: I18nBundle;\n\n responsivePopover?: UDExDropdown;\n\n private _getCurrentFormat(): DateFormatFull { return this.getFormat() as DateFormatFull; }\n\n private _prevDelimiter!: string | null;\n\n _getResponsePopover(): UDExDropdown {\n return this.shadowRoot!.querySelector<UDExDropdown>(`#udex-${this.__id!}-calendar__popover`)!;\n }\n\n /**\n * Getter for the interactive element that opens the overflow\n * @private\n */\n get _dropdownTrigger(): UDExTextField {\n return this.shadowRoot!.querySelector<UDExTextField>(\"[udex-text-field]\")!;\n }\n\n _afterDropdownClose(): void {\n this._isPopoverOpen = false;\n this._dropdownTrigger.active = false;\n this._dropdownTrigger.iconActive = false;\n this._dropdownTrigger.shadowRoot?.querySelector(\"input\")?.blur();\n this._tempValue = \"\";\n }\n\n _afterDropdownOpen(): void {\n this._isPopoverOpen = true;\n this._dropdownTrigger.iconActive = true;\n }\n\n _closeRespPopover(): void {\n if (this.responsivePopover) {\n this.responsivePopover.open = false;\n }\n }\n\n _openRespPopover(): void {\n this._dropdownTrigger.active = true;\n this.responsivePopover = this._getResponsePopover();\n this.responsivePopover.opener = this._dropdownTrigger._inputHolder;\n this.responsivePopover.open = true;\n }\n\n hideCalendar(): void {\n this._closeRespPopover();\n }\n\n showCalendar(): void {\n this._openRespPopover();\n }\n\n handleCalendarChange(e: CustomEvent<CalendarSelectionChangeEventDetail>): void {\n e.preventDefault();\n if (this.selectionMode === UDExDatePickerSelectionMode.Single) {\n const newValue = e.detail.selectedValues && e.detail.selectedValues[0];\n this._updateValueAndFireDecoratorEvents(newValue, true, e);\n }\n\n if (this.selectionMode === UDExDatePickerSelectionMode.Range) {\n const values = e.detail.selectedValues;\n\n if (values.length === 0) {\n return;\n }\n\n if (values.length === 1) { // Do nothing until the user selects 2 dates, we don't change any state at all for one date\n this._tempValue = values[0];\n return;\n }\n\n const newValue = this._buildValue(e.detail.selectedDates[0], e.detail.selectedDates[1]);\n this._updateValueAndFireDecoratorEvents(newValue, true, e);\n }\n\n this.hideCalendar();\n }\n\n get _effectiveDelimiter(): string {\n return \"-\";\n }\n\n _getInput(): HTMLInputElement | null | undefined {\n return this._dropdownTrigger.shadowRoot?.querySelector(\"input\");\n }\n\n _splitValueByDelimiter(value: string) {\n const valuesArray: Array<string> = [];\n const partsArray = value.split(this._prevDelimiter || this._effectiveDelimiter);\n\n // if format successfully parse the value, the value contains only single date\n if (this._getCurrentFormat().parse(value)) {\n valuesArray[0] = partsArray.join(this._effectiveDelimiter);\n valuesArray[1] = \"\";\n\n return valuesArray;\n }\n\n valuesArray[0] = partsArray.slice(0, partsArray.length / 2).join(this._effectiveDelimiter);\n valuesArray[1] = partsArray.slice(partsArray.length / 2).join(this._effectiveDelimiter);\n\n return valuesArray;\n }\n\n /**\n * Returns a UTC timestamp, representing the last date in the value string or undefined if the value is empty or there is just one date\n * @private\n */\n _extractLastTimestamp(value: string) {\n if (!value || !this._checkValueValidity(value)) {\n return undefined;\n }\n\n const dateStrings = this._splitValueByDelimiter(value);\n if (dateStrings[1]) {\n const parsedDate = this._getCurrentFormat().parse(dateStrings[1], true) as Date;\n return parsedDate.getTime() / 1000;\n }\n\n return undefined;\n }\n\n /**\n * Returns a UTC timestamp, representing the first date in the value string or undefined if the value is empty\n * @private\n */\n _extractFirstTimestamp(value: string) {\n if (!value || !this._checkValueValidity(value)) {\n return undefined;\n }\n\n const dateStrings = this._splitValueByDelimiter(value); // at least one item guaranteed due to the checks above (non-empty and valid)\n\n const parsedDate = this._getCurrentFormat().parse(dateStrings[0], true) as Date;\n return parsedDate.getTime() / 1000;\n }\n\n /**\n * Checks if a value is valid against the current date format of the DatePicker.\n * @public\n * @param value A value to be tested against the current date format\n */\n isValid(value: string): boolean {\n if (value === \"\" || value === undefined) {\n return true;\n }\n\n return !!this._getCurrentFormat().parse(value);\n }\n\n isValidRange(value: string): boolean {\n const parts = this._splitValueByDelimiter(value);\n return parts.length <= 2 && parts.every(dateString => this.isValid(dateString)); // must be at most 2 dates and each must be valid\n }\n\n isInValidRange(value: string): boolean {\n if (value === \"\" || value === undefined) {\n return true;\n }\n\n const calendarDate = this._getCalendarDateFromString(value);\n\n if (!calendarDate || !this._minDate || !this._maxDate) {\n return false;\n }\n\n return calendarDate.valueOf() >= this._minDate.valueOf() && calendarDate.valueOf() <= this._maxDate.valueOf();\n }\n\n /**\n * Checks if a date is between the minimum and maximum date.\n * @public\n * @param value A value to be checked\n */\n isInValidRangeRange(value: string): boolean {\n return this._splitValueByDelimiter(value).every(dateString => this.isInValidRange(dateString));\n }\n\n _checkValueValidity(value: string): boolean {\n let result = false;\n if (value === \"\") {\n return true;\n }\n if (this.selectionMode === UDExDatePickerSelectionMode.Single) {\n result = this.isValid(value) && this.isInValidRange(value);\n }\n if (this.selectionMode === UDExDatePickerSelectionMode.Range) {\n result = this.isValidRange(value) && this.isInValidRangeRange(value);\n }\n return result;\n }\n\n /**\n * Builds a string value out of two UTC timestamps - this method is the counterpart to _extractFirstTimestamp/_extractLastTimestamp\n * @private\n */\n _buildValue(firstDateTimestamp: number | undefined, lastDateTimestamp: number | undefined) {\n this._prevDelimiter = this._effectiveDelimiter;\n if (firstDateTimestamp) {\n const firstDateString = this._getStringFromTimestamp(firstDateTimestamp * 1000);\n\n if (!lastDateTimestamp) {\n return firstDateString;\n }\n\n const lastDateString = this._getStringFromTimestamp(lastDateTimestamp * 1000);\n return `${firstDateString} ${this._effectiveDelimiter} ${lastDateString}`;\n }\n\n return \"\";\n }\n\n /**\n * The parser understands many formats, but we need one format OR extract both dates as timestamps, flip if necessary, and build (which will use the desired format so we enforce the format too)\n * @protected\n */\n normalizeValue(value: string) {\n let result = \"\";\n if (this.selectionMode === UDExDatePickerSelectionMode.Single) {\n if (value === \"\") {\n return value;\n }\n result = this._getCurrentFormat().format(this._getCurrentFormat().parse(value, true) as Date, true); // it is important to both parse and format the date as UTC\n }\n if (this.selectionMode === UDExDatePickerSelectionMode.Range) {\n const firstDateTimestamp = this._extractFirstTimestamp(value);\n const lastDateTimestamp = this._extractLastTimestamp(value);\n if (firstDateTimestamp && lastDateTimestamp && firstDateTimestamp > lastDateTimestamp) { // if both are timestamps (not undefined), flip if necessary\n return this._buildValue(lastDateTimestamp, firstDateTimestamp);\n }\n result = this._buildValue(firstDateTimestamp, lastDateTimestamp);\n }\n return result;\n }\n\n _updateValueState() {\n const valid = this._checkValueValidity(this.value);\n const previousValueState = this.valueState;\n\n this.valueState = valid ? UDExValueState.Standard : UDExValueState.Error;\n\n const eventPrevented = !this.fireDecoratorEvent(\"value-state-change\", { valueState: this.valueState, valid });\n\n if (eventPrevented) {\n this.valueState = previousValueState;\n }\n }\n\n _buildEventData(value: string): UDExDatePickerSelectionChangeEventDetail {\n if (this.selectionMode === UDExDatePickerSelectionMode.Range) {\n return {\n selectedDates: [this._extractFirstTimestamp(value), this._extractLastTimestamp(value)],\n selectedValues: this._splitValueByDelimiter(this.value),\n timestamp: this._extractLastTimestamp(value),\n };\n }\n return {\n selectedDates: [this._extractFirstTimestamp(value)],\n selectedValues: [value],\n timestamp: this._extractFirstTimestamp(value),\n };\n }\n\n _updateValueAndFireDecoratorEvents(value: string, normalizeValue: boolean, e?: CustomEvent | null) {\n const valid = this._checkValueValidity(value);\n\n if (valid && normalizeValue) {\n value = this.normalizeValue(value); // transform valid values (in any format) to the correct format\n }\n\n this.value = value;\n this._updateValueState(); // Change the value state to Error/None, but only if needed\n\n if (!valid) { return; }\n\n if (e) {\n const { selectedDates, timestamp, selectedValues } = e.detail;\n\n this.fireDecoratorEvent(\n \"selection-change\",\n {\n timestamp,\n selectedDates,\n selectedValues,\n },\n );\n } else {\n this.fireDecoratorEvent(\n \"selection-change\",\n this._buildEventData(value),\n );\n }\n }\n\n _onInputChange(e: Event) {\n this._updateValueAndFireDecoratorEvents((e.target as UDExTextField).value, true);\n }\n\n handleInputClick(e: CustomEvent<void>): void {\n e.preventDefault();\n\n if (this.disabled || this.readonly) {\n return;\n }\n\n if (this.responsivePopover?.open) {\n this.hideCalendar();\n } else {\n this.showCalendar();\n }\n }\n\n /**\n * Used to provide selectedDates to the calendar based on the component's state\n * Override in derivatives to provide different rules for setting the calendar's selected dates\n * @protected\n */\n get _calendarSelectedDates(): Array<string> {\n if (this._tempValue) {\n return [this._tempValue];\n }\n\n if (this.value && this._checkValueValidity(this.value)) {\n return this.value.split(\" - \");\n }\n\n return [];\n }\n\n get startValue(): string {\n return this._calendarSelectedDates[0] || \"\";\n }\n\n get endValue(): string {\n return this._calendarSelectedDates[1] || \"\";\n }\n\n get accessibleIconName(): string {\n return translate(UDExDatePicker, CALENDAR_ICON);\n }\n\n get dateAccessibleName(): string {\n return this.accessibleName || translate(UDExDatePicker, DATEPICKER_DATE_DESCRIPTION);\n }\n\n get isRangeMode(): boolean {\n return this.selectionMode === UDExDatePickerSelectionMode.Range;\n }\n\n get _calendarTimestamp(): number | undefined {\n return this._extractFirstTimestamp(this.value);\n }\n\n get _effectivePlaceholder(): string {\n return this.formatPattern || UDExDatePicker.DEFAULT_FORMAT_PATTERN;\n }\n}\n\nUDExDatePicker.define();\n\nexport default UDExDatePicker;\nexport type { UDExDatePickerSelectionChangeEventDetail, UDExDatePickerValueStateChangeEventDetail };\n"]}
@@ -2,6 +2,6 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "@ui5/webcompo
2
2
  import DatePickerPopoverTemplate from "./DatePickerPopoverTemplate.js";
3
3
  import UDExTextField from "./TextField.js";
4
4
  export default function DatePickerTemplate() {
5
- return (_jsxs(_Fragment, { children: [_jsx(UDExTextField, { class: "udex-date-picker__input", "_aria-has-popup": "grid", icon: "appointment-2", value: this.value, placeholder: this._effectivePlaceholder, label: this.label, "accessible-name": this.dateAccessibleName, "accessible-name-ref": this.accessibleNameRef, "accessible-icon-name": this.accessibleIconName, ...(this.disabled ? { "disabled": true } : {}), ...(this.required ? { "required": true } : {}), ...(this.readonly ? { "readonly": true } : {}), onClickIcon: this.handleInputClick, onChange: this._onInputChange, "value-state": this.valueState, "supporting-text": this.supportingText }), DatePickerPopoverTemplate.call(this)] }));
5
+ return (_jsxs(_Fragment, { children: [_jsx(UDExTextField, { class: "udex-date-picker__input", icon: "appointment-2", value: this.value, placeholder: this._effectivePlaceholder, label: this.label, "accessible-name": this.dateAccessibleName, "accessible-name-ref": this.accessibleNameRef, "accessible-icon-name": this.accessibleIconName, "_icon-aria-has-popup": "grid", "_icon-aria-expanded": this._isPopoverOpen ? "true" : "false", ...(this.disabled ? { "disabled": true } : {}), ...(this.required ? { "required": true } : {}), ...(this.readonly ? { "readonly": true } : {}), onClickIcon: this.handleInputClick, onChange: this._onInputChange, "value-state": this.valueState, "supporting-text": this.supportingText }), DatePickerPopoverTemplate.call(this)] }));
6
6
  }
7
7
  //# sourceMappingURL=DatePickerTemplate.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"DatePickerTemplate.js","sourceRoot":"","sources":["../src/DatePickerTemplate.tsx"],"names":[],"mappings":";AACA,OAAO,yBAAyB,MAAM,gCAAgC,CAAC;AACvE,OAAO,aAAa,MAAM,gBAAgB,CAAC;AAE3C,MAAM,CAAC,OAAO,UAAU,kBAAkB;IACxC,OAAO,CACL,8BACE,KAAC,aAAa,IACZ,KAAK,EAAC,yBAAyB,qBACf,MAAM,EACtB,IAAI,EAAC,eAAe,EACpB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,WAAW,EAAE,IAAI,CAAC,qBAAqB,EACvC,KAAK,EAAE,IAAI,CAAC,KAAK,qBACA,IAAI,CAAC,kBAAkB,yBACnB,IAAI,CAAC,iBAAiB,0BACrB,IAAI,CAAC,kBAAkB,KACzC,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,UAAU,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,KAC3C,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,UAAU,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,KAC3C,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,UAAU,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EAC/C,WAAW,EAAE,IAAI,CAAC,gBAAgB,EAClC,QAAQ,EAAE,IAAI,CAAC,cAAc,iBAChB,IAAI,CAAC,UAAU,qBACX,IAAI,CAAC,cAAc,GAAI,EACzC,yBAAyB,CAAC,IAAI,CAAC,IAAI,CAAC,IACpC,CACJ,CAAC;AACJ,CAAC","sourcesContent":["import type DatePicker from \"./DatePicker.js\";\nimport DatePickerPopoverTemplate from \"./DatePickerPopoverTemplate.js\";\nimport UDExTextField from \"./TextField.js\";\n\nexport default function DatePickerTemplate(this: DatePicker) {\n return (\n <>\n <UDExTextField\n class=\"udex-date-picker__input\"\n _aria-has-popup=\"grid\"\n icon=\"appointment-2\"\n value={this.value}\n placeholder={this._effectivePlaceholder}\n label={this.label}\n accessible-name={this.dateAccessibleName}\n accessible-name-ref={this.accessibleNameRef}\n accessible-icon-name={this.accessibleIconName}\n {...(this.disabled ? { \"disabled\": true } : {})}\n {...(this.required ? { \"required\": true } : {})}\n {...(this.readonly ? { \"readonly\": true } : {})}\n onClickIcon={this.handleInputClick}\n onChange={this._onInputChange}\n value-state={this.valueState}\n supporting-text={this.supportingText} />\n {DatePickerPopoverTemplate.call(this)}\n </>\n );\n}\n"]}
1
+ {"version":3,"file":"DatePickerTemplate.js","sourceRoot":"","sources":["../src/DatePickerTemplate.tsx"],"names":[],"mappings":";AACA,OAAO,yBAAyB,MAAM,gCAAgC,CAAC;AACvE,OAAO,aAAa,MAAM,gBAAgB,CAAC;AAE3C,MAAM,CAAC,OAAO,UAAU,kBAAkB;IACxC,OAAO,CACL,8BACE,KAAC,aAAa,IACZ,KAAK,EAAC,yBAAyB,EAC/B,IAAI,EAAC,eAAe,EACpB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,WAAW,EAAE,IAAI,CAAC,qBAAqB,EACvC,KAAK,EAAE,IAAI,CAAC,KAAK,qBACA,IAAI,CAAC,kBAAkB,yBACnB,IAAI,CAAC,iBAAiB,0BACrB,IAAI,CAAC,kBAAkB,0BACxB,MAAM,yBACN,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,KACvD,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,UAAU,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,KAC3C,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,UAAU,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,KAC3C,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,UAAU,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EAC/C,WAAW,EAAE,IAAI,CAAC,gBAAgB,EAClC,QAAQ,EAAE,IAAI,CAAC,cAAc,iBAChB,IAAI,CAAC,UAAU,qBACX,IAAI,CAAC,cAAc,GAAI,EACzC,yBAAyB,CAAC,IAAI,CAAC,IAAI,CAAC,IACpC,CACJ,CAAC;AACJ,CAAC","sourcesContent":["import type DatePicker from \"./DatePicker.js\";\nimport DatePickerPopoverTemplate from \"./DatePickerPopoverTemplate.js\";\nimport UDExTextField from \"./TextField.js\";\n\nexport default function DatePickerTemplate(this: DatePicker) {\n return (\n <>\n <UDExTextField\n class=\"udex-date-picker__input\"\n icon=\"appointment-2\"\n value={this.value}\n placeholder={this._effectivePlaceholder}\n label={this.label}\n accessible-name={this.dateAccessibleName}\n accessible-name-ref={this.accessibleNameRef}\n accessible-icon-name={this.accessibleIconName}\n _icon-aria-has-popup=\"grid\"\n _icon-aria-expanded={this._isPopoverOpen ? \"true\" : \"false\"}\n {...(this.disabled ? { \"disabled\": true } : {})}\n {...(this.required ? { \"required\": true } : {})}\n {...(this.readonly ? { \"readonly\": true } : {})}\n onClickIcon={this.handleInputClick}\n onChange={this._onInputChange}\n value-state={this.valueState}\n supporting-text={this.supportingText} />\n {DatePickerPopoverTemplate.call(this)}\n </>\n );\n}\n"]}
package/dist/Tag.js CHANGED
@@ -151,10 +151,11 @@ let UDExTag = class UDExTag extends UI5Element {
151
151
  const hasIconClass = this.hasIcon ? "udex-tag--has-icon" : "";
152
152
  const readOnlyClass = this.readOnly ? "udex-tag--readonly" : "";
153
153
  const nonSelectableClass = this.nonSelectable && !this.href && !this.nonInteractive ? "udex-tag--nonselectable" : "";
154
+ const nonInteractiveClass = this.nonInteractive ? "udex-tag--noninteractive" : "";
154
155
  const linkTagClass = this.href ? "udex-tag--link" : "";
155
156
  const selectableClass = this.selected ? "udex-tag--selected" : "";
156
157
  const designClass = `udex-tag-${this.design?.toLowerCase()}`;
157
- return `udex-tag udex-tag--${this.size.toLocaleLowerCase()} ${designClass} ${hasIconClass} ${readOnlyClass} ${nonSelectableClass} ${linkTagClass} ${selectableClass}`.trim();
158
+ return `udex-tag udex-tag--${this.size.toLocaleLowerCase()} ${designClass} ${hasIconClass} ${readOnlyClass} ${nonSelectableClass} ${nonInteractiveClass} ${linkTagClass} ${selectableClass}`.trim();
158
159
  }
159
160
  get startIcon() {
160
161
  return this.hasIcon && this.iconPlacement === UDExIconPlacement.Start;
@@ -181,7 +182,7 @@ let UDExTag = class UDExTag extends UI5Element {
181
182
  return !this.readOnly && !this.toBeDeleted && !this.nonSelectable;
182
183
  }
183
184
  get hasIcon() {
184
- return !!this.icon && !this.readOnly;
185
+ return !!this.icon;
185
186
  }
186
187
  get iconAccessibleName() {
187
188
  return this.accessibleName || this.text;
package/dist/Tag.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Tag.js","sourceRoot":"","sources":["../src/Tag.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,UAAU,MAAM,4CAA4C,CAAC;AACpE,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,KAAK,MAAM,yDAAyD,CAAC;AAC5E,OAAO,WAAW,MAAM,iDAAiD,CAAC;AAC1E,OAAO,IAAI,MAAM,iCAAiC,CAAC;AAEnD,OAAO,aAAa,MAAM,wDAAwD,CAAC;AACnF,OAAO,EAAE,OAAO,EAAE,MAAM,sCAAsC,CAAC;AAC/D,OAAO,EAAE,SAAS,EAAE,MAAM,wCAAwC,CAAC;AACnE,OAAO,iBAAiB,MAAM,0BAA0B,CAAC;AAEzD,OAAO,WAAW,MAAM,kBAAkB,CAAC;AAE3C,SAAS;AACT,OAAO,MAAM,MAAM,+BAA+B,CAAC;AAEnD,MAAM,CAAN,IAAY,WAKX;AALD,WAAY,WAAW;IACnB,4BAAa,CAAA;IACb,8BAAe,CAAA;IACf,oCAAqB,CAAA;IACrB,4BAAa,CAAA;AACjB,CAAC,EALW,WAAW,KAAX,WAAW,QAKtB;AAED,MAAM,CAAN,IAAY,WAGX;AAHD,WAAY,WAAW;IACrB,8BAAe,CAAA;IACf,gCAAiB,CAAA;AACnB,CAAC,EAHW,WAAW,KAAX,WAAW,QAGtB;AAMD;;;;;;;;;;;;;;;;;;GAkBG;AA6BH,IAAM,OAAO,GAAb,MAAM,OAAQ,SAAQ,UAAU;IA8I9B;QACE,KAAK,EAAE,CAAC;QAzIV;;;;;UAKE;QAEA,SAAI,GAAW,EAAE,CAAC;QASpB;;;;;UAKE;QAEA,WAAM,GAAqB,WAAW,CAAC,IAAI,CAAC;QAE9C;;;;;WAKG;QAED,SAAI,GAAqB,WAAW,CAAC,KAAK,CAAC;QAW7C;;;;;UAKE;QAEA,kBAAa,GAA4B,iBAAiB,CAAC,GAAG,CAAC;QAWjE;;;;WAIG;QAED,mBAAc,GAAW,EAAE,CAAC;QAE9B;;;;;UAKE;QAEA,mBAAc,GAAW,EAAE,CAAC;QA8D5B,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC1D,CAAC;IAED,iBAAiB;QACf,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;IAC3B,CAAC;IAED,UAAU;QACR,IAAI,SAAS,EAAE,EAAE,CAAC;YAChB,IAAI,CAAC,YAAY,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC;QACnC,CAAC;QACD,IAAI,IAAI,CAAC,cAAc,KAAK,QAAQ,EAAE,CAAC;YACrC,IAAI,CAAC,UAAU,EAAE,iBAAiB,EAAE,eAAe,CAAC,cAAc,CAAC,CAAC;QACtE,CAAC;QACD,aAAa,CAAC,QAAQ,CAAC,IAAI,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;IACxD,CAAC;IAED,SAAS;QACP,aAAa,CAAC,UAAU,CAAC,IAAI,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;IAC1D,CAAC;IAED,WAAW;QACT,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;IACjC,CAAC;IAED,gBAAgB,CAAC,CAAQ;QACvB,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,IAAI,CAAC,kBAAkB,CAAC,WAAW,CAAC,CAAC;IACvC,CAAC;IAED,eAAe;QACb,IAAI,IAAI,CAAC,gBAAgB,EAAE,CAAC;YAC1B,IAAI,CAAC,WAAW,EAAE,CAAC;YACnB,IAAI,CAAC,kBAAkB,CAAC,iBAAiB,CAAC,CAAC;QAC7C,CAAC;IACH,CAAC;IAED,UAAU,CAAC,CAAgB;QACzB,IAAI,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC;YACf,IAAI,CAAC,eAAe,EAAE,CAAC;QACzB,CAAC;IACH,CAAC;IAED,gBAAgB,CAAC,CAAa;QAC5B,MAAM,MAAM,GAAG,CAAC,CAAC,aAA4B,CAAC;QAE9C,IAAI,MAAM,KAAK,IAAI,CAAC,UAAU,EAAE,aAAa,CAAC,YAAY,CAAC,EAAE,CAAC;YAC5D,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;QAC1B,CAAC;IACH,CAAC;IAED,aAAa;QACX,IAAI,IAAI,CAAC,aAAa,EAAE,CAAC;YACvB,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,IAAI,CAAC;QACzB,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,CAAC;QAChC,CAAC;IACH,CAAC;IAED,QAAQ;QACN,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;IACtB,CAAC;IAED,SAAS;QACP,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC;IAC/B,CAAC;IAED,IAAI,UAAU;QACZ,MAAM,YAAY,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,EAAE,CAAC;QAC9D,MAAM,aAAa,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,EAAE,CAAC;QAChE,MAAM,kBAAkB,GAAG,IAAI,CAAC,aAAa,IAAI,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,yBAAyB,CAAC,CAAC,CAAC,EAAE,CAAC;QACrH,MAAM,YAAY,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,EAAE,CAAC;QACvD,MAAM,eAAe,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,EAAE,CAAC;QAClE,MAAM,WAAW,GAAG,YAAY,IAAI,CAAC,MAAM,EAAE,WAAW,EAAE,EAAE,CAAC;QAC7D,OAAO,sBAAsB,IAAI,CAAC,IAAI,CAAC,iBAAiB,EAAE,IAAI,WAAW,IAAI,YAAY,IAAI,aAAa,IAAI,kBAAkB,IAAI,YAAY,IAAI,eAAe,EAAE,CAAC,IAAI,EAAE,CAAC;IAC/K,CAAC;IAED,IAAI,SAAS;QACX,OAAO,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,aAAa,KAAK,iBAAiB,CAAC,KAAK,CAAC;IACxE,CAAC;IAED,IAAI,OAAO;QACT,OAAO,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,aAAa,KAAK,iBAAiB,CAAC,GAAG,CAAC;IACtE,CAAC;IAED,IAAI,SAAS;QACX,IAAI,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,aAAa,EAAE,CAAC;YACzC,OAAO,CAAC,CAAC,CAAC;QACZ,CAAC;QACD,OAAO,CAAC,CAAC;IACX,CAAC;IAED,IAAI,OAAO;QACT,OAAO,IAAI,CAAC,SAAS,EAAG,CAAC,aAAa,CAAC,iBAAiB,CAAE,CAAC;IAC7D,CAAC;IAED,IAAI,aAAa;QACf,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE,CAAC;YAClB,OAAO,KAAK,CAAC;QACf,CAAC;QAED,OAAO,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,qBAAqB,EAAE,CAAC,KAAK,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC;IACrG,CAAC;IAED,IAAI,gBAAgB;QAClB,OAAO,CAAC,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,WAAW,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC;IACpE,CAAC;IAED,IAAI,OAAO;QACT,OAAO,CAAC,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC;IACvC,CAAC;IAED,IAAI,kBAAkB;QACpB,OAAO,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,IAAI,CAAC;IAC1C,CAAC;IAED,mBAAmB,CAAC,CAAQ;QAC1B,IAAI,CAAC,kBAAkB,CAAC,cAAc,EAAE,EAAE,aAAa,EAAE,CAAC,EAAE,CAAC,CAAC;IAChE,CAAC;CACF,CAAA;AA1PG;IADD,QAAQ,EAAE;qCACS;AAQlB;IADD,QAAQ,EAAE;qCACK;AAQd;IADD,QAAQ,EAAE;uCACmC;AAS5C;IADD,QAAQ,EAAE;qCACkC;AAS3C;IADD,QAAQ,EAAE;qCACK;AASd;IADD,QAAQ,EAAE;8CACsD;AAS/D;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;yCACP;AAQnB;IADD,QAAQ,EAAE;+CACmB;AAS5B;IADD,QAAQ,EAAE;+CACmB;AAS5B;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;yCACP;AASnB;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;wCACR;AAUlB;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;4CACJ;AAStB;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;0CACN;AAGpB;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;4CACJ;AAQtB;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;8CACF;AAQxB;IADD,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;+CACD;AA1IvB,OAAO;IA5BZ,aAAa,CAAC;QACb,GAAG,EAAE,UAAU;QACf,QAAQ,EAAE,WAAW;QACrB,MAAM,EAAE,MAAM;QACd,QAAQ,EAAE,WAAW;QACrB,YAAY,EAAE,CAAC,IAAI,CAAC;KACrB,CAAC;IAEF;;;;OAIG;;IACF,KAAK,CAAC,iBAAiB,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;IAE5C;;;;OAIG;;IACF,KAAK,CAAC,WAAW,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;IACtC;;;;;OAKG;;IACF,KAAK,CAAC,cAAc,EAAE,EAAE,UAAU,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;GACrD,OAAO,CAuQZ;AAED,OAAO,CAAC,MAAM,EAAE,CAAC;AAEjB,eAAe,OAAO,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 event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/renderer/JsxRenderer.js\";\nimport Icon from \"@ui5/webcomponents/dist/Icon.js\";\nimport type { ResizeObserverCallback } from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport ResizeHandler from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport { isEnter } from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport { isDesktop } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport UDExIconPlacement from \"./types/IconPlacement.js\";\n\nimport TagTemplate from \"./TagTemplate.js\";\n\n// Styles\nimport TagCss from \"./generated/themes/Tag.css.js\";\n\nexport enum UDExTagType {\n Text = \"Text\",\n White = \"White\",\n Outlined = \"Outlined\",\n Grey = \"Grey\"\n}\n\nexport enum UDExTagSize {\n Small = \"Small\",\n Medium = \"Medium\"\n}\n\ntype UDExTagLinkClickEventDetail = {\n originalEvent: Event,\n}\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n *\n * <h3>Usage</h3>\n *\n * For the <code>udex-tag</code>\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@sapudex/web-components/dist/Tag.js\";</code>\n *\n * @constructor\n * @author SAP SE\n * @extends UI5Element\n * @tagname udex-tag\n * @public\n */\n@customElement({\n tag: \"udex-tag\",\n renderer: jsxRenderer,\n styles: TagCss,\n template: TagTemplate,\n dependencies: [Icon],\n})\n\n/**\n * Emitted when tag was clicked\n *\n * @public\n */\n@event(\"selectionChange\", { bubbles: true })\n\n/**\n * Emitted when icon in tag was clicked\n *\n * @public\n */\n@event(\"iconClick\", { bubbles: true })\n/**\n * Emitted when tag link was clicked\n *\n * @public\n * @param {Event} originalEvent the original event object\n */\n@event(\"tagLinkClick\", { cancelable: true, bubbles: true })\nclass UDExTag extends UI5Element {\n eventDetails!: {\n \"selectionChange\": void,\n \"iconClick\": void,\n \"tagLinkClick\": UDExTagLinkClickEventDetail,\n };\n /**\n * Defines the text of the tag\n *\n * @default \"\"\n * @public\n */\n @property()\n text: string = \"\";\n /**\n * Defines the href for behavior of the tag as a link\n *\n * @default \"\"\n * @public\n */\n @property()\n href!: string;\n /**\n * Defines the design type of tag\n *\n * @default \"Grey\"\n * @public\n */\n @property()\n design: `${UDExTagType}` = UDExTagType.Grey;\n\n /**\n * Defines the size of the component.\n *\n * @default \"Small\"\n * @public\n */\n @property()\n size: `${UDExTagSize}` = UDExTagSize.Small;\n\n /**\n * Defines icon name\n *\n * @default \"\"\n * @public\n */\n @property()\n icon!: string;\n\n /**\n * Defines icon placement if icon was provided\n *\n * @default \"End\"\n * @public\n */\n @property()\n iconPlacement : `${UDExIconPlacement}` = UDExIconPlacement.End;\n\n /**\n * Defines if tag is in readnly state\n *\n * @default false\n * @public\n */\n @property({ type: Boolean })\n readOnly!: boolean;\n\n /**\n * Defines the accessible ARIA name of the component.\n * @default \"\"\n * @public\n */\n @property()\n accessibleName: string = \"\";\n\n /**\n * Defines the role attribute of component\n *\n * @default \"button\"\n * @public\n */\n @property()\n accessibleRole: string = \"\";\n\n /**\n * Defines if tag is selected\n *\n * @default false\n * @public\n */\n @property({ type: Boolean })\n selected!: boolean;\n\n /**\n * Defines whether the component is focused or not.\n *\n * @default false\n * @private\n */\n @property({ type: Boolean })\n focused!: boolean;\n\n /**\n * Defines whether the token is being deleted\n * This flag is used in the udex-select-box\n *\n * @default false\n * @private\n */\n @property({ type: Boolean })\n toBeDeleted!: boolean;\n\n /**\n * Set by the tokenizer when a token is in the \"more\" area (overflowing)\n *\n * @default false\n * @private\n */\n @property({ type: Boolean })\n overflows!: boolean;\n\n @property({ type: Boolean })\n singleToken!: boolean;\n\n /**\n * Toggle on/off nonSelectable property on tag\n * @default true\n * @public\n */\n @property({ type: Boolean })\n nonSelectable!: boolean;\n\n /**\n * Defined if tag should be nonSelectable and icon should be non-interactive\n * @default true\n * @public\n */\n @property({ type: Boolean })\n nonInteractive!: boolean;\n\n _handleResizeBound: ResizeObserverCallback;\n\n constructor() {\n super();\n this._handleResizeBound = this._handleResize.bind(this);\n }\n\n onBeforeRendering(): void {\n this.toBeDeleted = false;\n }\n\n onEnterDOM(): void {\n if (isDesktop()) {\n this.setAttribute(\"desktop\", \"\");\n }\n if (this.accessibleRole !== \"button\") {\n this.shadowRoot?.firstElementChild?.removeAttribute(\"aria-pressed\");\n }\n ResizeHandler.register(this, this._handleResizeBound);\n }\n\n onExitDOM(): void {\n ResizeHandler.deregister(this, this._handleResizeBound);\n }\n\n setSelected(): void {\n this.selected = !this.selected;\n }\n\n iconClickHandler(e: Event): void {\n e.stopPropagation();\n this.fireDecoratorEvent(\"iconClick\");\n }\n\n tagClickHandler(): void {\n if (this.isInteractiveTag) {\n this.setSelected();\n this.fireDecoratorEvent(\"selectionChange\");\n }\n }\n\n tagKeyDown(e: KeyboardEvent): void {\n if (isEnter(e)) {\n this.tagClickHandler();\n }\n }\n\n _onIconMouseDown(e: MouseEvent): void {\n const target = e.currentTarget as HTMLElement;\n\n if (target === this.shadowRoot?.querySelector(\"[ui5-icon]\")) {\n this.toBeDeleted = true;\n }\n }\n\n _handleResize() {\n if (this.isTruncatable) {\n this.title = this.text;\n } else {\n this.removeAttribute(\"title\");\n }\n }\n\n _focusin(): void {\n this.focused = true;\n }\n\n _focusout(): void {\n this.focused = !this.focused;\n }\n\n get tagClasses(): string {\n const hasIconClass = this.hasIcon ? \"udex-tag--has-icon\" : \"\";\n const readOnlyClass = this.readOnly ? \"udex-tag--readonly\" : \"\";\n const nonSelectableClass = this.nonSelectable && !this.href && !this.nonInteractive ? \"udex-tag--nonselectable\" : \"\";\n const linkTagClass = this.href ? \"udex-tag--link\" : \"\";\n const selectableClass = this.selected ? \"udex-tag--selected\" : \"\";\n const designClass = `udex-tag-${this.design?.toLowerCase()}`;\n return `udex-tag udex-tag--${this.size.toLocaleLowerCase()} ${designClass} ${hasIconClass} ${readOnlyClass} ${nonSelectableClass} ${linkTagClass} ${selectableClass}`.trim();\n }\n\n get startIcon(): boolean {\n return this.hasIcon && this.iconPlacement === UDExIconPlacement.Start;\n }\n\n get endIcon(): boolean {\n return this.hasIcon && this.iconPlacement === UDExIconPlacement.End;\n }\n\n get _tabIndex(): number {\n if (this.overflows || this.nonSelectable) {\n return -1;\n }\n return 0;\n }\n\n get textDom(): HTMLElement {\n return this.getDomRef()!.querySelector(\".udex-tag__text\")!;\n }\n\n get isTruncatable(): boolean {\n if (!this.textDom) {\n return false;\n }\n\n return Math.ceil(this.textDom.getBoundingClientRect().width) < Math.ceil(this.textDom.scrollWidth);\n }\n\n get isInteractiveTag(): boolean {\n return !this.readOnly && !this.toBeDeleted && !this.nonSelectable;\n }\n\n get hasIcon(): boolean {\n return !!this.icon && !this.readOnly;\n }\n\n get iconAccessibleName(): string {\n return this.accessibleName || this.text;\n }\n\n tagLinkClickHandler(e: Event): void {\n this.fireDecoratorEvent(\"tagLinkClick\", { originalEvent: e });\n }\n}\n\nUDExTag.define();\n\nexport default UDExTag;\nexport type { UDExTagLinkClickEventDetail };\n"]}
1
+ {"version":3,"file":"Tag.js","sourceRoot":"","sources":["../src/Tag.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 event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/renderer/JsxRenderer.js\";\nimport Icon from \"@ui5/webcomponents/dist/Icon.js\";\nimport type { ResizeObserverCallback } from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport ResizeHandler from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport { isEnter } from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport { isDesktop } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport UDExIconPlacement from \"./types/IconPlacement.js\";\n\nimport TagTemplate from \"./TagTemplate.js\";\n\n// Styles\nimport TagCss from \"./generated/themes/Tag.css.js\";\n\nexport enum UDExTagType {\n Text = \"Text\",\n White = \"White\",\n Outlined = \"Outlined\",\n Grey = \"Grey\"\n}\n\nexport enum UDExTagSize {\n Small = \"Small\",\n Medium = \"Medium\"\n}\n\ntype UDExTagLinkClickEventDetail = {\n originalEvent: Event,\n}\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n *\n * <h3>Usage</h3>\n *\n * For the <code>udex-tag</code>\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@sapudex/web-components/dist/Tag.js\";</code>\n *\n * @constructor\n * @author SAP SE\n * @extends UI5Element\n * @tagname udex-tag\n * @public\n */\n@customElement({\n tag: \"udex-tag\",\n renderer: jsxRenderer,\n styles: TagCss,\n template: TagTemplate,\n dependencies: [Icon],\n})\n\n/**\n * Emitted when tag was clicked\n *\n * @public\n */\n@event(\"selectionChange\", { bubbles: true })\n\n/**\n * Emitted when icon in tag was clicked\n *\n * @public\n */\n@event(\"iconClick\", { bubbles: true })\n/**\n * Emitted when tag link was clicked\n *\n * @public\n * @param {Event} originalEvent the original event object\n */\n@event(\"tagLinkClick\", { cancelable: true, bubbles: true })\nclass UDExTag extends UI5Element {\n eventDetails!: {\n \"selectionChange\": void,\n \"iconClick\": void,\n \"tagLinkClick\": UDExTagLinkClickEventDetail,\n };\n /**\n * Defines the text of the tag\n *\n * @default \"\"\n * @public\n */\n @property()\n text: string = \"\";\n /**\n * Defines the href for behavior of the tag as a link\n *\n * @default \"\"\n * @public\n */\n @property()\n href!: string;\n /**\n * Defines the design type of tag\n *\n * @default \"Grey\"\n * @public\n */\n @property()\n design: `${UDExTagType}` = UDExTagType.Grey;\n\n /**\n * Defines the size of the component.\n *\n * @default \"Small\"\n * @public\n */\n @property()\n size: `${UDExTagSize}` = UDExTagSize.Small;\n\n /**\n * Defines icon name\n *\n * @default \"\"\n * @public\n */\n @property()\n icon!: string;\n\n /**\n * Defines icon placement if icon was provided\n *\n * @default \"End\"\n * @public\n */\n @property()\n iconPlacement : `${UDExIconPlacement}` = UDExIconPlacement.End;\n\n /**\n * Defines if tag is in readnly state\n *\n * @default false\n * @public\n */\n @property({ type: Boolean })\n readOnly!: boolean;\n\n /**\n * Defines the accessible ARIA name of the component.\n * @default \"\"\n * @public\n */\n @property()\n accessibleName: string = \"\";\n\n /**\n * Defines the role attribute of component\n *\n * @default \"button\"\n * @public\n */\n @property()\n accessibleRole: string = \"\";\n\n /**\n * Defines if tag is selected\n *\n * @default false\n * @public\n */\n @property({ type: Boolean })\n selected!: boolean;\n\n /**\n * Defines whether the component is focused or not.\n *\n * @default false\n * @private\n */\n @property({ type: Boolean })\n focused!: boolean;\n\n /**\n * Defines whether the token is being deleted\n * This flag is used in the udex-select-box\n *\n * @default false\n * @private\n */\n @property({ type: Boolean })\n toBeDeleted!: boolean;\n\n /**\n * Set by the tokenizer when a token is in the \"more\" area (overflowing)\n *\n * @default false\n * @private\n */\n @property({ type: Boolean })\n overflows!: boolean;\n\n @property({ type: Boolean })\n singleToken!: boolean;\n\n /**\n * Toggle on/off nonSelectable property on tag\n * @default true\n * @public\n */\n @property({ type: Boolean })\n nonSelectable!: boolean;\n\n /**\n * Defined if tag should be nonSelectable and icon should be non-interactive\n * @default true\n * @public\n */\n @property({ type: Boolean })\n nonInteractive!: boolean;\n\n _handleResizeBound: ResizeObserverCallback;\n\n constructor() {\n super();\n this._handleResizeBound = this._handleResize.bind(this);\n }\n\n onBeforeRendering(): void {\n this.toBeDeleted = false;\n }\n\n onEnterDOM(): void {\n if (isDesktop()) {\n this.setAttribute(\"desktop\", \"\");\n }\n if (this.accessibleRole !== \"button\") {\n this.shadowRoot?.firstElementChild?.removeAttribute(\"aria-pressed\");\n }\n ResizeHandler.register(this, this._handleResizeBound);\n }\n\n onExitDOM(): void {\n ResizeHandler.deregister(this, this._handleResizeBound);\n }\n\n setSelected(): void {\n this.selected = !this.selected;\n }\n\n iconClickHandler(e: Event): void {\n e.stopPropagation();\n this.fireDecoratorEvent(\"iconClick\");\n }\n\n tagClickHandler(): void {\n if (this.isInteractiveTag) {\n this.setSelected();\n this.fireDecoratorEvent(\"selectionChange\");\n }\n }\n\n tagKeyDown(e: KeyboardEvent): void {\n if (isEnter(e)) {\n this.tagClickHandler();\n }\n }\n\n _onIconMouseDown(e: MouseEvent): void {\n const target = e.currentTarget as HTMLElement;\n\n if (target === this.shadowRoot?.querySelector(\"[ui5-icon]\")) {\n this.toBeDeleted = true;\n }\n }\n\n _handleResize() {\n if (this.isTruncatable) {\n this.title = this.text;\n } else {\n this.removeAttribute(\"title\");\n }\n }\n\n _focusin(): void {\n this.focused = true;\n }\n\n _focusout(): void {\n this.focused = !this.focused;\n }\n\n get tagClasses(): string {\n const hasIconClass = this.hasIcon ? \"udex-tag--has-icon\" : \"\";\n const readOnlyClass = this.readOnly ? \"udex-tag--readonly\" : \"\";\n const nonSelectableClass = this.nonSelectable && !this.href && !this.nonInteractive ? \"udex-tag--nonselectable\" : \"\";\n const nonInteractiveClass = this.nonInteractive ? \"udex-tag--noninteractive\" : \"\";\n const linkTagClass = this.href ? \"udex-tag--link\" : \"\";\n const selectableClass = this.selected ? \"udex-tag--selected\" : \"\";\n const designClass = `udex-tag-${this.design?.toLowerCase()}`;\n return `udex-tag udex-tag--${this.size.toLocaleLowerCase()} ${designClass} ${hasIconClass} ${readOnlyClass} ${nonSelectableClass} ${nonInteractiveClass} ${linkTagClass} ${selectableClass}`.trim();\n }\n\n get startIcon(): boolean {\n return this.hasIcon && this.iconPlacement === UDExIconPlacement.Start;\n }\n\n get endIcon(): boolean {\n return this.hasIcon && this.iconPlacement === UDExIconPlacement.End;\n }\n\n get _tabIndex(): number {\n if (this.overflows || this.nonSelectable) {\n return -1;\n }\n return 0;\n }\n\n get textDom(): HTMLElement {\n return this.getDomRef()!.querySelector(\".udex-tag__text\")!;\n }\n\n get isTruncatable(): boolean {\n if (!this.textDom) {\n return false;\n }\n\n return Math.ceil(this.textDom.getBoundingClientRect().width) < Math.ceil(this.textDom.scrollWidth);\n }\n\n get isInteractiveTag(): boolean {\n return !this.readOnly && !this.toBeDeleted && !this.nonSelectable;\n }\n\n get hasIcon(): boolean {\n return !!this.icon;\n }\n\n get iconAccessibleName(): string {\n return this.accessibleName || this.text;\n }\n\n tagLinkClickHandler(e: Event): void {\n this.fireDecoratorEvent(\"tagLinkClick\", { originalEvent: e });\n }\n}\n\nUDExTag.define();\n\nexport default UDExTag;\nexport type { UDExTagLinkClickEventDetail };\n"]}
@@ -1,8 +1,8 @@
1
- import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "@ui5/webcomponents-base/jsx-runtime";
1
+ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "@ui5/webcomponents-base/jsx-runtime";
2
2
  import UI5Icon from "@ui5/webcomponents/dist/Icon.js";
3
3
  export default function TagTemplate() {
4
4
  const rootClass = "udex-tag";
5
- return (this.readOnly ? (_jsx("div", { class: this.tagClasses, children: _jsx("span", { class: `${rootClass}__text`, children: this.text }) })) : this.href ? (_jsx("a", { class: this.tagClasses, role: this.accessibleRole, href: this.href, onClick: this.tagLinkClickHandler, children: tagContent.call(this, rootClass) })) : this.nonInteractive ? (_jsx("div", { class: this.tagClasses, children: tagContent.call(this, rootClass, false, false) })) : this.nonSelectable ? (_jsx("div", { class: this.tagClasses, children: tagContent.call(this, rootClass, false, true) })) : (_jsx("div", { tabindex: this._tabIndex, class: this.tagClasses, onClick: this.tagClickHandler, onFocusIn: this._focusin, onFocusOut: this._focusout, onKeyDown: this.tagKeyDown, role: this.accessibleRole, "aria-label": this.accessibleName, "aria-pressed": this.selected, children: tagContent.call(this, rootClass, true) })));
5
+ return (this.readOnly ? (_jsxs("div", { class: this.tagClasses, children: [this.startIcon && tagIcon.call(this, rootClass, "start"), _jsx("span", { class: `${rootClass}__text`, children: this.text }), this.endIcon && tagIcon.call(this, rootClass, "end")] })) : this.href ? (_jsx("a", { class: this.tagClasses, role: this.accessibleRole, href: this.href, onClick: this.tagLinkClickHandler, children: tagContent.call(this, rootClass) })) : this.nonInteractive ? (_jsx("div", { class: this.tagClasses, children: tagContent.call(this, rootClass, false, false) })) : this.nonSelectable ? (_jsx("div", { class: this.tagClasses, children: tagContent.call(this, rootClass, false, true) })) : (_jsx("div", { tabindex: this._tabIndex, class: this.tagClasses, onClick: this.tagClickHandler, onFocusIn: this._focusin, onFocusOut: this._focusout, onKeyDown: this.tagKeyDown, role: this.accessibleRole, "aria-label": this.accessibleName, "aria-pressed": this.selected, children: tagContent.call(this, rootClass, true) })));
6
6
  }
7
7
  function tagContent(rootClass, isIconClickable = false, isIconBtn = false) {
8
8
  return (_jsxs(_Fragment, { children: [this.startIcon && (isIconBtn ? tagBtnIcon.call(this, rootClass, "start")
@@ -1 +1 @@
1
- {"version":3,"file":"TagTemplate.js","sourceRoot":"","sources":["../src/TagTemplate.tsx"],"names":[],"mappings":"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","sourcesContent":["import type UDExTag from \"./Tag.js\";\nimport UI5Icon from \"@ui5/webcomponents/dist/Icon.js\";\nimport type { AriaRole } from \"@ui5/webcomponents-base/dist/types.js\";\n\nexport default function TagTemplate(this: UDExTag) {\n const rootClass = \"udex-tag\";\n\n return (\n this.readOnly ? (\n <div class={this.tagClasses}>\n <span class={`${rootClass}__text`}>{this.text}</span>\n </div>\n ) : this.href ? (\n <a class={this.tagClasses}\n role={this.accessibleRole as AriaRole}\n href={this.href}\n onClick={this.tagLinkClickHandler}>\n {tagContent.call(this, rootClass)}\n </a>\n ) : this.nonInteractive ? (\n <div class={this.tagClasses}>\n {tagContent.call(this, rootClass, false, false)}\n </div>\n ) : this.nonSelectable ? (\n <div class={this.tagClasses}>\n {tagContent.call(this, rootClass, false, true)}\n </div>\n ) : (\n <div\n tabindex={this._tabIndex}\n class={this.tagClasses}\n onClick={this.tagClickHandler}\n onFocusIn={this._focusin}\n onFocusOut={this._focusout}\n onKeyDown={this.tagKeyDown}\n role={this.accessibleRole as AriaRole}\n aria-label={this.accessibleName}\n aria-pressed={this.selected}>\n {tagContent.call(this, rootClass, true)}\n </div>\n )\n );\n}\n\nfunction tagContent(this: UDExTag, rootClass: string, isIconClickable: boolean = false, isIconBtn: boolean = false) {\n return (\n <>\n {this.startIcon && (\n isIconBtn ? tagBtnIcon.call(this, rootClass, \"start\")\n : tagIcon.call(this, rootClass, \"start\", isIconClickable))}\n <span class={`${rootClass}__text`}>{this.text}</span>\n {this.endIcon && (\n isIconBtn ? tagBtnIcon.call(this, rootClass, \"end\")\n : tagIcon.call(this, rootClass, \"end\", isIconClickable))}\n </>\n );\n}\n\nfunction tagBtnIcon(this: UDExTag, rootClass: string, iconType: string) {\n return (\n <>\n <button\n class={`${rootClass}__btn-icon`}\n onClick={this.iconClickHandler}\n role={this.accessibleRole as AriaRole}\n aria-label={this.iconAccessibleName}>\n {tagIcon.call(this, rootClass, iconType)}\n </button>\n </>\n );\n}\n\nfunction tagIcon(this: UDExTag, rootClass: string, iconType: string, isIconClickable: boolean = false) {\n return (\n <>\n <UI5Icon\n class={`${rootClass}__icon ${rootClass}__icon--${iconType}`}\n name={this.icon}\n onMouseDown={this._onIconMouseDown}\n {...(isIconClickable ? { onClick: this.iconClickHandler } : {})}>\n </UI5Icon>\n </>\n );\n}\n"]}
1
+ {"version":3,"file":"TagTemplate.js","sourceRoot":"","sources":["../src/TagTemplate.tsx"],"names":[],"mappings":";AACA,OAAO,OAAO,MAAM,iCAAiC,CAAC;AAGtD,MAAM,CAAC,OAAO,UAAU,WAAW;IACjC,MAAM,SAAS,GAAG,UAAU,CAAC;IAE7B,OAAO,CACL,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CACd,eAAK,KAAK,EAAE,IAAI,CAAC,UAAU,aACxB,IAAI,CAAC,SAAS,IAAI,OAAO,CAAC,IAAI,CAAC,IAAI,EAAE,SAAS,EAAE,OAAO,CAAC,EACzD,eAAM,KAAK,EAAE,GAAG,SAAS,QAAQ,YAAG,IAAI,CAAC,IAAI,GAAQ,EACpD,IAAI,CAAC,OAAO,IAAI,OAAO,CAAC,IAAI,CAAC,IAAI,EAAE,SAAS,EAAE,KAAK,CAAC,IACjD,CACP,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CACd,YAAG,KAAK,EAAE,IAAI,CAAC,UAAU,EACvB,IAAI,EAAE,IAAI,CAAC,cAA0B,EACrC,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,OAAO,EAAE,IAAI,CAAC,mBAAmB,YAChC,UAAU,CAAC,IAAI,CAAC,IAAI,EAAE,SAAS,CAAC,GAC/B,CACL,CAAC,CAAC,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,CACxB,cAAK,KAAK,EAAE,IAAI,CAAC,UAAU,YACxB,UAAU,CAAC,IAAI,CAAC,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,CAAC,GAC3C,CACP,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,CACvB,cAAK,KAAK,EAAE,IAAI,CAAC,UAAU,YACxB,UAAU,CAAC,IAAI,CAAC,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,CAAC,GAC1C,CACP,CAAC,CAAC,CAAC,CACF,cACE,QAAQ,EAAE,IAAI,CAAC,SAAS,EACxB,KAAK,EAAE,IAAI,CAAC,UAAU,EACtB,OAAO,EAAE,IAAI,CAAC,eAAe,EAC7B,SAAS,EAAE,IAAI,CAAC,QAAQ,EACxB,UAAU,EAAE,IAAI,CAAC,SAAS,EAC1B,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,IAAI,EAAE,IAAI,CAAC,cAA0B,gBACzB,IAAI,CAAC,cAAc,kBACjB,IAAI,CAAC,QAAQ,YAC1B,UAAU,CAAC,IAAI,CAAC,IAAI,EAAE,SAAS,EAAE,IAAI,CAAC,GACnC,CACP,CACF,CAAC;AACJ,CAAC;AAED,SAAS,UAAU,CAAgB,SAAiB,EAAE,kBAA2B,KAAK,EAAE,YAAqB,KAAK;IAChH,OAAO,CACL,8BACG,IAAI,CAAC,SAAS,IAAI,CACjB,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,EAAE,SAAS,EAAE,OAAO,CAAC;gBACnD,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,EAAE,SAAS,EAAE,OAAO,EAAE,eAAe,CAAC,CAAC,EAC9D,eAAM,KAAK,EAAE,GAAG,SAAS,QAAQ,YAAG,IAAI,CAAC,IAAI,GAAQ,EACpD,IAAI,CAAC,OAAO,IAAI,CACf,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,EAAE,SAAS,EAAE,KAAK,CAAC;gBACjD,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,eAAe,CAAC,CAAC,IAC3D,CACJ,CAAC;AACJ,CAAC;AAED,SAAS,UAAU,CAAgB,SAAiB,EAAE,QAAgB;IACpE,OAAO,CACL,4BACE,iBACE,KAAK,EAAE,GAAG,SAAS,YAAY,EAC/B,OAAO,EAAE,IAAI,CAAC,gBAAgB,EAC9B,IAAI,EAAE,IAAI,CAAC,cAA0B,gBACzB,IAAI,CAAC,kBAAkB,YAClC,OAAO,CAAC,IAAI,CAAC,IAAI,EAAE,SAAS,EAAE,QAAQ,CAAC,GACjC,GACR,CACJ,CAAC;AACJ,CAAC;AAED,SAAS,OAAO,CAAgB,SAAiB,EAAE,QAAgB,EAAE,kBAA2B,KAAK;IACnG,OAAO,CACL,4BACE,KAAC,OAAO,IACN,KAAK,EAAE,GAAG,SAAS,UAAU,SAAS,WAAW,QAAQ,EAAE,EAC3D,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,WAAW,EAAE,IAAI,CAAC,gBAAgB,KAC9B,CAAC,eAAe,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,IAAI,CAAC,gBAAgB,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,GACvD,GACT,CACJ,CAAC;AACJ,CAAC","sourcesContent":["import type UDExTag from \"./Tag.js\";\nimport UI5Icon from \"@ui5/webcomponents/dist/Icon.js\";\nimport type { AriaRole } from \"@ui5/webcomponents-base/dist/types.js\";\n\nexport default function TagTemplate(this: UDExTag) {\n const rootClass = \"udex-tag\";\n\n return (\n this.readOnly ? (\n <div class={this.tagClasses}>\n {this.startIcon && tagIcon.call(this, rootClass, \"start\")}\n <span class={`${rootClass}__text`}>{this.text}</span>\n {this.endIcon && tagIcon.call(this, rootClass, \"end\")}\n </div>\n ) : this.href ? (\n <a class={this.tagClasses}\n role={this.accessibleRole as AriaRole}\n href={this.href}\n onClick={this.tagLinkClickHandler}>\n {tagContent.call(this, rootClass)}\n </a>\n ) : this.nonInteractive ? (\n <div class={this.tagClasses}>\n {tagContent.call(this, rootClass, false, false)}\n </div>\n ) : this.nonSelectable ? (\n <div class={this.tagClasses}>\n {tagContent.call(this, rootClass, false, true)}\n </div>\n ) : (\n <div\n tabindex={this._tabIndex}\n class={this.tagClasses}\n onClick={this.tagClickHandler}\n onFocusIn={this._focusin}\n onFocusOut={this._focusout}\n onKeyDown={this.tagKeyDown}\n role={this.accessibleRole as AriaRole}\n aria-label={this.accessibleName}\n aria-pressed={this.selected}>\n {tagContent.call(this, rootClass, true)}\n </div>\n )\n );\n}\n\nfunction tagContent(this: UDExTag, rootClass: string, isIconClickable: boolean = false, isIconBtn: boolean = false) {\n return (\n <>\n {this.startIcon && (\n isIconBtn ? tagBtnIcon.call(this, rootClass, \"start\")\n : tagIcon.call(this, rootClass, \"start\", isIconClickable))}\n <span class={`${rootClass}__text`}>{this.text}</span>\n {this.endIcon && (\n isIconBtn ? tagBtnIcon.call(this, rootClass, \"end\")\n : tagIcon.call(this, rootClass, \"end\", isIconClickable))}\n </>\n );\n}\n\nfunction tagBtnIcon(this: UDExTag, rootClass: string, iconType: string) {\n return (\n <>\n <button\n class={`${rootClass}__btn-icon`}\n onClick={this.iconClickHandler}\n role={this.accessibleRole as AriaRole}\n aria-label={this.iconAccessibleName}>\n {tagIcon.call(this, rootClass, iconType)}\n </button>\n </>\n );\n}\n\nfunction tagIcon(this: UDExTag, rootClass: string, iconType: string, isIconClickable: boolean = false) {\n return (\n <>\n <UI5Icon\n class={`${rootClass}__icon ${rootClass}__icon--${iconType}`}\n name={this.icon}\n onMouseDown={this._onIconMouseDown}\n {...(isIconClickable ? { onClick: this.iconClickHandler } : {})}>\n </UI5Icon>\n </>\n );\n}\n"]}
@@ -2,6 +2,7 @@ import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
2
2
  import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js";
3
3
  import UDExValueState from "./types/common.js";
4
4
  import type UDExControlButtonDesign from "./types/ControlButtonDesign.js";
5
+ import type { ButtonAccessibilityAttributes } from "@ui5/webcomponents/dist/Button.js";
5
6
  export type AccInfo = {
6
7
  ariaInvalid?: string;
7
8
  ariaDescribedBy?: string;
@@ -249,6 +250,16 @@ declare class UDExTextField extends UI5Element {
249
250
  * @private
250
251
  */
251
252
  _ariaHasPopup?: string;
253
+ /**
254
+ * Sets aria-haspopup on the icon control button (e.g. "grid" for a date picker calendar popup).
255
+ * @private
256
+ */
257
+ _iconAriaHasPopup?: string;
258
+ /**
259
+ * Sets aria-expanded on the icon control button ("true" or "false").
260
+ * @private
261
+ */
262
+ _iconAriaExpanded?: string;
252
263
  /**
253
264
  * Defines is it the touch of the input field (only for mobile devices).
254
265
  * @default false
@@ -281,6 +292,7 @@ declare class UDExTextField extends UI5Element {
281
292
  get valueStateTextId(): string;
282
293
  get readOnlyStateTextId(): string;
283
294
  get accInfo(): AccInfo;
295
+ get iconAccessibilityAttributes(): ButtonAccessibilityAttributes | undefined;
284
296
  get inputRole(): string | undefined;
285
297
  get isAutoCompleteDisabled(): boolean;
286
298
  get readonlyNotDisabled(): boolean;
package/dist/TextField.js CHANGED
@@ -206,6 +206,15 @@ let UDExTextField = UDExTextField_1 = class UDExTextField extends UI5Element {
206
206
  "ariaHasPopup": this._ariaHasPopup || undefined,
207
207
  };
208
208
  }
209
+ get iconAccessibilityAttributes() {
210
+ if (!this._iconAriaHasPopup && !this._iconAriaExpanded) {
211
+ return undefined;
212
+ }
213
+ return {
214
+ ...(this._iconAriaHasPopup ? { hasPopup: this._iconAriaHasPopup } : {}),
215
+ ...(this._iconAriaExpanded ? { expanded: this._iconAriaExpanded } : {}),
216
+ };
217
+ }
209
218
  get inputRole() {
210
219
  return this.isAutoCompleteDisabled ? "presentation" : undefined;
211
220
  }
@@ -316,6 +325,12 @@ __decorate([
316
325
  __decorate([
317
326
  property({ type: String })
318
327
  ], UDExTextField.prototype, "_ariaHasPopup", void 0);
328
+ __decorate([
329
+ property({ type: String })
330
+ ], UDExTextField.prototype, "_iconAriaHasPopup", void 0);
331
+ __decorate([
332
+ property({ type: String })
333
+ ], UDExTextField.prototype, "_iconAriaExpanded", void 0);
319
334
  __decorate([
320
335
  property({ type: Boolean })
321
336
  ], UDExTextField.prototype, "_isTouched", void 0);
@@ -1 +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 jsxRenderer from \"@ui5/webcomponents-base/renderer/JsxRenderer.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport Icon from \"@ui5/webcomponents/dist/Icon.js\";\nimport { isDesktop } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport { getAllAccessibleNameRefTexts } from \"@ui5/webcomponents-base/dist/util/AccessibilityTextsHelper.js\";\nimport {\n VALUE_STATE_SUCCESS, VALUE_STATE_WARNING, VALUE_STATE_ERROR, READ_ONLY,\n} from \"./generated/i18n/i18n-defaults.js\";\nimport UDExControlButton from \"./ControlButton.js\";\nimport UDExValueState, { valueStateToControlButtonDesign } from \"./types/common.js\";\nimport type UDExControlButtonDesign from \"./types/ControlButtonDesign.js\";\nimport UDExStatusMessage from \"./StatusMessage.js\";\nimport TextFieldTemplate from \"./TextFieldTemplate.js\";\nimport translate from \"./utils/translate.js\";\n\n// Styles\nimport TextFieldCss from \"./generated/themes/TextField.css.js\";\n\nexport type AccInfo = {\n ariaInvalid?: string;\n ariaDescribedBy?: string;\n ariaLabelledBy?: string;\n ariaLabel?: string;\n ariaHasPopup?: string,\n}\n\ntype UDExTextFieldKeydownEventDetail = {\n keyboardEvent: KeyboardEvent;\n}\n\ntype UDExTextFieldChangeEventDetail = {\n originalEvent: Event,\n}\n\ntype UDExTextFieldBlurEventDetail = {\n originalEvent: FocusEvent,\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: jsxRenderer,\n styles: TextFieldCss,\n template: TextFieldTemplate,\n dependencies: [UDExControlButton, Icon, UDExStatusMessage],\n})\n\n/**\n * Fired when the value of the component changes at each keystroke.\n *\n * @public\n */\n@event(\"input\", { bubbles: true })\n/**\n * Fired when the input operation has finished by pressing Enter or on focusout.\n *\n * @public\n */\n@event(\"change\", { bubbles: true })\n/**\n * Fired on input focusout.\n *\n * @public\n */\n@event(\"blur\", { bubbles: true })\n/**\n * Fired event when the user clicks the icon.\n *\n * @private\n */\n@event(\"click-icon\", { bubbles: true })\n\n/**\n * Fired event when the key is pressed in the input.\n *\n * @private\n * @param {KeyboardEvent} keyboardEvent The native keyboard event.\n */\n@event(\"keydown\", { bubbles: true })\nclass UDExTextField extends UI5Element {\n eventDetails!: {\n \"keydown\": UDExTextFieldKeydownEventDetail,\n \"input\": void,\n \"change\": UDExTextFieldChangeEventDetail,\n \"blur\": UDExTextFieldBlurEventDetail,\n \"click-icon\": void,\n };\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({ type: Number })\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 * Defines the name of the input element.\n *\n * @default \"\"\n * @public\n */\n @property()\n name!: string;\n\n /**\n * Receives id (or many ids) of the elements that label the component.\n * @default \"\"\n * @public\n */\n @property()\n accessibleNameRef: string = \"\";\n\n /**\n * Defines the ref of the input element.\n *\n * @default undefined\n * @public\n */\n @property()\n fieldRef?: ((el: HTMLInputElement | null) => void) | { current: HTMLInputElement | null };\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()\n valueState: `${UDExValueState}` = UDExValueState.Standard;\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 if dropdown associated with text-field trigger has opened dropdown. It indicates active state of control button.\n *\n * @default false\n * @public\n */\n @property({ type: Boolean })\n iconActive!: boolean;\n\n /**\n * Defines the placeholder text of the input field.\n *\n * @default \"\"\n * @public\n */\n @property({ type: String })\n placeholder: string = \"\";\n\n /**\n * Defines the behaviour of autocomplete.\n * @default \"off\"\n * @public\n */\n @property({ type: String })\n autocomplete: string = \"off\";\n\n /**\n * Defines the inner stored show password button tooltip.\n *\n * @default \"\"\n * @private\n */\n\n @property({ type: String })\n buttonTooltip: string = \"\";\n\n /**\n * Defines the inner stored class of the label.\n *\n * @default \"\"\n * @private\n */\n @property({ type: String, noAttribute: true })\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 })\n labelClasses: string = \"\";\n\n /**\n * Defines the type of inner input field.\n * Note: Only URL and Email types can be used within this property. For other types, user should use dedicated UDEx component.\n * There is no custom logic on UDEx component side. Property is used only to pass it directly to html input element.\n *\n * @default \"Text\"\n * @public\n */\n @property({ type: String })\n type: \"Text\" | \"Email\" | \"Number\" | \"Password\" | \"Tel\" | \"URL\" | \"Search\" = \"Text\";\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({ type: Number })\n max?: number;\n\n /**\n * Defines the min value for the \"number\" type of the input.\n */\n @property({ type: Number })\n min?: number;\n\n /**\n * Defines the step for the \"number\" type of the input.\n * @default undefined\n */\n @property({ type: Number })\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-haspopup 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 /**\n * Determines Combobox role for the button.\n * @default false\n * @private\n */\n @property({ type: Boolean })\n _isComboboxRole?: boolean;\n\n @i18n(\"@sapudex/web-components\")\n static i18nBundle: I18nBundle;\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 handleKeydown(e: KeyboardEvent): void {\n e.stopPropagation();\n this.fireDecoratorEvent(\"keydown\", { keyboardEvent: e });\n }\n\n handleChange = (e: Event): void => {\n this.fireDecoratorEvent(\"change\", { originalEvent: e });\n };\n\n handleInput = (inputEvent: InputEvent) => {\n this.value = (inputEvent.target as HTMLInputElement)?.value;\n this.fireDecoratorEvent(\"input\");\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 = (e: FocusEvent): void => {\n this.fireDecoratorEvent(\"blur\", { originalEvent: e });\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 handleIconClick(): void {\n this.fireDecoratorEvent(\"click-icon\");\n }\n\n get _inputHolder(): HTMLElement {\n return this.shadowRoot!.querySelector<HTMLElement>(\".udex-text-field__wrap\")!;\n }\n\n get valueStateTypeMappings(): Record<string, string> {\n return {\n \"Success\": translate(UDExTextField, VALUE_STATE_SUCCESS),\n \"Standard\": \"\",\n \"Error\": translate(UDExTextField, VALUE_STATE_ERROR),\n \"Warning\": translate(UDExTextField, VALUE_STATE_WARNING),\n };\n }\n\n get hasValueState(): boolean {\n return this.valueState !== UDExValueState.Standard;\n }\n\n get valueStateText(): string {\n return this.valueState !== UDExValueState.Standard ? this.valueStateTypeMappings[this.valueState] : \"\";\n }\n\n get readOnlyStateText(): string {\n return translate(UDExTextField, 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 === UDExValueState.Error ? \"true\" : undefined,\n \"ariaDescribedBy\": this.ariaDescribedBy ? this.ariaDescribedBy : this.ariaDescribedById || undefined,\n \"ariaLabel\": getAllAccessibleNameRefTexts(this) || this.accessibleName || undefined,\n \"ariaHasPopup\": this._ariaHasPopup || undefined,\n };\n }\n\n get inputRole(): string | undefined {\n return this.isAutoCompleteDisabled ? \"presentation\" : undefined;\n }\n\n get isAutoCompleteDisabled(): boolean {\n return this.autocomplete === \"off\" || this.autocomplete === \"new-password\";\n }\n\n get readonlyNotDisabled(): boolean {\n return this.isInputReadonly && !this.disabled;\n }\n\n get buttonAccessibleName(): string {\n return this._isComboboxRole ? this.label : this.accessibleIconName || this.icon;\n }\n\n get buttonAccessibleDescription(): string {\n const label = this._isComboboxRole ? this.value : \"\";\n return `${label} ${this.supportingText || \"\"} ${this.valueStateText}`;\n }\n\n get controlButtonDesign(): UDExControlButtonDesign {\n return valueStateToControlButtonDesign[this.valueState];\n }\n}\n\nUDExTextField.define();\n\nexport default UDExTextField;\nexport type { UDExTextFieldKeydownEventDetail, UDExTextFieldChangeEventDetail, UDExTextFieldBlurEventDetail };\n"]}
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 jsxRenderer from \"@ui5/webcomponents-base/renderer/JsxRenderer.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport Icon from \"@ui5/webcomponents/dist/Icon.js\";\nimport { isDesktop } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport { getAllAccessibleNameRefTexts } from \"@ui5/webcomponents-base/dist/util/AccessibilityTextsHelper.js\";\nimport {\n VALUE_STATE_SUCCESS, VALUE_STATE_WARNING, VALUE_STATE_ERROR, READ_ONLY,\n} from \"./generated/i18n/i18n-defaults.js\";\nimport UDExControlButton from \"./ControlButton.js\";\nimport UDExValueState, { valueStateToControlButtonDesign } from \"./types/common.js\";\nimport type UDExControlButtonDesign from \"./types/ControlButtonDesign.js\";\nimport UDExStatusMessage from \"./StatusMessage.js\";\nimport TextFieldTemplate from \"./TextFieldTemplate.js\";\nimport translate from \"./utils/translate.js\";\nimport type { ButtonAccessibilityAttributes } from \"@ui5/webcomponents/dist/Button.js\";\n\n// Styles\nimport TextFieldCss from \"./generated/themes/TextField.css.js\";\n\nexport type AccInfo = {\n ariaInvalid?: string;\n ariaDescribedBy?: string;\n ariaLabelledBy?: string;\n ariaLabel?: string;\n ariaHasPopup?: string;\n}\n\ntype UDExTextFieldKeydownEventDetail = {\n keyboardEvent: KeyboardEvent;\n}\n\ntype UDExTextFieldChangeEventDetail = {\n originalEvent: Event,\n}\n\ntype UDExTextFieldBlurEventDetail = {\n originalEvent: FocusEvent,\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: jsxRenderer,\n styles: TextFieldCss,\n template: TextFieldTemplate,\n dependencies: [UDExControlButton, Icon, UDExStatusMessage],\n})\n\n/**\n * Fired when the value of the component changes at each keystroke.\n *\n * @public\n */\n@event(\"input\", { bubbles: true })\n/**\n * Fired when the input operation has finished by pressing Enter or on focusout.\n *\n * @public\n */\n@event(\"change\", { bubbles: true })\n/**\n * Fired on input focusout.\n *\n * @public\n */\n@event(\"blur\", { bubbles: true })\n/**\n * Fired event when the user clicks the icon.\n *\n * @private\n */\n@event(\"click-icon\", { bubbles: true })\n\n/**\n * Fired event when the key is pressed in the input.\n *\n * @private\n * @param {KeyboardEvent} keyboardEvent The native keyboard event.\n */\n@event(\"keydown\", { bubbles: true })\nclass UDExTextField extends UI5Element {\n eventDetails!: {\n \"keydown\": UDExTextFieldKeydownEventDetail,\n \"input\": void,\n \"change\": UDExTextFieldChangeEventDetail,\n \"blur\": UDExTextFieldBlurEventDetail,\n \"click-icon\": void,\n };\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({ type: Number })\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 * Defines the name of the input element.\n *\n * @default \"\"\n * @public\n */\n @property()\n name!: string;\n\n /**\n * Receives id (or many ids) of the elements that label the component.\n * @default \"\"\n * @public\n */\n @property()\n accessibleNameRef: string = \"\";\n\n /**\n * Defines the ref of the input element.\n *\n * @default undefined\n * @public\n */\n @property()\n fieldRef?: ((el: HTMLInputElement | null) => void) | { current: HTMLInputElement | null };\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()\n valueState: `${UDExValueState}` = UDExValueState.Standard;\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 if dropdown associated with text-field trigger has opened dropdown. It indicates active state of control button.\n *\n * @default false\n * @public\n */\n @property({ type: Boolean })\n iconActive!: boolean;\n\n /**\n * Defines the placeholder text of the input field.\n *\n * @default \"\"\n * @public\n */\n @property({ type: String })\n placeholder: string = \"\";\n\n /**\n * Defines the behaviour of autocomplete.\n * @default \"off\"\n * @public\n */\n @property({ type: String })\n autocomplete: string = \"off\";\n\n /**\n * Defines the inner stored show password button tooltip.\n *\n * @default \"\"\n * @private\n */\n\n @property({ type: String })\n buttonTooltip: string = \"\";\n\n /**\n * Defines the inner stored class of the label.\n *\n * @default \"\"\n * @private\n */\n @property({ type: String, noAttribute: true })\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 })\n labelClasses: string = \"\";\n\n /**\n * Defines the type of inner input field.\n * Note: Only URL and Email types can be used within this property. For other types, user should use dedicated UDEx component.\n * There is no custom logic on UDEx component side. Property is used only to pass it directly to html input element.\n *\n * @default \"Text\"\n * @public\n */\n @property({ type: String })\n type: \"Text\" | \"Email\" | \"Number\" | \"Password\" | \"Tel\" | \"URL\" | \"Search\" = \"Text\";\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({ type: Number })\n max?: number;\n\n /**\n * Defines the min value for the \"number\" type of the input.\n */\n @property({ type: Number })\n min?: number;\n\n /**\n * Defines the step for the \"number\" type of the input.\n * @default undefined\n */\n @property({ type: Number })\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-haspopup attribute of the input.\n * @private\n */\n @property({ type: String })\n _ariaHasPopup?: string;\n\n /**\n * Sets aria-haspopup on the icon control button (e.g. \"grid\" for a date picker calendar popup).\n * @private\n */\n @property({ type: String })\n _iconAriaHasPopup?: string;\n\n /**\n * Sets aria-expanded on the icon control button (\"true\" or \"false\").\n * @private\n */\n @property({ type: String })\n _iconAriaExpanded?: 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 /**\n * Determines Combobox role for the button.\n * @default false\n * @private\n */\n @property({ type: Boolean })\n _isComboboxRole?: boolean;\n\n @i18n(\"@sapudex/web-components\")\n static i18nBundle: I18nBundle;\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 handleKeydown(e: KeyboardEvent): void {\n e.stopPropagation();\n this.fireDecoratorEvent(\"keydown\", { keyboardEvent: e });\n }\n\n handleChange = (e: Event): void => {\n this.fireDecoratorEvent(\"change\", { originalEvent: e });\n };\n\n handleInput = (inputEvent: InputEvent) => {\n this.value = (inputEvent.target as HTMLInputElement)?.value;\n this.fireDecoratorEvent(\"input\");\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 = (e: FocusEvent): void => {\n this.fireDecoratorEvent(\"blur\", { originalEvent: e });\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 handleIconClick(): void {\n this.fireDecoratorEvent(\"click-icon\");\n }\n\n get _inputHolder(): HTMLElement {\n return this.shadowRoot!.querySelector<HTMLElement>(\".udex-text-field__wrap\")!;\n }\n\n get valueStateTypeMappings(): Record<string, string> {\n return {\n \"Success\": translate(UDExTextField, VALUE_STATE_SUCCESS),\n \"Standard\": \"\",\n \"Error\": translate(UDExTextField, VALUE_STATE_ERROR),\n \"Warning\": translate(UDExTextField, VALUE_STATE_WARNING),\n };\n }\n\n get hasValueState(): boolean {\n return this.valueState !== UDExValueState.Standard;\n }\n\n get valueStateText(): string {\n return this.valueState !== UDExValueState.Standard ? this.valueStateTypeMappings[this.valueState] : \"\";\n }\n\n get readOnlyStateText(): string {\n return translate(UDExTextField, 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 === UDExValueState.Error ? \"true\" : undefined,\n \"ariaDescribedBy\": this.ariaDescribedBy ? this.ariaDescribedBy : this.ariaDescribedById || undefined,\n \"ariaLabel\": getAllAccessibleNameRefTexts(this) || this.accessibleName || undefined,\n \"ariaHasPopup\": this._ariaHasPopup || undefined,\n };\n }\n\n get iconAccessibilityAttributes(): ButtonAccessibilityAttributes | undefined {\n if (!this._iconAriaHasPopup && !this._iconAriaExpanded) {\n return undefined;\n }\n return {\n ...(this._iconAriaHasPopup ? { hasPopup: this._iconAriaHasPopup as ButtonAccessibilityAttributes[\"hasPopup\"] } : {}),\n ...(this._iconAriaExpanded ? { expanded: this._iconAriaExpanded as ButtonAccessibilityAttributes[\"expanded\"] } : {}),\n };\n }\n\n get inputRole(): string | undefined {\n return this.isAutoCompleteDisabled ? \"presentation\" : undefined;\n }\n\n get isAutoCompleteDisabled(): boolean {\n return this.autocomplete === \"off\" || this.autocomplete === \"new-password\";\n }\n\n get readonlyNotDisabled(): boolean {\n return this.isInputReadonly && !this.disabled;\n }\n\n get buttonAccessibleName(): string {\n return this._isComboboxRole ? this.label : this.accessibleIconName || this.icon;\n }\n\n get buttonAccessibleDescription(): string {\n const label = this._isComboboxRole ? this.value : \"\";\n return `${label} ${this.supportingText || \"\"} ${this.valueStateText}`;\n }\n\n get controlButtonDesign(): UDExControlButtonDesign {\n return valueStateToControlButtonDesign[this.valueState];\n }\n}\n\nUDExTextField.define();\n\nexport default UDExTextField;\nexport type { UDExTextFieldKeydownEventDetail, UDExTextFieldChangeEventDetail, UDExTextFieldBlurEventDetail };\n"]}
@@ -6,7 +6,7 @@ export default function TextFieldTemplate() {
6
6
  const hiddenClass = "hidden-text";
7
7
  return (_jsxs("div", { class: `${rootClass}__container`, children: [this.label &&
8
8
  _jsxs("label", { for: `${this._id}-input`, class: this.labelClasses, part: "label", children: [this.label, this.required && " * "] }), _jsxs("div", { class: `${rootClass}__wrap`, children: [_jsx("input", { id: `${this._id}-input`, class: `${rootClass}__input`, type: this.type, value: this.value, maxlength: this.maxlength, disabled: this.disabled, readonly: this.isInputReadonly, required: this.required, "aria-required": this.required, "aria-readonly": this.isInputReadonly, placeholder: this.active || !this.label ? this.placeholder : undefined, autocomplete: this.autocomplete, role: this.inputRole, name: this.name, ref: this.fieldRef, "aria-disabled": this.readonlyNotDisabled, "aria-invalid": this.accInfo.ariaInvalid, "aria-describedby": this.accInfo.ariaDescribedBy, "aria-haspopup": this.accInfo.ariaHasPopup, "aria-label": this.accInfo.ariaLabel, part: "textfield-input", min: this.min, max: this.max, step: this.step, onChange: this.handleChange, onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur, onClick: this.handleClick, onKeyDown: this.handleKeydown }), this.icon &&
9
- _jsx(UDExControlButton, { part: "textfield-control-btn", class: `${rootClass}__icon-container`, size: "Large", tooltip: this.buttonTooltip, active: this.active, disabled: this.disabled, readonly: this.readonly, "non-interactive": this.readonly, design: this.controlButtonDesign, icon: this.icon, "_is-combobox-role": this._isComboboxRole, "accessible-name": this.buttonAccessibleName, "accessible-description": this.buttonAccessibleDescription, onClick: this.handleIconClick })] }), this.supportingText &&
9
+ _jsx(UDExControlButton, { part: "textfield-control-btn", class: `${rootClass}__icon-container`, size: "Large", tooltip: this.buttonTooltip, active: this.active, disabled: this.disabled, readonly: this.readonly, "non-interactive": this.readonly, design: this.controlButtonDesign, icon: this.icon, "_is-combobox-role": this._isComboboxRole, "accessible-name": this.buttonAccessibleName, "accessible-description": this.buttonAccessibleDescription, accessibilityAttributes: this.iconAccessibilityAttributes, onClick: this.handleIconClick })] }), this.supportingText &&
10
10
  _jsxs(_Fragment, { children: [_jsx(UDExStatusMessage, { "supporting-text": this.supportingText, "value-state": this.valueState, disabled: this.disabled ? "true" : undefined }), _jsx("span", { id: `${this._id}-supportingTextDesc`, class: hiddenClass, children: this.supportingText })] }), this.hasValueState &&
11
11
  _jsx("span", { id: `${this._id}-valueStateDesc`, class: hiddenClass, children: this.valueStateText }), this.readonly &&
12
12
  _jsx("span", { id: `${this._id}-stateReadOnlyDesc`, class: hiddenClass, children: this.readOnlyStateText })] }));
@@ -1 +1 @@
1
- {"version":3,"file":"TextFieldTemplate.js","sourceRoot":"","sources":["../src/TextFieldTemplate.tsx"],"names":[],"mappings":";AAGA,OAAO,iBAAiB,MAAM,oBAAoB,CAAC;AACnD,OAAO,iBAAiB,MAAM,oBAAoB,CAAC;AAEnD,MAAM,CAAC,OAAO,UAAU,iBAAiB;IACvC,MAAM,SAAS,GAAG,iBAAiB,CAAC;IACpC,MAAM,WAAW,GAAG,aAAa,CAAC;IAElC,OAAO,CACL,eAAK,KAAK,EAAE,GAAG,SAAS,aAAa,aAClC,IAAI,CAAC,KAAK;gBACT,iBAAO,GAAG,EAAE,GAAG,IAAI,CAAC,GAAG,QAAQ,EAAE,KAAK,EAAE,IAAI,CAAC,YAAY,EAAE,IAAI,EAAC,OAAO,aACpE,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,QAAQ,IAAI,KAAK,IAC7B,EAEV,eAAK,KAAK,EAAE,GAAG,SAAS,QAAQ,aAC9B,gBAAO,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,QAAQ,EAAE,KAAK,EAAE,GAAG,SAAS,SAAS,EAC1D,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,IAAI,CAAC,eAAe,EAC9B,QAAQ,EAAE,IAAI,CAAC,QAAQ,mBACR,IAAI,CAAC,QAAQ,mBACb,IAAI,CAAC,eAAe,EACnC,WAAW,EAAE,IAAI,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS,EACtE,YAAY,EAAE,IAAI,CAAC,YAAY,EAC/B,IAAI,EAAE,IAAI,CAAC,SAAqB,EAChC,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,GAAG,EAAE,IAAI,CAAC,QAAQ,mBACH,IAAI,CAAC,mBAAmB,kBACzB,IAAI,CAAC,OAAO,CAAC,WAAyB,sBAClC,IAAI,CAAC,OAAO,CAAC,eAAe,mBAC/B,IAAI,CAAC,OAAO,CAAC,YAA0B,gBAC1C,IAAI,CAAC,OAAO,CAAC,SAAS,EAClC,IAAI,EAAC,iBAAiB,EACtB,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,QAAQ,EAAE,IAAI,CAAC,YAAY,EAC3B,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,MAAM,EAAE,IAAI,CAAC,UAAU,EACvB,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,SAAS,EAAE,IAAI,CAAC,aAAa,GAAI,EAClC,IAAI,CAAC,IAAI;wBACR,KAAC,iBAAiB,IAChB,IAAI,EAAC,uBAAuB,EAC5B,KAAK,EAAE,GAAG,SAAS,kBAAkB,EACrC,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,IAAI,CAAC,aAAa,EAC3B,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ,qBACN,IAAI,CAAC,QAAQ,EAC9B,MAAM,EAAE,IAAI,CAAC,mBAAmB,EAChC,IAAI,EAAE,IAAI,CAAC,IAAI,uBACI,IAAI,CAAC,eAAe,qBACtB,IAAI,CAAC,oBAAoB,4BAClB,IAAI,CAAC,2BAA2B,EACxD,OAAO,EAAE,IAAI,CAAC,eAAe,GACX,IAElB,EACL,IAAI,CAAC,cAAc;gBAClB,8BACE,KAAC,iBAAiB,uBACC,IAAI,CAAC,cAAc,iBACvB,IAAI,CAAC,UAAU,EAC5B,QAAQ,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,GAC1B,EACpB,eAAM,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,qBAAqB,EAAE,KAAK,EAAE,WAAW,YAC3D,IAAI,CAAC,cAAc,GACf,IACN,EAEJ,IAAI,CAAC,aAAa;gBACjB,eAAM,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,iBAAiB,EAAE,KAAK,EAAE,WAAW,YACvD,IAAI,CAAC,cAAc,GACf,EAER,IAAI,CAAC,QAAQ;gBACZ,eAAM,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,oBAAoB,EAAE,KAAK,EAAE,WAAW,YAC1D,IAAI,CAAC,iBAAiB,GAClB,IAEL,CACP,CAAC;AACJ,CAAC","sourcesContent":["import type TextField from \"./TextField.js\";\nimport type { AriaRole } from \"@ui5/webcomponents-base/dist/types.js\";\nimport type { Booleanish } from \"@ui5/webcomponents-base/dist/thirdparty/preact/jsx.js\";\nimport UDExControlButton from \"./ControlButton.js\";\nimport UDExStatusMessage from \"./StatusMessage.js\";\n\nexport default function TextFieldTemplate(this: TextField) {\n const rootClass = \"udex-text-field\";\n const hiddenClass = \"hidden-text\";\n\n return (\n <div class={`${rootClass}__container`}>\n {this.label &&\n <label for={`${this._id}-input`} class={this.labelClasses} part=\"label\">\n {this.label}{this.required && \" * \"}\n </label>\n }\n <div class={`${rootClass}__wrap`}>\n <input id={`${this._id}-input`} class={`${rootClass}__input`}\n type={this.type}\n value={this.value}\n maxlength={this.maxlength}\n disabled={this.disabled}\n readonly={this.isInputReadonly}\n required={this.required}\n aria-required={this.required}\n aria-readonly={this.isInputReadonly}\n placeholder={this.active || !this.label ? this.placeholder : undefined}\n autocomplete={this.autocomplete}\n role={this.inputRole as AriaRole}\n name={this.name}\n ref={this.fieldRef}\n aria-disabled={this.readonlyNotDisabled}\n aria-invalid={this.accInfo.ariaInvalid as Booleanish}\n aria-describedby={this.accInfo.ariaDescribedBy}\n aria-haspopup={this.accInfo.ariaHasPopup as Booleanish}\n aria-label={this.accInfo.ariaLabel}\n part=\"textfield-input\"\n min={this.min}\n max={this.max}\n step={this.step}\n onChange={this.handleChange}\n onInput={this.handleInput}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n onClick={this.handleClick}\n onKeyDown={this.handleKeydown} />\n {this.icon &&\n <UDExControlButton\n part=\"textfield-control-btn\"\n class={`${rootClass}__icon-container`}\n size=\"Large\"\n tooltip={this.buttonTooltip}\n active={this.active}\n disabled={this.disabled}\n readonly={this.readonly}\n non-interactive={this.readonly}\n design={this.controlButtonDesign}\n icon={this.icon}\n _is-combobox-role={this._isComboboxRole}\n accessible-name={this.buttonAccessibleName}\n accessible-description={this.buttonAccessibleDescription}\n onClick={this.handleIconClick}>\n </UDExControlButton>\n }\n </div>\n {this.supportingText &&\n <>\n <UDExStatusMessage\n supporting-text={this.supportingText}\n value-state={this.valueState}\n disabled={this.disabled ? \"true\" : undefined}>\n </UDExStatusMessage>\n <span id={`${this._id}-supportingTextDesc`} class={hiddenClass}>\n {this.supportingText}\n </span>\n </>\n }\n {this.hasValueState &&\n <span id={`${this._id}-valueStateDesc`} class={hiddenClass}>\n {this.valueStateText}\n </span>\n }\n {this.readonly &&\n <span id={`${this._id}-stateReadOnlyDesc`} class={hiddenClass}>\n {this.readOnlyStateText}\n </span>\n }\n </div>\n );\n}\n"]}
1
+ {"version":3,"file":"TextFieldTemplate.js","sourceRoot":"","sources":["../src/TextFieldTemplate.tsx"],"names":[],"mappings":"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","sourcesContent":["import type TextField from \"./TextField.js\";\nimport type { AriaRole } from \"@ui5/webcomponents-base/dist/types.js\";\nimport type { Booleanish } from \"@ui5/webcomponents-base/dist/thirdparty/preact/jsx.js\";\nimport UDExControlButton from \"./ControlButton.js\";\nimport UDExStatusMessage from \"./StatusMessage.js\";\n\nexport default function TextFieldTemplate(this: TextField) {\n const rootClass = \"udex-text-field\";\n const hiddenClass = \"hidden-text\";\n\n return (\n <div class={`${rootClass}__container`}>\n {this.label &&\n <label for={`${this._id}-input`} class={this.labelClasses} part=\"label\">\n {this.label}{this.required && \" * \"}\n </label>\n }\n <div class={`${rootClass}__wrap`}>\n <input id={`${this._id}-input`} class={`${rootClass}__input`}\n type={this.type}\n value={this.value}\n maxlength={this.maxlength}\n disabled={this.disabled}\n readonly={this.isInputReadonly}\n required={this.required}\n aria-required={this.required}\n aria-readonly={this.isInputReadonly}\n placeholder={this.active || !this.label ? this.placeholder : undefined}\n autocomplete={this.autocomplete}\n role={this.inputRole as AriaRole}\n name={this.name}\n ref={this.fieldRef}\n aria-disabled={this.readonlyNotDisabled}\n aria-invalid={this.accInfo.ariaInvalid as Booleanish}\n aria-describedby={this.accInfo.ariaDescribedBy}\n aria-haspopup={this.accInfo.ariaHasPopup as Booleanish}\n aria-label={this.accInfo.ariaLabel}\n part=\"textfield-input\"\n min={this.min}\n max={this.max}\n step={this.step}\n onChange={this.handleChange}\n onInput={this.handleInput}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n onClick={this.handleClick}\n onKeyDown={this.handleKeydown} />\n {this.icon &&\n <UDExControlButton\n part=\"textfield-control-btn\"\n class={`${rootClass}__icon-container`}\n size=\"Large\"\n tooltip={this.buttonTooltip}\n active={this.active}\n disabled={this.disabled}\n readonly={this.readonly}\n non-interactive={this.readonly}\n design={this.controlButtonDesign}\n icon={this.icon}\n _is-combobox-role={this._isComboboxRole}\n accessible-name={this.buttonAccessibleName}\n accessible-description={this.buttonAccessibleDescription}\n accessibilityAttributes={this.iconAccessibilityAttributes}\n onClick={this.handleIconClick}>\n </UDExControlButton>\n }\n </div>\n {this.supportingText &&\n <>\n <UDExStatusMessage\n supporting-text={this.supportingText}\n value-state={this.valueState}\n disabled={this.disabled ? \"true\" : undefined}>\n </UDExStatusMessage>\n <span id={`${this._id}-supportingTextDesc`} class={hiddenClass}>\n {this.supportingText}\n </span>\n </>\n }\n {this.hasValueState &&\n <span id={`${this._id}-valueStateDesc`} class={hiddenClass}>\n {this.valueStateText}\n </span>\n }\n {this.readonly &&\n <span id={`${this._id}-stateReadOnlyDesc`} class={hiddenClass}>\n {this.readOnlyStateText}\n </span>\n }\n </div>\n );\n}\n"]}