@daouypkgs/react-scroll-parallax 0.0.243
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/README.md +1 -0
- package/dist/ParallaxProvider.d.ts +19 -0
- package/dist/ParallaxWrapper.d.ts +28 -0
- package/dist/index.d.ts +3 -0
- package/dist/index.js +8 -0
- package/dist/react-scroll-parallax.cjs.development.js +245 -0
- package/dist/react-scroll-parallax.cjs.development.js.map +1 -0
- package/dist/react-scroll-parallax.cjs.production.min.js +2 -0
- package/dist/react-scroll-parallax.cjs.production.min.js.map +1 -0
- package/dist/react-scroll-parallax.esm.js +229 -0
- package/dist/react-scroll-parallax.esm.js.map +1 -0
- package/package.json +46 -0
package/README.md
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
Daouy registration calls for react-scroll-parallax
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import registerComponent, { ComponentMeta } from "@daouy/host/registerComponent";
|
|
2
|
+
import registerGlobalContext, { GlobalContextMeta } from "@daouy/host/registerGlobalContext";
|
|
3
|
+
import React from "react";
|
|
4
|
+
import { ParallaxProviderProps } from "react-scroll-parallax/dist/components/ParallaxProvider/types";
|
|
5
|
+
export declare function ParallaxProviderWrapper({ children, ...props }: React.PropsWithChildren<ParallaxProviderProps>): React.JSX.Element;
|
|
6
|
+
/**
|
|
7
|
+
* @deprecated use `globalParallaxProviderMeta` instead.
|
|
8
|
+
*/
|
|
9
|
+
export declare const parallaxProviderMeta: ComponentMeta<ParallaxProviderProps>;
|
|
10
|
+
/**
|
|
11
|
+
* @deprecated use `registerGlobalParallaxProvider` instead.
|
|
12
|
+
*/
|
|
13
|
+
export declare function registerParallaxProvider(loader?: {
|
|
14
|
+
registerComponent: typeof registerComponent;
|
|
15
|
+
}, customParallaxProviderMeta?: ComponentMeta<ParallaxProviderProps>): void;
|
|
16
|
+
export declare const globalParallaxProviderMeta: GlobalContextMeta<ParallaxProviderProps>;
|
|
17
|
+
export declare function registerGlobalParallaxProvider(loader?: {
|
|
18
|
+
registerGlobalContext: typeof registerGlobalContext;
|
|
19
|
+
}, customParallaxProviderMeta?: GlobalContextMeta<ParallaxProviderProps>): void;
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import registerComponent, { ComponentMeta } from "@daouy/host/registerComponent";
|
|
2
|
+
import React from "react";
|
|
3
|
+
export interface ParallaxWrapperProps {
|
|
4
|
+
speed?: number;
|
|
5
|
+
disabled?: boolean;
|
|
6
|
+
previewInEditor?: boolean;
|
|
7
|
+
children: React.ReactNode;
|
|
8
|
+
className?: string;
|
|
9
|
+
}
|
|
10
|
+
export default function ParallaxWrapper({ speed, disabled, previewInEditor, children, className, }: ParallaxWrapperProps): React.JSX.Element;
|
|
11
|
+
/**
|
|
12
|
+
* We're keeping the old registration without attachments to avoid confusion
|
|
13
|
+
* due to the parallax custom behavior not working in old projects that didn't
|
|
14
|
+
* make use of global contexts (so simply adding the custom behavior would
|
|
15
|
+
* break it and it wouldn't be clear that the user should also add a
|
|
16
|
+
* `ParallaxProvider`).
|
|
17
|
+
*/
|
|
18
|
+
export declare const deprecated_parallaxWrapperMeta: ComponentMeta<ParallaxWrapperProps>;
|
|
19
|
+
export declare function deprecated_registerParallaxWrapper(loader?: {
|
|
20
|
+
registerComponent: typeof registerComponent;
|
|
21
|
+
}, customParallaxWrapperMeta?: ComponentMeta<ParallaxWrapperProps>): void;
|
|
22
|
+
/**
|
|
23
|
+
* The new registration is only setting `isAttachment: true`.
|
|
24
|
+
*/
|
|
25
|
+
export declare const parallaxWrapperMeta: ComponentMeta<ParallaxWrapperProps>;
|
|
26
|
+
export declare function registerParallaxWrapper(loader?: {
|
|
27
|
+
registerComponent: typeof registerComponent;
|
|
28
|
+
}, customParallaxWrapperMeta?: ComponentMeta<ParallaxWrapperProps>): void;
|
package/dist/index.d.ts
ADDED
package/dist/index.js
ADDED
|
@@ -0,0 +1,245 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
|
|
6
|
+
|
|
7
|
+
var host = require('@daouy/host');
|
|
8
|
+
var registerComponent = _interopDefault(require('@daouy/host/registerComponent'));
|
|
9
|
+
var React = require('react');
|
|
10
|
+
var React__default = _interopDefault(React);
|
|
11
|
+
var reactScrollParallax = require('react-scroll-parallax');
|
|
12
|
+
var registerGlobalContext = _interopDefault(require('@daouy/host/registerGlobalContext'));
|
|
13
|
+
var ResizeObserver = _interopDefault(require('resize-observer-polyfill'));
|
|
14
|
+
|
|
15
|
+
function _extends() {
|
|
16
|
+
return _extends = Object.assign ? Object.assign.bind() : function (n) {
|
|
17
|
+
for (var e = 1; e < arguments.length; e++) {
|
|
18
|
+
var t = arguments[e];
|
|
19
|
+
for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
|
|
20
|
+
}
|
|
21
|
+
return n;
|
|
22
|
+
}, _extends.apply(null, arguments);
|
|
23
|
+
}
|
|
24
|
+
function _objectWithoutPropertiesLoose(r, e) {
|
|
25
|
+
if (null == r) return {};
|
|
26
|
+
var t = {};
|
|
27
|
+
for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
|
|
28
|
+
if (-1 !== e.indexOf(n)) continue;
|
|
29
|
+
t[n] = r[n];
|
|
30
|
+
}
|
|
31
|
+
return t;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
function ParallaxWrapper(_ref) {
|
|
35
|
+
var speed = _ref.speed,
|
|
36
|
+
disabled = _ref.disabled,
|
|
37
|
+
previewInEditor = _ref.previewInEditor,
|
|
38
|
+
children = _ref.children,
|
|
39
|
+
className = _ref.className;
|
|
40
|
+
var inEditor = React.useContext(host.DaouyCanvasContext);
|
|
41
|
+
var hasContext = React.useContext(reactScrollParallax.ParallaxContext) != null;
|
|
42
|
+
var isServer = typeof window === "undefined";
|
|
43
|
+
if (!hasContext && !isServer) {
|
|
44
|
+
throw new Error("Scroll Parallax can only be instantiated somewhere inside the Parallax Provider");
|
|
45
|
+
}
|
|
46
|
+
return React__default.createElement(reactScrollParallax.Parallax, {
|
|
47
|
+
disabled: disabled || inEditor && !previewInEditor,
|
|
48
|
+
speed: speed,
|
|
49
|
+
className: className
|
|
50
|
+
}, children);
|
|
51
|
+
}
|
|
52
|
+
/**
|
|
53
|
+
* We're keeping the old registration without attachments to avoid confusion
|
|
54
|
+
* due to the parallax custom behavior not working in old projects that didn't
|
|
55
|
+
* make use of global contexts (so simply adding the custom behavior would
|
|
56
|
+
* break it and it wouldn't be clear that the user should also add a
|
|
57
|
+
* `ParallaxProvider`).
|
|
58
|
+
*/
|
|
59
|
+
var deprecated_parallaxWrapperMeta = {
|
|
60
|
+
name: "hostless-scroll-parallax",
|
|
61
|
+
displayName: "Scroll Parallax",
|
|
62
|
+
importName: "ParallaxWrapper",
|
|
63
|
+
importPath: "@daouypkgs/react-scroll-parallax",
|
|
64
|
+
props: {
|
|
65
|
+
children: {
|
|
66
|
+
type: "slot",
|
|
67
|
+
defaultValue: {
|
|
68
|
+
type: "img",
|
|
69
|
+
src: "https://placekitten.com/300/200",
|
|
70
|
+
styles: {
|
|
71
|
+
maxWidth: "100%"
|
|
72
|
+
}
|
|
73
|
+
}
|
|
74
|
+
},
|
|
75
|
+
speed: {
|
|
76
|
+
type: "number",
|
|
77
|
+
description: "How much to speed up or slow down this element while scrolling. Try -20 for slower, 20 for faster.",
|
|
78
|
+
defaultValue: 20
|
|
79
|
+
},
|
|
80
|
+
disabled: {
|
|
81
|
+
type: "boolean",
|
|
82
|
+
description: "Disables the parallax effect."
|
|
83
|
+
},
|
|
84
|
+
previewInEditor: {
|
|
85
|
+
type: "boolean",
|
|
86
|
+
description: "Enable the parallax effect in the editor."
|
|
87
|
+
}
|
|
88
|
+
},
|
|
89
|
+
defaultStyles: {
|
|
90
|
+
maxWidth: "100%"
|
|
91
|
+
}
|
|
92
|
+
};
|
|
93
|
+
function deprecated_registerParallaxWrapper(loader, customParallaxWrapperMeta) {
|
|
94
|
+
if (loader) {
|
|
95
|
+
loader.registerComponent(ParallaxWrapper, customParallaxWrapperMeta != null ? customParallaxWrapperMeta : deprecated_parallaxWrapperMeta);
|
|
96
|
+
} else {
|
|
97
|
+
registerComponent(ParallaxWrapper, customParallaxWrapperMeta != null ? customParallaxWrapperMeta : deprecated_parallaxWrapperMeta);
|
|
98
|
+
}
|
|
99
|
+
}
|
|
100
|
+
/**
|
|
101
|
+
* The new registration is only setting `isAttachment: true`.
|
|
102
|
+
*/
|
|
103
|
+
var parallaxWrapperMeta = /*#__PURE__*/_extends({}, deprecated_parallaxWrapperMeta, {
|
|
104
|
+
isAttachment: true
|
|
105
|
+
});
|
|
106
|
+
function registerParallaxWrapper(loader, customParallaxWrapperMeta) {
|
|
107
|
+
if (loader) {
|
|
108
|
+
loader.registerComponent(ParallaxWrapper, customParallaxWrapperMeta != null ? customParallaxWrapperMeta : parallaxWrapperMeta);
|
|
109
|
+
} else {
|
|
110
|
+
registerComponent(ParallaxWrapper, customParallaxWrapperMeta != null ? customParallaxWrapperMeta : parallaxWrapperMeta);
|
|
111
|
+
}
|
|
112
|
+
}
|
|
113
|
+
|
|
114
|
+
var _excluded = ["children"];
|
|
115
|
+
/**
|
|
116
|
+
* A safe wrapper around `useController()` to prevent errors when
|
|
117
|
+
* `ParallaxProvider` is missing. If the context is unavailable,
|
|
118
|
+
* `useController()` will throw an error, which we catch and handle
|
|
119
|
+
* gracefully by returning `null` instead of crashing the component.
|
|
120
|
+
*/
|
|
121
|
+
function useSafeController() {
|
|
122
|
+
try {
|
|
123
|
+
return reactScrollParallax.useController();
|
|
124
|
+
} catch (_unused) {
|
|
125
|
+
return null; // Return null instead of throwing an error
|
|
126
|
+
}
|
|
127
|
+
}
|
|
128
|
+
/**
|
|
129
|
+
* This is required to ensure the parallax scrolling works correctly, since if
|
|
130
|
+
* (for instance) images load after the parallax wrapper has calculated the
|
|
131
|
+
* dimensions of the space, it will result in incorrect parallax scrolling
|
|
132
|
+
* amounts.
|
|
133
|
+
*
|
|
134
|
+
* This is not great since we need to mutation-observe the whole section of the
|
|
135
|
+
* document (which may be large), but we can probably optimize this in the
|
|
136
|
+
* future.
|
|
137
|
+
*/
|
|
138
|
+
function ParallaxCacheUpdate(_ref) {
|
|
139
|
+
var children = _ref.children;
|
|
140
|
+
var parallaxController = useSafeController();
|
|
141
|
+
var ref = React.useRef(null);
|
|
142
|
+
React.useEffect(function () {
|
|
143
|
+
var _ref$current;
|
|
144
|
+
if ((_ref$current = ref.current) != null && _ref$current.parentElement) {
|
|
145
|
+
var targetNode = ref.current.parentElement;
|
|
146
|
+
var observer = new ResizeObserver(function () {
|
|
147
|
+
if (parallaxController) {
|
|
148
|
+
parallaxController.update();
|
|
149
|
+
}
|
|
150
|
+
});
|
|
151
|
+
observer.observe(targetNode);
|
|
152
|
+
return function () {
|
|
153
|
+
observer.disconnect();
|
|
154
|
+
};
|
|
155
|
+
}
|
|
156
|
+
return function () {};
|
|
157
|
+
}, [ref.current]);
|
|
158
|
+
return React__default.createElement("div", {
|
|
159
|
+
style: {
|
|
160
|
+
display: "contents"
|
|
161
|
+
},
|
|
162
|
+
ref: ref
|
|
163
|
+
}, children);
|
|
164
|
+
}
|
|
165
|
+
function ParallaxProviderWrapper(_ref2) {
|
|
166
|
+
var children = _ref2.children,
|
|
167
|
+
props = _objectWithoutPropertiesLoose(_ref2, _excluded);
|
|
168
|
+
return React__default.createElement(reactScrollParallax.ParallaxProvider, Object.assign({}, props), React__default.createElement(ParallaxCacheUpdate, null, children));
|
|
169
|
+
}
|
|
170
|
+
/**
|
|
171
|
+
* @deprecated use `globalParallaxProviderMeta` instead.
|
|
172
|
+
*/
|
|
173
|
+
var parallaxProviderMeta = {
|
|
174
|
+
name: "hostless-parallax-provider",
|
|
175
|
+
displayName: "Parallax Provider",
|
|
176
|
+
importName: "ParallaxProviderWrapper",
|
|
177
|
+
importPath: "@daouypkgs/react-scroll-parallax",
|
|
178
|
+
props: {
|
|
179
|
+
children: {
|
|
180
|
+
type: "slot",
|
|
181
|
+
defaultValue: {
|
|
182
|
+
type: "vbox",
|
|
183
|
+
children: [{
|
|
184
|
+
type: "text",
|
|
185
|
+
value: "Wrap any element in a Scroll Parallax component. Ensure they're all inside this Parallax Provider. Example:",
|
|
186
|
+
styles: {
|
|
187
|
+
marginBottom: "20px"
|
|
188
|
+
}
|
|
189
|
+
}, {
|
|
190
|
+
type: "component",
|
|
191
|
+
name: "hostless-scroll-parallax"
|
|
192
|
+
}]
|
|
193
|
+
}
|
|
194
|
+
},
|
|
195
|
+
scrollAxis: {
|
|
196
|
+
type: "choice",
|
|
197
|
+
description: "Scroll axis for setting horizontal/vertical scrolling",
|
|
198
|
+
options: ["vertical", "horizontal"],
|
|
199
|
+
displayName: "Scroll Axis"
|
|
200
|
+
}
|
|
201
|
+
}
|
|
202
|
+
};
|
|
203
|
+
/**
|
|
204
|
+
* @deprecated use `registerGlobalParallaxProvider` instead.
|
|
205
|
+
*/
|
|
206
|
+
function registerParallaxProvider(loader, customParallaxProviderMeta) {
|
|
207
|
+
if (loader) {
|
|
208
|
+
loader.registerComponent(ParallaxProviderWrapper, customParallaxProviderMeta != null ? customParallaxProviderMeta : parallaxProviderMeta);
|
|
209
|
+
} else {
|
|
210
|
+
registerComponent(ParallaxProviderWrapper, customParallaxProviderMeta != null ? customParallaxProviderMeta : parallaxProviderMeta);
|
|
211
|
+
}
|
|
212
|
+
}
|
|
213
|
+
var globalParallaxProviderMeta = {
|
|
214
|
+
name: "global-parallax-provider",
|
|
215
|
+
displayName: "Parallax Provider",
|
|
216
|
+
importName: "ParallaxProviderWrapper",
|
|
217
|
+
importPath: "@daouypkgs/react-scroll-parallax",
|
|
218
|
+
props: {
|
|
219
|
+
scrollAxis: {
|
|
220
|
+
type: "choice",
|
|
221
|
+
description: "Scroll axis for setting horizontal/vertical scrolling",
|
|
222
|
+
options: ["vertical", "horizontal"],
|
|
223
|
+
displayName: "Scroll Axis"
|
|
224
|
+
}
|
|
225
|
+
}
|
|
226
|
+
};
|
|
227
|
+
function registerGlobalParallaxProvider(loader, customParallaxProviderMeta) {
|
|
228
|
+
if (loader) {
|
|
229
|
+
loader.registerGlobalContext(ParallaxProviderWrapper, customParallaxProviderMeta != null ? customParallaxProviderMeta : globalParallaxProviderMeta);
|
|
230
|
+
} else {
|
|
231
|
+
registerGlobalContext(ParallaxProviderWrapper, customParallaxProviderMeta != null ? customParallaxProviderMeta : globalParallaxProviderMeta);
|
|
232
|
+
}
|
|
233
|
+
}
|
|
234
|
+
|
|
235
|
+
exports.ParallaxProviderWrapper = ParallaxProviderWrapper;
|
|
236
|
+
exports.ParallaxWrapper = ParallaxWrapper;
|
|
237
|
+
exports.deprecated_parallaxWrapperMeta = deprecated_parallaxWrapperMeta;
|
|
238
|
+
exports.deprecated_registerParallaxWrapper = deprecated_registerParallaxWrapper;
|
|
239
|
+
exports.globalParallaxProviderMeta = globalParallaxProviderMeta;
|
|
240
|
+
exports.parallaxProviderMeta = parallaxProviderMeta;
|
|
241
|
+
exports.parallaxWrapperMeta = parallaxWrapperMeta;
|
|
242
|
+
exports.registerGlobalParallaxProvider = registerGlobalParallaxProvider;
|
|
243
|
+
exports.registerParallaxProvider = registerParallaxProvider;
|
|
244
|
+
exports.registerParallaxWrapper = registerParallaxWrapper;
|
|
245
|
+
//# sourceMappingURL=react-scroll-parallax.cjs.development.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"react-scroll-parallax.cjs.development.js","sources":["../src/ParallaxWrapper.tsx","../src/ParallaxProvider.tsx"],"sourcesContent":["import { DaouyCanvasContext } from \"@daouy/host\";\nimport registerComponent, {\n ComponentMeta,\n} from \"@daouy/host/registerComponent\";\nimport React, { useContext } from \"react\";\nimport { Parallax, ParallaxContext } from \"react-scroll-parallax\";\n\nexport interface ParallaxWrapperProps {\n speed?: number;\n disabled?: boolean;\n previewInEditor?: boolean;\n children: React.ReactNode;\n className?: string;\n}\n\nexport default function ParallaxWrapper({\n speed,\n disabled,\n previewInEditor,\n children,\n className,\n}: ParallaxWrapperProps) {\n const inEditor = useContext(DaouyCanvasContext);\n const hasContext = useContext(ParallaxContext) != null;\n const isServer = typeof window === \"undefined\";\n if (!hasContext && !isServer) {\n throw new Error(\n \"Scroll Parallax can only be instantiated somewhere inside the Parallax Provider\"\n );\n }\n return (\n <Parallax\n disabled={disabled || (inEditor && !previewInEditor)}\n speed={speed}\n className={className}\n >\n {children}\n </Parallax>\n );\n}\n\n/**\n * We're keeping the old registration without attachments to avoid confusion\n * due to the parallax custom behavior not working in old projects that didn't\n * make use of global contexts (so simply adding the custom behavior would\n * break it and it wouldn't be clear that the user should also add a\n * `ParallaxProvider`).\n */\nexport const deprecated_parallaxWrapperMeta: ComponentMeta<ParallaxWrapperProps> =\n {\n name: \"hostless-scroll-parallax\",\n displayName: \"Scroll Parallax\",\n importName: \"ParallaxWrapper\",\n importPath: \"@daouypkgs/react-scroll-parallax\",\n props: {\n children: {\n type: \"slot\",\n defaultValue: {\n type: \"img\",\n src: \"https://placekitten.com/300/200\",\n styles: {\n maxWidth: \"100%\",\n },\n },\n },\n speed: {\n type: \"number\",\n description:\n \"How much to speed up or slow down this element while scrolling. Try -20 for slower, 20 for faster.\",\n defaultValue: 20,\n },\n disabled: {\n type: \"boolean\",\n description: \"Disables the parallax effect.\",\n },\n previewInEditor: {\n type: \"boolean\",\n description: \"Enable the parallax effect in the editor.\",\n },\n },\n defaultStyles: {\n maxWidth: \"100%\",\n },\n };\n\nexport function deprecated_registerParallaxWrapper(\n loader?: { registerComponent: typeof registerComponent },\n customParallaxWrapperMeta?: ComponentMeta<ParallaxWrapperProps>\n) {\n if (loader) {\n loader.registerComponent(\n ParallaxWrapper,\n customParallaxWrapperMeta ?? deprecated_parallaxWrapperMeta\n );\n } else {\n registerComponent(\n ParallaxWrapper,\n customParallaxWrapperMeta ?? deprecated_parallaxWrapperMeta\n );\n }\n}\n\n/**\n * The new registration is only setting `isAttachment: true`.\n */\nexport const parallaxWrapperMeta: ComponentMeta<ParallaxWrapperProps> = {\n ...deprecated_parallaxWrapperMeta,\n isAttachment: true,\n};\n\nexport function registerParallaxWrapper(\n loader?: { registerComponent: typeof registerComponent },\n customParallaxWrapperMeta?: ComponentMeta<ParallaxWrapperProps>\n) {\n if (loader) {\n loader.registerComponent(\n ParallaxWrapper,\n customParallaxWrapperMeta ?? parallaxWrapperMeta\n );\n } else {\n registerComponent(\n ParallaxWrapper,\n customParallaxWrapperMeta ?? parallaxWrapperMeta\n );\n }\n}\n","import registerComponent, {\n ComponentMeta,\n} from \"@daouy/host/registerComponent\";\nimport registerGlobalContext, {\n GlobalContextMeta,\n} from \"@daouy/host/registerGlobalContext\";\nimport React, { useEffect, useRef } from \"react\";\nimport { ParallaxProvider, useController } from \"react-scroll-parallax\";\nimport { ParallaxProviderProps } from \"react-scroll-parallax/dist/components/ParallaxProvider/types\";\nimport ResizeObserver from \"resize-observer-polyfill\";\n\n/**\n * A safe wrapper around `useController()` to prevent errors when\n * `ParallaxProvider` is missing. If the context is unavailable,\n * `useController()` will throw an error, which we catch and handle\n * gracefully by returning `null` instead of crashing the component.\n */\nfunction useSafeController() {\n try {\n return useController();\n } catch {\n return null; // Return null instead of throwing an error\n }\n}\n\n/**\n * This is required to ensure the parallax scrolling works correctly, since if\n * (for instance) images load after the parallax wrapper has calculated the\n * dimensions of the space, it will result in incorrect parallax scrolling\n * amounts.\n *\n * This is not great since we need to mutation-observe the whole section of the\n * document (which may be large), but we can probably optimize this in the\n * future.\n */\nfunction ParallaxCacheUpdate({ children }: React.PropsWithChildren<{}>) {\n const parallaxController = useSafeController();\n const ref = useRef<HTMLDivElement | null>(null);\n\n useEffect(() => {\n if (ref.current?.parentElement) {\n const targetNode = ref.current.parentElement;\n const observer = new ResizeObserver(() => {\n if (parallaxController) {\n parallaxController.update();\n }\n });\n observer.observe(targetNode);\n return () => {\n observer.disconnect();\n };\n }\n return () => {};\n }, [ref.current]);\n\n return (\n <div style={{ display: \"contents\" }} ref={ref}>\n {children}\n </div>\n );\n}\n\nexport function ParallaxProviderWrapper({\n children,\n ...props\n}: React.PropsWithChildren<ParallaxProviderProps>) {\n return (\n <ParallaxProvider {...props}>\n <ParallaxCacheUpdate>{children}</ParallaxCacheUpdate>\n </ParallaxProvider>\n );\n}\n\n/**\n * @deprecated use `globalParallaxProviderMeta` instead.\n */\nexport const parallaxProviderMeta: ComponentMeta<ParallaxProviderProps> = {\n name: \"hostless-parallax-provider\",\n displayName: \"Parallax Provider\",\n importName: \"ParallaxProviderWrapper\",\n importPath: \"@daouypkgs/react-scroll-parallax\",\n props: {\n children: {\n type: \"slot\",\n defaultValue: {\n type: \"vbox\",\n children: [\n {\n type: \"text\",\n value:\n \"Wrap any element in a Scroll Parallax component. Ensure they're all inside this Parallax Provider. Example:\",\n styles: {\n marginBottom: \"20px\",\n },\n },\n {\n type: \"component\",\n name: \"hostless-scroll-parallax\",\n },\n ],\n },\n },\n scrollAxis: {\n type: \"choice\",\n description: \"Scroll axis for setting horizontal/vertical scrolling\",\n options: [\"vertical\", \"horizontal\"],\n displayName: \"Scroll Axis\",\n },\n },\n};\n\n/**\n * @deprecated use `registerGlobalParallaxProvider` instead.\n */\nexport function registerParallaxProvider(\n loader?: { registerComponent: typeof registerComponent },\n customParallaxProviderMeta?: ComponentMeta<ParallaxProviderProps>\n) {\n if (loader) {\n loader.registerComponent(\n ParallaxProviderWrapper,\n customParallaxProviderMeta ?? parallaxProviderMeta\n );\n } else {\n registerComponent(\n ParallaxProviderWrapper,\n customParallaxProviderMeta ?? parallaxProviderMeta\n );\n }\n}\n\nexport const globalParallaxProviderMeta: GlobalContextMeta<ParallaxProviderProps> =\n {\n name: \"global-parallax-provider\",\n displayName: \"Parallax Provider\",\n importName: \"ParallaxProviderWrapper\",\n importPath: \"@daouypkgs/react-scroll-parallax\",\n props: {\n scrollAxis: {\n type: \"choice\",\n description: \"Scroll axis for setting horizontal/vertical scrolling\",\n options: [\"vertical\", \"horizontal\"],\n displayName: \"Scroll Axis\",\n },\n },\n };\n\nexport function registerGlobalParallaxProvider(\n loader?: { registerGlobalContext: typeof registerGlobalContext },\n customParallaxProviderMeta?: GlobalContextMeta<ParallaxProviderProps>\n) {\n if (loader) {\n loader.registerGlobalContext(\n ParallaxProviderWrapper,\n customParallaxProviderMeta ?? globalParallaxProviderMeta\n );\n } else {\n registerGlobalContext(\n ParallaxProviderWrapper,\n customParallaxProviderMeta ?? globalParallaxProviderMeta\n );\n }\n}\n"],"names":["ParallaxWrapper","_ref","speed","disabled","previewInEditor","children","className","inEditor","useContext","DaouyCanvasContext","hasContext","ParallaxContext","isServer","window","Error","React","Parallax","deprecated_parallaxWrapperMeta","name","displayName","importName","importPath","props","type","defaultValue","src","styles","maxWidth","description","defaultStyles","deprecated_registerParallaxWrapper","loader","customParallaxWrapperMeta","registerComponent","parallaxWrapperMeta","_extends","isAttachment","registerParallaxWrapper","useSafeController","useController","_unused","ParallaxCacheUpdate","parallaxController","ref","useRef","useEffect","_ref$current","current","parentElement","targetNode","observer","ResizeObserver","update","observe","disconnect","style","display","ParallaxProviderWrapper","_ref2","_objectWithoutPropertiesLoose","_excluded","ParallaxProvider","parallaxProviderMeta","value","marginBottom","scrollAxis","options","registerParallaxProvider","customParallaxProviderMeta","globalParallaxProviderMeta","registerGlobalParallaxProvider","registerGlobalContext"],"mappings":"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"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var r=require("@daouy/host"),a=e(require("@daouy/host/registerComponent")),l=require("react"),t=e(l),o=require("react-scroll-parallax"),n=e(require("@daouy/host/registerGlobalContext")),i=e(require("resize-observer-polyfill"));function s(){return(s=Object.assign?Object.assign.bind():function(e){for(var r=1;r<arguments.length;r++){var a=arguments[r];for(var l in a)({}).hasOwnProperty.call(a,l)&&(e[l]=a[l])}return e}).apply(null,arguments)}function p(e){var a=e.speed,n=e.disabled,i=e.previewInEditor,s=e.children,p=e.className,c=l.useContext(r.DaouyCanvasContext),u=null!=l.useContext(o.ParallaxContext),d="undefined"==typeof window;if(!u&&!d)throw new Error("Scroll Parallax can only be instantiated somewhere inside the Parallax Provider");return t.createElement(o.Parallax,{disabled:n||c&&!i,speed:a,className:p},s)}var c={name:"hostless-scroll-parallax",displayName:"Scroll Parallax",importName:"ParallaxWrapper",importPath:"@daouypkgs/react-scroll-parallax",props:{children:{type:"slot",defaultValue:{type:"img",src:"https://placekitten.com/300/200",styles:{maxWidth:"100%"}}},speed:{type:"number",description:"How much to speed up or slow down this element while scrolling. Try -20 for slower, 20 for faster.",defaultValue:20},disabled:{type:"boolean",description:"Disables the parallax effect."},previewInEditor:{type:"boolean",description:"Enable the parallax effect in the editor."}},defaultStyles:{maxWidth:"100%"}},u=s({},c,{isAttachment:!0}),d=["children"];function x(e){var r=e.children,a=function(){try{return o.useController()}catch(e){return null}}(),n=l.useRef(null);return l.useEffect((function(){var e;if(null!=(e=n.current)&&e.parentElement){var r=n.current.parentElement,l=new i((function(){a&&a.update()}));return l.observe(r),function(){l.disconnect()}}return function(){}}),[n.current]),t.createElement("div",{style:{display:"contents"},ref:n},r)}function f(e){var r=e.children,a=function(e,r){if(null==e)return{};var a={};for(var l in e)if({}.hasOwnProperty.call(e,l)){if(-1!==r.indexOf(l))continue;a[l]=e[l]}return a}(e,d);return t.createElement(o.ParallaxProvider,Object.assign({},a),t.createElement(x,null,r))}var m={name:"hostless-parallax-provider",displayName:"Parallax Provider",importName:"ParallaxProviderWrapper",importPath:"@daouypkgs/react-scroll-parallax",props:{children:{type:"slot",defaultValue:{type:"vbox",children:[{type:"text",value:"Wrap any element in a Scroll Parallax component. Ensure they're all inside this Parallax Provider. Example:",styles:{marginBottom:"20px"}},{type:"component",name:"hostless-scroll-parallax"}]}},scrollAxis:{type:"choice",description:"Scroll axis for setting horizontal/vertical scrolling",options:["vertical","horizontal"],displayName:"Scroll Axis"}}},h={name:"global-parallax-provider",displayName:"Parallax Provider",importName:"ParallaxProviderWrapper",importPath:"@daouypkgs/react-scroll-parallax",props:{scrollAxis:{type:"choice",description:"Scroll axis for setting horizontal/vertical scrolling",options:["vertical","horizontal"],displayName:"Scroll Axis"}}};exports.ParallaxProviderWrapper=f,exports.ParallaxWrapper=p,exports.deprecated_parallaxWrapperMeta=c,exports.deprecated_registerParallaxWrapper=function(e,r){e?e.registerComponent(p,null!=r?r:c):a(p,null!=r?r:c)},exports.globalParallaxProviderMeta=h,exports.parallaxProviderMeta=m,exports.parallaxWrapperMeta=u,exports.registerGlobalParallaxProvider=function(e,r){e?e.registerGlobalContext(f,null!=r?r:h):n(f,null!=r?r:h)},exports.registerParallaxProvider=function(e,r){e?e.registerComponent(f,null!=r?r:m):a(f,null!=r?r:m)},exports.registerParallaxWrapper=function(e,r){e?e.registerComponent(p,null!=r?r:u):a(p,null!=r?r:u)};
|
|
2
|
+
//# sourceMappingURL=react-scroll-parallax.cjs.production.min.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"react-scroll-parallax.cjs.production.min.js","sources":["../src/ParallaxWrapper.tsx","../src/ParallaxProvider.tsx"],"sourcesContent":["import { DaouyCanvasContext } from \"@daouy/host\";\nimport registerComponent, {\n ComponentMeta,\n} from \"@daouy/host/registerComponent\";\nimport React, { useContext } from \"react\";\nimport { Parallax, ParallaxContext } from \"react-scroll-parallax\";\n\nexport interface ParallaxWrapperProps {\n speed?: number;\n disabled?: boolean;\n previewInEditor?: boolean;\n children: React.ReactNode;\n className?: string;\n}\n\nexport default function ParallaxWrapper({\n speed,\n disabled,\n previewInEditor,\n children,\n className,\n}: ParallaxWrapperProps) {\n const inEditor = useContext(DaouyCanvasContext);\n const hasContext = useContext(ParallaxContext) != null;\n const isServer = typeof window === \"undefined\";\n if (!hasContext && !isServer) {\n throw new Error(\n \"Scroll Parallax can only be instantiated somewhere inside the Parallax Provider\"\n );\n }\n return (\n <Parallax\n disabled={disabled || (inEditor && !previewInEditor)}\n speed={speed}\n className={className}\n >\n {children}\n </Parallax>\n );\n}\n\n/**\n * We're keeping the old registration without attachments to avoid confusion\n * due to the parallax custom behavior not working in old projects that didn't\n * make use of global contexts (so simply adding the custom behavior would\n * break it and it wouldn't be clear that the user should also add a\n * `ParallaxProvider`).\n */\nexport const deprecated_parallaxWrapperMeta: ComponentMeta<ParallaxWrapperProps> =\n {\n name: \"hostless-scroll-parallax\",\n displayName: \"Scroll Parallax\",\n importName: \"ParallaxWrapper\",\n importPath: \"@daouypkgs/react-scroll-parallax\",\n props: {\n children: {\n type: \"slot\",\n defaultValue: {\n type: \"img\",\n src: \"https://placekitten.com/300/200\",\n styles: {\n maxWidth: \"100%\",\n },\n },\n },\n speed: {\n type: \"number\",\n description:\n \"How much to speed up or slow down this element while scrolling. Try -20 for slower, 20 for faster.\",\n defaultValue: 20,\n },\n disabled: {\n type: \"boolean\",\n description: \"Disables the parallax effect.\",\n },\n previewInEditor: {\n type: \"boolean\",\n description: \"Enable the parallax effect in the editor.\",\n },\n },\n defaultStyles: {\n maxWidth: \"100%\",\n },\n };\n\nexport function deprecated_registerParallaxWrapper(\n loader?: { registerComponent: typeof registerComponent },\n customParallaxWrapperMeta?: ComponentMeta<ParallaxWrapperProps>\n) {\n if (loader) {\n loader.registerComponent(\n ParallaxWrapper,\n customParallaxWrapperMeta ?? deprecated_parallaxWrapperMeta\n );\n } else {\n registerComponent(\n ParallaxWrapper,\n customParallaxWrapperMeta ?? deprecated_parallaxWrapperMeta\n );\n }\n}\n\n/**\n * The new registration is only setting `isAttachment: true`.\n */\nexport const parallaxWrapperMeta: ComponentMeta<ParallaxWrapperProps> = {\n ...deprecated_parallaxWrapperMeta,\n isAttachment: true,\n};\n\nexport function registerParallaxWrapper(\n loader?: { registerComponent: typeof registerComponent },\n customParallaxWrapperMeta?: ComponentMeta<ParallaxWrapperProps>\n) {\n if (loader) {\n loader.registerComponent(\n ParallaxWrapper,\n customParallaxWrapperMeta ?? parallaxWrapperMeta\n );\n } else {\n registerComponent(\n ParallaxWrapper,\n customParallaxWrapperMeta ?? parallaxWrapperMeta\n );\n }\n}\n","import registerComponent, {\n ComponentMeta,\n} from \"@daouy/host/registerComponent\";\nimport registerGlobalContext, {\n GlobalContextMeta,\n} from \"@daouy/host/registerGlobalContext\";\nimport React, { useEffect, useRef } from \"react\";\nimport { ParallaxProvider, useController } from \"react-scroll-parallax\";\nimport { ParallaxProviderProps } from \"react-scroll-parallax/dist/components/ParallaxProvider/types\";\nimport ResizeObserver from \"resize-observer-polyfill\";\n\n/**\n * A safe wrapper around `useController()` to prevent errors when\n * `ParallaxProvider` is missing. If the context is unavailable,\n * `useController()` will throw an error, which we catch and handle\n * gracefully by returning `null` instead of crashing the component.\n */\nfunction useSafeController() {\n try {\n return useController();\n } catch {\n return null; // Return null instead of throwing an error\n }\n}\n\n/**\n * This is required to ensure the parallax scrolling works correctly, since if\n * (for instance) images load after the parallax wrapper has calculated the\n * dimensions of the space, it will result in incorrect parallax scrolling\n * amounts.\n *\n * This is not great since we need to mutation-observe the whole section of the\n * document (which may be large), but we can probably optimize this in the\n * future.\n */\nfunction ParallaxCacheUpdate({ children }: React.PropsWithChildren<{}>) {\n const parallaxController = useSafeController();\n const ref = useRef<HTMLDivElement | null>(null);\n\n useEffect(() => {\n if (ref.current?.parentElement) {\n const targetNode = ref.current.parentElement;\n const observer = new ResizeObserver(() => {\n if (parallaxController) {\n parallaxController.update();\n }\n });\n observer.observe(targetNode);\n return () => {\n observer.disconnect();\n };\n }\n return () => {};\n }, [ref.current]);\n\n return (\n <div style={{ display: \"contents\" }} ref={ref}>\n {children}\n </div>\n );\n}\n\nexport function ParallaxProviderWrapper({\n children,\n ...props\n}: React.PropsWithChildren<ParallaxProviderProps>) {\n return (\n <ParallaxProvider {...props}>\n <ParallaxCacheUpdate>{children}</ParallaxCacheUpdate>\n </ParallaxProvider>\n );\n}\n\n/**\n * @deprecated use `globalParallaxProviderMeta` instead.\n */\nexport const parallaxProviderMeta: ComponentMeta<ParallaxProviderProps> = {\n name: \"hostless-parallax-provider\",\n displayName: \"Parallax Provider\",\n importName: \"ParallaxProviderWrapper\",\n importPath: \"@daouypkgs/react-scroll-parallax\",\n props: {\n children: {\n type: \"slot\",\n defaultValue: {\n type: \"vbox\",\n children: [\n {\n type: \"text\",\n value:\n \"Wrap any element in a Scroll Parallax component. Ensure they're all inside this Parallax Provider. Example:\",\n styles: {\n marginBottom: \"20px\",\n },\n },\n {\n type: \"component\",\n name: \"hostless-scroll-parallax\",\n },\n ],\n },\n },\n scrollAxis: {\n type: \"choice\",\n description: \"Scroll axis for setting horizontal/vertical scrolling\",\n options: [\"vertical\", \"horizontal\"],\n displayName: \"Scroll Axis\",\n },\n },\n};\n\n/**\n * @deprecated use `registerGlobalParallaxProvider` instead.\n */\nexport function registerParallaxProvider(\n loader?: { registerComponent: typeof registerComponent },\n customParallaxProviderMeta?: ComponentMeta<ParallaxProviderProps>\n) {\n if (loader) {\n loader.registerComponent(\n ParallaxProviderWrapper,\n customParallaxProviderMeta ?? parallaxProviderMeta\n );\n } else {\n registerComponent(\n ParallaxProviderWrapper,\n customParallaxProviderMeta ?? parallaxProviderMeta\n );\n }\n}\n\nexport const globalParallaxProviderMeta: GlobalContextMeta<ParallaxProviderProps> =\n {\n name: \"global-parallax-provider\",\n displayName: \"Parallax Provider\",\n importName: \"ParallaxProviderWrapper\",\n importPath: \"@daouypkgs/react-scroll-parallax\",\n props: {\n scrollAxis: {\n type: \"choice\",\n description: \"Scroll axis for setting horizontal/vertical scrolling\",\n options: [\"vertical\", \"horizontal\"],\n displayName: \"Scroll Axis\",\n },\n },\n };\n\nexport function registerGlobalParallaxProvider(\n loader?: { registerGlobalContext: typeof registerGlobalContext },\n customParallaxProviderMeta?: GlobalContextMeta<ParallaxProviderProps>\n) {\n if (loader) {\n loader.registerGlobalContext(\n ParallaxProviderWrapper,\n customParallaxProviderMeta ?? globalParallaxProviderMeta\n );\n } else {\n registerGlobalContext(\n ParallaxProviderWrapper,\n customParallaxProviderMeta ?? globalParallaxProviderMeta\n );\n }\n}\n"],"names":["ParallaxWrapper","_ref","speed","disabled","previewInEditor","children","className","inEditor","useContext","DaouyCanvasContext","hasContext","ParallaxContext","isServer","window","Error","React","Parallax","deprecated_parallaxWrapperMeta","name","displayName","importName","importPath","props","type","defaultValue","src","styles","maxWidth","description","defaultStyles","parallaxWrapperMeta","_extends","isAttachment","ParallaxCacheUpdate","parallaxController","useController","_unused","useSafeController","ref","useRef","useEffect","_ref$current","current","parentElement","targetNode","observer","ResizeObserver","update","observe","disconnect","style","display","ParallaxProviderWrapper","_ref2","_objectWithoutPropertiesLoose","_excluded","ParallaxProvider","parallaxProviderMeta","value","marginBottom","scrollAxis","options","globalParallaxProviderMeta","loader","customParallaxWrapperMeta","registerComponent","customParallaxProviderMeta","registerGlobalContext"],"mappings":"6kBAewBA,EAAeC,OACrCC,EAAKD,EAALC,MACAC,EAAQF,EAARE,SACAC,EAAeH,EAAfG,gBACAC,EAAQJ,EAARI,SACAC,EAASL,EAATK,UAEMC,EAAWC,aAAWC,sBACtBC,EAA4C,MAA/BF,aAAWG,mBACxBC,EAA6B,oBAAXC,OACxB,IAAKH,IAAeE,EAClB,MAAM,IAAIE,MACR,mFAGJ,OACEC,gBAACC,YACCb,SAAUA,GAAaI,IAAaH,EACpCF,MAAOA,EACPI,UAAWA,GAEVD,OAYMY,EACX,CACEC,KAAM,2BACNC,YAAa,kBACbC,WAAY,kBACZC,WAAY,mCACZC,MAAO,CACLjB,SAAU,CACRkB,KAAM,OACNC,aAAc,CACZD,KAAM,MACNE,IAAK,kCACLC,OAAQ,CACNC,SAAU,UAIhBzB,MAAO,CACLqB,KAAM,SACNK,YACE,qGACFJ,aAAc,IAEhBrB,SAAU,CACRoB,KAAM,UACNK,YAAa,iCAEfxB,gBAAiB,CACfmB,KAAM,UACNK,YAAa,8CAGjBC,cAAe,CACbF,SAAU,SAwBHG,EAAmBC,KAC3Bd,GACHe,cAAc,mBCxEhB,SAASC,EAAmBhC,OAAGI,EAAQJ,EAARI,SACvB6B,EAnBR,WACE,IACE,OAAOC,kBACP,MAAAC,GACA,OAAO,MAekBC,GACrBC,EAAMC,SAA8B,MAkB1C,OAhBAC,aAAU,iBACR,UAAAC,EAAIH,EAAII,UAAJD,EAAaE,cAAe,CAC9B,IAAMC,EAAaN,EAAII,QAAQC,cACzBE,EAAW,IAAIC,GAAe,WAC9BZ,GACFA,EAAmBa,YAIvB,OADAF,EAASG,QAAQJ,GACV,WACLC,EAASI,cAGb,OAAO,eACN,CAACX,EAAII,UAGN3B,uBAAKmC,MAAO,CAAEC,QAAS,YAAcb,IAAKA,GACvCjC,YAKS+C,EAAuBC,OACrChD,EAAQgD,EAARhD,SACGiB,6IAAKgC,CAAAD,EAAAE,GAER,OACExC,gBAACyC,oCAAqBlC,GACpBP,gBAACkB,OAAqB5B,IAQ5B,IAAaoD,EAA6D,CACxEvC,KAAM,6BACNC,YAAa,oBACbC,WAAY,0BACZC,WAAY,mCACZC,MAAO,CACLjB,SAAU,CACRkB,KAAM,OACNC,aAAc,CACZD,KAAM,OACNlB,SAAU,CACR,CACEkB,KAAM,OACNmC,MACE,8GACFhC,OAAQ,CACNiC,aAAc,SAGlB,CACEpC,KAAM,YACNL,KAAM,+BAKd0C,WAAY,CACVrC,KAAM,SACNK,YAAa,wDACbiC,QAAS,CAAC,WAAY,cACtB1C,YAAa,iBAyBN2C,EACX,CACE5C,KAAM,2BACNC,YAAa,oBACbC,WAAY,0BACZC,WAAY,mCACZC,MAAO,CACLsC,WAAY,CACVrC,KAAM,SACNK,YAAa,wDACbiC,QAAS,CAAC,WAAY,cACtB1C,YAAa,0KDxDnB4C,EACAC,GAEID,EACFA,EAAOE,kBACLjE,QACAgE,EAAAA,EAA6B/C,GAG/BgD,EACEjE,QACAgE,EAAAA,EAA6B/C,sJCmDjC8C,EACAG,GAEIH,EACFA,EAAOI,sBACLf,QACAc,EAAAA,EAA8BJ,GAGhCK,EACEf,QACAc,EAAAA,EAA8BJ,8CA5ClCC,EACAG,GAEIH,EACFA,EAAOE,kBACLb,QACAc,EAAAA,EAA8BT,GAGhCQ,EACEb,QACAc,EAAAA,EAA8BT,6CDflCM,EACAC,GAEID,EACFA,EAAOE,kBACLjE,QACAgE,EAAAA,EAA6BlC,GAG/BmC,EACEjE,QACAgE,EAAAA,EAA6BlC"}
|
|
@@ -0,0 +1,229 @@
|
|
|
1
|
+
import { DaouyCanvasContext } from '@daouy/host';
|
|
2
|
+
import registerComponent from '@daouy/host/registerComponent';
|
|
3
|
+
import React, { useContext, useRef, useEffect } from 'react';
|
|
4
|
+
import { ParallaxContext, Parallax, ParallaxProvider, useController } from 'react-scroll-parallax';
|
|
5
|
+
import registerGlobalContext from '@daouy/host/registerGlobalContext';
|
|
6
|
+
import ResizeObserver from 'resize-observer-polyfill';
|
|
7
|
+
|
|
8
|
+
function _extends() {
|
|
9
|
+
return _extends = Object.assign ? Object.assign.bind() : function (n) {
|
|
10
|
+
for (var e = 1; e < arguments.length; e++) {
|
|
11
|
+
var t = arguments[e];
|
|
12
|
+
for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
|
|
13
|
+
}
|
|
14
|
+
return n;
|
|
15
|
+
}, _extends.apply(null, arguments);
|
|
16
|
+
}
|
|
17
|
+
function _objectWithoutPropertiesLoose(r, e) {
|
|
18
|
+
if (null == r) return {};
|
|
19
|
+
var t = {};
|
|
20
|
+
for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
|
|
21
|
+
if (-1 !== e.indexOf(n)) continue;
|
|
22
|
+
t[n] = r[n];
|
|
23
|
+
}
|
|
24
|
+
return t;
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
function ParallaxWrapper(_ref) {
|
|
28
|
+
var speed = _ref.speed,
|
|
29
|
+
disabled = _ref.disabled,
|
|
30
|
+
previewInEditor = _ref.previewInEditor,
|
|
31
|
+
children = _ref.children,
|
|
32
|
+
className = _ref.className;
|
|
33
|
+
var inEditor = useContext(DaouyCanvasContext);
|
|
34
|
+
var hasContext = useContext(ParallaxContext) != null;
|
|
35
|
+
var isServer = typeof window === "undefined";
|
|
36
|
+
if (!hasContext && !isServer) {
|
|
37
|
+
throw new Error("Scroll Parallax can only be instantiated somewhere inside the Parallax Provider");
|
|
38
|
+
}
|
|
39
|
+
return React.createElement(Parallax, {
|
|
40
|
+
disabled: disabled || inEditor && !previewInEditor,
|
|
41
|
+
speed: speed,
|
|
42
|
+
className: className
|
|
43
|
+
}, children);
|
|
44
|
+
}
|
|
45
|
+
/**
|
|
46
|
+
* We're keeping the old registration without attachments to avoid confusion
|
|
47
|
+
* due to the parallax custom behavior not working in old projects that didn't
|
|
48
|
+
* make use of global contexts (so simply adding the custom behavior would
|
|
49
|
+
* break it and it wouldn't be clear that the user should also add a
|
|
50
|
+
* `ParallaxProvider`).
|
|
51
|
+
*/
|
|
52
|
+
var deprecated_parallaxWrapperMeta = {
|
|
53
|
+
name: "hostless-scroll-parallax",
|
|
54
|
+
displayName: "Scroll Parallax",
|
|
55
|
+
importName: "ParallaxWrapper",
|
|
56
|
+
importPath: "@daouypkgs/react-scroll-parallax",
|
|
57
|
+
props: {
|
|
58
|
+
children: {
|
|
59
|
+
type: "slot",
|
|
60
|
+
defaultValue: {
|
|
61
|
+
type: "img",
|
|
62
|
+
src: "https://placekitten.com/300/200",
|
|
63
|
+
styles: {
|
|
64
|
+
maxWidth: "100%"
|
|
65
|
+
}
|
|
66
|
+
}
|
|
67
|
+
},
|
|
68
|
+
speed: {
|
|
69
|
+
type: "number",
|
|
70
|
+
description: "How much to speed up or slow down this element while scrolling. Try -20 for slower, 20 for faster.",
|
|
71
|
+
defaultValue: 20
|
|
72
|
+
},
|
|
73
|
+
disabled: {
|
|
74
|
+
type: "boolean",
|
|
75
|
+
description: "Disables the parallax effect."
|
|
76
|
+
},
|
|
77
|
+
previewInEditor: {
|
|
78
|
+
type: "boolean",
|
|
79
|
+
description: "Enable the parallax effect in the editor."
|
|
80
|
+
}
|
|
81
|
+
},
|
|
82
|
+
defaultStyles: {
|
|
83
|
+
maxWidth: "100%"
|
|
84
|
+
}
|
|
85
|
+
};
|
|
86
|
+
function deprecated_registerParallaxWrapper(loader, customParallaxWrapperMeta) {
|
|
87
|
+
if (loader) {
|
|
88
|
+
loader.registerComponent(ParallaxWrapper, customParallaxWrapperMeta != null ? customParallaxWrapperMeta : deprecated_parallaxWrapperMeta);
|
|
89
|
+
} else {
|
|
90
|
+
registerComponent(ParallaxWrapper, customParallaxWrapperMeta != null ? customParallaxWrapperMeta : deprecated_parallaxWrapperMeta);
|
|
91
|
+
}
|
|
92
|
+
}
|
|
93
|
+
/**
|
|
94
|
+
* The new registration is only setting `isAttachment: true`.
|
|
95
|
+
*/
|
|
96
|
+
var parallaxWrapperMeta = /*#__PURE__*/_extends({}, deprecated_parallaxWrapperMeta, {
|
|
97
|
+
isAttachment: true
|
|
98
|
+
});
|
|
99
|
+
function registerParallaxWrapper(loader, customParallaxWrapperMeta) {
|
|
100
|
+
if (loader) {
|
|
101
|
+
loader.registerComponent(ParallaxWrapper, customParallaxWrapperMeta != null ? customParallaxWrapperMeta : parallaxWrapperMeta);
|
|
102
|
+
} else {
|
|
103
|
+
registerComponent(ParallaxWrapper, customParallaxWrapperMeta != null ? customParallaxWrapperMeta : parallaxWrapperMeta);
|
|
104
|
+
}
|
|
105
|
+
}
|
|
106
|
+
|
|
107
|
+
var _excluded = ["children"];
|
|
108
|
+
/**
|
|
109
|
+
* A safe wrapper around `useController()` to prevent errors when
|
|
110
|
+
* `ParallaxProvider` is missing. If the context is unavailable,
|
|
111
|
+
* `useController()` will throw an error, which we catch and handle
|
|
112
|
+
* gracefully by returning `null` instead of crashing the component.
|
|
113
|
+
*/
|
|
114
|
+
function useSafeController() {
|
|
115
|
+
try {
|
|
116
|
+
return useController();
|
|
117
|
+
} catch (_unused) {
|
|
118
|
+
return null; // Return null instead of throwing an error
|
|
119
|
+
}
|
|
120
|
+
}
|
|
121
|
+
/**
|
|
122
|
+
* This is required to ensure the parallax scrolling works correctly, since if
|
|
123
|
+
* (for instance) images load after the parallax wrapper has calculated the
|
|
124
|
+
* dimensions of the space, it will result in incorrect parallax scrolling
|
|
125
|
+
* amounts.
|
|
126
|
+
*
|
|
127
|
+
* This is not great since we need to mutation-observe the whole section of the
|
|
128
|
+
* document (which may be large), but we can probably optimize this in the
|
|
129
|
+
* future.
|
|
130
|
+
*/
|
|
131
|
+
function ParallaxCacheUpdate(_ref) {
|
|
132
|
+
var children = _ref.children;
|
|
133
|
+
var parallaxController = useSafeController();
|
|
134
|
+
var ref = useRef(null);
|
|
135
|
+
useEffect(function () {
|
|
136
|
+
var _ref$current;
|
|
137
|
+
if ((_ref$current = ref.current) != null && _ref$current.parentElement) {
|
|
138
|
+
var targetNode = ref.current.parentElement;
|
|
139
|
+
var observer = new ResizeObserver(function () {
|
|
140
|
+
if (parallaxController) {
|
|
141
|
+
parallaxController.update();
|
|
142
|
+
}
|
|
143
|
+
});
|
|
144
|
+
observer.observe(targetNode);
|
|
145
|
+
return function () {
|
|
146
|
+
observer.disconnect();
|
|
147
|
+
};
|
|
148
|
+
}
|
|
149
|
+
return function () {};
|
|
150
|
+
}, [ref.current]);
|
|
151
|
+
return React.createElement("div", {
|
|
152
|
+
style: {
|
|
153
|
+
display: "contents"
|
|
154
|
+
},
|
|
155
|
+
ref: ref
|
|
156
|
+
}, children);
|
|
157
|
+
}
|
|
158
|
+
function ParallaxProviderWrapper(_ref2) {
|
|
159
|
+
var children = _ref2.children,
|
|
160
|
+
props = _objectWithoutPropertiesLoose(_ref2, _excluded);
|
|
161
|
+
return React.createElement(ParallaxProvider, Object.assign({}, props), React.createElement(ParallaxCacheUpdate, null, children));
|
|
162
|
+
}
|
|
163
|
+
/**
|
|
164
|
+
* @deprecated use `globalParallaxProviderMeta` instead.
|
|
165
|
+
*/
|
|
166
|
+
var parallaxProviderMeta = {
|
|
167
|
+
name: "hostless-parallax-provider",
|
|
168
|
+
displayName: "Parallax Provider",
|
|
169
|
+
importName: "ParallaxProviderWrapper",
|
|
170
|
+
importPath: "@daouypkgs/react-scroll-parallax",
|
|
171
|
+
props: {
|
|
172
|
+
children: {
|
|
173
|
+
type: "slot",
|
|
174
|
+
defaultValue: {
|
|
175
|
+
type: "vbox",
|
|
176
|
+
children: [{
|
|
177
|
+
type: "text",
|
|
178
|
+
value: "Wrap any element in a Scroll Parallax component. Ensure they're all inside this Parallax Provider. Example:",
|
|
179
|
+
styles: {
|
|
180
|
+
marginBottom: "20px"
|
|
181
|
+
}
|
|
182
|
+
}, {
|
|
183
|
+
type: "component",
|
|
184
|
+
name: "hostless-scroll-parallax"
|
|
185
|
+
}]
|
|
186
|
+
}
|
|
187
|
+
},
|
|
188
|
+
scrollAxis: {
|
|
189
|
+
type: "choice",
|
|
190
|
+
description: "Scroll axis for setting horizontal/vertical scrolling",
|
|
191
|
+
options: ["vertical", "horizontal"],
|
|
192
|
+
displayName: "Scroll Axis"
|
|
193
|
+
}
|
|
194
|
+
}
|
|
195
|
+
};
|
|
196
|
+
/**
|
|
197
|
+
* @deprecated use `registerGlobalParallaxProvider` instead.
|
|
198
|
+
*/
|
|
199
|
+
function registerParallaxProvider(loader, customParallaxProviderMeta) {
|
|
200
|
+
if (loader) {
|
|
201
|
+
loader.registerComponent(ParallaxProviderWrapper, customParallaxProviderMeta != null ? customParallaxProviderMeta : parallaxProviderMeta);
|
|
202
|
+
} else {
|
|
203
|
+
registerComponent(ParallaxProviderWrapper, customParallaxProviderMeta != null ? customParallaxProviderMeta : parallaxProviderMeta);
|
|
204
|
+
}
|
|
205
|
+
}
|
|
206
|
+
var globalParallaxProviderMeta = {
|
|
207
|
+
name: "global-parallax-provider",
|
|
208
|
+
displayName: "Parallax Provider",
|
|
209
|
+
importName: "ParallaxProviderWrapper",
|
|
210
|
+
importPath: "@daouypkgs/react-scroll-parallax",
|
|
211
|
+
props: {
|
|
212
|
+
scrollAxis: {
|
|
213
|
+
type: "choice",
|
|
214
|
+
description: "Scroll axis for setting horizontal/vertical scrolling",
|
|
215
|
+
options: ["vertical", "horizontal"],
|
|
216
|
+
displayName: "Scroll Axis"
|
|
217
|
+
}
|
|
218
|
+
}
|
|
219
|
+
};
|
|
220
|
+
function registerGlobalParallaxProvider(loader, customParallaxProviderMeta) {
|
|
221
|
+
if (loader) {
|
|
222
|
+
loader.registerGlobalContext(ParallaxProviderWrapper, customParallaxProviderMeta != null ? customParallaxProviderMeta : globalParallaxProviderMeta);
|
|
223
|
+
} else {
|
|
224
|
+
registerGlobalContext(ParallaxProviderWrapper, customParallaxProviderMeta != null ? customParallaxProviderMeta : globalParallaxProviderMeta);
|
|
225
|
+
}
|
|
226
|
+
}
|
|
227
|
+
|
|
228
|
+
export { ParallaxProviderWrapper, ParallaxWrapper, deprecated_parallaxWrapperMeta, deprecated_registerParallaxWrapper, globalParallaxProviderMeta, parallaxProviderMeta, parallaxWrapperMeta, registerGlobalParallaxProvider, registerParallaxProvider, registerParallaxWrapper };
|
|
229
|
+
//# sourceMappingURL=react-scroll-parallax.esm.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"react-scroll-parallax.esm.js","sources":["../src/ParallaxWrapper.tsx","../src/ParallaxProvider.tsx"],"sourcesContent":["import { DaouyCanvasContext } from \"@daouy/host\";\nimport registerComponent, {\n ComponentMeta,\n} from \"@daouy/host/registerComponent\";\nimport React, { useContext } from \"react\";\nimport { Parallax, ParallaxContext } from \"react-scroll-parallax\";\n\nexport interface ParallaxWrapperProps {\n speed?: number;\n disabled?: boolean;\n previewInEditor?: boolean;\n children: React.ReactNode;\n className?: string;\n}\n\nexport default function ParallaxWrapper({\n speed,\n disabled,\n previewInEditor,\n children,\n className,\n}: ParallaxWrapperProps) {\n const inEditor = useContext(DaouyCanvasContext);\n const hasContext = useContext(ParallaxContext) != null;\n const isServer = typeof window === \"undefined\";\n if (!hasContext && !isServer) {\n throw new Error(\n \"Scroll Parallax can only be instantiated somewhere inside the Parallax Provider\"\n );\n }\n return (\n <Parallax\n disabled={disabled || (inEditor && !previewInEditor)}\n speed={speed}\n className={className}\n >\n {children}\n </Parallax>\n );\n}\n\n/**\n * We're keeping the old registration without attachments to avoid confusion\n * due to the parallax custom behavior not working in old projects that didn't\n * make use of global contexts (so simply adding the custom behavior would\n * break it and it wouldn't be clear that the user should also add a\n * `ParallaxProvider`).\n */\nexport const deprecated_parallaxWrapperMeta: ComponentMeta<ParallaxWrapperProps> =\n {\n name: \"hostless-scroll-parallax\",\n displayName: \"Scroll Parallax\",\n importName: \"ParallaxWrapper\",\n importPath: \"@daouypkgs/react-scroll-parallax\",\n props: {\n children: {\n type: \"slot\",\n defaultValue: {\n type: \"img\",\n src: \"https://placekitten.com/300/200\",\n styles: {\n maxWidth: \"100%\",\n },\n },\n },\n speed: {\n type: \"number\",\n description:\n \"How much to speed up or slow down this element while scrolling. Try -20 for slower, 20 for faster.\",\n defaultValue: 20,\n },\n disabled: {\n type: \"boolean\",\n description: \"Disables the parallax effect.\",\n },\n previewInEditor: {\n type: \"boolean\",\n description: \"Enable the parallax effect in the editor.\",\n },\n },\n defaultStyles: {\n maxWidth: \"100%\",\n },\n };\n\nexport function deprecated_registerParallaxWrapper(\n loader?: { registerComponent: typeof registerComponent },\n customParallaxWrapperMeta?: ComponentMeta<ParallaxWrapperProps>\n) {\n if (loader) {\n loader.registerComponent(\n ParallaxWrapper,\n customParallaxWrapperMeta ?? deprecated_parallaxWrapperMeta\n );\n } else {\n registerComponent(\n ParallaxWrapper,\n customParallaxWrapperMeta ?? deprecated_parallaxWrapperMeta\n );\n }\n}\n\n/**\n * The new registration is only setting `isAttachment: true`.\n */\nexport const parallaxWrapperMeta: ComponentMeta<ParallaxWrapperProps> = {\n ...deprecated_parallaxWrapperMeta,\n isAttachment: true,\n};\n\nexport function registerParallaxWrapper(\n loader?: { registerComponent: typeof registerComponent },\n customParallaxWrapperMeta?: ComponentMeta<ParallaxWrapperProps>\n) {\n if (loader) {\n loader.registerComponent(\n ParallaxWrapper,\n customParallaxWrapperMeta ?? parallaxWrapperMeta\n );\n } else {\n registerComponent(\n ParallaxWrapper,\n customParallaxWrapperMeta ?? parallaxWrapperMeta\n );\n }\n}\n","import registerComponent, {\n ComponentMeta,\n} from \"@daouy/host/registerComponent\";\nimport registerGlobalContext, {\n GlobalContextMeta,\n} from \"@daouy/host/registerGlobalContext\";\nimport React, { useEffect, useRef } from \"react\";\nimport { ParallaxProvider, useController } from \"react-scroll-parallax\";\nimport { ParallaxProviderProps } from \"react-scroll-parallax/dist/components/ParallaxProvider/types\";\nimport ResizeObserver from \"resize-observer-polyfill\";\n\n/**\n * A safe wrapper around `useController()` to prevent errors when\n * `ParallaxProvider` is missing. If the context is unavailable,\n * `useController()` will throw an error, which we catch and handle\n * gracefully by returning `null` instead of crashing the component.\n */\nfunction useSafeController() {\n try {\n return useController();\n } catch {\n return null; // Return null instead of throwing an error\n }\n}\n\n/**\n * This is required to ensure the parallax scrolling works correctly, since if\n * (for instance) images load after the parallax wrapper has calculated the\n * dimensions of the space, it will result in incorrect parallax scrolling\n * amounts.\n *\n * This is not great since we need to mutation-observe the whole section of the\n * document (which may be large), but we can probably optimize this in the\n * future.\n */\nfunction ParallaxCacheUpdate({ children }: React.PropsWithChildren<{}>) {\n const parallaxController = useSafeController();\n const ref = useRef<HTMLDivElement | null>(null);\n\n useEffect(() => {\n if (ref.current?.parentElement) {\n const targetNode = ref.current.parentElement;\n const observer = new ResizeObserver(() => {\n if (parallaxController) {\n parallaxController.update();\n }\n });\n observer.observe(targetNode);\n return () => {\n observer.disconnect();\n };\n }\n return () => {};\n }, [ref.current]);\n\n return (\n <div style={{ display: \"contents\" }} ref={ref}>\n {children}\n </div>\n );\n}\n\nexport function ParallaxProviderWrapper({\n children,\n ...props\n}: React.PropsWithChildren<ParallaxProviderProps>) {\n return (\n <ParallaxProvider {...props}>\n <ParallaxCacheUpdate>{children}</ParallaxCacheUpdate>\n </ParallaxProvider>\n );\n}\n\n/**\n * @deprecated use `globalParallaxProviderMeta` instead.\n */\nexport const parallaxProviderMeta: ComponentMeta<ParallaxProviderProps> = {\n name: \"hostless-parallax-provider\",\n displayName: \"Parallax Provider\",\n importName: \"ParallaxProviderWrapper\",\n importPath: \"@daouypkgs/react-scroll-parallax\",\n props: {\n children: {\n type: \"slot\",\n defaultValue: {\n type: \"vbox\",\n children: [\n {\n type: \"text\",\n value:\n \"Wrap any element in a Scroll Parallax component. Ensure they're all inside this Parallax Provider. Example:\",\n styles: {\n marginBottom: \"20px\",\n },\n },\n {\n type: \"component\",\n name: \"hostless-scroll-parallax\",\n },\n ],\n },\n },\n scrollAxis: {\n type: \"choice\",\n description: \"Scroll axis for setting horizontal/vertical scrolling\",\n options: [\"vertical\", \"horizontal\"],\n displayName: \"Scroll Axis\",\n },\n },\n};\n\n/**\n * @deprecated use `registerGlobalParallaxProvider` instead.\n */\nexport function registerParallaxProvider(\n loader?: { registerComponent: typeof registerComponent },\n customParallaxProviderMeta?: ComponentMeta<ParallaxProviderProps>\n) {\n if (loader) {\n loader.registerComponent(\n ParallaxProviderWrapper,\n customParallaxProviderMeta ?? parallaxProviderMeta\n );\n } else {\n registerComponent(\n ParallaxProviderWrapper,\n customParallaxProviderMeta ?? parallaxProviderMeta\n );\n }\n}\n\nexport const globalParallaxProviderMeta: GlobalContextMeta<ParallaxProviderProps> =\n {\n name: \"global-parallax-provider\",\n displayName: \"Parallax Provider\",\n importName: \"ParallaxProviderWrapper\",\n importPath: \"@daouypkgs/react-scroll-parallax\",\n props: {\n scrollAxis: {\n type: \"choice\",\n description: \"Scroll axis for setting horizontal/vertical scrolling\",\n options: [\"vertical\", \"horizontal\"],\n displayName: \"Scroll Axis\",\n },\n },\n };\n\nexport function registerGlobalParallaxProvider(\n loader?: { registerGlobalContext: typeof registerGlobalContext },\n customParallaxProviderMeta?: GlobalContextMeta<ParallaxProviderProps>\n) {\n if (loader) {\n loader.registerGlobalContext(\n ParallaxProviderWrapper,\n customParallaxProviderMeta ?? globalParallaxProviderMeta\n );\n } else {\n registerGlobalContext(\n ParallaxProviderWrapper,\n customParallaxProviderMeta ?? globalParallaxProviderMeta\n );\n }\n}\n"],"names":["ParallaxWrapper","_ref","speed","disabled","previewInEditor","children","className","inEditor","useContext","DaouyCanvasContext","hasContext","ParallaxContext","isServer","window","Error","React","Parallax","deprecated_parallaxWrapperMeta","name","displayName","importName","importPath","props","type","defaultValue","src","styles","maxWidth","description","defaultStyles","deprecated_registerParallaxWrapper","loader","customParallaxWrapperMeta","registerComponent","parallaxWrapperMeta","_extends","isAttachment","registerParallaxWrapper","useSafeController","useController","_unused","ParallaxCacheUpdate","parallaxController","ref","useRef","useEffect","_ref$current","current","parentElement","targetNode","observer","ResizeObserver","update","observe","disconnect","style","display","ParallaxProviderWrapper","_ref2","_objectWithoutPropertiesLoose","_excluded","ParallaxProvider","parallaxProviderMeta","value","marginBottom","scrollAxis","options","registerParallaxProvider","customParallaxProviderMeta","globalParallaxProviderMeta","registerGlobalParallaxProvider","registerGlobalContext"],"mappings":"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"}
|
package/package.json
ADDED
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@daouypkgs/react-scroll-parallax",
|
|
3
|
+
"version": "0.0.243",
|
|
4
|
+
"description": "Daouy registration call for the HTML5 video element",
|
|
5
|
+
"main": "dist/index.js",
|
|
6
|
+
"types": "dist/index.d.ts",
|
|
7
|
+
"module": "dist/react-scroll-parallax.esm.js",
|
|
8
|
+
"files": [
|
|
9
|
+
"dist"
|
|
10
|
+
],
|
|
11
|
+
"size-limit": [
|
|
12
|
+
{
|
|
13
|
+
"path": "dist/react-scroll-parallax.cjs.production.min.js",
|
|
14
|
+
"limit": "40 KB"
|
|
15
|
+
},
|
|
16
|
+
{
|
|
17
|
+
"path": "dist/react-scroll-parallax.esm.js",
|
|
18
|
+
"limit": "40 KB"
|
|
19
|
+
}
|
|
20
|
+
],
|
|
21
|
+
"scripts": {
|
|
22
|
+
"build": "tsdx build",
|
|
23
|
+
"start": "tsdx watch",
|
|
24
|
+
"test": "TEST_CWD=`pwd` yarn --cwd=../.. test --passWithNoTests",
|
|
25
|
+
"lint": "tsdx lint",
|
|
26
|
+
"prepublishOnly": "npm run build",
|
|
27
|
+
"size": "size-limit",
|
|
28
|
+
"analyze": "size-limit --why"
|
|
29
|
+
},
|
|
30
|
+
"devDependencies": {
|
|
31
|
+
"@daouy/host": "^1.0.234",
|
|
32
|
+
"@types/node": "^14.0.26",
|
|
33
|
+
"@types/react": "^18.2.33",
|
|
34
|
+
"tsdx": "^0.14.1",
|
|
35
|
+
"tslib": "^2.2.0"
|
|
36
|
+
},
|
|
37
|
+
"dependencies": {
|
|
38
|
+
"react-scroll-parallax": "3.0.0-alpha.14",
|
|
39
|
+
"resize-observer-polyfill": "^1.5.1"
|
|
40
|
+
},
|
|
41
|
+
"peerDependencies": {
|
|
42
|
+
"@daouy/host": "^1.0.234",
|
|
43
|
+
"react": ">=16.8.0",
|
|
44
|
+
"react-dom": ">=16.8.0"
|
|
45
|
+
}
|
|
46
|
+
}
|