@aurodesignsystem-dev/auro-formkit 0.0.0-pr740.9 → 0.0.0-pr750.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.
- package/components/bibtemplate/dist/auro-bibtemplate.d.ts +6 -0
- package/components/bibtemplate/dist/index.js +25 -1
- package/components/bibtemplate/dist/registered.js +25 -1
- package/components/checkbox/demo/api.html +16 -10
- package/components/checkbox/demo/api.min.js +23 -16
- package/components/checkbox/demo/index.html +16 -10
- package/components/checkbox/demo/index.min.js +23 -16
- package/components/checkbox/demo/readme.html +16 -9
- package/components/checkbox/dist/index.js +23 -16
- package/components/checkbox/dist/registered.js +23 -16
- package/components/combobox/demo/api.html +16 -10
- package/components/combobox/demo/api.md +12 -6
- package/components/combobox/demo/api.min.js +442 -148
- package/components/combobox/demo/index.html +16 -10
- package/components/combobox/demo/index.min.js +442 -148
- package/components/combobox/demo/readme.html +16 -9
- package/components/combobox/dist/index.js +405 -136
- package/components/combobox/dist/registered.js +405 -136
- package/components/counter/demo/api.html +17 -10
- package/components/counter/demo/api.md +140 -7
- package/components/counter/demo/api.min.js +1171 -1016
- package/components/counter/demo/index.html +17 -10
- package/components/counter/demo/index.md +86 -0
- package/components/counter/demo/index.min.js +1171 -1016
- package/components/counter/demo/readme.html +16 -9
- package/components/counter/dist/auro-counter-group.d.ts +64 -23
- package/components/counter/dist/auro-counter.d.ts +10 -0
- package/components/counter/dist/index.js +1171 -1016
- package/components/counter/dist/registered.js +1171 -1016
- package/components/datepicker/demo/api.html +16 -10
- package/components/datepicker/demo/api.min.js +403 -123
- package/components/datepicker/demo/index.html +16 -10
- package/components/datepicker/demo/index.min.js +403 -123
- package/components/datepicker/demo/readme.html +16 -9
- package/components/datepicker/dist/auro-datepicker.d.ts +6 -0
- package/components/datepicker/dist/index.js +403 -123
- package/components/datepicker/dist/registered.js +403 -123
- package/components/dropdown/demo/api.html +16 -10
- package/components/dropdown/demo/api.md +77 -269
- package/components/dropdown/demo/api.min.js +336 -96
- package/components/dropdown/demo/index.html +16 -10
- package/components/dropdown/demo/index.md +45 -363
- package/components/dropdown/demo/index.min.js +336 -96
- package/components/dropdown/demo/readme.html +16 -9
- package/components/dropdown/dist/auro-dropdown.d.ts +35 -67
- package/components/dropdown/dist/auro-dropdownBib.d.ts +0 -6
- package/components/dropdown/dist/index.js +336 -96
- package/components/dropdown/dist/registered.js +336 -96
- package/components/form/demo/api.html +16 -9
- package/components/form/demo/autocomplete.html +19 -3
- package/components/form/demo/index.html +16 -9
- package/components/form/demo/readme.html +16 -9
- package/components/form/demo/working.html +19 -13
- package/components/helptext/dist/index.js +1 -1
- package/components/helptext/dist/registered.js +1 -1
- package/components/input/demo/api.html +16 -10
- package/components/input/demo/api.md +1 -1
- package/components/input/demo/api.min.js +14 -14
- package/components/input/demo/index.html +16 -10
- package/components/input/demo/index.min.js +14 -14
- package/components/input/demo/readme.html +16 -9
- package/components/input/dist/base-input.d.ts +1 -1
- package/components/input/dist/index.js +14 -14
- package/components/input/dist/registered.js +14 -14
- package/components/menu/demo/api.html +16 -32
- package/components/menu/demo/api.md +1 -1
- package/components/menu/demo/api.min.js +37 -12
- package/components/menu/demo/index.html +16 -10
- package/components/menu/demo/index.min.js +37 -12
- package/components/menu/demo/readme.html +16 -9
- package/components/menu/dist/auro-menu.d.ts +13 -2
- package/components/menu/dist/index.js +37 -12
- package/components/menu/dist/registered.js +37 -12
- package/components/radio/demo/api.html +16 -10
- package/components/radio/demo/api.md +0 -1
- package/components/radio/demo/api.min.js +61 -76
- package/components/radio/demo/index.html +16 -10
- package/components/radio/demo/index.min.js +61 -76
- package/components/radio/demo/readme.html +16 -9
- package/components/radio/dist/auro-radio.d.ts +8 -11
- package/components/radio/dist/index.js +61 -76
- package/components/radio/dist/registered.js +61 -76
- package/components/select/demo/api.html +16 -10
- package/components/select/demo/api.js +0 -2
- package/components/select/demo/api.md +53 -51
- package/components/select/demo/api.min.js +520 -358
- package/components/select/demo/index.html +16 -11
- package/components/select/demo/index.md +6 -158
- package/components/select/demo/index.min.js +520 -346
- package/components/select/demo/readme.html +16 -9
- package/components/select/dist/auro-select.d.ts +33 -8
- package/components/select/dist/index.js +483 -334
- package/components/select/dist/registered.js +483 -334
- package/package.json +26 -25
|
@@ -16,17 +16,24 @@
|
|
|
16
16
|
<head>
|
|
17
17
|
<meta charset="UTF-8" />
|
|
18
18
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
19
|
-
<title>Auro Web Component
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/design-tokens@latest/dist/auro-classic/CSSCustomProperties.css"
|
|
26
|
-
|
|
19
|
+
<title>Auro Web Component Demo | auro-counter</title>
|
|
20
|
+
|
|
21
|
+
<!-- Prism.js Stylesheet -->
|
|
22
|
+
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/prismjs@1.24.1/themes/prism.css"/>
|
|
23
|
+
|
|
24
|
+
<!-- Legacy reference is still needed to support auro-counter's use of legacy token values at this time -->
|
|
25
|
+
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/design-tokens@latest/dist/legacy/auro-classic/CSSCustomProperties.css"/>
|
|
26
|
+
|
|
27
|
+
<!-- Design Token Alaska Theme -->
|
|
28
|
+
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/design-tokens@latest/dist/themes/alaska/CSSCustomProperties--alaska.min.css"/>
|
|
29
|
+
|
|
30
|
+
<!-- Webcore Stylesheet Alaska Theme -->
|
|
31
|
+
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/webcorestylesheets@latest/dist/bundled/themes/alaska.global.min.css" />
|
|
32
|
+
|
|
33
|
+
<!-- Demo Specific Styles -->
|
|
27
34
|
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/webcorestylesheets@latest/dist/demoWrapper.css" />
|
|
28
35
|
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/webcorestylesheets@latest/dist/elementDemoStyles.css" />
|
|
29
|
-
|
|
36
|
+
</head>
|
|
30
37
|
<body class="auro-markdown">
|
|
31
38
|
<main></main>
|
|
32
39
|
|
|
@@ -25,6 +25,23 @@ export class AuroCounterGroup extends LitElement {
|
|
|
25
25
|
type: BooleanConstructor;
|
|
26
26
|
reflect: boolean;
|
|
27
27
|
};
|
|
28
|
+
/**
|
|
29
|
+
* The current error message to display when the component is invalid.
|
|
30
|
+
*/
|
|
31
|
+
error: {
|
|
32
|
+
type: StringConstructor;
|
|
33
|
+
reflect: boolean;
|
|
34
|
+
};
|
|
35
|
+
/**
|
|
36
|
+
* The current error message to display when the component is invalid.
|
|
37
|
+
* This is set by validation and is not available to consumers.
|
|
38
|
+
* @private
|
|
39
|
+
*/
|
|
40
|
+
errorMessage: {
|
|
41
|
+
type: StringConstructor;
|
|
42
|
+
reflect: boolean;
|
|
43
|
+
attribute: boolean;
|
|
44
|
+
};
|
|
28
45
|
/**
|
|
29
46
|
* Defines the screen size breakpoint (`xs`, `sm`, `md`, `lg`, `xl`, `disabled`)
|
|
30
47
|
* at which the dropdown switches to fullscreen mode on mobile. `disabled` indicates a dropdown should _never_ enter fullscreen.
|
|
@@ -103,7 +120,7 @@ export class AuroCounterGroup extends LitElement {
|
|
|
103
120
|
* "top" | "right" | "bottom" | "left" |
|
|
104
121
|
* "bottom-start" | "top-start" | "top-end" |
|
|
105
122
|
* "right-start" | "right-end" | "bottom-end" |
|
|
106
|
-
* "left-start" | "left-end"
|
|
123
|
+
* "left-start" | "left-end".
|
|
107
124
|
* @default bottom-start
|
|
108
125
|
*/
|
|
109
126
|
placement: {
|
|
@@ -176,11 +193,20 @@ export class AuroCounterGroup extends LitElement {
|
|
|
176
193
|
*/
|
|
177
194
|
private validation;
|
|
178
195
|
/**
|
|
179
|
-
*
|
|
196
|
+
* Updates the aggregate value based on the values of contained auro-counter components.
|
|
197
|
+
* This method queries for all `auro-counter` elements, sums their values, and updates the component's `value` property.
|
|
198
|
+
* Additionally, it iterates through each counter and calls `manageDisabled()` on it.
|
|
199
|
+
* @private
|
|
200
|
+
*/
|
|
201
|
+
private updateValue;
|
|
202
|
+
/**
|
|
203
|
+
* Updates the validity of the counter group based on the validity of its counters.
|
|
204
|
+
* This method checks all counters within the group, determines if any are invalid, and updates the group's validity state and error message accordingly.
|
|
205
|
+
* If any counter is invalid, it generates a combined error message from all invalid counters.
|
|
180
206
|
* @returns {void}
|
|
181
207
|
* @private
|
|
182
208
|
*/
|
|
183
|
-
private
|
|
209
|
+
private updateValidity;
|
|
184
210
|
/**
|
|
185
211
|
* Dynamically generated dropdown tag.
|
|
186
212
|
* @private
|
|
@@ -199,6 +225,10 @@ export class AuroCounterGroup extends LitElement {
|
|
|
199
225
|
* @type {string}
|
|
200
226
|
*/
|
|
201
227
|
private helpTextTag;
|
|
228
|
+
/**
|
|
229
|
+
* @private
|
|
230
|
+
*/
|
|
231
|
+
private iconTag;
|
|
202
232
|
/**
|
|
203
233
|
* Dynamically disables increment/decrement buttons on a counter based on group value.
|
|
204
234
|
* This method checks the total aggregated value against the group's min and max properties.
|
|
@@ -216,15 +246,27 @@ export class AuroCounterGroup extends LitElement {
|
|
|
216
246
|
*/
|
|
217
247
|
private configureCounters;
|
|
218
248
|
/**
|
|
219
|
-
*
|
|
220
|
-
*
|
|
221
|
-
*
|
|
222
|
-
* @param {boolean} dropdownIsOpen - Indicates whether the dropdown is currently open.
|
|
223
|
-
* @returns {void}
|
|
249
|
+
* Renders help text error messages.
|
|
250
|
+
* @param {Array<string>} messages - The error messages to render.
|
|
251
|
+
* @returns {TemplateResult[]} - The rendered error messages rendered in a TemplateResult.
|
|
224
252
|
* @private
|
|
225
253
|
*/
|
|
226
|
-
private
|
|
227
|
-
|
|
254
|
+
private renderHelpTextErrors;
|
|
255
|
+
/**
|
|
256
|
+
* Gets and returns an array of counters in an invalid state.
|
|
257
|
+
* @returns {Array<HTMLElement>} - Returns an array of invalid counters.
|
|
258
|
+
* @param {NodeList} counters - The NodeList of counter elements to check.
|
|
259
|
+
* @private
|
|
260
|
+
*/
|
|
261
|
+
private getInvalidCounters;
|
|
262
|
+
/**
|
|
263
|
+
* Gets all valid error messages from errored counters.
|
|
264
|
+
* @param {NodeList} invalidCounters - The NodeList of counter elements to check.
|
|
265
|
+
* @returns {Array<string>} - Returns an array of error messages from invalid counters.
|
|
266
|
+
* @private
|
|
267
|
+
*/
|
|
268
|
+
private getErrorMessages;
|
|
269
|
+
errorMessage: any;
|
|
228
270
|
/**
|
|
229
271
|
* Configures the dropdown counters by selecting all `auro-counter` elements,
|
|
230
272
|
* appending them to the `auro-counter-wrapper` element within the shadow DOM,
|
|
@@ -251,13 +293,6 @@ export class AuroCounterGroup extends LitElement {
|
|
|
251
293
|
* @returns {number} The converted number or 0 if invalid.
|
|
252
294
|
*/
|
|
253
295
|
private safeNumberConversion;
|
|
254
|
-
/**
|
|
255
|
-
* Updates the aggregate value based on the values of contained auro-counter components.
|
|
256
|
-
* This method queries for all `auro-counter` elements, sums their values, and updates the component's `value` property.
|
|
257
|
-
* Additionally, it iterates through each counter and calls `manageDisabled()` on it.
|
|
258
|
-
* @private
|
|
259
|
-
*/
|
|
260
|
-
private updateValue;
|
|
261
296
|
/**
|
|
262
297
|
* Updates the value text in the dropdown trigger based on the counters in the counter group.
|
|
263
298
|
* @private
|
|
@@ -271,6 +306,18 @@ export class AuroCounterGroup extends LitElement {
|
|
|
271
306
|
validate(force?: boolean): void;
|
|
272
307
|
updated(changedProperties: any): void;
|
|
273
308
|
firstUpdated(): void;
|
|
309
|
+
/**
|
|
310
|
+
* Returns HTML for the help text and error message.
|
|
311
|
+
* @private
|
|
312
|
+
* @returns {html} - Returns HTML for the help text and error message.
|
|
313
|
+
*/
|
|
314
|
+
private renderHelpText;
|
|
315
|
+
/**
|
|
316
|
+
* Returns HTML for the validation error icon.
|
|
317
|
+
* @private
|
|
318
|
+
* @returns {html} - Returns HTML for the validation error icon.
|
|
319
|
+
*/
|
|
320
|
+
private renderValidationErrorIcon;
|
|
274
321
|
/**
|
|
275
322
|
* Render the dropdown structure for the counter group.
|
|
276
323
|
* @returns {TemplateResult} The dropdown template.
|
|
@@ -283,12 +330,6 @@ export class AuroCounterGroup extends LitElement {
|
|
|
283
330
|
* @private
|
|
284
331
|
*/
|
|
285
332
|
private renderDropdownTrigger;
|
|
286
|
-
/**
|
|
287
|
-
* Render the help text for the counter group.
|
|
288
|
-
* @returns {TemplateResult} The help text template.
|
|
289
|
-
* @private
|
|
290
|
-
*/
|
|
291
|
-
private renderHelpText;
|
|
292
333
|
/**
|
|
293
334
|
* Render the dropdown bib template for the dropdown.
|
|
294
335
|
* @returns {TemplateResult} The bib template.
|
|
@@ -42,6 +42,10 @@ export class AuroCounter extends LitElement {
|
|
|
42
42
|
* @type {string}
|
|
43
43
|
*/
|
|
44
44
|
private iconTag;
|
|
45
|
+
/**
|
|
46
|
+
* @private
|
|
47
|
+
*/
|
|
48
|
+
private helpTextTag;
|
|
45
49
|
/**
|
|
46
50
|
* Increments the counter value by 1. If a value is provided, it increments by that amount.
|
|
47
51
|
* @method increment
|
|
@@ -98,6 +102,12 @@ export class AuroCounter extends LitElement {
|
|
|
98
102
|
*/
|
|
99
103
|
private onDefaultSlotChange;
|
|
100
104
|
updated(changedProperties: any): void;
|
|
105
|
+
/**
|
|
106
|
+
* Returns HTML for the help text and error message.
|
|
107
|
+
* @private
|
|
108
|
+
* @returns {html} - Returns HTML for the help text and error message.
|
|
109
|
+
*/
|
|
110
|
+
private renderHelpText;
|
|
101
111
|
render(): import("lit-html").TemplateResult;
|
|
102
112
|
}
|
|
103
113
|
import { LitElement } from "lit";
|