@kubex/zinc 1.1.134 → 1.1.136
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 +394 -337
- package/dist/vscode.html-custom-data.json +42 -27
- package/dist/web-types.json +91 -61
- package/dist/zn.d.ts +25 -1
- package/dist/zn.min.js +229 -228
- package/package.json +1 -1
- package/src/components/data-select/data-select.component.ts +7 -0
- package/src/components/inline-edit/inline-edit.component.ts +6 -0
- package/src/components/select/select.component.ts +16 -2
- package/src/components/select/select.test.ts +103 -0
- package/src/internal/conditional.ts +53 -35
|
@@ -56,79 +56,6 @@
|
|
|
56
56
|
}
|
|
57
57
|
]
|
|
58
58
|
},
|
|
59
|
-
{
|
|
60
|
-
"kind": "javascript-module",
|
|
61
|
-
"path": "components/action-bar/action-bar.js",
|
|
62
|
-
"declarations": [
|
|
63
|
-
{
|
|
64
|
-
"kind": "class",
|
|
65
|
-
"description": "",
|
|
66
|
-
"name": "ZnActionBar",
|
|
67
|
-
"cssProperties": [
|
|
68
|
-
{
|
|
69
|
-
"description": "An example CSS custom property.",
|
|
70
|
-
"name": "--example"
|
|
71
|
-
}
|
|
72
|
-
],
|
|
73
|
-
"cssParts": [
|
|
74
|
-
{
|
|
75
|
-
"description": "The component's base wrapper.",
|
|
76
|
-
"name": "base"
|
|
77
|
-
}
|
|
78
|
-
],
|
|
79
|
-
"slots": [
|
|
80
|
-
{
|
|
81
|
-
"description": "The default slot.",
|
|
82
|
-
"name": ""
|
|
83
|
-
},
|
|
84
|
-
{
|
|
85
|
-
"description": "An example slot.",
|
|
86
|
-
"name": "example"
|
|
87
|
-
}
|
|
88
|
-
],
|
|
89
|
-
"members": [
|
|
90
|
-
{
|
|
91
|
-
"kind": "field",
|
|
92
|
-
"name": "localize",
|
|
93
|
-
"privacy": "private",
|
|
94
|
-
"readonly": true,
|
|
95
|
-
"default": "new LocalizeController(this)"
|
|
96
|
-
}
|
|
97
|
-
],
|
|
98
|
-
"events": [
|
|
99
|
-
{
|
|
100
|
-
"description": "Emitted as an example.",
|
|
101
|
-
"name": "zn-event-name"
|
|
102
|
-
}
|
|
103
|
-
],
|
|
104
|
-
"superclass": {
|
|
105
|
-
"name": "ZincElement",
|
|
106
|
-
"module": "/src/internal/zinc-element"
|
|
107
|
-
},
|
|
108
|
-
"summary": "Short summary of the component's intended use.",
|
|
109
|
-
"tagNameWithoutPrefix": "action-bar",
|
|
110
|
-
"tagName": "zn-action-bar",
|
|
111
|
-
"customElement": true,
|
|
112
|
-
"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 */",
|
|
113
|
-
"documentation": "https://zinc.style/components/action-bar",
|
|
114
|
-
"status": "experimental",
|
|
115
|
-
"since": "1.0",
|
|
116
|
-
"dependencies": [
|
|
117
|
-
"zn-example"
|
|
118
|
-
]
|
|
119
|
-
}
|
|
120
|
-
],
|
|
121
|
-
"exports": [
|
|
122
|
-
{
|
|
123
|
-
"kind": "js",
|
|
124
|
-
"name": "default",
|
|
125
|
-
"declaration": {
|
|
126
|
-
"name": "ZnActionBar",
|
|
127
|
-
"module": "components/action-bar/action-bar.js"
|
|
128
|
-
}
|
|
129
|
-
}
|
|
130
|
-
]
|
|
131
|
-
},
|
|
132
59
|
{
|
|
133
60
|
"kind": "javascript-module",
|
|
134
61
|
"path": "components/alert/alert.js",
|
|
@@ -323,6 +250,79 @@
|
|
|
323
250
|
}
|
|
324
251
|
]
|
|
325
252
|
},
|
|
253
|
+
{
|
|
254
|
+
"kind": "javascript-module",
|
|
255
|
+
"path": "components/action-bar/action-bar.js",
|
|
256
|
+
"declarations": [
|
|
257
|
+
{
|
|
258
|
+
"kind": "class",
|
|
259
|
+
"description": "",
|
|
260
|
+
"name": "ZnActionBar",
|
|
261
|
+
"cssProperties": [
|
|
262
|
+
{
|
|
263
|
+
"description": "An example CSS custom property.",
|
|
264
|
+
"name": "--example"
|
|
265
|
+
}
|
|
266
|
+
],
|
|
267
|
+
"cssParts": [
|
|
268
|
+
{
|
|
269
|
+
"description": "The component's base wrapper.",
|
|
270
|
+
"name": "base"
|
|
271
|
+
}
|
|
272
|
+
],
|
|
273
|
+
"slots": [
|
|
274
|
+
{
|
|
275
|
+
"description": "The default slot.",
|
|
276
|
+
"name": ""
|
|
277
|
+
},
|
|
278
|
+
{
|
|
279
|
+
"description": "An example slot.",
|
|
280
|
+
"name": "example"
|
|
281
|
+
}
|
|
282
|
+
],
|
|
283
|
+
"members": [
|
|
284
|
+
{
|
|
285
|
+
"kind": "field",
|
|
286
|
+
"name": "localize",
|
|
287
|
+
"privacy": "private",
|
|
288
|
+
"readonly": true,
|
|
289
|
+
"default": "new LocalizeController(this)"
|
|
290
|
+
}
|
|
291
|
+
],
|
|
292
|
+
"events": [
|
|
293
|
+
{
|
|
294
|
+
"description": "Emitted as an example.",
|
|
295
|
+
"name": "zn-event-name"
|
|
296
|
+
}
|
|
297
|
+
],
|
|
298
|
+
"superclass": {
|
|
299
|
+
"name": "ZincElement",
|
|
300
|
+
"module": "/src/internal/zinc-element"
|
|
301
|
+
},
|
|
302
|
+
"summary": "Short summary of the component's intended use.",
|
|
303
|
+
"tagNameWithoutPrefix": "action-bar",
|
|
304
|
+
"tagName": "zn-action-bar",
|
|
305
|
+
"customElement": true,
|
|
306
|
+
"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 */",
|
|
307
|
+
"documentation": "https://zinc.style/components/action-bar",
|
|
308
|
+
"status": "experimental",
|
|
309
|
+
"since": "1.0",
|
|
310
|
+
"dependencies": [
|
|
311
|
+
"zn-example"
|
|
312
|
+
]
|
|
313
|
+
}
|
|
314
|
+
],
|
|
315
|
+
"exports": [
|
|
316
|
+
{
|
|
317
|
+
"kind": "js",
|
|
318
|
+
"name": "default",
|
|
319
|
+
"declaration": {
|
|
320
|
+
"name": "ZnActionBar",
|
|
321
|
+
"module": "components/action-bar/action-bar.js"
|
|
322
|
+
}
|
|
323
|
+
}
|
|
324
|
+
]
|
|
325
|
+
},
|
|
326
326
|
{
|
|
327
327
|
"kind": "javascript-module",
|
|
328
328
|
"path": "components/animated-button/animated-button.js",
|
|
@@ -842,269 +842,6 @@
|
|
|
842
842
|
}
|
|
843
843
|
]
|
|
844
844
|
},
|
|
845
|
-
{
|
|
846
|
-
"kind": "javascript-module",
|
|
847
|
-
"path": "components/background/background.js",
|
|
848
|
-
"declarations": [
|
|
849
|
-
{
|
|
850
|
-
"kind": "class",
|
|
851
|
-
"description": "",
|
|
852
|
-
"name": "ZnBackground",
|
|
853
|
-
"cssProperties": [
|
|
854
|
-
{
|
|
855
|
-
"description": "Fallback colour when the `color` attribute is not set.",
|
|
856
|
-
"name": "--zn-background-color"
|
|
857
|
-
},
|
|
858
|
-
{
|
|
859
|
-
"description": "Position of the background image. Defaults to `center`.",
|
|
860
|
-
"name": "--zn-background-image-position"
|
|
861
|
-
},
|
|
862
|
-
{
|
|
863
|
-
"description": "Direction of the overlay gradient. Defaults to `110deg`.",
|
|
864
|
-
"name": "--zn-background-overlay-angle"
|
|
865
|
-
},
|
|
866
|
-
{
|
|
867
|
-
"description": "Colour of the floating icons. Defaults to `currentColor`.",
|
|
868
|
-
"name": "--zn-background-floating-icon-color"
|
|
869
|
-
}
|
|
870
|
-
],
|
|
871
|
-
"cssParts": [
|
|
872
|
-
{
|
|
873
|
-
"description": "The component's full-size background canvas.",
|
|
874
|
-
"name": "base"
|
|
875
|
-
},
|
|
876
|
-
{
|
|
877
|
-
"description": "The decorative background image.",
|
|
878
|
-
"name": "image"
|
|
879
|
-
},
|
|
880
|
-
{
|
|
881
|
-
"description": "The contrast overlay between the image and content.",
|
|
882
|
-
"name": "overlay"
|
|
883
|
-
},
|
|
884
|
-
{
|
|
885
|
-
"description": "The non-interactive layer containing the floating icons.",
|
|
886
|
-
"name": "floating-icons"
|
|
887
|
-
},
|
|
888
|
-
{
|
|
889
|
-
"description": "Each floating `zn-icon`.",
|
|
890
|
-
"name": "floating-icon"
|
|
891
|
-
},
|
|
892
|
-
{
|
|
893
|
-
"description": "The wrapper around the default slot.",
|
|
894
|
-
"name": "content"
|
|
895
|
-
}
|
|
896
|
-
],
|
|
897
|
-
"slots": [
|
|
898
|
-
{
|
|
899
|
-
"description": "Content displayed above the background layers.",
|
|
900
|
-
"name": ""
|
|
901
|
-
}
|
|
902
|
-
],
|
|
903
|
-
"members": [
|
|
904
|
-
{
|
|
905
|
-
"kind": "field",
|
|
906
|
-
"name": "dependencies",
|
|
907
|
-
"type": {
|
|
908
|
-
"text": "object"
|
|
909
|
-
},
|
|
910
|
-
"static": true,
|
|
911
|
-
"default": "{'zn-icon': ZnIcon}"
|
|
912
|
-
},
|
|
913
|
-
{
|
|
914
|
-
"kind": "field",
|
|
915
|
-
"name": "resizeObserver",
|
|
916
|
-
"privacy": "private",
|
|
917
|
-
"readonly": true,
|
|
918
|
-
"default": "new ResizeController<number>(this, { callback: entries => { const width = entries[0]?.contentRect.width ?? this.offsetWidth; return Math.max(1, Math.min(width * 0.05, 150)); }, })"
|
|
919
|
-
},
|
|
920
|
-
{
|
|
921
|
-
"kind": "field",
|
|
922
|
-
"name": "image",
|
|
923
|
-
"type": {
|
|
924
|
-
"text": "string"
|
|
925
|
-
},
|
|
926
|
-
"default": "''",
|
|
927
|
-
"description": "URL of the decorative background image.",
|
|
928
|
-
"attribute": "image"
|
|
929
|
-
},
|
|
930
|
-
{
|
|
931
|
-
"kind": "field",
|
|
932
|
-
"name": "color",
|
|
933
|
-
"type": {
|
|
934
|
-
"text": "string"
|
|
935
|
-
},
|
|
936
|
-
"default": "''",
|
|
937
|
-
"description": "CSS colour painted beneath the image.",
|
|
938
|
-
"attribute": "color"
|
|
939
|
-
},
|
|
940
|
-
{
|
|
941
|
-
"kind": "field",
|
|
942
|
-
"name": "imageStrength",
|
|
943
|
-
"type": {
|
|
944
|
-
"text": "BackgroundImageStrength"
|
|
945
|
-
},
|
|
946
|
-
"default": "'full'",
|
|
947
|
-
"description": "Visibility of the image: `soft` (30%), `medium` (62%) or `full` (100%).",
|
|
948
|
-
"attribute": "image-strength",
|
|
949
|
-
"reflects": true
|
|
950
|
-
},
|
|
951
|
-
{
|
|
952
|
-
"kind": "field",
|
|
953
|
-
"name": "motion",
|
|
954
|
-
"type": {
|
|
955
|
-
"text": "BackgroundMotion"
|
|
956
|
-
},
|
|
957
|
-
"default": "'none'",
|
|
958
|
-
"description": "Subtle animation applied to the image. Motion stops when reduced motion is requested.",
|
|
959
|
-
"attribute": "motion",
|
|
960
|
-
"reflects": true
|
|
961
|
-
},
|
|
962
|
-
{
|
|
963
|
-
"kind": "field",
|
|
964
|
-
"name": "overlay",
|
|
965
|
-
"type": {
|
|
966
|
-
"text": "BackgroundOverlay"
|
|
967
|
-
},
|
|
968
|
-
"default": "'soft'",
|
|
969
|
-
"description": "Strength of the contrast gradient above the image.",
|
|
970
|
-
"attribute": "overlay",
|
|
971
|
-
"reflects": true
|
|
972
|
-
},
|
|
973
|
-
{
|
|
974
|
-
"kind": "field",
|
|
975
|
-
"name": "overlayTone",
|
|
976
|
-
"type": {
|
|
977
|
-
"text": "BackgroundOverlayTone"
|
|
978
|
-
},
|
|
979
|
-
"default": "'light'",
|
|
980
|
-
"description": "Whether the overlay uses a light or dark contrast treatment.",
|
|
981
|
-
"attribute": "overlay-tone",
|
|
982
|
-
"reflects": true
|
|
983
|
-
},
|
|
984
|
-
{
|
|
985
|
-
"kind": "field",
|
|
986
|
-
"name": "floatingIcons",
|
|
987
|
-
"type": {
|
|
988
|
-
"text": "string"
|
|
989
|
-
},
|
|
990
|
-
"default": "''",
|
|
991
|
-
"description": "Comma-separated Zinc icon names placed as ambient decoration. At most eight are rendered.",
|
|
992
|
-
"attribute": "floating-icons"
|
|
993
|
-
},
|
|
994
|
-
{
|
|
995
|
-
"kind": "field",
|
|
996
|
-
"name": "paused",
|
|
997
|
-
"type": {
|
|
998
|
-
"text": "boolean"
|
|
999
|
-
},
|
|
1000
|
-
"default": "false",
|
|
1001
|
-
"description": "Pauses background motion without changing the selected motion treatment.",
|
|
1002
|
-
"attribute": "paused",
|
|
1003
|
-
"reflects": true
|
|
1004
|
-
}
|
|
1005
|
-
],
|
|
1006
|
-
"attributes": [
|
|
1007
|
-
{
|
|
1008
|
-
"name": "image",
|
|
1009
|
-
"type": {
|
|
1010
|
-
"text": "string"
|
|
1011
|
-
},
|
|
1012
|
-
"default": "''",
|
|
1013
|
-
"description": "URL of the decorative background image.",
|
|
1014
|
-
"fieldName": "image"
|
|
1015
|
-
},
|
|
1016
|
-
{
|
|
1017
|
-
"name": "color",
|
|
1018
|
-
"type": {
|
|
1019
|
-
"text": "string"
|
|
1020
|
-
},
|
|
1021
|
-
"default": "''",
|
|
1022
|
-
"description": "CSS colour painted beneath the image.",
|
|
1023
|
-
"fieldName": "color"
|
|
1024
|
-
},
|
|
1025
|
-
{
|
|
1026
|
-
"name": "image-strength",
|
|
1027
|
-
"type": {
|
|
1028
|
-
"text": "BackgroundImageStrength"
|
|
1029
|
-
},
|
|
1030
|
-
"default": "'full'",
|
|
1031
|
-
"description": "Visibility of the image: `soft` (30%), `medium` (62%) or `full` (100%).",
|
|
1032
|
-
"fieldName": "imageStrength"
|
|
1033
|
-
},
|
|
1034
|
-
{
|
|
1035
|
-
"name": "motion",
|
|
1036
|
-
"type": {
|
|
1037
|
-
"text": "BackgroundMotion"
|
|
1038
|
-
},
|
|
1039
|
-
"default": "'none'",
|
|
1040
|
-
"description": "Subtle animation applied to the image. Motion stops when reduced motion is requested.",
|
|
1041
|
-
"fieldName": "motion"
|
|
1042
|
-
},
|
|
1043
|
-
{
|
|
1044
|
-
"name": "overlay",
|
|
1045
|
-
"type": {
|
|
1046
|
-
"text": "BackgroundOverlay"
|
|
1047
|
-
},
|
|
1048
|
-
"default": "'soft'",
|
|
1049
|
-
"description": "Strength of the contrast gradient above the image.",
|
|
1050
|
-
"fieldName": "overlay"
|
|
1051
|
-
},
|
|
1052
|
-
{
|
|
1053
|
-
"name": "overlay-tone",
|
|
1054
|
-
"type": {
|
|
1055
|
-
"text": "BackgroundOverlayTone"
|
|
1056
|
-
},
|
|
1057
|
-
"default": "'light'",
|
|
1058
|
-
"description": "Whether the overlay uses a light or dark contrast treatment.",
|
|
1059
|
-
"fieldName": "overlayTone"
|
|
1060
|
-
},
|
|
1061
|
-
{
|
|
1062
|
-
"name": "floating-icons",
|
|
1063
|
-
"type": {
|
|
1064
|
-
"text": "string"
|
|
1065
|
-
},
|
|
1066
|
-
"default": "''",
|
|
1067
|
-
"description": "Comma-separated Zinc icon names placed as ambient decoration. At most eight are rendered.",
|
|
1068
|
-
"fieldName": "floatingIcons"
|
|
1069
|
-
},
|
|
1070
|
-
{
|
|
1071
|
-
"name": "paused",
|
|
1072
|
-
"type": {
|
|
1073
|
-
"text": "boolean"
|
|
1074
|
-
},
|
|
1075
|
-
"default": "false",
|
|
1076
|
-
"description": "Pauses background motion without changing the selected motion treatment.",
|
|
1077
|
-
"fieldName": "paused"
|
|
1078
|
-
}
|
|
1079
|
-
],
|
|
1080
|
-
"superclass": {
|
|
1081
|
-
"name": "ZincElement",
|
|
1082
|
-
"module": "/src/internal/zinc-element"
|
|
1083
|
-
},
|
|
1084
|
-
"summary": "Composes a colour, decorative image, image strength, optional motion and contrast overlay behind slotted content.",
|
|
1085
|
-
"tagNameWithoutPrefix": "background",
|
|
1086
|
-
"tagName": "zn-background",
|
|
1087
|
-
"customElement": true,
|
|
1088
|
-
"jsDoc": "/**\n * @summary Composes a colour, decorative image, image strength, optional motion and contrast overlay behind slotted content.\n *\n * @documentation https://zinc.style/components/background\n * @status experimental\n * @since 1.0\n *\n * @dependency zn-icon\n *\n * @slot - Content displayed above the background layers.\n *\n * @csspart base - The component's full-size background canvas.\n * @csspart image - The decorative background image.\n * @csspart overlay - The contrast overlay between the image and content.\n * @csspart floating-icons - The non-interactive layer containing the floating icons.\n * @csspart floating-icon - Each floating `zn-icon`.\n * @csspart content - The wrapper around the default slot.\n *\n * @cssproperty --zn-background-color - Fallback colour when the `color` attribute is not set.\n * @cssproperty --zn-background-image-position - Position of the background image. Defaults to `center`.\n * @cssproperty --zn-background-overlay-angle - Direction of the overlay gradient. Defaults to `110deg`.\n * @cssproperty --zn-background-floating-icon-color - Colour of the floating icons. Defaults to `currentColor`.\n */",
|
|
1089
|
-
"documentation": "https://zinc.style/components/background",
|
|
1090
|
-
"status": "experimental",
|
|
1091
|
-
"since": "1.0",
|
|
1092
|
-
"dependencies": [
|
|
1093
|
-
"zn-icon"
|
|
1094
|
-
]
|
|
1095
|
-
}
|
|
1096
|
-
],
|
|
1097
|
-
"exports": [
|
|
1098
|
-
{
|
|
1099
|
-
"kind": "js",
|
|
1100
|
-
"name": "default",
|
|
1101
|
-
"declaration": {
|
|
1102
|
-
"name": "ZnBackground",
|
|
1103
|
-
"module": "components/background/background.js"
|
|
1104
|
-
}
|
|
1105
|
-
}
|
|
1106
|
-
]
|
|
1107
|
-
},
|
|
1108
845
|
{
|
|
1109
846
|
"kind": "javascript-module",
|
|
1110
847
|
"path": "components/bulk-actions/bulk-actions.js",
|
|
@@ -1462,6 +1199,269 @@
|
|
|
1462
1199
|
}
|
|
1463
1200
|
]
|
|
1464
1201
|
},
|
|
1202
|
+
{
|
|
1203
|
+
"kind": "javascript-module",
|
|
1204
|
+
"path": "components/background/background.js",
|
|
1205
|
+
"declarations": [
|
|
1206
|
+
{
|
|
1207
|
+
"kind": "class",
|
|
1208
|
+
"description": "",
|
|
1209
|
+
"name": "ZnBackground",
|
|
1210
|
+
"cssProperties": [
|
|
1211
|
+
{
|
|
1212
|
+
"description": "Fallback colour when the `color` attribute is not set.",
|
|
1213
|
+
"name": "--zn-background-color"
|
|
1214
|
+
},
|
|
1215
|
+
{
|
|
1216
|
+
"description": "Position of the background image. Defaults to `center`.",
|
|
1217
|
+
"name": "--zn-background-image-position"
|
|
1218
|
+
},
|
|
1219
|
+
{
|
|
1220
|
+
"description": "Direction of the overlay gradient. Defaults to `110deg`.",
|
|
1221
|
+
"name": "--zn-background-overlay-angle"
|
|
1222
|
+
},
|
|
1223
|
+
{
|
|
1224
|
+
"description": "Colour of the floating icons. Defaults to `currentColor`.",
|
|
1225
|
+
"name": "--zn-background-floating-icon-color"
|
|
1226
|
+
}
|
|
1227
|
+
],
|
|
1228
|
+
"cssParts": [
|
|
1229
|
+
{
|
|
1230
|
+
"description": "The component's full-size background canvas.",
|
|
1231
|
+
"name": "base"
|
|
1232
|
+
},
|
|
1233
|
+
{
|
|
1234
|
+
"description": "The decorative background image.",
|
|
1235
|
+
"name": "image"
|
|
1236
|
+
},
|
|
1237
|
+
{
|
|
1238
|
+
"description": "The contrast overlay between the image and content.",
|
|
1239
|
+
"name": "overlay"
|
|
1240
|
+
},
|
|
1241
|
+
{
|
|
1242
|
+
"description": "The non-interactive layer containing the floating icons.",
|
|
1243
|
+
"name": "floating-icons"
|
|
1244
|
+
},
|
|
1245
|
+
{
|
|
1246
|
+
"description": "Each floating `zn-icon`.",
|
|
1247
|
+
"name": "floating-icon"
|
|
1248
|
+
},
|
|
1249
|
+
{
|
|
1250
|
+
"description": "The wrapper around the default slot.",
|
|
1251
|
+
"name": "content"
|
|
1252
|
+
}
|
|
1253
|
+
],
|
|
1254
|
+
"slots": [
|
|
1255
|
+
{
|
|
1256
|
+
"description": "Content displayed above the background layers.",
|
|
1257
|
+
"name": ""
|
|
1258
|
+
}
|
|
1259
|
+
],
|
|
1260
|
+
"members": [
|
|
1261
|
+
{
|
|
1262
|
+
"kind": "field",
|
|
1263
|
+
"name": "dependencies",
|
|
1264
|
+
"type": {
|
|
1265
|
+
"text": "object"
|
|
1266
|
+
},
|
|
1267
|
+
"static": true,
|
|
1268
|
+
"default": "{'zn-icon': ZnIcon}"
|
|
1269
|
+
},
|
|
1270
|
+
{
|
|
1271
|
+
"kind": "field",
|
|
1272
|
+
"name": "resizeObserver",
|
|
1273
|
+
"privacy": "private",
|
|
1274
|
+
"readonly": true,
|
|
1275
|
+
"default": "new ResizeController<number>(this, { callback: entries => { const width = entries[0]?.contentRect.width ?? this.offsetWidth; return Math.max(1, Math.min(width * 0.05, 150)); }, })"
|
|
1276
|
+
},
|
|
1277
|
+
{
|
|
1278
|
+
"kind": "field",
|
|
1279
|
+
"name": "image",
|
|
1280
|
+
"type": {
|
|
1281
|
+
"text": "string"
|
|
1282
|
+
},
|
|
1283
|
+
"default": "''",
|
|
1284
|
+
"description": "URL of the decorative background image.",
|
|
1285
|
+
"attribute": "image"
|
|
1286
|
+
},
|
|
1287
|
+
{
|
|
1288
|
+
"kind": "field",
|
|
1289
|
+
"name": "color",
|
|
1290
|
+
"type": {
|
|
1291
|
+
"text": "string"
|
|
1292
|
+
},
|
|
1293
|
+
"default": "''",
|
|
1294
|
+
"description": "CSS colour painted beneath the image.",
|
|
1295
|
+
"attribute": "color"
|
|
1296
|
+
},
|
|
1297
|
+
{
|
|
1298
|
+
"kind": "field",
|
|
1299
|
+
"name": "imageStrength",
|
|
1300
|
+
"type": {
|
|
1301
|
+
"text": "BackgroundImageStrength"
|
|
1302
|
+
},
|
|
1303
|
+
"default": "'full'",
|
|
1304
|
+
"description": "Visibility of the image: `soft` (30%), `medium` (62%) or `full` (100%).",
|
|
1305
|
+
"attribute": "image-strength",
|
|
1306
|
+
"reflects": true
|
|
1307
|
+
},
|
|
1308
|
+
{
|
|
1309
|
+
"kind": "field",
|
|
1310
|
+
"name": "motion",
|
|
1311
|
+
"type": {
|
|
1312
|
+
"text": "BackgroundMotion"
|
|
1313
|
+
},
|
|
1314
|
+
"default": "'none'",
|
|
1315
|
+
"description": "Subtle animation applied to the image. Motion stops when reduced motion is requested.",
|
|
1316
|
+
"attribute": "motion",
|
|
1317
|
+
"reflects": true
|
|
1318
|
+
},
|
|
1319
|
+
{
|
|
1320
|
+
"kind": "field",
|
|
1321
|
+
"name": "overlay",
|
|
1322
|
+
"type": {
|
|
1323
|
+
"text": "BackgroundOverlay"
|
|
1324
|
+
},
|
|
1325
|
+
"default": "'soft'",
|
|
1326
|
+
"description": "Strength of the contrast gradient above the image.",
|
|
1327
|
+
"attribute": "overlay",
|
|
1328
|
+
"reflects": true
|
|
1329
|
+
},
|
|
1330
|
+
{
|
|
1331
|
+
"kind": "field",
|
|
1332
|
+
"name": "overlayTone",
|
|
1333
|
+
"type": {
|
|
1334
|
+
"text": "BackgroundOverlayTone"
|
|
1335
|
+
},
|
|
1336
|
+
"default": "'light'",
|
|
1337
|
+
"description": "Whether the overlay uses a light or dark contrast treatment.",
|
|
1338
|
+
"attribute": "overlay-tone",
|
|
1339
|
+
"reflects": true
|
|
1340
|
+
},
|
|
1341
|
+
{
|
|
1342
|
+
"kind": "field",
|
|
1343
|
+
"name": "floatingIcons",
|
|
1344
|
+
"type": {
|
|
1345
|
+
"text": "string"
|
|
1346
|
+
},
|
|
1347
|
+
"default": "''",
|
|
1348
|
+
"description": "Comma-separated Zinc icon names placed as ambient decoration. At most eight are rendered.",
|
|
1349
|
+
"attribute": "floating-icons"
|
|
1350
|
+
},
|
|
1351
|
+
{
|
|
1352
|
+
"kind": "field",
|
|
1353
|
+
"name": "paused",
|
|
1354
|
+
"type": {
|
|
1355
|
+
"text": "boolean"
|
|
1356
|
+
},
|
|
1357
|
+
"default": "false",
|
|
1358
|
+
"description": "Pauses background motion without changing the selected motion treatment.",
|
|
1359
|
+
"attribute": "paused",
|
|
1360
|
+
"reflects": true
|
|
1361
|
+
}
|
|
1362
|
+
],
|
|
1363
|
+
"attributes": [
|
|
1364
|
+
{
|
|
1365
|
+
"name": "image",
|
|
1366
|
+
"type": {
|
|
1367
|
+
"text": "string"
|
|
1368
|
+
},
|
|
1369
|
+
"default": "''",
|
|
1370
|
+
"description": "URL of the decorative background image.",
|
|
1371
|
+
"fieldName": "image"
|
|
1372
|
+
},
|
|
1373
|
+
{
|
|
1374
|
+
"name": "color",
|
|
1375
|
+
"type": {
|
|
1376
|
+
"text": "string"
|
|
1377
|
+
},
|
|
1378
|
+
"default": "''",
|
|
1379
|
+
"description": "CSS colour painted beneath the image.",
|
|
1380
|
+
"fieldName": "color"
|
|
1381
|
+
},
|
|
1382
|
+
{
|
|
1383
|
+
"name": "image-strength",
|
|
1384
|
+
"type": {
|
|
1385
|
+
"text": "BackgroundImageStrength"
|
|
1386
|
+
},
|
|
1387
|
+
"default": "'full'",
|
|
1388
|
+
"description": "Visibility of the image: `soft` (30%), `medium` (62%) or `full` (100%).",
|
|
1389
|
+
"fieldName": "imageStrength"
|
|
1390
|
+
},
|
|
1391
|
+
{
|
|
1392
|
+
"name": "motion",
|
|
1393
|
+
"type": {
|
|
1394
|
+
"text": "BackgroundMotion"
|
|
1395
|
+
},
|
|
1396
|
+
"default": "'none'",
|
|
1397
|
+
"description": "Subtle animation applied to the image. Motion stops when reduced motion is requested.",
|
|
1398
|
+
"fieldName": "motion"
|
|
1399
|
+
},
|
|
1400
|
+
{
|
|
1401
|
+
"name": "overlay",
|
|
1402
|
+
"type": {
|
|
1403
|
+
"text": "BackgroundOverlay"
|
|
1404
|
+
},
|
|
1405
|
+
"default": "'soft'",
|
|
1406
|
+
"description": "Strength of the contrast gradient above the image.",
|
|
1407
|
+
"fieldName": "overlay"
|
|
1408
|
+
},
|
|
1409
|
+
{
|
|
1410
|
+
"name": "overlay-tone",
|
|
1411
|
+
"type": {
|
|
1412
|
+
"text": "BackgroundOverlayTone"
|
|
1413
|
+
},
|
|
1414
|
+
"default": "'light'",
|
|
1415
|
+
"description": "Whether the overlay uses a light or dark contrast treatment.",
|
|
1416
|
+
"fieldName": "overlayTone"
|
|
1417
|
+
},
|
|
1418
|
+
{
|
|
1419
|
+
"name": "floating-icons",
|
|
1420
|
+
"type": {
|
|
1421
|
+
"text": "string"
|
|
1422
|
+
},
|
|
1423
|
+
"default": "''",
|
|
1424
|
+
"description": "Comma-separated Zinc icon names placed as ambient decoration. At most eight are rendered.",
|
|
1425
|
+
"fieldName": "floatingIcons"
|
|
1426
|
+
},
|
|
1427
|
+
{
|
|
1428
|
+
"name": "paused",
|
|
1429
|
+
"type": {
|
|
1430
|
+
"text": "boolean"
|
|
1431
|
+
},
|
|
1432
|
+
"default": "false",
|
|
1433
|
+
"description": "Pauses background motion without changing the selected motion treatment.",
|
|
1434
|
+
"fieldName": "paused"
|
|
1435
|
+
}
|
|
1436
|
+
],
|
|
1437
|
+
"superclass": {
|
|
1438
|
+
"name": "ZincElement",
|
|
1439
|
+
"module": "/src/internal/zinc-element"
|
|
1440
|
+
},
|
|
1441
|
+
"summary": "Composes a colour, decorative image, image strength, optional motion and contrast overlay behind slotted content.",
|
|
1442
|
+
"tagNameWithoutPrefix": "background",
|
|
1443
|
+
"tagName": "zn-background",
|
|
1444
|
+
"customElement": true,
|
|
1445
|
+
"jsDoc": "/**\n * @summary Composes a colour, decorative image, image strength, optional motion and contrast overlay behind slotted content.\n *\n * @documentation https://zinc.style/components/background\n * @status experimental\n * @since 1.0\n *\n * @dependency zn-icon\n *\n * @slot - Content displayed above the background layers.\n *\n * @csspart base - The component's full-size background canvas.\n * @csspart image - The decorative background image.\n * @csspart overlay - The contrast overlay between the image and content.\n * @csspart floating-icons - The non-interactive layer containing the floating icons.\n * @csspart floating-icon - Each floating `zn-icon`.\n * @csspart content - The wrapper around the default slot.\n *\n * @cssproperty --zn-background-color - Fallback colour when the `color` attribute is not set.\n * @cssproperty --zn-background-image-position - Position of the background image. Defaults to `center`.\n * @cssproperty --zn-background-overlay-angle - Direction of the overlay gradient. Defaults to `110deg`.\n * @cssproperty --zn-background-floating-icon-color - Colour of the floating icons. Defaults to `currentColor`.\n */",
|
|
1446
|
+
"documentation": "https://zinc.style/components/background",
|
|
1447
|
+
"status": "experimental",
|
|
1448
|
+
"since": "1.0",
|
|
1449
|
+
"dependencies": [
|
|
1450
|
+
"zn-icon"
|
|
1451
|
+
]
|
|
1452
|
+
}
|
|
1453
|
+
],
|
|
1454
|
+
"exports": [
|
|
1455
|
+
{
|
|
1456
|
+
"kind": "js",
|
|
1457
|
+
"name": "default",
|
|
1458
|
+
"declaration": {
|
|
1459
|
+
"name": "ZnBackground",
|
|
1460
|
+
"module": "components/background/background.js"
|
|
1461
|
+
}
|
|
1462
|
+
}
|
|
1463
|
+
]
|
|
1464
|
+
},
|
|
1465
1465
|
{
|
|
1466
1466
|
"kind": "javascript-module",
|
|
1467
1467
|
"path": "components/button/button.js",
|
|
@@ -8182,6 +8182,16 @@
|
|
|
8182
8182
|
"default": "\"\"",
|
|
8183
8183
|
"attribute": "conditional"
|
|
8184
8184
|
},
|
|
8185
|
+
{
|
|
8186
|
+
"kind": "field",
|
|
8187
|
+
"name": "requires",
|
|
8188
|
+
"type": {
|
|
8189
|
+
"text": "string"
|
|
8190
|
+
},
|
|
8191
|
+
"default": "\"\"",
|
|
8192
|
+
"description": "Ids or names of controls that must have a value before this one becomes\nusable, comma separated. Forwarded to the underlying select.",
|
|
8193
|
+
"attribute": "requires"
|
|
8194
|
+
},
|
|
8185
8195
|
{
|
|
8186
8196
|
"kind": "field",
|
|
8187
8197
|
"name": "formControlController",
|
|
@@ -8523,6 +8533,15 @@
|
|
|
8523
8533
|
},
|
|
8524
8534
|
"default": "\"\"",
|
|
8525
8535
|
"fieldName": "conditional"
|
|
8536
|
+
},
|
|
8537
|
+
{
|
|
8538
|
+
"name": "requires",
|
|
8539
|
+
"type": {
|
|
8540
|
+
"text": "string"
|
|
8541
|
+
},
|
|
8542
|
+
"default": "\"\"",
|
|
8543
|
+
"description": "Ids or names of controls that must have a value before this one becomes\nusable, comma separated. Forwarded to the underlying select.",
|
|
8544
|
+
"fieldName": "requires"
|
|
8526
8545
|
}
|
|
8527
8546
|
],
|
|
8528
8547
|
"superclass": {
|
|
@@ -19782,6 +19801,16 @@
|
|
|
19782
19801
|
"default": "''",
|
|
19783
19802
|
"attribute": "conditional"
|
|
19784
19803
|
},
|
|
19804
|
+
{
|
|
19805
|
+
"kind": "field",
|
|
19806
|
+
"name": "requires",
|
|
19807
|
+
"type": {
|
|
19808
|
+
"text": "string"
|
|
19809
|
+
},
|
|
19810
|
+
"default": "''",
|
|
19811
|
+
"description": "Ids or names of controls that must have a value before this one becomes\nusable, comma separated.",
|
|
19812
|
+
"attribute": "requires"
|
|
19813
|
+
},
|
|
19785
19814
|
{
|
|
19786
19815
|
"kind": "field",
|
|
19787
19816
|
"name": "disabled",
|
|
@@ -20325,6 +20354,15 @@
|
|
|
20325
20354
|
"default": "''",
|
|
20326
20355
|
"fieldName": "conditional"
|
|
20327
20356
|
},
|
|
20357
|
+
{
|
|
20358
|
+
"name": "requires",
|
|
20359
|
+
"type": {
|
|
20360
|
+
"text": "string"
|
|
20361
|
+
},
|
|
20362
|
+
"default": "''",
|
|
20363
|
+
"description": "Ids or names of controls that must have a value before this one becomes\nusable, comma separated.",
|
|
20364
|
+
"fieldName": "requires"
|
|
20365
|
+
},
|
|
20328
20366
|
{
|
|
20329
20367
|
"name": "disabled",
|
|
20330
20368
|
"type": {
|
|
@@ -40205,6 +40243,16 @@
|
|
|
40205
40243
|
"default": "\"\"",
|
|
40206
40244
|
"attribute": "conditional"
|
|
40207
40245
|
},
|
|
40246
|
+
{
|
|
40247
|
+
"kind": "field",
|
|
40248
|
+
"name": "requires",
|
|
40249
|
+
"type": {
|
|
40250
|
+
"text": "string"
|
|
40251
|
+
},
|
|
40252
|
+
"default": "\"\"",
|
|
40253
|
+
"description": "Ids or names of controls that must have a value before this one becomes\nusable, comma separated. The control stays disabled until every one of them\nis filled, and is disabled again if any is cleared.",
|
|
40254
|
+
"attribute": "requires"
|
|
40255
|
+
},
|
|
40208
40256
|
{
|
|
40209
40257
|
"kind": "field",
|
|
40210
40258
|
"name": "dataUri",
|
|
@@ -41129,6 +41177,15 @@
|
|
|
41129
41177
|
"default": "\"\"",
|
|
41130
41178
|
"fieldName": "conditional"
|
|
41131
41179
|
},
|
|
41180
|
+
{
|
|
41181
|
+
"name": "requires",
|
|
41182
|
+
"type": {
|
|
41183
|
+
"text": "string"
|
|
41184
|
+
},
|
|
41185
|
+
"default": "\"\"",
|
|
41186
|
+
"description": "Ids or names of controls that must have a value before this one becomes\nusable, comma separated. The control stays disabled until every one of them\nis filled, and is disabled again if any is cleared.",
|
|
41187
|
+
"fieldName": "requires"
|
|
41188
|
+
},
|
|
41132
41189
|
{
|
|
41133
41190
|
"name": "data-uri",
|
|
41134
41191
|
"type": {
|
|
@@ -52948,7 +53005,7 @@
|
|
|
52948
53005
|
"package": {
|
|
52949
53006
|
"name": "@kubex/zinc",
|
|
52950
53007
|
"description": "A collection of web components for building web applications based off of @shoelace-style/Shoelace",
|
|
52951
|
-
"version": "1.1.
|
|
53008
|
+
"version": "1.1.136",
|
|
52952
53009
|
"author": "",
|
|
52953
53010
|
"license": "MIT"
|
|
52954
53011
|
}
|