@plasmicpkgs/react-scroll-parallax 0.0.20 → 0.0.21

package/dist/ParallaxProvider.d.ts

@@ -1,4 +1,5 @@
 import registerComponent, { ComponentMeta } from "@plasmicapp/host/registerComponent";
+import registerGlobalContext, { GlobalContextMeta } from "@plasmicapp/host/registerGlobalContext";
 import React from "react";
 import { ParallaxProviderProps } from "react-scroll-parallax/dist/components/ParallaxProvider/types";
 export declare function ParallaxProviderWrapper({ children, ...props }: React.PropsWithChildren<ParallaxProviderProps>): JSX.Element;
@@ -6,3 +7,7 @@ export declare const parallaxProviderMeta: ComponentMeta<ParallaxProviderProps>;
 export declare function registerParallaxProvider(loader?: {
     registerComponent: typeof registerComponent;
 }, customParallaxProviderMeta?: ComponentMeta<ParallaxProviderProps>): void;
+export declare const globalParallaxProviderMeta: GlobalContextMeta<ParallaxProviderProps>;
+export declare function registerGlobalParallaxProvider(loader?: {
+    registerGlobalContext: typeof registerGlobalContext;
+}, customParallaxProviderMeta?: GlobalContextMeta<ParallaxProviderProps>): void;

package/dist/react-scroll-parallax.cjs.development.js

@@ -9,6 +9,7 @@ var registerComponent = _interopDefault(require('@plasmicapp/host/registerCompon
 var React = require('react');
 var React__default = _interopDefault(React);
 var reactScrollParallax = require('react-scroll-parallax');
+var registerGlobalContext = _interopDefault(require('@plasmicapp/host/registerGlobalContext'));
 var ResizeObserver = _interopDefault(require('resize-observer-polyfill'));
 
 function ParallaxWrapper(_ref) {
@@ -173,11 +174,34 @@ function registerParallaxProvider(loader, customParallaxProviderMeta) {
     registerComponent(ParallaxProviderWrapper, customParallaxProviderMeta != null ? customParallaxProviderMeta : parallaxProviderMeta);
   }
 }
+var globalParallaxProviderMeta = {
+  name: "global-parallax-provider",
+  displayName: "Parallax Provider",
+  importName: "ParallaxProviderWrapper",
+  importPath: "@plasmicpkgs/react-scroll-parallax",
+  props: {
+    scrollAxis: {
+      type: "choice",
+      description: "Scroll axis for setting horizontal/vertical scrolling",
+      options: ["vertical", "horizontal"],
+      displayName: "Scroll Axis"
+    }
+  }
+};
+function registerGlobalParallaxProvider(loader, customParallaxProviderMeta) {
+  if (loader) {
+    loader.registerGlobalContext(ParallaxProviderWrapper, customParallaxProviderMeta != null ? customParallaxProviderMeta : globalParallaxProviderMeta);
+  } else {
+    registerGlobalContext(ParallaxProviderWrapper, customParallaxProviderMeta != null ? customParallaxProviderMeta : globalParallaxProviderMeta);
+  }
+}
 
 exports.ParallaxProviderWrapper = ParallaxProviderWrapper;
 exports.ParallaxWrapper = ParallaxWrapper;
+exports.globalParallaxProviderMeta = globalParallaxProviderMeta;
 exports.parallaxProviderMeta = parallaxProviderMeta;
 exports.parallaxWrapperMeta = parallaxWrapperMeta;
+exports.registerGlobalParallaxProvider = registerGlobalParallaxProvider;
 exports.registerParallaxProvider = registerParallaxProvider;
 exports.registerParallaxWrapper = registerParallaxWrapper;
 //# sourceMappingURL=react-scroll-parallax.cjs.development.js.map

package/dist/react-scroll-parallax.cjs.development.js.map

@@ -1 +1 @@
-{"version":3,"file":"react-scroll-parallax.cjs.development.js","sources":["../src/ParallaxWrapper.tsx","../src/ParallaxProvider.tsx"],"sourcesContent":["import { PlasmicCanvasContext } from \"@plasmicapp/host\";\nimport registerComponent, {\n  ComponentMeta,\n} from \"@plasmicapp/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(PlasmicCanvasContext);\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\nexport const parallaxWrapperMeta: ComponentMeta<ParallaxWrapperProps> = {\n  name: \"hostless-scroll-parallax\",\n  displayName: \"Scroll Parallax\",\n  importName: \"ParallaxWrapper\",\n  importPath: \"@plasmicpkgs/react-scroll-parallax\",\n  props: {\n    children: {\n      type: \"slot\",\n      defaultValue: {\n        type: \"img\",\n        src: \"https://placekitten.com/300/200\",\n        style: {\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 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 \"@plasmicapp/host/registerComponent\";\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 * 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 = useController();\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\nexport const parallaxProviderMeta: ComponentMeta<ParallaxProviderProps> = {\n  name: \"hostless-parallax-provider\",\n  displayName: \"Parallax Provider\",\n  importName: \"ParallaxProviderWrapper\",\n  importPath: \"@plasmicpkgs/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\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"],"names":["ParallaxWrapper","speed","disabled","previewInEditor","children","className","inEditor","useContext","PlasmicCanvasContext","hasContext","ParallaxContext","isServer","window","Error","React","Parallax","parallaxWrapperMeta","name","displayName","importName","importPath","props","type","defaultValue","src","style","maxWidth","description","defaultStyles","registerParallaxWrapper","loader","customParallaxWrapperMeta","registerComponent","ParallaxCacheUpdate","parallaxController","useController","ref","useRef","useEffect","current","parentElement","targetNode","observer","ResizeObserver","update","observe","disconnect","display","ParallaxProviderWrapper","ParallaxProvider","parallaxProviderMeta","value","styles","marginBottom","scrollAxis","options","registerParallaxProvider","customParallaxProviderMeta"],"mappings":"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"}
+{"version":3,"file":"react-scroll-parallax.cjs.development.js","sources":["../src/ParallaxWrapper.tsx","../src/ParallaxProvider.tsx"],"sourcesContent":["import { PlasmicCanvasContext } from \"@plasmicapp/host\";\nimport registerComponent, {\n  ComponentMeta,\n} from \"@plasmicapp/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(PlasmicCanvasContext);\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\nexport const parallaxWrapperMeta: ComponentMeta<ParallaxWrapperProps> = {\n  name: \"hostless-scroll-parallax\",\n  displayName: \"Scroll Parallax\",\n  importName: \"ParallaxWrapper\",\n  importPath: \"@plasmicpkgs/react-scroll-parallax\",\n  props: {\n    children: {\n      type: \"slot\",\n      defaultValue: {\n        type: \"img\",\n        src: \"https://placekitten.com/300/200\",\n        style: {\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 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 \"@plasmicapp/host/registerComponent\";\nimport registerGlobalContext, {\n  GlobalContextMeta,\n} from \"@plasmicapp/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 * 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 = useController();\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\nexport const parallaxProviderMeta: ComponentMeta<ParallaxProviderProps> = {\n  name: \"hostless-parallax-provider\",\n  displayName: \"Parallax Provider\",\n  importName: \"ParallaxProviderWrapper\",\n  importPath: \"@plasmicpkgs/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\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  name: \"global-parallax-provider\",\n  displayName: \"Parallax Provider\",\n  importName: \"ParallaxProviderWrapper\",\n  importPath: \"@plasmicpkgs/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","speed","disabled","previewInEditor","children","className","inEditor","useContext","PlasmicCanvasContext","hasContext","ParallaxContext","isServer","window","Error","React","Parallax","parallaxWrapperMeta","name","displayName","importName","importPath","props","type","defaultValue","src","style","maxWidth","description","defaultStyles","registerParallaxWrapper","loader","customParallaxWrapperMeta","registerComponent","ParallaxCacheUpdate","parallaxController","useController","ref","useRef","useEffect","current","parentElement","targetNode","observer","ResizeObserver","update","observe","disconnect","display","ParallaxProviderWrapper","ParallaxProvider","parallaxProviderMeta","value","styles","marginBottom","scrollAxis","options","registerParallaxProvider","customParallaxProviderMeta","globalParallaxProviderMeta","registerGlobalParallaxProvider","registerGlobalContext"],"mappings":"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"}

package/dist/react-scroll-parallax.cjs.production.min.js

@@ -1,2 +1,2 @@
-"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("@plasmicapp/host"),a=e(require("@plasmicapp/host/registerComponent")),l=require("react"),t=e(l),n=require("react-scroll-parallax"),o=e(require("resize-observer-polyfill"));function i(e){var a=e.speed,o=e.disabled,i=e.previewInEditor,s=e.children,p=e.className,c=l.useContext(r.PlasmicCanvasContext),u=null!=l.useContext(n.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(n.Parallax,{disabled:o||c&&!i,speed:a,className:p},s)}var s={name:"hostless-scroll-parallax",displayName:"Scroll Parallax",importName:"ParallaxWrapper",importPath:"@plasmicpkgs/react-scroll-parallax",props:{children:{type:"slot",defaultValue:{type:"img",src:"https://placekitten.com/300/200",style:{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%"}},p=["children"];function c(e){var r=e.children,a=n.useController(),i=l.useRef(null);return l.useEffect((function(){var e;if(null!=(e=i.current)&&e.parentElement){var r=i.current.parentElement,l=new o((function(){a&&a.update()}));return l.observe(r),function(){l.disconnect()}}return function(){}}),[i.current]),t.createElement("div",{style:{display:"contents"},ref:i},r)}function u(e){var r=e.children,a=function(e,r){if(null==e)return{};var a,l,t={},n=Object.keys(e);for(l=0;l<n.length;l++)r.indexOf(a=n[l])>=0||(t[a]=e[a]);return t}(e,p);return t.createElement(n.ParallaxProvider,Object.assign({},a),t.createElement(c,null,r))}var d={name:"hostless-parallax-provider",displayName:"Parallax Provider",importName:"ParallaxProviderWrapper",importPath:"@plasmicpkgs/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"}}};exports.ParallaxProviderWrapper=u,exports.ParallaxWrapper=i,exports.parallaxProviderMeta=d,exports.parallaxWrapperMeta=s,exports.registerParallaxProvider=function(e,r){e?e.registerComponent(u,null!=r?r:d):a(u,null!=r?r:d)},exports.registerParallaxWrapper=function(e,r){e?e.registerComponent(i,null!=r?r:s):a(i,null!=r?r:s)};
+"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("@plasmicapp/host"),l=e(require("@plasmicapp/host/registerComponent")),a=require("react"),t=e(a),o=require("react-scroll-parallax"),i=e(require("@plasmicapp/host/registerGlobalContext")),n=e(require("resize-observer-polyfill"));function s(e){var l=e.speed,i=e.disabled,n=e.previewInEditor,s=e.children,p=e.className,c=a.useContext(r.PlasmicCanvasContext),d=null!=a.useContext(o.ParallaxContext),u="undefined"==typeof window;if(!d&&!u)throw new Error("Scroll Parallax can only be instantiated somewhere inside the Parallax Provider");return t.createElement(o.Parallax,{disabled:i||c&&!n,speed:l,className:p},s)}var p={name:"hostless-scroll-parallax",displayName:"Scroll Parallax",importName:"ParallaxWrapper",importPath:"@plasmicpkgs/react-scroll-parallax",props:{children:{type:"slot",defaultValue:{type:"img",src:"https://placekitten.com/300/200",style:{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%"}},c=["children"];function d(e){var r=e.children,l=o.useController(),i=a.useRef(null);return a.useEffect((function(){var e;if(null!=(e=i.current)&&e.parentElement){var r=i.current.parentElement,a=new n((function(){l&&l.update()}));return a.observe(r),function(){a.disconnect()}}return function(){}}),[i.current]),t.createElement("div",{style:{display:"contents"},ref:i},r)}function u(e){var r=e.children,l=function(e,r){if(null==e)return{};var l,a,t={},o=Object.keys(e);for(a=0;a<o.length;a++)r.indexOf(l=o[a])>=0||(t[l]=e[l]);return t}(e,c);return t.createElement(o.ParallaxProvider,Object.assign({},l),t.createElement(d,null,r))}var x={name:"hostless-parallax-provider",displayName:"Parallax Provider",importName:"ParallaxProviderWrapper",importPath:"@plasmicpkgs/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"}}},m={name:"global-parallax-provider",displayName:"Parallax Provider",importName:"ParallaxProviderWrapper",importPath:"@plasmicpkgs/react-scroll-parallax",props:{scrollAxis:{type:"choice",description:"Scroll axis for setting horizontal/vertical scrolling",options:["vertical","horizontal"],displayName:"Scroll Axis"}}};exports.ParallaxProviderWrapper=u,exports.ParallaxWrapper=s,exports.globalParallaxProviderMeta=m,exports.parallaxProviderMeta=x,exports.parallaxWrapperMeta=p,exports.registerGlobalParallaxProvider=function(e,r){e?e.registerGlobalContext(u,null!=r?r:m):i(u,null!=r?r:m)},exports.registerParallaxProvider=function(e,r){e?e.registerComponent(u,null!=r?r:x):l(u,null!=r?r:x)},exports.registerParallaxWrapper=function(e,r){e?e.registerComponent(s,null!=r?r:p):l(s,null!=r?r:p)};
 //# sourceMappingURL=react-scroll-parallax.cjs.production.min.js.map

package/dist/react-scroll-parallax.cjs.production.min.js.map

@@ -1 +1 @@
-{"version":3,"file":"react-scroll-parallax.cjs.production.min.js","sources":["../src/ParallaxWrapper.tsx","../src/ParallaxProvider.tsx"],"sourcesContent":["import { PlasmicCanvasContext } from \"@plasmicapp/host\";\nimport registerComponent, {\n  ComponentMeta,\n} from \"@plasmicapp/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(PlasmicCanvasContext);\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\nexport const parallaxWrapperMeta: ComponentMeta<ParallaxWrapperProps> = {\n  name: \"hostless-scroll-parallax\",\n  displayName: \"Scroll Parallax\",\n  importName: \"ParallaxWrapper\",\n  importPath: \"@plasmicpkgs/react-scroll-parallax\",\n  props: {\n    children: {\n      type: \"slot\",\n      defaultValue: {\n        type: \"img\",\n        src: \"https://placekitten.com/300/200\",\n        style: {\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 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 \"@plasmicapp/host/registerComponent\";\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 * 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 = useController();\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\nexport const parallaxProviderMeta: ComponentMeta<ParallaxProviderProps> = {\n  name: \"hostless-parallax-provider\",\n  displayName: \"Parallax Provider\",\n  importName: \"ParallaxProviderWrapper\",\n  importPath: \"@plasmicpkgs/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\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"],"names":["ParallaxWrapper","speed","disabled","previewInEditor","children","className","inEditor","useContext","PlasmicCanvasContext","hasContext","ParallaxContext","isServer","window","Error","React","Parallax","parallaxWrapperMeta","name","displayName","importName","importPath","props","type","defaultValue","src","style","maxWidth","description","defaultStyles","ParallaxCacheUpdate","parallaxController","useController","ref","useRef","useEffect","current","_ref$current","parentElement","targetNode","observer","ResizeObserver","update","observe","disconnect","display","ParallaxProviderWrapper","ParallaxProvider","parallaxProviderMeta","value","styles","marginBottom","scrollAxis","options","loader","customParallaxProviderMeta","registerComponent","customParallaxWrapperMeta"],"mappings":"8UAewBA,SACtBC,IAAAA,MACAC,IAAAA,SACAC,IAAAA,gBACAC,IAAAA,SACAC,IAAAA,UAEMC,EAAWC,aAAWC,wBACtBC,EAA4C,MAA/BF,aAAWG,mBACxBC,EAA6B,oBAAXC,WACnBH,IAAeE,QACZ,IAAIE,MACR,0FAIFC,gBAACC,YACCb,SAAUA,GAAaI,IAAaH,EACpCF,MAAOA,EACPI,UAAWA,GAEVD,OAKMY,EAA2D,CACtEC,KAAM,2BACNC,YAAa,kBACbC,WAAY,kBACZC,WAAY,qCACZC,MAAO,CACLjB,SAAU,CACRkB,KAAM,OACNC,aAAc,CACZD,KAAM,MACNE,IAAK,kCACLC,MAAO,CACLC,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,wBCvDd,SAASG,SAAsBzB,IAAAA,SACvB0B,EAAqBC,kBACrBC,EAAMC,SAA8B,aAE1CC,aAAU,6BACJF,EAAIG,UAAJC,EAAaC,cAAe,KACxBC,EAAaN,EAAIG,QAAQE,cACzBE,EAAW,IAAIC,GAAe,WAC9BV,GACFA,EAAmBW,mBAGvBF,EAASG,QAAQJ,GACV,WACLC,EAASI,qBAGN,eACN,CAACX,EAAIG,UAGNrB,uBAAKW,MAAO,CAAEmB,QAAS,YAAcZ,IAAKA,GACvC5B,YAKSyC,SACdzC,IAAAA,SACGiB,iJAGDP,gBAACgC,oCAAqBzB,GACpBP,gBAACe,OAAqBzB,IAK5B,IAAa2C,EAA6D,CACxE9B,KAAM,6BACNC,YAAa,oBACbC,WAAY,0BACZC,WAAY,qCACZC,MAAO,CACLjB,SAAU,CACRkB,KAAM,OACNC,aAAc,CACZD,KAAM,OACNlB,SAAU,CACR,CACEkB,KAAM,OACN0B,MACE,8GACFC,OAAQ,CACNC,aAAc,SAGlB,CACE5B,KAAM,YACNL,KAAM,+BAKdkC,WAAY,CACV7B,KAAM,SACNK,YAAa,wDACbyB,QAAS,CAAC,WAAY,cACtBlC,YAAa,oLAMjBmC,EACAC,GAEID,EACFA,EAAOE,kBACLV,QACAS,EAAAA,EAA8BP,GAGhCQ,EACEV,QACAS,EAAAA,EAA8BP,6CDzBlCM,EACAG,GAEIH,EACFA,EAAOE,kBACLvD,QACAwD,EAAAA,EAA6BxC,GAG/BuC,EACEvD,QACAwD,EAAAA,EAA6BxC"}
+{"version":3,"file":"react-scroll-parallax.cjs.production.min.js","sources":["../src/ParallaxWrapper.tsx","../src/ParallaxProvider.tsx"],"sourcesContent":["import { PlasmicCanvasContext } from \"@plasmicapp/host\";\nimport registerComponent, {\n  ComponentMeta,\n} from \"@plasmicapp/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(PlasmicCanvasContext);\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\nexport const parallaxWrapperMeta: ComponentMeta<ParallaxWrapperProps> = {\n  name: \"hostless-scroll-parallax\",\n  displayName: \"Scroll Parallax\",\n  importName: \"ParallaxWrapper\",\n  importPath: \"@plasmicpkgs/react-scroll-parallax\",\n  props: {\n    children: {\n      type: \"slot\",\n      defaultValue: {\n        type: \"img\",\n        src: \"https://placekitten.com/300/200\",\n        style: {\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 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 \"@plasmicapp/host/registerComponent\";\nimport registerGlobalContext, {\n  GlobalContextMeta,\n} from \"@plasmicapp/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 * 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 = useController();\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\nexport const parallaxProviderMeta: ComponentMeta<ParallaxProviderProps> = {\n  name: \"hostless-parallax-provider\",\n  displayName: \"Parallax Provider\",\n  importName: \"ParallaxProviderWrapper\",\n  importPath: \"@plasmicpkgs/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\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  name: \"global-parallax-provider\",\n  displayName: \"Parallax Provider\",\n  importName: \"ParallaxProviderWrapper\",\n  importPath: \"@plasmicpkgs/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","speed","disabled","previewInEditor","children","className","inEditor","useContext","PlasmicCanvasContext","hasContext","ParallaxContext","isServer","window","Error","React","Parallax","parallaxWrapperMeta","name","displayName","importName","importPath","props","type","defaultValue","src","style","maxWidth","description","defaultStyles","ParallaxCacheUpdate","parallaxController","useController","ref","useRef","useEffect","current","_ref$current","parentElement","targetNode","observer","ResizeObserver","update","observe","disconnect","display","ParallaxProviderWrapper","ParallaxProvider","parallaxProviderMeta","value","styles","marginBottom","scrollAxis","options","globalParallaxProviderMeta","loader","customParallaxProviderMeta","registerGlobalContext","registerComponent","customParallaxWrapperMeta"],"mappings":"qYAewBA,SACtBC,IAAAA,MACAC,IAAAA,SACAC,IAAAA,gBACAC,IAAAA,SACAC,IAAAA,UAEMC,EAAWC,aAAWC,wBACtBC,EAA4C,MAA/BF,aAAWG,mBACxBC,EAA6B,oBAAXC,WACnBH,IAAeE,QACZ,IAAIE,MACR,0FAIFC,gBAACC,YACCb,SAAUA,GAAaI,IAAaH,EACpCF,MAAOA,EACPI,UAAWA,GAEVD,OAKMY,EAA2D,CACtEC,KAAM,2BACNC,YAAa,kBACbC,WAAY,kBACZC,WAAY,qCACZC,MAAO,CACLjB,SAAU,CACRkB,KAAM,OACNC,aAAc,CACZD,KAAM,MACNE,IAAK,kCACLC,MAAO,CACLC,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,wBCpDd,SAASG,SAAsBzB,IAAAA,SACvB0B,EAAqBC,kBACrBC,EAAMC,SAA8B,aAE1CC,aAAU,6BACJF,EAAIG,UAAJC,EAAaC,cAAe,KACxBC,EAAaN,EAAIG,QAAQE,cACzBE,EAAW,IAAIC,GAAe,WAC9BV,GACFA,EAAmBW,mBAGvBF,EAASG,QAAQJ,GACV,WACLC,EAASI,qBAGN,eACN,CAACX,EAAIG,UAGNrB,uBAAKW,MAAO,CAAEmB,QAAS,YAAcZ,IAAKA,GACvC5B,YAKSyC,SACdzC,IAAAA,SACGiB,iJAGDP,gBAACgC,oCAAqBzB,GACpBP,gBAACe,OAAqBzB,IAK5B,IAAa2C,EAA6D,CACxE9B,KAAM,6BACNC,YAAa,oBACbC,WAAY,0BACZC,WAAY,qCACZC,MAAO,CACLjB,SAAU,CACRkB,KAAM,OACNC,aAAc,CACZD,KAAM,OACNlB,SAAU,CACR,CACEkB,KAAM,OACN0B,MACE,8GACFC,OAAQ,CACNC,aAAc,SAGlB,CACE5B,KAAM,YACNL,KAAM,+BAKdkC,WAAY,CACV7B,KAAM,SACNK,YAAa,wDACbyB,QAAS,CAAC,WAAY,cACtBlC,YAAa,iBAsBNmC,EAAuE,CAClFpC,KAAM,2BACNC,YAAa,oBACbC,WAAY,0BACZC,WAAY,qCACZC,MAAO,CACL8B,WAAY,CACV7B,KAAM,SACNK,YAAa,wDACbyB,QAAS,CAAC,WAAY,cACtBlC,YAAa,+NAMjBoC,EACAC,GAEID,EACFA,EAAOE,sBACLX,QACAU,EAAAA,EAA8BF,GAGhCG,EACEX,QACAU,EAAAA,EAA8BF,8CA3ClCC,EACAC,GAEID,EACFA,EAAOG,kBACLZ,QACAU,EAAAA,EAA8BR,GAGhCU,EACEZ,QACAU,EAAAA,EAA8BR,6CD5BlCO,EACAI,GAEIJ,EACFA,EAAOG,kBACLzD,QACA0D,EAAAA,EAA6B1C,GAG/ByC,EACEzD,QACA0D,EAAAA,EAA6B1C"}

package/dist/react-scroll-parallax.esm.js

@@ -2,6 +2,7 @@ import { PlasmicCanvasContext } from '@plasmicapp/host';
 import registerComponent from '@plasmicapp/host/registerComponent';
 import React, { useContext, useRef, useEffect } from 'react';
 import { ParallaxContext, Parallax, ParallaxProvider, useController } from 'react-scroll-parallax';
+import registerGlobalContext from '@plasmicapp/host/registerGlobalContext';
 import ResizeObserver from 'resize-observer-polyfill';
 
 function ParallaxWrapper(_ref) {
@@ -166,6 +167,27 @@ function registerParallaxProvider(loader, customParallaxProviderMeta) {
     registerComponent(ParallaxProviderWrapper, customParallaxProviderMeta != null ? customParallaxProviderMeta : parallaxProviderMeta);
   }
 }
+var globalParallaxProviderMeta = {
+  name: "global-parallax-provider",
+  displayName: "Parallax Provider",
+  importName: "ParallaxProviderWrapper",
+  importPath: "@plasmicpkgs/react-scroll-parallax",
+  props: {
+    scrollAxis: {
+      type: "choice",
+      description: "Scroll axis for setting horizontal/vertical scrolling",
+      options: ["vertical", "horizontal"],
+      displayName: "Scroll Axis"
+    }
+  }
+};
+function registerGlobalParallaxProvider(loader, customParallaxProviderMeta) {
+  if (loader) {
+    loader.registerGlobalContext(ParallaxProviderWrapper, customParallaxProviderMeta != null ? customParallaxProviderMeta : globalParallaxProviderMeta);
+  } else {
+    registerGlobalContext(ParallaxProviderWrapper, customParallaxProviderMeta != null ? customParallaxProviderMeta : globalParallaxProviderMeta);
+  }
+}
 
-export { ParallaxProviderWrapper, ParallaxWrapper, parallaxProviderMeta, parallaxWrapperMeta, registerParallaxProvider, registerParallaxWrapper };
+export { ParallaxProviderWrapper, ParallaxWrapper, globalParallaxProviderMeta, parallaxProviderMeta, parallaxWrapperMeta, registerGlobalParallaxProvider, registerParallaxProvider, registerParallaxWrapper };
 //# sourceMappingURL=react-scroll-parallax.esm.js.map

package/dist/react-scroll-parallax.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"react-scroll-parallax.esm.js","sources":["../src/ParallaxWrapper.tsx","../src/ParallaxProvider.tsx"],"sourcesContent":["import { PlasmicCanvasContext } from \"@plasmicapp/host\";\nimport registerComponent, {\n  ComponentMeta,\n} from \"@plasmicapp/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(PlasmicCanvasContext);\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\nexport const parallaxWrapperMeta: ComponentMeta<ParallaxWrapperProps> = {\n  name: \"hostless-scroll-parallax\",\n  displayName: \"Scroll Parallax\",\n  importName: \"ParallaxWrapper\",\n  importPath: \"@plasmicpkgs/react-scroll-parallax\",\n  props: {\n    children: {\n      type: \"slot\",\n      defaultValue: {\n        type: \"img\",\n        src: \"https://placekitten.com/300/200\",\n        style: {\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 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 \"@plasmicapp/host/registerComponent\";\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 * 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 = useController();\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\nexport const parallaxProviderMeta: ComponentMeta<ParallaxProviderProps> = {\n  name: \"hostless-parallax-provider\",\n  displayName: \"Parallax Provider\",\n  importName: \"ParallaxProviderWrapper\",\n  importPath: \"@plasmicpkgs/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\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"],"names":["ParallaxWrapper","speed","disabled","previewInEditor","children","className","inEditor","useContext","PlasmicCanvasContext","hasContext","ParallaxContext","isServer","window","Error","React","Parallax","parallaxWrapperMeta","name","displayName","importName","importPath","props","type","defaultValue","src","style","maxWidth","description","defaultStyles","registerParallaxWrapper","loader","customParallaxWrapperMeta","registerComponent","ParallaxCacheUpdate","parallaxController","useController","ref","useRef","useEffect","current","parentElement","targetNode","observer","ResizeObserver","update","observe","disconnect","display","ParallaxProviderWrapper","ParallaxProvider","parallaxProviderMeta","value","styles","marginBottom","scrollAxis","options","registerParallaxProvider","customParallaxProviderMeta"],"mappings":"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"}
+{"version":3,"file":"react-scroll-parallax.esm.js","sources":["../src/ParallaxWrapper.tsx","../src/ParallaxProvider.tsx"],"sourcesContent":["import { PlasmicCanvasContext } from \"@plasmicapp/host\";\nimport registerComponent, {\n  ComponentMeta,\n} from \"@plasmicapp/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(PlasmicCanvasContext);\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\nexport const parallaxWrapperMeta: ComponentMeta<ParallaxWrapperProps> = {\n  name: \"hostless-scroll-parallax\",\n  displayName: \"Scroll Parallax\",\n  importName: \"ParallaxWrapper\",\n  importPath: \"@plasmicpkgs/react-scroll-parallax\",\n  props: {\n    children: {\n      type: \"slot\",\n      defaultValue: {\n        type: \"img\",\n        src: \"https://placekitten.com/300/200\",\n        style: {\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 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 \"@plasmicapp/host/registerComponent\";\nimport registerGlobalContext, {\n  GlobalContextMeta,\n} from \"@plasmicapp/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 * 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 = useController();\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\nexport const parallaxProviderMeta: ComponentMeta<ParallaxProviderProps> = {\n  name: \"hostless-parallax-provider\",\n  displayName: \"Parallax Provider\",\n  importName: \"ParallaxProviderWrapper\",\n  importPath: \"@plasmicpkgs/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\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  name: \"global-parallax-provider\",\n  displayName: \"Parallax Provider\",\n  importName: \"ParallaxProviderWrapper\",\n  importPath: \"@plasmicpkgs/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","speed","disabled","previewInEditor","children","className","inEditor","useContext","PlasmicCanvasContext","hasContext","ParallaxContext","isServer","window","Error","React","Parallax","parallaxWrapperMeta","name","displayName","importName","importPath","props","type","defaultValue","src","style","maxWidth","description","defaultStyles","registerParallaxWrapper","loader","customParallaxWrapperMeta","registerComponent","ParallaxCacheUpdate","parallaxController","useController","ref","useRef","useEffect","current","parentElement","targetNode","observer","ResizeObserver","update","observe","disconnect","display","ParallaxProviderWrapper","ParallaxProvider","parallaxProviderMeta","value","styles","marginBottom","scrollAxis","options","registerParallaxProvider","customParallaxProviderMeta","globalParallaxProviderMeta","registerGlobalParallaxProvider","registerGlobalContext"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plasmicpkgs/react-scroll-parallax",
-  "version": "0.0.20",
+  "version": "0.0.21",
   "description": "Plasmic registration call for the HTML5 video element",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -28,7 +28,7 @@
     "analyze": "size-limit --why"
   },
   "devDependencies": {
-    "@plasmicapp/host": "1.0.15",
+    "@plasmicapp/host": "1.0.16",
     "@size-limit/preset-small-lib": "^4.11.0",
     "@types/node": "^14.0.26",
     "size-limit": "^4.11.0",