@cntrl-site/components 0.1.0-alpha.17 → 0.1.0-alpha.18
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/Components/ControlSlider/ControlSliderComponent.d.ts +38 -0
- package/dist/Components/Lightbox/Lightbox.d.ts +1 -1
- package/dist/Components/utils/getPositionStyles.d.ts +1 -1
- package/dist/components.css +1 -1
- package/dist/index.js +171 -65
- package/dist/index.mjs +171 -65
- package/package.json +1 -1
|
@@ -113,15 +113,28 @@ export declare const ControlSliderComponent: {
|
|
|
113
113
|
};
|
|
114
114
|
offset: {
|
|
115
115
|
type: string;
|
|
116
|
+
title: string;
|
|
116
117
|
display: {
|
|
117
118
|
type: string;
|
|
118
119
|
};
|
|
119
120
|
properties: {
|
|
120
121
|
x: {
|
|
121
122
|
type: string;
|
|
123
|
+
label: string;
|
|
124
|
+
scalingEnabled: boolean;
|
|
125
|
+
display: {
|
|
126
|
+
type: string;
|
|
127
|
+
visible: boolean;
|
|
128
|
+
};
|
|
122
129
|
};
|
|
123
130
|
y: {
|
|
124
131
|
type: string;
|
|
132
|
+
label: string;
|
|
133
|
+
scalingEnabled: boolean;
|
|
134
|
+
display: {
|
|
135
|
+
type: string;
|
|
136
|
+
visible: boolean;
|
|
137
|
+
};
|
|
125
138
|
};
|
|
126
139
|
};
|
|
127
140
|
};
|
|
@@ -174,15 +187,28 @@ export declare const ControlSliderComponent: {
|
|
|
174
187
|
};
|
|
175
188
|
offset: {
|
|
176
189
|
type: string;
|
|
190
|
+
title: string;
|
|
177
191
|
display: {
|
|
178
192
|
type: string;
|
|
179
193
|
};
|
|
180
194
|
properties: {
|
|
181
195
|
x: {
|
|
182
196
|
type: string;
|
|
197
|
+
label: string;
|
|
198
|
+
scalingEnabled: boolean;
|
|
199
|
+
display: {
|
|
200
|
+
type: string;
|
|
201
|
+
visible: boolean;
|
|
202
|
+
};
|
|
183
203
|
};
|
|
184
204
|
y: {
|
|
185
205
|
type: string;
|
|
206
|
+
label: string;
|
|
207
|
+
scalingEnabled: boolean;
|
|
208
|
+
display: {
|
|
209
|
+
type: string;
|
|
210
|
+
visible: boolean;
|
|
211
|
+
};
|
|
186
212
|
};
|
|
187
213
|
};
|
|
188
214
|
};
|
|
@@ -243,9 +269,21 @@ export declare const ControlSliderComponent: {
|
|
|
243
269
|
properties: {
|
|
244
270
|
x: {
|
|
245
271
|
type: string;
|
|
272
|
+
label: string;
|
|
273
|
+
scalingEnabled: boolean;
|
|
274
|
+
display: {
|
|
275
|
+
type: string;
|
|
276
|
+
visible: boolean;
|
|
277
|
+
};
|
|
246
278
|
};
|
|
247
279
|
y: {
|
|
248
280
|
type: string;
|
|
281
|
+
label: string;
|
|
282
|
+
scalingEnabled: boolean;
|
|
283
|
+
display: {
|
|
284
|
+
type: string;
|
|
285
|
+
visible: boolean;
|
|
286
|
+
};
|
|
249
287
|
};
|
|
250
288
|
};
|
|
251
289
|
};
|
|
@@ -39,7 +39,6 @@ type Padding = {
|
|
|
39
39
|
type Triggers = {
|
|
40
40
|
type: 'click' | 'drag';
|
|
41
41
|
switch: 'image' | '50/50';
|
|
42
|
-
duration: string;
|
|
43
42
|
};
|
|
44
43
|
type LightboxSettings = {
|
|
45
44
|
thumbnailBlock: {
|
|
@@ -58,6 +57,7 @@ type LightboxSettings = {
|
|
|
58
57
|
slider: {
|
|
59
58
|
type: 'slide' | 'fade' | 'scale';
|
|
60
59
|
direction: 'horiz' | 'vert';
|
|
60
|
+
duration: string;
|
|
61
61
|
};
|
|
62
62
|
thumbnail: {
|
|
63
63
|
isActive: boolean;
|
package/dist/components.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.ControlSlider-module__wrapper___sHEkd{position:relative;width:100%;height:100%}.ControlSlider-module__slider___R3i9-{width:100%;height:100%}.ControlSlider-module__sliderItems___1MgPL{display:flex;overflow:hidden;width:100%;height:100%;transition:transform .3s ease-in-out}.ControlSlider-module__sliderItem___QQSkR{width:100%;height:100%;display:flex;position:relative}.ControlSlider-module__sliderImage___9hRl-{width:100%;height:100%;object-fit:cover}.ControlSlider-module__arrow___05ghY{position:absolute;display:flex;align-items:center;justify-content:center;border:none;background-color:transparent;top:50%;left:calc(var(--is-editor, 0) * -1.3888888889vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * -1.3888888889vw);z-index:1;transform:translate(-50%,-50%);padding:0;width:calc(var(--is-editor, 0) * 2.0833333333vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 2.0833333333vw);height:calc(var(--is-editor, 0) * 2.0833333333vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 2.0833333333vw)}.ControlSlider-module__arrow___05ghY.ControlSlider-module__arrowVertical___tBfVN{left:50%;top:calc(var(--is-editor, 0) * -1.3888888889vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * -1.3888888889vw);transform:translate(-50%,-50%)}.ControlSlider-module__nextArrow___-30Yc{left:unset;right:calc(var(--is-editor, 0) * -1.3888888889vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * -1.3888888889vw);transform:translate(50%,-50%)}.ControlSlider-module__nextArrow___-30Yc.ControlSlider-module__arrowVertical___tBfVN{left:50%;right:unset;top:unset;bottom:calc(var(--is-editor, 0) * -1.3888888889vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * -1.3888888889vw);transform:translate(-50%,50%)}.ControlSlider-module__arrowInner___aEra3{all:unset;cursor:pointer;width:100%;height:100%}.ControlSlider-module__arrowInner___aEra3:hover .ControlSlider-module__arrowIcon___S4ztF path{fill:var(--arrow-hover-color)!important}.ControlSlider-module__arrowImg___2dwJW{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.ControlSlider-module__arrowIcon___S4ztF{width:100%;height:100%}.ControlSlider-module__arrowIcon___S4ztF path{transition:fill .15s ease-in-out}.ControlSlider-module__mirror___brd6U{transform:translate(-50%,-50%) scaleX(-1)!important}.ControlSlider-module__arrowVertical___tBfVN.ControlSlider-module__mirror___brd6U{transform:translate(-50%,-50%) scaleY(-1)!important}.ControlSlider-module__pagination___bicLF{position:absolute;z-index:1;border-radius:50%}.ControlSlider-module__paginationInner___bT-P-{display:flex;gap:calc(var(--is-editor, 0) * 1.1111111111vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.1111111111vw);padding-top:calc(var(--is-editor, 0) * .6944444444vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * .6944444444vw);padding-bottom:calc(var(--is-editor, 0) * .6944444444vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * .6944444444vw);padding-left:calc(var(--is-editor, 0) * 1.25vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.25vw);padding-right:calc(var(--is-editor, 0) * 1.25vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.25vw);border-radius:calc(var(--is-editor, 0) * 2.3611111111vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 2.3611111111vw)}.ControlSlider-module__paginationVertical___zYqKw{flex-direction:column}.ControlSlider-module__paginationItem___nTRbk{all:unset;flex-shrink:0;position:relative;width:calc(var(--is-editor, 0) * 1.1111111111vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.1111111111vw);height:calc(var(--is-editor, 0) * 1.1111111111vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.1111111111vw);cursor:pointer}.ControlSlider-module__paginationItem___nTRbk:hover .ControlSlider-module__dot___p1Qun{background-color:var(--pagination-hover-color)!important}.ControlSlider-module__dot___p1Qun{border-radius:50%;scale:.5;transition:background-color .3s ease-in-out,transform .3s ease-in-out;width:calc(var(--is-editor, 0) * 1.1111111111vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.1111111111vw);height:calc(var(--is-editor, 0) * 1.1111111111vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.1111111111vw)}.ControlSlider-module__activeDot___LHFaj{transform:scale(2)}.ControlSlider-module__paginationInsideBottom___R3FWn{bottom:0;left:50%;transform:translate(-50%)}.ControlSlider-module__paginationInsideTop___V-qb-{left:50%;transform:translate(-50%);top:0}.ControlSlider-module__paginationOutsideBottom___14w8D{left:50%;transform:translate(-50%);bottom:calc(var(--is-editor, 0) * -2.4305555556vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * -2.4305555556vw)}.ControlSlider-module__paginationOutsideTop___SCLqB{left:50%;transform:translate(-50%);top:calc(var(--is-editor, 0) * -2.4305555556vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * -2.4305555556vw)}.ControlSlider-module__paginationInsideLeft___yOBRZ{top:50%;transform:translateY(-50%);left:calc(var(--is-editor, 0) * -2.4305555556vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * -2.4305555556vw)}.ControlSlider-module__paginationInsideRight___Rtt3o{top:50%;transform:translateY(-50%);right:calc(var(--is-editor, 0) * -2.4305555556vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * -2.4305555556vw)}.ControlSlider-module__paginationOutsideLeft___lahaw{top:50%;transform:translateY(-50%);left:calc(var(--is-editor, 0) * -5.4861111111vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * -5.4861111111vw)}.ControlSlider-module__paginationOutsideRight___EtuQa{top:50%;transform:translateY(-50%);right:calc(var(--is-editor, 0) * -5.4861111111vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * -5.4861111111vw)}.ControlSlider-module__imgWrapper___UjEgB,.ControlSlider-module__wrapperInner___DLAWV{width:100%;height:100%}.ControlSlider-module__captionBlock___dJ6-j{pointer-events:none;position:absolute;top:0;z-index:1;left:0;right:0;bottom:0}.ControlSlider-module__captionTextWrapper___HFlpf{position:relative;width:100%;height:100%}.ControlSlider-module__captionText___uGBVc{pointer-events:none;max-width:100%;transition-property:opacity;transition-timing-function:ease-in-out;position:absolute;display:inline-block;white-space:pre-wrap;overflow-wrap:break-word;opacity:0}.ControlSlider-module__captionText___uGBVc.ControlSlider-module__active___WZK4G{opacity:1}.ControlSlider-module__withPointerEvents___t-18M{pointer-events:auto}.ControlSlider-module__absolute___KxmYB{position:absolute}.ControlSlider-module__topLeftAlignment___zjnGM{top:0;left:0}.ControlSlider-module__topCenterAlignment___gD1xW{top:0;left:50%;transform:translate(-50%)}.ControlSlider-module__topRightAlignment___NMapS{top:0;right:0}.ControlSlider-module__middleLeftAlignment___OnUrY{top:50%;transform:translateY(-50%);left:0}.ControlSlider-module__middleCenterAlignment___Tdkl0{top:50%;transform:translate(-50%,-50%);left:50%}.ControlSlider-module__middleRightAlignment___wEbfX{top:50%;transform:translateY(-50%);right:0}.ControlSlider-module__bottomLeftAlignment___cTP2-{bottom:0;left:0}.ControlSlider-module__bottomCenterAlignment___c54fB{bottom:0;left:50%;transform:translate(-50%)}.ControlSlider-module__bottomRightAlignment___kEwrz{bottom:0;right:0}.ControlSlider-module__clickOverlay___DZA28{position:absolute;top:0;left:0;width:100%;height:100%;cursor:pointer}.ControlSlider-module__contain___pLyq7{object-fit:contain}.ControlSlider-module__cover___KdDat{object-fit:cover}.RichTextRenderer-module__link___BWeZ2{color:inherit;cursor:pointer;pointer-events:auto;transition:color .2s ease}.RichTextRenderer-module__link___BWeZ2:hover{color:var(--link-hover-color)}.SvgImage-module__svg___q3xE-{width:100%;height:100%;color:transparent;display:inline-block;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background-color:var(--fill);transition:background-color .2s;-webkit-mask:var(--svg) no-repeat center/contain;mask:var(--svg) no-repeat center/contain}.SvgImage-module__svg___q3xE-:hover{background-color:var(--hover-fill)}.SvgImage-module__img___VsTm-{width:100%;height:100%;object-fit:contain}.ImageRevealSlider-module__imageRevealSlider___UE5Ob{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden}.ImageRevealSlider-module__image___Qjt-e{width:100%;height:100%;object-fit:cover;position:relative;-webkit-user-select:none;user-select:none;pointer-events:none}.ImageRevealSlider-module__link___N-iLG{width:100%;height:100%;display:block}.Lightbox-module__background___wf1Ii{position:absolute;z-index:9998;width:100%;height:100%;top:0;left:0}.Lightbox-module__backdropStyle___y7avj{position:fixed;top:0;left:0;right:0;bottom:0;width:100%;height:100%;z-index:9999}.Lightbox-module__editor___Vh82D{width:var(--cntrl-article-width)!important;margin-left:auto;margin-right:auto}.Lightbox-module__contentStyle___FzFaW{position:relative;width:100%;max-width:100vw;max-height:100vh;height:100vh;overflow:auto;background:transparent;box-sizing:border-box}.Lightbox-module__imageStyle___Qb7f5{position:relative;display:block;cursor:pointer;background-color:transparent;width:fit-content;height:fit-content}.Lightbox-module__imgWrapper___cdytV{position:relative;display:flex;width:100%;height:100%;overflow:hidden;box-sizing:border-box}.Lightbox-module__contain___5gATW{object-fit:contain;max-width:100%;max-height:100%}.Lightbox-module__cover___8HZy7{width:100%;height:100%;object-fit:cover;max-width:100%;max-height:100%}.Lightbox-module__caption___3e-22{position:absolute;display:flex}.Lightbox-module__lightboxSplide___yMC4v.splide,.Lightbox-module__lightboxSplide___yMC4v .splide__track{height:100%}.Lightbox-module__arrow___s3Bn2{position:absolute;display:flex;align-items:center;justify-content:center;cursor:pointer;border:none;background-color:transparent;top:50%;z-index:1;transform:translate(-50%,-50%);padding:0;left:calc(var(--is-editor, 0) * 1.3888888889vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.3888888889vw);width:calc(var(--is-editor, 0) * 2.0833333333vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 2.0833333333vw);height:calc(var(--is-editor, 0) * 2.0833333333vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 2.0833333333vw)}.Lightbox-module__arrow___s3Bn2.Lightbox-module__arrowVertical___6ztxz{left:50%;top:calc(var(--is-editor, 0) * 1.3888888889vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.3888888889vw);transform:translate(-50%,-50%)}.Lightbox-module__nextArrow___i23DU{left:unset;right:calc(var(--is-editor, 0) * 1.3888888889vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.3888888889vw);transform:translate(50%,-50%)}.Lightbox-module__nextArrow___i23DU.Lightbox-module__arrowVertical___6ztxz{left:50%;right:unset;top:unset;bottom:calc(var(--is-editor, 0) * 1.3888888889vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.3888888889vw);transform:translate(-50%,50%)}.Lightbox-module__arrowInner___Mm3xe{all:unset;cursor:pointer;width:100%;height:100%}.Lightbox-module__arrowInner___Mm3xe:hover .Lightbox-module__arrowIcon___UpzOt path{fill:var(--arrow-hover-color)!important}.Lightbox-module__arrowImg___UxHPR{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.Lightbox-module__mirror___50NCE{transform:translate(-50%,-50%) scaleX(-1)!important}.Lightbox-module__arrowVertical___6ztxz.Lightbox-module__mirror___50NCE{transform:translate(-50%,-50%) scaleY(-1)!important}.Lightbox-module__thumbsContainerVertical___lVaf-{flex-direction:column;display:flex}.Lightbox-module__thumbsContainer___DqOCP{position:absolute;display:flex;align-items:center;justify-content:center;pointer-events:auto}.Lightbox-module__thumbsAlignStart___uiFIV{align-items:flex-start}.Lightbox-module__thumbsAlignCenter___sbUPA{align-items:center}.Lightbox-module__thumbsAlignEnd___OA9N4{align-items:flex-end}.Lightbox-module__thumbsContainerVertical___lVaf-.Lightbox-module__thumbsAlignStart___uiFIV{align-items:center;justify-content:flex-start}.Lightbox-module__thumbsContainerVertical___lVaf-.Lightbox-module__thumbsAlignCenter___sbUPA{align-items:center;justify-content:center}.Lightbox-module__thumbsContainerVertical___lVaf-.Lightbox-module__thumbsAlignEnd___OA9N4{align-items:center;justify-content:flex-end}.Lightbox-module__thumbItem___zROyu{all:unset;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;overflow:hidden;transition:transform .1s ease,opacity .1s ease}.Lightbox-module__thumbItem___zROyu:hover{opacity:var(--thumb-hover)!important}.Lightbox-module__thumbImage___xGakV{display:block;height:100%;width:calc(var(--is-editor, 0) * 5.5555555556vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 5.5555555556vw)}.Lightbox-module__closeButton___r3Dur{all:unset;cursor:pointer;position:absolute;width:calc(var(--is-editor, 0) * 2.0833333333vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 2.0833333333vw);height:calc(var(--is-editor, 0) * 2.0833333333vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 2.0833333333vw)}@keyframes Lightbox-module__lbFadeIn___3xoHQ{0%{opacity:0}to{opacity:1}}.Lightbox-module__fadeIn___sHwRK{animation-name:Lightbox-module__lbFadeIn___3xoHQ}@keyframes Lightbox-module__lbSlideInLeft___vgE9-{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes Lightbox-module__lbSlideInRight___nByIA{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes Lightbox-module__lbSlideInTop___hI5ju{0%{transform:translateY(-100%)}to{transform:translateY(0)}}@keyframes Lightbox-module__lbSlideInBottom___M6-9o{0%{transform:translateY(100%)}to{transform:translateY(0)}}.Lightbox-module__slideInLeft___P-XRo{animation-name:Lightbox-module__lbSlideInLeft___vgE9-}.Lightbox-module__slideInRight___ZQqFi{animation-name:Lightbox-module__lbSlideInRight___nByIA}.Lightbox-module__slideInTop___XRKCs{animation-name:Lightbox-module__lbSlideInTop___hI5ju}.Lightbox-module__slideInBottom___TYOBS{animation-name:Lightbox-module__lbSlideInBottom___M6-9o}.Lightbox-module__lightboxSplide___yMC4v.splide--fade .Lightbox-module__scaleSlide___wS7d4{opacity:0!important;transform:var(--position-transform, none) scale(.9)!important;transition:opacity var(--splide-speed, .5s) ease,transform var(--splide-speed, .5s) ease!important}.Lightbox-module__lightboxSplide___yMC4v.splide--fade .splide__slide.is-active .Lightbox-module__scaleSlide___wS7d4{opacity:1!important;transform:var(--position-transform, none) scale(1)!important}.Lightbox-module__lightboxSplide___yMC4v.splide--fade .splide__slide:not(.is-active) .Lightbox-module__scaleSlide___wS7d4{opacity:0!important;transform:var(--position-transform, none) scale(1.1)!important}.splide__container{box-sizing:border-box;position:relative}.splide__list{backface-visibility:hidden;display:-ms-flexbox;display:flex;height:100%;margin:0!important;padding:0!important}.splide.is-initialized:not(.is-active) .splide__list{display:block}.splide__pagination{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-pack:center;justify-content:center;margin:0;pointer-events:none}.splide__pagination li{display:inline-block;line-height:1;list-style-type:none;margin:0;pointer-events:auto}.splide:not(.is-overflow) .splide__pagination{display:none}.splide__progress__bar{width:0}.splide{position:relative;visibility:hidden}.splide.is-initialized,.splide.is-rendered{visibility:visible}.splide__slide{backface-visibility:hidden;box-sizing:border-box;-ms-flex-negative:0;flex-shrink:0;list-style-type:none!important;margin:0;position:relative}.splide__slide img{vertical-align:bottom}.splide__spinner{animation:splide-loading 1s linear infinite;border:2px solid #999;border-left-color:transparent;border-radius:50%;bottom:0;contain:strict;display:inline-block;height:20px;left:0;margin:auto;position:absolute;right:0;top:0;width:20px}.splide__sr{clip:rect(0 0 0 0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.splide__toggle.is-active .splide__toggle__play,.splide__toggle__pause{display:none}.splide__toggle.is-active .splide__toggle__pause{display:inline}.splide__track{overflow:hidden;position:relative;z-index:0}@keyframes splide-loading{0%{transform:rotate(0)}to{transform:rotate(1turn)}}.splide__track--draggable{-webkit-touch-callout:none;-webkit-user-select:none;-ms-user-select:none;user-select:none}.splide__track--fade>.splide__list>.splide__slide{margin:0!important;opacity:0;z-index:0}.splide__track--fade>.splide__list>.splide__slide.is-active{opacity:1;z-index:1}.splide--rtl{direction:rtl}.splide__track--ttb>.splide__list{display:block}.splide__arrow{-ms-flex-align:center;align-items:center;background:#ccc;border:0;border-radius:50%;cursor:pointer;display:-ms-flexbox;display:flex;height:2em;-ms-flex-pack:center;justify-content:center;opacity:.7;padding:0;position:absolute;top:50%;transform:translateY(-50%);width:2em;z-index:1}.splide__arrow svg{fill:#000;height:1.2em;width:1.2em}.splide__arrow:hover:not(:disabled){opacity:.9}.splide__arrow:disabled{opacity:.3}.splide__arrow:focus-visible{outline:3px solid #0bf;outline-offset:3px}.splide__arrow--prev{left:1em}.splide__arrow--prev svg{transform:scaleX(-1)}.splide__arrow--next{right:1em}.splide.is-focus-in .splide__arrow:focus{outline:3px solid #0bf;outline-offset:3px}.splide__pagination{bottom:.5em;left:0;padding:0 1em;position:absolute;right:0;z-index:1}.splide__pagination__page{background:#ccc;border:0;border-radius:50%;display:inline-block;height:8px;margin:3px;opacity:.7;padding:0;position:relative;transition:transform .2s linear;width:8px}.splide__pagination__page.is-active{background:#fff;transform:scale(1.4);z-index:1}.splide__pagination__page:hover{cursor:pointer;opacity:.9}.splide__pagination__page:focus-visible{outline:3px solid #0bf;outline-offset:3px}.splide.is-focus-in .splide__pagination__page:focus{outline:3px solid #0bf;outline-offset:3px}.splide__progress__bar{background:#ccc;height:3px}.splide__slide{-webkit-tap-highlight-color:rgba(0,0,0,0)}.splide__slide:focus{outline:0}@supports (outline-offset:-3px){.splide__slide:focus-visible{outline:3px solid #0bf;outline-offset:-3px}}@media screen and (-ms-high-contrast:none){.splide__slide:focus-visible{border:3px solid #0bf}}@supports (outline-offset:-3px){.splide.is-focus-in .splide__slide:focus{outline:3px solid #0bf;outline-offset:-3px}}@media screen and (-ms-high-contrast:none){.splide.is-focus-in .splide__slide:focus{border:3px solid #0bf}.splide.is-focus-in .splide__track>.splide__list>.splide__slide:focus{border-color:#0bf}}.splide__toggle{cursor:pointer}.splide__toggle:focus-visible{outline:3px solid #0bf;outline-offset:3px}.splide.is-focus-in .splide__toggle:focus{outline:3px solid #0bf;outline-offset:3px}.splide__track--nav>.splide__list>.splide__slide{border:3px solid transparent;cursor:pointer}.splide__track--nav>.splide__list>.splide__slide.is-active{border:3px solid #000}.splide__arrows--rtl .splide__arrow--prev{left:auto;right:1em}.splide__arrows--rtl .splide__arrow--prev svg{transform:scaleX(1)}.splide__arrows--rtl .splide__arrow--next{left:1em;right:auto}.splide__arrows--rtl .splide__arrow--next svg{transform:scaleX(-1)}.splide__arrows--ttb .splide__arrow{left:50%;transform:translate(-50%)}.splide__arrows--ttb .splide__arrow--prev{top:1em}.splide__arrows--ttb .splide__arrow--prev svg{transform:rotate(-90deg)}.splide__arrows--ttb .splide__arrow--next{bottom:1em;top:auto}.splide__arrows--ttb .splide__arrow--next svg{transform:rotate(90deg)}.splide__pagination--ttb{bottom:0;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;left:auto;padding:1em 0;right:.5em;top:0}
|
|
1
|
+
.ControlSlider-module__wrapper___sHEkd{position:relative;width:100%;height:100%}.ControlSlider-module__slider___R3i9-{width:100%;height:100%}.ControlSlider-module__sliderItems___1MgPL{display:flex;overflow:hidden;width:100%;height:100%;transition:transform .3s ease-in-out}.ControlSlider-module__sliderItem___QQSkR{width:100%;height:100%;display:flex;position:relative}.ControlSlider-module__sliderImage___9hRl-{width:100%;height:100%;object-fit:cover}.ControlSlider-module__arrow___05ghY{position:absolute;display:flex;align-items:center;justify-content:center;border:none;background-color:transparent;top:50%;left:calc(var(--is-editor, 0) * -1.3888888889vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * -1.3888888889vw);z-index:1;transform:translate(-50%,-50%);padding:0;width:calc(var(--is-editor, 0) * 2.0833333333vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 2.0833333333vw);height:calc(var(--is-editor, 0) * 2.0833333333vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 2.0833333333vw)}.ControlSlider-module__arrow___05ghY.ControlSlider-module__arrowVertical___tBfVN{left:50%;top:calc(var(--is-editor, 0) * -1.3888888889vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * -1.3888888889vw);transform:translate(-50%,-50%)}.ControlSlider-module__nextArrow___-30Yc{left:unset;right:calc(var(--is-editor, 0) * -1.3888888889vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * -1.3888888889vw);transform:translate(50%,-50%)}.ControlSlider-module__nextArrow___-30Yc.ControlSlider-module__arrowVertical___tBfVN{left:50%;right:unset;top:unset;bottom:calc(var(--is-editor, 0) * -1.3888888889vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * -1.3888888889vw);transform:translate(-50%,50%)}.ControlSlider-module__arrowInner___aEra3{all:unset;cursor:pointer;width:100%;height:100%}.ControlSlider-module__arrowInner___aEra3:hover .ControlSlider-module__arrowIcon___S4ztF path{fill:var(--arrow-hover-color)!important}.ControlSlider-module__arrowImg___2dwJW{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.ControlSlider-module__arrowIcon___S4ztF{width:100%;height:100%}.ControlSlider-module__arrowIcon___S4ztF path{transition:fill .15s ease-in-out}.ControlSlider-module__mirror___brd6U{transform:translate(-50%,-50%) scaleX(-1)!important}.ControlSlider-module__arrowVertical___tBfVN.ControlSlider-module__mirror___brd6U{transform:translate(-50%,-50%) scaleY(-1)!important}.ControlSlider-module__pagination___bicLF{position:absolute;z-index:1;border-radius:50%}.ControlSlider-module__paginationInner___bT-P-{display:flex;gap:calc(var(--is-editor, 0) * 1.1111111111vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.1111111111vw);padding-top:calc(var(--is-editor, 0) * .6944444444vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * .6944444444vw);padding-bottom:calc(var(--is-editor, 0) * .6944444444vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * .6944444444vw);padding-left:calc(var(--is-editor, 0) * 1.25vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.25vw);padding-right:calc(var(--is-editor, 0) * 1.25vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.25vw);border-radius:calc(var(--is-editor, 0) * 2.3611111111vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 2.3611111111vw)}.ControlSlider-module__paginationVertical___zYqKw{flex-direction:column}.ControlSlider-module__paginationItem___nTRbk{all:unset;flex-shrink:0;position:relative;width:calc(var(--is-editor, 0) * 1.1111111111vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.1111111111vw);height:calc(var(--is-editor, 0) * 1.1111111111vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.1111111111vw);cursor:pointer}.ControlSlider-module__paginationItem___nTRbk:hover .ControlSlider-module__dot___p1Qun{background-color:var(--pagination-hover-color)!important}.ControlSlider-module__dot___p1Qun{border-radius:50%;scale:.5;transition:background-color .3s ease-in-out,transform .3s ease-in-out;width:calc(var(--is-editor, 0) * 1.1111111111vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.1111111111vw);height:calc(var(--is-editor, 0) * 1.1111111111vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.1111111111vw)}.ControlSlider-module__activeDot___LHFaj{transform:scale(2)}.ControlSlider-module__paginationInsideBottom___R3FWn{bottom:0;left:50%;transform:translate(-50%)}.ControlSlider-module__paginationInsideTop___V-qb-{left:50%;transform:translate(-50%);top:0}.ControlSlider-module__paginationOutsideBottom___14w8D{left:50%;transform:translate(-50%);bottom:calc(var(--is-editor, 0) * -2.4305555556vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * -2.4305555556vw)}.ControlSlider-module__paginationOutsideTop___SCLqB{left:50%;transform:translate(-50%);top:calc(var(--is-editor, 0) * -2.4305555556vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * -2.4305555556vw)}.ControlSlider-module__paginationInsideLeft___yOBRZ{top:50%;transform:translateY(-50%);left:calc(var(--is-editor, 0) * -2.4305555556vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * -2.4305555556vw)}.ControlSlider-module__paginationInsideRight___Rtt3o{top:50%;transform:translateY(-50%);right:calc(var(--is-editor, 0) * -2.4305555556vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * -2.4305555556vw)}.ControlSlider-module__paginationOutsideLeft___lahaw{top:50%;transform:translateY(-50%);left:calc(var(--is-editor, 0) * -5.4861111111vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * -5.4861111111vw)}.ControlSlider-module__paginationOutsideRight___EtuQa{top:50%;transform:translateY(-50%);right:calc(var(--is-editor, 0) * -5.4861111111vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * -5.4861111111vw)}.ControlSlider-module__imgWrapper___UjEgB,.ControlSlider-module__wrapperInner___DLAWV{width:100%;height:100%}.ControlSlider-module__captionBlock___dJ6-j{pointer-events:none;position:absolute;top:0;z-index:1;left:0;right:0;bottom:0}.ControlSlider-module__captionTextWrapper___HFlpf{position:relative;width:100%;height:100%}.ControlSlider-module__captionText___uGBVc{pointer-events:none;max-width:100%;transition-property:opacity;transition-timing-function:ease-in-out;position:absolute;display:inline-block;white-space:pre-wrap;overflow-wrap:break-word;opacity:0}.ControlSlider-module__captionText___uGBVc.ControlSlider-module__active___WZK4G{opacity:1}.ControlSlider-module__withPointerEvents___t-18M{pointer-events:auto}.ControlSlider-module__absolute___KxmYB{position:absolute}.ControlSlider-module__topLeftAlignment___zjnGM{top:0;left:0}.ControlSlider-module__topCenterAlignment___gD1xW{top:0;left:50%;transform:translate(-50%)}.ControlSlider-module__topRightAlignment___NMapS{top:0;right:0}.ControlSlider-module__middleLeftAlignment___OnUrY{top:50%;transform:translateY(-50%);left:0}.ControlSlider-module__middleCenterAlignment___Tdkl0{top:50%;transform:translate(-50%,-50%);left:50%}.ControlSlider-module__middleRightAlignment___wEbfX{top:50%;transform:translateY(-50%);right:0}.ControlSlider-module__bottomLeftAlignment___cTP2-{bottom:0;left:0}.ControlSlider-module__bottomCenterAlignment___c54fB{bottom:0;left:50%;transform:translate(-50%)}.ControlSlider-module__bottomRightAlignment___kEwrz{bottom:0;right:0}.ControlSlider-module__clickOverlay___DZA28{position:absolute;top:0;left:0;width:100%;height:100%;cursor:pointer}.ControlSlider-module__contain___pLyq7{object-fit:contain}.ControlSlider-module__cover___KdDat{object-fit:cover}.RichTextRenderer-module__link___BWeZ2{color:inherit;cursor:pointer;pointer-events:auto;transition:color .2s ease}.RichTextRenderer-module__link___BWeZ2:hover{color:var(--link-hover-color)}.SvgImage-module__svg___q3xE-{width:100%;height:100%;color:transparent;display:inline-block;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background-color:var(--fill);transition:background-color .2s;-webkit-mask:var(--svg) no-repeat center/contain;mask:var(--svg) no-repeat center/contain}.SvgImage-module__svg___q3xE-:hover{background-color:var(--hover-fill)}.SvgImage-module__img___VsTm-{width:100%;height:100%;object-fit:contain}.ImageRevealSlider-module__imageRevealSlider___UE5Ob{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden}.ImageRevealSlider-module__image___Qjt-e{width:100%;height:100%;object-fit:cover;position:relative;-webkit-user-select:none;user-select:none;pointer-events:none}.ImageRevealSlider-module__link___N-iLG{width:100%;height:100%;display:block}.Lightbox-module__background___wf1Ii{position:absolute;z-index:9998;width:100%;height:100%;top:0;left:0}.Lightbox-module__backdropStyle___y7avj{position:fixed;top:0;left:0;right:0;bottom:0;width:100%;height:100%;z-index:9999}.Lightbox-module__editor___Vh82D{width:var(--cntrl-article-width)!important;margin-left:auto;margin-right:auto}.Lightbox-module__contentStyle___FzFaW{position:relative;width:100%;max-width:100vw;max-height:100vh;height:100vh;overflow:auto;background:transparent;box-sizing:border-box}.Lightbox-module__imageStyle___Qb7f5{position:relative;display:block;cursor:pointer;background-color:transparent;width:fit-content;height:fit-content}.Lightbox-module__imgWrapper___cdytV{position:relative;display:flex;width:100%;height:100%;overflow:hidden;box-sizing:border-box}.Lightbox-module__contain___5gATW{object-fit:contain;max-width:100%;max-height:100%}.Lightbox-module__cover___8HZy7{width:100%;height:100%;object-fit:cover;max-width:100%;max-height:100%}.Lightbox-module__caption___3e-22{position:absolute;display:flex}.Lightbox-module__caption___3e-22:hover{color:var(--link-hover-color)!important}.Lightbox-module__lightboxSplide___yMC4v.splide,.Lightbox-module__lightboxSplide___yMC4v .splide__track{height:100%}.Lightbox-module__arrow___s3Bn2{position:absolute;display:flex;align-items:center;justify-content:center;cursor:pointer;border:none;background-color:transparent;top:50%;z-index:1;transform:translate(-50%,-50%);padding:0;left:calc(var(--is-editor, 0) * 1.3888888889vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.3888888889vw);width:calc(var(--is-editor, 0) * 2.0833333333vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 2.0833333333vw);height:calc(var(--is-editor, 0) * 2.0833333333vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 2.0833333333vw)}.Lightbox-module__arrow___s3Bn2.Lightbox-module__arrowVertical___6ztxz{left:50%;top:calc(var(--is-editor, 0) * 1.3888888889vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.3888888889vw);transform:translate(-50%,-50%)}.Lightbox-module__nextArrow___i23DU{left:unset;right:calc(var(--is-editor, 0) * 1.3888888889vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.3888888889vw);transform:translate(50%,-50%)}.Lightbox-module__nextArrow___i23DU.Lightbox-module__arrowVertical___6ztxz{left:50%;right:unset;top:unset;bottom:calc(var(--is-editor, 0) * 1.3888888889vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 1.3888888889vw);transform:translate(-50%,50%)}.Lightbox-module__arrowInner___Mm3xe{all:unset;cursor:pointer;width:100%;height:100%}.Lightbox-module__arrowInner___Mm3xe:hover .Lightbox-module__arrowIcon___UpzOt path{fill:var(--arrow-hover-color)!important}.Lightbox-module__arrowImg___UxHPR{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.Lightbox-module__mirror___50NCE{transform:translate(-50%,-50%) scaleX(-1)!important}.Lightbox-module__arrowVertical___6ztxz.Lightbox-module__mirror___50NCE{transform:translate(-50%,-50%) scaleY(-1)!important}.Lightbox-module__thumbsContainerVertical___lVaf-{flex-direction:column;display:flex}.Lightbox-module__thumbsContainer___DqOCP{position:absolute;display:flex;align-items:center;justify-content:center;pointer-events:auto}.Lightbox-module__thumbsAlignStart___uiFIV{align-items:flex-start}.Lightbox-module__thumbsAlignCenter___sbUPA{align-items:center}.Lightbox-module__thumbsAlignEnd___OA9N4{align-items:flex-end}.Lightbox-module__thumbsContainerVertical___lVaf-.Lightbox-module__thumbsAlignStart___uiFIV{align-items:center;justify-content:flex-start}.Lightbox-module__thumbsContainerVertical___lVaf-.Lightbox-module__thumbsAlignCenter___sbUPA{align-items:center;justify-content:center}.Lightbox-module__thumbsContainerVertical___lVaf-.Lightbox-module__thumbsAlignEnd___OA9N4{align-items:center;justify-content:flex-end}.Lightbox-module__thumbItem___zROyu{all:unset;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;overflow:hidden;transition:transform .1s ease,opacity .1s ease}.Lightbox-module__thumbItem___zROyu:hover{opacity:var(--thumb-hover)!important}.Lightbox-module__thumbImage___xGakV{display:block;height:100%;width:calc(var(--is-editor, 0) * 5.5555555556vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 5.5555555556vw)}.Lightbox-module__closeButton___r3Dur{all:unset;cursor:pointer;position:absolute;width:calc(var(--is-editor, 0) * 2.0833333333vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 2.0833333333vw);height:calc(var(--is-editor, 0) * 2.0833333333vw / var(--cntrl-reverse-layout-deviation, 1) + (1 - var(--is-editor, 0)) * 2.0833333333vw)}@keyframes Lightbox-module__lbFadeIn___3xoHQ{0%{opacity:0}to{opacity:1}}.Lightbox-module__fadeIn___sHwRK{animation-name:Lightbox-module__lbFadeIn___3xoHQ}@keyframes Lightbox-module__lbSlideInLeft___vgE9-{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes Lightbox-module__lbSlideInRight___nByIA{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes Lightbox-module__lbSlideInTop___hI5ju{0%{transform:translateY(-100%)}to{transform:translateY(0)}}@keyframes Lightbox-module__lbSlideInBottom___M6-9o{0%{transform:translateY(100%)}to{transform:translateY(0)}}.Lightbox-module__slideInLeft___P-XRo{animation-name:Lightbox-module__lbSlideInLeft___vgE9-}.Lightbox-module__slideInRight___ZQqFi{animation-name:Lightbox-module__lbSlideInRight___nByIA}.Lightbox-module__slideInTop___XRKCs{animation-name:Lightbox-module__lbSlideInTop___hI5ju}.Lightbox-module__slideInBottom___TYOBS{animation-name:Lightbox-module__lbSlideInBottom___M6-9o}.Lightbox-module__lightboxSplide___yMC4v.splide--fade .Lightbox-module__scaleSlide___wS7d4{opacity:0!important;transform:var(--position-transform, none) scale(.9)!important;transition:opacity var(--splide-speed, .5s) ease,transform var(--splide-speed, .5s) ease!important}.Lightbox-module__lightboxSplide___yMC4v.splide--fade .splide__slide.is-active .Lightbox-module__scaleSlide___wS7d4{opacity:1!important;transform:var(--position-transform, none) scale(1)!important}.Lightbox-module__lightboxSplide___yMC4v.splide--fade .splide__slide:not(.is-active) .Lightbox-module__scaleSlide___wS7d4{opacity:0!important;transform:var(--position-transform, none) scale(1.1)!important}.splide__container{box-sizing:border-box;position:relative}.splide__list{backface-visibility:hidden;display:-ms-flexbox;display:flex;height:100%;margin:0!important;padding:0!important}.splide.is-initialized:not(.is-active) .splide__list{display:block}.splide__pagination{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-pack:center;justify-content:center;margin:0;pointer-events:none}.splide__pagination li{display:inline-block;line-height:1;list-style-type:none;margin:0;pointer-events:auto}.splide:not(.is-overflow) .splide__pagination{display:none}.splide__progress__bar{width:0}.splide{position:relative;visibility:hidden}.splide.is-initialized,.splide.is-rendered{visibility:visible}.splide__slide{backface-visibility:hidden;box-sizing:border-box;-ms-flex-negative:0;flex-shrink:0;list-style-type:none!important;margin:0;position:relative}.splide__slide img{vertical-align:bottom}.splide__spinner{animation:splide-loading 1s linear infinite;border:2px solid #999;border-left-color:transparent;border-radius:50%;bottom:0;contain:strict;display:inline-block;height:20px;left:0;margin:auto;position:absolute;right:0;top:0;width:20px}.splide__sr{clip:rect(0 0 0 0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.splide__toggle.is-active .splide__toggle__play,.splide__toggle__pause{display:none}.splide__toggle.is-active .splide__toggle__pause{display:inline}.splide__track{overflow:hidden;position:relative;z-index:0}@keyframes splide-loading{0%{transform:rotate(0)}to{transform:rotate(1turn)}}.splide__track--draggable{-webkit-touch-callout:none;-webkit-user-select:none;-ms-user-select:none;user-select:none}.splide__track--fade>.splide__list>.splide__slide{margin:0!important;opacity:0;z-index:0}.splide__track--fade>.splide__list>.splide__slide.is-active{opacity:1;z-index:1}.splide--rtl{direction:rtl}.splide__track--ttb>.splide__list{display:block}.splide__arrow{-ms-flex-align:center;align-items:center;background:#ccc;border:0;border-radius:50%;cursor:pointer;display:-ms-flexbox;display:flex;height:2em;-ms-flex-pack:center;justify-content:center;opacity:.7;padding:0;position:absolute;top:50%;transform:translateY(-50%);width:2em;z-index:1}.splide__arrow svg{fill:#000;height:1.2em;width:1.2em}.splide__arrow:hover:not(:disabled){opacity:.9}.splide__arrow:disabled{opacity:.3}.splide__arrow:focus-visible{outline:3px solid #0bf;outline-offset:3px}.splide__arrow--prev{left:1em}.splide__arrow--prev svg{transform:scaleX(-1)}.splide__arrow--next{right:1em}.splide.is-focus-in .splide__arrow:focus{outline:3px solid #0bf;outline-offset:3px}.splide__pagination{bottom:.5em;left:0;padding:0 1em;position:absolute;right:0;z-index:1}.splide__pagination__page{background:#ccc;border:0;border-radius:50%;display:inline-block;height:8px;margin:3px;opacity:.7;padding:0;position:relative;transition:transform .2s linear;width:8px}.splide__pagination__page.is-active{background:#fff;transform:scale(1.4);z-index:1}.splide__pagination__page:hover{cursor:pointer;opacity:.9}.splide__pagination__page:focus-visible{outline:3px solid #0bf;outline-offset:3px}.splide.is-focus-in .splide__pagination__page:focus{outline:3px solid #0bf;outline-offset:3px}.splide__progress__bar{background:#ccc;height:3px}.splide__slide{-webkit-tap-highlight-color:rgba(0,0,0,0)}.splide__slide:focus{outline:0}@supports (outline-offset:-3px){.splide__slide:focus-visible{outline:3px solid #0bf;outline-offset:-3px}}@media screen and (-ms-high-contrast:none){.splide__slide:focus-visible{border:3px solid #0bf}}@supports (outline-offset:-3px){.splide.is-focus-in .splide__slide:focus{outline:3px solid #0bf;outline-offset:-3px}}@media screen and (-ms-high-contrast:none){.splide.is-focus-in .splide__slide:focus{border:3px solid #0bf}.splide.is-focus-in .splide__track>.splide__list>.splide__slide:focus{border-color:#0bf}}.splide__toggle{cursor:pointer}.splide__toggle:focus-visible{outline:3px solid #0bf;outline-offset:3px}.splide.is-focus-in .splide__toggle:focus{outline:3px solid #0bf;outline-offset:3px}.splide__track--nav>.splide__list>.splide__slide{border:3px solid transparent;cursor:pointer}.splide__track--nav>.splide__list>.splide__slide.is-active{border:3px solid #000}.splide__arrows--rtl .splide__arrow--prev{left:auto;right:1em}.splide__arrows--rtl .splide__arrow--prev svg{transform:scaleX(1)}.splide__arrows--rtl .splide__arrow--next{left:1em;right:auto}.splide__arrows--rtl .splide__arrow--next svg{transform:scaleX(-1)}.splide__arrows--ttb .splide__arrow{left:50%;transform:translate(-50%)}.splide__arrows--ttb .splide__arrow--prev{top:1em}.splide__arrows--ttb .splide__arrow--prev svg{transform:rotate(-90deg)}.splide__arrows--ttb .splide__arrow--next{bottom:1em;top:auto}.splide__arrows--ttb .splide__arrow--next svg{transform:rotate(90deg)}.splide__pagination--ttb{bottom:0;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;left:auto;padding:1em 0;right:.5em;top:0}
|
package/dist/index.js
CHANGED
|
@@ -565,15 +565,28 @@ const ControlSliderComponent = {
|
|
|
565
565
|
},
|
|
566
566
|
offset: {
|
|
567
567
|
type: "object",
|
|
568
|
+
title: "Offset",
|
|
568
569
|
display: {
|
|
569
|
-
type: "
|
|
570
|
+
type: "group"
|
|
570
571
|
},
|
|
571
572
|
properties: {
|
|
572
573
|
x: {
|
|
573
|
-
type: "number"
|
|
574
|
+
type: "number",
|
|
575
|
+
label: "X",
|
|
576
|
+
scalingEnabled: true,
|
|
577
|
+
display: {
|
|
578
|
+
type: "numeric-input",
|
|
579
|
+
visible: true
|
|
580
|
+
}
|
|
574
581
|
},
|
|
575
582
|
y: {
|
|
576
|
-
type: "number"
|
|
583
|
+
type: "number",
|
|
584
|
+
label: "Y",
|
|
585
|
+
scalingEnabled: true,
|
|
586
|
+
display: {
|
|
587
|
+
type: "numeric-input",
|
|
588
|
+
visible: true
|
|
589
|
+
}
|
|
577
590
|
}
|
|
578
591
|
}
|
|
579
592
|
},
|
|
@@ -626,15 +639,28 @@ const ControlSliderComponent = {
|
|
|
626
639
|
},
|
|
627
640
|
offset: {
|
|
628
641
|
type: "object",
|
|
642
|
+
title: "Offset",
|
|
629
643
|
display: {
|
|
630
|
-
type: "
|
|
644
|
+
type: "group"
|
|
631
645
|
},
|
|
632
646
|
properties: {
|
|
633
647
|
x: {
|
|
634
|
-
type: "number"
|
|
648
|
+
type: "number",
|
|
649
|
+
label: "X",
|
|
650
|
+
scalingEnabled: true,
|
|
651
|
+
display: {
|
|
652
|
+
type: "numeric-input",
|
|
653
|
+
visible: true
|
|
654
|
+
}
|
|
635
655
|
},
|
|
636
656
|
y: {
|
|
637
|
-
type: "number"
|
|
657
|
+
type: "number",
|
|
658
|
+
label: "Y",
|
|
659
|
+
scalingEnabled: true,
|
|
660
|
+
display: {
|
|
661
|
+
type: "numeric-input",
|
|
662
|
+
visible: true
|
|
663
|
+
}
|
|
638
664
|
}
|
|
639
665
|
}
|
|
640
666
|
},
|
|
@@ -690,14 +716,26 @@ const ControlSliderComponent = {
|
|
|
690
716
|
offset: {
|
|
691
717
|
type: "object",
|
|
692
718
|
display: {
|
|
693
|
-
type: "
|
|
719
|
+
type: "group"
|
|
694
720
|
},
|
|
695
721
|
properties: {
|
|
696
722
|
x: {
|
|
697
|
-
type: "number"
|
|
723
|
+
type: "number",
|
|
724
|
+
label: "X",
|
|
725
|
+
scalingEnabled: true,
|
|
726
|
+
display: {
|
|
727
|
+
type: "numeric-input",
|
|
728
|
+
visible: true
|
|
729
|
+
}
|
|
698
730
|
},
|
|
699
731
|
y: {
|
|
700
|
-
type: "number"
|
|
732
|
+
type: "number",
|
|
733
|
+
label: "Y",
|
|
734
|
+
scalingEnabled: true,
|
|
735
|
+
display: {
|
|
736
|
+
type: "numeric-input",
|
|
737
|
+
visible: true
|
|
738
|
+
}
|
|
701
739
|
}
|
|
702
740
|
}
|
|
703
741
|
},
|
|
@@ -1505,7 +1543,7 @@ const styles = {
|
|
|
1505
1543
|
slideInBottom,
|
|
1506
1544
|
scaleSlide
|
|
1507
1545
|
};
|
|
1508
|
-
const getPositionStyles = (position, offset) => {
|
|
1546
|
+
const getPositionStyles = (position, offset, isEditor) => {
|
|
1509
1547
|
const styles2 = {};
|
|
1510
1548
|
const [vertical, horizontal] = position.split("-");
|
|
1511
1549
|
if (vertical === "top") {
|
|
@@ -1529,13 +1567,13 @@ const getPositionStyles = (position, offset) => {
|
|
|
1529
1567
|
styles2.right = "0";
|
|
1530
1568
|
}
|
|
1531
1569
|
if (vertical === "middle" && horizontal === "center") {
|
|
1532
|
-
styles2.transform = `translate(calc(-50% + ${offset.x}
|
|
1570
|
+
styles2.transform = `translate(calc(-50% + ${scalingValue(offset.x, isEditor)}), calc(-50% + ${scalingValue(offset.y, isEditor)}))`;
|
|
1533
1571
|
} else if (vertical === "middle") {
|
|
1534
|
-
styles2.transform = `translate(${offset.x}
|
|
1572
|
+
styles2.transform = `translate(${scalingValue(offset.x, isEditor)}, calc(-50% + ${scalingValue(offset.y, isEditor)}))`;
|
|
1535
1573
|
} else if (horizontal === "center") {
|
|
1536
|
-
styles2.transform = `translate(calc(-50% + ${offset.x}
|
|
1574
|
+
styles2.transform = `translate(calc(-50% + ${scalingValue(offset.x, isEditor)}), ${scalingValue(offset.y, isEditor)})`;
|
|
1537
1575
|
} else {
|
|
1538
|
-
styles2.transform = `translate(${offset.x}
|
|
1576
|
+
styles2.transform = `translate(${scalingValue(offset.x, isEditor)}, ${scalingValue(offset.y, isEditor)})`;
|
|
1539
1577
|
}
|
|
1540
1578
|
return styles2;
|
|
1541
1579
|
};
|
|
@@ -1673,8 +1711,10 @@ const Lightbox = ({ isOpen, onClose, content, settings, closeOnBackdropClick = t
|
|
|
1673
1711
|
const containerAspectRatio = containerWidth / containerHeight;
|
|
1674
1712
|
if (imageAspectRatio > containerAspectRatio) {
|
|
1675
1713
|
img2.style.width = "100%";
|
|
1714
|
+
img2.style.height = "";
|
|
1676
1715
|
} else {
|
|
1677
1716
|
img2.style.height = "100%";
|
|
1717
|
+
img2.style.width = "";
|
|
1678
1718
|
}
|
|
1679
1719
|
};
|
|
1680
1720
|
if (img2.complete) {
|
|
@@ -1771,8 +1811,8 @@ const Lightbox = ({ isOpen, onClose, content, settings, closeOnBackdropClick = t
|
|
|
1771
1811
|
animationDuration: `${appearDurationMs}ms`,
|
|
1772
1812
|
animationTimingFunction: "ease",
|
|
1773
1813
|
animationFillMode: "both",
|
|
1774
|
-
...appear.type === "mix" && { animationDelay: `${backdropDurationMs}ms` },
|
|
1775
|
-
"--splide-speed":
|
|
1814
|
+
...appear.type === "mix" && { animationDelay: `${backdropDurationMs / 2}ms` },
|
|
1815
|
+
"--splide-speed": slider.duration || "500ms"
|
|
1776
1816
|
},
|
|
1777
1817
|
children: [
|
|
1778
1818
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -1785,7 +1825,7 @@ const Lightbox = ({ isOpen, onClose, content, settings, closeOnBackdropClick = t
|
|
|
1785
1825
|
className: styles.lightboxSplide,
|
|
1786
1826
|
options: {
|
|
1787
1827
|
arrows: false,
|
|
1788
|
-
speed:
|
|
1828
|
+
speed: slider.duration ? parseInt(slider.duration) : 500,
|
|
1789
1829
|
direction: slider.direction === "horiz" || slider.type === "fade" || slider.type === "scale" ? "ltr" : "ttb",
|
|
1790
1830
|
pagination: false,
|
|
1791
1831
|
drag: triggers.type === "drag",
|
|
@@ -1796,9 +1836,9 @@ const Lightbox = ({ isOpen, onClose, content, settings, closeOnBackdropClick = t
|
|
|
1796
1836
|
padding: 0,
|
|
1797
1837
|
rewind: (slider.type === "scale" || slider.type === "fade") && appear.repeat !== "close"
|
|
1798
1838
|
},
|
|
1799
|
-
style: { "--splide-speed":
|
|
1839
|
+
style: { "--splide-speed": slider.duration || "500ms" },
|
|
1800
1840
|
children: content.map((item, index) => {
|
|
1801
|
-
const positionStyles = getPositionStyles(layout.position, layout.offset);
|
|
1841
|
+
const positionStyles = getPositionStyles(layout.position, layout.offset, isEditor);
|
|
1802
1842
|
const imageStyle2 = slider.type === "scale" ? (() => {
|
|
1803
1843
|
const { transform, ...restStyles } = positionStyles;
|
|
1804
1844
|
return {
|
|
@@ -1811,7 +1851,7 @@ const Lightbox = ({ isOpen, onClose, content, settings, closeOnBackdropClick = t
|
|
|
1811
1851
|
{
|
|
1812
1852
|
className: styles.imgWrapper,
|
|
1813
1853
|
onClick: handleImageWrapperClick,
|
|
1814
|
-
style: { padding:
|
|
1854
|
+
style: { padding: scalingValue(layout.padding.top, isEditor) + " " + scalingValue(layout.padding.right, isEditor) + " " + scalingValue(layout.padding.bottom, isEditor) + " " + scalingValue(layout.padding.left, isEditor) },
|
|
1815
1855
|
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
1816
1856
|
"img",
|
|
1817
1857
|
{
|
|
@@ -1842,7 +1882,7 @@ const Lightbox = ({ isOpen, onClose, content, settings, closeOnBackdropClick = t
|
|
|
1842
1882
|
{
|
|
1843
1883
|
className: styles.arrowInner,
|
|
1844
1884
|
style: {
|
|
1845
|
-
transform: `translate(${scalingValue(controls.offset.x)}, ${scalingValue(controls.offset.y * (slider.direction === "horiz" ? 1 : -1))}) scale(${controls.scale}) rotate(${slider.direction === "horiz" ? "0deg" : "90deg"})`
|
|
1885
|
+
transform: `translate(${scalingValue(controls.offset.x, isEditor)}, ${scalingValue(controls.offset.y * (slider.direction === "horiz" ? 1 : -1), isEditor)}) scale(${controls.scale}) rotate(${slider.direction === "horiz" ? "0deg" : "90deg"})`
|
|
1846
1886
|
},
|
|
1847
1887
|
onClick: (e) => {
|
|
1848
1888
|
handleArrowClick("-1");
|
|
@@ -1870,7 +1910,7 @@ const Lightbox = ({ isOpen, onClose, content, settings, closeOnBackdropClick = t
|
|
|
1870
1910
|
{
|
|
1871
1911
|
className: styles.arrowInner,
|
|
1872
1912
|
style: {
|
|
1873
|
-
transform: `translate(${scalingValue(controls.offset.x * (slider.direction === "horiz" ? -1 : 1))}, ${scalingValue(controls.offset.y)}) scale(${controls.scale}) rotate(${slider.direction === "horiz" ? "0deg" : "90deg"})`
|
|
1913
|
+
transform: `translate(${scalingValue(controls.offset.x * (slider.direction === "horiz" ? -1 : 1), isEditor)}, ${scalingValue(controls.offset.y, isEditor)}) scale(${controls.scale}) rotate(${slider.direction === "horiz" ? "0deg" : "90deg"})`
|
|
1874
1914
|
},
|
|
1875
1915
|
onClick: (e) => {
|
|
1876
1916
|
handleArrowClick("+1");
|
|
@@ -1891,7 +1931,7 @@ const Lightbox = ({ isOpen, onClose, content, settings, closeOnBackdropClick = t
|
|
|
1891
1931
|
)
|
|
1892
1932
|
] }),
|
|
1893
1933
|
area.closeIconUrl && (() => {
|
|
1894
|
-
const positionStyles = getPositionStyles(area.closeIconAlign, area.closeIconOffset);
|
|
1934
|
+
const positionStyles = getPositionStyles(area.closeIconAlign, area.closeIconOffset, isEditor);
|
|
1895
1935
|
const scaleTransform = `scale(${area.closeIconScale})`;
|
|
1896
1936
|
const combinedTransform = positionStyles.transform ? `${positionStyles.transform} ${scaleTransform}` : scaleTransform;
|
|
1897
1937
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -1912,9 +1952,10 @@ const Lightbox = ({ isOpen, onClose, content, settings, closeOnBackdropClick = t
|
|
|
1912
1952
|
{
|
|
1913
1953
|
className: styles.caption,
|
|
1914
1954
|
style: {
|
|
1915
|
-
...getPositionStyles(caption2.alignment, caption2.offset),
|
|
1955
|
+
...getPositionStyles(caption2.alignment, caption2.offset, isEditor),
|
|
1916
1956
|
["--link-hover-color"]: caption2.hover
|
|
1917
1957
|
},
|
|
1958
|
+
onClick: (e) => e.stopPropagation(),
|
|
1918
1959
|
children: /* @__PURE__ */ jsxRuntime.jsx(RichTextRenderer, { content: content[currentIndex].imageCaption })
|
|
1919
1960
|
}
|
|
1920
1961
|
),
|
|
@@ -1932,9 +1973,7 @@ const Lightbox = ({ isOpen, onClose, content, settings, closeOnBackdropClick = t
|
|
|
1932
1973
|
),
|
|
1933
1974
|
style: {
|
|
1934
1975
|
gap: `${thumbnail.grid.gap}px`,
|
|
1935
|
-
...
|
|
1936
|
-
...slider.direction === "vert" ? { width: `${thumbnail.grid.width}px` } : {},
|
|
1937
|
-
...getPositionStyles(thumbnail.position, thumbnail.offset)
|
|
1976
|
+
...getPositionStyles(thumbnail.position, thumbnail.offset, isEditor)
|
|
1938
1977
|
},
|
|
1939
1978
|
children: content.map((item, index) => {
|
|
1940
1979
|
const isActive = index === currentIndex;
|
|
@@ -1943,11 +1982,13 @@ const Lightbox = ({ isOpen, onClose, content, settings, closeOnBackdropClick = t
|
|
|
1943
1982
|
{
|
|
1944
1983
|
className: styles.thumbItem,
|
|
1945
1984
|
style: {
|
|
1946
|
-
|
|
1947
|
-
...slider.direction === "
|
|
1948
|
-
...slider.direction === "
|
|
1949
|
-
|
|
1950
|
-
|
|
1985
|
+
...slider.direction === "horiz" ? { height: isActive ? `${thumbnail.grid.height * (isActive ? thumbnail.activeState.scale : 1)}px` : `${thumbnail.grid.height}px` } : {},
|
|
1986
|
+
...slider.direction === "vert" ? { width: isActive ? `${thumbnail.grid.width * (isActive ? thumbnail.activeState.scale : 1)}px` : `${thumbnail.grid.width}px` } : {},
|
|
1987
|
+
...thumbnail.fit === "cover" && slider.direction === "horiz" ? { width: isActive ? `${thumbnail.grid.width * (isActive ? thumbnail.activeState.scale : 1)}px` : `${thumbnail.grid.width}px` } : {},
|
|
1988
|
+
...thumbnail.fit === "cover" && slider.direction === "vert" ? { height: isActive ? `${thumbnail.grid.height * (isActive ? thumbnail.activeState.scale : 1)}px` : `${thumbnail.grid.height}px` } : {},
|
|
1989
|
+
transition: isActive ? "all 0.2s ease" : "none",
|
|
1990
|
+
opacity: isActive ? thumbnail.activeState.opacity / 100 : thumbnail.opacity / 100,
|
|
1991
|
+
["--thumb-hover"]: thumbnail.activeState.opacity / 100
|
|
1951
1992
|
},
|
|
1952
1993
|
onClick: (e) => {
|
|
1953
1994
|
var _a;
|
|
@@ -1965,8 +2006,7 @@ const Lightbox = ({ isOpen, onClose, content, settings, closeOnBackdropClick = t
|
|
|
1965
2006
|
objectFit: thumbnail.fit === "cover" ? "cover" : "contain",
|
|
1966
2007
|
...thumbnail.fit === "fit" && slider.direction === "horiz" ? { width: "fit-content" } : {},
|
|
1967
2008
|
...thumbnail.fit === "fit" && slider.direction === "vert" ? { height: "fit-content" } : {},
|
|
1968
|
-
...slider.direction === "horiz" ? {
|
|
1969
|
-
...slider.direction === "vert" ? { width: "100%", height: "auto" } : {}
|
|
2009
|
+
...thumbnail.fit === "cover" && slider.direction === "horiz" ? { width: "100%", height: "100%" } : {}
|
|
1970
2010
|
}
|
|
1971
2011
|
}
|
|
1972
2012
|
)
|
|
@@ -2020,6 +2060,7 @@ const LightboxComponent = {
|
|
|
2020
2060
|
url: {
|
|
2021
2061
|
type: "string",
|
|
2022
2062
|
display: {
|
|
2063
|
+
mode: "cover",
|
|
2023
2064
|
type: "settings-image-input"
|
|
2024
2065
|
}
|
|
2025
2066
|
}
|
|
@@ -2092,14 +2133,6 @@ const LightboxComponent = {
|
|
|
2092
2133
|
type: "ratio-group"
|
|
2093
2134
|
},
|
|
2094
2135
|
enum: ["image", "50/50"]
|
|
2095
|
-
},
|
|
2096
|
-
duration: {
|
|
2097
|
-
type: "string",
|
|
2098
|
-
label: "T",
|
|
2099
|
-
display: {
|
|
2100
|
-
type: "step-selector"
|
|
2101
|
-
},
|
|
2102
|
-
enum: ["100ms", "250ms", "500ms", "1000ms", "1500ms", "2000ms"]
|
|
2103
2136
|
}
|
|
2104
2137
|
}
|
|
2105
2138
|
},
|
|
@@ -2122,6 +2155,14 @@ const LightboxComponent = {
|
|
|
2122
2155
|
type: "ratio-group"
|
|
2123
2156
|
},
|
|
2124
2157
|
enum: ["horiz", "vert"]
|
|
2158
|
+
},
|
|
2159
|
+
duration: {
|
|
2160
|
+
type: "string",
|
|
2161
|
+
label: "T",
|
|
2162
|
+
display: {
|
|
2163
|
+
type: "step-selector"
|
|
2164
|
+
},
|
|
2165
|
+
enum: ["100ms", "250ms", "500ms", "1000ms", "1500ms", "2000ms"]
|
|
2125
2166
|
}
|
|
2126
2167
|
}
|
|
2127
2168
|
},
|
|
@@ -2203,15 +2244,28 @@ const LightboxComponent = {
|
|
|
2203
2244
|
},
|
|
2204
2245
|
offset: {
|
|
2205
2246
|
type: "object",
|
|
2247
|
+
title: "Offset",
|
|
2206
2248
|
display: {
|
|
2207
|
-
type: "
|
|
2249
|
+
type: "group"
|
|
2208
2250
|
},
|
|
2209
2251
|
properties: {
|
|
2210
2252
|
x: {
|
|
2211
|
-
type: "number"
|
|
2253
|
+
type: "number",
|
|
2254
|
+
label: "X",
|
|
2255
|
+
scalingEnabled: true,
|
|
2256
|
+
display: {
|
|
2257
|
+
type: "numeric-input",
|
|
2258
|
+
visible: true
|
|
2259
|
+
}
|
|
2212
2260
|
},
|
|
2213
2261
|
y: {
|
|
2214
|
-
type: "number"
|
|
2262
|
+
type: "number",
|
|
2263
|
+
label: "Y",
|
|
2264
|
+
scalingEnabled: true,
|
|
2265
|
+
display: {
|
|
2266
|
+
type: "numeric-input",
|
|
2267
|
+
visible: true
|
|
2268
|
+
}
|
|
2215
2269
|
}
|
|
2216
2270
|
}
|
|
2217
2271
|
},
|
|
@@ -2236,7 +2290,7 @@ const LightboxComponent = {
|
|
|
2236
2290
|
scale: {
|
|
2237
2291
|
type: "number",
|
|
2238
2292
|
title: "Scale",
|
|
2239
|
-
min:
|
|
2293
|
+
min: 1,
|
|
2240
2294
|
max: 5,
|
|
2241
2295
|
step: 0.1,
|
|
2242
2296
|
display: {
|
|
@@ -2273,15 +2327,28 @@ const LightboxComponent = {
|
|
|
2273
2327
|
},
|
|
2274
2328
|
offset: {
|
|
2275
2329
|
type: "object",
|
|
2330
|
+
title: "Offset",
|
|
2276
2331
|
display: {
|
|
2277
|
-
type: "
|
|
2332
|
+
type: "group"
|
|
2278
2333
|
},
|
|
2279
2334
|
properties: {
|
|
2280
2335
|
x: {
|
|
2281
|
-
type: "number"
|
|
2336
|
+
type: "number",
|
|
2337
|
+
label: "X",
|
|
2338
|
+
scalingEnabled: true,
|
|
2339
|
+
display: {
|
|
2340
|
+
type: "numeric-input",
|
|
2341
|
+
visible: true
|
|
2342
|
+
}
|
|
2282
2343
|
},
|
|
2283
2344
|
y: {
|
|
2284
|
-
type: "number"
|
|
2345
|
+
type: "number",
|
|
2346
|
+
label: "Y",
|
|
2347
|
+
scalingEnabled: true,
|
|
2348
|
+
display: {
|
|
2349
|
+
type: "numeric-input",
|
|
2350
|
+
visible: true
|
|
2351
|
+
}
|
|
2285
2352
|
}
|
|
2286
2353
|
}
|
|
2287
2354
|
},
|
|
@@ -2327,16 +2394,29 @@ const LightboxComponent = {
|
|
|
2327
2394
|
}
|
|
2328
2395
|
},
|
|
2329
2396
|
offset: {
|
|
2397
|
+
title: "Offset",
|
|
2330
2398
|
type: "object",
|
|
2331
2399
|
display: {
|
|
2332
|
-
type: "
|
|
2400
|
+
type: "group"
|
|
2333
2401
|
},
|
|
2334
2402
|
properties: {
|
|
2335
2403
|
x: {
|
|
2336
|
-
type: "number"
|
|
2404
|
+
type: "number",
|
|
2405
|
+
label: "X",
|
|
2406
|
+
scalingEnabled: true,
|
|
2407
|
+
display: {
|
|
2408
|
+
type: "numeric-input",
|
|
2409
|
+
visible: true
|
|
2410
|
+
}
|
|
2337
2411
|
},
|
|
2338
2412
|
y: {
|
|
2339
|
-
type: "number"
|
|
2413
|
+
type: "number",
|
|
2414
|
+
label: "Y",
|
|
2415
|
+
scalingEnabled: true,
|
|
2416
|
+
display: {
|
|
2417
|
+
type: "numeric-input",
|
|
2418
|
+
visible: true
|
|
2419
|
+
}
|
|
2340
2420
|
}
|
|
2341
2421
|
}
|
|
2342
2422
|
},
|
|
@@ -2415,15 +2495,28 @@ const LightboxComponent = {
|
|
|
2415
2495
|
},
|
|
2416
2496
|
closeIconOffset: {
|
|
2417
2497
|
type: "object",
|
|
2498
|
+
title: "Offset",
|
|
2418
2499
|
display: {
|
|
2419
|
-
type: "
|
|
2500
|
+
type: "group"
|
|
2420
2501
|
},
|
|
2421
2502
|
properties: {
|
|
2422
2503
|
x: {
|
|
2423
|
-
type: "number"
|
|
2504
|
+
type: "number",
|
|
2505
|
+
label: "X",
|
|
2506
|
+
scalingEnabled: true,
|
|
2507
|
+
display: {
|
|
2508
|
+
type: "numeric-input",
|
|
2509
|
+
visible: true
|
|
2510
|
+
}
|
|
2424
2511
|
},
|
|
2425
2512
|
y: {
|
|
2426
|
-
type: "number"
|
|
2513
|
+
type: "number",
|
|
2514
|
+
label: "Y",
|
|
2515
|
+
scalingEnabled: true,
|
|
2516
|
+
display: {
|
|
2517
|
+
type: "numeric-input",
|
|
2518
|
+
visible: true
|
|
2519
|
+
}
|
|
2427
2520
|
}
|
|
2428
2521
|
}
|
|
2429
2522
|
}
|
|
@@ -2449,16 +2542,29 @@ const LightboxComponent = {
|
|
|
2449
2542
|
enum: ["top-left", "top-center", "top-right", "middle-left", "middle-center", "middle-right", "bottom-left", "bottom-center", "bottom-right"]
|
|
2450
2543
|
},
|
|
2451
2544
|
offset: {
|
|
2545
|
+
title: "Offset",
|
|
2452
2546
|
type: "object",
|
|
2453
2547
|
display: {
|
|
2454
|
-
type: "
|
|
2548
|
+
type: "group"
|
|
2455
2549
|
},
|
|
2456
2550
|
properties: {
|
|
2457
2551
|
x: {
|
|
2458
|
-
type: "number"
|
|
2552
|
+
type: "number",
|
|
2553
|
+
label: "X",
|
|
2554
|
+
scalingEnabled: true,
|
|
2555
|
+
display: {
|
|
2556
|
+
type: "numeric-input",
|
|
2557
|
+
visible: true
|
|
2558
|
+
}
|
|
2459
2559
|
},
|
|
2460
2560
|
y: {
|
|
2461
|
-
type: "number"
|
|
2561
|
+
type: "number",
|
|
2562
|
+
label: "Y",
|
|
2563
|
+
scalingEnabled: true,
|
|
2564
|
+
display: {
|
|
2565
|
+
type: "numeric-input",
|
|
2566
|
+
visible: true
|
|
2567
|
+
}
|
|
2462
2568
|
}
|
|
2463
2569
|
}
|
|
2464
2570
|
},
|
|
@@ -2490,12 +2596,12 @@ const LightboxComponent = {
|
|
|
2490
2596
|
},
|
|
2491
2597
|
triggers: {
|
|
2492
2598
|
type: "click",
|
|
2493
|
-
switch: "image"
|
|
2494
|
-
duration: "2000ms"
|
|
2599
|
+
switch: "image"
|
|
2495
2600
|
},
|
|
2496
2601
|
slider: {
|
|
2497
2602
|
type: "fade",
|
|
2498
|
-
direction: "horiz"
|
|
2603
|
+
direction: "horiz",
|
|
2604
|
+
duration: "1000ms"
|
|
2499
2605
|
},
|
|
2500
2606
|
thumbnail: {
|
|
2501
2607
|
isActive: true,
|
|
@@ -2631,7 +2737,7 @@ const LightboxComponent = {
|
|
|
2631
2737
|
value: "click"
|
|
2632
2738
|
},
|
|
2633
2739
|
then: {
|
|
2634
|
-
name: "properties.lightboxBlock.properties.
|
|
2740
|
+
name: "properties.lightboxBlock.properties.slider.properties.duration.display.visible",
|
|
2635
2741
|
value: true
|
|
2636
2742
|
}
|
|
2637
2743
|
},
|
|
@@ -2641,7 +2747,7 @@ const LightboxComponent = {
|
|
|
2641
2747
|
value: "click"
|
|
2642
2748
|
},
|
|
2643
2749
|
then: {
|
|
2644
|
-
name: "properties.lightboxBlock.properties.
|
|
2750
|
+
name: "properties.lightboxBlock.properties.slider.properties.switch.display.visible",
|
|
2645
2751
|
value: true
|
|
2646
2752
|
}
|
|
2647
2753
|
},
|
|
@@ -2651,7 +2757,7 @@ const LightboxComponent = {
|
|
|
2651
2757
|
value: "drag"
|
|
2652
2758
|
},
|
|
2653
2759
|
then: {
|
|
2654
|
-
name: "properties.lightboxBlock.properties.
|
|
2760
|
+
name: "properties.lightboxBlock.properties.slider.properties.duration.display.visible",
|
|
2655
2761
|
value: false
|
|
2656
2762
|
}
|
|
2657
2763
|
},
|
|
@@ -2661,7 +2767,7 @@ const LightboxComponent = {
|
|
|
2661
2767
|
value: "drag"
|
|
2662
2768
|
},
|
|
2663
2769
|
then: {
|
|
2664
|
-
name: "properties.lightboxBlock.properties.
|
|
2770
|
+
name: "properties.lightboxBlock.properties.slider.properties.switch.display.visible",
|
|
2665
2771
|
value: false
|
|
2666
2772
|
}
|
|
2667
2773
|
}
|
package/dist/index.mjs
CHANGED
|
@@ -563,15 +563,28 @@ const ControlSliderComponent = {
|
|
|
563
563
|
},
|
|
564
564
|
offset: {
|
|
565
565
|
type: "object",
|
|
566
|
+
title: "Offset",
|
|
566
567
|
display: {
|
|
567
|
-
type: "
|
|
568
|
+
type: "group"
|
|
568
569
|
},
|
|
569
570
|
properties: {
|
|
570
571
|
x: {
|
|
571
|
-
type: "number"
|
|
572
|
+
type: "number",
|
|
573
|
+
label: "X",
|
|
574
|
+
scalingEnabled: true,
|
|
575
|
+
display: {
|
|
576
|
+
type: "numeric-input",
|
|
577
|
+
visible: true
|
|
578
|
+
}
|
|
572
579
|
},
|
|
573
580
|
y: {
|
|
574
|
-
type: "number"
|
|
581
|
+
type: "number",
|
|
582
|
+
label: "Y",
|
|
583
|
+
scalingEnabled: true,
|
|
584
|
+
display: {
|
|
585
|
+
type: "numeric-input",
|
|
586
|
+
visible: true
|
|
587
|
+
}
|
|
575
588
|
}
|
|
576
589
|
}
|
|
577
590
|
},
|
|
@@ -624,15 +637,28 @@ const ControlSliderComponent = {
|
|
|
624
637
|
},
|
|
625
638
|
offset: {
|
|
626
639
|
type: "object",
|
|
640
|
+
title: "Offset",
|
|
627
641
|
display: {
|
|
628
|
-
type: "
|
|
642
|
+
type: "group"
|
|
629
643
|
},
|
|
630
644
|
properties: {
|
|
631
645
|
x: {
|
|
632
|
-
type: "number"
|
|
646
|
+
type: "number",
|
|
647
|
+
label: "X",
|
|
648
|
+
scalingEnabled: true,
|
|
649
|
+
display: {
|
|
650
|
+
type: "numeric-input",
|
|
651
|
+
visible: true
|
|
652
|
+
}
|
|
633
653
|
},
|
|
634
654
|
y: {
|
|
635
|
-
type: "number"
|
|
655
|
+
type: "number",
|
|
656
|
+
label: "Y",
|
|
657
|
+
scalingEnabled: true,
|
|
658
|
+
display: {
|
|
659
|
+
type: "numeric-input",
|
|
660
|
+
visible: true
|
|
661
|
+
}
|
|
636
662
|
}
|
|
637
663
|
}
|
|
638
664
|
},
|
|
@@ -688,14 +714,26 @@ const ControlSliderComponent = {
|
|
|
688
714
|
offset: {
|
|
689
715
|
type: "object",
|
|
690
716
|
display: {
|
|
691
|
-
type: "
|
|
717
|
+
type: "group"
|
|
692
718
|
},
|
|
693
719
|
properties: {
|
|
694
720
|
x: {
|
|
695
|
-
type: "number"
|
|
721
|
+
type: "number",
|
|
722
|
+
label: "X",
|
|
723
|
+
scalingEnabled: true,
|
|
724
|
+
display: {
|
|
725
|
+
type: "numeric-input",
|
|
726
|
+
visible: true
|
|
727
|
+
}
|
|
696
728
|
},
|
|
697
729
|
y: {
|
|
698
|
-
type: "number"
|
|
730
|
+
type: "number",
|
|
731
|
+
label: "Y",
|
|
732
|
+
scalingEnabled: true,
|
|
733
|
+
display: {
|
|
734
|
+
type: "numeric-input",
|
|
735
|
+
visible: true
|
|
736
|
+
}
|
|
699
737
|
}
|
|
700
738
|
}
|
|
701
739
|
},
|
|
@@ -1503,7 +1541,7 @@ const styles = {
|
|
|
1503
1541
|
slideInBottom,
|
|
1504
1542
|
scaleSlide
|
|
1505
1543
|
};
|
|
1506
|
-
const getPositionStyles = (position, offset) => {
|
|
1544
|
+
const getPositionStyles = (position, offset, isEditor) => {
|
|
1507
1545
|
const styles2 = {};
|
|
1508
1546
|
const [vertical, horizontal] = position.split("-");
|
|
1509
1547
|
if (vertical === "top") {
|
|
@@ -1527,13 +1565,13 @@ const getPositionStyles = (position, offset) => {
|
|
|
1527
1565
|
styles2.right = "0";
|
|
1528
1566
|
}
|
|
1529
1567
|
if (vertical === "middle" && horizontal === "center") {
|
|
1530
|
-
styles2.transform = `translate(calc(-50% + ${offset.x}
|
|
1568
|
+
styles2.transform = `translate(calc(-50% + ${scalingValue(offset.x, isEditor)}), calc(-50% + ${scalingValue(offset.y, isEditor)}))`;
|
|
1531
1569
|
} else if (vertical === "middle") {
|
|
1532
|
-
styles2.transform = `translate(${offset.x}
|
|
1570
|
+
styles2.transform = `translate(${scalingValue(offset.x, isEditor)}, calc(-50% + ${scalingValue(offset.y, isEditor)}))`;
|
|
1533
1571
|
} else if (horizontal === "center") {
|
|
1534
|
-
styles2.transform = `translate(calc(-50% + ${offset.x}
|
|
1572
|
+
styles2.transform = `translate(calc(-50% + ${scalingValue(offset.x, isEditor)}), ${scalingValue(offset.y, isEditor)})`;
|
|
1535
1573
|
} else {
|
|
1536
|
-
styles2.transform = `translate(${offset.x}
|
|
1574
|
+
styles2.transform = `translate(${scalingValue(offset.x, isEditor)}, ${scalingValue(offset.y, isEditor)})`;
|
|
1537
1575
|
}
|
|
1538
1576
|
return styles2;
|
|
1539
1577
|
};
|
|
@@ -1671,8 +1709,10 @@ const Lightbox = ({ isOpen, onClose, content, settings, closeOnBackdropClick = t
|
|
|
1671
1709
|
const containerAspectRatio = containerWidth / containerHeight;
|
|
1672
1710
|
if (imageAspectRatio > containerAspectRatio) {
|
|
1673
1711
|
img2.style.width = "100%";
|
|
1712
|
+
img2.style.height = "";
|
|
1674
1713
|
} else {
|
|
1675
1714
|
img2.style.height = "100%";
|
|
1715
|
+
img2.style.width = "";
|
|
1676
1716
|
}
|
|
1677
1717
|
};
|
|
1678
1718
|
if (img2.complete) {
|
|
@@ -1769,8 +1809,8 @@ const Lightbox = ({ isOpen, onClose, content, settings, closeOnBackdropClick = t
|
|
|
1769
1809
|
animationDuration: `${appearDurationMs}ms`,
|
|
1770
1810
|
animationTimingFunction: "ease",
|
|
1771
1811
|
animationFillMode: "both",
|
|
1772
|
-
...appear.type === "mix" && { animationDelay: `${backdropDurationMs}ms` },
|
|
1773
|
-
"--splide-speed":
|
|
1812
|
+
...appear.type === "mix" && { animationDelay: `${backdropDurationMs / 2}ms` },
|
|
1813
|
+
"--splide-speed": slider.duration || "500ms"
|
|
1774
1814
|
},
|
|
1775
1815
|
children: [
|
|
1776
1816
|
/* @__PURE__ */ jsx(
|
|
@@ -1783,7 +1823,7 @@ const Lightbox = ({ isOpen, onClose, content, settings, closeOnBackdropClick = t
|
|
|
1783
1823
|
className: styles.lightboxSplide,
|
|
1784
1824
|
options: {
|
|
1785
1825
|
arrows: false,
|
|
1786
|
-
speed:
|
|
1826
|
+
speed: slider.duration ? parseInt(slider.duration) : 500,
|
|
1787
1827
|
direction: slider.direction === "horiz" || slider.type === "fade" || slider.type === "scale" ? "ltr" : "ttb",
|
|
1788
1828
|
pagination: false,
|
|
1789
1829
|
drag: triggers.type === "drag",
|
|
@@ -1794,9 +1834,9 @@ const Lightbox = ({ isOpen, onClose, content, settings, closeOnBackdropClick = t
|
|
|
1794
1834
|
padding: 0,
|
|
1795
1835
|
rewind: (slider.type === "scale" || slider.type === "fade") && appear.repeat !== "close"
|
|
1796
1836
|
},
|
|
1797
|
-
style: { "--splide-speed":
|
|
1837
|
+
style: { "--splide-speed": slider.duration || "500ms" },
|
|
1798
1838
|
children: content.map((item, index) => {
|
|
1799
|
-
const positionStyles = getPositionStyles(layout.position, layout.offset);
|
|
1839
|
+
const positionStyles = getPositionStyles(layout.position, layout.offset, isEditor);
|
|
1800
1840
|
const imageStyle2 = slider.type === "scale" ? (() => {
|
|
1801
1841
|
const { transform, ...restStyles } = positionStyles;
|
|
1802
1842
|
return {
|
|
@@ -1809,7 +1849,7 @@ const Lightbox = ({ isOpen, onClose, content, settings, closeOnBackdropClick = t
|
|
|
1809
1849
|
{
|
|
1810
1850
|
className: styles.imgWrapper,
|
|
1811
1851
|
onClick: handleImageWrapperClick,
|
|
1812
|
-
style: { padding:
|
|
1852
|
+
style: { padding: scalingValue(layout.padding.top, isEditor) + " " + scalingValue(layout.padding.right, isEditor) + " " + scalingValue(layout.padding.bottom, isEditor) + " " + scalingValue(layout.padding.left, isEditor) },
|
|
1813
1853
|
children: /* @__PURE__ */ jsx(
|
|
1814
1854
|
"img",
|
|
1815
1855
|
{
|
|
@@ -1840,7 +1880,7 @@ const Lightbox = ({ isOpen, onClose, content, settings, closeOnBackdropClick = t
|
|
|
1840
1880
|
{
|
|
1841
1881
|
className: styles.arrowInner,
|
|
1842
1882
|
style: {
|
|
1843
|
-
transform: `translate(${scalingValue(controls.offset.x)}, ${scalingValue(controls.offset.y * (slider.direction === "horiz" ? 1 : -1))}) scale(${controls.scale}) rotate(${slider.direction === "horiz" ? "0deg" : "90deg"})`
|
|
1883
|
+
transform: `translate(${scalingValue(controls.offset.x, isEditor)}, ${scalingValue(controls.offset.y * (slider.direction === "horiz" ? 1 : -1), isEditor)}) scale(${controls.scale}) rotate(${slider.direction === "horiz" ? "0deg" : "90deg"})`
|
|
1844
1884
|
},
|
|
1845
1885
|
onClick: (e) => {
|
|
1846
1886
|
handleArrowClick("-1");
|
|
@@ -1868,7 +1908,7 @@ const Lightbox = ({ isOpen, onClose, content, settings, closeOnBackdropClick = t
|
|
|
1868
1908
|
{
|
|
1869
1909
|
className: styles.arrowInner,
|
|
1870
1910
|
style: {
|
|
1871
|
-
transform: `translate(${scalingValue(controls.offset.x * (slider.direction === "horiz" ? -1 : 1))}, ${scalingValue(controls.offset.y)}) scale(${controls.scale}) rotate(${slider.direction === "horiz" ? "0deg" : "90deg"})`
|
|
1911
|
+
transform: `translate(${scalingValue(controls.offset.x * (slider.direction === "horiz" ? -1 : 1), isEditor)}, ${scalingValue(controls.offset.y, isEditor)}) scale(${controls.scale}) rotate(${slider.direction === "horiz" ? "0deg" : "90deg"})`
|
|
1872
1912
|
},
|
|
1873
1913
|
onClick: (e) => {
|
|
1874
1914
|
handleArrowClick("+1");
|
|
@@ -1889,7 +1929,7 @@ const Lightbox = ({ isOpen, onClose, content, settings, closeOnBackdropClick = t
|
|
|
1889
1929
|
)
|
|
1890
1930
|
] }),
|
|
1891
1931
|
area.closeIconUrl && (() => {
|
|
1892
|
-
const positionStyles = getPositionStyles(area.closeIconAlign, area.closeIconOffset);
|
|
1932
|
+
const positionStyles = getPositionStyles(area.closeIconAlign, area.closeIconOffset, isEditor);
|
|
1893
1933
|
const scaleTransform = `scale(${area.closeIconScale})`;
|
|
1894
1934
|
const combinedTransform = positionStyles.transform ? `${positionStyles.transform} ${scaleTransform}` : scaleTransform;
|
|
1895
1935
|
return /* @__PURE__ */ jsx(
|
|
@@ -1910,9 +1950,10 @@ const Lightbox = ({ isOpen, onClose, content, settings, closeOnBackdropClick = t
|
|
|
1910
1950
|
{
|
|
1911
1951
|
className: styles.caption,
|
|
1912
1952
|
style: {
|
|
1913
|
-
...getPositionStyles(caption2.alignment, caption2.offset),
|
|
1953
|
+
...getPositionStyles(caption2.alignment, caption2.offset, isEditor),
|
|
1914
1954
|
["--link-hover-color"]: caption2.hover
|
|
1915
1955
|
},
|
|
1956
|
+
onClick: (e) => e.stopPropagation(),
|
|
1916
1957
|
children: /* @__PURE__ */ jsx(RichTextRenderer, { content: content[currentIndex].imageCaption })
|
|
1917
1958
|
}
|
|
1918
1959
|
),
|
|
@@ -1930,9 +1971,7 @@ const Lightbox = ({ isOpen, onClose, content, settings, closeOnBackdropClick = t
|
|
|
1930
1971
|
),
|
|
1931
1972
|
style: {
|
|
1932
1973
|
gap: `${thumbnail.grid.gap}px`,
|
|
1933
|
-
...
|
|
1934
|
-
...slider.direction === "vert" ? { width: `${thumbnail.grid.width}px` } : {},
|
|
1935
|
-
...getPositionStyles(thumbnail.position, thumbnail.offset)
|
|
1974
|
+
...getPositionStyles(thumbnail.position, thumbnail.offset, isEditor)
|
|
1936
1975
|
},
|
|
1937
1976
|
children: content.map((item, index) => {
|
|
1938
1977
|
const isActive = index === currentIndex;
|
|
@@ -1941,11 +1980,13 @@ const Lightbox = ({ isOpen, onClose, content, settings, closeOnBackdropClick = t
|
|
|
1941
1980
|
{
|
|
1942
1981
|
className: styles.thumbItem,
|
|
1943
1982
|
style: {
|
|
1944
|
-
|
|
1945
|
-
...slider.direction === "
|
|
1946
|
-
...slider.direction === "
|
|
1947
|
-
|
|
1948
|
-
|
|
1983
|
+
...slider.direction === "horiz" ? { height: isActive ? `${thumbnail.grid.height * (isActive ? thumbnail.activeState.scale : 1)}px` : `${thumbnail.grid.height}px` } : {},
|
|
1984
|
+
...slider.direction === "vert" ? { width: isActive ? `${thumbnail.grid.width * (isActive ? thumbnail.activeState.scale : 1)}px` : `${thumbnail.grid.width}px` } : {},
|
|
1985
|
+
...thumbnail.fit === "cover" && slider.direction === "horiz" ? { width: isActive ? `${thumbnail.grid.width * (isActive ? thumbnail.activeState.scale : 1)}px` : `${thumbnail.grid.width}px` } : {},
|
|
1986
|
+
...thumbnail.fit === "cover" && slider.direction === "vert" ? { height: isActive ? `${thumbnail.grid.height * (isActive ? thumbnail.activeState.scale : 1)}px` : `${thumbnail.grid.height}px` } : {},
|
|
1987
|
+
transition: isActive ? "all 0.2s ease" : "none",
|
|
1988
|
+
opacity: isActive ? thumbnail.activeState.opacity / 100 : thumbnail.opacity / 100,
|
|
1989
|
+
["--thumb-hover"]: thumbnail.activeState.opacity / 100
|
|
1949
1990
|
},
|
|
1950
1991
|
onClick: (e) => {
|
|
1951
1992
|
var _a;
|
|
@@ -1963,8 +2004,7 @@ const Lightbox = ({ isOpen, onClose, content, settings, closeOnBackdropClick = t
|
|
|
1963
2004
|
objectFit: thumbnail.fit === "cover" ? "cover" : "contain",
|
|
1964
2005
|
...thumbnail.fit === "fit" && slider.direction === "horiz" ? { width: "fit-content" } : {},
|
|
1965
2006
|
...thumbnail.fit === "fit" && slider.direction === "vert" ? { height: "fit-content" } : {},
|
|
1966
|
-
...slider.direction === "horiz" ? {
|
|
1967
|
-
...slider.direction === "vert" ? { width: "100%", height: "auto" } : {}
|
|
2007
|
+
...thumbnail.fit === "cover" && slider.direction === "horiz" ? { width: "100%", height: "100%" } : {}
|
|
1968
2008
|
}
|
|
1969
2009
|
}
|
|
1970
2010
|
)
|
|
@@ -2018,6 +2058,7 @@ const LightboxComponent = {
|
|
|
2018
2058
|
url: {
|
|
2019
2059
|
type: "string",
|
|
2020
2060
|
display: {
|
|
2061
|
+
mode: "cover",
|
|
2021
2062
|
type: "settings-image-input"
|
|
2022
2063
|
}
|
|
2023
2064
|
}
|
|
@@ -2090,14 +2131,6 @@ const LightboxComponent = {
|
|
|
2090
2131
|
type: "ratio-group"
|
|
2091
2132
|
},
|
|
2092
2133
|
enum: ["image", "50/50"]
|
|
2093
|
-
},
|
|
2094
|
-
duration: {
|
|
2095
|
-
type: "string",
|
|
2096
|
-
label: "T",
|
|
2097
|
-
display: {
|
|
2098
|
-
type: "step-selector"
|
|
2099
|
-
},
|
|
2100
|
-
enum: ["100ms", "250ms", "500ms", "1000ms", "1500ms", "2000ms"]
|
|
2101
2134
|
}
|
|
2102
2135
|
}
|
|
2103
2136
|
},
|
|
@@ -2120,6 +2153,14 @@ const LightboxComponent = {
|
|
|
2120
2153
|
type: "ratio-group"
|
|
2121
2154
|
},
|
|
2122
2155
|
enum: ["horiz", "vert"]
|
|
2156
|
+
},
|
|
2157
|
+
duration: {
|
|
2158
|
+
type: "string",
|
|
2159
|
+
label: "T",
|
|
2160
|
+
display: {
|
|
2161
|
+
type: "step-selector"
|
|
2162
|
+
},
|
|
2163
|
+
enum: ["100ms", "250ms", "500ms", "1000ms", "1500ms", "2000ms"]
|
|
2123
2164
|
}
|
|
2124
2165
|
}
|
|
2125
2166
|
},
|
|
@@ -2201,15 +2242,28 @@ const LightboxComponent = {
|
|
|
2201
2242
|
},
|
|
2202
2243
|
offset: {
|
|
2203
2244
|
type: "object",
|
|
2245
|
+
title: "Offset",
|
|
2204
2246
|
display: {
|
|
2205
|
-
type: "
|
|
2247
|
+
type: "group"
|
|
2206
2248
|
},
|
|
2207
2249
|
properties: {
|
|
2208
2250
|
x: {
|
|
2209
|
-
type: "number"
|
|
2251
|
+
type: "number",
|
|
2252
|
+
label: "X",
|
|
2253
|
+
scalingEnabled: true,
|
|
2254
|
+
display: {
|
|
2255
|
+
type: "numeric-input",
|
|
2256
|
+
visible: true
|
|
2257
|
+
}
|
|
2210
2258
|
},
|
|
2211
2259
|
y: {
|
|
2212
|
-
type: "number"
|
|
2260
|
+
type: "number",
|
|
2261
|
+
label: "Y",
|
|
2262
|
+
scalingEnabled: true,
|
|
2263
|
+
display: {
|
|
2264
|
+
type: "numeric-input",
|
|
2265
|
+
visible: true
|
|
2266
|
+
}
|
|
2213
2267
|
}
|
|
2214
2268
|
}
|
|
2215
2269
|
},
|
|
@@ -2234,7 +2288,7 @@ const LightboxComponent = {
|
|
|
2234
2288
|
scale: {
|
|
2235
2289
|
type: "number",
|
|
2236
2290
|
title: "Scale",
|
|
2237
|
-
min:
|
|
2291
|
+
min: 1,
|
|
2238
2292
|
max: 5,
|
|
2239
2293
|
step: 0.1,
|
|
2240
2294
|
display: {
|
|
@@ -2271,15 +2325,28 @@ const LightboxComponent = {
|
|
|
2271
2325
|
},
|
|
2272
2326
|
offset: {
|
|
2273
2327
|
type: "object",
|
|
2328
|
+
title: "Offset",
|
|
2274
2329
|
display: {
|
|
2275
|
-
type: "
|
|
2330
|
+
type: "group"
|
|
2276
2331
|
},
|
|
2277
2332
|
properties: {
|
|
2278
2333
|
x: {
|
|
2279
|
-
type: "number"
|
|
2334
|
+
type: "number",
|
|
2335
|
+
label: "X",
|
|
2336
|
+
scalingEnabled: true,
|
|
2337
|
+
display: {
|
|
2338
|
+
type: "numeric-input",
|
|
2339
|
+
visible: true
|
|
2340
|
+
}
|
|
2280
2341
|
},
|
|
2281
2342
|
y: {
|
|
2282
|
-
type: "number"
|
|
2343
|
+
type: "number",
|
|
2344
|
+
label: "Y",
|
|
2345
|
+
scalingEnabled: true,
|
|
2346
|
+
display: {
|
|
2347
|
+
type: "numeric-input",
|
|
2348
|
+
visible: true
|
|
2349
|
+
}
|
|
2283
2350
|
}
|
|
2284
2351
|
}
|
|
2285
2352
|
},
|
|
@@ -2325,16 +2392,29 @@ const LightboxComponent = {
|
|
|
2325
2392
|
}
|
|
2326
2393
|
},
|
|
2327
2394
|
offset: {
|
|
2395
|
+
title: "Offset",
|
|
2328
2396
|
type: "object",
|
|
2329
2397
|
display: {
|
|
2330
|
-
type: "
|
|
2398
|
+
type: "group"
|
|
2331
2399
|
},
|
|
2332
2400
|
properties: {
|
|
2333
2401
|
x: {
|
|
2334
|
-
type: "number"
|
|
2402
|
+
type: "number",
|
|
2403
|
+
label: "X",
|
|
2404
|
+
scalingEnabled: true,
|
|
2405
|
+
display: {
|
|
2406
|
+
type: "numeric-input",
|
|
2407
|
+
visible: true
|
|
2408
|
+
}
|
|
2335
2409
|
},
|
|
2336
2410
|
y: {
|
|
2337
|
-
type: "number"
|
|
2411
|
+
type: "number",
|
|
2412
|
+
label: "Y",
|
|
2413
|
+
scalingEnabled: true,
|
|
2414
|
+
display: {
|
|
2415
|
+
type: "numeric-input",
|
|
2416
|
+
visible: true
|
|
2417
|
+
}
|
|
2338
2418
|
}
|
|
2339
2419
|
}
|
|
2340
2420
|
},
|
|
@@ -2413,15 +2493,28 @@ const LightboxComponent = {
|
|
|
2413
2493
|
},
|
|
2414
2494
|
closeIconOffset: {
|
|
2415
2495
|
type: "object",
|
|
2496
|
+
title: "Offset",
|
|
2416
2497
|
display: {
|
|
2417
|
-
type: "
|
|
2498
|
+
type: "group"
|
|
2418
2499
|
},
|
|
2419
2500
|
properties: {
|
|
2420
2501
|
x: {
|
|
2421
|
-
type: "number"
|
|
2502
|
+
type: "number",
|
|
2503
|
+
label: "X",
|
|
2504
|
+
scalingEnabled: true,
|
|
2505
|
+
display: {
|
|
2506
|
+
type: "numeric-input",
|
|
2507
|
+
visible: true
|
|
2508
|
+
}
|
|
2422
2509
|
},
|
|
2423
2510
|
y: {
|
|
2424
|
-
type: "number"
|
|
2511
|
+
type: "number",
|
|
2512
|
+
label: "Y",
|
|
2513
|
+
scalingEnabled: true,
|
|
2514
|
+
display: {
|
|
2515
|
+
type: "numeric-input",
|
|
2516
|
+
visible: true
|
|
2517
|
+
}
|
|
2425
2518
|
}
|
|
2426
2519
|
}
|
|
2427
2520
|
}
|
|
@@ -2447,16 +2540,29 @@ const LightboxComponent = {
|
|
|
2447
2540
|
enum: ["top-left", "top-center", "top-right", "middle-left", "middle-center", "middle-right", "bottom-left", "bottom-center", "bottom-right"]
|
|
2448
2541
|
},
|
|
2449
2542
|
offset: {
|
|
2543
|
+
title: "Offset",
|
|
2450
2544
|
type: "object",
|
|
2451
2545
|
display: {
|
|
2452
|
-
type: "
|
|
2546
|
+
type: "group"
|
|
2453
2547
|
},
|
|
2454
2548
|
properties: {
|
|
2455
2549
|
x: {
|
|
2456
|
-
type: "number"
|
|
2550
|
+
type: "number",
|
|
2551
|
+
label: "X",
|
|
2552
|
+
scalingEnabled: true,
|
|
2553
|
+
display: {
|
|
2554
|
+
type: "numeric-input",
|
|
2555
|
+
visible: true
|
|
2556
|
+
}
|
|
2457
2557
|
},
|
|
2458
2558
|
y: {
|
|
2459
|
-
type: "number"
|
|
2559
|
+
type: "number",
|
|
2560
|
+
label: "Y",
|
|
2561
|
+
scalingEnabled: true,
|
|
2562
|
+
display: {
|
|
2563
|
+
type: "numeric-input",
|
|
2564
|
+
visible: true
|
|
2565
|
+
}
|
|
2460
2566
|
}
|
|
2461
2567
|
}
|
|
2462
2568
|
},
|
|
@@ -2488,12 +2594,12 @@ const LightboxComponent = {
|
|
|
2488
2594
|
},
|
|
2489
2595
|
triggers: {
|
|
2490
2596
|
type: "click",
|
|
2491
|
-
switch: "image"
|
|
2492
|
-
duration: "2000ms"
|
|
2597
|
+
switch: "image"
|
|
2493
2598
|
},
|
|
2494
2599
|
slider: {
|
|
2495
2600
|
type: "fade",
|
|
2496
|
-
direction: "horiz"
|
|
2601
|
+
direction: "horiz",
|
|
2602
|
+
duration: "1000ms"
|
|
2497
2603
|
},
|
|
2498
2604
|
thumbnail: {
|
|
2499
2605
|
isActive: true,
|
|
@@ -2629,7 +2735,7 @@ const LightboxComponent = {
|
|
|
2629
2735
|
value: "click"
|
|
2630
2736
|
},
|
|
2631
2737
|
then: {
|
|
2632
|
-
name: "properties.lightboxBlock.properties.
|
|
2738
|
+
name: "properties.lightboxBlock.properties.slider.properties.duration.display.visible",
|
|
2633
2739
|
value: true
|
|
2634
2740
|
}
|
|
2635
2741
|
},
|
|
@@ -2639,7 +2745,7 @@ const LightboxComponent = {
|
|
|
2639
2745
|
value: "click"
|
|
2640
2746
|
},
|
|
2641
2747
|
then: {
|
|
2642
|
-
name: "properties.lightboxBlock.properties.
|
|
2748
|
+
name: "properties.lightboxBlock.properties.slider.properties.switch.display.visible",
|
|
2643
2749
|
value: true
|
|
2644
2750
|
}
|
|
2645
2751
|
},
|
|
@@ -2649,7 +2755,7 @@ const LightboxComponent = {
|
|
|
2649
2755
|
value: "drag"
|
|
2650
2756
|
},
|
|
2651
2757
|
then: {
|
|
2652
|
-
name: "properties.lightboxBlock.properties.
|
|
2758
|
+
name: "properties.lightboxBlock.properties.slider.properties.duration.display.visible",
|
|
2653
2759
|
value: false
|
|
2654
2760
|
}
|
|
2655
2761
|
},
|
|
@@ -2659,7 +2765,7 @@ const LightboxComponent = {
|
|
|
2659
2765
|
value: "drag"
|
|
2660
2766
|
},
|
|
2661
2767
|
then: {
|
|
2662
|
-
name: "properties.lightboxBlock.properties.
|
|
2768
|
+
name: "properties.lightboxBlock.properties.slider.properties.switch.display.visible",
|
|
2663
2769
|
value: false
|
|
2664
2770
|
}
|
|
2665
2771
|
}
|