@spectrum-web-components/textfield 0.33.3-overlay.65 → 0.34.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/README.md +49 -3
- package/custom-elements.json +85 -37
- package/package.json +8 -8
- package/src/Textfield.d.ts +4 -0
- package/src/Textfield.dev.js +13 -3
- package/src/Textfield.dev.js.map +2 -2
- package/src/Textfield.js +5 -4
- package/src/Textfield.js.map +3 -3
- package/src/spectrum-config.js +9 -0
- package/src/spectrum-textfield.css.dev.js +4 -4
- package/src/spectrum-textfield.css.dev.js.map +1 -1
- package/src/spectrum-textfield.css.js +4 -4
- package/src/spectrum-textfield.css.js.map +1 -1
- package/src/textfield.css.dev.js +5 -5
- package/src/textfield.css.dev.js.map +1 -1
- package/src/textfield.css.js +5 -5
- package/src/textfield.css.js.map +1 -1
- package/stories/textarea-sizes.stories.js +35 -0
- package/stories/textarea-sizes.stories.js.map +7 -0
- package/stories/textarea.stories.js +24 -0
- package/stories/textarea.stories.js.map +2 -2
- package/stories/textfield-sizes.stories.js +30 -0
- package/stories/textfield-sizes.stories.js.map +7 -0
- package/test/textarea-sizes.test-vrt.js +5 -0
- package/test/textarea-sizes.test-vrt.js.map +7 -0
- package/test/textfield-sizes.test-vrt.js +5 -0
- package/test/textfield-sizes.test-vrt.js.map +7 -0
- package/test/textfield.test.js +96 -0
- package/test/textfield.test.js.map +2 -2
package/README.md
CHANGED
|
@@ -24,13 +24,59 @@ When looking to leverage the `Textfield` base class as a type and/or for extensi
|
|
|
24
24
|
import { Textfield } from '@spectrum-web-components/textfield';
|
|
25
25
|
```
|
|
26
26
|
|
|
27
|
-
##
|
|
27
|
+
## Sizes
|
|
28
|
+
|
|
29
|
+
<sp-tabs selected="m" auto label="Size Attribute Options">
|
|
30
|
+
<sp-tab value="s">Small</sp-tab>
|
|
31
|
+
<sp-tab-panel value="s">
|
|
32
|
+
|
|
33
|
+
```html
|
|
34
|
+
<sp-field-label size="s" for="name-0-s">Name</sp-field-label>
|
|
35
|
+
<sp-textfield
|
|
36
|
+
size="s"
|
|
37
|
+
id="name-0-s"
|
|
38
|
+
placeholder="Enter your name"
|
|
39
|
+
></sp-textfield>
|
|
40
|
+
```
|
|
41
|
+
|
|
42
|
+
</sp-tab-panel>
|
|
43
|
+
<sp-tab value="m">Medium</sp-tab>
|
|
44
|
+
<sp-tab-panel value="m">
|
|
45
|
+
|
|
46
|
+
```html
|
|
47
|
+
<sp-field-label for="name-0-m">Name</sp-field-label>
|
|
48
|
+
<sp-textfield id="name-0-m" placeholder="Enter your name"></sp-textfield>
|
|
49
|
+
```
|
|
50
|
+
|
|
51
|
+
</sp-tab-panel>
|
|
52
|
+
<sp-tab value="l">Large</sp-tab>
|
|
53
|
+
<sp-tab-panel value="l">
|
|
28
54
|
|
|
29
55
|
```html
|
|
30
|
-
<sp-field-label for="name-0">Name</sp-field-label>
|
|
31
|
-
<sp-textfield
|
|
56
|
+
<sp-field-label size="l" for="name-0-l">Name</sp-field-label>
|
|
57
|
+
<sp-textfield
|
|
58
|
+
size="l"
|
|
59
|
+
id="name-0-l"
|
|
60
|
+
placeholder="Enter your name"
|
|
61
|
+
></sp-textfield>
|
|
62
|
+
```
|
|
63
|
+
|
|
64
|
+
</sp-tab-panel>
|
|
65
|
+
<sp-tab value="xl">Extra Large</sp-tab>
|
|
66
|
+
<sp-tab-panel value="xl">
|
|
67
|
+
|
|
68
|
+
```html
|
|
69
|
+
<sp-field-label size="xl" for="name-0-xl">Name</sp-field-label>
|
|
70
|
+
<sp-textfield
|
|
71
|
+
size="xl"
|
|
72
|
+
id="name-0-xl"
|
|
73
|
+
placeholder="Enter your name"
|
|
74
|
+
></sp-textfield>
|
|
32
75
|
```
|
|
33
76
|
|
|
77
|
+
</sp-tab-panel>
|
|
78
|
+
</sp-tabs>
|
|
79
|
+
|
|
34
80
|
## Variants
|
|
35
81
|
|
|
36
82
|
### Valid
|
package/custom-elements.json
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
"modules": [
|
|
5
5
|
{
|
|
6
6
|
"kind": "javascript-module",
|
|
7
|
-
"path": "sp-textfield.
|
|
7
|
+
"path": "sp-textfield.js",
|
|
8
8
|
"declarations": [],
|
|
9
9
|
"exports": [
|
|
10
10
|
{
|
|
@@ -19,7 +19,7 @@
|
|
|
19
19
|
},
|
|
20
20
|
{
|
|
21
21
|
"kind": "javascript-module",
|
|
22
|
-
"path": "src/Textfield.
|
|
22
|
+
"path": "src/Textfield.js",
|
|
23
23
|
"declarations": [
|
|
24
24
|
{
|
|
25
25
|
"kind": "class",
|
|
@@ -165,6 +165,16 @@
|
|
|
165
165
|
"attribute": "readonly",
|
|
166
166
|
"reflects": true
|
|
167
167
|
},
|
|
168
|
+
{
|
|
169
|
+
"kind": "field",
|
|
170
|
+
"name": "rows",
|
|
171
|
+
"type": {
|
|
172
|
+
"text": "number"
|
|
173
|
+
},
|
|
174
|
+
"privacy": "public",
|
|
175
|
+
"default": "-1",
|
|
176
|
+
"attribute": "rows"
|
|
177
|
+
},
|
|
168
178
|
{
|
|
169
179
|
"kind": "field",
|
|
170
180
|
"name": "valid",
|
|
@@ -489,6 +499,14 @@
|
|
|
489
499
|
"default": "false",
|
|
490
500
|
"fieldName": "readonly"
|
|
491
501
|
},
|
|
502
|
+
{
|
|
503
|
+
"name": "rows",
|
|
504
|
+
"type": {
|
|
505
|
+
"text": "number"
|
|
506
|
+
},
|
|
507
|
+
"default": "-1",
|
|
508
|
+
"fieldName": "rows"
|
|
509
|
+
},
|
|
492
510
|
{
|
|
493
511
|
"name": "valid",
|
|
494
512
|
"type": {
|
|
@@ -532,6 +550,10 @@
|
|
|
532
550
|
{
|
|
533
551
|
"name": "ManageHelpText",
|
|
534
552
|
"package": "@spectrum-web-components/help-text/src/manage-help-text.js"
|
|
553
|
+
},
|
|
554
|
+
{
|
|
555
|
+
"name": "SizedMixin",
|
|
556
|
+
"package": "@spectrum-web-components/base"
|
|
535
557
|
}
|
|
536
558
|
],
|
|
537
559
|
"superclass": {
|
|
@@ -564,7 +586,7 @@
|
|
|
564
586
|
"attribute": "value",
|
|
565
587
|
"inheritedFrom": {
|
|
566
588
|
"name": "TextfieldBase",
|
|
567
|
-
"module": "src/Textfield.
|
|
589
|
+
"module": "src/Textfield.js"
|
|
568
590
|
}
|
|
569
591
|
},
|
|
570
592
|
{
|
|
@@ -577,7 +599,7 @@
|
|
|
577
599
|
"default": "''",
|
|
578
600
|
"inheritedFrom": {
|
|
579
601
|
"name": "TextfieldBase",
|
|
580
|
-
"module": "src/Textfield.
|
|
602
|
+
"module": "src/Textfield.js"
|
|
581
603
|
}
|
|
582
604
|
},
|
|
583
605
|
{
|
|
@@ -590,7 +612,7 @@
|
|
|
590
612
|
"attribute": "allowed-keys",
|
|
591
613
|
"inheritedFrom": {
|
|
592
614
|
"name": "TextfieldBase",
|
|
593
|
-
"module": "src/Textfield.
|
|
615
|
+
"module": "src/Textfield.js"
|
|
594
616
|
}
|
|
595
617
|
},
|
|
596
618
|
{
|
|
@@ -605,7 +627,7 @@
|
|
|
605
627
|
"reflects": true,
|
|
606
628
|
"inheritedFrom": {
|
|
607
629
|
"name": "TextfieldBase",
|
|
608
|
-
"module": "src/Textfield.
|
|
630
|
+
"module": "src/Textfield.js"
|
|
609
631
|
}
|
|
610
632
|
},
|
|
611
633
|
{
|
|
@@ -617,7 +639,7 @@
|
|
|
617
639
|
"privacy": "protected",
|
|
618
640
|
"inheritedFrom": {
|
|
619
641
|
"name": "TextfieldBase",
|
|
620
|
-
"module": "src/Textfield.
|
|
642
|
+
"module": "src/Textfield.js"
|
|
621
643
|
}
|
|
622
644
|
},
|
|
623
645
|
{
|
|
@@ -632,7 +654,7 @@
|
|
|
632
654
|
"reflects": true,
|
|
633
655
|
"inheritedFrom": {
|
|
634
656
|
"name": "TextfieldBase",
|
|
635
|
-
"module": "src/Textfield.
|
|
657
|
+
"module": "src/Textfield.js"
|
|
636
658
|
}
|
|
637
659
|
},
|
|
638
660
|
{
|
|
@@ -646,7 +668,7 @@
|
|
|
646
668
|
"attribute": "label",
|
|
647
669
|
"inheritedFrom": {
|
|
648
670
|
"name": "TextfieldBase",
|
|
649
|
-
"module": "src/Textfield.
|
|
671
|
+
"module": "src/Textfield.js"
|
|
650
672
|
}
|
|
651
673
|
},
|
|
652
674
|
{
|
|
@@ -660,7 +682,7 @@
|
|
|
660
682
|
"attribute": "placeholder",
|
|
661
683
|
"inheritedFrom": {
|
|
662
684
|
"name": "TextfieldBase",
|
|
663
|
-
"module": "src/Textfield.
|
|
685
|
+
"module": "src/Textfield.js"
|
|
664
686
|
}
|
|
665
687
|
},
|
|
666
688
|
{
|
|
@@ -675,7 +697,7 @@
|
|
|
675
697
|
"reflects": true,
|
|
676
698
|
"inheritedFrom": {
|
|
677
699
|
"name": "TextfieldBase",
|
|
678
|
-
"module": "src/Textfield.
|
|
700
|
+
"module": "src/Textfield.js"
|
|
679
701
|
}
|
|
680
702
|
},
|
|
681
703
|
{
|
|
@@ -686,7 +708,7 @@
|
|
|
686
708
|
},
|
|
687
709
|
"inheritedFrom": {
|
|
688
710
|
"name": "TextfieldBase",
|
|
689
|
-
"module": "src/Textfield.
|
|
711
|
+
"module": "src/Textfield.js"
|
|
690
712
|
}
|
|
691
713
|
},
|
|
692
714
|
{
|
|
@@ -699,7 +721,7 @@
|
|
|
699
721
|
"attribute": "pattern",
|
|
700
722
|
"inheritedFrom": {
|
|
701
723
|
"name": "TextfieldBase",
|
|
702
|
-
"module": "src/Textfield.
|
|
724
|
+
"module": "src/Textfield.js"
|
|
703
725
|
}
|
|
704
726
|
},
|
|
705
727
|
{
|
|
@@ -714,7 +736,7 @@
|
|
|
714
736
|
"reflects": true,
|
|
715
737
|
"inheritedFrom": {
|
|
716
738
|
"name": "TextfieldBase",
|
|
717
|
-
"module": "src/Textfield.
|
|
739
|
+
"module": "src/Textfield.js"
|
|
718
740
|
}
|
|
719
741
|
},
|
|
720
742
|
{
|
|
@@ -728,7 +750,7 @@
|
|
|
728
750
|
"attribute": "maxlength",
|
|
729
751
|
"inheritedFrom": {
|
|
730
752
|
"name": "TextfieldBase",
|
|
731
|
-
"module": "src/Textfield.
|
|
753
|
+
"module": "src/Textfield.js"
|
|
732
754
|
}
|
|
733
755
|
},
|
|
734
756
|
{
|
|
@@ -742,7 +764,7 @@
|
|
|
742
764
|
"attribute": "minlength",
|
|
743
765
|
"inheritedFrom": {
|
|
744
766
|
"name": "TextfieldBase",
|
|
745
|
-
"module": "src/Textfield.
|
|
767
|
+
"module": "src/Textfield.js"
|
|
746
768
|
}
|
|
747
769
|
},
|
|
748
770
|
{
|
|
@@ -757,7 +779,7 @@
|
|
|
757
779
|
"reflects": true,
|
|
758
780
|
"inheritedFrom": {
|
|
759
781
|
"name": "TextfieldBase",
|
|
760
|
-
"module": "src/Textfield.
|
|
782
|
+
"module": "src/Textfield.js"
|
|
761
783
|
}
|
|
762
784
|
},
|
|
763
785
|
{
|
|
@@ -772,7 +794,21 @@
|
|
|
772
794
|
"reflects": true,
|
|
773
795
|
"inheritedFrom": {
|
|
774
796
|
"name": "TextfieldBase",
|
|
775
|
-
"module": "src/Textfield.
|
|
797
|
+
"module": "src/Textfield.js"
|
|
798
|
+
}
|
|
799
|
+
},
|
|
800
|
+
{
|
|
801
|
+
"kind": "field",
|
|
802
|
+
"name": "rows",
|
|
803
|
+
"type": {
|
|
804
|
+
"text": "number"
|
|
805
|
+
},
|
|
806
|
+
"privacy": "public",
|
|
807
|
+
"default": "-1",
|
|
808
|
+
"attribute": "rows",
|
|
809
|
+
"inheritedFrom": {
|
|
810
|
+
"name": "TextfieldBase",
|
|
811
|
+
"module": "src/Textfield.js"
|
|
776
812
|
}
|
|
777
813
|
},
|
|
778
814
|
{
|
|
@@ -787,7 +823,7 @@
|
|
|
787
823
|
"reflects": true,
|
|
788
824
|
"inheritedFrom": {
|
|
789
825
|
"name": "TextfieldBase",
|
|
790
|
-
"module": "src/Textfield.
|
|
826
|
+
"module": "src/Textfield.js"
|
|
791
827
|
}
|
|
792
828
|
},
|
|
793
829
|
{
|
|
@@ -802,7 +838,7 @@
|
|
|
802
838
|
"reflects": true,
|
|
803
839
|
"inheritedFrom": {
|
|
804
840
|
"name": "TextfieldBase",
|
|
805
|
-
"module": "src/Textfield.
|
|
841
|
+
"module": "src/Textfield.js"
|
|
806
842
|
}
|
|
807
843
|
},
|
|
808
844
|
{
|
|
@@ -817,7 +853,7 @@
|
|
|
817
853
|
"reflects": true,
|
|
818
854
|
"inheritedFrom": {
|
|
819
855
|
"name": "TextfieldBase",
|
|
820
|
-
"module": "src/Textfield.
|
|
856
|
+
"module": "src/Textfield.js"
|
|
821
857
|
}
|
|
822
858
|
},
|
|
823
859
|
{
|
|
@@ -831,7 +867,7 @@
|
|
|
831
867
|
"reflects": true,
|
|
832
868
|
"inheritedFrom": {
|
|
833
869
|
"name": "TextfieldBase",
|
|
834
|
-
"module": "src/Textfield.
|
|
870
|
+
"module": "src/Textfield.js"
|
|
835
871
|
}
|
|
836
872
|
},
|
|
837
873
|
{
|
|
@@ -844,7 +880,7 @@
|
|
|
844
880
|
"readonly": true,
|
|
845
881
|
"inheritedFrom": {
|
|
846
882
|
"name": "TextfieldBase",
|
|
847
|
-
"module": "src/Textfield.
|
|
883
|
+
"module": "src/Textfield.js"
|
|
848
884
|
}
|
|
849
885
|
},
|
|
850
886
|
{
|
|
@@ -884,7 +920,7 @@
|
|
|
884
920
|
"description": "Sets the start and end positions of the current selection.",
|
|
885
921
|
"inheritedFrom": {
|
|
886
922
|
"name": "TextfieldBase",
|
|
887
|
-
"module": "src/Textfield.
|
|
923
|
+
"module": "src/Textfield.js"
|
|
888
924
|
}
|
|
889
925
|
},
|
|
890
926
|
{
|
|
@@ -899,7 +935,7 @@
|
|
|
899
935
|
"description": "Selects all the text.",
|
|
900
936
|
"inheritedFrom": {
|
|
901
937
|
"name": "TextfieldBase",
|
|
902
|
-
"module": "src/Textfield.
|
|
938
|
+
"module": "src/Textfield.js"
|
|
903
939
|
}
|
|
904
940
|
},
|
|
905
941
|
{
|
|
@@ -913,7 +949,7 @@
|
|
|
913
949
|
},
|
|
914
950
|
"inheritedFrom": {
|
|
915
951
|
"name": "TextfieldBase",
|
|
916
|
-
"module": "src/Textfield.
|
|
952
|
+
"module": "src/Textfield.js"
|
|
917
953
|
}
|
|
918
954
|
},
|
|
919
955
|
{
|
|
@@ -927,7 +963,7 @@
|
|
|
927
963
|
},
|
|
928
964
|
"inheritedFrom": {
|
|
929
965
|
"name": "TextfieldBase",
|
|
930
|
-
"module": "src/Textfield.
|
|
966
|
+
"module": "src/Textfield.js"
|
|
931
967
|
}
|
|
932
968
|
},
|
|
933
969
|
{
|
|
@@ -941,7 +977,7 @@
|
|
|
941
977
|
},
|
|
942
978
|
"inheritedFrom": {
|
|
943
979
|
"name": "TextfieldBase",
|
|
944
|
-
"module": "src/Textfield.
|
|
980
|
+
"module": "src/Textfield.js"
|
|
945
981
|
}
|
|
946
982
|
},
|
|
947
983
|
{
|
|
@@ -955,7 +991,7 @@
|
|
|
955
991
|
},
|
|
956
992
|
"inheritedFrom": {
|
|
957
993
|
"name": "TextfieldBase",
|
|
958
|
-
"module": "src/Textfield.
|
|
994
|
+
"module": "src/Textfield.js"
|
|
959
995
|
}
|
|
960
996
|
},
|
|
961
997
|
{
|
|
@@ -969,7 +1005,7 @@
|
|
|
969
1005
|
},
|
|
970
1006
|
"inheritedFrom": {
|
|
971
1007
|
"name": "TextfieldBase",
|
|
972
|
-
"module": "src/Textfield.
|
|
1008
|
+
"module": "src/Textfield.js"
|
|
973
1009
|
}
|
|
974
1010
|
},
|
|
975
1011
|
{
|
|
@@ -982,7 +1018,7 @@
|
|
|
982
1018
|
"readonly": true,
|
|
983
1019
|
"inheritedFrom": {
|
|
984
1020
|
"name": "TextfieldBase",
|
|
985
|
-
"module": "src/Textfield.
|
|
1021
|
+
"module": "src/Textfield.js"
|
|
986
1022
|
}
|
|
987
1023
|
},
|
|
988
1024
|
{
|
|
@@ -995,7 +1031,7 @@
|
|
|
995
1031
|
"readonly": true,
|
|
996
1032
|
"inheritedFrom": {
|
|
997
1033
|
"name": "TextfieldBase",
|
|
998
|
-
"module": "src/Textfield.
|
|
1034
|
+
"module": "src/Textfield.js"
|
|
999
1035
|
}
|
|
1000
1036
|
},
|
|
1001
1037
|
{
|
|
@@ -1008,7 +1044,7 @@
|
|
|
1008
1044
|
"readonly": true,
|
|
1009
1045
|
"inheritedFrom": {
|
|
1010
1046
|
"name": "TextfieldBase",
|
|
1011
|
-
"module": "src/Textfield.
|
|
1047
|
+
"module": "src/Textfield.js"
|
|
1012
1048
|
}
|
|
1013
1049
|
},
|
|
1014
1050
|
{
|
|
@@ -1022,7 +1058,7 @@
|
|
|
1022
1058
|
},
|
|
1023
1059
|
"inheritedFrom": {
|
|
1024
1060
|
"name": "TextfieldBase",
|
|
1025
|
-
"module": "src/Textfield.
|
|
1061
|
+
"module": "src/Textfield.js"
|
|
1026
1062
|
}
|
|
1027
1063
|
},
|
|
1028
1064
|
{
|
|
@@ -1036,7 +1072,7 @@
|
|
|
1036
1072
|
},
|
|
1037
1073
|
"inheritedFrom": {
|
|
1038
1074
|
"name": "TextfieldBase",
|
|
1039
|
-
"module": "src/Textfield.
|
|
1075
|
+
"module": "src/Textfield.js"
|
|
1040
1076
|
}
|
|
1041
1077
|
}
|
|
1042
1078
|
],
|
|
@@ -1195,6 +1231,18 @@
|
|
|
1195
1231
|
"module": "src/Textfield.ts"
|
|
1196
1232
|
}
|
|
1197
1233
|
},
|
|
1234
|
+
{
|
|
1235
|
+
"name": "rows",
|
|
1236
|
+
"type": {
|
|
1237
|
+
"text": "number"
|
|
1238
|
+
},
|
|
1239
|
+
"default": "-1",
|
|
1240
|
+
"fieldName": "rows",
|
|
1241
|
+
"inheritedFrom": {
|
|
1242
|
+
"name": "TextfieldBase",
|
|
1243
|
+
"module": "src/Textfield.ts"
|
|
1244
|
+
}
|
|
1245
|
+
},
|
|
1198
1246
|
{
|
|
1199
1247
|
"name": "valid",
|
|
1200
1248
|
"type": {
|
|
@@ -1278,7 +1326,7 @@
|
|
|
1278
1326
|
"name": "TextfieldBase",
|
|
1279
1327
|
"declaration": {
|
|
1280
1328
|
"name": "TextfieldBase",
|
|
1281
|
-
"module": "src/Textfield.
|
|
1329
|
+
"module": "src/Textfield.js"
|
|
1282
1330
|
}
|
|
1283
1331
|
},
|
|
1284
1332
|
{
|
|
@@ -1286,7 +1334,7 @@
|
|
|
1286
1334
|
"name": "Textfield",
|
|
1287
1335
|
"declaration": {
|
|
1288
1336
|
"name": "Textfield",
|
|
1289
|
-
"module": "src/Textfield.
|
|
1337
|
+
"module": "src/Textfield.js"
|
|
1290
1338
|
}
|
|
1291
1339
|
}
|
|
1292
1340
|
]
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@spectrum-web-components/textfield",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.34.0",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
@@ -57,12 +57,12 @@
|
|
|
57
57
|
"lit-html"
|
|
58
58
|
],
|
|
59
59
|
"dependencies": {
|
|
60
|
-
"@spectrum-web-components/base": "^0.
|
|
61
|
-
"@spectrum-web-components/help-text": "^0.
|
|
62
|
-
"@spectrum-web-components/icon": "^0.
|
|
63
|
-
"@spectrum-web-components/icons-ui": "^0.
|
|
64
|
-
"@spectrum-web-components/icons-workflow": "^0.
|
|
65
|
-
"@spectrum-web-components/shared": "^0.
|
|
60
|
+
"@spectrum-web-components/base": "^0.34.0",
|
|
61
|
+
"@spectrum-web-components/help-text": "^0.34.0",
|
|
62
|
+
"@spectrum-web-components/icon": "^0.34.0",
|
|
63
|
+
"@spectrum-web-components/icons-ui": "^0.34.0",
|
|
64
|
+
"@spectrum-web-components/icons-workflow": "^0.34.0",
|
|
65
|
+
"@spectrum-web-components/shared": "^0.34.0"
|
|
66
66
|
},
|
|
67
67
|
"devDependencies": {
|
|
68
68
|
"@spectrum-css/textfield": "^6.0.2"
|
|
@@ -73,5 +73,5 @@
|
|
|
73
73
|
"./sp-*.js",
|
|
74
74
|
"./**/*.dev.js"
|
|
75
75
|
],
|
|
76
|
-
"gitHead": "
|
|
76
|
+
"gitHead": "f9b3294d67cdd52b2c36897cdc1c20ceaeb019cf"
|
|
77
77
|
}
|
package/src/Textfield.d.ts
CHANGED
|
@@ -5,6 +5,9 @@ import '@spectrum-web-components/icons-workflow/icons/sp-icon-alert.js';
|
|
|
5
5
|
declare const textfieldTypes: readonly ["text", "url", "tel", "email", "password"];
|
|
6
6
|
export declare type TextfieldType = typeof textfieldTypes[number];
|
|
7
7
|
declare const TextfieldBase_base: typeof Focusable & {
|
|
8
|
+
new (...args: any[]): import("@spectrum-web-components/base").SizedElementInterface;
|
|
9
|
+
prototype: import("@spectrum-web-components/base").SizedElementInterface;
|
|
10
|
+
} & {
|
|
8
11
|
new (...args: any[]): import("@spectrum-web-components/help-text/src/manage-help-text.js").HelpTextElementInterface;
|
|
9
12
|
prototype: import("@spectrum-web-components/help-text/src/manage-help-text.js").HelpTextElementInterface;
|
|
10
13
|
};
|
|
@@ -29,6 +32,7 @@ export declare class TextfieldBase extends TextfieldBase_base {
|
|
|
29
32
|
minlength: number;
|
|
30
33
|
multiline: boolean;
|
|
31
34
|
readonly: boolean;
|
|
35
|
+
rows: number;
|
|
32
36
|
valid: boolean;
|
|
33
37
|
set value(value: string | number);
|
|
34
38
|
get value(): string | number;
|
package/src/Textfield.dev.js
CHANGED
|
@@ -12,7 +12,8 @@ var __decorateClass = (decorators, target, key, kind) => {
|
|
|
12
12
|
};
|
|
13
13
|
import {
|
|
14
14
|
html,
|
|
15
|
-
nothing
|
|
15
|
+
nothing,
|
|
16
|
+
SizedMixin
|
|
16
17
|
} from "@spectrum-web-components/base";
|
|
17
18
|
import {
|
|
18
19
|
ifDefined,
|
|
@@ -30,7 +31,11 @@ import "@spectrum-web-components/icons-workflow/icons/sp-icon-alert.js";
|
|
|
30
31
|
import textfieldStyles from "./textfield.css.js";
|
|
31
32
|
import checkmarkStyles from "@spectrum-web-components/icon/src/spectrum-icon-checkmark.css.js";
|
|
32
33
|
const textfieldTypes = ["text", "url", "tel", "email", "password"];
|
|
33
|
-
export class TextfieldBase extends ManageHelpText(
|
|
34
|
+
export class TextfieldBase extends ManageHelpText(
|
|
35
|
+
SizedMixin(Focusable, {
|
|
36
|
+
noDefaultSize: true
|
|
37
|
+
})
|
|
38
|
+
) {
|
|
34
39
|
constructor() {
|
|
35
40
|
super(...arguments);
|
|
36
41
|
this.allowedKeys = "";
|
|
@@ -44,6 +49,7 @@ export class TextfieldBase extends ManageHelpText(Focusable) {
|
|
|
44
49
|
this.minlength = -1;
|
|
45
50
|
this.multiline = false;
|
|
46
51
|
this.readonly = false;
|
|
52
|
+
this.rows = -1;
|
|
47
53
|
this.valid = false;
|
|
48
54
|
this._value = "";
|
|
49
55
|
this.quiet = false;
|
|
@@ -148,7 +154,7 @@ export class TextfieldBase extends ManageHelpText(Focusable) {
|
|
|
148
154
|
}
|
|
149
155
|
get renderMultiline() {
|
|
150
156
|
return html`
|
|
151
|
-
${this.grows && !this.quiet ? html`
|
|
157
|
+
${this.grows && !this.quiet && this.rows === -1 ? html`
|
|
152
158
|
<div id="sizer">${this.value}​</div>
|
|
153
159
|
` : nothing}
|
|
154
160
|
<!-- @ts-ignore -->
|
|
@@ -173,6 +179,7 @@ export class TextfieldBase extends ManageHelpText(Focusable) {
|
|
|
173
179
|
?disabled=${this.disabled}
|
|
174
180
|
?required=${this.required}
|
|
175
181
|
?readonly=${this.readonly}
|
|
182
|
+
rows=${ifDefined(this.rows > -1 ? this.rows : void 0)}
|
|
176
183
|
autocomplete=${ifDefined(this.autocomplete)}
|
|
177
184
|
></textarea>
|
|
178
185
|
`;
|
|
@@ -284,6 +291,9 @@ __decorateClass([
|
|
|
284
291
|
__decorateClass([
|
|
285
292
|
property({ type: Boolean, reflect: true })
|
|
286
293
|
], TextfieldBase.prototype, "readonly", 2);
|
|
294
|
+
__decorateClass([
|
|
295
|
+
property({ type: Number })
|
|
296
|
+
], TextfieldBase.prototype, "rows", 2);
|
|
287
297
|
__decorateClass([
|
|
288
298
|
property({ type: Boolean, reflect: true })
|
|
289
299
|
], TextfieldBase.prototype, "valid", 2);
|
package/src/Textfield.dev.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["Textfield.ts"],
|
|
4
|
-
"sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport {\n CSSResultArray,\n html,\n nothing,\n PropertyValues,\n TemplateResult,\n} from '@spectrum-web-components/base';\nimport {\n ifDefined,\n live,\n} from '@spectrum-web-components/base/src/directives.js';\nimport {\n property,\n query,\n state,\n} from '@spectrum-web-components/base/src/decorators.js';\n\nimport { ManageHelpText } from '@spectrum-web-components/help-text/src/manage-help-text.js';\nimport { Focusable } from '@spectrum-web-components/shared/src/focusable.js';\nimport '@spectrum-web-components/icons-ui/icons/sp-icon-checkmark100.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-alert.js';\n\nimport textfieldStyles from './textfield.css.js';\nimport checkmarkStyles from '@spectrum-web-components/icon/src/spectrum-icon-checkmark.css.js';\n\nconst textfieldTypes = ['text', 'url', 'tel', 'email', 'password'] as const;\nexport type TextfieldType = typeof textfieldTypes[number];\n\n/**\n * @fires input - The value of the element has changed.\n * @fires change - An alteration to the value of the element has been committed by the user.\n */\nexport class TextfieldBase extends ManageHelpText(Focusable) {\n public static override get styles(): CSSResultArray {\n return [textfieldStyles, checkmarkStyles];\n }\n\n @property({ attribute: 'allowed-keys' })\n allowedKeys = '';\n\n @property({ type: Boolean, reflect: true })\n public focused = false;\n\n @query('.input')\n protected inputElement!: HTMLInputElement | HTMLTextAreaElement;\n\n @property({ type: Boolean, reflect: true })\n public invalid = false;\n\n @property()\n public label = '';\n\n @property()\n public placeholder = '';\n\n @property({ attribute: 'type', reflect: true })\n private _type: TextfieldType = 'text';\n\n @state()\n get type(): TextfieldType {\n return textfieldTypes.find((t) => t === this._type) ?? 'text';\n }\n\n set type(val: TextfieldType) {\n const prev = this._type;\n this._type = val;\n this.requestUpdate('type', prev);\n }\n\n @property()\n public pattern?: string;\n\n @property({ type: Boolean, reflect: true })\n public grows = false;\n\n @property({ type: Number })\n public maxlength = -1;\n\n @property({ type: Number })\n public minlength = -1;\n\n @property({ type: Boolean, reflect: true })\n public multiline = false;\n\n @property({ type: Boolean, reflect: true })\n public readonly = false;\n\n @property({ type: Boolean, reflect: true })\n public valid = false;\n\n @property({ type: String })\n public set value(value: string | number) {\n if (value === this.value) {\n return;\n }\n const oldValue = this._value;\n this._value = value;\n this.requestUpdate('value', oldValue);\n }\n\n public get value(): string | number {\n return this._value;\n }\n\n protected _value: string | number = '';\n\n @property({ type: Boolean, reflect: true })\n public quiet = false;\n\n @property({ type: Boolean, reflect: true })\n public required = false;\n\n @property({ type: String, reflect: true })\n public autocomplete?:\n | HTMLInputElement['autocomplete']\n | HTMLTextAreaElement['autocomplete'];\n\n public override get focusElement(): HTMLInputElement | HTMLTextAreaElement {\n return this.inputElement;\n }\n\n /**\n * Sets the start and end positions of the current selection.\n *\n * @param selectionStart The 0-based index of the first selected character. An index greater than the length of the\n * element's value is treated as pointing to the end of the value.\n * @param selectionEnd The 0-based index of the character after the last selected character. An index greater than\n * the length of the element's value is treated as pointing to the end of the value.\n * @param [selectionDirection=\"none\"] A string indicating the direction in which the selection is considered to\n * have been performed.\n */\n public setSelectionRange(\n selectionStart: number,\n selectionEnd: number,\n selectionDirection: 'forward' | 'backward' | 'none' = 'none'\n ): void {\n this.inputElement.setSelectionRange(\n selectionStart,\n selectionEnd,\n selectionDirection\n );\n }\n\n /**\n * Selects all the text.\n */\n public select(): void {\n this.inputElement.select();\n }\n\n protected handleInput(): void {\n if (this.allowedKeys && this.inputElement.value) {\n const regExp = new RegExp(`^[${this.allowedKeys}]*$`, 'u');\n if (!regExp.test(this.inputElement.value)) {\n const selectionStart = this.inputElement\n .selectionStart as number;\n const nextSelectStart = selectionStart - 1;\n this.inputElement.value = this.value.toString();\n this.inputElement.setSelectionRange(\n nextSelectStart,\n nextSelectStart\n );\n return;\n }\n }\n this.value = this.inputElement.value;\n }\n\n protected handleChange(): void {\n this.dispatchEvent(\n new Event('change', {\n bubbles: true,\n composed: true,\n })\n );\n }\n\n protected onFocus(): void {\n this.focused = !this.readonly && true;\n }\n\n protected onBlur(): void {\n this.focused = !this.readonly && false;\n }\n\n protected renderStateIcons(): TemplateResult | typeof nothing {\n if (this.invalid) {\n return html`\n <sp-icon-alert id=\"invalid\" class=\"icon\"></sp-icon-alert>\n `;\n } else if (this.valid) {\n return html`\n <sp-icon-checkmark100\n id=\"valid\"\n class=\"icon spectrum-UIIcon-Checkmark100\"\n ></sp-icon-checkmark100>\n `;\n }\n return nothing;\n }\n\n protected get displayValue(): string {\n return this.value.toString();\n }\n\n private get renderMultiline(): TemplateResult {\n return html`\n ${this.grows && !this.quiet\n ? html`\n <div id=\"sizer\">${this.value}​</div>\n `\n : nothing}\n <!-- @ts-ignore -->\n <textarea\n aria-describedby=${this.helpTextId}\n aria-label=${this.label || this.placeholder}\n aria-invalid=${ifDefined(this.invalid || undefined)}\n class=\"input\"\n maxlength=${ifDefined(\n this.maxlength > -1 ? this.maxlength : undefined\n )}\n minlength=${ifDefined(\n this.minlength > -1 ? this.minlength : undefined\n )}\n pattern=${ifDefined(this.pattern)}\n placeholder=${this.placeholder}\n .value=${this.displayValue}\n @change=${this.handleChange}\n @input=${this.handleInput}\n @focus=${this.onFocus}\n @blur=${this.onBlur}\n ?disabled=${this.disabled}\n ?required=${this.required}\n ?readonly=${this.readonly}\n autocomplete=${ifDefined(this.autocomplete)}\n ></textarea>\n `;\n }\n\n private get renderInput(): TemplateResult {\n return html`\n <!-- @ts-ignore -->\n <input\n type=${this.type}\n aria-describedby=${this.helpTextId}\n aria-label=${this.label || this.placeholder}\n aria-invalid=${ifDefined(this.invalid || undefined)}\n class=\"input\"\n maxlength=${ifDefined(\n this.maxlength > -1 ? this.maxlength : undefined\n )}\n minlength=${ifDefined(\n this.minlength > -1 ? this.minlength : undefined\n )}\n pattern=${ifDefined(this.pattern)}\n placeholder=${this.placeholder}\n .value=${live(this.displayValue)}\n @change=${this.handleChange}\n @input=${this.handleInput}\n @focus=${this.onFocus}\n @blur=${this.onBlur}\n ?disabled=${this.disabled}\n ?required=${this.required}\n ?readonly=${this.readonly}\n autocomplete=${ifDefined(this.autocomplete)}\n />\n `;\n }\n\n protected renderField(): TemplateResult {\n return html`\n ${this.renderStateIcons()}\n ${this.multiline ? this.renderMultiline : this.renderInput}\n `;\n }\n\n protected override render(): TemplateResult {\n return html`\n <div id=\"textfield\">${this.renderField()}</div>\n ${this.renderHelpText(this.invalid)}\n `;\n }\n\n protected override update(changedProperties: PropertyValues): void {\n if (\n changedProperties.has('value') ||\n (changedProperties.has('required') && this.required)\n ) {\n this.updateComplete.then(() => {\n this.checkValidity();\n });\n }\n super.update(changedProperties);\n }\n\n public checkValidity(): boolean {\n let validity = this.inputElement.checkValidity();\n if (this.required || (this.value && this.pattern)) {\n if ((this.disabled || this.multiline) && this.pattern) {\n const regex = new RegExp(`^${this.pattern}$`, 'u');\n validity = regex.test(this.value.toString());\n }\n if (typeof this.minlength !== 'undefined') {\n validity =\n validity && this.value.toString().length >= this.minlength;\n }\n this.valid = validity;\n this.invalid = !validity;\n }\n return validity;\n }\n}\n\n/**\n * @element sp-textfield\n * @slot help-text - default or non-negative help text to associate to your form element\n * @slot negative-help-text - negative help text to associate to your form element when `invalid`\n */\nexport class Textfield extends TextfieldBase {\n @property({ type: String })\n public override set value(value: string) {\n if (value === this.value) {\n return;\n }\n const oldValue = this._value;\n this._value = value;\n this.requestUpdate('value', oldValue);\n }\n\n public override get value(): string {\n return this._value;\n }\n\n protected override _value = '';\n}\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;AAYA;AAAA,EAEI;AAAA,EACA;AAAA,
|
|
4
|
+
"sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport {\n CSSResultArray,\n html,\n nothing,\n PropertyValues,\n SizedMixin,\n TemplateResult,\n} from '@spectrum-web-components/base';\nimport {\n ifDefined,\n live,\n} from '@spectrum-web-components/base/src/directives.js';\nimport {\n property,\n query,\n state,\n} from '@spectrum-web-components/base/src/decorators.js';\n\nimport { ManageHelpText } from '@spectrum-web-components/help-text/src/manage-help-text.js';\nimport { Focusable } from '@spectrum-web-components/shared/src/focusable.js';\nimport '@spectrum-web-components/icons-ui/icons/sp-icon-checkmark100.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-alert.js';\n\nimport textfieldStyles from './textfield.css.js';\nimport checkmarkStyles from '@spectrum-web-components/icon/src/spectrum-icon-checkmark.css.js';\n\nconst textfieldTypes = ['text', 'url', 'tel', 'email', 'password'] as const;\nexport type TextfieldType = typeof textfieldTypes[number];\n\n/**\n * @fires input - The value of the element has changed.\n * @fires change - An alteration to the value of the element has been committed by the user.\n */\nexport class TextfieldBase extends ManageHelpText(\n SizedMixin(Focusable, {\n noDefaultSize: true,\n })\n) {\n public static override get styles(): CSSResultArray {\n return [textfieldStyles, checkmarkStyles];\n }\n\n @property({ attribute: 'allowed-keys' })\n allowedKeys = '';\n\n @property({ type: Boolean, reflect: true })\n public focused = false;\n\n @query('.input')\n protected inputElement!: HTMLInputElement | HTMLTextAreaElement;\n\n @property({ type: Boolean, reflect: true })\n public invalid = false;\n\n @property()\n public label = '';\n\n @property()\n public placeholder = '';\n\n @property({ attribute: 'type', reflect: true })\n private _type: TextfieldType = 'text';\n\n @state()\n get type(): TextfieldType {\n return textfieldTypes.find((t) => t === this._type) ?? 'text';\n }\n\n set type(val: TextfieldType) {\n const prev = this._type;\n this._type = val;\n this.requestUpdate('type', prev);\n }\n\n @property()\n public pattern?: string;\n\n @property({ type: Boolean, reflect: true })\n public grows = false;\n\n @property({ type: Number })\n public maxlength = -1;\n\n @property({ type: Number })\n public minlength = -1;\n\n @property({ type: Boolean, reflect: true })\n public multiline = false;\n\n @property({ type: Boolean, reflect: true })\n public readonly = false;\n\n @property({ type: Number })\n public rows = -1;\n\n @property({ type: Boolean, reflect: true })\n public valid = false;\n\n @property({ type: String })\n public set value(value: string | number) {\n if (value === this.value) {\n return;\n }\n const oldValue = this._value;\n this._value = value;\n this.requestUpdate('value', oldValue);\n }\n\n public get value(): string | number {\n return this._value;\n }\n\n protected _value: string | number = '';\n\n @property({ type: Boolean, reflect: true })\n public quiet = false;\n\n @property({ type: Boolean, reflect: true })\n public required = false;\n\n @property({ type: String, reflect: true })\n public autocomplete?:\n | HTMLInputElement['autocomplete']\n | HTMLTextAreaElement['autocomplete'];\n\n public override get focusElement(): HTMLInputElement | HTMLTextAreaElement {\n return this.inputElement;\n }\n\n /**\n * Sets the start and end positions of the current selection.\n *\n * @param selectionStart The 0-based index of the first selected character. An index greater than the length of the\n * element's value is treated as pointing to the end of the value.\n * @param selectionEnd The 0-based index of the character after the last selected character. An index greater than\n * the length of the element's value is treated as pointing to the end of the value.\n * @param [selectionDirection=\"none\"] A string indicating the direction in which the selection is considered to\n * have been performed.\n */\n public setSelectionRange(\n selectionStart: number,\n selectionEnd: number,\n selectionDirection: 'forward' | 'backward' | 'none' = 'none'\n ): void {\n this.inputElement.setSelectionRange(\n selectionStart,\n selectionEnd,\n selectionDirection\n );\n }\n\n /**\n * Selects all the text.\n */\n public select(): void {\n this.inputElement.select();\n }\n\n protected handleInput(): void {\n if (this.allowedKeys && this.inputElement.value) {\n const regExp = new RegExp(`^[${this.allowedKeys}]*$`, 'u');\n if (!regExp.test(this.inputElement.value)) {\n const selectionStart = this.inputElement\n .selectionStart as number;\n const nextSelectStart = selectionStart - 1;\n this.inputElement.value = this.value.toString();\n this.inputElement.setSelectionRange(\n nextSelectStart,\n nextSelectStart\n );\n return;\n }\n }\n this.value = this.inputElement.value;\n }\n\n protected handleChange(): void {\n this.dispatchEvent(\n new Event('change', {\n bubbles: true,\n composed: true,\n })\n );\n }\n\n protected onFocus(): void {\n this.focused = !this.readonly && true;\n }\n\n protected onBlur(): void {\n this.focused = !this.readonly && false;\n }\n\n protected renderStateIcons(): TemplateResult | typeof nothing {\n if (this.invalid) {\n return html`\n <sp-icon-alert id=\"invalid\" class=\"icon\"></sp-icon-alert>\n `;\n } else if (this.valid) {\n return html`\n <sp-icon-checkmark100\n id=\"valid\"\n class=\"icon spectrum-UIIcon-Checkmark100\"\n ></sp-icon-checkmark100>\n `;\n }\n return nothing;\n }\n\n protected get displayValue(): string {\n return this.value.toString();\n }\n\n private get renderMultiline(): TemplateResult {\n return html`\n ${this.grows && !this.quiet && this.rows === -1\n ? html`\n <div id=\"sizer\">${this.value}​</div>\n `\n : nothing}\n <!-- @ts-ignore -->\n <textarea\n aria-describedby=${this.helpTextId}\n aria-label=${this.label || this.placeholder}\n aria-invalid=${ifDefined(this.invalid || undefined)}\n class=\"input\"\n maxlength=${ifDefined(\n this.maxlength > -1 ? this.maxlength : undefined\n )}\n minlength=${ifDefined(\n this.minlength > -1 ? this.minlength : undefined\n )}\n pattern=${ifDefined(this.pattern)}\n placeholder=${this.placeholder}\n .value=${this.displayValue}\n @change=${this.handleChange}\n @input=${this.handleInput}\n @focus=${this.onFocus}\n @blur=${this.onBlur}\n ?disabled=${this.disabled}\n ?required=${this.required}\n ?readonly=${this.readonly}\n rows=${ifDefined(this.rows > -1 ? this.rows : undefined)}\n autocomplete=${ifDefined(this.autocomplete)}\n ></textarea>\n `;\n }\n\n private get renderInput(): TemplateResult {\n return html`\n <!-- @ts-ignore -->\n <input\n type=${this.type}\n aria-describedby=${this.helpTextId}\n aria-label=${this.label || this.placeholder}\n aria-invalid=${ifDefined(this.invalid || undefined)}\n class=\"input\"\n maxlength=${ifDefined(\n this.maxlength > -1 ? this.maxlength : undefined\n )}\n minlength=${ifDefined(\n this.minlength > -1 ? this.minlength : undefined\n )}\n pattern=${ifDefined(this.pattern)}\n placeholder=${this.placeholder}\n .value=${live(this.displayValue)}\n @change=${this.handleChange}\n @input=${this.handleInput}\n @focus=${this.onFocus}\n @blur=${this.onBlur}\n ?disabled=${this.disabled}\n ?required=${this.required}\n ?readonly=${this.readonly}\n autocomplete=${ifDefined(this.autocomplete)}\n />\n `;\n }\n\n protected renderField(): TemplateResult {\n return html`\n ${this.renderStateIcons()}\n ${this.multiline ? this.renderMultiline : this.renderInput}\n `;\n }\n\n protected override render(): TemplateResult {\n return html`\n <div id=\"textfield\">${this.renderField()}</div>\n ${this.renderHelpText(this.invalid)}\n `;\n }\n\n protected override update(changedProperties: PropertyValues): void {\n if (\n changedProperties.has('value') ||\n (changedProperties.has('required') && this.required)\n ) {\n this.updateComplete.then(() => {\n this.checkValidity();\n });\n }\n super.update(changedProperties);\n }\n\n public checkValidity(): boolean {\n let validity = this.inputElement.checkValidity();\n if (this.required || (this.value && this.pattern)) {\n if ((this.disabled || this.multiline) && this.pattern) {\n const regex = new RegExp(`^${this.pattern}$`, 'u');\n validity = regex.test(this.value.toString());\n }\n if (typeof this.minlength !== 'undefined') {\n validity =\n validity && this.value.toString().length >= this.minlength;\n }\n this.valid = validity;\n this.invalid = !validity;\n }\n return validity;\n }\n}\n\n/**\n * @element sp-textfield\n * @slot help-text - default or non-negative help text to associate to your form element\n * @slot negative-help-text - negative help text to associate to your form element when `invalid`\n */\nexport class Textfield extends TextfieldBase {\n @property({ type: String })\n public override set value(value: string) {\n if (value === this.value) {\n return;\n }\n const oldValue = this._value;\n this._value = value;\n this.requestUpdate('value', oldValue);\n }\n\n public override get value(): string {\n return this._value;\n }\n\n protected override _value = '';\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|