@lion/ui 0.11.3 → 0.11.4
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/form-core/src/FormControlMixin.js +2 -2
- package/components/form-core/test/FormControlMixin.test.js +10 -2
- package/custom-elements.json +63 -51
- package/dist-types/tsconfig.tsbuildinfo +1 -1
- package/docs/components/checkbox-group/overview.md +2 -2
- package/docs/components/collapsible/overview.md +1 -1
- package/docs/components/combobox/overview.md +1 -1
- package/docs/components/combobox/use-cases.md +1 -1
- package/docs/components/dialog/overview.md +1 -1
- package/docs/components/fieldset/overview.md +5 -5
- package/docs/components/form/overview.md +3 -3
- package/docs/components/form/use-cases.md +2 -2
- package/docs/components/icon/use-cases.md +1 -1
- package/docs/components/input/overview.md +1 -1
- package/docs/components/input-amount/overview.md +3 -3
- package/docs/components/input-date/overview.md +3 -3
- package/docs/components/input-datepicker/overview.md +5 -5
- package/docs/components/input-email/overview.md +2 -2
- package/docs/components/input-file/overview.md +1 -1
- package/docs/components/input-iban/overview.md +2 -2
- package/docs/components/input-range/overview.md +2 -2
- package/docs/components/input-stepper/overview.md +1 -1
- package/docs/components/input-tel/overview.md +1 -1
- package/docs/components/input-tel/use-cases.md +6 -6
- package/docs/components/input-tel-dropdown/overview.md +1 -1
- package/docs/components/listbox/use-cases.md +1 -1
- package/docs/components/radio-group/overview.md +3 -3
- package/docs/components/select/use-cases.md +1 -1
- package/docs/components/select-rich/use-cases.md +1 -1
- package/docs/components/tabs/examples.md +1 -1
- package/docs/fundamentals/index.md +4 -4
- package/docs/fundamentals/node-tools/publish-docs/overview.md +3 -3
- package/docs/fundamentals/node-tools/rocket-preset-extend-lion-docs/overview.md +2 -2
- package/docs/fundamentals/rationales/accessibility.md +1 -1
- package/docs/fundamentals/systems/core/SlotMixin.md +1 -1
- package/docs/fundamentals/systems/core/overview.md +1 -1
- package/docs/fundamentals/systems/form/formatting-and-parsing.md +4 -4
- package/docs/fundamentals/systems/form/model-value.md +1 -1
- package/docs/fundamentals/systems/form/overview.md +28 -28
- package/docs/fundamentals/systems/form/validate.md +2 -2
- package/docs/fundamentals/systems/localize/overview.md +4 -4
- package/docs/fundamentals/systems/overlays/configuration.md +2 -2
- package/docs/fundamentals/systems/overlays/overview.md +5 -5
- package/docs/fundamentals/systems/overlays/use-cases.md +2 -2
- package/docs/fundamentals/tools/helpers/overview.md +1 -1
- package/docs/fundamentals/tools/singleton-manager/overview.md +4 -4
- package/docs/guides/how-to/create-a-custom-field.md +5 -5
- package/docs/guides/how-to/create-a-form.md +4 -4
- package/docs/guides/how-to/extend-a-native-input.md +2 -2
- package/docs/guides/index.md +8 -8
- package/docs/guides/principles/index.md +5 -5
- package/docs/guides/principles/styling.md +1 -1
- package/package.json +1 -1
|
@@ -293,11 +293,11 @@ const FormControlMixinImplementation = superclass =>
|
|
|
293
293
|
);
|
|
294
294
|
}
|
|
295
295
|
|
|
296
|
-
if (changedProperties.has('label') && this._labelNode) {
|
|
296
|
+
if (changedProperties.has('label') && this.__label && this._labelNode) {
|
|
297
297
|
this._labelNode.textContent = this.label;
|
|
298
298
|
}
|
|
299
299
|
|
|
300
|
-
if (changedProperties.has('helpText') && this._helpTextNode) {
|
|
300
|
+
if (changedProperties.has('helpText') && this.__helpText && this._helpTextNode) {
|
|
301
301
|
this._helpTextNode.textContent = this.helpText;
|
|
302
302
|
}
|
|
303
303
|
|
|
@@ -52,11 +52,13 @@ describe('FormControlMixin', () => {
|
|
|
52
52
|
const elElem = /** @type {FormControlMixinClass} */ (
|
|
53
53
|
await fixture(html`
|
|
54
54
|
<${tag}>
|
|
55
|
-
<label slot="label">Email address</label>
|
|
55
|
+
<label slot="label"><b>Email</b> address</label>
|
|
56
56
|
${inputSlot}
|
|
57
57
|
</${tag}>`)
|
|
58
58
|
);
|
|
59
59
|
expect(elElem.label).to.equal('Email address', 'as an element');
|
|
60
|
+
// @ts-expect-error
|
|
61
|
+
expect(elElem._labelNode.innerHTML).to.equal('<b>Email</b> address', 'html as an element');
|
|
60
62
|
});
|
|
61
63
|
|
|
62
64
|
it('has a label that supports inner html', async () => {
|
|
@@ -68,6 +70,8 @@ describe('FormControlMixin', () => {
|
|
|
68
70
|
</${tag}>`)
|
|
69
71
|
);
|
|
70
72
|
expect(el.label).to.equal('Email address');
|
|
73
|
+
// @ts-expect-error
|
|
74
|
+
expect(el._labelNode.innerHTML).to.equal('Email <span>address</span>');
|
|
71
75
|
});
|
|
72
76
|
|
|
73
77
|
it('only takes label of direct child', async () => {
|
|
@@ -139,11 +143,13 @@ describe('FormControlMixin', () => {
|
|
|
139
143
|
const elElem = /** @type {FormControlMixinClass} */ (
|
|
140
144
|
await fixture(html`
|
|
141
145
|
<${tag}>
|
|
142
|
-
<div slot="help-text">We will not send you any spam</div>
|
|
146
|
+
<div slot="help-text">We will <b>not</b> send you any spam</div>
|
|
143
147
|
${inputSlot}
|
|
144
148
|
</${tag}>`)
|
|
145
149
|
);
|
|
146
150
|
expect(elElem.helpText).to.equal('We will not send you any spam', 'as an element');
|
|
151
|
+
// @ts-expect-error
|
|
152
|
+
expect(elElem._helpTextNode.innerHTML).to.equal('We will <b>not</b> send you any spam');
|
|
147
153
|
});
|
|
148
154
|
|
|
149
155
|
it('can have a help-text that supports inner html', async () => {
|
|
@@ -155,6 +161,8 @@ describe('FormControlMixin', () => {
|
|
|
155
161
|
</${tag}>`)
|
|
156
162
|
);
|
|
157
163
|
expect(el.helpText).to.equal('We will not send you any spam');
|
|
164
|
+
// @ts-expect-error
|
|
165
|
+
expect(el._helpTextNode.innerHTML).to.equal('We will not send you any <span>spam</span>');
|
|
158
166
|
});
|
|
159
167
|
|
|
160
168
|
it('only takes help-text of direct child', async () => {
|
package/custom-elements.json
CHANGED
|
@@ -146520,7 +146520,12 @@
|
|
|
146520
146520
|
},
|
|
146521
146521
|
{
|
|
146522
146522
|
"kind": "variable",
|
|
146523
|
-
"name": "
|
|
146523
|
+
"name": "m"
|
|
146524
|
+
},
|
|
146525
|
+
{
|
|
146526
|
+
"kind": "variable",
|
|
146527
|
+
"name": "i",
|
|
146528
|
+
"default": "t"
|
|
146524
146529
|
},
|
|
146525
146530
|
{
|
|
146526
146531
|
"kind": "class",
|
|
@@ -146548,6 +146553,25 @@
|
|
|
146548
146553
|
],
|
|
146549
146554
|
"privacy": "public"
|
|
146550
146555
|
},
|
|
146556
|
+
{
|
|
146557
|
+
"kind": "method",
|
|
146558
|
+
"name": "C",
|
|
146559
|
+
"parameters": [
|
|
146560
|
+
{
|
|
146561
|
+
"name": "t"
|
|
146562
|
+
},
|
|
146563
|
+
{
|
|
146564
|
+
"name": "s"
|
|
146565
|
+
},
|
|
146566
|
+
{
|
|
146567
|
+
"name": "{useDefault:i,reflect:e,wrapped:h}"
|
|
146568
|
+
},
|
|
146569
|
+
{
|
|
146570
|
+
"name": "r"
|
|
146571
|
+
}
|
|
146572
|
+
],
|
|
146573
|
+
"privacy": "public"
|
|
146574
|
+
},
|
|
146551
146575
|
{
|
|
146552
146576
|
"kind": "method",
|
|
146553
146577
|
"name": "createProperty",
|
|
@@ -146558,7 +146582,7 @@
|
|
|
146558
146582
|
},
|
|
146559
146583
|
{
|
|
146560
146584
|
"name": "s",
|
|
146561
|
-
"default": "
|
|
146585
|
+
"default": "y"
|
|
146562
146586
|
}
|
|
146563
146587
|
],
|
|
146564
146588
|
"privacy": "public"
|
|
@@ -146641,22 +146665,6 @@
|
|
|
146641
146665
|
"default": "!1",
|
|
146642
146666
|
"privacy": "public"
|
|
146643
146667
|
},
|
|
146644
|
-
{
|
|
146645
|
-
"kind": "method",
|
|
146646
|
-
"name": "P",
|
|
146647
|
-
"parameters": [
|
|
146648
|
-
{
|
|
146649
|
-
"name": "t"
|
|
146650
|
-
},
|
|
146651
|
-
{
|
|
146652
|
-
"name": "s"
|
|
146653
|
-
},
|
|
146654
|
-
{
|
|
146655
|
-
"name": "i"
|
|
146656
|
-
}
|
|
146657
|
-
],
|
|
146658
|
-
"privacy": "public"
|
|
146659
|
-
},
|
|
146660
146668
|
{
|
|
146661
146669
|
"kind": "method",
|
|
146662
146670
|
"name": "removeController",
|
|
@@ -146698,21 +146706,13 @@
|
|
|
146698
146706
|
},
|
|
146699
146707
|
{
|
|
146700
146708
|
"kind": "method",
|
|
146701
|
-
"name": "_$
|
|
146702
|
-
"
|
|
146703
|
-
{
|
|
146704
|
-
"name": "t"
|
|
146705
|
-
},
|
|
146706
|
-
{
|
|
146707
|
-
"name": "s"
|
|
146708
|
-
}
|
|
146709
|
-
],
|
|
146709
|
+
"name": "_$Ei",
|
|
146710
|
+
"static": true,
|
|
146710
146711
|
"privacy": "protected"
|
|
146711
146712
|
},
|
|
146712
146713
|
{
|
|
146713
146714
|
"kind": "method",
|
|
146714
|
-
"name": "_$
|
|
146715
|
-
"static": true,
|
|
146715
|
+
"name": "_$EM",
|
|
146716
146716
|
"privacy": "protected"
|
|
146717
146717
|
},
|
|
146718
146718
|
{
|
|
@@ -146724,6 +146724,11 @@
|
|
|
146724
146724
|
"default": "null",
|
|
146725
146725
|
"privacy": "protected"
|
|
146726
146726
|
},
|
|
146727
|
+
{
|
|
146728
|
+
"kind": "method",
|
|
146729
|
+
"name": "_$EP",
|
|
146730
|
+
"privacy": "protected"
|
|
146731
|
+
},
|
|
146727
146732
|
{
|
|
146728
146733
|
"kind": "field",
|
|
146729
146734
|
"name": "_$Ep",
|
|
@@ -146733,6 +146738,14 @@
|
|
|
146733
146738
|
{
|
|
146734
146739
|
"kind": "method",
|
|
146735
146740
|
"name": "_$ET",
|
|
146741
|
+
"parameters": [
|
|
146742
|
+
{
|
|
146743
|
+
"name": "t"
|
|
146744
|
+
},
|
|
146745
|
+
{
|
|
146746
|
+
"name": "s"
|
|
146747
|
+
}
|
|
146748
|
+
],
|
|
146736
146749
|
"privacy": "protected"
|
|
146737
146750
|
},
|
|
146738
146751
|
{
|
|
@@ -146749,11 +146762,6 @@
|
|
|
146749
146762
|
],
|
|
146750
146763
|
"privacy": "protected"
|
|
146751
146764
|
},
|
|
146752
|
-
{
|
|
146753
|
-
"kind": "method",
|
|
146754
|
-
"name": "_$EU",
|
|
146755
|
-
"privacy": "protected"
|
|
146756
|
-
},
|
|
146757
146765
|
{
|
|
146758
146766
|
"kind": "method",
|
|
146759
146767
|
"name": "_$Ev",
|
|
@@ -146768,6 +146776,10 @@
|
|
|
146768
146776
|
"superclass": {
|
|
146769
146777
|
"module": "../../node_modules/@lit/reactive-element/node/reactive-element.js"
|
|
146770
146778
|
}
|
|
146779
|
+
},
|
|
146780
|
+
{
|
|
146781
|
+
"kind": "variable",
|
|
146782
|
+
"name": "e"
|
|
146771
146783
|
}
|
|
146772
146784
|
],
|
|
146773
146785
|
"exports": [
|
|
@@ -146779,14 +146791,6 @@
|
|
|
146779
146791
|
"module": "\"./css-tag.js\""
|
|
146780
146792
|
}
|
|
146781
146793
|
},
|
|
146782
|
-
{
|
|
146783
|
-
"kind": "js",
|
|
146784
|
-
"name": "adoptStyles",
|
|
146785
|
-
"declaration": {
|
|
146786
|
-
"name": "adoptStyles",
|
|
146787
|
-
"module": "\"./css-tag.js\""
|
|
146788
|
-
}
|
|
146789
|
-
},
|
|
146790
146794
|
{
|
|
146791
146795
|
"kind": "js",
|
|
146792
146796
|
"name": "css",
|
|
@@ -146795,14 +146799,6 @@
|
|
|
146795
146799
|
"module": "\"./css-tag.js\""
|
|
146796
146800
|
}
|
|
146797
146801
|
},
|
|
146798
|
-
{
|
|
146799
|
-
"kind": "js",
|
|
146800
|
-
"name": "getCompatibleStyle",
|
|
146801
|
-
"declaration": {
|
|
146802
|
-
"name": "getCompatibleStyle",
|
|
146803
|
-
"module": "\"./css-tag.js\""
|
|
146804
|
-
}
|
|
146805
|
-
},
|
|
146806
146802
|
{
|
|
146807
146803
|
"kind": "js",
|
|
146808
146804
|
"name": "supportsAdoptingStyleSheets",
|
|
@@ -146827,6 +146823,14 @@
|
|
|
146827
146823
|
"module": "../../node_modules/@lit/reactive-element/node/reactive-element.js"
|
|
146828
146824
|
}
|
|
146829
146825
|
},
|
|
146826
|
+
{
|
|
146827
|
+
"kind": "js",
|
|
146828
|
+
"name": "adoptStyles",
|
|
146829
|
+
"declaration": {
|
|
146830
|
+
"name": "e",
|
|
146831
|
+
"module": "../../node_modules/@lit/reactive-element/node/reactive-element.js"
|
|
146832
|
+
}
|
|
146833
|
+
},
|
|
146830
146834
|
{
|
|
146831
146835
|
"kind": "js",
|
|
146832
146836
|
"name": "defaultConverter",
|
|
@@ -146835,11 +146839,19 @@
|
|
|
146835
146839
|
"module": "../../node_modules/@lit/reactive-element/node/reactive-element.js"
|
|
146836
146840
|
}
|
|
146837
146841
|
},
|
|
146842
|
+
{
|
|
146843
|
+
"kind": "js",
|
|
146844
|
+
"name": "getCompatibleStyle",
|
|
146845
|
+
"declaration": {
|
|
146846
|
+
"name": "i",
|
|
146847
|
+
"module": "../../node_modules/@lit/reactive-element/node/reactive-element.js"
|
|
146848
|
+
}
|
|
146849
|
+
},
|
|
146838
146850
|
{
|
|
146839
146851
|
"kind": "js",
|
|
146840
146852
|
"name": "notEqual",
|
|
146841
146853
|
"declaration": {
|
|
146842
|
-
"name": "
|
|
146854
|
+
"name": "m",
|
|
146843
146855
|
"module": "../../node_modules/@lit/reactive-element/node/reactive-element.js"
|
|
146844
146856
|
}
|
|
146845
146857
|
}
|