@brytdesigns/web-component-parallax 1.2.20 → 3.1.0

package/dist/main/components/index.js

@@ -1,8 +1,3 @@
-import * as index_js$1 from './parallax-container/index.js';
-export { index_js$1 as ParallaxContainer };
-import * as index_js$2 from './parallax-sticky-layer/index.js';
-export { index_js$2 as ParallaxStickyLayer };
-import * as index_js from './parallax-animation/index.js';
-export { index_js as ParallaxAnimation };
-//# sourceMappingURL=index.js.map
-//# sourceMappingURL=index.js.map
+import "./parallax-animation/index.js";
+import "./parallax-container/index.js";
+import "./parallax-sticky-layer/index.js";

package/dist/main/components/parallax-animation/index.js

@@ -1,206 +1,195 @@
-import { transform, motionValue, transformValue, styleEffect, frame } from 'motion';
-import { createMemo, splitProps, mergeProps, createEffect, onCleanup } from 'solid-js';
-import { createStore } from 'solid-js/store';
-import { useParallaxStickyLayer } from '../../hooks/index.js';
-import { getActiveBreakpoints, getLastTruthyIndex } from '../../utils.js';
-
-function keysFromObject(object) {
-  return Object.keys(object);
-}
-const Name = `parallax-animation`;
-const PROPS = {
-  breakpoints: [""],
-  range: [0, 1],
-  y: null,
-  x: null,
-  scale: null,
-  rotate: null,
-  opacity: null,
-  color: null,
-  backgroundColor: null,
-  borderRadius: null
+import { getActiveBreakpoints, getLastTruthyIndex } from "../../utils.js";
+import { useParallaxStickyLayer } from "../../hooks/useParallaxStickyLayer.js";
+import "../../hooks/index.js";
+import { createGuardedEffect } from "@brytdesigns/web-component-core/utils";
+import { shouldReduceMotion } from "@brytdesigns/web-component-core/animation";
+import { frame, motionValue, styleEffect, transform, transformValue } from "motion";
+import { createMemo, createStore, merge, omit } from "solid-js";
+//#region src/components/parallax-animation/index.ts
+var Name = `parallax-animation`;
+var PROPS = {
+	breakpoints: [""],
+	range: [0, 1],
+	y: null,
+	x: null,
+	scale: null,
+	rotate: null,
+	opacity: null,
+	color: null,
+	backgroundColor: null,
+	borderRadius: null
 };
-const PROP_DEFAULTS = {
-  y: "0%",
-  x: "0%",
-  scale: 1,
-  rotate: 0,
-  opacity: null,
-  color: null,
-  backgroundColor: null,
-  borderRadius: null
+var PROP_DEFAULTS = {
+	y: "0%",
+	x: "0%",
+	scale: 1,
+	rotate: 0,
+	opacity: null,
+	color: null,
+	backgroundColor: null,
+	borderRadius: null
 };
-const KEYS = Object.keys(PROPS);
-const isNestedAnimatableArray = (values) => {
-  return Array.isArray(values) && (Array.isArray(values[0]) || values[0] === null);
+var KEYS = Object.keys(PROPS);
+/**
+* Solid 2 defines an element's props as own accessors that are **not
+* enumerable**, so `Object.keys(props)` and `Object.entries(props)` both come
+* back empty — and `merge()` returns a proxy reporting no own keys at all,
+* even to `Reflect.ownKeys`. Reading a property works on both. Nothing throws
+* and nothing warns; the loops simply do not run.
+*
+* So every key list below comes from the declared prop names. Enumerating a
+* props object here silently validated nothing and produced an `activeProps`
+* with no `range`, which threw inside the animation effect and halted the
+* whole reactive system for the page.
+*/
+var CONFIG_KEYS = ["breakpoints", "range"];
+var ANIMATABLE_KEYS = KEYS.filter((key) => !CONFIG_KEYS.includes(key));
+var ACTIVE_KEYS = KEYS.filter((key) => key !== "breakpoints");
+var isNestedAnimatableArray = (values) => {
+	return Array.isArray(values) && (Array.isArray(values[0]) || values[0] === null);
 };
-const flattenAnimatableArray = (value, index = 0) => {
-  if (isNestedAnimatableArray(value)) {
-    return value[index];
-  }
-  return value;
+var flattenAnimatableArray = (value, index = 0) => {
+	if (isNestedAnimatableArray(value)) return value[index];
+	return value;
 };
-const Component = (props, { element }) => {
-  if (Object.keys(props).some(
-    (key) => KEYS.includes(key) && !Array.isArray(Reflect.get(props, key))
-  ))
-    return console.warn(
-      `parallax-animate: At least one of ${KEYS.join(",")} properties is required and must be an array of values!`,
-      element
-    );
-  const messages = Object.entries(props).reduce((messages2, [key, value]) => {
-    if (!KEYS.includes(key)) return messages2;
-    if (value && value.length !== props.range.length) {
-      return messages2.concat(
-        `${key} attribute must have the same length as range attribute!`
-      );
-    }
-    return messages2;
-  }, []);
-  if (messages.length)
-    return console.warn(
-      element,
-      `
-parallax-animate: Please fix the following issues:
-${messages.join("\n")}`
-    );
-  const [progress, { animate }] = useParallaxStickyLayer(element);
-  const [activeBreakpoints, setActiveBreakpoints] = createStore(
-    getActiveBreakpoints(props.breakpoints)
-  );
-  const activeBreakpointIndex = createMemo(
-    () => getLastTruthyIndex(activeBreakpoints)
-  );
-  const [_, importantProps] = splitProps(props, ["breakpoints"]);
-  const animateableProps = mergeProps(importantProps, {});
-  const activeProps = createMemo(() => {
-    const index = activeBreakpointIndex();
-    if (index === -1) {
-      const { breakpoints, ...active2 } = PROPS;
-      return active2;
-    }
-    const keys = keysFromObject(animateableProps);
-    const active = keys.reduce((active2, key) => {
-      const value = animateableProps[key];
-      if (isNestedAnimatableArray(value)) {
-        const flattenedValue = flattenAnimatableArray(value, index);
-        return {
-          ...active2,
-          [key]: flattenedValue
-        };
-      }
-      return {
-        ...active2,
-        [key]: value
-      };
-    }, {});
-    return active;
-  });
-  createEffect(() => {
-    const breakpoints = props.breakpoints;
-    const controller = new AbortController();
-    for (let i = 0; i < breakpoints.length; i++) {
-      const query = breakpoints[i];
-      if (!query) continue;
-      const mediaQuery = window.matchMedia(query);
-      mediaQuery.addEventListener(
-        "change",
-        (e) => setActiveBreakpoints(i, e.matches),
-        { signal: controller.signal }
-      );
-    }
-    return onCleanup(() => {
-      controller.abort();
-    });
-  });
-  element.style.willChange = "transform";
-  if (window.getComputedStyle(element).getPropertyValue("display") === "inline") {
-    element.style.display = "block";
-  }
-  createEffect(() => {
-    const active = activeProps();
-    const { range, ...props2 } = active;
-    const valueSubscribers = [];
-    let disposed = false;
-    const progressValue = Object.keys(PROP_DEFAULTS).reduce(
-      (values, key) => {
-        const fallback = Reflect.get(PROP_DEFAULTS, key);
-        const valueRange = Reflect.get(props2, key);
-        if (valueRange?.length === range.length) {
-          const transform2 = transform(range, valueRange);
-          const value = motionValue(transform2(progress.get()));
-          const unsub2 = progress.on("change", (latest) => {
-            value.set(transform2(latest));
-          });
-          valueSubscribers.push(unsub2);
-          values[key] = value;
-        } else values[key] = fallback;
-        return values;
-      },
-      {}
-    );
-    const animated = Object.keys(progressValue).reduce(
-      (obj, key) => {
-        const v = progressValue[key];
-        Reflect.set(
-          obj,
-          key,
-          motionValue(typeof v === "object" && v !== null ? v.get() : v)
-        );
-        return obj;
-      },
-      {}
-    );
-    const transform$1 = transformValue(
-      () => `translate(${animated.x?.get()}, ${animated.y?.get()}) scale(${animated.scale?.get()}) rotate(${animated.rotate?.get()}deg)`
-    );
-    function animateValues() {
-      if (disposed) return;
-      const sequence = Object.keys(animated).map((key) => {
-        const subject = animated[key];
-        const v = progressValue[key]?.get?.();
-        if (!subject) return null;
-        if (typeof v === "undefined" || v === null) return null;
-        if (typeof v !== "string" && typeof v !== "number") return null;
-        return [animated[key], v, { at: "<" }];
-      }).filter((v) => v !== null);
-      if (sequence.length === 0) return;
-      animate(sequence);
-    }
-    function scheduleAnimation() {
-      frame.update(animateValues);
-    }
-    const unsub = progress.on("change", (_2) => {
-      scheduleAnimation();
-    });
-    const styledValues = Object.keys(animated).filter(
-      (key) => key !== "y" && key !== "x" && key !== "rotate" && key !== "scale"
-    ).reduce((obj, key) => {
-      Reflect.set(obj, key, animated[key]);
-      return obj;
-    }, {});
-    const unstyle = styleEffect(element, {
-      transform: transform$1,
-      ...styledValues
-    });
-    return onCleanup(() => {
-      disposed = true;
-      unstyle();
-      unsub();
-      valueSubscribers.forEach((unsub2) => {
-        unsub2();
-      });
-      Object.values(animated).forEach((value) => {
-        value.destroy();
-      });
-      Object.values(progressValue).forEach((value) => {
-        value?.destroy?.();
-      });
-      transform$1.destroy();
-    });
-  });
+var Component = (props, { element }) => {
+	if (!Array.isArray(props.range) || !ANIMATABLE_KEYS.some((key) => Array.isArray(Reflect.get(props, key)))) return console.warn(`parallax-animation: needs an array \`range\` and at least one of ${ANIMATABLE_KEYS.join(",")} as an array of values!`, element);
+	const messages = ANIMATABLE_KEYS.reduce((messages, key) => {
+		const value = Reflect.get(props, key);
+		if (value && value.length !== props.range.length) return messages.concat(`${key} attribute must have the same length as range attribute!`);
+		return messages;
+	}, []);
+	if (messages.length) return console.warn(element, `\nparallax-animate: Please fix the following issues:\n${messages.join("\n")}`);
+	const [progress, { animate }] = useParallaxStickyLayer(element);
+	const [activeBreakpoints, setActiveBreakpoints] = createStore(getActiveBreakpoints(props.breakpoints));
+	const activeBreakpointIndex = createMemo(() => getLastTruthyIndex(activeBreakpoints));
+	const importantProps = omit(props, "breakpoints");
+	const animateableProps = merge(importantProps, {});
+	const activeProps = createMemo(() => {
+		const index = activeBreakpointIndex();
+		if (index === -1) {
+			const { breakpoints, ...active } = PROPS;
+			return active;
+		}
+		return ACTIVE_KEYS.reduce((active, key) => {
+			const value = animateableProps[key];
+			if (isNestedAnimatableArray(value)) {
+				const flattenedValue = flattenAnimatableArray(value, index);
+				return {
+					...active,
+					[key]: flattenedValue
+				};
+			}
+			return {
+				...active,
+				[key]: value
+			};
+		}, {});
+	});
+	createGuardedEffect(() => props.breakpoints, (breakpoints) => {
+		const controller = new AbortController();
+		for (let i = 0; i < breakpoints.length; i++) {
+			const query = breakpoints[i];
+			if (!query) continue;
+			window.matchMedia(query).addEventListener("change", (e) => setActiveBreakpoints((draft) => {
+				draft[i] = e.matches;
+			}), { signal: controller.signal });
+		}
+		return () => {
+			controller.abort();
+		};
+	});
+	element.style.willChange = "transform";
+	if (window.getComputedStyle(element).getPropertyValue("display") === "inline") element.style.display = "block";
+	createGuardedEffect(activeProps, (active) => {
+		const { range, ...props } = active;
+		/**
+		* WCAG 2.3.3: scroll-driven parallax is motion from interaction, so a
+		* reduced-motion preference has to be able to turn it off.
+		*
+		* The values freeze at the *end* of their range rather than the start.
+		* A fade authored as `opacity="[0,1]"` frozen at the start would hide
+		* the content outright, which is worse than the motion it replaces —
+		* the end is the state the author meant the reader to arrive at.
+		*/
+		const reduceMotion = shouldReduceMotion();
+		const valueSubscribers = [];
+		let disposed = false;
+		const progressValue = Object.keys(PROP_DEFAULTS).reduce((values, key) => {
+			const fallback = Reflect.get(PROP_DEFAULTS, key);
+			const valueRange = Reflect.get(props, key);
+			if (valueRange?.length === range.length) {
+				const transform$1 = transform(range, valueRange);
+				if (reduceMotion) {
+					values[key] = motionValue(transform$1(range[range.length - 1] ?? 1));
+					return values;
+				}
+				const value = motionValue(transform$1(progress.get()));
+				const unsub = progress.on("change", (latest) => {
+					value.set(transform$1(latest));
+				});
+				valueSubscribers.push(unsub);
+				values[key] = value;
+			} else values[key] = fallback;
+			return values;
+		}, {});
+		const animated = Object.keys(progressValue).reduce((obj, key) => {
+			const v = progressValue[key];
+			Reflect.set(obj, key, motionValue(typeof v === "object" && v !== null ? v.get() : v));
+			return obj;
+		}, {});
+		const transform$2 = transformValue(() => `translate(${animated.x?.get()}, ${animated.y?.get()}) scale(${animated.scale?.get()}) rotate(${animated.rotate?.get()}deg)`);
+		function animateValues() {
+			if (disposed) return;
+			const sequence = Object.keys(animated).map((key) => {
+				const subject = animated[key];
+				const v = progressValue[key]?.get?.();
+				if (!subject) return null;
+				if (typeof v === "undefined" || v === null) return null;
+				if (typeof v !== "string" && typeof v !== "number") return null;
+				return [
+					animated[key],
+					v,
+					{ at: "<" }
+				];
+			}).filter((v) => v !== null);
+			if (sequence.length === 0) return;
+			animate(sequence);
+		}
+		function scheduleAnimation() {
+			frame.update(animateValues);
+		}
+		let unsub = () => {};
+		if (reduceMotion) scheduleAnimation();
+		else unsub = progress.on("change", (_) => {
+			scheduleAnimation();
+		});
+		const styledValues = Object.keys(animated).filter((key) => key !== "y" && key !== "x" && key !== "rotate" && key !== "scale").reduce((obj, key) => {
+			Reflect.set(obj, key, animated[key]);
+			return obj;
+		}, {});
+		const unstyle = styleEffect(element, {
+			transform: transform$2,
+			...styledValues
+		});
+		return () => {
+			disposed = true;
+			unstyle();
+			unsub();
+			valueSubscribers.forEach((unsub) => {
+				unsub();
+			});
+			Object.values(animated).forEach((value) => {
+				value.destroy();
+			});
+			Object.values(progressValue).forEach((value) => {
+				value?.destroy?.();
+			});
+			transform$2.destroy();
+		};
+	});
 };
-
+//#endregion
 export { Component, Name, PROPS };
-//# sourceMappingURL=index.js.map
+
 //# sourceMappingURL=index.js.map

package/dist/main/components/parallax-animation/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/parallax-animation/index.ts"],"names":["messages","active","props","transform","mTransform","unsub","_"],"mappings":"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","file":"index.js","sourcesContent":["import type { CorrectComponentType } from \"@brytdesigns/web-component-core/utils\";\nimport {\n\tframe,\n\ttype MotionValue,\n\tmotionValue,\n\ttransform as mTransform,\n\tstyleEffect,\n\ttransformValue,\n} from \"motion\";\nimport {\n\tcreateEffect,\n\tcreateMemo,\n\tmergeProps,\n\tonCleanup,\n\tsplitProps,\n} from \"solid-js\";\nimport { createStore } from \"solid-js/store\";\n\nimport { useParallaxStickyLayer } from \"../../hooks/index.js\";\nimport { getActiveBreakpoints, getLastTruthyIndex } from \"../../utils.js\";\n\ntype AnimatableArray = Array<string | number> | null;\n\nexport type Props = {\n\tbreakpoints: string[];\n\trange: number[] | number[][];\n\ty: AnimatableArray | AnimatableArray[];\n\tx: AnimatableArray | AnimatableArray[];\n\tscale: AnimatableArray | AnimatableArray[];\n\trotate: AnimatableArray | AnimatableArray[];\n\topacity: AnimatableArray | AnimatableArray[];\n\tbackgroundColor: AnimatableArray | AnimatableArray[];\n\tborderRadius: AnimatableArray | AnimatableArray[];\n};\n\ntype ActiveProps = {\n\trange: number[];\n\ty: AnimatableArray;\n\tx: AnimatableArray;\n\tscale: AnimatableArray;\n\trotate: AnimatableArray;\n\topacity: AnimatableArray;\n\tbackgroundColor: AnimatableArray;\n\tborderRadius: AnimatableArray;\n};\n\nfunction keysFromObject<T extends object>(object: T): (keyof T)[] {\n\treturn Object.keys(object) as (keyof T)[];\n}\n\nexport const Name = `parallax-animation`;\n\nexport const PROPS = {\n\tbreakpoints: [\"\"],\n\trange: [0, 1],\n\ty: null,\n\tx: null,\n\tscale: null,\n\trotate: null,\n\topacity: null,\n\tcolor: null,\n\tbackgroundColor: null,\n\tborderRadius: null,\n};\n\nconst PROP_DEFAULTS = {\n\ty: \"0%\",\n\tx: \"0%\",\n\tscale: 1,\n\trotate: 0,\n\topacity: null,\n\tcolor: null,\n\tbackgroundColor: null,\n\tborderRadius: null,\n};\n\nconst KEYS = Object.keys(PROPS);\n\nconst isNestedAnimatableArray = (\n\tvalues: AnimatableArray | AnimatableArray[],\n): values is AnimatableArray[] => {\n\treturn (\n\t\tArray.isArray(values) && (Array.isArray(values[0]) || values[0] === null)\n\t);\n};\n\nconst flattenAnimatableArray = (\n\tvalue: AnimatableArray | AnimatableArray[],\n\tindex: number = 0,\n) => {\n\tif (isNestedAnimatableArray(value)) {\n\t\treturn value[index]!;\n\t}\n\treturn value;\n};\n\nexport const Component: CorrectComponentType<Props> = (props, { element }) => {\n\tif (\n\t\tObject.keys(props).some(\n\t\t\t(key) => KEYS.includes(key) && !Array.isArray(Reflect.get(props, key)),\n\t\t)\n\t)\n\t\treturn console.warn(\n\t\t\t`parallax-animate: At least one of ${KEYS.join(\",\")} properties is required and must be an array of values!`,\n\t\t\telement,\n\t\t);\n\n\tconst messages = Object.entries(props).reduce((messages, [key, value]) => {\n\t\tif (!KEYS.includes(key)) return messages;\n\t\tif (value && value.length !== props.range.length) {\n\t\t\treturn messages.concat(\n\t\t\t\t`${key} attribute must have the same length as range attribute!`,\n\t\t\t);\n\t\t}\n\t\treturn messages;\n\t}, [] as string[]);\n\n\tif (messages.length)\n\t\treturn console.warn(\n\t\t\telement,\n\t\t\t`\\nparallax-animate: Please fix the following issues:\\n${messages.join(\"\\n\")}`,\n\t\t);\n\n\tconst [progress, { animate }] = useParallaxStickyLayer(element);\n\n\tconst [activeBreakpoints, setActiveBreakpoints] = createStore<boolean[]>(\n\t\tgetActiveBreakpoints(props.breakpoints),\n\t);\n\tconst activeBreakpointIndex = createMemo(() =>\n\t\tgetLastTruthyIndex(activeBreakpoints),\n\t);\n\n\tconst [_, importantProps] = splitProps(props, [\"breakpoints\"]);\n\tconst animateableProps = mergeProps(importantProps, {});\n\n\tconst activeProps = createMemo<ActiveProps>(() => {\n\t\tconst index = activeBreakpointIndex();\n\n\t\tif (index === -1) {\n\t\t\tconst { breakpoints, ...active } = PROPS;\n\t\t\treturn active;\n\t\t}\n\n\t\tconst keys = keysFromObject(animateableProps);\n\n\t\tconst active = keys.reduce((active, key) => {\n\t\t\tconst value = animateableProps[key];\n\t\t\tif (isNestedAnimatableArray(value)) {\n\t\t\t\tconst flattenedValue = flattenAnimatableArray(value, index);\n\t\t\t\treturn {\n\t\t\t\t\t...active,\n\t\t\t\t\t[key]: flattenedValue,\n\t\t\t\t};\n\t\t\t}\n\t\t\treturn {\n\t\t\t\t...active,\n\t\t\t\t[key]: value,\n\t\t\t};\n\t\t}, {} as ActiveProps);\n\n\t\treturn active;\n\t});\n\n\tcreateEffect(() => {\n\t\tconst breakpoints = props.breakpoints;\n\t\tconst controller = new AbortController();\n\n\t\tfor (let i = 0; i < breakpoints.length; i++) {\n\t\t\tconst query = breakpoints[i];\n\t\t\tif (!query) continue;\n\t\t\tconst mediaQuery = window.matchMedia(query);\n\t\t\tmediaQuery.addEventListener(\n\t\t\t\t\"change\",\n\t\t\t\t(e) => setActiveBreakpoints(i, e.matches),\n\t\t\t\t{ signal: controller.signal },\n\t\t\t);\n\t\t}\n\n\t\treturn onCleanup(() => {\n\t\t\tcontroller.abort();\n\t\t});\n\t});\n\n\telement.style.willChange = \"transform\";\n\tif (\n\t\twindow.getComputedStyle(element).getPropertyValue(\"display\") === \"inline\"\n\t) {\n\t\telement.style.display = \"block\";\n\t}\n\n\tcreateEffect(() => {\n\t\tconst active = activeProps();\n\t\tconst { range, ...props } = active;\n\t\tconst valueSubscribers: VoidFunction[] = [];\n\t\tlet disposed = false;\n\n\t\tconst progressValue = Object.keys(PROP_DEFAULTS).reduce(\n\t\t\t(values, key) => {\n\t\t\t\tconst fallback = Reflect.get(PROP_DEFAULTS, key);\n\t\t\t\tconst valueRange = Reflect.get(props, key);\n\t\t\t\tif (valueRange?.length === range.length) {\n\t\t\t\t\tconst transform = mTransform(range, valueRange);\n\t\t\t\t\tconst value = motionValue(transform(progress.get()));\n\t\t\t\t\tconst unsub = progress.on(\"change\", (latest) => {\n\t\t\t\t\t\tvalue.set(transform(latest));\n\t\t\t\t\t});\n\t\t\t\t\tvalueSubscribers.push(unsub);\n\t\t\t\t\tvalues[key] = value;\n\t\t\t\t} else values[key] = fallback;\n\t\t\t\treturn values;\n\t\t\t},\n\t\t\t{} as Record<string, any>,\n\t\t);\n\n\t\tconst animated = Object.keys(progressValue).reduce(\n\t\t\t(obj, key) => {\n\t\t\t\tconst v = progressValue[key];\n\t\t\t\tReflect.set(\n\t\t\t\t\tobj,\n\t\t\t\t\tkey,\n\t\t\t\t\tmotionValue(typeof v === \"object\" && v !== null ? v.get() : v),\n\t\t\t\t);\n\t\t\t\treturn obj;\n\t\t\t},\n\t\t\t{} as Record<string, MotionValue>,\n\t\t);\n\n\t\tconst transform = transformValue(\n\t\t\t() =>\n\t\t\t\t`translate(${animated.x?.get()}, ${animated.y?.get()}) scale(${animated.scale?.get()}) rotate(${animated.rotate?.get()}deg)`,\n\t\t);\n\n\t\tfunction animateValues() {\n\t\t\tif (disposed) return;\n\n\t\t\tconst sequence = Object.keys(animated)\n\t\t\t\t.map((key) => {\n\t\t\t\t\tconst subject = animated[key];\n\t\t\t\t\tconst v = progressValue[key]?.get?.();\n\t\t\t\t\tif (!subject) return null;\n\t\t\t\t\tif (typeof v === \"undefined\" || v === null) return null;\n\t\t\t\t\tif (typeof v !== \"string\" && typeof v !== \"number\") return null;\n\t\t\t\t\treturn [animated[key], v, { at: \"<\" }];\n\t\t\t\t})\n\t\t\t\t.filter((v) => v !== null);\n\n\t\t\tif (sequence.length === 0) return;\n\t\t\t//@ts-expect-error\n\t\t\tanimate(sequence);\n\t\t}\n\n\t\tfunction scheduleAnimation() {\n\t\t\tframe.update(animateValues);\n\t\t}\n\n\t\tconst unsub = progress.on(\"change\", (_) => {\n\t\t\tscheduleAnimation();\n\t\t});\n\n\t\tconst styledValues = Object.keys(animated)\n\t\t\t.filter(\n\t\t\t\t(key) =>\n\t\t\t\t\tkey !== \"y\" && key !== \"x\" && key !== \"rotate\" && key !== \"scale\",\n\t\t\t)\n\t\t\t.reduce((obj, key) => {\n\t\t\t\tReflect.set(obj, key, animated[key]);\n\t\t\t\treturn obj;\n\t\t\t}, {});\n\n\t\tconst unstyle = styleEffect(element, {\n\t\t\ttransform,\n\t\t\t...styledValues,\n\t\t});\n\n\t\treturn onCleanup(() => {\n\t\t\tdisposed = true;\n\t\t\tunstyle();\n\t\t\tunsub();\n\t\t\tvalueSubscribers.forEach((unsub) => {\n\t\t\t\tunsub();\n\t\t\t});\n\t\t\tObject.values(animated).forEach((value) => {\n\t\t\t\tvalue.destroy();\n\t\t\t});\n\t\t\tObject.values(progressValue).forEach((value) => {\n\t\t\t\tvalue?.destroy?.();\n\t\t\t});\n\t\t\ttransform.destroy();\n\t\t});\n\t});\n};\n"]}
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/parallax-animation/index.ts"],"sourcesContent":["import { shouldReduceMotion } from \"@brytdesigns/web-component-core/animation\";\nimport type { CorrectComponentType } from \"@brytdesigns/web-component-core/utils\";\nimport { createGuardedEffect } from \"@brytdesigns/web-component-core/utils\";\nimport {\n\tframe,\n\ttype MotionValue,\n\tmotionValue,\n\ttransform as mTransform,\n\tstyleEffect,\n\ttransformValue,\n} from \"motion\";\nimport { createMemo, createStore, merge, omit } from \"solid-js\";\n\nimport { useParallaxStickyLayer } from \"../../hooks/index.js\";\nimport { getActiveBreakpoints, getLastTruthyIndex } from \"../../utils.js\";\n\ntype AnimatableArray = Array<string | number> | null;\n\nexport type Props = {\n\tbreakpoints: string[];\n\trange: number[] | number[][];\n\ty: AnimatableArray | AnimatableArray[];\n\tx: AnimatableArray | AnimatableArray[];\n\tscale: AnimatableArray | AnimatableArray[];\n\trotate: AnimatableArray | AnimatableArray[];\n\topacity: AnimatableArray | AnimatableArray[];\n\tbackgroundColor: AnimatableArray | AnimatableArray[];\n\tborderRadius: AnimatableArray | AnimatableArray[];\n};\n\ntype ActiveProps = {\n\trange: number[];\n\ty: AnimatableArray;\n\tx: AnimatableArray;\n\tscale: AnimatableArray;\n\trotate: AnimatableArray;\n\topacity: AnimatableArray;\n\tbackgroundColor: AnimatableArray;\n\tborderRadius: AnimatableArray;\n};\n\nexport const Name = `parallax-animation`;\n\nexport const PROPS = {\n\tbreakpoints: [\"\"],\n\trange: [0, 1],\n\ty: null,\n\tx: null,\n\tscale: null,\n\trotate: null,\n\topacity: null,\n\tcolor: null,\n\tbackgroundColor: null,\n\tborderRadius: null,\n};\n\nconst PROP_DEFAULTS = {\n\ty: \"0%\",\n\tx: \"0%\",\n\tscale: 1,\n\trotate: 0,\n\topacity: null,\n\tcolor: null,\n\tbackgroundColor: null,\n\tborderRadius: null,\n};\n\nconst KEYS = Object.keys(PROPS);\n\n/**\n * Solid 2 defines an element's props as own accessors that are **not\n * enumerable**, so `Object.keys(props)` and `Object.entries(props)` both come\n * back empty — and `merge()` returns a proxy reporting no own keys at all,\n * even to `Reflect.ownKeys`. Reading a property works on both. Nothing throws\n * and nothing warns; the loops simply do not run.\n *\n * So every key list below comes from the declared prop names. Enumerating a\n * props object here silently validated nothing and produced an `activeProps`\n * with no `range`, which threw inside the animation effect and halted the\n * whole reactive system for the page.\n */\nconst CONFIG_KEYS: readonly string[] = [\"breakpoints\", \"range\"];\nconst ANIMATABLE_KEYS = KEYS.filter((key) => !CONFIG_KEYS.includes(key));\nconst ACTIVE_KEYS = KEYS.filter((key) => key !== \"breakpoints\");\n\nconst isNestedAnimatableArray = (\n\tvalues: AnimatableArray | AnimatableArray[],\n): values is AnimatableArray[] => {\n\treturn (\n\t\tArray.isArray(values) && (Array.isArray(values[0]) || values[0] === null)\n\t);\n};\n\nconst flattenAnimatableArray = (\n\tvalue: AnimatableArray | AnimatableArray[],\n\tindex: number = 0,\n) => {\n\tif (isNestedAnimatableArray(value)) {\n\t\treturn value[index]!;\n\t}\n\treturn value;\n};\n\nexport const Component: CorrectComponentType<Props> = (props, { element }) => {\n\tif (\n\t\t!Array.isArray(props.range) ||\n\t\t!ANIMATABLE_KEYS.some((key) => Array.isArray(Reflect.get(props, key)))\n\t)\n\t\treturn console.warn(\n\t\t\t`parallax-animation: needs an array ${\"`range`\"} and at least one of ${ANIMATABLE_KEYS.join(\",\")} as an array of values!`,\n\t\t\telement,\n\t\t);\n\n\tconst messages = ANIMATABLE_KEYS.reduce((messages, key) => {\n\t\tconst value = Reflect.get(props, key) as\n\t\t\t| AnimatableArray\n\t\t\t| AnimatableArray[]\n\t\t\t| undefined;\n\t\tif (value && value.length !== props.range.length) {\n\t\t\treturn messages.concat(\n\t\t\t\t`${key} attribute must have the same length as range attribute!`,\n\t\t\t);\n\t\t}\n\t\treturn messages;\n\t}, [] as string[]);\n\n\tif (messages.length)\n\t\treturn console.warn(\n\t\t\telement,\n\t\t\t`\\nparallax-animate: Please fix the following issues:\\n${messages.join(\"\\n\")}`,\n\t\t);\n\n\tconst [progress, { animate }] = useParallaxStickyLayer(element);\n\n\tconst [activeBreakpoints, setActiveBreakpoints] = createStore<boolean[]>(\n\t\tgetActiveBreakpoints(props.breakpoints),\n\t);\n\tconst activeBreakpointIndex = createMemo(() =>\n\t\tgetLastTruthyIndex(activeBreakpoints),\n\t);\n\n\t// `omit` returns the rest, which is exactly what this discarded the\n\t// picked half to get.\n\tconst importantProps = omit(props, \"breakpoints\");\n\tconst animateableProps = merge(importantProps, {});\n\n\tconst activeProps = createMemo<ActiveProps>(() => {\n\t\tconst index = activeBreakpointIndex();\n\n\t\tif (index === -1) {\n\t\t\tconst { breakpoints, ...active } = PROPS;\n\t\t\treturn active;\n\t\t}\n\n\t\tconst keys = ACTIVE_KEYS as (keyof ActiveProps)[];\n\n\t\tconst active = keys.reduce((active, key) => {\n\t\t\tconst value = animateableProps[key];\n\t\t\tif (isNestedAnimatableArray(value)) {\n\t\t\t\tconst flattenedValue = flattenAnimatableArray(value, index);\n\t\t\t\treturn {\n\t\t\t\t\t...active,\n\t\t\t\t\t[key]: flattenedValue,\n\t\t\t\t};\n\t\t\t}\n\t\t\treturn {\n\t\t\t\t...active,\n\t\t\t\t[key]: value,\n\t\t\t};\n\t\t}, {} as ActiveProps);\n\n\t\treturn active;\n\t});\n\n\tcreateGuardedEffect(\n\t\t() => props.breakpoints,\n\t\t(breakpoints) => {\n\t\t\tconst controller = new AbortController();\n\n\t\t\tfor (let i = 0; i < breakpoints.length; i++) {\n\t\t\t\tconst query = breakpoints[i];\n\t\t\t\tif (!query) continue;\n\t\t\t\tconst mediaQuery = window.matchMedia(query);\n\t\t\t\tmediaQuery.addEventListener(\n\t\t\t\t\t\"change\",\n\t\t\t\t\t// v2 store setters are draft-first: no path arguments.\n\t\t\t\t\t(e) =>\n\t\t\t\t\t\tsetActiveBreakpoints((draft) => {\n\t\t\t\t\t\t\tdraft[i] = e.matches;\n\t\t\t\t\t\t}),\n\t\t\t\t\t{ signal: controller.signal },\n\t\t\t\t);\n\t\t\t}\n\n\t\t\treturn () => {\n\t\t\t\tcontroller.abort();\n\t\t\t};\n\t\t},\n\t);\n\n\telement.style.willChange = \"transform\";\n\tif (\n\t\twindow.getComputedStyle(element).getPropertyValue(\"display\") === \"inline\"\n\t) {\n\t\telement.style.display = \"block\";\n\t}\n\n\tcreateGuardedEffect(activeProps, (active) => {\n\t\tconst { range, ...props } = active;\n\n\t\t/**\n\t\t * WCAG 2.3.3: scroll-driven parallax is motion from interaction, so a\n\t\t * reduced-motion preference has to be able to turn it off.\n\t\t *\n\t\t * The values freeze at the *end* of their range rather than the start.\n\t\t * A fade authored as `opacity=\"[0,1]\"` frozen at the start would hide\n\t\t * the content outright, which is worse than the motion it replaces —\n\t\t * the end is the state the author meant the reader to arrive at.\n\t\t */\n\t\tconst reduceMotion = shouldReduceMotion();\n\t\tconst valueSubscribers: VoidFunction[] = [];\n\t\tlet disposed = false;\n\n\t\tconst progressValue = Object.keys(PROP_DEFAULTS).reduce(\n\t\t\t(values, key) => {\n\t\t\t\tconst fallback = Reflect.get(PROP_DEFAULTS, key);\n\t\t\t\tconst valueRange = Reflect.get(props, key);\n\t\t\t\tif (valueRange?.length === range.length) {\n\t\t\t\t\tconst transform = mTransform(range, valueRange);\n\t\t\t\t\tif (reduceMotion) {\n\t\t\t\t\t\tvalues[key] = motionValue(transform(range[range.length - 1] ?? 1));\n\t\t\t\t\t\treturn values;\n\t\t\t\t\t}\n\t\t\t\t\tconst value = motionValue(transform(progress.get()));\n\t\t\t\t\tconst unsub = progress.on(\"change\", (latest) => {\n\t\t\t\t\t\tvalue.set(transform(latest));\n\t\t\t\t\t});\n\t\t\t\t\tvalueSubscribers.push(unsub);\n\t\t\t\t\tvalues[key] = value;\n\t\t\t\t} else values[key] = fallback;\n\t\t\t\treturn values;\n\t\t\t},\n\t\t\t{} as Record<string, any>,\n\t\t);\n\n\t\tconst animated = Object.keys(progressValue).reduce(\n\t\t\t(obj, key) => {\n\t\t\t\tconst v = progressValue[key];\n\t\t\t\tReflect.set(\n\t\t\t\t\tobj,\n\t\t\t\t\tkey,\n\t\t\t\t\tmotionValue(typeof v === \"object\" && v !== null ? v.get() : v),\n\t\t\t\t);\n\t\t\t\treturn obj;\n\t\t\t},\n\t\t\t{} as Record<string, MotionValue>,\n\t\t);\n\n\t\tconst transform = transformValue(\n\t\t\t() =>\n\t\t\t\t`translate(${animated.x?.get()}, ${animated.y?.get()}) scale(${animated.scale?.get()}) rotate(${animated.rotate?.get()}deg)`,\n\t\t);\n\n\t\tfunction animateValues() {\n\t\t\tif (disposed) return;\n\n\t\t\tconst sequence = Object.keys(animated)\n\t\t\t\t.map((key) => {\n\t\t\t\t\tconst subject = animated[key];\n\t\t\t\t\tconst v = progressValue[key]?.get?.();\n\t\t\t\t\tif (!subject) return null;\n\t\t\t\t\tif (typeof v === \"undefined\" || v === null) return null;\n\t\t\t\t\tif (typeof v !== \"string\" && typeof v !== \"number\") return null;\n\t\t\t\t\treturn [animated[key], v, { at: \"<\" }];\n\t\t\t\t})\n\t\t\t\t.filter((v) => v !== null);\n\n\t\t\tif (sequence.length === 0) return;\n\t\t\t//@ts-expect-error\n\t\t\tanimate(sequence);\n\t\t}\n\n\t\tfunction scheduleAnimation() {\n\t\t\tframe.update(animateValues);\n\t\t}\n\n\t\tlet unsub: VoidFunction = () => {};\n\t\tif (reduceMotion) {\n\t\t\t// Applied once, then nothing tracks the scroll at all.\n\t\t\tscheduleAnimation();\n\t\t} else {\n\t\t\tunsub = progress.on(\"change\", (_) => {\n\t\t\t\tscheduleAnimation();\n\t\t\t});\n\t\t}\n\n\t\tconst styledValues = Object.keys(animated)\n\t\t\t.filter(\n\t\t\t\t(key) =>\n\t\t\t\t\tkey !== \"y\" && key !== \"x\" && key !== \"rotate\" && key !== \"scale\",\n\t\t\t)\n\t\t\t.reduce((obj, key) => {\n\t\t\t\tReflect.set(obj, key, animated[key]);\n\t\t\t\treturn obj;\n\t\t\t}, {});\n\n\t\tconst unstyle = styleEffect(element, {\n\t\t\ttransform,\n\t\t\t...styledValues,\n\t\t});\n\n\t\treturn () => {\n\t\t\tdisposed = true;\n\t\t\tunstyle();\n\t\t\tunsub();\n\t\t\tvalueSubscribers.forEach((unsub) => {\n\t\t\t\tunsub();\n\t\t\t});\n\t\t\tObject.values(animated).forEach((value) => {\n\t\t\t\tvalue.destroy();\n\t\t\t});\n\t\t\tObject.values(progressValue).forEach((value) => {\n\t\t\t\tvalue?.destroy?.();\n\t\t\t});\n\t\t\ttransform.destroy();\n\t\t};\n\t});\n};\n"],"mappings":"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"}

package/dist/main/components/parallax-container/index.js

@@ -1,20 +1,14 @@
-import { provideParallaxContext } from '../../hooks/index.js';
-
-const Name = `parallax-container`;
-const Component = (props, { element }) => {
-  if (!props.maxPages)
-    return console.warn(
-      `${Name}: requires max-pages attribute to be set!`,
-      element
-    );
-  if (props.maxPages < 1)
-    return console.warn(
-      `${Name}: max-pages must be greater than or equal to 1!`,
-      element
-    );
-  provideParallaxContext(props, element);
+import { provideParallaxContext } from "../../hooks/useParallax.js";
+import "../../hooks/index.js";
+import { untrack } from "solid-js";
+//#region src/components/parallax-container/index.ts
+var Name = `parallax-container`;
+var Component = (props, { element }) => {
+	if (untrack(() => !props.maxPages)) return console.warn(`${Name}: requires max-pages attribute to be set!`, element);
+	if (props.maxPages < 1) return console.warn(`${Name}: max-pages must be greater than or equal to 1!`, element);
+	provideParallaxContext(props, element);
 };
-
+//#endregion
 export { Component, Name };
-//# sourceMappingURL=index.js.map
+
 //# sourceMappingURL=index.js.map

package/dist/main/components/parallax-container/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/parallax-container/index.ts"],"names":[],"mappings":";;AAOO,MAAM,IAAO,GAAA,CAAA,kBAAA;AAEb,MAAM,SAAyC,GAAA,CAAC,KAAO,EAAA,EAAE,SAAc,KAAA;AAC5E,EAAA,IAAI,CAAC,KAAM,CAAA,QAAA;AACT,IAAA,OAAO,OAAQ,CAAA,IAAA;AAAA,MACb,GAAG,IAAI,CAAA,yCAAA,CAAA;AAAA,MACP;AAAA,KACF;AACF,EAAA,IAAI,MAAM,QAAW,GAAA,CAAA;AACnB,IAAA,OAAO,OAAQ,CAAA,IAAA;AAAA,MACb,GAAG,IAAI,CAAA,+CAAA,CAAA;AAAA,MACP;AAAA,KACF;AACF,EAAA,sBAAA,CAAuB,OAAO,OAAO,CAAA;AACvC","file":"index.js","sourcesContent":["import type { CorrectComponentType } from \"@brytdesigns/web-component-core/utils\";\nimport { provideParallaxContext } from \"../../hooks/index.js\";\n\nexport type Props = {\n  maxPages: number;\n};\n\nexport const Name = `parallax-container`;\n\nexport const Component: CorrectComponentType<Props> = (props, { element }) => {\n  if (!props.maxPages)\n    return console.warn(\n      `${Name}: requires max-pages attribute to be set!`,\n      element,\n    );\n  if (props.maxPages < 1)\n    return console.warn(\n      `${Name}: max-pages must be greater than or equal to 1!`,\n      element,\n    );\n  provideParallaxContext(props, element);\n};\n"]}
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/parallax-container/index.ts"],"sourcesContent":["import type { CorrectComponentType } from \"@brytdesigns/web-component-core/utils\";\nimport { untrack } from \"solid-js\";\nimport { provideParallaxContext } from \"../../hooks/index.js\";\n\nexport type Props = {\n\tmaxPages: number;\n};\n\nexport const Name = `parallax-container`;\n\nexport const Component: CorrectComponentType<Props> = (props, { element }) => {\n\tif (untrack(() => !props.maxPages))\n\t\treturn console.warn(\n\t\t\t`${Name}: requires max-pages attribute to be set!`,\n\t\t\telement,\n\t\t);\n\tif (props.maxPages < 1)\n\t\treturn console.warn(\n\t\t\t`${Name}: max-pages must be greater than or equal to 1!`,\n\t\t\telement,\n\t\t);\n\tprovideParallaxContext(props, element);\n};\n"],"mappings":";;;;AAQA,IAAa,OAAO;AAEpB,IAAa,aAA0C,OAAO,EAAE,cAAc;CAC7E,IAAI,cAAc,CAAC,MAAM,QAAQ,GAChC,OAAO,QAAQ,KACd,GAAG,KAAK,4CACR,OACD;CACD,IAAI,MAAM,WAAW,GACpB,OAAO,QAAQ,KACd,GAAG,KAAK,kDACR,OACD;CACD,uBAAuB,OAAO,OAAO;AACtC"}

package/dist/main/components/parallax-sticky-layer/index.js

@@ -1,27 +1,16 @@
-import { provideParallaxStickyLayerContext } from '../../hooks/index.js';
-
-const Name = `parallax-sticky-layer`;
-const Component = (props, { element }) => {
-  if (!props.start)
-    return console.warn(
-      `${Name}: requires start attribute to be set!`,
-      element
-    );
-  if (!props.end)
-    return console.warn(`${Name}: requires end attribute to be set!`, element);
-  if (props.end <= props.start)
-    return console.warn(
-      `${Name}: the start attribute must be less than the end attribute!`,
-      element
-    );
-  if (props.start < 1 || props.end < 1)
-    return console.warn(
-      `${Name}: The start and end attributes must be greater than or equal to 1!`,
-      element
-    );
-  provideParallaxStickyLayerContext(props, element);
+import { provideParallaxStickyLayerContext } from "../../hooks/useParallaxStickyLayer.js";
+import "../../hooks/index.js";
+import { untrack } from "solid-js";
+//#region src/components/parallax-sticky-layer/index.ts
+var Name = `parallax-sticky-layer`;
+var Component = (props, { element }) => {
+	if (untrack(() => !props.start)) return console.warn(`${Name}: requires start attribute to be set!`, element);
+	if (untrack(() => !props.end)) return console.warn(`${Name}: requires end attribute to be set!`, element);
+	if (props.end <= props.start) return console.warn(`${Name}: the start attribute must be less than the end attribute!`, element);
+	if (props.start < 1 || props.end < 1) return console.warn(`${Name}: The start and end attributes must be greater than or equal to 1!`, element);
+	provideParallaxStickyLayerContext(props, element);
 };
-
+//#endregion
 export { Component, Name };
-//# sourceMappingURL=index.js.map
+
 //# sourceMappingURL=index.js.map

package/dist/main/components/parallax-sticky-layer/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/parallax-sticky-layer/index.ts"],"names":[],"mappings":";;AAQO,MAAM,IAAO,GAAA,CAAA,qBAAA;AAEb,MAAM,SAAyC,GAAA,CAAC,KAAO,EAAA,EAAE,SAAc,KAAA;AAC5E,EAAA,IAAI,CAAC,KAAM,CAAA,KAAA;AACT,IAAA,OAAO,OAAQ,CAAA,IAAA;AAAA,MACb,GAAG,IAAI,CAAA,qCAAA,CAAA;AAAA,MACP;AAAA,KACF;AACF,EAAA,IAAI,CAAC,KAAM,CAAA,GAAA;AACT,IAAA,OAAO,OAAQ,CAAA,IAAA,CAAK,CAAG,EAAA,IAAI,uCAAuC,OAAO,CAAA;AAC3E,EAAI,IAAA,KAAA,CAAM,OAAO,KAAM,CAAA,KAAA;AACrB,IAAA,OAAO,OAAQ,CAAA,IAAA;AAAA,MACb,GAAG,IAAI,CAAA,0DAAA,CAAA;AAAA,MACP;AAAA,KACF;AACF,EAAA,IAAI,KAAM,CAAA,KAAA,GAAQ,CAAK,IAAA,KAAA,CAAM,GAAM,GAAA,CAAA;AACjC,IAAA,OAAO,OAAQ,CAAA,IAAA;AAAA,MACb,GAAG,IAAI,CAAA,kEAAA,CAAA;AAAA,MACP;AAAA,KACF;AACF,EAAA,iCAAA,CAAkC,OAAO,OAAO,CAAA;AAClD","file":"index.js","sourcesContent":["import type { CorrectComponentType } from \"@brytdesigns/web-component-core/utils\";\nimport { provideParallaxStickyLayerContext } from \"../../hooks/index.js\";\n\nexport type Props = {\n  start: number;\n  end: number;\n};\n\nexport const Name = `parallax-sticky-layer`;\n\nexport const Component: CorrectComponentType<Props> = (props, { element }) => {\n  if (!props.start)\n    return console.warn(\n      `${Name}: requires start attribute to be set!`,\n      element,\n    );\n  if (!props.end)\n    return console.warn(`${Name}: requires end attribute to be set!`, element);\n  if (props.end <= props.start)\n    return console.warn(\n      `${Name}: the start attribute must be less than the end attribute!`,\n      element,\n    );\n  if (props.start < 1 || props.end < 1)\n    return console.warn(\n      `${Name}: The start and end attributes must be greater than or equal to 1!`,\n      element,\n    );\n  provideParallaxStickyLayerContext(props, element);\n};\n"]}
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/parallax-sticky-layer/index.ts"],"sourcesContent":["import type { CorrectComponentType } from \"@brytdesigns/web-component-core/utils\";\nimport { untrack } from \"solid-js\";\nimport { provideParallaxStickyLayerContext } from \"../../hooks/index.js\";\n\nexport type Props = {\n\tstart: number;\n\tend: number;\n};\n\nexport const Name = `parallax-sticky-layer`;\n\nexport const Component: CorrectComponentType<Props> = (props, { element }) => {\n\tif (untrack(() => !props.start))\n\t\treturn console.warn(\n\t\t\t`${Name}: requires start attribute to be set!`,\n\t\t\telement,\n\t\t);\n\tif (untrack(() => !props.end))\n\t\treturn console.warn(`${Name}: requires end attribute to be set!`, element);\n\tif (props.end <= props.start)\n\t\treturn console.warn(\n\t\t\t`${Name}: the start attribute must be less than the end attribute!`,\n\t\t\telement,\n\t\t);\n\tif (props.start < 1 || props.end < 1)\n\t\treturn console.warn(\n\t\t\t`${Name}: The start and end attributes must be greater than or equal to 1!`,\n\t\t\telement,\n\t\t);\n\tprovideParallaxStickyLayerContext(props, element);\n};\n"],"mappings":";;;;AASA,IAAa,OAAO;AAEpB,IAAa,aAA0C,OAAO,EAAE,cAAc;CAC7E,IAAI,cAAc,CAAC,MAAM,KAAK,GAC7B,OAAO,QAAQ,KACd,GAAG,KAAK,wCACR,OACD;CACD,IAAI,cAAc,CAAC,MAAM,GAAG,GAC3B,OAAO,QAAQ,KAAK,GAAG,KAAK,sCAAsC,OAAO;CAC1E,IAAI,MAAM,OAAO,MAAM,OACtB,OAAO,QAAQ,KACd,GAAG,KAAK,6DACR,OACD;CACD,IAAI,MAAM,QAAQ,KAAK,MAAM,MAAM,GAClC,OAAO,QAAQ,KACd,GAAG,KAAK,qEACR,OACD;CACD,kCAAkC,OAAO,OAAO;AACjD"}

package/dist/main/hooks/index.js

@@ -1,4 +1,3 @@
-export * from './useParallax.js';
-export * from './useParallaxStickyLayer.js';
-//# sourceMappingURL=index.js.map
-//# sourceMappingURL=index.js.map
+import { getParallaxContext, provideParallaxContext, useParallax, useParallaxAt, useParallaxContext } from "./useParallax.js";
+import { getParallaxStickyLayerContext, provideParallaxStickyLayerContext, useParallaxStickyLayer, useParallaxStickyLayerAt, useParallaxStickyLayerContext } from "./useParallaxStickyLayer.js";
+export { getParallaxContext, getParallaxStickyLayerContext, provideParallaxContext, provideParallaxStickyLayerContext, useParallax, useParallaxAt, useParallaxContext, useParallaxStickyLayer, useParallaxStickyLayerAt, useParallaxStickyLayerContext };