@rettangoli/ui 1.0.10 → 1.0.11
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/rettangoli-iife-layout.min.js +254 -59
- package/dist/rettangoli-iife-ui.min.js +268 -73
- package/package.json +2 -2
- package/src/common/carousel.js +155 -0
- package/src/entry-iife-layout.js +2 -0
- package/src/entry-iife-ui.js +2 -0
- package/src/index.js +2 -0
- package/src/primitives/carousel.js +978 -0
- package/src/primitives/view.js +57 -0
package/src/primitives/view.js
CHANGED
|
@@ -28,6 +28,15 @@ const normalizeRawCssValue = (value) => {
|
|
|
28
28
|
return normalizedValue.length > 0 ? normalizedValue : null;
|
|
29
29
|
};
|
|
30
30
|
|
|
31
|
+
const normalizeDimensionOrRawCssValue = (value) => {
|
|
32
|
+
const normalizedValue = normalizeRawCssValue(value);
|
|
33
|
+
if (normalizedValue === null) {
|
|
34
|
+
return null;
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
return dimensionWithUnit(normalizedValue);
|
|
38
|
+
};
|
|
39
|
+
|
|
31
40
|
// Internal implementation without uhtml
|
|
32
41
|
class RettangoliViewElement extends HTMLElement {
|
|
33
42
|
static styleSheet = null;
|
|
@@ -93,6 +102,12 @@ class RettangoliViewElement extends HTMLElement {
|
|
|
93
102
|
"bgs",
|
|
94
103
|
"bgp",
|
|
95
104
|
"bgr",
|
|
105
|
+
"sst",
|
|
106
|
+
"sna",
|
|
107
|
+
"sns",
|
|
108
|
+
"sbh",
|
|
109
|
+
"spi",
|
|
110
|
+
"stg",
|
|
96
111
|
"hide",
|
|
97
112
|
"show",
|
|
98
113
|
"sh",
|
|
@@ -166,6 +181,24 @@ class RettangoliViewElement extends HTMLElement {
|
|
|
166
181
|
const backgroundRepeat = normalizeRawCssValue(
|
|
167
182
|
this.getAttribute(addSizePrefix("bgr")),
|
|
168
183
|
);
|
|
184
|
+
const scrollSnapType = normalizeRawCssValue(
|
|
185
|
+
this.getAttribute(addSizePrefix("sst")),
|
|
186
|
+
);
|
|
187
|
+
const scrollSnapAlign = normalizeRawCssValue(
|
|
188
|
+
this.getAttribute(addSizePrefix("sna")),
|
|
189
|
+
);
|
|
190
|
+
const scrollSnapStop = normalizeRawCssValue(
|
|
191
|
+
this.getAttribute(addSizePrefix("sns")),
|
|
192
|
+
);
|
|
193
|
+
const scrollBehavior = normalizeRawCssValue(
|
|
194
|
+
this.getAttribute(addSizePrefix("sbh")),
|
|
195
|
+
);
|
|
196
|
+
const scrollPaddingInline = normalizeDimensionOrRawCssValue(
|
|
197
|
+
this.getAttribute(addSizePrefix("spi")),
|
|
198
|
+
);
|
|
199
|
+
const scrollTargetGroup = normalizeRawCssValue(
|
|
200
|
+
this.getAttribute(addSizePrefix("stg")),
|
|
201
|
+
);
|
|
169
202
|
|
|
170
203
|
if (zIndex !== null) {
|
|
171
204
|
this._styles[size]["z-index"] = zIndex;
|
|
@@ -195,6 +228,30 @@ class RettangoliViewElement extends HTMLElement {
|
|
|
195
228
|
this._styles[size]["background-repeat"] = backgroundRepeat;
|
|
196
229
|
}
|
|
197
230
|
|
|
231
|
+
if (scrollSnapType !== null) {
|
|
232
|
+
this._styles[size]["scroll-snap-type"] = scrollSnapType;
|
|
233
|
+
}
|
|
234
|
+
|
|
235
|
+
if (scrollSnapAlign !== null) {
|
|
236
|
+
this._styles[size]["scroll-snap-align"] = scrollSnapAlign;
|
|
237
|
+
}
|
|
238
|
+
|
|
239
|
+
if (scrollSnapStop !== null) {
|
|
240
|
+
this._styles[size]["scroll-snap-stop"] = scrollSnapStop;
|
|
241
|
+
}
|
|
242
|
+
|
|
243
|
+
if (scrollBehavior !== null) {
|
|
244
|
+
this._styles[size]["scroll-behavior"] = scrollBehavior;
|
|
245
|
+
}
|
|
246
|
+
|
|
247
|
+
if (scrollPaddingInline !== null) {
|
|
248
|
+
this._styles[size]["scroll-padding-inline"] = scrollPaddingInline;
|
|
249
|
+
}
|
|
250
|
+
|
|
251
|
+
if (scrollTargetGroup !== null) {
|
|
252
|
+
this._styles[size]["scroll-target-group"] = scrollTargetGroup;
|
|
253
|
+
}
|
|
254
|
+
|
|
198
255
|
applyDimensionToStyleBucket({
|
|
199
256
|
styleBucket: this._styles[size],
|
|
200
257
|
axis: "width",
|