@makeswift/runtime 0.8.4 → 0.8.6
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/Box.cjs.js +11 -11
- package/dist/Box.cjs.js.map +1 -1
- package/dist/Box.es.js +9 -9
- package/dist/Box.es.js.map +1 -1
- package/dist/Button.cjs.js +36 -37
- package/dist/Button.cjs.js.map +1 -1
- package/dist/Button.es.js +13 -14
- package/dist/Button.es.js.map +1 -1
- package/dist/Carousel.cjs.js +38 -37
- package/dist/Carousel.cjs.js.map +1 -1
- package/dist/Carousel.es.js +19 -18
- package/dist/Carousel.es.js.map +1 -1
- package/dist/Countdown.cjs.js +55 -29
- package/dist/Countdown.cjs.js.map +1 -1
- package/dist/Countdown.es.js +35 -9
- package/dist/Countdown.es.js.map +1 -1
- package/dist/Divider.cjs.js +36 -10
- package/dist/Divider.cjs.js.map +1 -1
- package/dist/Divider.es.js +31 -5
- package/dist/Divider.es.js.map +1 -1
- package/dist/Embed.cjs.js +31 -5
- package/dist/Embed.cjs.js.map +1 -1
- package/dist/Embed.es.js +30 -4
- package/dist/Embed.es.js.map +1 -1
- package/dist/Form.cjs.js +72 -73
- package/dist/Form.cjs.js.map +1 -1
- package/dist/Form.es.js +32 -33
- package/dist/Form.es.js.map +1 -1
- package/dist/Image.cjs.js +22 -21
- package/dist/Image.cjs.js.map +1 -1
- package/dist/Image.es.js +20 -19
- package/dist/Image.es.js.map +1 -1
- package/dist/LiveProvider.cjs.js +8 -9
- package/dist/LiveProvider.cjs.js.map +1 -1
- package/dist/LiveProvider.es.js +8 -9
- package/dist/LiveProvider.es.js.map +1 -1
- package/dist/Navigation.cjs.js +33 -34
- package/dist/Navigation.cjs.js.map +1 -1
- package/dist/Navigation.es.js +14 -15
- package/dist/Navigation.es.js.map +1 -1
- package/dist/PreviewProvider.cjs.js +12 -10
- package/dist/PreviewProvider.cjs.js.map +1 -1
- package/dist/PreviewProvider.es.js +12 -10
- package/dist/PreviewProvider.es.js.map +1 -1
- package/dist/ReadOnlyText.cjs.js +15 -16
- package/dist/ReadOnlyText.cjs.js.map +1 -1
- package/dist/ReadOnlyText.es.js +11 -12
- package/dist/ReadOnlyText.es.js.map +1 -1
- package/dist/Root.cjs.js +10 -10
- package/dist/Root.cjs.js.map +1 -1
- package/dist/Root.es.js +8 -8
- package/dist/SocialLinks.cjs.js +12 -13
- package/dist/SocialLinks.cjs.js.map +1 -1
- package/dist/SocialLinks.es.js +7 -8
- package/dist/SocialLinks.es.js.map +1 -1
- package/dist/Text.cjs.js +3 -4
- package/dist/Text.cjs.js.map +1 -1
- package/dist/Text.es.js +4 -5
- package/dist/Text.es.js.map +1 -1
- package/dist/Video.cjs.js +31 -5
- package/dist/Video.cjs.js.map +1 -1
- package/dist/Video.es.js +30 -4
- package/dist/Video.es.js.map +1 -1
- package/dist/actions.cjs.js +6 -1
- package/dist/actions.cjs.js.map +1 -1
- package/dist/actions.es.js +6 -2
- package/dist/actions.es.js.map +1 -1
- package/dist/components.cjs.js +10 -10
- package/dist/components.es.js +10 -10
- package/dist/constants.cjs.js +7 -1
- package/dist/constants.cjs.js.map +1 -1
- package/dist/constants.es.js +7 -2
- package/dist/constants.es.js.map +1 -1
- package/dist/descriptors.cjs.js.map +1 -1
- package/dist/descriptors.es.js.map +1 -1
- package/dist/index.cjs.js +934 -120
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.cjs2.js +29 -29
- package/dist/index.cjs2.js.map +1 -1
- package/dist/index.cjs3.js +1 -2
- package/dist/index.cjs3.js.map +1 -1
- package/dist/index.cjs4.js +2 -2
- package/dist/index.cjs4.js.map +1 -1
- package/dist/index.cjs5.js +6 -7
- package/dist/index.cjs5.js.map +1 -1
- package/dist/index.cjs6.js +3 -4
- package/dist/index.cjs6.js.map +1 -1
- package/dist/index.cjs7.js +29 -23
- package/dist/index.cjs7.js.map +1 -1
- package/dist/index.es.js +890 -92
- package/dist/index.es.js.map +1 -1
- package/dist/index.es2.js +6 -6
- package/dist/index.es2.js.map +1 -1
- package/dist/index.es3.js +1 -2
- package/dist/index.es3.js.map +1 -1
- package/dist/index.es4.js +2 -2
- package/dist/index.es4.js.map +1 -1
- package/dist/index.es5.js +6 -7
- package/dist/index.es5.js.map +1 -1
- package/dist/index.es6.js +3 -4
- package/dist/index.es6.js.map +1 -1
- package/dist/index.es7.js +25 -19
- package/dist/index.es7.js.map +1 -1
- package/dist/introspection.cjs.js +5 -2
- package/dist/introspection.cjs.js.map +1 -1
- package/dist/introspection.es.js +4 -2
- package/dist/introspection.es.js.map +1 -1
- package/dist/leaf.cjs.js +15 -17
- package/dist/leaf.cjs.js.map +1 -1
- package/dist/leaf.es.js +10 -11
- package/dist/leaf.es.js.map +1 -1
- package/dist/main.cjs.js +2 -1
- package/dist/main.cjs.js.map +1 -1
- package/dist/main.es.js +2 -2
- package/dist/next.cjs.js +5 -6
- package/dist/next.cjs.js.map +1 -1
- package/dist/next.es.js +6 -7
- package/dist/next.es.js.map +1 -1
- package/dist/prop-controllers.cjs.js +0 -1
- package/dist/prop-controllers.cjs.js.map +1 -1
- package/dist/prop-controllers.es.js +0 -1
- package/dist/prop-controllers.es.js.map +1 -1
- package/dist/react.cjs.js +3 -4
- package/dist/react.cjs.js.map +1 -1
- package/dist/react.es.js +3 -4
- package/dist/react.es.js.map +1 -1
- package/dist/slate.cjs.js +1 -12
- package/dist/slate.cjs.js.map +1 -1
- package/dist/slate.es.js +1 -12
- package/dist/slate.es.js.map +1 -1
- package/dist/state/breakpoints.cjs.js +175 -0
- package/dist/state/breakpoints.cjs.js.map +1 -0
- package/dist/state/breakpoints.es.js +160 -0
- package/dist/state/breakpoints.es.js.map +1 -0
- package/dist/types/src/components/builtin/Box/Box.d.ts.map +1 -1
- package/dist/types/src/components/builtin/Box/register.d.ts.map +1 -1
- package/dist/types/src/components/builtin/Button/Button.d.ts.map +1 -1
- package/dist/types/src/components/builtin/Button/register.d.ts.map +1 -1
- package/dist/types/src/components/builtin/Carousel/Carousel.d.ts.map +1 -1
- package/dist/types/src/components/builtin/Carousel/register.d.ts.map +1 -1
- package/dist/types/src/components/builtin/Countdown/register.d.ts.map +1 -1
- package/dist/types/src/components/builtin/Form/components/Field/components/Checkbox/index.d.ts +1 -1
- package/dist/types/src/components/builtin/Form/components/Field/components/Label/index.d.ts.map +1 -1
- package/dist/types/src/components/builtin/Form/register.d.ts.map +1 -1
- package/dist/types/src/components/builtin/Image/Image.d.ts.map +1 -1
- package/dist/types/src/components/builtin/Navigation/components/MobileMenu/components/MobileDropDownButton/index.d.ts.map +1 -1
- package/dist/types/src/components/builtin/Navigation/components/MobileMenu/index.d.ts.map +1 -1
- package/dist/types/src/components/builtin/Navigation/register.d.ts.map +1 -1
- package/dist/types/src/components/builtin/SocialLinks/register.d.ts.map +1 -1
- package/dist/types/src/components/builtin/Text/EditableText/editable-text.d.ts.map +1 -1
- package/dist/types/src/components/builtin/Text/EditableText/useSyncDOMSelection.d.ts +1 -1
- package/dist/types/src/components/builtin/Text/EditableText/useSyncDOMSelection.d.ts.map +1 -1
- package/dist/types/src/components/builtin/Text/components/Leaf/leaf.d.ts +0 -4
- package/dist/types/src/components/builtin/Text/components/Leaf/leaf.d.ts.map +1 -1
- package/dist/types/src/components/builtin/Text/register.d.ts.map +1 -1
- package/dist/types/src/components/hooks/useMediaQuery.d.ts.map +1 -1
- package/dist/types/src/components/utils/drop-first.d.ts +2 -0
- package/dist/types/src/components/utils/drop-first.d.ts.map +1 -0
- package/dist/types/src/components/utils/responsive-style.d.ts +21 -10
- package/dist/types/src/components/utils/responsive-style.d.ts.map +1 -1
- package/dist/types/src/controls/types.d.ts +1 -1
- package/dist/types/src/controls/types.d.ts.map +1 -1
- package/dist/types/src/index.d.ts +2 -2
- package/dist/types/src/index.d.ts.map +1 -1
- package/dist/types/src/prop-controllers/descriptors.d.ts +1 -1
- package/dist/types/src/prop-controllers/descriptors.d.ts.map +1 -1
- package/dist/types/src/runtimes/react/index.d.ts +4 -0
- package/dist/types/src/runtimes/react/index.d.ts.map +1 -1
- package/dist/types/src/slate/BlockPlugin/setBlockKeyForDevice.d.ts +2 -1
- package/dist/types/src/slate/BlockPlugin/setBlockKeyForDevice.d.ts.map +1 -1
- package/dist/types/src/slate/TypographyPlugin/setActiveTypographyStyle.d.ts +2 -1
- package/dist/types/src/slate/TypographyPlugin/setActiveTypographyStyle.d.ts.map +1 -1
- package/dist/types/src/state/actions.d.ts +10 -1
- package/dist/types/src/state/actions.d.ts.map +1 -1
- package/dist/types/src/state/modules/breakpoints.d.ts +44 -0
- package/dist/types/src/state/modules/breakpoints.d.ts.map +1 -0
- package/dist/types/src/state/react-builder-preview.d.ts +2 -0
- package/dist/types/src/state/react-builder-preview.d.ts.map +1 -1
- package/dist/types/src/state/react-page.d.ts +3 -0
- package/dist/types/src/state/react-page.d.ts.map +1 -1
- package/dist/useMediaQuery.cjs.js +38 -0
- package/dist/useMediaQuery.cjs.js.map +1 -0
- package/dist/useMediaQuery.es.js +37 -0
- package/dist/useMediaQuery.es.js.map +1 -0
- package/package.json +10 -2
- package/state/breakpoints.js +1 -0
- package/dist/isNonNullable.cjs.js +0 -6
- package/dist/isNonNullable.cjs.js.map +0 -1
- package/dist/isNonNullable.es.js +0 -5
- package/dist/isNonNullable.es.js.map +0 -1
- package/dist/responsive-style.cjs.js +0 -917
- package/dist/responsive-style.cjs.js.map +0 -1
- package/dist/responsive-style.es.js +0 -853
- package/dist/responsive-style.es.js.map +0 -1
- package/dist/types/src/components/utils/devices.d.ts +0 -17
- package/dist/types/src/components/utils/devices.d.ts.map +0 -1
package/dist/index.cjs2.js
CHANGED
|
@@ -31,16 +31,16 @@ var __objRest = (source, exclude) => {
|
|
|
31
31
|
return target;
|
|
32
32
|
};
|
|
33
33
|
var React = require("react");
|
|
34
|
-
var
|
|
34
|
+
var next = require("./index.cjs.js");
|
|
35
35
|
require("use-sync-external-store/shim");
|
|
36
36
|
require("./descriptors.cjs.js");
|
|
37
37
|
require("slate");
|
|
38
38
|
require("slate-react");
|
|
39
|
-
var
|
|
39
|
+
var useMediaQuery = require("./useMediaQuery.cjs.js");
|
|
40
40
|
var css = require("@emotion/css");
|
|
41
41
|
var jsxRuntime = require("react/jsx-runtime");
|
|
42
|
-
var isNonNullable = require("./isNonNullable.cjs.js");
|
|
43
42
|
var introspection = require("./introspection.cjs.js");
|
|
43
|
+
require("./state/breakpoints.cjs.js");
|
|
44
44
|
var NextImage = require("next/image");
|
|
45
45
|
var useIsomorphicLayoutEffect = require("./useIsomorphicLayoutEffect.cjs.js");
|
|
46
46
|
var ReactPlayer = require("react-player");
|
|
@@ -52,9 +52,9 @@ var NextImage__default = /* @__PURE__ */ _interopDefaultLegacy(NextImage);
|
|
|
52
52
|
var ReactPlayer__default = /* @__PURE__ */ _interopDefaultLegacy(ReactPlayer);
|
|
53
53
|
function useBackgrounds(value) {
|
|
54
54
|
const fileIds = introspection.getBackgroundsFileIds(value);
|
|
55
|
-
const files =
|
|
55
|
+
const files = next.useFiles(fileIds);
|
|
56
56
|
const swatchIds = introspection.getBackgroundsSwatchIds(value);
|
|
57
|
-
const swatches =
|
|
57
|
+
const swatches = next.useSwatches(swatchIds);
|
|
58
58
|
return React.useMemo(() => {
|
|
59
59
|
if (value == null)
|
|
60
60
|
return null;
|
|
@@ -76,7 +76,7 @@ function useBackgrounds(value) {
|
|
|
76
76
|
}
|
|
77
77
|
if (bg.type === "color" && bg.payload != null) {
|
|
78
78
|
const { swatchId, alpha } = bg.payload;
|
|
79
|
-
const swatch = swatches.filter(
|
|
79
|
+
const swatch = swatches.filter(introspection.isNonNullable).find((s) => s && s.id === swatchId);
|
|
80
80
|
return { id: bg.id, type: "color", payload: { swatch, alpha } };
|
|
81
81
|
}
|
|
82
82
|
if (bg.type === "gradient" && bg.payload != null && bg.payload.stops.length > 0) {
|
|
@@ -90,7 +90,7 @@ function useBackgrounds(value) {
|
|
|
90
90
|
var _c = _b2, { color } = _c, restOfStop = __objRest(_c, ["color"]);
|
|
91
91
|
return __spreadProps(__spreadValues({}, restOfStop), {
|
|
92
92
|
color: color && {
|
|
93
|
-
swatch: swatches.filter(
|
|
93
|
+
swatch: swatches.filter(introspection.isNonNullable).find((s) => s && s.id === color.swatchId),
|
|
94
94
|
alpha: color.alpha
|
|
95
95
|
}
|
|
96
96
|
});
|
|
@@ -110,7 +110,7 @@ function useBackgrounds(value) {
|
|
|
110
110
|
};
|
|
111
111
|
}
|
|
112
112
|
return null;
|
|
113
|
-
}).filter(
|
|
113
|
+
}).filter(introspection.isNonNullable)
|
|
114
114
|
});
|
|
115
115
|
});
|
|
116
116
|
}, [files, swatches, value]);
|
|
@@ -136,7 +136,7 @@ function GridItem(_a) {
|
|
|
136
136
|
"itemAnimateDelay",
|
|
137
137
|
"itemStaggerDuration"
|
|
138
138
|
]);
|
|
139
|
-
const gridItemClassName =
|
|
139
|
+
const gridItemClassName = next.useStyle(next.useResponsiveGridItem({
|
|
140
140
|
grid,
|
|
141
141
|
index,
|
|
142
142
|
columnGap,
|
|
@@ -267,10 +267,10 @@ function useBoxAnimation(responsiveAnimationType, responsiveDuration, responisve
|
|
|
267
267
|
rootMargin: `0px 0px -10% 0px`,
|
|
268
268
|
threshold: 0.2
|
|
269
269
|
});
|
|
270
|
-
const animationType =
|
|
271
|
-
const itemAnimationType =
|
|
272
|
-
const duration =
|
|
273
|
-
const delay =
|
|
270
|
+
const animationType = useMediaQuery.useMediaQuery(responsiveAnimationType) || next.DEFAULT_BOX_ANIMATE_TYPE;
|
|
271
|
+
const itemAnimationType = useMediaQuery.useMediaQuery(itemResponsiveAnimationType) || next.DEFAULT_ITEM_ANIMATE_TYPE;
|
|
272
|
+
const duration = useMediaQuery.useMediaQuery(responsiveDuration) || next.DEFAULT_BOX_ANIMATE_DURATION;
|
|
273
|
+
const delay = useMediaQuery.useMediaQuery(responisveDelay) || next.DEFAULT_BOX_ANIMATE_DELAY;
|
|
274
274
|
const actualDelay = delay * 1e3;
|
|
275
275
|
const actualDuration = duration * 1e3;
|
|
276
276
|
const entered = __spreadProps(__spreadValues({}, enteredBoxAnimationProperties[animationType]), {
|
|
@@ -289,18 +289,18 @@ function useBoxAnimation(responsiveAnimationType, responsiveDuration, responisve
|
|
|
289
289
|
const replayAnimation = React.useCallback(() => {
|
|
290
290
|
setEntered(false);
|
|
291
291
|
}, []);
|
|
292
|
-
return [
|
|
292
|
+
return [next.useStyle({
|
|
293
293
|
"@media (prefers-reduced-motion: no-preference)": isEntered ? entered : exited
|
|
294
294
|
}), replayAnimation, setElement];
|
|
295
295
|
}
|
|
296
296
|
function useItemAnimation(responsiveDuration, responisveDelay, responsiveStagger, index) {
|
|
297
|
-
const duration =
|
|
298
|
-
const delay =
|
|
299
|
-
const stagger =
|
|
297
|
+
const duration = useMediaQuery.useMediaQuery(responsiveDuration) || next.DEFAULT_BOX_ANIMATE_DURATION;
|
|
298
|
+
const delay = useMediaQuery.useMediaQuery(responisveDelay) || next.DEFAULT_BOX_ANIMATE_DELAY;
|
|
299
|
+
const stagger = useMediaQuery.useMediaQuery(responsiveStagger) || next.DEFAULT_ITEM_STAGGER_DURATION;
|
|
300
300
|
const delayFromStagger = responsiveStagger == null || index == null ? 0 : stagger * index;
|
|
301
301
|
const actualDelay = (delay + delayFromStagger) * 1e3;
|
|
302
302
|
const actualDuration = duration * 1e3;
|
|
303
|
-
return
|
|
303
|
+
return next.useStyle({
|
|
304
304
|
"@media (prefers-reduced-motion: no-preference)": {
|
|
305
305
|
transition: `transform ${actualDuration}ms cubic-bezier(0.16, 0.84, 0.44, 1) ${actualDelay}ms,filter ${actualDuration}ms cubic-bezier(0.16, 0.84, 0.44, 1) ${actualDelay}ms, opacity ${actualDuration}ms ease ${actualDelay}ms`
|
|
306
306
|
}
|
|
@@ -420,7 +420,7 @@ const Container = React.forwardRef(function Container2(_e, ref) {
|
|
|
420
420
|
]);
|
|
421
421
|
return /* @__PURE__ */ jsxRuntime.jsx("div", __spreadProps(__spreadValues({}, restOfProps), {
|
|
422
422
|
ref,
|
|
423
|
-
className: css.cx(
|
|
423
|
+
className: css.cx(next.useStyle({
|
|
424
424
|
position: "absolute",
|
|
425
425
|
top: 0,
|
|
426
426
|
left: 0,
|
|
@@ -436,7 +436,7 @@ function Mask({
|
|
|
436
436
|
visible
|
|
437
437
|
}) {
|
|
438
438
|
return /* @__PURE__ */ jsxRuntime.jsx("div", {
|
|
439
|
-
className:
|
|
439
|
+
className: next.useStyle({
|
|
440
440
|
position: "absolute",
|
|
441
441
|
top: 0,
|
|
442
442
|
left: 0,
|
|
@@ -532,7 +532,7 @@ function getColor(color) {
|
|
|
532
532
|
if (color == null)
|
|
533
533
|
return "black";
|
|
534
534
|
if (color.swatch == null) {
|
|
535
|
-
return
|
|
535
|
+
return next.colorToString(__spreadProps(__spreadValues({}, color), {
|
|
536
536
|
swatch: {
|
|
537
537
|
hue: 0,
|
|
538
538
|
saturation: 0,
|
|
@@ -540,7 +540,7 @@ function getColor(color) {
|
|
|
540
540
|
}
|
|
541
541
|
}));
|
|
542
542
|
}
|
|
543
|
-
return
|
|
543
|
+
return next.colorToString(color);
|
|
544
544
|
}
|
|
545
545
|
const getStopsStyle = (stops) => stops.map(({
|
|
546
546
|
color,
|
|
@@ -581,11 +581,11 @@ function BackgroundDeviceLayer({
|
|
|
581
581
|
layer,
|
|
582
582
|
visibility
|
|
583
583
|
}) {
|
|
584
|
-
const visibilityStyle =
|
|
584
|
+
const visibilityStyle = next.useResponsiveStyle([visibility], ([v]) => ({
|
|
585
585
|
display: v === true ? "block" : "none"
|
|
586
586
|
}));
|
|
587
587
|
return /* @__PURE__ */ jsxRuntime.jsx("div", {
|
|
588
|
-
className:
|
|
588
|
+
className: next.useStyle(__spreadProps(__spreadValues(__spreadValues({}, containerStyle), visibilityStyle), {
|
|
589
589
|
overflow: "hidden"
|
|
590
590
|
})),
|
|
591
591
|
children: [...layer].reverse().map((bg) => {
|
|
@@ -619,7 +619,7 @@ function ColorBackground({
|
|
|
619
619
|
color
|
|
620
620
|
}) {
|
|
621
621
|
return /* @__PURE__ */ jsxRuntime.jsx("div", {
|
|
622
|
-
className:
|
|
622
|
+
className: next.useStyle(__spreadProps(__spreadValues({}, containerStyle), {
|
|
623
623
|
backgroundColor: color
|
|
624
624
|
}))
|
|
625
625
|
});
|
|
@@ -644,7 +644,7 @@ function ImageBackground({
|
|
|
644
644
|
parallax
|
|
645
645
|
}) {
|
|
646
646
|
const backgroundPosition = `${position.x}% ${position.y}%`;
|
|
647
|
-
const containerClassName =
|
|
647
|
+
const containerClassName = next.useStyle(containerStyle);
|
|
648
648
|
if (repeat === "no-repeat" && size !== "auto" && publicUrl != null) {
|
|
649
649
|
return /* @__PURE__ */ jsxRuntime.jsx(Parallax, {
|
|
650
650
|
strength: parallax,
|
|
@@ -693,7 +693,7 @@ function GradientBackground({
|
|
|
693
693
|
angle = Math.PI
|
|
694
694
|
}) {
|
|
695
695
|
return /* @__PURE__ */ jsxRuntime.jsx("div", {
|
|
696
|
-
className:
|
|
696
|
+
className: next.useStyle(__spreadProps(__spreadValues({}, containerStyle), {
|
|
697
697
|
background: isRadial ? `radial-gradient(${gradient})` : `linear-gradient(${angle}rad, ${gradient})`
|
|
698
698
|
}))
|
|
699
699
|
});
|
|
@@ -719,7 +719,7 @@ function VideoBackground({
|
|
|
719
719
|
return /* @__PURE__ */ jsxRuntime.jsx(Parallax, {
|
|
720
720
|
strength: parallax,
|
|
721
721
|
children: (getParallaxProps) => /* @__PURE__ */ jsxRuntime.jsx("div", __spreadProps(__spreadValues({}, getParallaxProps({
|
|
722
|
-
className:
|
|
722
|
+
className: next.useStyle(containerStyle)
|
|
723
723
|
})), {
|
|
724
724
|
children: /* @__PURE__ */ jsxRuntime.jsx(BackgroundVideo, {
|
|
725
725
|
url,
|
|
@@ -743,7 +743,7 @@ var BackgroundsContainer = React.forwardRef(function BackgroundsContainer2(_g, r
|
|
|
743
743
|
]);
|
|
744
744
|
return /* @__PURE__ */ jsxRuntime.jsxs("div", __spreadProps(__spreadValues({}, restOfProps), {
|
|
745
745
|
ref,
|
|
746
|
-
className: css.cx(
|
|
746
|
+
className: css.cx(next.useStyle({
|
|
747
747
|
position: "relative",
|
|
748
748
|
width: "100%",
|
|
749
749
|
margin: "0 auto",
|
package/dist/index.cjs2.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs2.js","sources":["../src/components/hooks/useBackgrounds.ts","../src/components/shared/grid-item.tsx","../src/components/builtin/Box/animations.tsx","../src/utils/clamp.ts","../src/components/shared/BackgroundsContainer/components/Parallax/index.tsx","../src/components/shared/BackgroundsContainer/components/BackgroundVideo/index.tsx","../src/components/shared/BackgroundsContainer/components/Backgrounds/index.tsx","../src/components/shared/BackgroundsContainer/index.tsx"],"sourcesContent":["import { useMemo } from 'react'\n\nimport { ColorValue as Color } from '../utils/types'\nimport { ResponsiveValue } from '../../prop-controllers'\nimport { isNonNullable } from '../utils/isNonNullable'\nimport { BackgroundsValue as ResponsiveBackgroundsValue } from '../../prop-controllers/descriptors'\nimport { useFiles, useSwatches } from '../../runtimes/react/hooks/makeswift-api'\nimport {\n getBackgroundsFileIds,\n getBackgroundsSwatchIds,\n} from '../../prop-controllers/introspection'\n\ntype BackgroundColorData = Color\n\ntype BackgroundGradientStopData = {\n id: string\n location: number\n color: Color | null | undefined\n}\n\ntype BackgroundGradientData = {\n angle?: number\n isRadial?: boolean\n stops: Array<BackgroundGradientStopData>\n}\n\ntype BackgroundImageData = {\n publicUrl?: string\n dimensions?: { width: number; height: number } | null\n position: {\n x: number\n y: number\n }\n size?: 'cover' | 'contain' | 'auto'\n repeat?: 'no-repeat' | 'repeat-x' | 'repeat-y' | 'repeat'\n opacity?: number\n parallax?: number\n}\n\ntype BackgroundVideoData = {\n url?: string\n maskColor: Color | null | undefined\n aspectRatio?: 'wide' | 'standard'\n opacity?: number\n zoom?: number\n parallax?: number\n}\n\ntype BackgroundData =\n | { id: string; type: 'color'; payload: BackgroundColorData | null | undefined }\n | { id: string; type: 'image'; payload: BackgroundImageData | null | undefined }\n | { id: string; type: 'gradient'; payload: BackgroundGradientData | null | undefined }\n | { id: string; type: 'video'; payload: BackgroundVideoData | null | undefined }\n\nexport type BackgroundsData = Array<BackgroundData>\n\nexport type BackgroundsPropControllerData = ResponsiveValue<BackgroundsData>\n\nexport function useBackgrounds(\n value: ResponsiveBackgroundsValue | null | undefined,\n): BackgroundsPropControllerData | null | undefined {\n const fileIds = getBackgroundsFileIds(value)\n const files = useFiles(fileIds)\n const swatchIds = getBackgroundsSwatchIds(value)\n const swatches = useSwatches(swatchIds)\n\n return useMemo(() => {\n if (value == null) return null\n\n return value.map(({ value: backgrounds, ...restOfValue }) => ({\n ...restOfValue,\n value: backgrounds\n .map((bg): BackgroundData | null | undefined => {\n if (bg.type === 'image' && bg.payload != null && bg.payload.imageId != null) {\n const { imageId, ...restOfPayload } = bg.payload\n const file = files.find(f => f && f.id === imageId)\n\n return (\n file && {\n id: bg.id,\n type: 'image',\n payload: {\n ...restOfPayload,\n publicUrl: file.publicUrl,\n dimensions: file.dimensions,\n },\n }\n )\n }\n\n if (bg.type === 'color' && bg.payload != null) {\n const { swatchId, alpha } = bg.payload\n const swatch = swatches.filter(isNonNullable).find(s => s && s.id === swatchId)\n\n return { id: bg.id, type: 'color', payload: { swatch, alpha } }\n }\n\n if (bg.type === 'gradient' && bg.payload != null && bg.payload.stops.length > 0) {\n return {\n id: bg.id,\n type: 'gradient',\n payload: {\n angle: bg.payload.angle,\n isRadial: bg.payload.isRadial,\n stops: bg.payload.stops.map(({ color, ...restOfStop }) => ({\n ...restOfStop,\n color: color && {\n swatch: swatches.filter(isNonNullable).find(s => s && s.id === color.swatchId),\n alpha: color.alpha,\n },\n })),\n },\n }\n }\n\n if (bg.type === 'video' && bg.payload != null) {\n const { maskColor, ...restOfPayload } = bg.payload\n const swatch = maskColor && swatches.find(s => s && s.id === maskColor.swatchId)\n\n return {\n id: bg.id,\n type: 'video',\n payload: {\n ...restOfPayload,\n maskColor: swatch && maskColor && { swatch, alpha: maskColor.alpha },\n },\n }\n }\n\n return null\n })\n .filter(isNonNullable),\n }))\n }, [files, swatches, value])\n}\n","import { cx } from '@emotion/css'\nimport { ComponentPropsWithoutRef } from 'react'\nimport {\n ResponsiveValue,\n Length as LengthValue,\n ResponsiveNumberValue,\n} from '../../prop-controllers'\nimport { useStyle } from '../../runtimes/react/use-style'\nimport { useItemAnimation } from '../builtin/Box/animations'\nimport { responsiveGridItem } from '../utils/responsive-style'\n\ntype BaseProps = {\n className?: string\n grid: ResponsiveValue<{ spans: Array<Array<number>>; count: number }>\n index: number\n columnGap?: ResponsiveValue<LengthValue>\n rowGap?: ResponsiveValue<LengthValue>\n itemAnimateDuration?: ResponsiveNumberValue\n itemAnimateDelay?: ResponsiveNumberValue\n itemStaggerDuration?: ResponsiveNumberValue\n}\n\ntype Props = BaseProps & Omit<ComponentPropsWithoutRef<'div'>, keyof BaseProps>\n\nexport const gridItemIdentifierClassName = 'grid-item'\n\nexport function GridItem({\n grid,\n index,\n columnGap,\n rowGap,\n className,\n itemAnimateDuration,\n itemAnimateDelay,\n itemStaggerDuration,\n ...restOfProps\n}: Props) {\n const gridItemClassName = useStyle(responsiveGridItem({ grid, index, columnGap, rowGap }))\n const animationClassName = useItemAnimation(\n itemAnimateDuration,\n itemAnimateDelay,\n itemStaggerDuration,\n index,\n )\n\n return (\n <div\n {...restOfProps}\n className={cx(gridItemClassName, className, animationClassName, gridItemIdentifierClassName)}\n />\n )\n}\n","import { CSSObject } from '@emotion/css'\nimport { useState, useEffect, useCallback, useRef } from 'react'\nimport {\n ResponsiveNumberValue,\n ResponsiveSelectValue,\n ResponsiveValue,\n} from '../../../prop-controllers'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { useMediaQuery } from '../../hooks'\nimport { gridItemIdentifierClassName } from '../../shared/grid-item'\nimport {\n BoxAnimateIn,\n DEFAULT_BOX_ANIMATE_DELAY,\n DEFAULT_BOX_ANIMATE_DURATION,\n DEFAULT_BOX_ANIMATE_TYPE,\n DEFAULT_ITEM_ANIMATE_TYPE,\n DEFAULT_ITEM_STAGGER_DURATION,\n} from './constants'\n\nfunction useElementOnScreen(\n options: IntersectionObserverInit,\n): [boolean, (element: HTMLElement | null) => void] {\n const [isVisible, setIsVisible] = useState(false)\n const intersectionObserverRef = useRef<IntersectionObserver | null>(null)\n\n const setElement = useCallback((element: HTMLElement | null) => {\n if (element != null) {\n const observer = new IntersectionObserver(([entry]) => {\n if (entry?.isIntersecting) setIsVisible(true)\n }, options)\n\n observer.observe(element)\n\n intersectionObserverRef.current = observer\n } else {\n intersectionObserverRef.current?.disconnect()\n\n intersectionObserverRef.current = null\n }\n }, [])\n\n return [isVisible, setElement]\n}\n\nexport type BoxAnimationProps = {\n boxAnimateType?: ResponsiveSelectValue<BoxAnimateIn>\n boxAnimateDuration?: ResponsiveNumberValue\n boxAnimateDelay?: ResponsiveNumberValue\n itemAnimateType?: ResponsiveSelectValue<BoxAnimateIn>\n itemAnimateDuration?: ResponsiveNumberValue\n itemAnimateDelay?: ResponsiveNumberValue\n itemStaggerDuration?: ResponsiveNumberValue\n}\n\nfunction compareResponsiveValues<T>(a?: ResponsiveValue<T>, b?: ResponsiveValue<T>) {\n if (a == null && b == null) {\n return true\n }\n if (a != null && b != null) {\n let isEqual = true\n a.forEach((currentA, index) => {\n const currentB = b.at(index)\n if (currentB == null) {\n isEqual = false\n return\n }\n\n if (currentA.deviceId != currentB?.deviceId || currentA.value != currentB.value) {\n isEqual = false\n }\n })\n return isEqual\n }\n\n return false\n}\n\nexport function areBoxAnimationPropsEqual(prevProps: BoxAnimationProps, props: BoxAnimationProps) {\n return (\n compareResponsiveValues(prevProps.boxAnimateType, props.boxAnimateType) &&\n compareResponsiveValues(prevProps.boxAnimateDuration, props.boxAnimateDuration) &&\n compareResponsiveValues(prevProps.boxAnimateDelay, props.boxAnimateDelay) &&\n compareResponsiveValues(prevProps.itemAnimateType, props.itemAnimateType) &&\n compareResponsiveValues(prevProps.itemAnimateDuration, props.itemAnimateDuration) &&\n compareResponsiveValues(prevProps.itemAnimateDelay, props.itemAnimateDelay) &&\n compareResponsiveValues(prevProps.itemStaggerDuration, props.itemStaggerDuration)\n )\n}\n\nconst exitedBoxAnimationProperties: { [key in BoxAnimateIn]: CSSObject } = {\n none: { opacity: 1 },\n fadeIn: { opacity: 0 },\n fadeLeft: { transform: 'translate3d(60px,0,0)', opacity: 0 },\n fadeRight: { transform: 'translate3d(-60px,0,0)', opacity: 0 },\n fadeDown: { transform: 'translate3d(0,-80px,0)', opacity: 0 },\n fadeUp: { transform: 'translate3d(0,80px,0)', opacity: 0 },\n blurIn: { filter: 'blur(20px)', opacity: 0 },\n scaleDown: {\n transform: 'scale(1.2)',\n opacity: 0,\n },\n scaleUp: {\n transform: 'scale(.75)',\n opacity: 0,\n },\n}\n\nconst enteredBoxAnimationProperties: { [key in BoxAnimateIn]: CSSObject } = {\n none: { opacity: 1 },\n fadeIn: { opacity: 1 },\n fadeLeft: { transform: 'translate3d(0px,0,0)', opacity: 1 },\n fadeRight: { transform: 'translate3d(0px,0,0)', opacity: 1 },\n fadeDown: { transform: 'translate3d(0,0px,0)', opacity: 1 },\n fadeUp: { transform: 'translate3d(0,0px,0)', opacity: 1 },\n blurIn: { filter: 'blur(0px)', opacity: 1 },\n scaleDown: {\n transform: 'scale(1)',\n opacity: 1,\n },\n scaleUp: {\n transform: 'scale(1)',\n opacity: 1,\n },\n}\n\nexport function useBoxAnimation(\n responsiveAnimationType: ResponsiveValue<BoxAnimateIn> | undefined,\n responsiveDuration: ResponsiveValue<number> | undefined,\n responisveDelay: ResponsiveValue<number> | undefined,\n itemResponsiveAnimationType: ResponsiveValue<BoxAnimateIn> | undefined,\n): [string, () => void, (element: HTMLElement | null) => void] {\n const [isVisible, setElement] = useElementOnScreen({\n root: null,\n rootMargin: `0px 0px -10% 0px`,\n threshold: 0.2,\n })\n const animationType = useMediaQuery(responsiveAnimationType) || DEFAULT_BOX_ANIMATE_TYPE\n const itemAnimationType = useMediaQuery(itemResponsiveAnimationType) || DEFAULT_ITEM_ANIMATE_TYPE\n const duration = useMediaQuery(responsiveDuration) || DEFAULT_BOX_ANIMATE_DURATION\n const delay = useMediaQuery(responisveDelay) || DEFAULT_BOX_ANIMATE_DELAY\n const actualDelay = delay * 1000\n const actualDuration = duration * 1000\n\n const entered = {\n ...enteredBoxAnimationProperties[animationType],\n transition: `transform ${actualDuration}ms cubic-bezier(0.16, 0.84, 0.44, 1) ${actualDelay}ms,filter ${actualDuration}ms cubic-bezier(0.16, 0.84, 0.44, 1) ${actualDelay}ms, opacity ${actualDuration}ms ease ${actualDelay}ms`,\n [`& > div > .${gridItemIdentifierClassName}`]: {\n ...enteredBoxAnimationProperties[itemAnimationType],\n },\n }\n\n const exited = {\n ...exitedBoxAnimationProperties[animationType],\n transition: `all 0ms`,\n [`& > div > .${gridItemIdentifierClassName}`]: {\n ...exitedBoxAnimationProperties[itemAnimationType],\n },\n }\n\n const [isEntered, setEntered] = useState(false)\n\n useEffect(() => {\n if (isVisible && !isEntered) setEntered(true)\n }, [isVisible, entered])\n\n const replayAnimation = useCallback(() => {\n setEntered(false)\n }, [])\n\n return [\n useStyle({\n '@media (prefers-reduced-motion: no-preference)': isEntered ? entered : exited,\n }),\n replayAnimation,\n setElement,\n ]\n}\n\nexport function useItemAnimation(\n responsiveDuration: ResponsiveValue<number> | undefined,\n responisveDelay: ResponsiveValue<number> | undefined,\n responsiveStagger: ResponsiveValue<number> | undefined,\n index: number,\n) {\n const duration = useMediaQuery(responsiveDuration) || DEFAULT_BOX_ANIMATE_DURATION\n const delay = useMediaQuery(responisveDelay) || DEFAULT_BOX_ANIMATE_DELAY\n const stagger = useMediaQuery(responsiveStagger) || DEFAULT_ITEM_STAGGER_DURATION\n const delayFromStagger = responsiveStagger == null || index == null ? 0 : stagger * index\n const actualDelay = (delay + delayFromStagger) * 1000\n const actualDuration = duration * 1000\n\n return useStyle({\n '@media (prefers-reduced-motion: no-preference)': {\n transition: `transform ${actualDuration}ms cubic-bezier(0.16, 0.84, 0.44, 1) ${actualDelay}ms,filter ${actualDuration}ms cubic-bezier(0.16, 0.84, 0.44, 1) ${actualDelay}ms, opacity ${actualDuration}ms ease ${actualDelay}ms`,\n },\n })\n}\n","const clamp = (min: number, val: number, max: number): number => Math.min(Math.max(min, val), max)\n\nexport default clamp\n","import { useState, useRef, useCallback, ReactNode, CSSProperties } from 'react'\nimport clamp from '../../../../../utils/clamp'\nimport { useIsomorphicLayoutEffect } from '../../../../hooks/useIsomorphicLayoutEffect'\n\nfunction isScrollable(element: HTMLElement) {\n const { overflow, overflowY, overflowX } =\n element.ownerDocument.defaultView!.getComputedStyle(element)\n\n return /(auto|scroll)/.test(overflow + overflowX + overflowY)\n}\n\nfunction getScrollParent(element: HTMLElement): HTMLElement {\n const { parentElement } = element\n\n if (!element || !parentElement) return element\n\n if (isScrollable(element)) return element\n\n return getScrollParent(parentElement)\n}\n\ntype Props = {\n strength: number | null | undefined\n children: (\n getParallaxProps: <P extends { style?: CSSProperties; [key: string]: unknown }>(props: P) => P,\n ) => ReactNode\n}\n\nexport default function Parallax({ strength, children, ...rest }: Props): JSX.Element {\n const container = useRef<HTMLDivElement>(null)\n const [containerScrollTop, setContainerScrollTop] = useState(strength == null ? 0 : strength)\n const lastScrollParentScrollTop = useRef(0)\n\n useIsomorphicLayoutEffect(() => {\n if (!container.current || strength == null || strength === 0) return undefined\n\n const containerDocument = container.current.ownerDocument\n const scrollParent = getScrollParent(container.current)\n const eventTarget =\n containerDocument.documentElement === scrollParent\n ? containerDocument.defaultView!\n : scrollParent\n\n lastScrollParentScrollTop.current = scrollParent.scrollTop\n setContainerScrollTop(strength)\n\n function handleScroll() {\n containerDocument.defaultView!.requestAnimationFrame(() => {\n if (!container.current) return\n\n const { top: containerTop, bottom: containerBottom } =\n container.current.getBoundingClientRect()\n const { top: scrollParentTop, bottom: scrollParentBottom } =\n scrollParent === containerDocument.documentElement\n ? { top: 0, bottom: containerDocument.defaultView!.innerHeight }\n : scrollParent.getBoundingClientRect()\n const { scrollTop: scrollParentScrollTop } =\n scrollParent === containerDocument.documentElement\n ? { scrollTop: containerDocument.defaultView!.pageYOffset }\n : scrollParent\n const scrollParentHeight = scrollParentBottom - scrollParentTop\n const scrollParentScrollDelta = scrollParentScrollTop - lastScrollParentScrollTop.current\n\n lastScrollParentScrollTop.current = scrollParentScrollTop\n\n setContainerScrollTop(scrollTop => {\n const isContainerVisible =\n containerTop < scrollParentTop + scrollParentHeight && containerBottom > scrollParentTop\n const containerScrollRemaining =\n scrollParentScrollDelta > 0 ? 2 * strength! - scrollTop : scrollTop\n const scrollParentScrollRemaining =\n scrollParentScrollDelta > 0\n ? scrollParentTop + containerBottom\n : scrollParentHeight - containerTop\n const parallaxRatio = containerScrollRemaining / scrollParentScrollRemaining\n const containerScrollDelta = isContainerVisible\n ? parallaxRatio * scrollParentScrollDelta\n : 0\n\n return clamp(0, scrollTop + containerScrollDelta, strength! * 2)\n })\n })\n }\n\n eventTarget.addEventListener('scroll', handleScroll)\n\n return () => eventTarget.removeEventListener('scroll', handleScroll)\n }, [strength])\n\n const getProps = useCallback(\n ({ style, ...restOfChildrenProps }: any) => ({\n ...restOfChildrenProps,\n style: {\n ...style,\n position: 'absolute',\n left: 0,\n right: 0,\n top: 0,\n bottom: 0,\n ...(strength == null || strength === 0\n ? {}\n : {\n top: -strength,\n bottom: -strength,\n transform: `translate3d(0, ${containerScrollTop - strength}px, 0)`,\n }),\n },\n }),\n [strength, containerScrollTop],\n )\n\n return (\n <div\n {...rest}\n ref={container}\n style={{ position: 'absolute', top: 0, left: 0, right: 0, bottom: 0 }}\n >\n {children(getProps)}\n </div>\n )\n}\n","import { cx } from '@emotion/css'\nimport { useState, useRef, ComponentPropsWithoutRef, ForwardedRef, forwardRef } from 'react'\nimport ReactPlayer from 'react-player'\nimport { useStyle } from '../../../../../runtimes/react/use-style'\n\nimport { useIsomorphicLayoutEffect } from '../../../../hooks/useIsomorphicLayoutEffect'\n\nconst Container = forwardRef(function Container(\n { className, ...restOfProps }: ComponentPropsWithoutRef<'div'>,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n return (\n <div\n {...restOfProps}\n ref={ref}\n className={cx(\n useStyle({\n position: 'absolute',\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n pointerEvents: 'none',\n overflow: 'hidden',\n }),\n className,\n )}\n />\n )\n})\n\nfunction Mask({\n backgroundColor,\n visible,\n}: {\n backgroundColor: string | undefined\n visible: boolean\n}) {\n return (\n <div\n className={useStyle({\n position: 'absolute',\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n background: backgroundColor,\n opacity: visible ? 1 : 0,\n transition: 'opacity 1s',\n })}\n />\n )\n}\n\nconst getScale = (element: HTMLElement, aspectRatio: number, zoom: number) => {\n const { offsetWidth: width, offsetHeight: height } = element\n const computedAspectRatio = width / height\n\n return Math.max(aspectRatio / computedAspectRatio, computedAspectRatio / aspectRatio) * zoom\n}\n\ntype Props = {\n url?: string\n aspectRatio?: number\n zoom?: number\n opacity?: number\n maskColor?: string\n}\n\nexport default function BackgroundVideo({\n url = '',\n aspectRatio = 16 / 9,\n zoom = 1,\n maskColor,\n opacity,\n}: Props): JSX.Element {\n const [ready, setReady] = useState(false)\n const [scale, setScale] = useState(1)\n const container = useRef<HTMLDivElement>(null)\n\n useIsomorphicLayoutEffect(() => {\n const { current: containerEl } = container\n\n if (!containerEl) return undefined\n\n const { defaultView } = containerEl.ownerDocument\n const handleResize = () => setScale(getScale(containerEl, aspectRatio, zoom))\n\n handleResize()\n\n defaultView!.addEventListener('resize', handleResize)\n\n return () => defaultView!.removeEventListener('resize', handleResize)\n }, [aspectRatio, zoom])\n\n if (!ReactPlayer.canPlay(url)) return <></>\n\n return (\n <Container ref={container}>\n {container.current && (\n <ReactPlayer\n url={url}\n config={{\n vimeo: { playerOptions: { background: true } },\n youtube: {\n playerVars: {\n origin: container.current.ownerDocument.defaultView?.location.origin,\n },\n },\n wistia: {\n options: {\n endVideoBehavior: 'loop',\n playbackRateControl: false,\n playbar: false,\n playButton: false,\n volumeControl: false,\n fullscreenButton: false,\n muted: true,\n },\n },\n }}\n playing\n loop\n muted\n controls={false}\n onReady={() => setReady(true)}\n style={{\n transform: `scale3d(${scale}, ${scale}, 1)`,\n opacity,\n }}\n width=\"100%\"\n height=\"100%\"\n />\n )}\n <Mask backgroundColor={maskColor} visible={!ready} />\n </Container>\n )\n}\n","import NextImage from 'next/image'\nimport type NextLegacyImageType from 'next/legacy/image'\n\nimport { BackgroundsPropControllerData, BackgroundsData } from '../../../../hooks'\nimport { ResponsiveValue } from '../../../../../prop-controllers'\nimport { ColorValue as Color } from '../../../../utils/types'\nimport { colorToString } from '../../../../utils/colorToString'\nimport Parallax from '../Parallax'\nimport BackgroundVideo from '../BackgroundVideo'\nimport { CSSObject } from '@emotion/css'\nimport { useStyle } from '../../../../../runtimes/react/use-style'\nimport { responsiveStyle } from '../../../../utils/responsive-style'\nimport { major as nextMajorVersion } from '../../../../../next/next-version'\n\nconst NextLegacyImage = NextImage as typeof NextLegacyImageType\n\nfunction getColor(color: Color | null | undefined) {\n if (color == null) return 'black'\n\n if (color.swatch == null) {\n return colorToString({ ...color, swatch: { hue: 0, saturation: 0, lightness: 0 } })\n }\n\n return colorToString(color)\n}\n\ntype GradientStop = { color: Color | null | undefined; location: number }\n\nconst getStopsStyle = (stops: GradientStop[]) =>\n stops.map(({ color, location }) => `${getColor(color)} ${location}%`).join(',')\n\nconst absoluteFillStyle: CSSObject = {\n position: 'absolute',\n top: 0,\n right: 0,\n bottom: 0,\n left: 0,\n}\n\nconst containerStyle: CSSObject = {\n ...absoluteFillStyle,\n borderRadius: 'inherit',\n}\n\ntype Props = { backgrounds: BackgroundsPropControllerData | null | undefined }\n\nexport default function Backgrounds({ backgrounds }: Props): JSX.Element {\n if (backgrounds == null) return <></>\n\n return (\n <>\n {backgrounds.map(({ value, deviceId }) => {\n const visibility = backgrounds.map(v => ({\n deviceId: v.deviceId,\n value: v.deviceId === deviceId,\n }))\n\n return <BackgroundDeviceLayer key={deviceId} layer={value} visibility={visibility} />\n })}\n </>\n )\n}\n\ntype BackgroundLayerProps = {\n layer: BackgroundsData\n visibility: ResponsiveValue<boolean>\n}\n\nfunction BackgroundDeviceLayer({ layer, visibility }: BackgroundLayerProps) {\n const visibilityStyle = responsiveStyle([visibility], ([v]) => ({\n display: v === true ? 'block' : 'none',\n }))\n\n return (\n <div className={useStyle({ ...containerStyle, ...visibilityStyle, overflow: 'hidden' })}>\n {[...layer].reverse().map(bg => {\n if (bg.type === 'color') {\n return <ColorBackground key={bg.id} color={getColor(bg.payload)} />\n }\n\n if (bg.type === 'image' && bg.payload) {\n return <ImageBackground {...bg.payload} key={bg.id} />\n }\n\n if (bg.type === 'gradient' && bg.payload) {\n return (\n <GradientBackground\n {...bg.payload}\n key={bg.id}\n gradient={getStopsStyle(bg.payload.stops)}\n />\n )\n }\n\n if (bg.type === 'video' && bg.payload) {\n return (\n <VideoBackground\n {...bg.payload}\n key={bg.id}\n maskColor={getColor(bg.payload.maskColor)}\n />\n )\n }\n\n return null\n })}\n </div>\n )\n}\n\ntype ColorBackgroundProps = { color: string }\n\nfunction ColorBackground({ color }: ColorBackgroundProps) {\n return <div className={useStyle({ ...containerStyle, backgroundColor: color })} />\n}\n\nconst ImageBackgroundRepeat = {\n NoRepeat: 'no-repeat',\n RepeatX: 'repeat-x',\n RepeatY: 'repeat-y',\n Repeat: 'repeat',\n} as const\n\ntype ImageBackgroundRepeat = typeof ImageBackgroundRepeat[keyof typeof ImageBackgroundRepeat]\n\nconst ImageBackgroundSize = {\n Cover: 'cover',\n Contain: 'contain',\n Auto: 'auto',\n} as const\n\ntype ImageBackgroundSize = typeof ImageBackgroundSize[keyof typeof ImageBackgroundSize]\n\ntype ImageBackgroundProps = {\n publicUrl?: string\n position: { x: number; y: number }\n repeat?: ImageBackgroundRepeat\n size?: ImageBackgroundSize\n opacity?: number\n parallax?: number\n}\n\nfunction ImageBackground({\n publicUrl,\n position,\n repeat = ImageBackgroundRepeat.NoRepeat,\n size = ImageBackgroundSize.Cover,\n opacity,\n parallax,\n}: ImageBackgroundProps) {\n const backgroundPosition = `${position.x}% ${position.y}%`\n const containerClassName = useStyle(containerStyle)\n\n if (repeat === 'no-repeat' && size !== 'auto' && publicUrl != null) {\n return (\n <Parallax strength={parallax}>\n {getParallaxProps => (\n <div {...getParallaxProps({ style: { opacity, overflow: 'hidden' } })}>\n {nextMajorVersion < 13 ? (\n <NextLegacyImage\n src={publicUrl}\n layout=\"fill\"\n objectPosition={backgroundPosition}\n objectFit={size}\n />\n ) : (\n <NextImage\n src={publicUrl}\n alt={''}\n fill\n sizes=\"100vw\"\n style={{\n objectPosition: backgroundPosition,\n objectFit: size,\n }}\n />\n )}\n </div>\n )}\n </Parallax>\n )\n }\n\n return (\n <Parallax strength={parallax}>\n {getParallaxProps => (\n <div\n className={containerClassName}\n {...getParallaxProps({\n style: {\n backgroundImage: publicUrl != null ? `url('${publicUrl}')` : undefined,\n backgroundPosition,\n backgroundRepeat: repeat,\n backgroundSize: size,\n opacity,\n },\n })}\n />\n )}\n </Parallax>\n )\n}\n\ntype GradientBackgroundProps = {\n gradient: string\n angle?: number\n isRadial?: boolean\n}\n\nfunction GradientBackground({\n gradient,\n isRadial = false,\n angle = Math.PI,\n}: GradientBackgroundProps) {\n return (\n <div\n className={useStyle({\n ...containerStyle,\n background: isRadial\n ? `radial-gradient(${gradient})`\n : `linear-gradient(${angle}rad, ${gradient})`,\n })}\n />\n )\n}\n\nconst BackgroundVideoAspectRatio = {\n Wide: 'wide',\n Standard: 'standard',\n} as const\n\ntype BackgroundVideoAspectRatio =\n typeof BackgroundVideoAspectRatio[keyof typeof BackgroundVideoAspectRatio]\n\nfunction getAspectRatio(aspectRatio: BackgroundVideoAspectRatio | null | undefined): number {\n switch (aspectRatio) {\n case 'wide':\n return 16 / 9\n\n case 'standard':\n return 4 / 3\n\n default:\n return 16 / 9\n }\n}\n\ntype VideoBackgroundProps = {\n url?: string\n aspectRatio?: BackgroundVideoAspectRatio\n maskColor: string\n zoom?: number\n opacity?: number\n parallax?: number\n}\n\nfunction VideoBackground({\n url,\n aspectRatio,\n maskColor,\n zoom,\n opacity,\n parallax,\n}: VideoBackgroundProps) {\n return (\n <Parallax strength={parallax}>\n {getParallaxProps => (\n <div {...getParallaxProps({ className: useStyle(containerStyle) })}>\n <BackgroundVideo\n url={url}\n zoom={zoom}\n opacity={opacity}\n aspectRatio={getAspectRatio(aspectRatio)}\n maskColor={maskColor}\n />\n </div>\n )}\n </Parallax>\n )\n}\n","import { cx } from '@emotion/css'\nimport {\n Children,\n ComponentPropsWithoutRef,\n ElementType,\n forwardRef,\n ReactElement,\n Ref,\n} from 'react'\nimport { BackgroundsValue as BackgroundsPropControllerValue } from '../../../prop-controllers/descriptors'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { useBackgrounds } from '../../hooks'\nimport Backgrounds from './components/Backgrounds'\n\ntype BaseProps = {\n backgrounds: BackgroundsPropControllerValue | null | undefined\n children: ReactElement<ElementType>\n}\n\ntype Props = BaseProps & Omit<ComponentPropsWithoutRef<'div'>, keyof BaseProps>\n\nexport default forwardRef<HTMLDivElement | null, Props>(function BackgroundsContainer(\n { backgrounds, children, className, ...restOfProps }: Props,\n ref: Ref<HTMLDivElement>,\n) {\n return (\n <div\n {...restOfProps}\n ref={ref}\n className={cx(\n useStyle({\n position: 'relative',\n width: '100%',\n margin: '0 auto',\n '> *': {\n borderRadius: 'inherit',\n height: 'inherit',\n },\n '> :last-child': {\n position: 'relative',\n },\n }),\n className,\n )}\n >\n <Backgrounds backgrounds={useBackgrounds(backgrounds)} />\n {Children.only(children)}\n </div>\n )\n})\n"],"names":["getBackgroundsFileIds","useFiles","getBackgroundsSwatchIds","useSwatches","useMemo","isNonNullable","gridItemIdentifierClassName","grid","index","columnGap","rowGap","className","itemAnimateDuration","itemAnimateDelay","itemStaggerDuration","restOfProps","gridItemClassName","useStyle","responsiveGridItem","animationClassName","useItemAnimation","cx","options","isVisible","setIsVisible","useState","intersectionObserverRef","useRef","setElement","useCallback","element","observer","IntersectionObserver","entry","isIntersecting","observe","current","disconnect","a","b","isEqual","forEach","currentA","currentB","at","deviceId","value","prevProps","props","compareResponsiveValues","boxAnimateType","boxAnimateDuration","boxAnimateDelay","itemAnimateType","exitedBoxAnimationProperties","none","opacity","fadeIn","fadeLeft","transform","fadeRight","fadeDown","fadeUp","blurIn","filter","scaleDown","scaleUp","enteredBoxAnimationProperties","responsiveAnimationType","responsiveDuration","responisveDelay","itemResponsiveAnimationType","useElementOnScreen","root","rootMargin","threshold","animationType","useMediaQuery","DEFAULT_BOX_ANIMATE_TYPE","itemAnimationType","DEFAULT_ITEM_ANIMATE_TYPE","duration","DEFAULT_BOX_ANIMATE_DURATION","delay","DEFAULT_BOX_ANIMATE_DELAY","actualDelay","actualDuration","entered","transition","exited","isEntered","setEntered","useEffect","replayAnimation","responsiveStagger","stagger","DEFAULT_ITEM_STAGGER_DURATION","delayFromStagger","overflow","overflowY","overflowX","ownerDocument","defaultView","getComputedStyle","test","parentElement","isScrollable","getScrollParent","strength","children","rest","container","containerScrollTop","setContainerScrollTop","lastScrollParentScrollTop","useIsomorphicLayoutEffect","undefined","containerDocument","scrollParent","eventTarget","documentElement","scrollTop","requestAnimationFrame","top","containerTop","bottom","containerBottom","getBoundingClientRect","scrollParentTop","scrollParentBottom","innerHeight","scrollParentScrollTop","pageYOffset","scrollParentHeight","scrollParentScrollDelta","isContainerVisible","containerScrollRemaining","scrollParentScrollRemaining","parallaxRatio","containerScrollDelta","clamp","addEventListener","handleScroll","removeEventListener","getProps","style","restOfChildrenProps","position","left","right","Container","forwardRef","ref","pointerEvents","backgroundColor","visible","background","getScale","aspectRatio","zoom","offsetWidth","width","offsetHeight","height","computedAspectRatio","Math","max","url","maskColor","ready","setReady","scale","setScale","containerEl","handleResize","ReactPlayer","canPlay","_jsx","_Fragment","vimeo","playerOptions","youtube","playerVars","origin","location","wistia","endVideoBehavior","playbackRateControl","playbar","playButton","volumeControl","fullscreenButton","muted","NextLegacyImage","NextImage","color","swatch","colorToString","hue","saturation","lightness","getStopsStyle","stops","map","getColor","join","absoluteFillStyle","containerStyle","borderRadius","backgrounds","visibility","v","layer","visibilityStyle","responsiveStyle","display","reverse","bg","type","payload","id","ImageBackgroundRepeat","NoRepeat","RepeatX","RepeatY","Repeat","ImageBackgroundSize","Cover","Contain","Auto","publicUrl","repeat","size","parallax","backgroundPosition","x","y","containerClassName","getParallaxProps","nextMajorVersion","objectPosition","objectFit","backgroundImage","backgroundRepeat","backgroundSize","gradient","isRadial","angle","PI","getAspectRatio","margin","useBackgrounds","Children","only"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.cjs2.js","sources":["../src/components/hooks/useBackgrounds.ts","../src/components/shared/grid-item.tsx","../src/components/builtin/Box/animations.tsx","../src/utils/clamp.ts","../src/components/shared/BackgroundsContainer/components/Parallax/index.tsx","../src/components/shared/BackgroundsContainer/components/BackgroundVideo/index.tsx","../src/components/shared/BackgroundsContainer/components/Backgrounds/index.tsx","../src/components/shared/BackgroundsContainer/index.tsx"],"sourcesContent":["import { useMemo } from 'react'\n\nimport { ColorValue as Color } from '../utils/types'\nimport { ResponsiveValue } from '../../prop-controllers'\nimport { isNonNullable } from '../utils/isNonNullable'\nimport { BackgroundsValue as ResponsiveBackgroundsValue } from '../../prop-controllers/descriptors'\nimport { useFiles, useSwatches } from '../../runtimes/react/hooks/makeswift-api'\nimport {\n getBackgroundsFileIds,\n getBackgroundsSwatchIds,\n} from '../../prop-controllers/introspection'\n\ntype BackgroundColorData = Color\n\ntype BackgroundGradientStopData = {\n id: string\n location: number\n color: Color | null | undefined\n}\n\ntype BackgroundGradientData = {\n angle?: number\n isRadial?: boolean\n stops: Array<BackgroundGradientStopData>\n}\n\ntype BackgroundImageData = {\n publicUrl?: string\n dimensions?: { width: number; height: number } | null\n position: {\n x: number\n y: number\n }\n size?: 'cover' | 'contain' | 'auto'\n repeat?: 'no-repeat' | 'repeat-x' | 'repeat-y' | 'repeat'\n opacity?: number\n parallax?: number\n}\n\ntype BackgroundVideoData = {\n url?: string\n maskColor: Color | null | undefined\n aspectRatio?: 'wide' | 'standard'\n opacity?: number\n zoom?: number\n parallax?: number\n}\n\ntype BackgroundData =\n | { id: string; type: 'color'; payload: BackgroundColorData | null | undefined }\n | { id: string; type: 'image'; payload: BackgroundImageData | null | undefined }\n | { id: string; type: 'gradient'; payload: BackgroundGradientData | null | undefined }\n | { id: string; type: 'video'; payload: BackgroundVideoData | null | undefined }\n\nexport type BackgroundsData = Array<BackgroundData>\n\nexport type BackgroundsPropControllerData = ResponsiveValue<BackgroundsData>\n\nexport function useBackgrounds(\n value: ResponsiveBackgroundsValue | null | undefined,\n): BackgroundsPropControllerData | null | undefined {\n const fileIds = getBackgroundsFileIds(value)\n const files = useFiles(fileIds)\n const swatchIds = getBackgroundsSwatchIds(value)\n const swatches = useSwatches(swatchIds)\n\n return useMemo(() => {\n if (value == null) return null\n\n return value.map(({ value: backgrounds, ...restOfValue }) => ({\n ...restOfValue,\n value: backgrounds\n .map((bg): BackgroundData | null | undefined => {\n if (bg.type === 'image' && bg.payload != null && bg.payload.imageId != null) {\n const { imageId, ...restOfPayload } = bg.payload\n const file = files.find(f => f && f.id === imageId)\n\n return (\n file && {\n id: bg.id,\n type: 'image',\n payload: {\n ...restOfPayload,\n publicUrl: file.publicUrl,\n dimensions: file.dimensions,\n },\n }\n )\n }\n\n if (bg.type === 'color' && bg.payload != null) {\n const { swatchId, alpha } = bg.payload\n const swatch = swatches.filter(isNonNullable).find(s => s && s.id === swatchId)\n\n return { id: bg.id, type: 'color', payload: { swatch, alpha } }\n }\n\n if (bg.type === 'gradient' && bg.payload != null && bg.payload.stops.length > 0) {\n return {\n id: bg.id,\n type: 'gradient',\n payload: {\n angle: bg.payload.angle,\n isRadial: bg.payload.isRadial,\n stops: bg.payload.stops.map(({ color, ...restOfStop }) => ({\n ...restOfStop,\n color: color && {\n swatch: swatches.filter(isNonNullable).find(s => s && s.id === color.swatchId),\n alpha: color.alpha,\n },\n })),\n },\n }\n }\n\n if (bg.type === 'video' && bg.payload != null) {\n const { maskColor, ...restOfPayload } = bg.payload\n const swatch = maskColor && swatches.find(s => s && s.id === maskColor.swatchId)\n\n return {\n id: bg.id,\n type: 'video',\n payload: {\n ...restOfPayload,\n maskColor: swatch && maskColor && { swatch, alpha: maskColor.alpha },\n },\n }\n }\n\n return null\n })\n .filter(isNonNullable),\n }))\n }, [files, swatches, value])\n}\n","import { cx } from '@emotion/css'\nimport { ComponentPropsWithoutRef } from 'react'\nimport {\n ResponsiveValue,\n Length as LengthValue,\n ResponsiveNumberValue,\n} from '../../prop-controllers'\nimport { useStyle } from '../../runtimes/react/use-style'\nimport { useItemAnimation } from '../builtin/Box/animations'\nimport { useResponsiveGridItem } from '../utils/responsive-style'\n\ntype BaseProps = {\n className?: string\n grid: ResponsiveValue<{ spans: Array<Array<number>>; count: number }>\n index: number\n columnGap?: ResponsiveValue<LengthValue>\n rowGap?: ResponsiveValue<LengthValue>\n itemAnimateDuration?: ResponsiveNumberValue\n itemAnimateDelay?: ResponsiveNumberValue\n itemStaggerDuration?: ResponsiveNumberValue\n}\n\ntype Props = BaseProps & Omit<ComponentPropsWithoutRef<'div'>, keyof BaseProps>\n\nexport const gridItemIdentifierClassName = 'grid-item'\n\nexport function GridItem({\n grid,\n index,\n columnGap,\n rowGap,\n className,\n itemAnimateDuration,\n itemAnimateDelay,\n itemStaggerDuration,\n ...restOfProps\n}: Props) {\n const gridItemClassName = useStyle(useResponsiveGridItem({ grid, index, columnGap, rowGap }))\n const animationClassName = useItemAnimation(\n itemAnimateDuration,\n itemAnimateDelay,\n itemStaggerDuration,\n index,\n )\n\n return (\n <div\n {...restOfProps}\n className={cx(gridItemClassName, className, animationClassName, gridItemIdentifierClassName)}\n />\n )\n}\n","import { CSSObject } from '@emotion/css'\nimport { useState, useEffect, useCallback, useRef } from 'react'\nimport {\n ResponsiveNumberValue,\n ResponsiveSelectValue,\n ResponsiveValue,\n} from '../../../prop-controllers'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { useMediaQuery } from '../../hooks'\nimport { gridItemIdentifierClassName } from '../../shared/grid-item'\nimport {\n BoxAnimateIn,\n DEFAULT_BOX_ANIMATE_DELAY,\n DEFAULT_BOX_ANIMATE_DURATION,\n DEFAULT_BOX_ANIMATE_TYPE,\n DEFAULT_ITEM_ANIMATE_TYPE,\n DEFAULT_ITEM_STAGGER_DURATION,\n} from './constants'\n\nfunction useElementOnScreen(\n options: IntersectionObserverInit,\n): [boolean, (element: HTMLElement | null) => void] {\n const [isVisible, setIsVisible] = useState(false)\n const intersectionObserverRef = useRef<IntersectionObserver | null>(null)\n\n const setElement = useCallback((element: HTMLElement | null) => {\n if (element != null) {\n const observer = new IntersectionObserver(([entry]) => {\n if (entry?.isIntersecting) setIsVisible(true)\n }, options)\n\n observer.observe(element)\n\n intersectionObserverRef.current = observer\n } else {\n intersectionObserverRef.current?.disconnect()\n\n intersectionObserverRef.current = null\n }\n }, [])\n\n return [isVisible, setElement]\n}\n\nexport type BoxAnimationProps = {\n boxAnimateType?: ResponsiveSelectValue<BoxAnimateIn>\n boxAnimateDuration?: ResponsiveNumberValue\n boxAnimateDelay?: ResponsiveNumberValue\n itemAnimateType?: ResponsiveSelectValue<BoxAnimateIn>\n itemAnimateDuration?: ResponsiveNumberValue\n itemAnimateDelay?: ResponsiveNumberValue\n itemStaggerDuration?: ResponsiveNumberValue\n}\n\nfunction compareResponsiveValues<T>(a?: ResponsiveValue<T>, b?: ResponsiveValue<T>) {\n if (a == null && b == null) {\n return true\n }\n if (a != null && b != null) {\n let isEqual = true\n a.forEach((currentA, index) => {\n const currentB = b.at(index)\n if (currentB == null) {\n isEqual = false\n return\n }\n\n if (currentA.deviceId != currentB?.deviceId || currentA.value != currentB.value) {\n isEqual = false\n }\n })\n return isEqual\n }\n\n return false\n}\n\nexport function areBoxAnimationPropsEqual(prevProps: BoxAnimationProps, props: BoxAnimationProps) {\n return (\n compareResponsiveValues(prevProps.boxAnimateType, props.boxAnimateType) &&\n compareResponsiveValues(prevProps.boxAnimateDuration, props.boxAnimateDuration) &&\n compareResponsiveValues(prevProps.boxAnimateDelay, props.boxAnimateDelay) &&\n compareResponsiveValues(prevProps.itemAnimateType, props.itemAnimateType) &&\n compareResponsiveValues(prevProps.itemAnimateDuration, props.itemAnimateDuration) &&\n compareResponsiveValues(prevProps.itemAnimateDelay, props.itemAnimateDelay) &&\n compareResponsiveValues(prevProps.itemStaggerDuration, props.itemStaggerDuration)\n )\n}\n\nconst exitedBoxAnimationProperties: { [key in BoxAnimateIn]: CSSObject } = {\n none: { opacity: 1 },\n fadeIn: { opacity: 0 },\n fadeLeft: { transform: 'translate3d(60px,0,0)', opacity: 0 },\n fadeRight: { transform: 'translate3d(-60px,0,0)', opacity: 0 },\n fadeDown: { transform: 'translate3d(0,-80px,0)', opacity: 0 },\n fadeUp: { transform: 'translate3d(0,80px,0)', opacity: 0 },\n blurIn: { filter: 'blur(20px)', opacity: 0 },\n scaleDown: {\n transform: 'scale(1.2)',\n opacity: 0,\n },\n scaleUp: {\n transform: 'scale(.75)',\n opacity: 0,\n },\n}\n\nconst enteredBoxAnimationProperties: { [key in BoxAnimateIn]: CSSObject } = {\n none: { opacity: 1 },\n fadeIn: { opacity: 1 },\n fadeLeft: { transform: 'translate3d(0px,0,0)', opacity: 1 },\n fadeRight: { transform: 'translate3d(0px,0,0)', opacity: 1 },\n fadeDown: { transform: 'translate3d(0,0px,0)', opacity: 1 },\n fadeUp: { transform: 'translate3d(0,0px,0)', opacity: 1 },\n blurIn: { filter: 'blur(0px)', opacity: 1 },\n scaleDown: {\n transform: 'scale(1)',\n opacity: 1,\n },\n scaleUp: {\n transform: 'scale(1)',\n opacity: 1,\n },\n}\n\nexport function useBoxAnimation(\n responsiveAnimationType: ResponsiveValue<BoxAnimateIn> | undefined,\n responsiveDuration: ResponsiveValue<number> | undefined,\n responisveDelay: ResponsiveValue<number> | undefined,\n itemResponsiveAnimationType: ResponsiveValue<BoxAnimateIn> | undefined,\n): [string, () => void, (element: HTMLElement | null) => void] {\n const [isVisible, setElement] = useElementOnScreen({\n root: null,\n rootMargin: `0px 0px -10% 0px`,\n threshold: 0.2,\n })\n const animationType = useMediaQuery(responsiveAnimationType) || DEFAULT_BOX_ANIMATE_TYPE\n const itemAnimationType = useMediaQuery(itemResponsiveAnimationType) || DEFAULT_ITEM_ANIMATE_TYPE\n const duration = useMediaQuery(responsiveDuration) || DEFAULT_BOX_ANIMATE_DURATION\n const delay = useMediaQuery(responisveDelay) || DEFAULT_BOX_ANIMATE_DELAY\n const actualDelay = delay * 1000\n const actualDuration = duration * 1000\n\n const entered = {\n ...enteredBoxAnimationProperties[animationType],\n transition: `transform ${actualDuration}ms cubic-bezier(0.16, 0.84, 0.44, 1) ${actualDelay}ms,filter ${actualDuration}ms cubic-bezier(0.16, 0.84, 0.44, 1) ${actualDelay}ms, opacity ${actualDuration}ms ease ${actualDelay}ms`,\n [`& > div > .${gridItemIdentifierClassName}`]: {\n ...enteredBoxAnimationProperties[itemAnimationType],\n },\n }\n\n const exited = {\n ...exitedBoxAnimationProperties[animationType],\n transition: `all 0ms`,\n [`& > div > .${gridItemIdentifierClassName}`]: {\n ...exitedBoxAnimationProperties[itemAnimationType],\n },\n }\n\n const [isEntered, setEntered] = useState(false)\n\n useEffect(() => {\n if (isVisible && !isEntered) setEntered(true)\n }, [isVisible, entered])\n\n const replayAnimation = useCallback(() => {\n setEntered(false)\n }, [])\n\n return [\n useStyle({\n '@media (prefers-reduced-motion: no-preference)': isEntered ? entered : exited,\n }),\n replayAnimation,\n setElement,\n ]\n}\n\nexport function useItemAnimation(\n responsiveDuration: ResponsiveValue<number> | undefined,\n responisveDelay: ResponsiveValue<number> | undefined,\n responsiveStagger: ResponsiveValue<number> | undefined,\n index: number,\n) {\n const duration = useMediaQuery(responsiveDuration) || DEFAULT_BOX_ANIMATE_DURATION\n const delay = useMediaQuery(responisveDelay) || DEFAULT_BOX_ANIMATE_DELAY\n const stagger = useMediaQuery(responsiveStagger) || DEFAULT_ITEM_STAGGER_DURATION\n const delayFromStagger = responsiveStagger == null || index == null ? 0 : stagger * index\n const actualDelay = (delay + delayFromStagger) * 1000\n const actualDuration = duration * 1000\n\n return useStyle({\n '@media (prefers-reduced-motion: no-preference)': {\n transition: `transform ${actualDuration}ms cubic-bezier(0.16, 0.84, 0.44, 1) ${actualDelay}ms,filter ${actualDuration}ms cubic-bezier(0.16, 0.84, 0.44, 1) ${actualDelay}ms, opacity ${actualDuration}ms ease ${actualDelay}ms`,\n },\n })\n}\n","const clamp = (min: number, val: number, max: number): number => Math.min(Math.max(min, val), max)\n\nexport default clamp\n","import { useState, useRef, useCallback, ReactNode, CSSProperties } from 'react'\nimport clamp from '../../../../../utils/clamp'\nimport { useIsomorphicLayoutEffect } from '../../../../hooks/useIsomorphicLayoutEffect'\n\nfunction isScrollable(element: HTMLElement) {\n const { overflow, overflowY, overflowX } =\n element.ownerDocument.defaultView!.getComputedStyle(element)\n\n return /(auto|scroll)/.test(overflow + overflowX + overflowY)\n}\n\nfunction getScrollParent(element: HTMLElement): HTMLElement {\n const { parentElement } = element\n\n if (!element || !parentElement) return element\n\n if (isScrollable(element)) return element\n\n return getScrollParent(parentElement)\n}\n\ntype Props = {\n strength: number | null | undefined\n children: (\n getParallaxProps: <P extends { style?: CSSProperties; [key: string]: unknown }>(props: P) => P,\n ) => ReactNode\n}\n\nexport default function Parallax({ strength, children, ...rest }: Props): JSX.Element {\n const container = useRef<HTMLDivElement>(null)\n const [containerScrollTop, setContainerScrollTop] = useState(strength == null ? 0 : strength)\n const lastScrollParentScrollTop = useRef(0)\n\n useIsomorphicLayoutEffect(() => {\n if (!container.current || strength == null || strength === 0) return undefined\n\n const containerDocument = container.current.ownerDocument\n const scrollParent = getScrollParent(container.current)\n const eventTarget =\n containerDocument.documentElement === scrollParent\n ? containerDocument.defaultView!\n : scrollParent\n\n lastScrollParentScrollTop.current = scrollParent.scrollTop\n setContainerScrollTop(strength)\n\n function handleScroll() {\n containerDocument.defaultView!.requestAnimationFrame(() => {\n if (!container.current) return\n\n const { top: containerTop, bottom: containerBottom } =\n container.current.getBoundingClientRect()\n const { top: scrollParentTop, bottom: scrollParentBottom } =\n scrollParent === containerDocument.documentElement\n ? { top: 0, bottom: containerDocument.defaultView!.innerHeight }\n : scrollParent.getBoundingClientRect()\n const { scrollTop: scrollParentScrollTop } =\n scrollParent === containerDocument.documentElement\n ? { scrollTop: containerDocument.defaultView!.pageYOffset }\n : scrollParent\n const scrollParentHeight = scrollParentBottom - scrollParentTop\n const scrollParentScrollDelta = scrollParentScrollTop - lastScrollParentScrollTop.current\n\n lastScrollParentScrollTop.current = scrollParentScrollTop\n\n setContainerScrollTop(scrollTop => {\n const isContainerVisible =\n containerTop < scrollParentTop + scrollParentHeight && containerBottom > scrollParentTop\n const containerScrollRemaining =\n scrollParentScrollDelta > 0 ? 2 * strength! - scrollTop : scrollTop\n const scrollParentScrollRemaining =\n scrollParentScrollDelta > 0\n ? scrollParentTop + containerBottom\n : scrollParentHeight - containerTop\n const parallaxRatio = containerScrollRemaining / scrollParentScrollRemaining\n const containerScrollDelta = isContainerVisible\n ? parallaxRatio * scrollParentScrollDelta\n : 0\n\n return clamp(0, scrollTop + containerScrollDelta, strength! * 2)\n })\n })\n }\n\n eventTarget.addEventListener('scroll', handleScroll)\n\n return () => eventTarget.removeEventListener('scroll', handleScroll)\n }, [strength])\n\n const getProps = useCallback(\n ({ style, ...restOfChildrenProps }: any) => ({\n ...restOfChildrenProps,\n style: {\n ...style,\n position: 'absolute',\n left: 0,\n right: 0,\n top: 0,\n bottom: 0,\n ...(strength == null || strength === 0\n ? {}\n : {\n top: -strength,\n bottom: -strength,\n transform: `translate3d(0, ${containerScrollTop - strength}px, 0)`,\n }),\n },\n }),\n [strength, containerScrollTop],\n )\n\n return (\n <div\n {...rest}\n ref={container}\n style={{ position: 'absolute', top: 0, left: 0, right: 0, bottom: 0 }}\n >\n {children(getProps)}\n </div>\n )\n}\n","import { cx } from '@emotion/css'\nimport { useState, useRef, ComponentPropsWithoutRef, ForwardedRef, forwardRef } from 'react'\nimport ReactPlayer from 'react-player'\nimport { useStyle } from '../../../../../runtimes/react/use-style'\n\nimport { useIsomorphicLayoutEffect } from '../../../../hooks/useIsomorphicLayoutEffect'\n\nconst Container = forwardRef(function Container(\n { className, ...restOfProps }: ComponentPropsWithoutRef<'div'>,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n return (\n <div\n {...restOfProps}\n ref={ref}\n className={cx(\n useStyle({\n position: 'absolute',\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n pointerEvents: 'none',\n overflow: 'hidden',\n }),\n className,\n )}\n />\n )\n})\n\nfunction Mask({\n backgroundColor,\n visible,\n}: {\n backgroundColor: string | undefined\n visible: boolean\n}) {\n return (\n <div\n className={useStyle({\n position: 'absolute',\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n background: backgroundColor,\n opacity: visible ? 1 : 0,\n transition: 'opacity 1s',\n })}\n />\n )\n}\n\nconst getScale = (element: HTMLElement, aspectRatio: number, zoom: number) => {\n const { offsetWidth: width, offsetHeight: height } = element\n const computedAspectRatio = width / height\n\n return Math.max(aspectRatio / computedAspectRatio, computedAspectRatio / aspectRatio) * zoom\n}\n\ntype Props = {\n url?: string\n aspectRatio?: number\n zoom?: number\n opacity?: number\n maskColor?: string\n}\n\nexport default function BackgroundVideo({\n url = '',\n aspectRatio = 16 / 9,\n zoom = 1,\n maskColor,\n opacity,\n}: Props): JSX.Element {\n const [ready, setReady] = useState(false)\n const [scale, setScale] = useState(1)\n const container = useRef<HTMLDivElement>(null)\n\n useIsomorphicLayoutEffect(() => {\n const { current: containerEl } = container\n\n if (!containerEl) return undefined\n\n const { defaultView } = containerEl.ownerDocument\n const handleResize = () => setScale(getScale(containerEl, aspectRatio, zoom))\n\n handleResize()\n\n defaultView!.addEventListener('resize', handleResize)\n\n return () => defaultView!.removeEventListener('resize', handleResize)\n }, [aspectRatio, zoom])\n\n if (!ReactPlayer.canPlay(url)) return <></>\n\n return (\n <Container ref={container}>\n {container.current && (\n <ReactPlayer\n url={url}\n config={{\n vimeo: { playerOptions: { background: true } },\n youtube: {\n playerVars: {\n origin: container.current.ownerDocument.defaultView?.location.origin,\n },\n },\n wistia: {\n options: {\n endVideoBehavior: 'loop',\n playbackRateControl: false,\n playbar: false,\n playButton: false,\n volumeControl: false,\n fullscreenButton: false,\n muted: true,\n },\n },\n }}\n playing\n loop\n muted\n controls={false}\n onReady={() => setReady(true)}\n style={{\n transform: `scale3d(${scale}, ${scale}, 1)`,\n opacity,\n }}\n width=\"100%\"\n height=\"100%\"\n />\n )}\n <Mask backgroundColor={maskColor} visible={!ready} />\n </Container>\n )\n}\n","import NextImage from 'next/image'\nimport type NextLegacyImageType from 'next/legacy/image'\n\nimport { BackgroundsPropControllerData, BackgroundsData } from '../../../../hooks'\nimport { ResponsiveValue } from '../../../../../prop-controllers'\nimport { ColorValue as Color } from '../../../../utils/types'\nimport { colorToString } from '../../../../utils/colorToString'\nimport Parallax from '../Parallax'\nimport BackgroundVideo from '../BackgroundVideo'\nimport { CSSObject } from '@emotion/css'\nimport { useStyle } from '../../../../../runtimes/react/use-style'\nimport { useResponsiveStyle } from '../../../../utils/responsive-style'\nimport { major as nextMajorVersion } from '../../../../../next/next-version'\n\nconst NextLegacyImage = NextImage as typeof NextLegacyImageType\n\nfunction getColor(color: Color | null | undefined) {\n if (color == null) return 'black'\n\n if (color.swatch == null) {\n return colorToString({ ...color, swatch: { hue: 0, saturation: 0, lightness: 0 } })\n }\n\n return colorToString(color)\n}\n\ntype GradientStop = { color: Color | null | undefined; location: number }\n\nconst getStopsStyle = (stops: GradientStop[]) =>\n stops.map(({ color, location }) => `${getColor(color)} ${location}%`).join(',')\n\nconst absoluteFillStyle: CSSObject = {\n position: 'absolute',\n top: 0,\n right: 0,\n bottom: 0,\n left: 0,\n}\n\nconst containerStyle: CSSObject = {\n ...absoluteFillStyle,\n borderRadius: 'inherit',\n}\n\ntype Props = { backgrounds: BackgroundsPropControllerData | null | undefined }\n\nexport default function Backgrounds({ backgrounds }: Props): JSX.Element {\n if (backgrounds == null) return <></>\n\n return (\n <>\n {backgrounds.map(({ value, deviceId }) => {\n const visibility = backgrounds.map(v => ({\n deviceId: v.deviceId,\n value: v.deviceId === deviceId,\n }))\n\n return <BackgroundDeviceLayer key={deviceId} layer={value} visibility={visibility} />\n })}\n </>\n )\n}\n\ntype BackgroundLayerProps = {\n layer: BackgroundsData\n visibility: ResponsiveValue<boolean>\n}\n\nfunction BackgroundDeviceLayer({ layer, visibility }: BackgroundLayerProps) {\n const visibilityStyle = useResponsiveStyle([visibility], ([v]) => ({\n display: v === true ? 'block' : 'none',\n }))\n\n return (\n <div className={useStyle({ ...containerStyle, ...visibilityStyle, overflow: 'hidden' })}>\n {[...layer].reverse().map(bg => {\n if (bg.type === 'color') {\n return <ColorBackground key={bg.id} color={getColor(bg.payload)} />\n }\n\n if (bg.type === 'image' && bg.payload) {\n return <ImageBackground {...bg.payload} key={bg.id} />\n }\n\n if (bg.type === 'gradient' && bg.payload) {\n return (\n <GradientBackground\n {...bg.payload}\n key={bg.id}\n gradient={getStopsStyle(bg.payload.stops)}\n />\n )\n }\n\n if (bg.type === 'video' && bg.payload) {\n return (\n <VideoBackground\n {...bg.payload}\n key={bg.id}\n maskColor={getColor(bg.payload.maskColor)}\n />\n )\n }\n\n return null\n })}\n </div>\n )\n}\n\ntype ColorBackgroundProps = { color: string }\n\nfunction ColorBackground({ color }: ColorBackgroundProps) {\n return <div className={useStyle({ ...containerStyle, backgroundColor: color })} />\n}\n\nconst ImageBackgroundRepeat = {\n NoRepeat: 'no-repeat',\n RepeatX: 'repeat-x',\n RepeatY: 'repeat-y',\n Repeat: 'repeat',\n} as const\n\ntype ImageBackgroundRepeat = typeof ImageBackgroundRepeat[keyof typeof ImageBackgroundRepeat]\n\nconst ImageBackgroundSize = {\n Cover: 'cover',\n Contain: 'contain',\n Auto: 'auto',\n} as const\n\ntype ImageBackgroundSize = typeof ImageBackgroundSize[keyof typeof ImageBackgroundSize]\n\ntype ImageBackgroundProps = {\n publicUrl?: string\n position: { x: number; y: number }\n repeat?: ImageBackgroundRepeat\n size?: ImageBackgroundSize\n opacity?: number\n parallax?: number\n}\n\nfunction ImageBackground({\n publicUrl,\n position,\n repeat = ImageBackgroundRepeat.NoRepeat,\n size = ImageBackgroundSize.Cover,\n opacity,\n parallax,\n}: ImageBackgroundProps) {\n const backgroundPosition = `${position.x}% ${position.y}%`\n const containerClassName = useStyle(containerStyle)\n\n if (repeat === 'no-repeat' && size !== 'auto' && publicUrl != null) {\n return (\n <Parallax strength={parallax}>\n {getParallaxProps => (\n <div {...getParallaxProps({ style: { opacity, overflow: 'hidden' } })}>\n {nextMajorVersion < 13 ? (\n <NextLegacyImage\n src={publicUrl}\n layout=\"fill\"\n objectPosition={backgroundPosition}\n objectFit={size}\n />\n ) : (\n <NextImage\n src={publicUrl}\n alt={''}\n fill\n sizes=\"100vw\"\n style={{\n objectPosition: backgroundPosition,\n objectFit: size,\n }}\n />\n )}\n </div>\n )}\n </Parallax>\n )\n }\n\n return (\n <Parallax strength={parallax}>\n {getParallaxProps => (\n <div\n className={containerClassName}\n {...getParallaxProps({\n style: {\n backgroundImage: publicUrl != null ? `url('${publicUrl}')` : undefined,\n backgroundPosition,\n backgroundRepeat: repeat,\n backgroundSize: size,\n opacity,\n },\n })}\n />\n )}\n </Parallax>\n )\n}\n\ntype GradientBackgroundProps = {\n gradient: string\n angle?: number\n isRadial?: boolean\n}\n\nfunction GradientBackground({\n gradient,\n isRadial = false,\n angle = Math.PI,\n}: GradientBackgroundProps) {\n return (\n <div\n className={useStyle({\n ...containerStyle,\n background: isRadial\n ? `radial-gradient(${gradient})`\n : `linear-gradient(${angle}rad, ${gradient})`,\n })}\n />\n )\n}\n\nconst BackgroundVideoAspectRatio = {\n Wide: 'wide',\n Standard: 'standard',\n} as const\n\ntype BackgroundVideoAspectRatio =\n typeof BackgroundVideoAspectRatio[keyof typeof BackgroundVideoAspectRatio]\n\nfunction getAspectRatio(aspectRatio: BackgroundVideoAspectRatio | null | undefined): number {\n switch (aspectRatio) {\n case 'wide':\n return 16 / 9\n\n case 'standard':\n return 4 / 3\n\n default:\n return 16 / 9\n }\n}\n\ntype VideoBackgroundProps = {\n url?: string\n aspectRatio?: BackgroundVideoAspectRatio\n maskColor: string\n zoom?: number\n opacity?: number\n parallax?: number\n}\n\nfunction VideoBackground({\n url,\n aspectRatio,\n maskColor,\n zoom,\n opacity,\n parallax,\n}: VideoBackgroundProps) {\n return (\n <Parallax strength={parallax}>\n {getParallaxProps => (\n <div {...getParallaxProps({ className: useStyle(containerStyle) })}>\n <BackgroundVideo\n url={url}\n zoom={zoom}\n opacity={opacity}\n aspectRatio={getAspectRatio(aspectRatio)}\n maskColor={maskColor}\n />\n </div>\n )}\n </Parallax>\n )\n}\n","import { cx } from '@emotion/css'\nimport {\n Children,\n ComponentPropsWithoutRef,\n ElementType,\n forwardRef,\n ReactElement,\n Ref,\n} from 'react'\nimport { BackgroundsValue as BackgroundsPropControllerValue } from '../../../prop-controllers/descriptors'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { useBackgrounds } from '../../hooks'\nimport Backgrounds from './components/Backgrounds'\n\ntype BaseProps = {\n backgrounds: BackgroundsPropControllerValue | null | undefined\n children: ReactElement<ElementType>\n}\n\ntype Props = BaseProps & Omit<ComponentPropsWithoutRef<'div'>, keyof BaseProps>\n\nexport default forwardRef<HTMLDivElement | null, Props>(function BackgroundsContainer(\n { backgrounds, children, className, ...restOfProps }: Props,\n ref: Ref<HTMLDivElement>,\n) {\n return (\n <div\n {...restOfProps}\n ref={ref}\n className={cx(\n useStyle({\n position: 'relative',\n width: '100%',\n margin: '0 auto',\n '> *': {\n borderRadius: 'inherit',\n height: 'inherit',\n },\n '> :last-child': {\n position: 'relative',\n },\n }),\n className,\n )}\n >\n <Backgrounds backgrounds={useBackgrounds(backgrounds)} />\n {Children.only(children)}\n </div>\n )\n})\n"],"names":["getBackgroundsFileIds","useFiles","getBackgroundsSwatchIds","useSwatches","useMemo","isNonNullable","gridItemIdentifierClassName","grid","index","columnGap","rowGap","className","itemAnimateDuration","itemAnimateDelay","itemStaggerDuration","restOfProps","gridItemClassName","useStyle","useResponsiveGridItem","animationClassName","useItemAnimation","cx","options","isVisible","setIsVisible","useState","intersectionObserverRef","useRef","setElement","useCallback","element","observer","IntersectionObserver","entry","isIntersecting","observe","current","disconnect","a","b","isEqual","forEach","currentA","currentB","at","deviceId","value","prevProps","props","compareResponsiveValues","boxAnimateType","boxAnimateDuration","boxAnimateDelay","itemAnimateType","exitedBoxAnimationProperties","none","opacity","fadeIn","fadeLeft","transform","fadeRight","fadeDown","fadeUp","blurIn","filter","scaleDown","scaleUp","enteredBoxAnimationProperties","responsiveAnimationType","responsiveDuration","responisveDelay","itemResponsiveAnimationType","useElementOnScreen","root","rootMargin","threshold","animationType","useMediaQuery","DEFAULT_BOX_ANIMATE_TYPE","itemAnimationType","DEFAULT_ITEM_ANIMATE_TYPE","duration","DEFAULT_BOX_ANIMATE_DURATION","delay","DEFAULT_BOX_ANIMATE_DELAY","actualDelay","actualDuration","entered","transition","exited","isEntered","setEntered","useEffect","replayAnimation","responsiveStagger","stagger","DEFAULT_ITEM_STAGGER_DURATION","delayFromStagger","overflow","overflowY","overflowX","ownerDocument","defaultView","getComputedStyle","test","parentElement","isScrollable","getScrollParent","strength","children","rest","container","containerScrollTop","setContainerScrollTop","lastScrollParentScrollTop","useIsomorphicLayoutEffect","undefined","containerDocument","scrollParent","eventTarget","documentElement","scrollTop","requestAnimationFrame","top","containerTop","bottom","containerBottom","getBoundingClientRect","scrollParentTop","scrollParentBottom","innerHeight","scrollParentScrollTop","pageYOffset","scrollParentHeight","scrollParentScrollDelta","isContainerVisible","containerScrollRemaining","scrollParentScrollRemaining","parallaxRatio","containerScrollDelta","clamp","addEventListener","handleScroll","removeEventListener","getProps","style","restOfChildrenProps","position","left","right","Container","forwardRef","ref","pointerEvents","backgroundColor","visible","background","getScale","aspectRatio","zoom","offsetWidth","width","offsetHeight","height","computedAspectRatio","Math","max","url","maskColor","ready","setReady","scale","setScale","containerEl","handleResize","ReactPlayer","canPlay","_jsx","_Fragment","vimeo","playerOptions","youtube","playerVars","origin","location","wistia","endVideoBehavior","playbackRateControl","playbar","playButton","volumeControl","fullscreenButton","muted","NextLegacyImage","NextImage","color","swatch","colorToString","hue","saturation","lightness","getStopsStyle","stops","map","getColor","join","absoluteFillStyle","containerStyle","borderRadius","backgrounds","visibility","v","layer","visibilityStyle","useResponsiveStyle","display","reverse","bg","type","payload","id","ImageBackgroundRepeat","NoRepeat","RepeatX","RepeatY","Repeat","ImageBackgroundSize","Cover","Contain","Auto","publicUrl","repeat","size","parallax","backgroundPosition","x","y","containerClassName","getParallaxProps","nextMajorVersion","objectPosition","objectFit","backgroundImage","backgroundRepeat","backgroundSize","gradient","isRadial","angle","PI","getAspectRatio","margin","useBackgrounds","Children","only"],"mappings":"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"}
|
package/dist/index.cjs3.js
CHANGED
|
@@ -34,7 +34,6 @@ var React = require("react");
|
|
|
34
34
|
var scrollIntoView = require("scroll-into-view-if-needed");
|
|
35
35
|
var NextLink = require("next/link");
|
|
36
36
|
var next = require("./index.cjs.js");
|
|
37
|
-
var responsiveStyle = require("./responsive-style.cjs.js");
|
|
38
37
|
var jsxRuntime = require("react/jsx-runtime");
|
|
39
38
|
function _interopDefaultLegacy(e) {
|
|
40
39
|
return e && typeof e === "object" && "default" in e ? e : { "default": e };
|
|
@@ -52,7 +51,7 @@ const Link = React.forwardRef(function Link2(_a, ref) {
|
|
|
52
51
|
]);
|
|
53
52
|
var _a2;
|
|
54
53
|
const pageId = link && link.type === "OPEN_PAGE" ? link.payload.pageId : null;
|
|
55
|
-
const page =
|
|
54
|
+
const page = next.usePagePathnameSlice(pageId != null ? pageId : null);
|
|
56
55
|
const elementKey = (link == null ? void 0 : link.type) === "SCROLL_TO_ELEMENT" ? (_a2 = link.payload.elementIdConfig) == null ? void 0 : _a2.elementKey : null;
|
|
57
56
|
const elementId = next.useElementId(elementKey);
|
|
58
57
|
let useNextLink;
|
package/dist/index.cjs3.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs3.js","sources":["../src/components/shared/Link/index.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef, MouseEvent } from 'react'\nimport scrollIntoView from 'scroll-into-view-if-needed'\nimport NextLink from 'next/link'\n\nimport { LinkValue as LinkPropControllerValue } from '../../../prop-controllers/descriptors'\nimport { useElementId } from '../../../runtimes/react'\nimport { usePagePathnameSlice } from '../../../runtimes/react/hooks/makeswift-api'\n\ntype BaseProps = {\n link?: LinkPropControllerValue\n onClick?: (event: MouseEvent<HTMLAnchorElement>) => unknown\n}\n\ntype Props = BaseProps & Omit<ComponentPropsWithoutRef<'a'>, keyof BaseProps>\n\nexport const Link = forwardRef<HTMLAnchorElement, Props>(function Link(\n { link, onClick = () => {}, ...restOfProps }: Props,\n ref,\n) {\n const pageId = link && link.type === 'OPEN_PAGE' ? link.payload.pageId : null\n const page = usePagePathnameSlice(pageId ?? null)\n const elementKey =\n link?.type === 'SCROLL_TO_ELEMENT' ? link.payload.elementIdConfig?.elementKey : null\n const elementId = useElementId(elementKey)\n\n // We don't want to use `next/link` with relative paths because Next.js will attempt to normalize\n // it and mess up the path.\n let useNextLink: boolean | undefined\n let href: string | undefined\n let target: '_blank' | '_self' | undefined\n let block: 'start' | 'center' | 'end' | undefined\n\n if (link) {\n switch (link.type) {\n case 'OPEN_PAGE': {\n if (page) {\n useNextLink = true\n\n href = `/${page.pathname}`\n }\n\n target = link.payload.openInNewTab ? '_blank' : '_self'\n\n break\n }\n\n case 'OPEN_URL': {\n useNextLink = true\n\n href = link.payload.url\n\n target = link.payload.openInNewTab ? '_blank' : '_self'\n\n break\n }\n\n case 'SEND_EMAIL': {\n useNextLink = false\n\n const { to, subject = '', body = '' } = link.payload\n\n if (to != null) href = `mailto:${to}?subject=${subject}&body=${body}`\n\n break\n }\n\n case 'CALL_PHONE': {\n useNextLink = false\n\n href = `tel:${link.payload.phoneNumber}`\n\n break\n }\n\n case 'SCROLL_TO_ELEMENT': {\n useNextLink = false\n\n href = `#${elementId ?? ''}`\n\n block = link.payload.block\n\n break\n }\n\n default:\n throw new RangeError(`Invalid link type \"${(link as any).type}.\"`)\n }\n }\n\n function handleClick(event: MouseEvent<HTMLAnchorElement>) {\n onClick(event)\n\n if (event.defaultPrevented) return\n\n /**\n * When we introduced `next/link` instead of just `a` element slate no longer prevented link from navigating within\n * content mode. This is a hack to compensate for what would be expected as slate's default behavior.\n * On upgrade of slate this can be reevaluated.\n */\n if (event.currentTarget.isContentEditable) return event.preventDefault()\n\n if (link && link.type === 'SCROLL_TO_ELEMENT') {\n let hash: string | undefined\n\n try {\n if (href != null) hash = new URL(`http://www.example.com/${href}`).hash\n } catch (error) {\n console.error(`Link received invalid href: ${href}`, error)\n }\n\n if (href != null && hash != null && href === hash) {\n event.preventDefault()\n const view = event.view as unknown as Window\n\n scrollIntoView(view.document.querySelector(hash)!, {\n behavior: 'smooth',\n block,\n })\n\n if (view.location.hash !== hash) view.history.pushState({}, '', hash)\n }\n }\n }\n\n if (useNextLink && href != null) {\n return (\n <NextLink\n {...restOfProps}\n ref={ref}\n target={target}\n onClick={handleClick}\n href={href}\n // Next.js v12 has legacyBehavior set to true by default\n legacyBehavior={false}\n />\n )\n }\n\n // eslint-disable-next-line\n return <a {...restOfProps} ref={ref} href={href} target={target} onClick={handleClick} />\n})\n"],"names":["Link","forwardRef","ref","link","onClick","restOfProps","pageId","type","payload","page","usePagePathnameSlice","elementKey","elementIdConfig","elementId","useElementId","useNextLink","href","target","block","pathname","openInNewTab","url","to","subject","body","phoneNumber","RangeError","handleClick","event","defaultPrevented","currentTarget","isContentEditable","preventDefault","hash","URL","error","view","scrollIntoView","document","querySelector","behavior","location","history","pushState","NextLink"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.cjs3.js","sources":["../src/components/shared/Link/index.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef, MouseEvent } from 'react'\nimport scrollIntoView from 'scroll-into-view-if-needed'\nimport NextLink from 'next/link'\n\nimport { LinkValue as LinkPropControllerValue } from '../../../prop-controllers/descriptors'\nimport { useElementId } from '../../../runtimes/react'\nimport { usePagePathnameSlice } from '../../../runtimes/react/hooks/makeswift-api'\n\ntype BaseProps = {\n link?: LinkPropControllerValue\n onClick?: (event: MouseEvent<HTMLAnchorElement>) => unknown\n}\n\ntype Props = BaseProps & Omit<ComponentPropsWithoutRef<'a'>, keyof BaseProps>\n\nexport const Link = forwardRef<HTMLAnchorElement, Props>(function Link(\n { link, onClick = () => {}, ...restOfProps }: Props,\n ref,\n) {\n const pageId = link && link.type === 'OPEN_PAGE' ? link.payload.pageId : null\n const page = usePagePathnameSlice(pageId ?? null)\n const elementKey =\n link?.type === 'SCROLL_TO_ELEMENT' ? link.payload.elementIdConfig?.elementKey : null\n const elementId = useElementId(elementKey)\n\n // We don't want to use `next/link` with relative paths because Next.js will attempt to normalize\n // it and mess up the path.\n let useNextLink: boolean | undefined\n let href: string | undefined\n let target: '_blank' | '_self' | undefined\n let block: 'start' | 'center' | 'end' | undefined\n\n if (link) {\n switch (link.type) {\n case 'OPEN_PAGE': {\n if (page) {\n useNextLink = true\n\n href = `/${page.pathname}`\n }\n\n target = link.payload.openInNewTab ? '_blank' : '_self'\n\n break\n }\n\n case 'OPEN_URL': {\n useNextLink = true\n\n href = link.payload.url\n\n target = link.payload.openInNewTab ? '_blank' : '_self'\n\n break\n }\n\n case 'SEND_EMAIL': {\n useNextLink = false\n\n const { to, subject = '', body = '' } = link.payload\n\n if (to != null) href = `mailto:${to}?subject=${subject}&body=${body}`\n\n break\n }\n\n case 'CALL_PHONE': {\n useNextLink = false\n\n href = `tel:${link.payload.phoneNumber}`\n\n break\n }\n\n case 'SCROLL_TO_ELEMENT': {\n useNextLink = false\n\n href = `#${elementId ?? ''}`\n\n block = link.payload.block\n\n break\n }\n\n default:\n throw new RangeError(`Invalid link type \"${(link as any).type}.\"`)\n }\n }\n\n function handleClick(event: MouseEvent<HTMLAnchorElement>) {\n onClick(event)\n\n if (event.defaultPrevented) return\n\n /**\n * When we introduced `next/link` instead of just `a` element slate no longer prevented link from navigating within\n * content mode. This is a hack to compensate for what would be expected as slate's default behavior.\n * On upgrade of slate this can be reevaluated.\n */\n if (event.currentTarget.isContentEditable) return event.preventDefault()\n\n if (link && link.type === 'SCROLL_TO_ELEMENT') {\n let hash: string | undefined\n\n try {\n if (href != null) hash = new URL(`http://www.example.com/${href}`).hash\n } catch (error) {\n console.error(`Link received invalid href: ${href}`, error)\n }\n\n if (href != null && hash != null && href === hash) {\n event.preventDefault()\n const view = event.view as unknown as Window\n\n scrollIntoView(view.document.querySelector(hash)!, {\n behavior: 'smooth',\n block,\n })\n\n if (view.location.hash !== hash) view.history.pushState({}, '', hash)\n }\n }\n }\n\n if (useNextLink && href != null) {\n return (\n <NextLink\n {...restOfProps}\n ref={ref}\n target={target}\n onClick={handleClick}\n href={href}\n // Next.js v12 has legacyBehavior set to true by default\n legacyBehavior={false}\n />\n )\n }\n\n // eslint-disable-next-line\n return <a {...restOfProps} ref={ref} href={href} target={target} onClick={handleClick} />\n})\n"],"names":["Link","forwardRef","ref","link","onClick","restOfProps","pageId","type","payload","page","usePagePathnameSlice","elementKey","elementIdConfig","elementId","useElementId","useNextLink","href","target","block","pathname","openInNewTab","url","to","subject","body","phoneNumber","RangeError","handleClick","event","defaultPrevented","currentTarget","isContentEditable","preventDefault","hash","URL","error","view","scrollIntoView","document","querySelector","behavior","location","history","pushState","NextLink"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAeaA,MAAAA,OAAOC,MAAAA,WAAqC,eACvD,IACAC,KACA;AAFA,eAAEC;AAAAA;AAAAA,IAAMC,UAAU,MAAM;AAAA,IAAE;AAAA,MAA1B,IAA+BC,wBAA/B,IAA+BA;AAAAA,IAA7BF;AAAAA,IAAMC;AAAAA;;AAGR,QAAME,SAASH,QAAQA,KAAKI,SAAS,cAAcJ,KAAKK,QAAQF,SAAS;AACnEG,QAAAA,OAAOC,KAAAA,qBAAqBJ,0BAAU,IAAX;AACjC,QAAMK,aACJR,8BAAMI,UAAS,sBAAsBJ,YAAKK,QAAQI,oBAAbT,oBAA8BQ,aAAa;AAC5EE,QAAAA,YAAYC,kBAAaH,UAAD;AAI1BI,MAAAA;AACAC,MAAAA;AACAC,MAAAA;AACAC,MAAAA;AAEJ,MAAIf,MAAM;AACAA,YAAAA,KAAKI;AAAAA,WACN,aAAa;AAChB,YAAIE,MAAM;AACM,wBAAA;AAEdO,iBAAQ,IAAGP,KAAKU;AAAAA,QACjB;AAEQhB,iBAAAA,KAAKK,QAAQY,eAAe,WAAW;AAEhD;AAAA,MACD;AAAA,WAEI,YAAY;AACD,sBAAA;AAEdJ,eAAOb,KAAKK,QAAQa;AAEXlB,iBAAAA,KAAKK,QAAQY,eAAe,WAAW;AAEhD;AAAA,MACD;AAAA,WAEI,cAAc;AACH,sBAAA;AAER,cAAA;AAAA,UAAEE;AAAAA,UAAIC,UAAU;AAAA,UAAIC,OAAO;AAAA,YAAOrB,KAAKK;AAE7C,YAAIc,MAAM;AAAc,iBAAA,UAASA,cAAcC,gBAAgBC;AAE/D;AAAA,MACD;AAAA,WAEI,cAAc;AACH,sBAAA;AAEN,eAAA,OAAMrB,KAAKK,QAAQiB;AAE3B;AAAA,MACD;AAAA,WAEI,qBAAqB;AACV,sBAAA;AAEdT,eAAQ,IAAGH,gCAAa;AAExBK,gBAAQf,KAAKK,QAAQU;AAErB;AAAA,MACD;AAAA;AAGO,cAAA,IAAIQ,WAAY,sBAAsBvB,KAAaI,QAAnD;AAAA;AAAA,EAEX;AAEQoB,uBAAYC,OAAsC;AACzDxB,YAAQwB,KAAD;AAEHA,QAAAA,MAAMC;AAAkB;AAOxBD,QAAAA,MAAME,cAAcC;AAAmB,aAAOH,MAAMI;AAEpD7B,QAAAA,QAAQA,KAAKI,SAAS,qBAAqB;AACzC0B,UAAAA;AAEA,UAAA;AACF,YAAIjB,QAAQ;AAAMiB,iBAAO,IAAIC,IAAK,0BAAyBlB,MAAlC,EAA0CiB;AAAAA,eAC5DE;AACCA,gBAAAA,MAAO,+BAA8BnB,QAAQmB,KAArD;AAAA,MACD;AAEGnB,UAAAA,QAAQ,QAAQiB,QAAQ,QAAQjB,SAASiB,MAAM;AACjDL,cAAMI,eAAN;AACMI,cAAAA,OAAOR,MAAMQ;AAEnBC,gCAAAA,WAAeD,KAAKE,SAASC,cAAcN,IAA5B,GAAoC;AAAA,UACjDO,UAAU;AAAA,UACVtB;AAAAA,QAAAA,CAFY;AAKVkB,YAAAA,KAAKK,SAASR,SAASA;AAAMG,eAAKM,QAAQC,UAAU,IAAI,IAAIV,IAA/B;AAAA,MAClC;AAAA,IACF;AAAA,EACF;AAEGlB,MAAAA,eAAeC,QAAQ,MAAM;AAE7B,0CAAC4B,kBAAAA,YAAD,iCACMvC,cADN;AAAA,MAEE;AAAA,MACA;AAAA,MACA,SAASsB;AAAAA,MACT;AAAA,MAEA,gBAAgB;AAAA,IAAA,EARpB;AAAA,EAWD;AAGD,8EAActB;IAAa;AAAA,IAAU;AAAA,IAAY;AAAA,IAAgB,SAASsB;AAAAA,EAAAA,EAA1E;AACD,CA7H6B;;"}
|
package/dist/index.cjs4.js
CHANGED
|
@@ -31,7 +31,7 @@ var __objRest = (source, exclude) => {
|
|
|
31
31
|
return target;
|
|
32
32
|
};
|
|
33
33
|
var css = require("@emotion/css");
|
|
34
|
-
var
|
|
34
|
+
var next = require("./index.cjs.js");
|
|
35
35
|
var jsxRuntime = require("react/jsx-runtime");
|
|
36
36
|
function GutterContainer(_a) {
|
|
37
37
|
var _b = _a, {
|
|
@@ -46,7 +46,7 @@ function GutterContainer(_a) {
|
|
|
46
46
|
"last"
|
|
47
47
|
]);
|
|
48
48
|
return /* @__PURE__ */ jsxRuntime.jsx("div", __spreadProps(__spreadValues({}, restOfProps), {
|
|
49
|
-
className: css.cx(
|
|
49
|
+
className: css.cx(next.useStyle(next.useResponsiveStyle([gutter], ([gutter2 = {
|
|
50
50
|
value: 0,
|
|
51
51
|
unit: "px"
|
|
52
52
|
}]) => ({
|
package/dist/index.cjs4.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs4.js","sources":["../src/components/shared/GutterContainer/index.tsx"],"sourcesContent":["import { cx } from '@emotion/css'\nimport { ComponentPropsWithoutRef } from 'react'\nimport { ResponsiveValue, Length } from '../../../prop-controllers/descriptors'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport {
|
|
1
|
+
{"version":3,"file":"index.cjs4.js","sources":["../src/components/shared/GutterContainer/index.tsx"],"sourcesContent":["import { cx } from '@emotion/css'\nimport { ComponentPropsWithoutRef } from 'react'\nimport { ResponsiveValue, Length } from '../../../prop-controllers/descriptors'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { useResponsiveStyle } from '../../utils/responsive-style'\n\ntype BaseProps = {\n className?: string\n gutter?: ResponsiveValue<Length>\n first: boolean\n last: boolean\n}\n\ntype Props = BaseProps & Omit<ComponentPropsWithoutRef<'div'>, keyof BaseProps>\n\nexport default function GutterContainer({ className, gutter, first, last, ...restOfProps }: Props) {\n return (\n <div\n {...restOfProps}\n className={cx(\n useStyle(\n useResponsiveStyle([gutter] as const, ([gutter = { value: 0, unit: 'px' }]) => ({\n paddingLeft: first ? '0px' : `${gutter.value / 2}${gutter.unit}`,\n paddingRight: last ? '0px' : `${gutter.value / 2}${gutter.unit}`,\n })),\n ),\n className,\n )}\n />\n )\n}\n"],"names":["className","gutter","first","last","restOfProps","cx","useStyle","useResponsiveStyle","value","unit","paddingLeft","paddingRight"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAewC,yBAAA,IAA2D;AAA3D,eAAEA;AAAAA;AAAAA,IAAWC;AAAAA,IAAQC;AAAAA,IAAOC;AAAAA,MAA5B,IAAqCC,wBAArC,IAAqCA;AAAAA,IAAnCJ;AAAAA,IAAWC;AAAAA,IAAQC;AAAAA,IAAOC;AAAAA;AAClE,gFAEQC;IACJ,WAAWC,OACTC,cACEC,KAAAA,mBAAmB,CAACN,MAAD,GAAmB,CAAC,CAACA,UAAS;AAAA,MAAEO,OAAO;AAAA,MAAGC,MAAM;AAAA,IAAA,OAAa;AAAA,MAC9EC,aAAaR,QAAQ,QAAS,GAAED,QAAOO,QAAQ,IAAIP,QAAOQ;AAAAA,MAC1DE,cAAcR,OAAO,QAAS,GAAEF,QAAOO,QAAQ,IAAIP,QAAOQ;AAAAA,IAAAA,EAF1C,CADZ,GAMRT,SAPW;AAAA,EAAA,EAHjB;AAcD;;"}
|
package/dist/index.cjs5.js
CHANGED
|
@@ -22,8 +22,7 @@ var slate = require("slate");
|
|
|
22
22
|
var isHotkey = require("is-hotkey");
|
|
23
23
|
var descriptors = require("./descriptors.cjs.js");
|
|
24
24
|
require("slate-react");
|
|
25
|
-
var
|
|
26
|
-
var responsiveStyle = require("./responsive-style.cjs.js");
|
|
25
|
+
var state_breakpoints = require("./state/breakpoints.cjs.js");
|
|
27
26
|
function _interopDefaultLegacy(e) {
|
|
28
27
|
return e && typeof e === "object" && "default" in e ? e : { "default": e };
|
|
29
28
|
}
|
|
@@ -460,7 +459,7 @@ function setActiveTypographyId(editor, id) {
|
|
|
460
459
|
match: (node) => slate.Text.isText(node)
|
|
461
460
|
});
|
|
462
461
|
}
|
|
463
|
-
function setActiveTypographyStyle(editor, deviceId, prop, value) {
|
|
462
|
+
function setActiveTypographyStyle(editor, breakpoints, deviceId, prop, value) {
|
|
464
463
|
var _a, _b;
|
|
465
464
|
if (!editor.selection)
|
|
466
465
|
return;
|
|
@@ -470,8 +469,8 @@ function setActiveTypographyStyle(editor, deviceId, prop, value) {
|
|
|
470
469
|
});
|
|
471
470
|
for (const [node, path] of textNodes) {
|
|
472
471
|
if (slate.Text.isText(node)) {
|
|
473
|
-
const deviceOverrides = (_b = (_a = node == null ? void 0 : node.typography) == null ? void 0 : _a.style
|
|
474
|
-
const deviceStyle =
|
|
472
|
+
const deviceOverrides = (_b = (_a = node == null ? void 0 : node.typography) == null ? void 0 : _a.style) != null ? _b : [];
|
|
473
|
+
const deviceStyle = state_breakpoints.findBreakpointOverride(breakpoints, deviceOverrides, deviceId, (v) => v) || { value: {} };
|
|
475
474
|
const nextDeviceStyle = {
|
|
476
475
|
deviceId,
|
|
477
476
|
value: __spreadProps(__spreadValues({}, deviceStyle.value), { [prop]: value })
|
|
@@ -505,7 +504,7 @@ function withTypography(editor) {
|
|
|
505
504
|
};
|
|
506
505
|
return editor;
|
|
507
506
|
}
|
|
508
|
-
function setBlockKeyForDevice(editor, deviceId, key, value) {
|
|
507
|
+
function setBlockKeyForDevice(editor, breakpoints, deviceId, key, value) {
|
|
509
508
|
var _a;
|
|
510
509
|
if (!editor.selection)
|
|
511
510
|
return;
|
|
@@ -516,7 +515,7 @@ function setBlockKeyForDevice(editor, deviceId, key, value) {
|
|
|
516
515
|
for (const [node, path] of rootElements) {
|
|
517
516
|
if (ElementUtils.isBlock(node)) {
|
|
518
517
|
const deviceValues = (_a = node[key]) != null ? _a : [];
|
|
519
|
-
const currentDeviceValue =
|
|
518
|
+
const currentDeviceValue = state_breakpoints.findBreakpointOverride(breakpoints, deviceValues, deviceId, (v) => v);
|
|
520
519
|
const nextDeviceValue = __spreadProps(__spreadValues({}, currentDeviceValue), {
|
|
521
520
|
deviceId,
|
|
522
521
|
value
|