@wix/editor-react-components 1.2481.0 → 1.2483.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 (18) hide show
  1. package/dist/site/components/AccordionComponent/component.js +5 -3
  2. package/dist/site/components/AccordionComponent/manifest.js +1 -1
  3. package/dist/site/components/Breadcrumbs/component.js +3 -2
  4. package/dist/site/components/Menu/component.js +27 -78
  5. package/dist/site/components/Menu/components/Submenu/types.d.ts +0 -1
  6. package/dist/site/components/Menu/contexts/MenuContext.d.ts +0 -1
  7. package/dist/site/components/Menu/css.css +8 -60
  8. package/dist/site/components/Menu/manifest.js +1 -1
  9. package/dist/site/components/TextInput/TextInput.types.d.ts +5 -0
  10. package/dist/site/components/TextInput/component.js +82 -24
  11. package/dist/site/components/TextInput/constants.d.ts +18 -6
  12. package/dist/site/components/TextInput/css.css +20 -6
  13. package/dist/site/components/TextInput/manifest.js +269 -301
  14. package/dist/site/components/chunks/constants27.js +2 -2
  15. package/dist/site/components/chunks/constants3.js +22 -7
  16. package/dist/site/components/chunks/constants40.js +2 -2
  17. package/package.json +2 -2
  18. package/dist/site/components/Menu/semanticClassNames.d.ts +0 -20
package/dist/site/components/TextInput/manifest.js CHANGED
@@ -1,9 +1,15 @@
1
- import { I as INTERACTIONS, D as DATA, C as CSS_PROPERTIES, b as DISPLAY_GROUPS, N as NativeStateType, L as LAYOUT, A as Archetype } from "../chunks/chunk-V7QOLP3D.js";
1
+ import { I as INTERACTIONS, D as DATA, b as DISPLAY_GROUPS, C as CSS_PROPERTIES, E as ELEMENTS, N as NativeStateType, L as LAYOUT, A as Archetype } from "../chunks/chunk-V7QOLP3D.js";
2
2
  import { D as DesignStates, a as DisplayNames, s as selectors } from "../chunks/constants3.js";
3
3
  import { w as withSpec, g as getSelector } from "../chunks/manifest.js";
4
4
  import { I as IS_SUPPORT_DESIGN_STATE_SPEC } from "../chunks/specs.js";
5
5
  import { m as manifestFocusable, b as manifestInputable, a as manifestChangeable } from "../chunks/manifestSdkMixins.js";
6
6
  import { m as manifestValidation } from "../chunks/manifest2.js";
7
+ const designState = (s, pseudoClass) => withSpec({
8
+ spec: IS_SUPPORT_DESIGN_STATE_SPEC,
9
+ displayName: s.displayName,
10
+ className: s.className,
11
+ ...pseudoClass ? { pseudoClass } : {}
12
+ });
7
13
  const manifest = {
8
14
  id: "e95f3cfd-a78d-4d7c-addb-c93182193857",
9
15
  type: "wixEditorElements.TextInput__DEV__v2",
@@ -15,8 +21,7 @@ const manifest = {
15
21
  pixels: 280
16
22
  },
17
23
  height: {
18
- sizingType: LAYOUT.SIZING_TYPE.pixels,
19
- pixels: 42
24
+ sizingType: LAYOUT.SIZING_TYPE.content
20
25
  }
21
26
  }
22
27
  },
@@ -37,35 +42,259 @@ const manifest = {
37
42
  archetype: Archetype.TextInput,
38
43
  layout: {
39
44
  resizeDirection: LAYOUT.RESIZE_DIRECTION.horizontalAndVertical,
40
- contentResizeDirection: LAYOUT.CONTENT_RESIZE_DIRECTION.horizontal,
41
- disableStretching: false,
45
+ contentResizeDirection: LAYOUT.CONTENT_RESIZE_DIRECTION.vertical,
46
+ disableStretching: true,
42
47
  disablePositioning: false
43
48
  },
44
- states: {
45
- hover: withSpec({
46
- spec: IS_SUPPORT_DESIGN_STATE_SPEC,
47
- displayName: DesignStates.root.hover.displayName,
48
- className: DesignStates.root.hover.className,
49
- pseudoClass: NativeStateType.hover
50
- }),
51
- focus: withSpec({
52
- spec: IS_SUPPORT_DESIGN_STATE_SPEC,
53
- displayName: DesignStates.root.focus.displayName,
54
- className: DesignStates.root.focus.className,
55
- pseudoClass: NativeStateType.focus
56
- }),
57
- error: withSpec({
58
- spec: IS_SUPPORT_DESIGN_STATE_SPEC,
59
- displayName: DesignStates.root.error.displayName,
60
- className: DesignStates.root.error.className
61
- }),
62
- disabled: withSpec({
63
- spec: IS_SUPPORT_DESIGN_STATE_SPEC,
64
- displayName: DesignStates.root.disabled.displayName,
65
- className: DesignStates.root.disabled.className,
66
- pseudoClass: NativeStateType.disabled,
67
- props: { isDisabled: true }
68
- })
49
+ elements: {
50
+ label: {
51
+ elementType: ELEMENTS.ELEMENT_TYPE.inlineElement,
52
+ inlineElement: {
53
+ displayName: DisplayNames.root.elements.label,
54
+ selector: getSelector(selectors.label),
55
+ behaviors: { selectable: false },
56
+ displayGroups: {
57
+ labelPaddingGroup: {
58
+ groupType: DISPLAY_GROUPS.GROUP_TYPE.padding,
59
+ padding: {
60
+ left: "labelPaddingInlineStart",
61
+ right: "labelPaddingInlineEnd"
62
+ }
63
+ }
64
+ },
65
+ cssCustomProperties: {
66
+ labelFont: {
67
+ displayName: DisplayNames.cssCustomProperties.labelFont,
68
+ cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.font
69
+ },
70
+ labelTextColor: {
71
+ displayName: DisplayNames.cssCustomProperties.labelTextColor,
72
+ cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.color
73
+ },
74
+ requiredTextColor: {
75
+ displayName: DisplayNames.cssCustomProperties.requiredTextColor,
76
+ cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.color
77
+ },
78
+ labelMarginBottom: {
79
+ displayName: DisplayNames.cssCustomProperties.labelMarginBottom,
80
+ cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.marginBottom
81
+ },
82
+ labelPaddingInlineStart: {
83
+ displayName: DisplayNames.cssCustomProperties.labelPaddingInlineStart,
84
+ cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.paddingInlineStart
85
+ },
86
+ labelPaddingInlineEnd: {
87
+ displayName: DisplayNames.cssCustomProperties.labelPaddingInlineEnd,
88
+ cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.paddingInlineEnd
89
+ },
90
+ labelAlign: {
91
+ displayName: DisplayNames.cssCustomProperties.labelAlign,
92
+ cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.customEnum,
93
+ defaultValue: "start",
94
+ customEnum: {
95
+ cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.string,
96
+ options: [
97
+ {
98
+ value: "start",
99
+ displayName: DisplayNames.options.start,
100
+ appliedStyles: [
101
+ { property: "--labelAlign", value: "start" },
102
+ {
103
+ property: "--labelPadding_start",
104
+ value: "var(--labelPadding)"
105
+ },
106
+ { property: "--labelPadding_end", value: "20" }
107
+ ]
108
+ },
109
+ {
110
+ value: "center",
111
+ displayName: DisplayNames.options.center,
112
+ appliedStyles: [
113
+ { property: "--labelAlign", value: "center" },
114
+ { property: "--labelPadding_start", value: "0" },
115
+ { property: "--labelPadding_end", value: "0" }
116
+ ]
117
+ },
118
+ {
119
+ value: "end",
120
+ displayName: DisplayNames.options.end,
121
+ appliedStyles: [
122
+ { property: "--labelAlign", value: "end" },
123
+ { property: "--labelPadding_start", value: "20" },
124
+ {
125
+ property: "--labelPadding_end",
126
+ value: "var(--labelPadding)"
127
+ }
128
+ ]
129
+ }
130
+ ]
131
+ }
132
+ }
133
+ }
134
+ }
135
+ },
136
+ input: {
137
+ elementType: ELEMENTS.ELEMENT_TYPE.inlineElement,
138
+ inlineElement: {
139
+ displayName: DisplayNames.root.elements.input,
140
+ selector: getSelector(selectors.input),
141
+ behaviors: { selectable: false },
142
+ states: {
143
+ hover: designState(
144
+ DesignStates.input.hover,
145
+ NativeStateType.hover
146
+ ),
147
+ focus: designState(
148
+ DesignStates.input.focus,
149
+ NativeStateType.focus
150
+ ),
151
+ error: designState(DesignStates.input.error),
152
+ disabled: {
153
+ ...designState(
154
+ DesignStates.input.disabled,
155
+ NativeStateType.disabled
156
+ ),
157
+ props: { isDisabled: true }
158
+ }
159
+ },
160
+ displayGroups: {
161
+ textPaddingGroup: {
162
+ groupType: DISPLAY_GROUPS.GROUP_TYPE.padding,
163
+ padding: {
164
+ top: "textPaddingTop",
165
+ bottom: "textPaddingBottom",
166
+ left: "textPaddingInlineStart",
167
+ right: "textPaddingInlineEnd"
168
+ }
169
+ },
170
+ borderGroup: {
171
+ groupType: DISPLAY_GROUPS.GROUP_TYPE.border,
172
+ border: {
173
+ width: "borderWidth",
174
+ color: "borderColor"
175
+ }
176
+ }
177
+ },
178
+ cssCustomProperties: {
179
+ boxShadow: {
180
+ cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.boxShadow
181
+ },
182
+ borderRadius: {
183
+ cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.borderRadius
184
+ },
185
+ font: {
186
+ cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.font
187
+ },
188
+ borderWidth: {
189
+ cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.borderWidth
190
+ },
191
+ borderColor: {
192
+ cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.borderColor
193
+ },
194
+ background: {
195
+ cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.background
196
+ },
197
+ textColor: {
198
+ displayName: DisplayNames.cssCustomProperties.textColor,
199
+ cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.color
200
+ },
201
+ placeholderTextColor: {
202
+ displayName: DisplayNames.cssCustomProperties.placeholderTextColor,
203
+ cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.color
204
+ },
205
+ textPaddingTop: {
206
+ cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.paddingTop
207
+ },
208
+ textPaddingBottom: {
209
+ cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.paddingBottom
210
+ },
211
+ textPaddingInlineStart: {
212
+ cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.paddingInlineStart
213
+ },
214
+ textPaddingInlineEnd: {
215
+ cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.paddingInlineEnd
216
+ },
217
+ inputAlign: {
218
+ displayName: DisplayNames.cssCustomProperties.inputAlign,
219
+ cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.customEnum,
220
+ defaultValue: "start",
221
+ customEnum: {
222
+ cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.string,
223
+ options: [
224
+ {
225
+ value: "start",
226
+ displayName: DisplayNames.options.start,
227
+ appliedStyles: [
228
+ { property: "--inputAlign", value: "left" },
229
+ { property: "--textPadding", value: "3" },
230
+ { property: "--textPadding_start", value: "3" },
231
+ { property: "--textPadding_end", value: "3" }
232
+ ]
233
+ },
234
+ {
235
+ value: "center",
236
+ displayName: DisplayNames.options.center,
237
+ appliedStyles: [
238
+ { property: "--inputAlign", value: "center" },
239
+ { property: "--textPadding", value: "3" },
240
+ {
241
+ property: "--textPadding_start",
242
+ value: "var(--textPadding)"
243
+ },
244
+ { property: "--textPadding_end", value: "3" }
245
+ ]
246
+ },
247
+ {
248
+ value: "end",
249
+ displayName: DisplayNames.options.end,
250
+ appliedStyles: [
251
+ { property: "--inputAlign", value: "right" },
252
+ { property: "--textPadding", value: "3" },
253
+ { property: "--textPadding_start", value: "3" },
254
+ {
255
+ property: "--textPadding_end",
256
+ value: "var(--textPadding)"
257
+ }
258
+ ]
259
+ }
260
+ ]
261
+ }
262
+ }
263
+ }
264
+ }
265
+ },
266
+ prefix: {
267
+ elementType: ELEMENTS.ELEMENT_TYPE.inlineElement,
268
+ inlineElement: {
269
+ displayName: DisplayNames.root.elements.prefix,
270
+ selector: getSelector(selectors.prefix),
271
+ behaviors: { selectable: false },
272
+ cssCustomProperties: {
273
+ prefixFont: {
274
+ displayName: DisplayNames.cssCustomProperties.prefixFont,
275
+ cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.font
276
+ }
277
+ }
278
+ }
279
+ },
280
+ helperText: {
281
+ elementType: ELEMENTS.ELEMENT_TYPE.inlineElement,
282
+ inlineElement: {
283
+ displayName: DisplayNames.root.elements.helperText,
284
+ selector: getSelector(selectors.helperText),
285
+ behaviors: { selectable: false },
286
+ cssCustomProperties: {
287
+ helperFont: {
288
+ displayName: DisplayNames.cssCustomProperties.helperFont,
289
+ cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.font
290
+ },
291
+ helperColor: {
292
+ displayName: DisplayNames.cssCustomProperties.helperColor,
293
+ cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.color
294
+ }
295
+ }
296
+ }
297
+ }
69
298
  },
70
299
  displayGroups: {
71
300
  orderedDataGroup: {
@@ -81,6 +310,7 @@ const manifest = {
81
310
  "label",
82
311
  "placeholder",
83
312
  "tooltip",
313
+ "description",
84
314
  "prefix",
85
315
  "autocompleteToken",
86
316
  "pattern",
@@ -93,277 +323,6 @@ const manifest = {
93
323
  "errorMessageType"
94
324
  ]
95
325
  }
96
- },
97
- textPaddingGroup: {
98
- groupType: DISPLAY_GROUPS.GROUP_TYPE.padding,
99
- padding: {
100
- top: "textPaddingTop",
101
- bottom: "textPaddingBottom",
102
- left: "textPaddingInlineStart",
103
- right: "textPaddingInlineEnd"
104
- }
105
- },
106
- labelPaddingGroup: {
107
- groupType: DISPLAY_GROUPS.GROUP_TYPE.padding,
108
- padding: {
109
- left: "labelPaddingInlineStart",
110
- right: "labelPaddingInlineEnd"
111
- }
112
- },
113
- borderGroup: {
114
- groupType: DISPLAY_GROUPS.GROUP_TYPE.border,
115
- border: {
116
- width: "borderWidth",
117
- color: "borderColor"
118
- }
119
- }
120
- },
121
- cssCustomProperties: {
122
- boxShadow: {
123
- cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.boxShadow
124
- },
125
- borderRadius: {
126
- cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.borderRadius
127
- },
128
- font: {
129
- cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.font
130
- },
131
- borderWidth: {
132
- cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.borderWidth
133
- },
134
- borderColor: {
135
- cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.borderColor
136
- },
137
- background: {
138
- cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.background
139
- },
140
- textColor: {
141
- displayName: DisplayNames.cssCustomProperties.textColor,
142
- cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.color
143
- },
144
- placeholderTextColor: {
145
- displayName: DisplayNames.cssCustomProperties.placeholderTextColor,
146
- cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.color
147
- },
148
- requiredTextColor: {
149
- displayName: DisplayNames.cssCustomProperties.requiredTextColor,
150
- cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.color
151
- },
152
- textPaddingTop: {
153
- cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.paddingTop
154
- },
155
- textPaddingBottom: {
156
- cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.paddingBottom
157
- },
158
- textPaddingInlineStart: {
159
- cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.paddingInlineStart
160
- },
161
- textPaddingInlineEnd: {
162
- cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.paddingInlineEnd
163
- },
164
- prefixFont: {
165
- displayName: DisplayNames.cssCustomProperties.prefixFont,
166
- cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.font
167
- },
168
- labelFont: {
169
- displayName: DisplayNames.cssCustomProperties.labelFont,
170
- cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.font
171
- },
172
- labelTextColor: {
173
- displayName: DisplayNames.cssCustomProperties.labelTextColor,
174
- cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.color
175
- },
176
- labelMarginBottom: {
177
- displayName: DisplayNames.cssCustomProperties.labelMarginBottom,
178
- cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.marginBottom
179
- },
180
- labelPaddingInlineStart: {
181
- displayName: DisplayNames.cssCustomProperties.labelPaddingInlineStart,
182
- cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.paddingInlineStart
183
- },
184
- labelPaddingInlineEnd: {
185
- displayName: DisplayNames.cssCustomProperties.labelPaddingInlineEnd,
186
- cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.paddingInlineEnd
187
- },
188
- align: {
189
- displayName: DisplayNames.cssCustomProperties.align,
190
- cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.customEnum,
191
- defaultValue: "left",
192
- customEnum: {
193
- cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.string,
194
- options: [
195
- {
196
- value: "start",
197
- displayName: DisplayNames.options.start,
198
- appliedStyles: [
199
- {
200
- property: "--align",
201
- value: "start"
202
- }
203
- ]
204
- },
205
- {
206
- value: "center",
207
- displayName: DisplayNames.options.center,
208
- appliedStyles: [
209
- {
210
- property: "--align",
211
- value: "center"
212
- }
213
- ]
214
- },
215
- {
216
- value: "end",
217
- displayName: DisplayNames.options.end,
218
- appliedStyles: [
219
- {
220
- property: "--align",
221
- value: "end"
222
- }
223
- ]
224
- }
225
- ]
226
- }
227
- },
228
- labelAlign: {
229
- displayName: DisplayNames.cssCustomProperties.labelAlign,
230
- cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.customEnum,
231
- defaultValue: "left",
232
- customEnum: {
233
- cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.string,
234
- options: [
235
- {
236
- value: "start",
237
- displayName: DisplayNames.options.start,
238
- appliedStyles: [
239
- {
240
- property: "--labelAlign",
241
- value: "start"
242
- },
243
- {
244
- property: "--labelPadding_start",
245
- value: "var(--labelPadding)"
246
- },
247
- {
248
- property: "--labelPadding_end",
249
- value: "20"
250
- }
251
- ]
252
- },
253
- {
254
- value: "center",
255
- displayName: DisplayNames.options.center,
256
- appliedStyles: [
257
- {
258
- property: "--labelAlign",
259
- value: "center"
260
- },
261
- {
262
- property: "--labelPadding_start",
263
- value: "0"
264
- },
265
- {
266
- property: "--labelPadding_end",
267
- value: "0"
268
- }
269
- ]
270
- },
271
- {
272
- value: "end",
273
- displayName: DisplayNames.options.end,
274
- appliedStyles: [
275
- {
276
- property: "--labelAlign",
277
- value: "end"
278
- },
279
- {
280
- property: "--labelPadding_start",
281
- value: "20"
282
- },
283
- {
284
- property: "--labelPadding_end",
285
- value: "var(--labelPadding)"
286
- }
287
- ]
288
- }
289
- ]
290
- }
291
- },
292
- inputAlign: {
293
- displayName: DisplayNames.cssCustomProperties.inputAlign,
294
- cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.customEnum,
295
- defaultValue: "left",
296
- customEnum: {
297
- cssPropertyType: CSS_PROPERTIES.CSS_PROPERTY_TYPE.string,
298
- options: [
299
- {
300
- value: "start",
301
- displayName: DisplayNames.options.start,
302
- appliedStyles: [
303
- {
304
- property: "--inputAlign",
305
- value: "start"
306
- },
307
- {
308
- property: "--textPadding",
309
- value: "3"
310
- },
311
- {
312
- property: "--textPadding_start",
313
- value: "3"
314
- },
315
- {
316
- property: "--textPadding_end",
317
- value: "3"
318
- }
319
- ]
320
- },
321
- {
322
- value: "center",
323
- displayName: DisplayNames.options.center,
324
- appliedStyles: [
325
- {
326
- property: "--inputAlign",
327
- value: "center"
328
- },
329
- {
330
- property: "--textPadding",
331
- value: "3"
332
- },
333
- {
334
- property: "--textPadding_start",
335
- value: "var(--textPadding)"
336
- },
337
- {
338
- property: "--textPadding_end",
339
- value: "3"
340
- }
341
- ]
342
- },
343
- {
344
- value: "end",
345
- displayName: DisplayNames.options.end,
346
- appliedStyles: [
347
- {
348
- property: "--inputAlign",
349
- value: "end"
350
- },
351
- {
352
- property: "--textPadding",
353
- value: "3"
354
- },
355
- {
356
- property: "--textPadding_start",
357
- value: "3"
358
- },
359
- {
360
- property: "--textPadding_end",
361
- value: "var(--textPadding)"
362
- }
363
- ]
364
- }
365
- ]
366
- }
367
326
  }
368
327
  },
369
328
  data: {
@@ -400,6 +359,7 @@ const manifest = {
400
359
  inputType: {
401
360
  displayName: DisplayNames.data.inputType,
402
361
  dataType: DATA.DATA_TYPE.textEnum,
362
+ defaultValue: "text",
403
363
  [DATA.DATA_TYPE.textEnum]: {
404
364
  options: [
405
365
  { value: "text", displayName: DisplayNames.options.text },
@@ -476,6 +436,14 @@ const manifest = {
476
436
  maxLength: 400
477
437
  }
478
438
  },
439
+ description: {
440
+ displayName: DisplayNames.data.description,
441
+ dataType: DATA.DATA_TYPE.text,
442
+ defaultValue: "",
443
+ [DATA.DATA_TYPE.text]: {
444
+ maxLength: 400
445
+ }
446
+ },
479
447
  // Accessibility
480
448
  a11y: {
481
449
  dataType: DATA.DATA_TYPE.a11y,
package/dist/site/components/chunks/constants27.js CHANGED
@@ -411,9 +411,9 @@ export {
411
411
  VerticalDropdownDisplay as V,
412
412
  MenuOrientation as a,
413
413
  MenuParts as b,
414
- ARIA_LABEL_NAMESPACE as c,
414
+ DesignStates as c,
415
415
  defaultTranslations as d,
416
- DesignStates as e,
416
+ ARIA_LABEL_NAMESPACE as e,
417
417
  DisplayNames as f,
418
418
  DropdownAnchorPositions as g,
419
419
  DropdownAppliedStyleProperties as h,
package/dist/site/components/chunks/constants3.js CHANGED
@@ -1,5 +1,9 @@
1
1
  const selectors = {
2
2
  root: "textInput",
3
+ label: "textInput__label",
4
+ input: "textInput__input",
5
+ prefix: "textInput__prefix",
6
+ helperText: "textInput__helper",
3
7
  requiredIndicator: "textInput__required-indicator"
4
8
  };
5
9
  const TestIds = {
@@ -8,18 +12,29 @@ const TestIds = {
8
12
  };
9
13
  const VALUE_MISSING_MESSAGE = "This field is required";
10
14
  const DesignStates = {
11
- root: {
12
- hover: { displayName: "Hover", className: "textInput--hover" },
13
- focus: { displayName: "Focus", className: "textInput--focus" },
14
- error: { displayName: "Error", className: "textInput--error" },
15
- disabled: { displayName: "Disabled", className: "textInput--disabled" }
15
+ input: {
16
+ hover: { displayName: "Hover", className: "textInput__input--hover" },
17
+ focus: { displayName: "Focus", className: "textInput__input--focus" },
18
+ error: { displayName: "Error", className: "textInput__input--error" },
19
+ disabled: {
20
+ displayName: "Disabled",
21
+ className: "textInput__input--disabled"
22
+ }
16
23
  }
17
24
  };
18
25
  const DisplayNames = {
19
26
  root: {
20
- elementDisplayName: "TextInput"
27
+ elementDisplayName: "TextInput",
28
+ elements: {
29
+ label: "Label",
30
+ input: "Input",
31
+ prefix: "Prefix",
32
+ helperText: "Helper text"
33
+ }
21
34
  },
22
35
  cssCustomProperties: {
36
+ helperFont: "Helper text font",
37
+ helperColor: "Helper text color",
23
38
  textColor: "Text color",
24
39
  placeholderTextColor: "Placeholder text color",
25
40
  requiredTextColor: "Required text color",
@@ -29,7 +44,6 @@ const DisplayNames = {
29
44
  labelMarginBottom: "Label bottom margin",
30
45
  labelPaddingInlineStart: "Label left padding",
31
46
  labelPaddingInlineEnd: "Label right padding",
32
- align: "Alignment",
33
47
  labelAlign: "Label alignment",
34
48
  inputAlign: "Input alignment"
35
49
  },
@@ -52,6 +66,7 @@ const DisplayNames = {
52
66
  label: "Label text",
53
67
  placeholder: "Placeholder text",
54
68
  tooltip: "Tooltip",
69
+ description: "Helper text",
55
70
  autoComplete: "Autocomplete",
56
71
  readOnly: "Read only",
57
72
  required: "Required",