@kubex/zinc 1.1.58 → 1.1.60
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/custom-elements.json +272 -197
- package/dist/vscode.html-custom-data.json +41 -27
- package/dist/web-types.json +91 -53
- package/dist/zn.d.ts +12 -0
- package/dist/zn.min.js +126 -111
- package/docs/pages/components/input.md +30 -0
- package/docs/pages/components/toggle.md +62 -0
- package/package.json +1 -1
- package/src/components/input/input.component.ts +9 -2
- package/src/components/input/input.test.ts +55 -0
- package/src/components/toggle/toggle.component.ts +39 -3
- package/src/components/toggle/toggle.scss +66 -3
- package/src/components/toggle/toggle.test.ts +11 -0
- package/src/internal/form-navigation.ts +5 -0
|
@@ -47,79 +47,6 @@
|
|
|
47
47
|
}
|
|
48
48
|
]
|
|
49
49
|
},
|
|
50
|
-
{
|
|
51
|
-
"kind": "javascript-module",
|
|
52
|
-
"path": "components/action-bar/action-bar.js",
|
|
53
|
-
"declarations": [
|
|
54
|
-
{
|
|
55
|
-
"kind": "class",
|
|
56
|
-
"description": "",
|
|
57
|
-
"name": "ZnActionBar",
|
|
58
|
-
"cssProperties": [
|
|
59
|
-
{
|
|
60
|
-
"description": "An example CSS custom property.",
|
|
61
|
-
"name": "--example"
|
|
62
|
-
}
|
|
63
|
-
],
|
|
64
|
-
"cssParts": [
|
|
65
|
-
{
|
|
66
|
-
"description": "The component's base wrapper.",
|
|
67
|
-
"name": "base"
|
|
68
|
-
}
|
|
69
|
-
],
|
|
70
|
-
"slots": [
|
|
71
|
-
{
|
|
72
|
-
"description": "The default slot.",
|
|
73
|
-
"name": ""
|
|
74
|
-
},
|
|
75
|
-
{
|
|
76
|
-
"description": "An example slot.",
|
|
77
|
-
"name": "example"
|
|
78
|
-
}
|
|
79
|
-
],
|
|
80
|
-
"members": [
|
|
81
|
-
{
|
|
82
|
-
"kind": "field",
|
|
83
|
-
"name": "localize",
|
|
84
|
-
"privacy": "private",
|
|
85
|
-
"readonly": true,
|
|
86
|
-
"default": "new LocalizeController(this)"
|
|
87
|
-
}
|
|
88
|
-
],
|
|
89
|
-
"events": [
|
|
90
|
-
{
|
|
91
|
-
"description": "Emitted as an example.",
|
|
92
|
-
"name": "zn-event-name"
|
|
93
|
-
}
|
|
94
|
-
],
|
|
95
|
-
"superclass": {
|
|
96
|
-
"name": "ZincElement",
|
|
97
|
-
"module": "/src/internal/zinc-element"
|
|
98
|
-
},
|
|
99
|
-
"summary": "Short summary of the component's intended use.",
|
|
100
|
-
"tagNameWithoutPrefix": "action-bar",
|
|
101
|
-
"tagName": "zn-action-bar",
|
|
102
|
-
"customElement": true,
|
|
103
|
-
"jsDoc": "/**\n * @summary Short summary of the component's intended use.\n * @documentation https://zinc.style/components/action-bar\n * @status experimental\n * @since 1.0\n *\n * @dependency zn-example\n *\n * @event zn-event-name - Emitted as an example.\n *\n * @slot - The default slot.\n * @slot example - An example slot.\n *\n * @csspart base - The component's base wrapper.\n *\n * @cssproperty --example - An example CSS custom property.\n */",
|
|
104
|
-
"documentation": "https://zinc.style/components/action-bar",
|
|
105
|
-
"status": "experimental",
|
|
106
|
-
"since": "1.0",
|
|
107
|
-
"dependencies": [
|
|
108
|
-
"zn-example"
|
|
109
|
-
]
|
|
110
|
-
}
|
|
111
|
-
],
|
|
112
|
-
"exports": [
|
|
113
|
-
{
|
|
114
|
-
"kind": "js",
|
|
115
|
-
"name": "default",
|
|
116
|
-
"declaration": {
|
|
117
|
-
"name": "ZnActionBar",
|
|
118
|
-
"module": "components/action-bar/action-bar.js"
|
|
119
|
-
}
|
|
120
|
-
}
|
|
121
|
-
]
|
|
122
|
-
},
|
|
123
50
|
{
|
|
124
51
|
"kind": "javascript-module",
|
|
125
52
|
"path": "components/alert/alert.js",
|
|
@@ -314,6 +241,79 @@
|
|
|
314
241
|
}
|
|
315
242
|
]
|
|
316
243
|
},
|
|
244
|
+
{
|
|
245
|
+
"kind": "javascript-module",
|
|
246
|
+
"path": "components/action-bar/action-bar.js",
|
|
247
|
+
"declarations": [
|
|
248
|
+
{
|
|
249
|
+
"kind": "class",
|
|
250
|
+
"description": "",
|
|
251
|
+
"name": "ZnActionBar",
|
|
252
|
+
"cssProperties": [
|
|
253
|
+
{
|
|
254
|
+
"description": "An example CSS custom property.",
|
|
255
|
+
"name": "--example"
|
|
256
|
+
}
|
|
257
|
+
],
|
|
258
|
+
"cssParts": [
|
|
259
|
+
{
|
|
260
|
+
"description": "The component's base wrapper.",
|
|
261
|
+
"name": "base"
|
|
262
|
+
}
|
|
263
|
+
],
|
|
264
|
+
"slots": [
|
|
265
|
+
{
|
|
266
|
+
"description": "The default slot.",
|
|
267
|
+
"name": ""
|
|
268
|
+
},
|
|
269
|
+
{
|
|
270
|
+
"description": "An example slot.",
|
|
271
|
+
"name": "example"
|
|
272
|
+
}
|
|
273
|
+
],
|
|
274
|
+
"members": [
|
|
275
|
+
{
|
|
276
|
+
"kind": "field",
|
|
277
|
+
"name": "localize",
|
|
278
|
+
"privacy": "private",
|
|
279
|
+
"readonly": true,
|
|
280
|
+
"default": "new LocalizeController(this)"
|
|
281
|
+
}
|
|
282
|
+
],
|
|
283
|
+
"events": [
|
|
284
|
+
{
|
|
285
|
+
"description": "Emitted as an example.",
|
|
286
|
+
"name": "zn-event-name"
|
|
287
|
+
}
|
|
288
|
+
],
|
|
289
|
+
"superclass": {
|
|
290
|
+
"name": "ZincElement",
|
|
291
|
+
"module": "/src/internal/zinc-element"
|
|
292
|
+
},
|
|
293
|
+
"summary": "Short summary of the component's intended use.",
|
|
294
|
+
"tagNameWithoutPrefix": "action-bar",
|
|
295
|
+
"tagName": "zn-action-bar",
|
|
296
|
+
"customElement": true,
|
|
297
|
+
"jsDoc": "/**\n * @summary Short summary of the component's intended use.\n * @documentation https://zinc.style/components/action-bar\n * @status experimental\n * @since 1.0\n *\n * @dependency zn-example\n *\n * @event zn-event-name - Emitted as an example.\n *\n * @slot - The default slot.\n * @slot example - An example slot.\n *\n * @csspart base - The component's base wrapper.\n *\n * @cssproperty --example - An example CSS custom property.\n */",
|
|
298
|
+
"documentation": "https://zinc.style/components/action-bar",
|
|
299
|
+
"status": "experimental",
|
|
300
|
+
"since": "1.0",
|
|
301
|
+
"dependencies": [
|
|
302
|
+
"zn-example"
|
|
303
|
+
]
|
|
304
|
+
}
|
|
305
|
+
],
|
|
306
|
+
"exports": [
|
|
307
|
+
{
|
|
308
|
+
"kind": "js",
|
|
309
|
+
"name": "default",
|
|
310
|
+
"declaration": {
|
|
311
|
+
"name": "ZnActionBar",
|
|
312
|
+
"module": "components/action-bar/action-bar.js"
|
|
313
|
+
}
|
|
314
|
+
}
|
|
315
|
+
]
|
|
316
|
+
},
|
|
317
317
|
{
|
|
318
318
|
"kind": "javascript-module",
|
|
319
319
|
"path": "components/animated-button/animated-button.js",
|
|
@@ -18327,6 +18327,16 @@
|
|
|
18327
18327
|
"description": "Tells the browser what type of data will be entered by the user, allowing it to display the appropriate virtual\nkeyboard on supportive devices.",
|
|
18328
18328
|
"attribute": "inputmode"
|
|
18329
18329
|
},
|
|
18330
|
+
{
|
|
18331
|
+
"kind": "field",
|
|
18332
|
+
"name": "triggerSubmit",
|
|
18333
|
+
"type": {
|
|
18334
|
+
"text": "boolean"
|
|
18335
|
+
},
|
|
18336
|
+
"default": "false",
|
|
18337
|
+
"description": "When enabled, pressing enter will always submit the surrounding form, even when the form uses\nenter-navigation to move between fields.",
|
|
18338
|
+
"attribute": "trigger-submit"
|
|
18339
|
+
},
|
|
18330
18340
|
{
|
|
18331
18341
|
"kind": "field",
|
|
18332
18342
|
"name": "valueAsDate",
|
|
@@ -19071,6 +19081,15 @@
|
|
|
19071
19081
|
},
|
|
19072
19082
|
"description": "Tells the browser what type of data will be entered by the user, allowing it to display the appropriate virtual\nkeyboard on supportive devices.",
|
|
19073
19083
|
"fieldName": "inputmode"
|
|
19084
|
+
},
|
|
19085
|
+
{
|
|
19086
|
+
"name": "trigger-submit",
|
|
19087
|
+
"type": {
|
|
19088
|
+
"text": "boolean"
|
|
19089
|
+
},
|
|
19090
|
+
"default": "false",
|
|
19091
|
+
"description": "When enabled, pressing enter will always submit the surrounding form, even when the form uses\nenter-navigation to move between fields.",
|
|
19092
|
+
"fieldName": "triggerSubmit"
|
|
19074
19093
|
}
|
|
19075
19094
|
],
|
|
19076
19095
|
"superclass": {
|
|
@@ -33542,6 +33561,128 @@
|
|
|
33542
33561
|
}
|
|
33543
33562
|
]
|
|
33544
33563
|
},
|
|
33564
|
+
{
|
|
33565
|
+
"kind": "javascript-module",
|
|
33566
|
+
"path": "components/simple-chart/simple-chart.js",
|
|
33567
|
+
"declarations": [
|
|
33568
|
+
{
|
|
33569
|
+
"kind": "class",
|
|
33570
|
+
"description": "",
|
|
33571
|
+
"name": "ZnSimpleChart",
|
|
33572
|
+
"members": [
|
|
33573
|
+
{
|
|
33574
|
+
"kind": "field",
|
|
33575
|
+
"name": "datasets",
|
|
33576
|
+
"type": {
|
|
33577
|
+
"text": "{ data: number[] }[] | undefined"
|
|
33578
|
+
},
|
|
33579
|
+
"attribute": "datasets"
|
|
33580
|
+
},
|
|
33581
|
+
{
|
|
33582
|
+
"kind": "field",
|
|
33583
|
+
"name": "labels",
|
|
33584
|
+
"type": {
|
|
33585
|
+
"text": "string[] | undefined"
|
|
33586
|
+
},
|
|
33587
|
+
"attribute": "labels"
|
|
33588
|
+
},
|
|
33589
|
+
{
|
|
33590
|
+
"kind": "field",
|
|
33591
|
+
"name": "enableAnimations",
|
|
33592
|
+
"type": {
|
|
33593
|
+
"text": "boolean | number"
|
|
33594
|
+
},
|
|
33595
|
+
"default": "false",
|
|
33596
|
+
"attribute": "enable-animations"
|
|
33597
|
+
},
|
|
33598
|
+
{
|
|
33599
|
+
"kind": "field",
|
|
33600
|
+
"name": "chart",
|
|
33601
|
+
"type": {
|
|
33602
|
+
"text": "ECharts | undefined"
|
|
33603
|
+
},
|
|
33604
|
+
"privacy": "private"
|
|
33605
|
+
},
|
|
33606
|
+
{
|
|
33607
|
+
"kind": "field",
|
|
33608
|
+
"name": "initPromise",
|
|
33609
|
+
"type": {
|
|
33610
|
+
"text": "Promise<void> | undefined"
|
|
33611
|
+
},
|
|
33612
|
+
"privacy": "private"
|
|
33613
|
+
},
|
|
33614
|
+
{
|
|
33615
|
+
"kind": "field",
|
|
33616
|
+
"name": "resizeObserver",
|
|
33617
|
+
"privacy": "private",
|
|
33618
|
+
"readonly": true,
|
|
33619
|
+
"default": "new ResizeController(this, { target: null, skipInitial: true, callback: () => this.chart?.resize(), })"
|
|
33620
|
+
},
|
|
33621
|
+
{
|
|
33622
|
+
"kind": "method",
|
|
33623
|
+
"name": "getUpdateComplete",
|
|
33624
|
+
"privacy": "protected",
|
|
33625
|
+
"return": {
|
|
33626
|
+
"type": {
|
|
33627
|
+
"text": "Promise<boolean>"
|
|
33628
|
+
}
|
|
33629
|
+
}
|
|
33630
|
+
},
|
|
33631
|
+
{
|
|
33632
|
+
"kind": "method",
|
|
33633
|
+
"name": "initChart",
|
|
33634
|
+
"privacy": "private"
|
|
33635
|
+
}
|
|
33636
|
+
],
|
|
33637
|
+
"attributes": [
|
|
33638
|
+
{
|
|
33639
|
+
"name": "datasets",
|
|
33640
|
+
"type": {
|
|
33641
|
+
"text": "{ data: number[] }[] | undefined"
|
|
33642
|
+
},
|
|
33643
|
+
"fieldName": "datasets"
|
|
33644
|
+
},
|
|
33645
|
+
{
|
|
33646
|
+
"name": "labels",
|
|
33647
|
+
"type": {
|
|
33648
|
+
"text": "string[] | undefined"
|
|
33649
|
+
},
|
|
33650
|
+
"fieldName": "labels"
|
|
33651
|
+
},
|
|
33652
|
+
{
|
|
33653
|
+
"name": "enable-animations",
|
|
33654
|
+
"type": {
|
|
33655
|
+
"text": "boolean | number"
|
|
33656
|
+
},
|
|
33657
|
+
"default": "false",
|
|
33658
|
+
"fieldName": "enableAnimations"
|
|
33659
|
+
}
|
|
33660
|
+
],
|
|
33661
|
+
"superclass": {
|
|
33662
|
+
"name": "ZincElement",
|
|
33663
|
+
"module": "/src/internal/zinc-element"
|
|
33664
|
+
},
|
|
33665
|
+
"summary": "A simple, pre-styled bar chart.",
|
|
33666
|
+
"tagNameWithoutPrefix": "simple-chart",
|
|
33667
|
+
"tagName": "zn-simple-chart",
|
|
33668
|
+
"customElement": true,
|
|
33669
|
+
"jsDoc": "/**\n * @summary A simple, pre-styled bar chart.\n * @documentation https://zinc.style/components/simple-chart\n * @status experimental\n * @since 1.0\n */",
|
|
33670
|
+
"documentation": "https://zinc.style/components/simple-chart",
|
|
33671
|
+
"status": "experimental",
|
|
33672
|
+
"since": "1.0"
|
|
33673
|
+
}
|
|
33674
|
+
],
|
|
33675
|
+
"exports": [
|
|
33676
|
+
{
|
|
33677
|
+
"kind": "js",
|
|
33678
|
+
"name": "default",
|
|
33679
|
+
"declaration": {
|
|
33680
|
+
"name": "ZnSimpleChart",
|
|
33681
|
+
"module": "components/simple-chart/simple-chart.js"
|
|
33682
|
+
}
|
|
33683
|
+
}
|
|
33684
|
+
]
|
|
33685
|
+
},
|
|
33545
33686
|
{
|
|
33546
33687
|
"kind": "javascript-module",
|
|
33547
33688
|
"path": "components/skeleton/skeleton.js",
|
|
@@ -33897,128 +34038,6 @@
|
|
|
33897
34038
|
}
|
|
33898
34039
|
]
|
|
33899
34040
|
},
|
|
33900
|
-
{
|
|
33901
|
-
"kind": "javascript-module",
|
|
33902
|
-
"path": "components/simple-chart/simple-chart.js",
|
|
33903
|
-
"declarations": [
|
|
33904
|
-
{
|
|
33905
|
-
"kind": "class",
|
|
33906
|
-
"description": "",
|
|
33907
|
-
"name": "ZnSimpleChart",
|
|
33908
|
-
"members": [
|
|
33909
|
-
{
|
|
33910
|
-
"kind": "field",
|
|
33911
|
-
"name": "datasets",
|
|
33912
|
-
"type": {
|
|
33913
|
-
"text": "{ data: number[] }[] | undefined"
|
|
33914
|
-
},
|
|
33915
|
-
"attribute": "datasets"
|
|
33916
|
-
},
|
|
33917
|
-
{
|
|
33918
|
-
"kind": "field",
|
|
33919
|
-
"name": "labels",
|
|
33920
|
-
"type": {
|
|
33921
|
-
"text": "string[] | undefined"
|
|
33922
|
-
},
|
|
33923
|
-
"attribute": "labels"
|
|
33924
|
-
},
|
|
33925
|
-
{
|
|
33926
|
-
"kind": "field",
|
|
33927
|
-
"name": "enableAnimations",
|
|
33928
|
-
"type": {
|
|
33929
|
-
"text": "boolean | number"
|
|
33930
|
-
},
|
|
33931
|
-
"default": "false",
|
|
33932
|
-
"attribute": "enable-animations"
|
|
33933
|
-
},
|
|
33934
|
-
{
|
|
33935
|
-
"kind": "field",
|
|
33936
|
-
"name": "chart",
|
|
33937
|
-
"type": {
|
|
33938
|
-
"text": "ECharts | undefined"
|
|
33939
|
-
},
|
|
33940
|
-
"privacy": "private"
|
|
33941
|
-
},
|
|
33942
|
-
{
|
|
33943
|
-
"kind": "field",
|
|
33944
|
-
"name": "initPromise",
|
|
33945
|
-
"type": {
|
|
33946
|
-
"text": "Promise<void> | undefined"
|
|
33947
|
-
},
|
|
33948
|
-
"privacy": "private"
|
|
33949
|
-
},
|
|
33950
|
-
{
|
|
33951
|
-
"kind": "field",
|
|
33952
|
-
"name": "resizeObserver",
|
|
33953
|
-
"privacy": "private",
|
|
33954
|
-
"readonly": true,
|
|
33955
|
-
"default": "new ResizeController(this, { target: null, skipInitial: true, callback: () => this.chart?.resize(), })"
|
|
33956
|
-
},
|
|
33957
|
-
{
|
|
33958
|
-
"kind": "method",
|
|
33959
|
-
"name": "getUpdateComplete",
|
|
33960
|
-
"privacy": "protected",
|
|
33961
|
-
"return": {
|
|
33962
|
-
"type": {
|
|
33963
|
-
"text": "Promise<boolean>"
|
|
33964
|
-
}
|
|
33965
|
-
}
|
|
33966
|
-
},
|
|
33967
|
-
{
|
|
33968
|
-
"kind": "method",
|
|
33969
|
-
"name": "initChart",
|
|
33970
|
-
"privacy": "private"
|
|
33971
|
-
}
|
|
33972
|
-
],
|
|
33973
|
-
"attributes": [
|
|
33974
|
-
{
|
|
33975
|
-
"name": "datasets",
|
|
33976
|
-
"type": {
|
|
33977
|
-
"text": "{ data: number[] }[] | undefined"
|
|
33978
|
-
},
|
|
33979
|
-
"fieldName": "datasets"
|
|
33980
|
-
},
|
|
33981
|
-
{
|
|
33982
|
-
"name": "labels",
|
|
33983
|
-
"type": {
|
|
33984
|
-
"text": "string[] | undefined"
|
|
33985
|
-
},
|
|
33986
|
-
"fieldName": "labels"
|
|
33987
|
-
},
|
|
33988
|
-
{
|
|
33989
|
-
"name": "enable-animations",
|
|
33990
|
-
"type": {
|
|
33991
|
-
"text": "boolean | number"
|
|
33992
|
-
},
|
|
33993
|
-
"default": "false",
|
|
33994
|
-
"fieldName": "enableAnimations"
|
|
33995
|
-
}
|
|
33996
|
-
],
|
|
33997
|
-
"superclass": {
|
|
33998
|
-
"name": "ZincElement",
|
|
33999
|
-
"module": "/src/internal/zinc-element"
|
|
34000
|
-
},
|
|
34001
|
-
"summary": "A simple, pre-styled bar chart.",
|
|
34002
|
-
"tagNameWithoutPrefix": "simple-chart",
|
|
34003
|
-
"tagName": "zn-simple-chart",
|
|
34004
|
-
"customElement": true,
|
|
34005
|
-
"jsDoc": "/**\n * @summary A simple, pre-styled bar chart.\n * @documentation https://zinc.style/components/simple-chart\n * @status experimental\n * @since 1.0\n */",
|
|
34006
|
-
"documentation": "https://zinc.style/components/simple-chart",
|
|
34007
|
-
"status": "experimental",
|
|
34008
|
-
"since": "1.0"
|
|
34009
|
-
}
|
|
34010
|
-
],
|
|
34011
|
-
"exports": [
|
|
34012
|
-
{
|
|
34013
|
-
"kind": "js",
|
|
34014
|
-
"name": "default",
|
|
34015
|
-
"declaration": {
|
|
34016
|
-
"name": "ZnSimpleChart",
|
|
34017
|
-
"module": "components/simple-chart/simple-chart.js"
|
|
34018
|
-
}
|
|
34019
|
-
}
|
|
34020
|
-
]
|
|
34021
|
-
},
|
|
34022
34041
|
{
|
|
34023
34042
|
"kind": "javascript-module",
|
|
34024
34043
|
"path": "components/sp/sp.js",
|
|
@@ -38787,15 +38806,34 @@
|
|
|
38787
38806
|
{
|
|
38788
38807
|
"description": "The toggle switch control (the circular button that slides).",
|
|
38789
38808
|
"name": "control"
|
|
38809
|
+
},
|
|
38810
|
+
{
|
|
38811
|
+
"description": "The container that wraps the toggle's description.",
|
|
38812
|
+
"name": "description"
|
|
38790
38813
|
}
|
|
38791
38814
|
],
|
|
38792
38815
|
"slots": [
|
|
38793
38816
|
{
|
|
38794
38817
|
"description": "The toggle's label.",
|
|
38795
38818
|
"name": ""
|
|
38819
|
+
},
|
|
38820
|
+
{
|
|
38821
|
+
"description": "A description of the toggle's label. Alternatively, you can use the `description` attribute.",
|
|
38822
|
+
"name": "description"
|
|
38823
|
+
},
|
|
38824
|
+
{
|
|
38825
|
+
"description": "Text that describes how to use the toggle. Alternatively, you can use the `help-text` attribute.",
|
|
38826
|
+
"name": "help-text"
|
|
38796
38827
|
}
|
|
38797
38828
|
],
|
|
38798
38829
|
"members": [
|
|
38830
|
+
{
|
|
38831
|
+
"kind": "field",
|
|
38832
|
+
"name": "hasSlotController",
|
|
38833
|
+
"privacy": "private",
|
|
38834
|
+
"readonly": true,
|
|
38835
|
+
"default": "new HasSlotController(this, 'help-text', 'description')"
|
|
38836
|
+
},
|
|
38799
38837
|
{
|
|
38800
38838
|
"kind": "field",
|
|
38801
38839
|
"name": "formControlController",
|
|
@@ -38956,6 +38994,26 @@
|
|
|
38956
38994
|
"default": "''",
|
|
38957
38995
|
"attribute": "label"
|
|
38958
38996
|
},
|
|
38997
|
+
{
|
|
38998
|
+
"kind": "field",
|
|
38999
|
+
"name": "description",
|
|
39000
|
+
"type": {
|
|
39001
|
+
"text": "string"
|
|
39002
|
+
},
|
|
39003
|
+
"default": "''",
|
|
39004
|
+
"description": "The toggle's description, displayed under the label. If you need to display HTML, use the `description` slot instead.",
|
|
39005
|
+
"attribute": "description"
|
|
39006
|
+
},
|
|
39007
|
+
{
|
|
39008
|
+
"kind": "field",
|
|
39009
|
+
"name": "labelPosition",
|
|
39010
|
+
"type": {
|
|
39011
|
+
"text": "'top' | 'left' | 'right'"
|
|
39012
|
+
},
|
|
39013
|
+
"default": "'top'",
|
|
39014
|
+
"attribute": "label-position",
|
|
39015
|
+
"reflects": true
|
|
39016
|
+
},
|
|
38959
39017
|
{
|
|
38960
39018
|
"kind": "field",
|
|
38961
39019
|
"name": "inline",
|
|
@@ -39190,6 +39248,23 @@
|
|
|
39190
39248
|
"default": "''",
|
|
39191
39249
|
"fieldName": "label"
|
|
39192
39250
|
},
|
|
39251
|
+
{
|
|
39252
|
+
"name": "description",
|
|
39253
|
+
"type": {
|
|
39254
|
+
"text": "string"
|
|
39255
|
+
},
|
|
39256
|
+
"default": "''",
|
|
39257
|
+
"description": "The toggle's description, displayed under the label. If you need to display HTML, use the `description` slot instead.",
|
|
39258
|
+
"fieldName": "description"
|
|
39259
|
+
},
|
|
39260
|
+
{
|
|
39261
|
+
"name": "label-position",
|
|
39262
|
+
"type": {
|
|
39263
|
+
"text": "'top' | 'left' | 'right'"
|
|
39264
|
+
},
|
|
39265
|
+
"default": "'top'",
|
|
39266
|
+
"fieldName": "labelPosition"
|
|
39267
|
+
},
|
|
39193
39268
|
{
|
|
39194
39269
|
"name": "inline",
|
|
39195
39270
|
"type": {
|
|
@@ -39207,7 +39282,7 @@
|
|
|
39207
39282
|
"tagNameWithoutPrefix": "toggle",
|
|
39208
39283
|
"tagName": "zn-toggle",
|
|
39209
39284
|
"customElement": true,
|
|
39210
|
-
"jsDoc": "/**\n * @summary Toggles allow the user to switch an option on or off.\n * @documentation https://zinc.style/components/toggle\n * @status stable\n * @since 1.0\n *\n * @dependency zn-tooltip\n *\n * @event zn-input - Emitted when the toggle receives input.\n *\n * @slot - The toggle's label.\n *\n * @csspart base - The component's base wrapper containing the toggle switch.\n * @csspart control - The toggle switch control (the circular button that slides).\n *\n * @cssproperty --zn-toggle-margin - The margin around the toggle switch. Defaults to `8px 0`.\n */",
|
|
39285
|
+
"jsDoc": "/**\n * @summary Toggles allow the user to switch an option on or off.\n * @documentation https://zinc.style/components/toggle\n * @status stable\n * @since 1.0\n *\n * @dependency zn-tooltip\n *\n * @event zn-input - Emitted when the toggle receives input.\n *\n * @slot - The toggle's label.\n * @slot description - A description of the toggle's label. Alternatively, you can use the `description` attribute.\n * @slot help-text - Text that describes how to use the toggle. Alternatively, you can use the `help-text` attribute.\n *\n * @csspart base - The component's base wrapper containing the toggle switch.\n * @csspart control - The toggle switch control (the circular button that slides).\n * @csspart description - The container that wraps the toggle's description.\n *\n * @cssproperty --zn-toggle-margin - The margin around the toggle switch. Defaults to `8px 0`.\n */",
|
|
39211
39286
|
"documentation": "https://zinc.style/components/toggle",
|
|
39212
39287
|
"status": "stable",
|
|
39213
39288
|
"since": "1.0",
|
|
@@ -40751,7 +40826,7 @@
|
|
|
40751
40826
|
"package": {
|
|
40752
40827
|
"name": "@kubex/zinc",
|
|
40753
40828
|
"description": "A collection of web components for building web applications based off of @shoelace-style/Shoelace",
|
|
40754
|
-
"version": "1.1.
|
|
40829
|
+
"version": "1.1.60",
|
|
40755
40830
|
"author": "",
|
|
40756
40831
|
"license": "MIT"
|
|
40757
40832
|
}
|
|
@@ -13,17 +13,6 @@
|
|
|
13
13
|
}
|
|
14
14
|
]
|
|
15
15
|
},
|
|
16
|
-
{
|
|
17
|
-
"name": "zn-action-bar",
|
|
18
|
-
"description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Slots:**\n - _default_ - The default slot.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
|
|
19
|
-
"attributes": [],
|
|
20
|
-
"references": [
|
|
21
|
-
{
|
|
22
|
-
"name": "Documentation",
|
|
23
|
-
"url": "https://zinc.style/components/action-bar"
|
|
24
|
-
}
|
|
25
|
-
]
|
|
26
|
-
},
|
|
27
16
|
{
|
|
28
17
|
"name": "zn-alert",
|
|
29
18
|
"description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Slots:**\n - _default_ - The default slot.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
|
|
@@ -64,6 +53,17 @@
|
|
|
64
53
|
}
|
|
65
54
|
]
|
|
66
55
|
},
|
|
56
|
+
{
|
|
57
|
+
"name": "zn-action-bar",
|
|
58
|
+
"description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Slots:**\n - _default_ - The default slot.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
|
|
59
|
+
"attributes": [],
|
|
60
|
+
"references": [
|
|
61
|
+
{
|
|
62
|
+
"name": "Documentation",
|
|
63
|
+
"url": "https://zinc.style/components/action-bar"
|
|
64
|
+
}
|
|
65
|
+
]
|
|
66
|
+
},
|
|
67
67
|
{
|
|
68
68
|
"name": "zn-animated-button",
|
|
69
69
|
"description": "\n---\n\n\n### **Methods:**\n - **purchase(): _void_** - Programmatically trigger the purchase flow\n- **setSuccess(): _void_** - Set the button to success state manually\n- **setFailure(message): _void_** - Set the button to failure state manually with optional error message\n- **reset(): _void_** - Reset the button to idle state",
|
|
@@ -2174,6 +2174,11 @@
|
|
|
2174
2174
|
{ "name": "email" },
|
|
2175
2175
|
{ "name": "url" }
|
|
2176
2176
|
]
|
|
2177
|
+
},
|
|
2178
|
+
{
|
|
2179
|
+
"name": "trigger-submit",
|
|
2180
|
+
"description": "When enabled, pressing enter will always submit the surrounding form, even when the form uses\nenter-navigation to move between fields.",
|
|
2181
|
+
"values": []
|
|
2177
2182
|
}
|
|
2178
2183
|
],
|
|
2179
2184
|
"references": [
|
|
@@ -3442,6 +3447,21 @@
|
|
|
3442
3447
|
}
|
|
3443
3448
|
]
|
|
3444
3449
|
},
|
|
3450
|
+
{
|
|
3451
|
+
"name": "zn-simple-chart",
|
|
3452
|
+
"description": "A simple, pre-styled bar chart.\n---\n",
|
|
3453
|
+
"attributes": [
|
|
3454
|
+
{ "name": "datasets", "values": [{ "name": "{ data: number[] }[]" }] },
|
|
3455
|
+
{ "name": "labels", "values": [{ "name": "string[]" }] },
|
|
3456
|
+
{ "name": "enable-animations", "values": [] }
|
|
3457
|
+
],
|
|
3458
|
+
"references": [
|
|
3459
|
+
{
|
|
3460
|
+
"name": "Documentation",
|
|
3461
|
+
"url": "https://zinc.style/components/simple-chart"
|
|
3462
|
+
}
|
|
3463
|
+
]
|
|
3464
|
+
},
|
|
3445
3465
|
{
|
|
3446
3466
|
"name": "zn-skeleton",
|
|
3447
3467
|
"description": "Skeleton loaders provide visual placeholders while content is loading, improving perceived performance and user experience.\n---\n",
|
|
@@ -3501,21 +3521,6 @@
|
|
|
3501
3521
|
}
|
|
3502
3522
|
]
|
|
3503
3523
|
},
|
|
3504
|
-
{
|
|
3505
|
-
"name": "zn-simple-chart",
|
|
3506
|
-
"description": "A simple, pre-styled bar chart.\n---\n",
|
|
3507
|
-
"attributes": [
|
|
3508
|
-
{ "name": "datasets", "values": [{ "name": "{ data: number[] }[]" }] },
|
|
3509
|
-
{ "name": "labels", "values": [{ "name": "string[]" }] },
|
|
3510
|
-
{ "name": "enable-animations", "values": [] }
|
|
3511
|
-
],
|
|
3512
|
-
"references": [
|
|
3513
|
-
{
|
|
3514
|
-
"name": "Documentation",
|
|
3515
|
-
"url": "https://zinc.style/components/simple-chart"
|
|
3516
|
-
}
|
|
3517
|
-
]
|
|
3518
|
-
},
|
|
3519
3524
|
{
|
|
3520
3525
|
"name": "zn-sp",
|
|
3521
3526
|
"description": "A flexible layout container for spacing and arranging child elements in rows or columns with configurable gap, padding, and dividers.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Slots:**\n - _default_ - The default slot.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
|
|
@@ -4049,7 +4054,7 @@
|
|
|
4049
4054
|
},
|
|
4050
4055
|
{
|
|
4051
4056
|
"name": "zn-toggle",
|
|
4052
|
-
"description": "Toggles allow the user to switch an option on or off.\n---\n\n\n### **Events:**\n - **zn-input** - Emitted when the toggle receives input.\n\n### **Slots:**\n - _default_ - The toggle's label.\n\n### **CSS Properties:**\n - **--zn-toggle-margin** - The margin around the toggle switch. Defaults to `8px 0`. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper containing the toggle switch.\n- **control** - The toggle switch control (the circular button that slides).",
|
|
4057
|
+
"description": "Toggles allow the user to switch an option on or off.\n---\n\n\n### **Events:**\n - **zn-input** - Emitted when the toggle receives input.\n\n### **Slots:**\n - _default_ - The toggle's label.\n- **description** - A description of the toggle's label. Alternatively, you can use the `description` attribute.\n- **help-text** - Text that describes how to use the toggle. Alternatively, you can use the `help-text` attribute.\n\n### **CSS Properties:**\n - **--zn-toggle-margin** - The margin around the toggle switch. Defaults to `8px 0`. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper containing the toggle switch.\n- **control** - The toggle switch control (the circular button that slides).\n- **description** - The container that wraps the toggle's description.",
|
|
4053
4058
|
"attributes": [
|
|
4054
4059
|
{ "name": "title", "values": [] },
|
|
4055
4060
|
{ "name": "name", "values": [] },
|
|
@@ -4072,6 +4077,15 @@
|
|
|
4072
4077
|
{ "name": "on-text", "values": [] },
|
|
4073
4078
|
{ "name": "off-text", "values": [] },
|
|
4074
4079
|
{ "name": "label", "values": [] },
|
|
4080
|
+
{
|
|
4081
|
+
"name": "description",
|
|
4082
|
+
"description": "The toggle's description, displayed under the label. If you need to display HTML, use the `description` slot instead.",
|
|
4083
|
+
"values": []
|
|
4084
|
+
},
|
|
4085
|
+
{
|
|
4086
|
+
"name": "label-position",
|
|
4087
|
+
"values": [{ "name": "top" }, { "name": "left" }, { "name": "right" }]
|
|
4088
|
+
},
|
|
4075
4089
|
{ "name": "inline", "values": [] }
|
|
4076
4090
|
],
|
|
4077
4091
|
"references": [
|