@vaadin/field-base 25.4.0-alpha2 → 25.4.0-alpha4
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/custom-elements.json +40 -44
- package/package.json +7 -7
- package/src/label-mixin.d.ts +1 -1
- package/src/styles/field-base-styles.js +13 -2
package/custom-elements.json
CHANGED
|
@@ -509,10 +509,6 @@
|
|
|
509
509
|
"type": {
|
|
510
510
|
"text": "boolean"
|
|
511
511
|
}
|
|
512
|
-
},
|
|
513
|
-
"inheritedFrom": {
|
|
514
|
-
"name": "ValidateMixin",
|
|
515
|
-
"module": "src/validate-mixin.js"
|
|
516
512
|
}
|
|
517
513
|
},
|
|
518
514
|
{
|
|
@@ -794,8 +790,8 @@
|
|
|
794
790
|
}
|
|
795
791
|
},
|
|
796
792
|
"inheritedFrom": {
|
|
797
|
-
"name": "
|
|
798
|
-
"module": "src/
|
|
793
|
+
"name": "InputConstraintsMixin",
|
|
794
|
+
"module": "src/input-constraints-mixin.js"
|
|
799
795
|
}
|
|
800
796
|
},
|
|
801
797
|
{
|
|
@@ -831,8 +827,8 @@
|
|
|
831
827
|
"description": "If true, the user cannot interact with this element.",
|
|
832
828
|
"attribute": "disabled",
|
|
833
829
|
"inheritedFrom": {
|
|
834
|
-
"name": "
|
|
835
|
-
"package": "@vaadin/a11y-base/src/
|
|
830
|
+
"name": "DisabledMixin",
|
|
831
|
+
"package": "@vaadin/a11y-base/src/disabled-mixin.js"
|
|
836
832
|
}
|
|
837
833
|
},
|
|
838
834
|
{
|
|
@@ -1073,8 +1069,8 @@
|
|
|
1073
1069
|
"description": "If true, the user cannot interact with this element.",
|
|
1074
1070
|
"fieldName": "disabled",
|
|
1075
1071
|
"inheritedFrom": {
|
|
1076
|
-
"name": "
|
|
1077
|
-
"package": "@vaadin/a11y-base/src/
|
|
1072
|
+
"name": "DisabledMixin",
|
|
1073
|
+
"package": "@vaadin/a11y-base/src/disabled-mixin.js"
|
|
1078
1074
|
}
|
|
1079
1075
|
},
|
|
1080
1076
|
{
|
|
@@ -1393,8 +1389,8 @@
|
|
|
1393
1389
|
}
|
|
1394
1390
|
},
|
|
1395
1391
|
"inheritedFrom": {
|
|
1396
|
-
"name": "
|
|
1397
|
-
"module": "src/
|
|
1392
|
+
"name": "InputConstraintsMixin",
|
|
1393
|
+
"module": "src/input-constraints-mixin.js"
|
|
1398
1394
|
}
|
|
1399
1395
|
},
|
|
1400
1396
|
{
|
|
@@ -1402,8 +1398,8 @@
|
|
|
1402
1398
|
"name": "clear",
|
|
1403
1399
|
"description": "Clear the value of the field.",
|
|
1404
1400
|
"inheritedFrom": {
|
|
1405
|
-
"name": "
|
|
1406
|
-
"module": "src/
|
|
1401
|
+
"name": "InputMixin",
|
|
1402
|
+
"module": "src/input-mixin.js"
|
|
1407
1403
|
}
|
|
1408
1404
|
},
|
|
1409
1405
|
{
|
|
@@ -1430,8 +1426,8 @@
|
|
|
1430
1426
|
"description": "If true, the user cannot interact with this element.",
|
|
1431
1427
|
"attribute": "disabled",
|
|
1432
1428
|
"inheritedFrom": {
|
|
1433
|
-
"name": "
|
|
1434
|
-
"package": "@vaadin/a11y-base/src/
|
|
1429
|
+
"name": "DisabledMixin",
|
|
1430
|
+
"package": "@vaadin/a11y-base/src/disabled-mixin.js"
|
|
1435
1431
|
}
|
|
1436
1432
|
},
|
|
1437
1433
|
{
|
|
@@ -1472,8 +1468,8 @@
|
|
|
1472
1468
|
"description": "Set to true when the field is invalid.",
|
|
1473
1469
|
"attribute": "invalid",
|
|
1474
1470
|
"inheritedFrom": {
|
|
1475
|
-
"name": "
|
|
1476
|
-
"module": "src/
|
|
1471
|
+
"name": "ValidateMixin",
|
|
1472
|
+
"module": "src/validate-mixin.js"
|
|
1477
1473
|
}
|
|
1478
1474
|
},
|
|
1479
1475
|
{
|
|
@@ -1486,8 +1482,8 @@
|
|
|
1486
1482
|
"description": "The label text for the input node.\nWhen no light dom defined via [slot=label], this value will be used.",
|
|
1487
1483
|
"attribute": "label",
|
|
1488
1484
|
"inheritedFrom": {
|
|
1489
|
-
"name": "
|
|
1490
|
-
"module": "src/
|
|
1485
|
+
"name": "LabelMixin",
|
|
1486
|
+
"module": "src/label-mixin.js"
|
|
1491
1487
|
}
|
|
1492
1488
|
},
|
|
1493
1489
|
{
|
|
@@ -1500,8 +1496,8 @@
|
|
|
1500
1496
|
"description": "Set to true to enable manual validation mode. This mode disables automatic\nconstraint validation, allowing you to control the validation process yourself.\nYou can still trigger constraint validation manually with the `validate()` method\nor use `checkValidity()` to assess the component's validity without affecting\nthe invalid state. In manual validation mode, you can also manipulate\nthe `invalid` property directly through your application logic without conflicts\nwith the component's internal validation.",
|
|
1501
1497
|
"attribute": "manual-validation",
|
|
1502
1498
|
"inheritedFrom": {
|
|
1503
|
-
"name": "
|
|
1504
|
-
"module": "src/
|
|
1499
|
+
"name": "ValidateMixin",
|
|
1500
|
+
"module": "src/validate-mixin.js"
|
|
1505
1501
|
}
|
|
1506
1502
|
},
|
|
1507
1503
|
{
|
|
@@ -1556,8 +1552,8 @@
|
|
|
1556
1552
|
"description": "Specifies that the user must fill in a value.",
|
|
1557
1553
|
"attribute": "required",
|
|
1558
1554
|
"inheritedFrom": {
|
|
1559
|
-
"name": "
|
|
1560
|
-
"module": "src/
|
|
1555
|
+
"name": "ValidateMixin",
|
|
1556
|
+
"module": "src/validate-mixin.js"
|
|
1561
1557
|
}
|
|
1562
1558
|
},
|
|
1563
1559
|
{
|
|
@@ -1584,8 +1580,8 @@
|
|
|
1584
1580
|
}
|
|
1585
1581
|
},
|
|
1586
1582
|
"inheritedFrom": {
|
|
1587
|
-
"name": "
|
|
1588
|
-
"module": "src/
|
|
1583
|
+
"name": "ValidateMixin",
|
|
1584
|
+
"module": "src/validate-mixin.js"
|
|
1589
1585
|
}
|
|
1590
1586
|
},
|
|
1591
1587
|
{
|
|
@@ -1598,8 +1594,8 @@
|
|
|
1598
1594
|
"description": "The value of the field.",
|
|
1599
1595
|
"attribute": "value",
|
|
1600
1596
|
"inheritedFrom": {
|
|
1601
|
-
"name": "
|
|
1602
|
-
"module": "src/
|
|
1597
|
+
"name": "InputMixin",
|
|
1598
|
+
"module": "src/input-mixin.js"
|
|
1603
1599
|
}
|
|
1604
1600
|
}
|
|
1605
1601
|
],
|
|
@@ -1720,8 +1716,8 @@
|
|
|
1720
1716
|
"description": "If true, the user cannot interact with this element.",
|
|
1721
1717
|
"fieldName": "disabled",
|
|
1722
1718
|
"inheritedFrom": {
|
|
1723
|
-
"name": "
|
|
1724
|
-
"package": "@vaadin/a11y-base/src/
|
|
1719
|
+
"name": "DisabledMixin",
|
|
1720
|
+
"package": "@vaadin/a11y-base/src/disabled-mixin.js"
|
|
1725
1721
|
}
|
|
1726
1722
|
},
|
|
1727
1723
|
{
|
|
@@ -1756,8 +1752,8 @@
|
|
|
1756
1752
|
"description": "Set to true when the field is invalid.",
|
|
1757
1753
|
"fieldName": "invalid",
|
|
1758
1754
|
"inheritedFrom": {
|
|
1759
|
-
"name": "
|
|
1760
|
-
"module": "src/
|
|
1755
|
+
"name": "ValidateMixin",
|
|
1756
|
+
"module": "src/validate-mixin.js"
|
|
1761
1757
|
}
|
|
1762
1758
|
},
|
|
1763
1759
|
{
|
|
@@ -1768,8 +1764,8 @@
|
|
|
1768
1764
|
"description": "The label text for the input node.\nWhen no light dom defined via [slot=label], this value will be used.",
|
|
1769
1765
|
"fieldName": "label",
|
|
1770
1766
|
"inheritedFrom": {
|
|
1771
|
-
"name": "
|
|
1772
|
-
"module": "src/
|
|
1767
|
+
"name": "LabelMixin",
|
|
1768
|
+
"module": "src/label-mixin.js"
|
|
1773
1769
|
}
|
|
1774
1770
|
},
|
|
1775
1771
|
{
|
|
@@ -1780,8 +1776,8 @@
|
|
|
1780
1776
|
"description": "Set to true to enable manual validation mode. This mode disables automatic\nconstraint validation, allowing you to control the validation process yourself.\nYou can still trigger constraint validation manually with the `validate()` method\nor use `checkValidity()` to assess the component's validity without affecting\nthe invalid state. In manual validation mode, you can also manipulate\nthe `invalid` property directly through your application logic without conflicts\nwith the component's internal validation.",
|
|
1781
1777
|
"fieldName": "manualValidation",
|
|
1782
1778
|
"inheritedFrom": {
|
|
1783
|
-
"name": "
|
|
1784
|
-
"module": "src/
|
|
1779
|
+
"name": "ValidateMixin",
|
|
1780
|
+
"module": "src/validate-mixin.js"
|
|
1785
1781
|
}
|
|
1786
1782
|
},
|
|
1787
1783
|
{
|
|
@@ -1828,8 +1824,8 @@
|
|
|
1828
1824
|
"description": "Specifies that the user must fill in a value.",
|
|
1829
1825
|
"fieldName": "required",
|
|
1830
1826
|
"inheritedFrom": {
|
|
1831
|
-
"name": "
|
|
1832
|
-
"module": "src/
|
|
1827
|
+
"name": "ValidateMixin",
|
|
1828
|
+
"module": "src/validate-mixin.js"
|
|
1833
1829
|
}
|
|
1834
1830
|
},
|
|
1835
1831
|
{
|
|
@@ -1852,8 +1848,8 @@
|
|
|
1852
1848
|
"description": "The value of the field.",
|
|
1853
1849
|
"fieldName": "value",
|
|
1854
1850
|
"inheritedFrom": {
|
|
1855
|
-
"name": "
|
|
1856
|
-
"module": "src/
|
|
1851
|
+
"name": "InputMixin",
|
|
1852
|
+
"module": "src/input-mixin.js"
|
|
1857
1853
|
}
|
|
1858
1854
|
}
|
|
1859
1855
|
],
|
|
@@ -1885,8 +1881,8 @@
|
|
|
1885
1881
|
"text": "CustomEvent"
|
|
1886
1882
|
},
|
|
1887
1883
|
"inheritedFrom": {
|
|
1888
|
-
"name": "
|
|
1889
|
-
"module": "src/
|
|
1884
|
+
"name": "ValidateMixin",
|
|
1885
|
+
"module": "src/validate-mixin.js"
|
|
1890
1886
|
}
|
|
1891
1887
|
}
|
|
1892
1888
|
]
|
|
@@ -2029,8 +2025,8 @@
|
|
|
2029
2025
|
}
|
|
2030
2026
|
},
|
|
2031
2027
|
"inheritedFrom": {
|
|
2032
|
-
"name": "
|
|
2033
|
-
"module": "src/
|
|
2028
|
+
"name": "InputConstraintsMixin",
|
|
2029
|
+
"module": "src/input-constraints-mixin.js"
|
|
2034
2030
|
}
|
|
2035
2031
|
},
|
|
2036
2032
|
{
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vaadin/field-base",
|
|
3
|
-
"version": "25.4.0-
|
|
3
|
+
"version": "25.4.0-alpha4",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
@@ -32,17 +32,17 @@
|
|
|
32
32
|
],
|
|
33
33
|
"dependencies": {
|
|
34
34
|
"@open-wc/dedupe-mixin": "^1.3.0",
|
|
35
|
-
"@vaadin/a11y-base": "25.4.0-
|
|
36
|
-
"@vaadin/component-base": "25.4.0-
|
|
35
|
+
"@vaadin/a11y-base": "25.4.0-alpha4",
|
|
36
|
+
"@vaadin/component-base": "25.4.0-alpha4",
|
|
37
37
|
"lit": "^3.0.0"
|
|
38
38
|
},
|
|
39
39
|
"devDependencies": {
|
|
40
|
-
"@vaadin/chai-plugins": "25.4.0-
|
|
41
|
-
"@vaadin/input-container": "25.4.0-
|
|
42
|
-
"@vaadin/test-runner-commands": "25.4.0-
|
|
40
|
+
"@vaadin/chai-plugins": "25.4.0-alpha4",
|
|
41
|
+
"@vaadin/input-container": "25.4.0-alpha4",
|
|
42
|
+
"@vaadin/test-runner-commands": "25.4.0-alpha4",
|
|
43
43
|
"@vaadin/testing-helpers": "^2.0.0",
|
|
44
44
|
"sinon": "^22.0.0"
|
|
45
45
|
},
|
|
46
46
|
"customElements": "custom-elements.json",
|
|
47
|
-
"gitHead": "
|
|
47
|
+
"gitHead": "7809e4c099538333a6dbd11d8da18a0c6ec30dad"
|
|
48
48
|
}
|
package/src/label-mixin.d.ts
CHANGED
|
@@ -5,6 +5,7 @@
|
|
|
5
5
|
*/
|
|
6
6
|
import '@vaadin/component-base/src/styles/style-props.js';
|
|
7
7
|
import { css } from 'lit';
|
|
8
|
+
import { registerCSSProperty } from '@vaadin/component-base/src/css-utils.js';
|
|
8
9
|
|
|
9
10
|
export const field = css`
|
|
10
11
|
:host {
|
|
@@ -242,8 +243,18 @@ export const fieldLabelAside = css`
|
|
|
242
243
|
}
|
|
243
244
|
`;
|
|
244
245
|
|
|
246
|
+
// Register as a length to not break max() below when set to auto
|
|
247
|
+
registerCSSProperty({
|
|
248
|
+
name: '--_field-input-custom-height',
|
|
249
|
+
syntax: '<length>',
|
|
250
|
+
inherits: false,
|
|
251
|
+
initialValue: '0px',
|
|
252
|
+
});
|
|
253
|
+
|
|
254
|
+
// Register on ::before so that em and lh resolve with the input font and line-height
|
|
245
255
|
export const fieldInputHeight = css`
|
|
246
|
-
:host {
|
|
247
|
-
--_field-input-height:
|
|
256
|
+
:host::before {
|
|
257
|
+
--_field-input-custom-height: var(--vaadin-input-field-height, 0px);
|
|
258
|
+
--_field-input-height: max(var(--_field-input-custom-height), var(--_field-input-default-height));
|
|
248
259
|
}
|
|
249
260
|
`;
|