@sapudex/web-components 0.184.0 → 0.192.2
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.
- package/dist/CountrySelector.d.ts +2 -0
- package/dist/CountrySelector.js +5 -1
- package/dist/CountrySelector.js.map +1 -1
- package/dist/MastheadItem.d.ts +10 -1
- package/dist/MastheadItem.js +11 -5
- package/dist/MastheadItem.js.map +1 -1
- package/dist/MastheadMenu.d.ts +6 -0
- package/dist/MastheadMenu.js +3 -0
- package/dist/MastheadMenu.js.map +1 -1
- package/dist/MastheadMenuItem.d.ts +1 -0
- package/dist/MastheadMenuItem.js +3 -0
- package/dist/MastheadMenuItem.js.map +1 -1
- package/dist/MastheadProfileMenu.d.ts +6 -0
- package/dist/MastheadProfileMenu.js +3 -0
- package/dist/MastheadProfileMenu.js.map +1 -1
- package/dist/MastheadShell.d.ts +34 -4
- package/dist/MastheadShell.js +122 -11
- package/dist/MastheadShell.js.map +1 -1
- package/dist/Pagination.d.ts +3 -2
- package/dist/Pagination.js +4 -2
- package/dist/Pagination.js.map +1 -1
- package/dist/SelectBox.d.ts +2 -0
- package/dist/SelectBox.js +5 -1
- package/dist/SelectBox.js.map +1 -1
- package/dist/Tab.d.ts +4 -13
- package/dist/Tab.js +11 -14
- package/dist/Tab.js.map +1 -1
- package/dist/TabNavigation.js +0 -1
- package/dist/TabNavigation.js.map +1 -1
- package/dist/TextArea.d.ts +13 -22
- package/dist/TextArea.js +30 -33
- package/dist/TextArea.js.map +1 -1
- package/dist/assets/{bundle.esm-d98e72b5.js → bundle.esm-809b9769.js} +177 -177
- package/dist/assets/messagebundle_en-06c0dadc.js +1 -0
- package/dist/css/themes/CountrySelector.css +1 -1
- package/dist/css/themes/MastheadItem.css +1 -1
- package/dist/css/themes/MastheadMenu.css +1 -1
- package/dist/css/themes/MastheadMenuItem.css +1 -1
- package/dist/css/themes/MastheadProfileMenu.css +1 -1
- package/dist/css/themes/MastheadShell.css +1 -1
- package/dist/css/themes/MediaPlayer.css +1 -1
- package/dist/css/themes/RatingIndicator.css +1 -1
- package/dist/css/themes/Search.css +1 -1
- package/dist/css/themes/Slider.css +1 -1
- package/dist/css/themes/TextArea.css +1 -1
- package/dist/custom-elements-internal.json +14 -12
- package/dist/custom-elements.json +14 -12
- package/dist/generated/assets/i18n/messagebundle_en.json +1 -1
- package/dist/generated/i18n/i18n-defaults.d.ts +2 -1
- package/dist/generated/i18n/i18n-defaults.js +2 -1
- package/dist/generated/i18n/i18n-defaults.js.map +1 -1
- package/dist/generated/templates/MastheadItemTemplate.lit.js +3 -3
- package/dist/generated/templates/MastheadItemTemplate.lit.js.map +1 -1
- package/dist/generated/templates/MastheadMenuItemTemplate.lit.js +2 -2
- package/dist/generated/templates/MastheadMenuItemTemplate.lit.js.map +1 -1
- package/dist/generated/templates/MastheadShellTemplate.lit.js +8 -9
- package/dist/generated/templates/MastheadShellTemplate.lit.js.map +1 -1
- package/dist/generated/templates/PaginationTemplate.lit.js +1 -1
- package/dist/generated/templates/PaginationTemplate.lit.js.map +1 -1
- package/dist/generated/templates/TabHeaderTemplate.lit.js +1 -1
- package/dist/generated/templates/TabHeaderTemplate.lit.js.map +1 -1
- package/dist/generated/templates/TabNavigationTemplate.lit.js +1 -1
- package/dist/generated/templates/TabNavigationTemplate.lit.js.map +1 -1
- package/dist/generated/templates/TextAreaTemplate.lit.js +5 -4
- package/dist/generated/templates/TextAreaTemplate.lit.js.map +1 -1
- package/dist/generated/templates/TextFieldTemplate.lit.js +1 -1
- package/dist/generated/templates/TextFieldTemplate.lit.js.map +1 -1
- package/dist/generated/themes/CountrySelector.css.js +1 -1
- package/dist/generated/themes/CountrySelector.css.js.map +1 -1
- package/dist/generated/themes/MastheadItem.css.js +1 -1
- package/dist/generated/themes/MastheadItem.css.js.map +1 -1
- package/dist/generated/themes/MastheadMenu.css.js +1 -1
- package/dist/generated/themes/MastheadMenu.css.js.map +1 -1
- package/dist/generated/themes/MastheadMenuItem.css.js +1 -1
- package/dist/generated/themes/MastheadMenuItem.css.js.map +1 -1
- package/dist/generated/themes/MastheadProfileMenu.css.js +1 -1
- package/dist/generated/themes/MastheadProfileMenu.css.js.map +1 -1
- package/dist/generated/themes/MastheadShell.css.js +1 -1
- package/dist/generated/themes/MastheadShell.css.js.map +1 -1
- package/dist/generated/themes/MediaPlayer.css.js +1 -1
- package/dist/generated/themes/MediaPlayer.css.js.map +1 -1
- package/dist/generated/themes/RatingIndicator.css.js +1 -1
- package/dist/generated/themes/RatingIndicator.css.js.map +1 -1
- package/dist/generated/themes/Search.css.js +1 -1
- package/dist/generated/themes/Search.css.js.map +1 -1
- package/dist/generated/themes/Slider.css.js +1 -1
- package/dist/generated/themes/Slider.css.js.map +1 -1
- package/dist/generated/themes/TextArea.css.js +1 -1
- package/dist/generated/themes/TextArea.css.js.map +1 -1
- package/dist/i18n/messagebundle.properties +3 -0
- package/dist/i18n/messagebundle_en.properties +1 -0
- package/dist/web-types.json +3 -3
- package/package.json +1 -1
- package/src/CountrySelector.hbs +30 -30
- package/src/CountrySelector.ts +18 -13
- package/src/MastheadItem.hbs +3 -3
- package/src/MastheadItem.ts +22 -10
- package/src/MastheadMenu.ts +8 -0
- package/src/MastheadMenuItem.hbs +2 -1
- package/src/MastheadMenuItem.ts +4 -0
- package/src/MastheadProfileMenu.ts +8 -0
- package/src/MastheadShell.hbs +69 -67
- package/src/MastheadShell.ts +154 -16
- package/src/Pagination.hbs +2 -2
- package/src/Pagination.ts +8 -5
- package/src/SelectBox.ts +7 -1
- package/src/Tab.ts +18 -29
- package/src/TabHeader.hbs +1 -1
- package/src/TabNavigation.hbs +1 -2
- package/src/TabNavigation.ts +2 -1
- package/src/TextArea.hbs +21 -21
- package/src/TextArea.ts +82 -78
- package/src/TextField.hbs +4 -2
- package/src/generated/i18n/i18n-defaults.ts +2 -2
- package/src/generated/templates/MastheadItemTemplate.lit.ts +3 -3
- package/src/generated/templates/MastheadMenuItemTemplate.lit.ts +2 -2
- package/src/generated/templates/MastheadShellTemplate.lit.ts +8 -9
- package/src/generated/templates/PaginationTemplate.lit.ts +1 -1
- package/src/generated/templates/TabHeaderTemplate.lit.ts +1 -1
- package/src/generated/templates/TabNavigationTemplate.lit.ts +1 -1
- package/src/generated/templates/TextAreaTemplate.lit.ts +5 -4
- package/src/generated/templates/TextFieldTemplate.lit.ts +1 -1
- package/src/generated/themes/CountrySelector.css.ts +1 -1
- package/src/generated/themes/MastheadItem.css.ts +1 -1
- package/src/generated/themes/MastheadMenu.css.ts +1 -1
- package/src/generated/themes/MastheadMenuItem.css.ts +1 -1
- package/src/generated/themes/MastheadProfileMenu.css.ts +1 -1
- package/src/generated/themes/MastheadShell.css.ts +1 -1
- package/src/generated/themes/MediaPlayer.css.ts +1 -1
- package/src/generated/themes/RatingIndicator.css.ts +1 -1
- package/src/generated/themes/Search.css.ts +1 -1
- package/src/generated/themes/Slider.css.ts +1 -1
- package/src/generated/themes/TextArea.css.ts +1 -1
- package/src/i18n/messagebundle.properties +3 -0
- package/src/i18n/messagebundle_en.properties +1 -0
- package/src/themes/CountrySelector.css +23 -16
- package/src/themes/MastheadItem.css +40 -2
- package/src/themes/MastheadMenu.css +72 -0
- package/src/themes/MastheadMenuItem.css +1 -0
- package/src/themes/MastheadProfileMenu.css +8 -0
- package/src/themes/MastheadShell.css +59 -27
- package/src/themes/MediaPlayer.css +18 -9
- package/src/themes/Search.css +4 -4
- package/src/themes/TextArea.css +12 -1
- package/dist/assets/messagebundle_en-4997b226.js +0 -1
package/dist/TextArea.d.ts
CHANGED
|
@@ -4,12 +4,7 @@ import "@ui5/webcomponents/dist/Icon.js";
|
|
|
4
4
|
import "@ui5/webcomponents-icons/dist/accept.js";
|
|
5
5
|
import "@ui5/webcomponents-icons/dist/error.js";
|
|
6
6
|
import "@ui5/webcomponents-icons/dist/alert.js";
|
|
7
|
-
|
|
8
|
-
Standard = "Standard",
|
|
9
|
-
Warning = "Warning",
|
|
10
|
-
Error = "Error",
|
|
11
|
-
Success = "Success"
|
|
12
|
-
}
|
|
7
|
+
import ValueState from "./types/common.js";
|
|
13
8
|
/**
|
|
14
9
|
* @class
|
|
15
10
|
*
|
|
@@ -83,7 +78,7 @@ declare class UDExTextArea extends UI5Element {
|
|
|
83
78
|
* @default "Standard"
|
|
84
79
|
* @public
|
|
85
80
|
*/
|
|
86
|
-
fieldState: `${
|
|
81
|
+
fieldState: `${ValueState}`;
|
|
87
82
|
/**
|
|
88
83
|
* Defines whether the component is required.
|
|
89
84
|
*
|
|
@@ -167,26 +162,22 @@ declare class UDExTextArea extends UI5Element {
|
|
|
167
162
|
_isTouched: boolean;
|
|
168
163
|
static i18nBundle: I18nBundle;
|
|
169
164
|
static onDefine(): Promise<void>;
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
get fieldStateTypeMappings(): {
|
|
173
|
-
Success: string;
|
|
174
|
-
Standard: string;
|
|
175
|
-
Error: string;
|
|
176
|
-
Warning: string;
|
|
177
|
-
};
|
|
178
|
-
get ariaValueStateHiddenText(): string | undefined;
|
|
179
|
-
get readOnlyText(): string;
|
|
180
|
-
get ariaDescribedBy(): string | undefined;
|
|
181
|
-
get _supportingText(): string | undefined;
|
|
165
|
+
onBeforeRendering(): void;
|
|
166
|
+
onAfterRendering(): void;
|
|
182
167
|
handleInput: (event: InputEvent) => void;
|
|
183
168
|
handleChange: () => void;
|
|
184
169
|
handleGrowing: () => void;
|
|
185
170
|
handleFocus: () => void;
|
|
186
171
|
handleClick(): void;
|
|
187
172
|
handleBlur: () => void;
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
173
|
+
getInputDomRef(): HTMLTextAreaElement;
|
|
174
|
+
get hasValueState(): boolean;
|
|
175
|
+
get fieldStateTypeMappings(): Record<string, string>;
|
|
176
|
+
get ariaValueStateHiddenText(): string | undefined;
|
|
177
|
+
get readOnlyText(): string;
|
|
178
|
+
get ariaDescribedBy(): string | undefined;
|
|
179
|
+
get _supportingText(): string | undefined;
|
|
180
|
+
get ariaInvalid(): string | null;
|
|
181
|
+
get textHiddenLabel(): string;
|
|
191
182
|
}
|
|
192
183
|
export default UDExTextArea;
|
package/dist/TextArea.js
CHANGED
|
@@ -13,22 +13,16 @@ import getEffectiveScrollbarStyle from "@ui5/webcomponents-base/dist/util/getEff
|
|
|
13
13
|
import Integer from "@ui5/webcomponents-base/dist/types/Integer.js";
|
|
14
14
|
import { getI18nBundle } from "@ui5/webcomponents-base/dist/i18nBundle.js";
|
|
15
15
|
import { isDesktop } from "@ui5/webcomponents-base/dist/Device.js";
|
|
16
|
-
import { READ_ONLY, TEXTAREA_CHARACTERS_LEFT, VALUE_STATE_TYPE_ERROR, VALUE_STATE_TYPE_STANDARD, VALUE_STATE_TYPE_SUCCESS, VALUE_STATE_TYPE_WARNING, } from "./generated/i18n/i18n-defaults.js";
|
|
16
|
+
import { READ_ONLY, TEXTAREA_CHARACTERS_LEFT, TEXT_FIELD, VALUE_STATE_TYPE_ERROR, VALUE_STATE_TYPE_STANDARD, VALUE_STATE_TYPE_SUCCESS, VALUE_STATE_TYPE_WARNING, } from "./generated/i18n/i18n-defaults.js";
|
|
17
17
|
import "@ui5/webcomponents/dist/Icon.js";
|
|
18
18
|
import "@ui5/webcomponents-icons/dist/accept.js";
|
|
19
19
|
import "@ui5/webcomponents-icons/dist/error.js";
|
|
20
20
|
import "@ui5/webcomponents-icons/dist/alert.js";
|
|
21
|
+
import UDExStatusMessage from "./StatusMessage.js";
|
|
22
|
+
import ValueState from "./types/common.js";
|
|
21
23
|
import TextAreaTemplate from "./generated/templates/TextAreaTemplate.lit.js";
|
|
22
24
|
// Styles
|
|
23
25
|
import TextAreaCss from "./generated/themes/TextArea.css.js";
|
|
24
|
-
import UDExStatusMessage from "./StatusMessage.js";
|
|
25
|
-
export var FieldState;
|
|
26
|
-
(function (FieldState) {
|
|
27
|
-
FieldState["Standard"] = "Standard";
|
|
28
|
-
FieldState["Warning"] = "Warning";
|
|
29
|
-
FieldState["Error"] = "Error";
|
|
30
|
-
FieldState["Success"] = "Success";
|
|
31
|
-
})(FieldState || (FieldState = {}));
|
|
32
26
|
/**
|
|
33
27
|
* @class
|
|
34
28
|
*
|
|
@@ -88,11 +82,26 @@ let UDExTextArea = UDExTextArea_1 = class UDExTextArea extends UI5Element {
|
|
|
88
82
|
static async onDefine() {
|
|
89
83
|
UDExTextArea_1.i18nBundle = await getI18nBundle("@udex/web-components");
|
|
90
84
|
}
|
|
85
|
+
onBeforeRendering() {
|
|
86
|
+
if (this.value && this.labelActiveClass === "") {
|
|
87
|
+
this.labelActiveClass = this._labelActiveClassName;
|
|
88
|
+
}
|
|
89
|
+
this.isInputReadonly = this.readonly || this.displayonly;
|
|
90
|
+
this.labelClasses = `udex-textarea__label ${this.labelActiveClass}`;
|
|
91
|
+
}
|
|
92
|
+
onAfterRendering() {
|
|
93
|
+
this.handleGrowing();
|
|
94
|
+
}
|
|
95
|
+
handleClick() {
|
|
96
|
+
if (!isDesktop()) {
|
|
97
|
+
this._isTouched = true;
|
|
98
|
+
}
|
|
99
|
+
}
|
|
91
100
|
getInputDomRef() {
|
|
92
101
|
return this.getDomRef().querySelector("textarea");
|
|
93
102
|
}
|
|
94
103
|
get hasValueState() {
|
|
95
|
-
return this.fieldState ===
|
|
104
|
+
return this.fieldState === ValueState.Error || this.fieldState === ValueState.Warning || this.fieldState === ValueState.Success;
|
|
96
105
|
}
|
|
97
106
|
get fieldStateTypeMappings() {
|
|
98
107
|
return {
|
|
@@ -106,7 +115,7 @@ let UDExTextArea = UDExTextArea_1 = class UDExTextArea extends UI5Element {
|
|
|
106
115
|
if (!this.hasValueState) {
|
|
107
116
|
return;
|
|
108
117
|
}
|
|
109
|
-
if (this.fieldState ===
|
|
118
|
+
if (this.fieldState === ValueState.Standard) {
|
|
110
119
|
return;
|
|
111
120
|
}
|
|
112
121
|
return `${this.fieldStateTypeMappings[this.fieldState]}`;
|
|
@@ -135,30 +144,18 @@ let UDExTextArea = UDExTextArea_1 = class UDExTextArea extends UI5Element {
|
|
|
135
144
|
}
|
|
136
145
|
}
|
|
137
146
|
}
|
|
138
|
-
handleClick() {
|
|
139
|
-
if (!isDesktop()) {
|
|
140
|
-
this._isTouched = true;
|
|
141
|
-
}
|
|
142
|
-
}
|
|
143
147
|
get ariaInvalid() {
|
|
144
|
-
return this.fieldState ===
|
|
148
|
+
return this.fieldState === ValueState.Error ? "true" : null;
|
|
145
149
|
}
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
this.labelActiveClass = this._labelActiveClassName;
|
|
149
|
-
}
|
|
150
|
-
this.isInputReadonly = this.readonly || this.displayonly;
|
|
151
|
-
this.labelClasses = `udex-textarea__label ${this.labelActiveClass}`;
|
|
152
|
-
}
|
|
153
|
-
onAfterRendering() {
|
|
154
|
-
this.handleGrowing();
|
|
150
|
+
get textHiddenLabel() {
|
|
151
|
+
return UDExTextArea_1.i18nBundle.getText(TEXT_FIELD);
|
|
155
152
|
}
|
|
156
153
|
};
|
|
157
154
|
__decorate([
|
|
158
|
-
property({ type: String
|
|
155
|
+
property({ type: String })
|
|
159
156
|
], UDExTextArea.prototype, "label", void 0);
|
|
160
157
|
__decorate([
|
|
161
|
-
property({ type: String
|
|
158
|
+
property({ type: String })
|
|
162
159
|
], UDExTextArea.prototype, "value", void 0);
|
|
163
160
|
__decorate([
|
|
164
161
|
property({ validator: Integer })
|
|
@@ -170,13 +167,13 @@ __decorate([
|
|
|
170
167
|
property({ validator: Integer, defaultValue: 0 })
|
|
171
168
|
], UDExTextArea.prototype, "growingMaxLines", void 0);
|
|
172
169
|
__decorate([
|
|
173
|
-
property({ type: String
|
|
170
|
+
property({ type: String })
|
|
174
171
|
], UDExTextArea.prototype, "supportingText", void 0);
|
|
175
172
|
__decorate([
|
|
176
173
|
property({ validator: Integer })
|
|
177
174
|
], UDExTextArea.prototype, "maxlength", void 0);
|
|
178
175
|
__decorate([
|
|
179
|
-
property({ type:
|
|
176
|
+
property({ type: ValueState, defaultValue: ValueState.Standard })
|
|
180
177
|
], UDExTextArea.prototype, "fieldState", void 0);
|
|
181
178
|
__decorate([
|
|
182
179
|
property({ type: Boolean })
|
|
@@ -194,16 +191,16 @@ __decorate([
|
|
|
194
191
|
property({ type: Boolean, noAttribute: true })
|
|
195
192
|
], UDExTextArea.prototype, "isInputReadonly", void 0);
|
|
196
193
|
__decorate([
|
|
197
|
-
property({ type: String, noAttribute: true
|
|
194
|
+
property({ type: String, noAttribute: true })
|
|
198
195
|
], UDExTextArea.prototype, "labelClasses", void 0);
|
|
199
196
|
__decorate([
|
|
200
|
-
property({ type: String, noAttribute: true
|
|
197
|
+
property({ type: String, noAttribute: true })
|
|
201
198
|
], UDExTextArea.prototype, "labelActiveClass", void 0);
|
|
202
199
|
__decorate([
|
|
203
200
|
property()
|
|
204
201
|
], UDExTextArea.prototype, "accessibleName", void 0);
|
|
205
202
|
__decorate([
|
|
206
|
-
property({
|
|
203
|
+
property({ type: String })
|
|
207
204
|
], UDExTextArea.prototype, "accessibleNameRef", void 0);
|
|
208
205
|
__decorate([
|
|
209
206
|
property({ type: Boolean })
|
package/dist/TextArea.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextArea.js","sourceRoot":"","sources":["../src/TextArea.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport getEffectiveScrollbarStyle from \"@ui5/webcomponents-base/dist/util/getEffectiveScrollbarStyle.js\";\nimport Integer from \"@ui5/webcomponents-base/dist/types/Integer.js\";\nimport { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport { isDesktop } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport {\n READ_ONLY, TEXTAREA_CHARACTERS_LEFT, VALUE_STATE_TYPE_ERROR, VALUE_STATE_TYPE_STANDARD, VALUE_STATE_TYPE_SUCCESS, VALUE_STATE_TYPE_WARNING,\n} from \"./generated/i18n/i18n-defaults.js\";\n\nimport \"@ui5/webcomponents/dist/Icon.js\";\nimport \"@ui5/webcomponents-icons/dist/accept.js\";\nimport \"@ui5/webcomponents-icons/dist/error.js\";\nimport \"@ui5/webcomponents-icons/dist/alert.js\";\n\nimport TextAreaTemplate from \"./generated/templates/TextAreaTemplate.lit.js\";\n\n// Styles\nimport TextAreaCss from \"./generated/themes/TextArea.css.js\";\nimport UDExStatusMessage from \"./StatusMessage.js\";\n\nexport enum FieldState {\n Standard = \"Standard\",\n Warning = \"Warning\",\n Error = \"Error\",\n Success = \"Success\",\n}\n\n/**\n * @class\n *\n * @constructor\n * @extends UI5Element\n * @tagname udex-text-area\n * @public\n */\n@customElement({\n tag: \"udex-textarea\",\n renderer: litRender,\n styles: [TextAreaCss, getEffectiveScrollbarStyle()],\n template: TextAreaTemplate,\n dependencies: [UDExStatusMessage],\n})\n\nclass UDExTextArea extends UI5Element {\n _labelActiveClassName = \"udex-textarea__label--active\";\n\n /**\n * Defines label text for the textarea field.\n *\n * @default \"\"\n * @public\n */\n @property({ type: String, defaultValue: \"\" })\n label!: string;\n\n /**\n * Defines the value of the component.\n * <br><br>\n * <b>Note:</b> The property is updated upon typing.\n *\n * @default \"\"\n * @public\n */\n @property({ type: String, defaultValue: \"\" })\n value!: string;\n\n /**\n * Defines the number of visible text lines for the component.\n * <br><br>\n * <b>Notes:</b>\n * <ul>\n * <li>If the <code>growing</code> property is enabled, this property defines the minimum rows to be displayed\n * in the textarea.</li>\n * <li>The CSS <code>height</code> property wins over the <code>rows</code> property, if both are set.</li>\n * </ul>\n *\n * @public\n */\n @property({ validator: Integer })\n rows!: number;\n\n /**\n * Enables the component to automatically grow and shrink dynamically with its content.\n * <br><br>\n *\n * @default false\n * @public\n */\n @property({ type: Boolean })\n growing!: boolean;\n\n /**\n * Defines the maximum number of lines that the component can grow.\n *\n * @default 0\n * @public\n */\n @property({ validator: Integer, defaultValue: 0 })\n growingMaxLines!: number;\n\n /**\n * Defines supporting text under the input field.\n *\n * @default \"\"\n * @public\n */\n @property({ type: String, defaultValue: \"\" })\n supportingText!: string;\n\n /**\n * Sets the maximum number of characters available in the textarea.\n *\n * @public\n */\n @property({ validator: Integer })\n maxlength?: number;\n\n /**\n * Defines the value state of the component.\n *\n * @default \"Standard\"\n * @public\n */\n @property({ type: FieldState, defaultValue: FieldState.Standard })\n fieldState!: `${FieldState}`;\n\n /**\n * Defines whether the component is required.\n *\n * @default false\n * @public\n */\n @property({ type: Boolean })\n required!: boolean;\n\n /**\n * Defines whether the component is in disabled state.\n * <br><br>\n * <b>Note:</b> A disabled component is completely noninteractive.\n *\n * @default false\n * @public\n */\n @property({ type: Boolean })\n disabled!: boolean;\n\n /**\n * Defines whether the component is read-only.\n * <br><br>\n * <b>Note:</b> A read-only component is not editable,\n * but still provides visual feedback upon user interaction.\n *\n * @default false\n * @public\n */\n @property({ type: Boolean })\n readonly!: boolean;\n\n /**\n * Defines whether the component is display-only.\n * <br><br>\n * <b>Note:</b> A display-only component is not editable,\n * but still provides visual feedback upon user interaction, input border is not visible.\n *\n * @default false\n * @public\n */\n @property({ type: Boolean })\n displayonly!: boolean;\n\n /**\n * Defines the inner stored value of the readonly attribute of the input.\n *\n * @default false\n * @private\n */\n @property({ type: Boolean, noAttribute: true })\n isInputReadonly!: boolean;\n\n /**\n * Defines the inner stored value of the classes of the label.\n *\n * @default \"\"\n * @private\n */\n @property({ type: String, noAttribute: true, defaultValue: \"\" })\n labelClasses!: string;\n\n /**\n * Defines the inner stored class of the label.\n *\n * @default \"\"\n * @private\n */\n @property({ type: String, noAttribute: true, defaultValue: \"\" })\n labelActiveClass!: string;\n\n /**\n * Defines the accessible ARIA name of the component.\n * @default \"\"\n * @public\n */\n @property()\n accessibleName!: string;\n\n /**\n * Receives id (or many ids) of the elements that label the component.\n * @default \"\"\n * @public\n */\n @property({ defaultValue: \"\" })\n accessibleNameRef!: string;\n\n /**\n * Defines the active (focus)\n * @default false\n * @private\n */\n @property({ type: Boolean })\n active!: boolean;\n /**\n * Defines is it the touch of the textarea (only for mobile devices).\n * @default false\n * @private\n */\n @property({ type: Boolean })\n _isTouched!: boolean;\n\n static i18nBundle: I18nBundle;\n\n static async onDefine() {\n UDExTextArea.i18nBundle = await getI18nBundle(\"@udex/web-components\");\n }\n\n getInputDomRef() {\n return this.getDomRef()!.querySelector<HTMLTextAreaElement>(\"textarea\")!;\n }\n\n get hasValueState() {\n return this.fieldState === FieldState.Error || this.fieldState === FieldState.Warning || this.fieldState === FieldState.Success;\n }\n\n get fieldStateTypeMappings() {\n return {\n \"Success\": UDExTextArea.i18nBundle.getText(VALUE_STATE_TYPE_SUCCESS),\n \"Standard\": UDExTextArea.i18nBundle.getText(VALUE_STATE_TYPE_STANDARD),\n \"Error\": UDExTextArea.i18nBundle.getText(VALUE_STATE_TYPE_ERROR),\n \"Warning\": UDExTextArea.i18nBundle.getText(VALUE_STATE_TYPE_WARNING),\n };\n }\n\n get ariaValueStateHiddenText() {\n if (!this.hasValueState) {\n return;\n }\n\n if (this.fieldState === FieldState.Standard) {\n return;\n }\n\n return `${this.fieldStateTypeMappings[this.fieldState]}`;\n }\n\n get readOnlyText() {\n return UDExTextArea.i18nBundle.getText(READ_ONLY);\n }\n\n get ariaDescribedBy() {\n const valueStateTextDescId = this.hasValueState ? `${this._id}-valueStateDesc` : \"\";\n const readonlyTextDescId = this.readonly ? `${this._id}-readonlyDesc` : \"\";\n const supportingTextDescId = this._supportingText ? `${this._id}-supportingTextDesc` : \"\";\n if (!valueStateTextDescId && !supportingTextDescId && !readonlyTextDescId) {\n return;\n }\n return `${valueStateTextDescId} ${supportingTextDescId} ${readonlyTextDescId}`;\n }\n\n get _supportingText() {\n if (this.supportingText.length) {\n return this.supportingText;\n }\n\n const maxLength = this.maxlength;\n\n if (maxLength !== null && maxLength !== undefined) {\n const leftCharactersCount = maxLength - this.value.length;\n\n if (leftCharactersCount >= 0) {\n return UDExTextArea.i18nBundle.getText(TEXTAREA_CHARACTERS_LEFT, leftCharactersCount);\n }\n }\n }\n\n handleInput = (event: InputEvent) => {\n this.value = (event.target as HTMLInputElement)?.value;\n };\n\n handleChange = () => {\n this.fireEvent(\"change\");\n };\n\n handleGrowing = () => {\n if (this.growing) {\n const nativeTextArea = this.getInputDomRef();\n\n if (!this.rows) {\n this.rows = 1;\n }\n nativeTextArea.style.height = \"auto\";\n // 2px - to avoid an unnecessary scrollbar, the border needs to be taken into account\n nativeTextArea.style.height = `${nativeTextArea.scrollHeight + 2}px`;\n\n if (this.growingMaxLines) {\n const style = getComputedStyle(nativeTextArea);\n\n const lineHeight = parseInt(style.lineHeight);\n const paddingTop = parseInt(style.paddingTop);\n const paddingBottom = parseInt(style.paddingBottom);\n\n const heightRatio = this.growingMaxLines > this.rows ? this.growingMaxLines : this.rows;\n\n const growingMaxHeight = lineHeight * heightRatio + paddingTop + paddingBottom;\n\n // 2px - to avoid an unnecessary scrollbar, the border needs to be taken into account\n nativeTextArea.style.maxHeight = `${growingMaxHeight + 2}px`;\n }\n }\n };\n\n handleFocus = () => {\n if (!this.disabled && !this.readonly && !this.displayonly) {\n this.active = true;\n this.labelActiveClass = this._labelActiveClassName;\n }\n };\n\n handleClick(): void {\n if (!isDesktop()) {\n this._isTouched = true;\n }\n }\n\n handleBlur = () => {\n this._isTouched = false;\n if (this.value) {\n this.labelActiveClass = this._labelActiveClassName;\n } else {\n this.labelActiveClass = \"\";\n }\n this.active = false;\n };\n\n get ariaInvalid() {\n return this.fieldState === FieldState.Error ? \"true\" : null;\n }\n\n onBeforeRendering() {\n if (this.value && this.labelActiveClass === \"\") {\n this.labelActiveClass = this._labelActiveClassName;\n }\n\n this.isInputReadonly = this.readonly || this.displayonly;\n\n this.labelClasses = `udex-textarea__label ${this.labelActiveClass}`;\n }\n\n onAfterRendering() {\n this.handleGrowing();\n }\n}\n\nUDExTextArea.define();\n\nexport default UDExTextArea;\n"]}
|
|
1
|
+
{"version":3,"file":"TextArea.js","sourceRoot":"","sources":["../src/TextArea.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport getEffectiveScrollbarStyle from \"@ui5/webcomponents-base/dist/util/getEffectiveScrollbarStyle.js\";\nimport Integer from \"@ui5/webcomponents-base/dist/types/Integer.js\";\nimport { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport { isDesktop } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport {\n READ_ONLY,\n TEXTAREA_CHARACTERS_LEFT,\n TEXT_FIELD,\n VALUE_STATE_TYPE_ERROR,\n VALUE_STATE_TYPE_STANDARD,\n VALUE_STATE_TYPE_SUCCESS,\n VALUE_STATE_TYPE_WARNING,\n} from \"./generated/i18n/i18n-defaults.js\";\n\nimport \"@ui5/webcomponents/dist/Icon.js\";\nimport \"@ui5/webcomponents-icons/dist/accept.js\";\nimport \"@ui5/webcomponents-icons/dist/error.js\";\nimport \"@ui5/webcomponents-icons/dist/alert.js\";\n\nimport UDExStatusMessage from \"./StatusMessage.js\";\nimport ValueState from \"./types/common.js\";\nimport TextAreaTemplate from \"./generated/templates/TextAreaTemplate.lit.js\";\n\n// Styles\nimport TextAreaCss from \"./generated/themes/TextArea.css.js\";\n\n/**\n * @class\n *\n * @constructor\n * @extends UI5Element\n * @tagname udex-text-area\n * @public\n */\n@customElement({\n tag: \"udex-textarea\",\n renderer: litRender,\n styles: [TextAreaCss, getEffectiveScrollbarStyle()],\n template: TextAreaTemplate,\n dependencies: [UDExStatusMessage],\n})\n\nclass UDExTextArea extends UI5Element {\n _labelActiveClassName = \"udex-textarea__label--active\";\n\n /**\n * Defines label text for the textarea field.\n *\n * @default \"\"\n * @public\n */\n @property({ type: String })\n label!: string;\n\n /**\n * Defines the value of the component.\n * <br><br>\n * <b>Note:</b> The property is updated upon typing.\n *\n * @default \"\"\n * @public\n */\n @property({ type: String })\n value!: string;\n\n /**\n * Defines the number of visible text lines for the component.\n * <br><br>\n * <b>Notes:</b>\n * <ul>\n * <li>If the <code>growing</code> property is enabled, this property defines the minimum rows to be displayed\n * in the textarea.</li>\n * <li>The CSS <code>height</code> property wins over the <code>rows</code> property, if both are set.</li>\n * </ul>\n *\n * @public\n */\n @property({ validator: Integer })\n rows!: number;\n\n /**\n * Enables the component to automatically grow and shrink dynamically with its content.\n * <br><br>\n *\n * @default false\n * @public\n */\n @property({ type: Boolean })\n growing!: boolean;\n\n /**\n * Defines the maximum number of lines that the component can grow.\n *\n * @default 0\n * @public\n */\n @property({ validator: Integer, defaultValue: 0 })\n growingMaxLines!: number;\n\n /**\n * Defines supporting text under the input field.\n *\n * @default \"\"\n * @public\n */\n @property({ type: String })\n supportingText!: string;\n\n /**\n * Sets the maximum number of characters available in the textarea.\n *\n * @public\n */\n @property({ validator: Integer })\n maxlength?: number;\n\n /**\n * Defines the value state of the component.\n *\n * @default \"Standard\"\n * @public\n */\n @property({ type: ValueState, defaultValue: ValueState.Standard })\n fieldState!: `${ValueState}`;\n\n /**\n * Defines whether the component is required.\n *\n * @default false\n * @public\n */\n @property({ type: Boolean })\n required!: boolean;\n\n /**\n * Defines whether the component is in disabled state.\n * <br><br>\n * <b>Note:</b> A disabled component is completely noninteractive.\n *\n * @default false\n * @public\n */\n @property({ type: Boolean })\n disabled!: boolean;\n\n /**\n * Defines whether the component is read-only.\n * <br><br>\n * <b>Note:</b> A read-only component is not editable,\n * but still provides visual feedback upon user interaction.\n *\n * @default false\n * @public\n */\n @property({ type: Boolean })\n readonly!: boolean;\n\n /**\n * Defines whether the component is display-only.\n * <br><br>\n * <b>Note:</b> A display-only component is not editable,\n * but still provides visual feedback upon user interaction, input border is not visible.\n *\n * @default false\n * @public\n */\n @property({ type: Boolean })\n displayonly!: boolean;\n\n /**\n * Defines the inner stored value of the readonly attribute of the input.\n *\n * @default false\n * @private\n */\n @property({ type: Boolean, noAttribute: true })\n isInputReadonly!: boolean;\n\n /**\n * Defines the inner stored value of the classes of the label.\n *\n * @default \"\"\n * @private\n */\n @property({ type: String, noAttribute: true })\n labelClasses!: string;\n\n /**\n * Defines the inner stored class of the label.\n *\n * @default \"\"\n * @private\n */\n @property({ type: String, noAttribute: true })\n labelActiveClass!: string;\n\n /**\n * Defines the accessible ARIA name of the component.\n * @default \"\"\n * @public\n */\n @property()\n accessibleName!: string;\n\n /**\n * Receives id (or many ids) of the elements that label the component.\n * @default \"\"\n * @public\n */\n @property({ type: String })\n accessibleNameRef!: string;\n\n /**\n * Defines the active (focus)\n * @default false\n * @private\n */\n @property({ type: Boolean })\n active!: boolean;\n /**\n * Defines is it the touch of the textarea (only for mobile devices).\n * @default false\n * @private\n */\n @property({ type: Boolean })\n _isTouched!: boolean;\n\n static i18nBundle: I18nBundle;\n\n static async onDefine() {\n UDExTextArea.i18nBundle = await getI18nBundle(\"@udex/web-components\");\n }\n\n onBeforeRendering() {\n if (this.value && this.labelActiveClass === \"\") {\n this.labelActiveClass = this._labelActiveClassName;\n }\n\n this.isInputReadonly = this.readonly || this.displayonly;\n\n this.labelClasses = `udex-textarea__label ${this.labelActiveClass}`;\n }\n\n onAfterRendering() {\n this.handleGrowing();\n }\n\n handleInput = (event: InputEvent) => {\n this.value = (event.target as HTMLInputElement)?.value;\n };\n\n handleChange = () => {\n this.fireEvent(\"change\");\n };\n\n handleGrowing = () => {\n if (this.growing) {\n const nativeTextArea = this.getInputDomRef();\n\n if (!this.rows) {\n this.rows = 1;\n }\n nativeTextArea.style.height = \"auto\";\n // 2px - to avoid an unnecessary scrollbar, the border needs to be taken into account\n nativeTextArea.style.height = `${nativeTextArea.scrollHeight + 2}px`;\n\n if (this.growingMaxLines) {\n const style = getComputedStyle(nativeTextArea);\n\n const lineHeight = parseInt(style.lineHeight);\n const paddingTop = parseInt(style.paddingTop);\n const paddingBottom = parseInt(style.paddingBottom);\n\n const heightRatio = this.growingMaxLines > this.rows ? this.growingMaxLines : this.rows;\n\n const growingMaxHeight = lineHeight * heightRatio + paddingTop + paddingBottom;\n\n // 2px - to avoid an unnecessary scrollbar, the border needs to be taken into account\n nativeTextArea.style.maxHeight = `${growingMaxHeight + 2}px`;\n }\n }\n };\n\n handleFocus = () => {\n if (!this.disabled && !this.readonly && !this.displayonly) {\n this.active = true;\n this.labelActiveClass = this._labelActiveClassName;\n }\n };\n\n handleClick(): void {\n if (!isDesktop()) {\n this._isTouched = true;\n }\n }\n\n handleBlur = () => {\n this._isTouched = false;\n if (this.value) {\n this.labelActiveClass = this._labelActiveClassName;\n } else {\n this.labelActiveClass = \"\";\n }\n this.active = false;\n };\n\n getInputDomRef() {\n return this.getDomRef()!.querySelector<HTMLTextAreaElement>(\"textarea\")!;\n }\n\n get hasValueState(): boolean {\n return this.fieldState === ValueState.Error || this.fieldState === ValueState.Warning || this.fieldState === ValueState.Success;\n }\n\n get fieldStateTypeMappings(): Record<string, string> {\n return {\n \"Success\": UDExTextArea.i18nBundle.getText(VALUE_STATE_TYPE_SUCCESS),\n \"Standard\": UDExTextArea.i18nBundle.getText(VALUE_STATE_TYPE_STANDARD),\n \"Error\": UDExTextArea.i18nBundle.getText(VALUE_STATE_TYPE_ERROR),\n \"Warning\": UDExTextArea.i18nBundle.getText(VALUE_STATE_TYPE_WARNING),\n };\n }\n\n get ariaValueStateHiddenText(): string | undefined {\n if (!this.hasValueState) {\n return;\n }\n\n if (this.fieldState === ValueState.Standard) {\n return;\n }\n\n return `${this.fieldStateTypeMappings[this.fieldState]}`;\n }\n\n get readOnlyText(): string {\n return UDExTextArea.i18nBundle.getText(READ_ONLY);\n }\n\n get ariaDescribedBy(): string | undefined {\n const valueStateTextDescId = this.hasValueState ? `${this._id}-valueStateDesc` : \"\";\n const readonlyTextDescId = this.readonly ? `${this._id}-readonlyDesc` : \"\";\n const supportingTextDescId = this._supportingText ? `${this._id}-supportingTextDesc` : \"\";\n if (!valueStateTextDescId && !supportingTextDescId && !readonlyTextDescId) {\n return;\n }\n return `${valueStateTextDescId} ${supportingTextDescId} ${readonlyTextDescId}`;\n }\n\n get _supportingText(): string | undefined {\n if (this.supportingText.length) {\n return this.supportingText;\n }\n\n const maxLength = this.maxlength;\n\n if (maxLength !== null && maxLength !== undefined) {\n const leftCharactersCount = maxLength - this.value.length;\n\n if (leftCharactersCount >= 0) {\n return UDExTextArea.i18nBundle.getText(TEXTAREA_CHARACTERS_LEFT, leftCharactersCount);\n }\n }\n }\n\n get ariaInvalid(): string | null {\n return this.fieldState === ValueState.Error ? \"true\" : null;\n }\n\n get textHiddenLabel(): string {\n return UDExTextArea.i18nBundle.getText(TEXT_FIELD);\n }\n}\n\nUDExTextArea.define();\n\nexport default UDExTextArea;\n"]}
|