@momentum-design/components 0.28.9 → 0.29.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/dist/browser/index.js +72 -72
- package/dist/browser/index.js.map +4 -4
- package/dist/components/checkbox/checkbox.component.js +2 -0
- package/dist/components/input/input.component.d.ts +1 -0
- package/dist/components/input/input.component.js +3 -1
- package/dist/components/radio/radio.component.js +2 -0
- package/dist/components/toggle/toggle.component.js +2 -0
- package/dist/custom-elements.json +56 -97
- package/dist/utils/mixins/FormInternalsMixin.js +0 -2
- package/package.json +1 -1
@@ -10,6 +10,7 @@ var __metadata = (this && this.__metadata) || function (k, v) {
|
|
10
10
|
import { html, nothing } from 'lit';
|
11
11
|
import { property } from 'lit/decorators.js';
|
12
12
|
import { ifDefined } from 'lit/directives/if-defined.js';
|
13
|
+
import { v4 as uuidv4 } from 'uuid';
|
13
14
|
import { DataAriaLabelMixin } from '../../utils/mixins/DataAriaLabelMixin';
|
14
15
|
import { FormInternalsMixin } from '../../utils/mixins/FormInternalsMixin';
|
15
16
|
import FormfieldWrapper from '../formfieldwrapper/formfieldwrapper.component';
|
@@ -78,6 +79,7 @@ class Checkbox extends FormInternalsMixin(DataAriaLabelMixin(FormfieldWrapper))
|
|
78
79
|
};
|
79
80
|
// Checkbox does not contain helpTextType property.
|
80
81
|
this.helpTextType = undefined;
|
82
|
+
this.id = `mdc-input-${uuidv4()}`;
|
81
83
|
}
|
82
84
|
/**
|
83
85
|
* Updates the form value to reflect the current state of the checkbox.
|
@@ -10,6 +10,7 @@ var __metadata = (this && this.__metadata) || function (k, v) {
|
|
10
10
|
import { html, nothing } from 'lit';
|
11
11
|
import { property } from 'lit/decorators.js';
|
12
12
|
import { ifDefined } from 'lit/directives/if-defined.js';
|
13
|
+
import { v4 as uuidv4 } from 'uuid';
|
13
14
|
import styles from './input.styles';
|
14
15
|
import FormfieldWrapper from '../formfieldwrapper';
|
15
16
|
import { AUTO_CAPITALIZE, DEFAULTS, PREFIX_TEXT_OPTIONS } from './input.constants';
|
@@ -59,7 +60,7 @@ import { FormInternalsMixin } from '../../utils/mixins/FormInternalsMixin';
|
|
59
60
|
*/
|
60
61
|
class Input extends FormInternalsMixin(DataAriaLabelMixin(FormfieldWrapper)) {
|
61
62
|
constructor() {
|
62
|
-
super(
|
63
|
+
super();
|
63
64
|
/**
|
64
65
|
* The placeholder text that is displayed when the input field is empty.
|
65
66
|
*/
|
@@ -93,6 +94,7 @@ class Input extends FormInternalsMixin(DataAriaLabelMixin(FormfieldWrapper)) {
|
|
93
94
|
* @default ''
|
94
95
|
*/
|
95
96
|
this.clearAriaLabel = '';
|
97
|
+
this.id = `mdc-input-${uuidv4()}`;
|
96
98
|
}
|
97
99
|
connectedCallback() {
|
98
100
|
super.connectedCallback();
|
@@ -11,6 +11,7 @@ var __metadata = (this && this.__metadata) || function (k, v) {
|
|
11
11
|
import { html, nothing } from 'lit';
|
12
12
|
import { property } from 'lit/decorators.js';
|
13
13
|
import { ifDefined } from 'lit/directives/if-defined.js';
|
14
|
+
import { v4 as uuidv4 } from 'uuid';
|
14
15
|
import styles from './radio.styles';
|
15
16
|
import FormfieldWrapper from '../formfieldwrapper/formfieldwrapper.component';
|
16
17
|
import { DataAriaLabelMixin } from '../../utils/mixins/DataAriaLabelMixin';
|
@@ -77,6 +78,7 @@ class Radio extends FormInternalsMixin(DataAriaLabelMixin(FormfieldWrapper)) {
|
|
77
78
|
};
|
78
79
|
// Radio does not contain helpTextType property.
|
79
80
|
this.helpTextType = undefined;
|
81
|
+
this.id = `mdc-radio-${uuidv4()}`;
|
80
82
|
}
|
81
83
|
firstUpdated() {
|
82
84
|
this.updateTabIndex();
|
@@ -10,6 +10,7 @@ var __metadata = (this && this.__metadata) || function (k, v) {
|
|
10
10
|
import { html } from 'lit';
|
11
11
|
import { property } from 'lit/decorators.js';
|
12
12
|
import { ifDefined } from 'lit/directives/if-defined.js';
|
13
|
+
import { v4 as uuidv4 } from 'uuid';
|
13
14
|
import styles from './toggle.styles';
|
14
15
|
import FormfieldWrapper from '../formfieldwrapper';
|
15
16
|
import { DEFAULTS as FORMFIELD_DEFAULTS } from '../formfieldwrapper/formfieldwrapper.constants';
|
@@ -75,6 +76,7 @@ class Toggle extends FormInternalsMixin(DataAriaLabelMixin(FormfieldWrapper)) {
|
|
75
76
|
this.autofocus = false;
|
76
77
|
// Toggle does not contain helpTextType property.
|
77
78
|
this.helpTextType = undefined;
|
79
|
+
this.id = `mdc-toggle-${uuidv4()}`;
|
78
80
|
}
|
79
81
|
/** @internal
|
80
82
|
* Resets the checkbox to its initial state.
|
@@ -546,15 +546,6 @@
|
|
546
546
|
"module": "utils/mixins/FormInternalsMixin.js"
|
547
547
|
}
|
548
548
|
},
|
549
|
-
{
|
550
|
-
"kind": "field",
|
551
|
-
"name": "id",
|
552
|
-
"default": "`mdc-input-${uuidv4()}`",
|
553
|
-
"inheritedFrom": {
|
554
|
-
"name": "FormInternalsMixin",
|
555
|
-
"module": "utils/mixins/FormInternalsMixin.js"
|
556
|
-
}
|
557
|
-
},
|
558
549
|
{
|
559
550
|
"kind": "field",
|
560
551
|
"name": "tabIndex",
|
@@ -1646,15 +1637,6 @@
|
|
1646
1637
|
"module": "utils/mixins/FormInternalsMixin.js"
|
1647
1638
|
}
|
1648
1639
|
},
|
1649
|
-
{
|
1650
|
-
"kind": "field",
|
1651
|
-
"name": "id",
|
1652
|
-
"default": "`mdc-input-${uuidv4()}`",
|
1653
|
-
"inheritedFrom": {
|
1654
|
-
"name": "FormInternalsMixin",
|
1655
|
-
"module": "utils/mixins/FormInternalsMixin.js"
|
1656
|
-
}
|
1657
|
-
},
|
1658
1640
|
{
|
1659
1641
|
"kind": "field",
|
1660
1642
|
"name": "tabIndex",
|
@@ -2373,15 +2355,6 @@
|
|
2373
2355
|
"module": "utils/mixins/FormInternalsMixin.js"
|
2374
2356
|
}
|
2375
2357
|
},
|
2376
|
-
{
|
2377
|
-
"kind": "field",
|
2378
|
-
"name": "id",
|
2379
|
-
"default": "`mdc-input-${uuidv4()}`",
|
2380
|
-
"inheritedFrom": {
|
2381
|
-
"name": "FormInternalsMixin",
|
2382
|
-
"module": "utils/mixins/FormInternalsMixin.js"
|
2383
|
-
}
|
2384
|
-
},
|
2385
2358
|
{
|
2386
2359
|
"kind": "field",
|
2387
2360
|
"name": "tabIndex",
|
@@ -2759,6 +2732,20 @@
|
|
2759
2732
|
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
2760
2733
|
}
|
2761
2734
|
},
|
2735
|
+
{
|
2736
|
+
"kind": "field",
|
2737
|
+
"name": "id",
|
2738
|
+
"type": {
|
2739
|
+
"text": "string"
|
2740
|
+
},
|
2741
|
+
"default": "`mdc-input-${uuidv4()}`",
|
2742
|
+
"description": "The unique id of the input field. It is used to link the input field with the label.",
|
2743
|
+
"attribute": "id",
|
2744
|
+
"inheritedFrom": {
|
2745
|
+
"name": "FormfieldWrapper",
|
2746
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
2747
|
+
}
|
2748
|
+
},
|
2762
2749
|
{
|
2763
2750
|
"kind": "field",
|
2764
2751
|
"name": "name",
|
@@ -2859,20 +2846,6 @@
|
|
2859
2846
|
"module": "utils/mixins/FormInternalsMixin.js"
|
2860
2847
|
}
|
2861
2848
|
},
|
2862
|
-
{
|
2863
|
-
"kind": "field",
|
2864
|
-
"name": "id",
|
2865
|
-
"type": {
|
2866
|
-
"text": "string"
|
2867
|
-
},
|
2868
|
-
"default": "`mdc-input-${uuidv4()}`",
|
2869
|
-
"description": "The unique id of the input field. It is used to link the input field with the label.",
|
2870
|
-
"attribute": "id",
|
2871
|
-
"inheritedFrom": {
|
2872
|
-
"name": "FormfieldWrapper",
|
2873
|
-
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
2874
|
-
}
|
2875
|
-
},
|
2876
2849
|
{
|
2877
2850
|
"kind": "field",
|
2878
2851
|
"name": "dataAriaLabel",
|
@@ -4774,6 +4747,20 @@
|
|
4774
4747
|
}
|
4775
4748
|
}
|
4776
4749
|
},
|
4750
|
+
{
|
4751
|
+
"kind": "field",
|
4752
|
+
"name": "id",
|
4753
|
+
"type": {
|
4754
|
+
"text": "string"
|
4755
|
+
},
|
4756
|
+
"default": "`mdc-input-${uuidv4()}`",
|
4757
|
+
"description": "The unique id of the input field. It is used to link the input field with the label.",
|
4758
|
+
"attribute": "id",
|
4759
|
+
"inheritedFrom": {
|
4760
|
+
"name": "FormfieldWrapper",
|
4761
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
4762
|
+
}
|
4763
|
+
},
|
4777
4764
|
{
|
4778
4765
|
"kind": "field",
|
4779
4766
|
"name": "name",
|
@@ -4874,20 +4861,6 @@
|
|
4874
4861
|
"module": "utils/mixins/FormInternalsMixin.js"
|
4875
4862
|
}
|
4876
4863
|
},
|
4877
|
-
{
|
4878
|
-
"kind": "field",
|
4879
|
-
"name": "id",
|
4880
|
-
"type": {
|
4881
|
-
"text": "string"
|
4882
|
-
},
|
4883
|
-
"default": "`mdc-input-${uuidv4()}`",
|
4884
|
-
"description": "The unique id of the input field. It is used to link the input field with the label.",
|
4885
|
-
"attribute": "id",
|
4886
|
-
"inheritedFrom": {
|
4887
|
-
"name": "FormfieldWrapper",
|
4888
|
-
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
4889
|
-
}
|
4890
|
-
},
|
4891
4864
|
{
|
4892
4865
|
"kind": "field",
|
4893
4866
|
"name": "dataAriaLabel",
|
@@ -8187,6 +8160,20 @@
|
|
8187
8160
|
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
8188
8161
|
}
|
8189
8162
|
},
|
8163
|
+
{
|
8164
|
+
"kind": "field",
|
8165
|
+
"name": "id",
|
8166
|
+
"type": {
|
8167
|
+
"text": "string"
|
8168
|
+
},
|
8169
|
+
"default": "`mdc-radio-${uuidv4()}`",
|
8170
|
+
"description": "The unique id of the input field. It is used to link the input field with the label.",
|
8171
|
+
"attribute": "id",
|
8172
|
+
"inheritedFrom": {
|
8173
|
+
"name": "FormfieldWrapper",
|
8174
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
8175
|
+
}
|
8176
|
+
},
|
8190
8177
|
{
|
8191
8178
|
"kind": "field",
|
8192
8179
|
"name": "name",
|
@@ -8287,20 +8274,6 @@
|
|
8287
8274
|
"module": "utils/mixins/FormInternalsMixin.js"
|
8288
8275
|
}
|
8289
8276
|
},
|
8290
|
-
{
|
8291
|
-
"kind": "field",
|
8292
|
-
"name": "id",
|
8293
|
-
"type": {
|
8294
|
-
"text": "string"
|
8295
|
-
},
|
8296
|
-
"default": "`mdc-input-${uuidv4()}`",
|
8297
|
-
"description": "The unique id of the input field. It is used to link the input field with the label.",
|
8298
|
-
"attribute": "id",
|
8299
|
-
"inheritedFrom": {
|
8300
|
-
"name": "FormfieldWrapper",
|
8301
|
-
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
8302
|
-
}
|
8303
|
-
},
|
8304
8277
|
{
|
8305
8278
|
"kind": "field",
|
8306
8279
|
"name": "dataAriaLabel",
|
@@ -9630,15 +9603,6 @@
|
|
9630
9603
|
"module": "components/buttonsimple/buttonsimple.component.js"
|
9631
9604
|
}
|
9632
9605
|
},
|
9633
|
-
{
|
9634
|
-
"kind": "field",
|
9635
|
-
"name": "id",
|
9636
|
-
"default": "`mdc-input-${uuidv4()}`",
|
9637
|
-
"inheritedFrom": {
|
9638
|
-
"name": "Buttonsimple",
|
9639
|
-
"module": "components/buttonsimple/buttonsimple.component.js"
|
9640
|
-
}
|
9641
|
-
},
|
9642
9606
|
{
|
9643
9607
|
"kind": "field",
|
9644
9608
|
"name": "tabIndex",
|
@@ -10420,6 +10384,20 @@
|
|
10420
10384
|
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
10421
10385
|
}
|
10422
10386
|
},
|
10387
|
+
{
|
10388
|
+
"kind": "field",
|
10389
|
+
"name": "id",
|
10390
|
+
"type": {
|
10391
|
+
"text": "string"
|
10392
|
+
},
|
10393
|
+
"default": "`mdc-toggle-${uuidv4()}`",
|
10394
|
+
"description": "The unique id of the input field. It is used to link the input field with the label.",
|
10395
|
+
"attribute": "id",
|
10396
|
+
"inheritedFrom": {
|
10397
|
+
"name": "FormfieldWrapper",
|
10398
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
10399
|
+
}
|
10400
|
+
},
|
10423
10401
|
{
|
10424
10402
|
"kind": "field",
|
10425
10403
|
"name": "name",
|
@@ -10520,20 +10498,6 @@
|
|
10520
10498
|
"module": "utils/mixins/FormInternalsMixin.js"
|
10521
10499
|
}
|
10522
10500
|
},
|
10523
|
-
{
|
10524
|
-
"kind": "field",
|
10525
|
-
"name": "id",
|
10526
|
-
"type": {
|
10527
|
-
"text": "string"
|
10528
|
-
},
|
10529
|
-
"default": "`mdc-input-${uuidv4()}`",
|
10530
|
-
"description": "The unique id of the input field. It is used to link the input field with the label.",
|
10531
|
-
"attribute": "id",
|
10532
|
-
"inheritedFrom": {
|
10533
|
-
"name": "FormfieldWrapper",
|
10534
|
-
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
10535
|
-
}
|
10536
|
-
},
|
10537
10501
|
{
|
10538
10502
|
"kind": "field",
|
10539
10503
|
"name": "dataAriaLabel",
|
@@ -11895,11 +11859,6 @@
|
|
11895
11859
|
{
|
11896
11860
|
"kind": "method",
|
11897
11861
|
"name": "reportValidity"
|
11898
|
-
},
|
11899
|
-
{
|
11900
|
-
"kind": "field",
|
11901
|
-
"name": "id",
|
11902
|
-
"default": "`mdc-input-${uuidv4()}`"
|
11903
11862
|
}
|
11904
11863
|
],
|
11905
11864
|
"attributes": [
|
@@ -8,7 +8,6 @@ var __metadata = (this && this.__metadata) || function (k, v) {
|
|
8
8
|
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
|
9
9
|
};
|
10
10
|
import { property, query } from 'lit/decorators.js';
|
11
|
-
import { v4 as uuidv4 } from 'uuid';
|
12
11
|
export const FormInternalsMixin = (superClass) => {
|
13
12
|
class InnerMixinClass extends superClass {
|
14
13
|
/** @internal */
|
@@ -36,7 +35,6 @@ export const FormInternalsMixin = (superClass) => {
|
|
36
35
|
this.value = '';
|
37
36
|
/** @internal */
|
38
37
|
this.internals = this.attachInternals();
|
39
|
-
this.id = `mdc-input-${uuidv4()}`;
|
40
38
|
}
|
41
39
|
/**
|
42
40
|
* Sets the validity of the input field based on the input field's validity.
|
package/package.json
CHANGED