@neveranyart/weaver 1.0.15 → 1.0.16
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/hooks.js +9 -9
- package/dist/hooks.js.map +1 -1
- package/dist/hooks.mjs +9 -9
- package/dist/hooks.mjs.map +1 -1
- package/dist/scene.js +2 -2
- package/dist/scene.js.map +1 -1
- package/dist/scene.mjs +2 -2
- package/dist/scene.mjs.map +1 -1
- package/package.json +1 -1
package/dist/hooks.js
CHANGED
|
@@ -43,8 +43,8 @@ var import_react = require("react");
|
|
|
43
43
|
function useScreenCallback(callback, options) {
|
|
44
44
|
(0, import_react.useLayoutEffect)(() => {
|
|
45
45
|
const reportScreen = () => callback({
|
|
46
|
-
width:
|
|
47
|
-
height:
|
|
46
|
+
width: window.innerWidth,
|
|
47
|
+
height: window.innerHeight
|
|
48
48
|
});
|
|
49
49
|
if (options?.initialCall) {
|
|
50
50
|
reportScreen();
|
|
@@ -76,7 +76,7 @@ function useBreakpoints(breakpoints) {
|
|
|
76
76
|
[breakpoints]
|
|
77
77
|
);
|
|
78
78
|
const [breakAt, setBreakAt] = (0, import_react2.useState)(
|
|
79
|
-
getBreakpoint(
|
|
79
|
+
getBreakpoint(window.innerWidth)
|
|
80
80
|
);
|
|
81
81
|
const breakpointCheck = (0, import_react2.useCallback)(
|
|
82
82
|
(latest) => {
|
|
@@ -257,8 +257,8 @@ var MouseEventDistributor = class {
|
|
|
257
257
|
y: event.clientY
|
|
258
258
|
};
|
|
259
259
|
const mouseNormalized = {
|
|
260
|
-
x: mouse.x / (
|
|
261
|
-
y: mouse.y / (
|
|
260
|
+
x: mouse.x / (window.innerWidth / 2) - 1,
|
|
261
|
+
y: mouse.y / (window.innerHeight / 2) - 1
|
|
262
262
|
};
|
|
263
263
|
return [mouse, mouseNormalized];
|
|
264
264
|
}
|
|
@@ -348,11 +348,11 @@ function useRouteNormalizer(options) {
|
|
|
348
348
|
// src/hooks/screen.ts
|
|
349
349
|
var import_react9 = require("react");
|
|
350
350
|
function useScreen() {
|
|
351
|
-
const [width, setWidth] = (0, import_react9.useState)(
|
|
352
|
-
const [height, setHeight] = (0, import_react9.useState)(
|
|
351
|
+
const [width, setWidth] = (0, import_react9.useState)(window.innerWidth);
|
|
352
|
+
const [height, setHeight] = (0, import_react9.useState)(window.innerHeight);
|
|
353
353
|
const setScreen = (0, import_react9.useCallback)(() => {
|
|
354
|
-
setWidth(
|
|
355
|
-
setHeight(
|
|
354
|
+
setWidth(window.innerWidth);
|
|
355
|
+
setHeight(window.innerHeight);
|
|
356
356
|
}, []);
|
|
357
357
|
(0, import_react9.useLayoutEffect)(() => {
|
|
358
358
|
window.addEventListener("resize", setScreen, { passive: true });
|
package/dist/hooks.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/hooks/index.ts","../src/hooks/breakpoints.ts","../src/hooks/screenCallback.ts","../src/hooks/effectOnce.ts","../src/hooks/lenisCallback.ts","../src/setup.ts","../src/hooks/orbit.ts","../src/hooks/mouseCallback.ts","../src/hooks/navigateAnchor.ts","../src/hooks/rawParams.ts","../src/hooks/routeNormalizer.ts","../src/hooks/screen.ts","../src/hooks/viewport.ts"],"sourcesContent":["import { useBreakpoints } from './breakpoints';\nimport { useEffectOnce, useLayoutEffectOnce } from './effectOnce';\nimport { useLenisCallback } from './lenisCallback';\nimport { useMouseCallback } from './mouseCallback';\nimport { useNavigateAnchor } from './navigateAnchor';\nimport { useOrbit } from './orbit';\nimport { useRawParams } from './rawParams';\nimport { useRouteNormalizer } from './routeNormalizer';\nimport { useScreen } from './screen';\nimport { useScreenCallback } from './screenCallback';\nimport { useViewport } from './viewport';\n\nexport {\n useBreakpoints,\n useEffectOnce,\n useLayoutEffectOnce,\n useLenisCallback,\n useMouseCallback,\n useNavigateAnchor,\n useOrbit,\n useRawParams,\n useRouteNormalizer,\n useScreen,\n useScreenCallback,\n useViewport,\n};\n","import { useCallback, useState } from 'react';\nimport { useScreenCallback } from './screenCallback';\n\nexport function useBreakpoints(breakpoints?: number[] | null) {\n const getBreakpoint = useCallback(\n (width: number) => {\n const processingBreakpoints = !breakpoints\n ? [640, 768, 1024, 1280, 1536]\n : breakpoints;\n\n if (!processingBreakpoints) {\n throw Error(\"Uhhh... so you don't want a breakpoint? Just say it.\");\n }\n\n let result = processingBreakpoints!.length;\n for (let index = 0; index < processingBreakpoints!.length; index++) {\n if (width < processingBreakpoints![index]) {\n result = index;\n break;\n }\n }\n\n return result;\n },\n [breakpoints]\n );\n\n const [breakAt, setBreakAt] = useState<number>(\n getBreakpoint(document.body.clientWidth)\n );\n\n const breakpointCheck = useCallback(\n (latest: { width: number; height: number }) => {\n const result = getBreakpoint(latest.width);\n if (result !== breakAt) {\n setBreakAt(result);\n }\n },\n [breakAt, getBreakpoint]\n );\n useScreenCallback(breakpointCheck);\n\n return breakAt;\n}\n","import { useLayoutEffect } from 'react';\n\nexport interface ScreenCallbackValues {\n width: number;\n height: number;\n}\n\ntype Callback = (props: ScreenCallbackValues) => void;\n\nexport function useScreenCallback(\n callback: Callback,\n options?: { initialCall?: boolean }\n) {\n useLayoutEffect(() => {\n const reportScreen = () =>\n callback({\n width: document.body.clientWidth,\n height: document.documentElement.clientHeight,\n });\n\n // Call it first time when the hook was initialized.\n if (options?.initialCall) {\n reportScreen();\n }\n\n window.addEventListener('resize', reportScreen, { passive: true });\n\n return () => {\n window.removeEventListener('resize', reportScreen);\n };\n }, [callback, options?.initialCall]);\n}\n","import { useEffect, useLayoutEffect } from 'react';\n\nexport function useEffectOnce(callback: React.EffectCallback) {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n useEffect(callback, []);\n}\n\nexport function useLayoutEffectOnce(callback: React.EffectCallback) {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n useLayoutEffect(callback, []);\n}\n","import { type RefObject, useCallback, useLayoutEffect, useMemo } from 'react';\nimport { weaverSetup } from '../setup';\nimport { useOrbit } from './orbit';\n\ninterface HookOptions {\n /**\n * Hook will report when first initialized without waiting for scroll event to actually happens.\n */\n initialCall?: boolean;\n /**\n * Set an element to only call when the element is actually entering the viewport (with 25% `rootMargin`).\n */\n intersectOn?: RefObject<HTMLOrSVGElement | null>;\n}\n\nexport const scrollCallbackReason = {\n Resize: 'resize',\n Scroll: 'scroll',\n Initialize: 'initialize',\n} as const;\nexport type ScrollCallbackReason =\n (typeof scrollCallbackReason)[keyof typeof scrollCallbackReason];\n\ntype Callback = (latest: number, reason: ScrollCallbackReason) => void;\n\nexport function useLenisCallback(callback: Callback, options?: HookOptions) {\n if (!weaverSetup._lenisInstance) {\n throw Error(\n \"useLenisCallback won't work without a lenis instance. Provide one via weaverSetup.setLenisInstance\"\n );\n }\n\n const callbackWrapScroll = useCallback(\n () =>\n callback(\n weaverSetup._lenisInstance!.actualScroll,\n scrollCallbackReason.Scroll\n ),\n [callback]\n );\n const callbackWrapResize = useCallback(\n () =>\n callback(\n weaverSetup._lenisInstance!.actualScroll,\n scrollCallbackReason.Resize\n ),\n [callback]\n );\n\n const intersectOn = useMemo(\n () => options?.intersectOn,\n [options?.intersectOn]\n );\n const initialCall = useMemo(\n () => options?.initialCall,\n [options?.initialCall]\n );\n\n useOrbit({\n target: intersectOn as RefObject<HTMLElement | null> | undefined,\n events: {\n onIntersect(entry) {\n if (entry.isIntersecting) {\n weaverSetup._lenisInstance!.on('scroll', callbackWrapScroll);\n window.addEventListener('resize', callbackWrapResize);\n } else {\n weaverSetup._lenisInstance!.off('scroll', callbackWrapScroll);\n window.removeEventListener('resize', callbackWrapResize);\n }\n },\n },\n rootMargin: '50% 0px 50% 0px',\n });\n\n useLayoutEffect(() => {\n if (!intersectOn) {\n weaverSetup._lenisInstance!.on('scroll', callbackWrapScroll);\n window.addEventListener('resize', callbackWrapResize);\n }\n\n if (initialCall) {\n callback(\n weaverSetup._lenisInstance!.actualScroll,\n scrollCallbackReason.Initialize\n );\n }\n\n return () => {\n weaverSetup._lenisInstance!.off('scroll', callbackWrapScroll);\n window.removeEventListener('resize', callbackWrapResize);\n };\n }, [\n callback,\n callbackWrapResize,\n callbackWrapScroll,\n initialCall,\n intersectOn,\n ]);\n}\n","import Lenis from 'lenis';\nimport { ReactNode } from 'react';\n\nexport type BasicTunnelIn = ({ children }: { children: ReactNode }) => null;\n\nclass WeaverSetup {\n /**\n * This variable is handled internally by weaver. **Do not use**.\n */\n get _lenisInstance(): Lenis | undefined {\n return (globalThis as any).__weaverLenis;\n }\n set _lenisInstance(val: Lenis | undefined) {\n (globalThis as any).__weaverLenis = val;\n }\n\n /**\n * This variable is handled internally by weaver. **Do not use**.\n */\n get _Default3DTunnelIn(): BasicTunnelIn | undefined {\n return (globalThis as any).__weaver3DTunnel;\n }\n set _Default3DTunnelIn(val: BasicTunnelIn | undefined) {\n (globalThis as any).__weaver3DTunnel = val;\n }\n\n setLenisInstance(instance: Lenis) {\n this._lenisInstance = instance;\n }\n set3DTunnel(tunnelIn: BasicTunnelIn) {\n this._Default3DTunnelIn = tunnelIn;\n }\n}\n\nexport const weaverSetup = new WeaverSetup();\n","import { type RefObject, useLayoutEffect } from 'react';\n\n/**\n * A simple Orbit hook.\n *\n * @param target HTML element ref to attach to.\n * @param events Specify which events should the orbit tracks.\n */\nexport function useOrbit(options: {\n target?: RefObject<HTMLElement | null>;\n events: {\n onResize?: (entry: ResizeObserverEntry) => void;\n onIntersect?: (entry: IntersectionObserverEntry) => void;\n };\n rootMargin?: string;\n}) {\n const { onResize, onIntersect } = options.events;\n const { rootMargin = '25% 0px 25% 0px' } = options;\n\n useLayoutEffect(() => {\n if (!options.target) return;\n if (!options.target.current) return;\n\n let orbitResize = undefined;\n if (onResize) {\n orbitResize = new ResizeObserver((entries) => onResize(entries[0]));\n orbitResize.observe(options.target.current);\n }\n let orbitIntersect = undefined;\n if (onIntersect) {\n orbitIntersect = new IntersectionObserver(\n (entries) => onIntersect(entries[0]),\n { rootMargin }\n );\n orbitIntersect.observe(options.target.current);\n }\n\n return () => {\n orbitResize?.disconnect();\n orbitIntersect?.disconnect();\n };\n }, [onIntersect, onResize, rootMargin, options.target]);\n}\n","import { useId, useLayoutEffect } from 'react';\n\nexport interface MousePositionValues {\n x: number;\n y: number;\n}\n\ninterface MouseCallback {\n callback: (latest: MousePositionValues) => void;\n options: HookOptions;\n}\n\ninterface HookOptions {\n normalized?: boolean;\n}\n\ntype Callback = (latest: MousePositionValues) => void;\n\nclass MouseEventDistributor {\n private callbacks = new Map<string, MouseCallback>();\n private eventRegistered = false;\n\n constructor() {\n if (this.eventRegistered) return;\n\n window.addEventListener('pointermove', this.callbackLoop.bind(this), {\n passive: true,\n });\n\n this.eventRegistered = true;\n }\n\n addCallbackLoop(\n id: string,\n callback: (latest: MousePositionValues) => void,\n options: HookOptions\n ) {\n this.callbacks.set(id, { callback, options });\n }\n\n removeCallbackLoop(id: string) {\n this.callbacks.delete(id);\n }\n\n private processEvent(event: PointerEvent) {\n const mouse = {\n x: event.clientX,\n y: event.clientY,\n };\n const mouseNormalized = {\n x: mouse.x / (document.body.clientWidth / 2) - 1,\n y: mouse.y / (document.documentElement.clientHeight / 2) - 1,\n };\n\n return [mouse, mouseNormalized];\n }\n\n private callbackLoop(event: PointerEvent) {\n if (event.pointerType !== 'mouse') return;\n\n const callbacks = this.callbacks.entries();\n const [mouse, mouseNormalized] = this.processEvent(event);\n\n let inspecting = callbacks.next().value;\n while (inspecting) {\n if (inspecting[1].options.normalized) {\n inspecting[1].callback(mouseNormalized);\n } else {\n inspecting[1].callback(mouse);\n }\n\n inspecting = callbacks.next().value;\n }\n }\n}\n\nconst distributor = new MouseEventDistributor();\n\nexport function useMouseCallback(\n callback: Callback,\n options: HookOptions = {\n normalized: true,\n }\n) {\n const id = useId();\n\n useLayoutEffect(() => {\n distributor.addCallbackLoop(id, callback, options);\n\n return () => {\n distributor.removeCallbackLoop(id);\n };\n }, [callback, id, options]);\n}\n","import { useCallback } from 'react';\nimport { useNavigate } from 'react-router';\n\nexport function useNavigateAnchor(onNavigate?: () => void) {\n const navigate = useNavigate();\n\n return useCallback(\n (event: React.MouseEvent<HTMLAnchorElement, MouseEvent>) => {\n event.preventDefault();\n const href = event.currentTarget.getAttribute('href');\n if (href) {\n if (onNavigate) {\n onNavigate();\n }\n\n if (href !== window.location.pathname) {\n navigate(event.currentTarget.getAttribute('href') ?? '');\n }\n }\n },\n [onNavigate, navigate]\n );\n}\n","import { useLocation } from 'react-router';\n\nexport function useRawParams(\n prefix: string,\n limit?: number\n): (string | undefined)[] {\n const { pathname } = useLocation();\n\n const prefixedPath = pathname.replace(new RegExp(prefix), '');\n if (prefixedPath === pathname) {\n return [];\n }\n\n return prefixedPath\n .split('/')\n .filter((param) => param !== '')\n .slice(limit);\n}\n","import { useCallback, useLayoutEffect } from 'react';\nimport { useLocation, useNavigate } from 'react-router';\n\nexport function useRouteNormalizer(options: { autoReplace: boolean }) {\n const { pathname } = useLocation();\n const navigate = useNavigate();\n\n const normalizer = useCallback(\n (input: string) => input.replace(/\\/+\\//g, () => '/'),\n []\n );\n\n useLayoutEffect(() => {\n const result = normalizer(pathname);\n if (options.autoReplace && result !== pathname) {\n window.location.replace(result);\n }\n }, [options.autoReplace, pathname, navigate, normalizer]);\n\n return {\n pathname,\n normalizer,\n };\n}\n","import { useCallback, useLayoutEffect, useState } from 'react';\n\nexport function useScreen() {\n const [width, setWidth] = useState(document.body.clientWidth);\n const [height, setHeight] = useState(document.documentElement.clientHeight);\n\n const setScreen = useCallback(() => {\n setWidth(document.body.clientWidth);\n setHeight(document.documentElement.clientHeight);\n }, []);\n\n useLayoutEffect(() => {\n window.addEventListener('resize', setScreen, { passive: true });\n\n return () => {\n window.removeEventListener('resize', setScreen);\n };\n }, [setScreen]);\n\n return { width: width, height: height };\n}\n","import { useThree } from '@react-three/fiber';\nimport { useCallback, useState } from 'react';\nimport { OrthographicCamera, PerspectiveCamera } from 'three';\nimport { useScreenCallback } from './screenCallback';\n\nexport function useViewport(\n customCamera?: OrthographicCamera | PerspectiveCamera\n) {\n const { viewport, camera } = useThree();\n\n const [width, setWidth] = useState(viewport.getCurrentViewport().width);\n const [height, setHeight] = useState(viewport.getCurrentViewport().height);\n\n const viewportUpdate = useCallback(() => {\n const actualViewport = viewport.getCurrentViewport(customCamera ?? camera);\n setWidth(actualViewport.width);\n setHeight(actualViewport.height);\n }, [camera, customCamera, viewport]);\n useScreenCallback(viewportUpdate);\n\n return { width: width, height: height };\n}\n"],"mappings":"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","names":["import_react","import_react","import_react","import_react","import_react","import_react","import_react_router","import_react","import_react_router","import_react","import_react"]}
|
|
1
|
+
{"version":3,"sources":["../src/hooks/index.ts","../src/hooks/breakpoints.ts","../src/hooks/screenCallback.ts","../src/hooks/effectOnce.ts","../src/hooks/lenisCallback.ts","../src/setup.ts","../src/hooks/orbit.ts","../src/hooks/mouseCallback.ts","../src/hooks/navigateAnchor.ts","../src/hooks/rawParams.ts","../src/hooks/routeNormalizer.ts","../src/hooks/screen.ts","../src/hooks/viewport.ts"],"sourcesContent":["import { useBreakpoints } from './breakpoints';\nimport { useEffectOnce, useLayoutEffectOnce } from './effectOnce';\nimport { useLenisCallback } from './lenisCallback';\nimport { useMouseCallback } from './mouseCallback';\nimport { useNavigateAnchor } from './navigateAnchor';\nimport { useOrbit } from './orbit';\nimport { useRawParams } from './rawParams';\nimport { useRouteNormalizer } from './routeNormalizer';\nimport { useScreen } from './screen';\nimport { useScreenCallback } from './screenCallback';\nimport { useViewport } from './viewport';\n\nexport {\n useBreakpoints,\n useEffectOnce,\n useLayoutEffectOnce,\n useLenisCallback,\n useMouseCallback,\n useNavigateAnchor,\n useOrbit,\n useRawParams,\n useRouteNormalizer,\n useScreen,\n useScreenCallback,\n useViewport,\n};\n","import { useCallback, useState } from 'react';\nimport { useScreenCallback } from './screenCallback';\n\nexport function useBreakpoints(breakpoints?: number[] | null) {\n const getBreakpoint = useCallback(\n (width: number) => {\n const processingBreakpoints = !breakpoints\n ? [640, 768, 1024, 1280, 1536]\n : breakpoints;\n\n if (!processingBreakpoints) {\n throw Error(\"Uhhh... so you don't want a breakpoint? Just say it.\");\n }\n\n let result = processingBreakpoints!.length;\n for (let index = 0; index < processingBreakpoints!.length; index++) {\n if (width < processingBreakpoints![index]) {\n result = index;\n break;\n }\n }\n\n return result;\n },\n [breakpoints]\n );\n\n const [breakAt, setBreakAt] = useState<number>(\n getBreakpoint(window.innerWidth)\n );\n\n const breakpointCheck = useCallback(\n (latest: { width: number; height: number }) => {\n const result = getBreakpoint(latest.width);\n if (result !== breakAt) {\n setBreakAt(result);\n }\n },\n [breakAt, getBreakpoint]\n );\n useScreenCallback(breakpointCheck);\n\n return breakAt;\n}\n","import { useLayoutEffect } from 'react';\n\nexport interface ScreenCallbackValues {\n width: number;\n height: number;\n}\n\ntype Callback = (props: ScreenCallbackValues) => void;\n\nexport function useScreenCallback(\n callback: Callback,\n options?: { initialCall?: boolean }\n) {\n useLayoutEffect(() => {\n const reportScreen = () =>\n callback({\n width: window.innerWidth,\n height: window.innerHeight,\n });\n\n // Call it first time when the hook was initialized.\n if (options?.initialCall) {\n reportScreen();\n }\n\n window.addEventListener('resize', reportScreen, { passive: true });\n\n return () => {\n window.removeEventListener('resize', reportScreen);\n };\n }, [callback, options?.initialCall]);\n}\n","import { useEffect, useLayoutEffect } from 'react';\n\nexport function useEffectOnce(callback: React.EffectCallback) {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n useEffect(callback, []);\n}\n\nexport function useLayoutEffectOnce(callback: React.EffectCallback) {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n useLayoutEffect(callback, []);\n}\n","import { type RefObject, useCallback, useLayoutEffect, useMemo } from 'react';\nimport { weaverSetup } from '../setup';\nimport { useOrbit } from './orbit';\n\ninterface HookOptions {\n /**\n * Hook will report when first initialized without waiting for scroll event to actually happens.\n */\n initialCall?: boolean;\n /**\n * Set an element to only call when the element is actually entering the viewport (with 25% `rootMargin`).\n */\n intersectOn?: RefObject<HTMLOrSVGElement | null>;\n}\n\nexport const scrollCallbackReason = {\n Resize: 'resize',\n Scroll: 'scroll',\n Initialize: 'initialize',\n} as const;\nexport type ScrollCallbackReason =\n (typeof scrollCallbackReason)[keyof typeof scrollCallbackReason];\n\ntype Callback = (latest: number, reason: ScrollCallbackReason) => void;\n\nexport function useLenisCallback(callback: Callback, options?: HookOptions) {\n if (!weaverSetup._lenisInstance) {\n throw Error(\n \"useLenisCallback won't work without a lenis instance. Provide one via weaverSetup.setLenisInstance\"\n );\n }\n\n const callbackWrapScroll = useCallback(\n () =>\n callback(\n weaverSetup._lenisInstance!.actualScroll,\n scrollCallbackReason.Scroll\n ),\n [callback]\n );\n const callbackWrapResize = useCallback(\n () =>\n callback(\n weaverSetup._lenisInstance!.actualScroll,\n scrollCallbackReason.Resize\n ),\n [callback]\n );\n\n const intersectOn = useMemo(\n () => options?.intersectOn,\n [options?.intersectOn]\n );\n const initialCall = useMemo(\n () => options?.initialCall,\n [options?.initialCall]\n );\n\n useOrbit({\n target: intersectOn as RefObject<HTMLElement | null> | undefined,\n events: {\n onIntersect(entry) {\n if (entry.isIntersecting) {\n weaverSetup._lenisInstance!.on('scroll', callbackWrapScroll);\n window.addEventListener('resize', callbackWrapResize);\n } else {\n weaverSetup._lenisInstance!.off('scroll', callbackWrapScroll);\n window.removeEventListener('resize', callbackWrapResize);\n }\n },\n },\n rootMargin: '50% 0px 50% 0px',\n });\n\n useLayoutEffect(() => {\n if (!intersectOn) {\n weaverSetup._lenisInstance!.on('scroll', callbackWrapScroll);\n window.addEventListener('resize', callbackWrapResize);\n }\n\n if (initialCall) {\n callback(\n weaverSetup._lenisInstance!.actualScroll,\n scrollCallbackReason.Initialize\n );\n }\n\n return () => {\n weaverSetup._lenisInstance!.off('scroll', callbackWrapScroll);\n window.removeEventListener('resize', callbackWrapResize);\n };\n }, [\n callback,\n callbackWrapResize,\n callbackWrapScroll,\n initialCall,\n intersectOn,\n ]);\n}\n","import Lenis from 'lenis';\nimport { ReactNode } from 'react';\n\nexport type BasicTunnelIn = ({ children }: { children: ReactNode }) => null;\n\nclass WeaverSetup {\n /**\n * This variable is handled internally by weaver. **Do not use**.\n */\n get _lenisInstance(): Lenis | undefined {\n return (globalThis as any).__weaverLenis;\n }\n set _lenisInstance(val: Lenis | undefined) {\n (globalThis as any).__weaverLenis = val;\n }\n\n /**\n * This variable is handled internally by weaver. **Do not use**.\n */\n get _Default3DTunnelIn(): BasicTunnelIn | undefined {\n return (globalThis as any).__weaver3DTunnel;\n }\n set _Default3DTunnelIn(val: BasicTunnelIn | undefined) {\n (globalThis as any).__weaver3DTunnel = val;\n }\n\n setLenisInstance(instance: Lenis) {\n this._lenisInstance = instance;\n }\n set3DTunnel(tunnelIn: BasicTunnelIn) {\n this._Default3DTunnelIn = tunnelIn;\n }\n}\n\nexport const weaverSetup = new WeaverSetup();\n","import { type RefObject, useLayoutEffect } from 'react';\n\n/**\n * A simple Orbit hook.\n *\n * @param target HTML element ref to attach to.\n * @param events Specify which events should the orbit tracks.\n */\nexport function useOrbit(options: {\n target?: RefObject<HTMLElement | null>;\n events: {\n onResize?: (entry: ResizeObserverEntry) => void;\n onIntersect?: (entry: IntersectionObserverEntry) => void;\n };\n rootMargin?: string;\n}) {\n const { onResize, onIntersect } = options.events;\n const { rootMargin = '25% 0px 25% 0px' } = options;\n\n useLayoutEffect(() => {\n if (!options.target) return;\n if (!options.target.current) return;\n\n let orbitResize = undefined;\n if (onResize) {\n orbitResize = new ResizeObserver((entries) => onResize(entries[0]));\n orbitResize.observe(options.target.current);\n }\n let orbitIntersect = undefined;\n if (onIntersect) {\n orbitIntersect = new IntersectionObserver(\n (entries) => onIntersect(entries[0]),\n { rootMargin }\n );\n orbitIntersect.observe(options.target.current);\n }\n\n return () => {\n orbitResize?.disconnect();\n orbitIntersect?.disconnect();\n };\n }, [onIntersect, onResize, rootMargin, options.target]);\n}\n","import { useId, useLayoutEffect } from 'react';\n\nexport interface MousePositionValues {\n x: number;\n y: number;\n}\n\ninterface MouseCallback {\n callback: (latest: MousePositionValues) => void;\n options: HookOptions;\n}\n\ninterface HookOptions {\n normalized?: boolean;\n}\n\ntype Callback = (latest: MousePositionValues) => void;\n\nclass MouseEventDistributor {\n private callbacks = new Map<string, MouseCallback>();\n private eventRegistered = false;\n\n constructor() {\n if (this.eventRegistered) return;\n\n window.addEventListener('pointermove', this.callbackLoop.bind(this), {\n passive: true,\n });\n\n this.eventRegistered = true;\n }\n\n addCallbackLoop(\n id: string,\n callback: (latest: MousePositionValues) => void,\n options: HookOptions\n ) {\n this.callbacks.set(id, { callback, options });\n }\n\n removeCallbackLoop(id: string) {\n this.callbacks.delete(id);\n }\n\n private processEvent(event: PointerEvent) {\n const mouse = {\n x: event.clientX,\n y: event.clientY,\n };\n const mouseNormalized = {\n x: mouse.x / (window.innerWidth / 2) - 1,\n y: mouse.y / (window.innerHeight / 2) - 1,\n };\n\n return [mouse, mouseNormalized];\n }\n\n private callbackLoop(event: PointerEvent) {\n if (event.pointerType !== 'mouse') return;\n\n const callbacks = this.callbacks.entries();\n const [mouse, mouseNormalized] = this.processEvent(event);\n\n let inspecting = callbacks.next().value;\n while (inspecting) {\n if (inspecting[1].options.normalized) {\n inspecting[1].callback(mouseNormalized);\n } else {\n inspecting[1].callback(mouse);\n }\n\n inspecting = callbacks.next().value;\n }\n }\n}\n\nconst distributor = new MouseEventDistributor();\n\nexport function useMouseCallback(\n callback: Callback,\n options: HookOptions = {\n normalized: true,\n }\n) {\n const id = useId();\n\n useLayoutEffect(() => {\n distributor.addCallbackLoop(id, callback, options);\n\n return () => {\n distributor.removeCallbackLoop(id);\n };\n }, [callback, id, options]);\n}\n","import { useCallback } from 'react';\nimport { useNavigate } from 'react-router';\n\nexport function useNavigateAnchor(onNavigate?: () => void) {\n const navigate = useNavigate();\n\n return useCallback(\n (event: React.MouseEvent<HTMLAnchorElement, MouseEvent>) => {\n event.preventDefault();\n const href = event.currentTarget.getAttribute('href');\n if (href) {\n if (onNavigate) {\n onNavigate();\n }\n\n if (href !== window.location.pathname) {\n navigate(event.currentTarget.getAttribute('href') ?? '');\n }\n }\n },\n [onNavigate, navigate]\n );\n}\n","import { useLocation } from 'react-router';\n\nexport function useRawParams(\n prefix: string,\n limit?: number\n): (string | undefined)[] {\n const { pathname } = useLocation();\n\n const prefixedPath = pathname.replace(new RegExp(prefix), '');\n if (prefixedPath === pathname) {\n return [];\n }\n\n return prefixedPath\n .split('/')\n .filter((param) => param !== '')\n .slice(limit);\n}\n","import { useCallback, useLayoutEffect } from 'react';\nimport { useLocation, useNavigate } from 'react-router';\n\nexport function useRouteNormalizer(options: { autoReplace: boolean }) {\n const { pathname } = useLocation();\n const navigate = useNavigate();\n\n const normalizer = useCallback(\n (input: string) => input.replace(/\\/+\\//g, () => '/'),\n []\n );\n\n useLayoutEffect(() => {\n const result = normalizer(pathname);\n if (options.autoReplace && result !== pathname) {\n window.location.replace(result);\n }\n }, [options.autoReplace, pathname, navigate, normalizer]);\n\n return {\n pathname,\n normalizer,\n };\n}\n","import { useCallback, useLayoutEffect, useState } from 'react';\n\nexport function useScreen() {\n const [width, setWidth] = useState(window.innerWidth);\n const [height, setHeight] = useState(window.innerHeight);\n\n const setScreen = useCallback(() => {\n setWidth(window.innerWidth);\n setHeight(window.innerHeight);\n }, []);\n\n useLayoutEffect(() => {\n window.addEventListener('resize', setScreen, { passive: true });\n\n return () => {\n window.removeEventListener('resize', setScreen);\n };\n }, [setScreen]);\n\n return { width: width, height: height };\n}\n","import { useThree } from '@react-three/fiber';\nimport { useCallback, useState } from 'react';\nimport { OrthographicCamera, PerspectiveCamera } from 'three';\nimport { useScreenCallback } from './screenCallback';\n\nexport function useViewport(\n customCamera?: OrthographicCamera | PerspectiveCamera\n) {\n const { viewport, camera } = useThree();\n\n const [width, setWidth] = useState(viewport.getCurrentViewport().width);\n const [height, setHeight] = useState(viewport.getCurrentViewport().height);\n\n const viewportUpdate = useCallback(() => {\n const actualViewport = viewport.getCurrentViewport(customCamera ?? camera);\n setWidth(actualViewport.width);\n setHeight(actualViewport.height);\n }, [camera, customCamera, viewport]);\n useScreenCallback(viewportUpdate);\n\n return { width: width, height: height };\n}\n"],"mappings":"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","names":["import_react","import_react","import_react","import_react","import_react","import_react","import_react_router","import_react","import_react_router","import_react","import_react"]}
|
package/dist/hooks.mjs
CHANGED
|
@@ -6,8 +6,8 @@ import { useLayoutEffect } from "react";
|
|
|
6
6
|
function useScreenCallback(callback, options) {
|
|
7
7
|
useLayoutEffect(() => {
|
|
8
8
|
const reportScreen = () => callback({
|
|
9
|
-
width:
|
|
10
|
-
height:
|
|
9
|
+
width: window.innerWidth,
|
|
10
|
+
height: window.innerHeight
|
|
11
11
|
});
|
|
12
12
|
if (options?.initialCall) {
|
|
13
13
|
reportScreen();
|
|
@@ -39,7 +39,7 @@ function useBreakpoints(breakpoints) {
|
|
|
39
39
|
[breakpoints]
|
|
40
40
|
);
|
|
41
41
|
const [breakAt, setBreakAt] = useState(
|
|
42
|
-
getBreakpoint(
|
|
42
|
+
getBreakpoint(window.innerWidth)
|
|
43
43
|
);
|
|
44
44
|
const breakpointCheck = useCallback(
|
|
45
45
|
(latest) => {
|
|
@@ -220,8 +220,8 @@ var MouseEventDistributor = class {
|
|
|
220
220
|
y: event.clientY
|
|
221
221
|
};
|
|
222
222
|
const mouseNormalized = {
|
|
223
|
-
x: mouse.x / (
|
|
224
|
-
y: mouse.y / (
|
|
223
|
+
x: mouse.x / (window.innerWidth / 2) - 1,
|
|
224
|
+
y: mouse.y / (window.innerHeight / 2) - 1
|
|
225
225
|
};
|
|
226
226
|
return [mouse, mouseNormalized];
|
|
227
227
|
}
|
|
@@ -311,11 +311,11 @@ function useRouteNormalizer(options) {
|
|
|
311
311
|
// src/hooks/screen.ts
|
|
312
312
|
import { useCallback as useCallback5, useLayoutEffect as useLayoutEffect7, useState as useState2 } from "react";
|
|
313
313
|
function useScreen() {
|
|
314
|
-
const [width, setWidth] = useState2(
|
|
315
|
-
const [height, setHeight] = useState2(
|
|
314
|
+
const [width, setWidth] = useState2(window.innerWidth);
|
|
315
|
+
const [height, setHeight] = useState2(window.innerHeight);
|
|
316
316
|
const setScreen = useCallback5(() => {
|
|
317
|
-
setWidth(
|
|
318
|
-
setHeight(
|
|
317
|
+
setWidth(window.innerWidth);
|
|
318
|
+
setHeight(window.innerHeight);
|
|
319
319
|
}, []);
|
|
320
320
|
useLayoutEffect7(() => {
|
|
321
321
|
window.addEventListener("resize", setScreen, { passive: true });
|
package/dist/hooks.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/hooks/breakpoints.ts","../src/hooks/screenCallback.ts","../src/hooks/effectOnce.ts","../src/hooks/lenisCallback.ts","../src/setup.ts","../src/hooks/orbit.ts","../src/hooks/mouseCallback.ts","../src/hooks/navigateAnchor.ts","../src/hooks/rawParams.ts","../src/hooks/routeNormalizer.ts","../src/hooks/screen.ts","../src/hooks/viewport.ts"],"sourcesContent":["import { useCallback, useState } from 'react';\nimport { useScreenCallback } from './screenCallback';\n\nexport function useBreakpoints(breakpoints?: number[] | null) {\n const getBreakpoint = useCallback(\n (width: number) => {\n const processingBreakpoints = !breakpoints\n ? [640, 768, 1024, 1280, 1536]\n : breakpoints;\n\n if (!processingBreakpoints) {\n throw Error(\"Uhhh... so you don't want a breakpoint? Just say it.\");\n }\n\n let result = processingBreakpoints!.length;\n for (let index = 0; index < processingBreakpoints!.length; index++) {\n if (width < processingBreakpoints![index]) {\n result = index;\n break;\n }\n }\n\n return result;\n },\n [breakpoints]\n );\n\n const [breakAt, setBreakAt] = useState<number>(\n getBreakpoint(document.body.clientWidth)\n );\n\n const breakpointCheck = useCallback(\n (latest: { width: number; height: number }) => {\n const result = getBreakpoint(latest.width);\n if (result !== breakAt) {\n setBreakAt(result);\n }\n },\n [breakAt, getBreakpoint]\n );\n useScreenCallback(breakpointCheck);\n\n return breakAt;\n}\n","import { useLayoutEffect } from 'react';\n\nexport interface ScreenCallbackValues {\n width: number;\n height: number;\n}\n\ntype Callback = (props: ScreenCallbackValues) => void;\n\nexport function useScreenCallback(\n callback: Callback,\n options?: { initialCall?: boolean }\n) {\n useLayoutEffect(() => {\n const reportScreen = () =>\n callback({\n width: document.body.clientWidth,\n height: document.documentElement.clientHeight,\n });\n\n // Call it first time when the hook was initialized.\n if (options?.initialCall) {\n reportScreen();\n }\n\n window.addEventListener('resize', reportScreen, { passive: true });\n\n return () => {\n window.removeEventListener('resize', reportScreen);\n };\n }, [callback, options?.initialCall]);\n}\n","import { useEffect, useLayoutEffect } from 'react';\n\nexport function useEffectOnce(callback: React.EffectCallback) {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n useEffect(callback, []);\n}\n\nexport function useLayoutEffectOnce(callback: React.EffectCallback) {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n useLayoutEffect(callback, []);\n}\n","import { type RefObject, useCallback, useLayoutEffect, useMemo } from 'react';\nimport { weaverSetup } from '../setup';\nimport { useOrbit } from './orbit';\n\ninterface HookOptions {\n /**\n * Hook will report when first initialized without waiting for scroll event to actually happens.\n */\n initialCall?: boolean;\n /**\n * Set an element to only call when the element is actually entering the viewport (with 25% `rootMargin`).\n */\n intersectOn?: RefObject<HTMLOrSVGElement | null>;\n}\n\nexport const scrollCallbackReason = {\n Resize: 'resize',\n Scroll: 'scroll',\n Initialize: 'initialize',\n} as const;\nexport type ScrollCallbackReason =\n (typeof scrollCallbackReason)[keyof typeof scrollCallbackReason];\n\ntype Callback = (latest: number, reason: ScrollCallbackReason) => void;\n\nexport function useLenisCallback(callback: Callback, options?: HookOptions) {\n if (!weaverSetup._lenisInstance) {\n throw Error(\n \"useLenisCallback won't work without a lenis instance. Provide one via weaverSetup.setLenisInstance\"\n );\n }\n\n const callbackWrapScroll = useCallback(\n () =>\n callback(\n weaverSetup._lenisInstance!.actualScroll,\n scrollCallbackReason.Scroll\n ),\n [callback]\n );\n const callbackWrapResize = useCallback(\n () =>\n callback(\n weaverSetup._lenisInstance!.actualScroll,\n scrollCallbackReason.Resize\n ),\n [callback]\n );\n\n const intersectOn = useMemo(\n () => options?.intersectOn,\n [options?.intersectOn]\n );\n const initialCall = useMemo(\n () => options?.initialCall,\n [options?.initialCall]\n );\n\n useOrbit({\n target: intersectOn as RefObject<HTMLElement | null> | undefined,\n events: {\n onIntersect(entry) {\n if (entry.isIntersecting) {\n weaverSetup._lenisInstance!.on('scroll', callbackWrapScroll);\n window.addEventListener('resize', callbackWrapResize);\n } else {\n weaverSetup._lenisInstance!.off('scroll', callbackWrapScroll);\n window.removeEventListener('resize', callbackWrapResize);\n }\n },\n },\n rootMargin: '50% 0px 50% 0px',\n });\n\n useLayoutEffect(() => {\n if (!intersectOn) {\n weaverSetup._lenisInstance!.on('scroll', callbackWrapScroll);\n window.addEventListener('resize', callbackWrapResize);\n }\n\n if (initialCall) {\n callback(\n weaverSetup._lenisInstance!.actualScroll,\n scrollCallbackReason.Initialize\n );\n }\n\n return () => {\n weaverSetup._lenisInstance!.off('scroll', callbackWrapScroll);\n window.removeEventListener('resize', callbackWrapResize);\n };\n }, [\n callback,\n callbackWrapResize,\n callbackWrapScroll,\n initialCall,\n intersectOn,\n ]);\n}\n","import Lenis from 'lenis';\nimport { ReactNode } from 'react';\n\nexport type BasicTunnelIn = ({ children }: { children: ReactNode }) => null;\n\nclass WeaverSetup {\n /**\n * This variable is handled internally by weaver. **Do not use**.\n */\n get _lenisInstance(): Lenis | undefined {\n return (globalThis as any).__weaverLenis;\n }\n set _lenisInstance(val: Lenis | undefined) {\n (globalThis as any).__weaverLenis = val;\n }\n\n /**\n * This variable is handled internally by weaver. **Do not use**.\n */\n get _Default3DTunnelIn(): BasicTunnelIn | undefined {\n return (globalThis as any).__weaver3DTunnel;\n }\n set _Default3DTunnelIn(val: BasicTunnelIn | undefined) {\n (globalThis as any).__weaver3DTunnel = val;\n }\n\n setLenisInstance(instance: Lenis) {\n this._lenisInstance = instance;\n }\n set3DTunnel(tunnelIn: BasicTunnelIn) {\n this._Default3DTunnelIn = tunnelIn;\n }\n}\n\nexport const weaverSetup = new WeaverSetup();\n","import { type RefObject, useLayoutEffect } from 'react';\n\n/**\n * A simple Orbit hook.\n *\n * @param target HTML element ref to attach to.\n * @param events Specify which events should the orbit tracks.\n */\nexport function useOrbit(options: {\n target?: RefObject<HTMLElement | null>;\n events: {\n onResize?: (entry: ResizeObserverEntry) => void;\n onIntersect?: (entry: IntersectionObserverEntry) => void;\n };\n rootMargin?: string;\n}) {\n const { onResize, onIntersect } = options.events;\n const { rootMargin = '25% 0px 25% 0px' } = options;\n\n useLayoutEffect(() => {\n if (!options.target) return;\n if (!options.target.current) return;\n\n let orbitResize = undefined;\n if (onResize) {\n orbitResize = new ResizeObserver((entries) => onResize(entries[0]));\n orbitResize.observe(options.target.current);\n }\n let orbitIntersect = undefined;\n if (onIntersect) {\n orbitIntersect = new IntersectionObserver(\n (entries) => onIntersect(entries[0]),\n { rootMargin }\n );\n orbitIntersect.observe(options.target.current);\n }\n\n return () => {\n orbitResize?.disconnect();\n orbitIntersect?.disconnect();\n };\n }, [onIntersect, onResize, rootMargin, options.target]);\n}\n","import { useId, useLayoutEffect } from 'react';\n\nexport interface MousePositionValues {\n x: number;\n y: number;\n}\n\ninterface MouseCallback {\n callback: (latest: MousePositionValues) => void;\n options: HookOptions;\n}\n\ninterface HookOptions {\n normalized?: boolean;\n}\n\ntype Callback = (latest: MousePositionValues) => void;\n\nclass MouseEventDistributor {\n private callbacks = new Map<string, MouseCallback>();\n private eventRegistered = false;\n\n constructor() {\n if (this.eventRegistered) return;\n\n window.addEventListener('pointermove', this.callbackLoop.bind(this), {\n passive: true,\n });\n\n this.eventRegistered = true;\n }\n\n addCallbackLoop(\n id: string,\n callback: (latest: MousePositionValues) => void,\n options: HookOptions\n ) {\n this.callbacks.set(id, { callback, options });\n }\n\n removeCallbackLoop(id: string) {\n this.callbacks.delete(id);\n }\n\n private processEvent(event: PointerEvent) {\n const mouse = {\n x: event.clientX,\n y: event.clientY,\n };\n const mouseNormalized = {\n x: mouse.x / (document.body.clientWidth / 2) - 1,\n y: mouse.y / (document.documentElement.clientHeight / 2) - 1,\n };\n\n return [mouse, mouseNormalized];\n }\n\n private callbackLoop(event: PointerEvent) {\n if (event.pointerType !== 'mouse') return;\n\n const callbacks = this.callbacks.entries();\n const [mouse, mouseNormalized] = this.processEvent(event);\n\n let inspecting = callbacks.next().value;\n while (inspecting) {\n if (inspecting[1].options.normalized) {\n inspecting[1].callback(mouseNormalized);\n } else {\n inspecting[1].callback(mouse);\n }\n\n inspecting = callbacks.next().value;\n }\n }\n}\n\nconst distributor = new MouseEventDistributor();\n\nexport function useMouseCallback(\n callback: Callback,\n options: HookOptions = {\n normalized: true,\n }\n) {\n const id = useId();\n\n useLayoutEffect(() => {\n distributor.addCallbackLoop(id, callback, options);\n\n return () => {\n distributor.removeCallbackLoop(id);\n };\n }, [callback, id, options]);\n}\n","import { useCallback } from 'react';\nimport { useNavigate } from 'react-router';\n\nexport function useNavigateAnchor(onNavigate?: () => void) {\n const navigate = useNavigate();\n\n return useCallback(\n (event: React.MouseEvent<HTMLAnchorElement, MouseEvent>) => {\n event.preventDefault();\n const href = event.currentTarget.getAttribute('href');\n if (href) {\n if (onNavigate) {\n onNavigate();\n }\n\n if (href !== window.location.pathname) {\n navigate(event.currentTarget.getAttribute('href') ?? '');\n }\n }\n },\n [onNavigate, navigate]\n );\n}\n","import { useLocation } from 'react-router';\n\nexport function useRawParams(\n prefix: string,\n limit?: number\n): (string | undefined)[] {\n const { pathname } = useLocation();\n\n const prefixedPath = pathname.replace(new RegExp(prefix), '');\n if (prefixedPath === pathname) {\n return [];\n }\n\n return prefixedPath\n .split('/')\n .filter((param) => param !== '')\n .slice(limit);\n}\n","import { useCallback, useLayoutEffect } from 'react';\nimport { useLocation, useNavigate } from 'react-router';\n\nexport function useRouteNormalizer(options: { autoReplace: boolean }) {\n const { pathname } = useLocation();\n const navigate = useNavigate();\n\n const normalizer = useCallback(\n (input: string) => input.replace(/\\/+\\//g, () => '/'),\n []\n );\n\n useLayoutEffect(() => {\n const result = normalizer(pathname);\n if (options.autoReplace && result !== pathname) {\n window.location.replace(result);\n }\n }, [options.autoReplace, pathname, navigate, normalizer]);\n\n return {\n pathname,\n normalizer,\n };\n}\n","import { useCallback, useLayoutEffect, useState } from 'react';\n\nexport function useScreen() {\n const [width, setWidth] = useState(document.body.clientWidth);\n const [height, setHeight] = useState(document.documentElement.clientHeight);\n\n const setScreen = useCallback(() => {\n setWidth(document.body.clientWidth);\n setHeight(document.documentElement.clientHeight);\n }, []);\n\n useLayoutEffect(() => {\n window.addEventListener('resize', setScreen, { passive: true });\n\n return () => {\n window.removeEventListener('resize', setScreen);\n };\n }, [setScreen]);\n\n return { width: width, height: height };\n}\n","import { useThree } from '@react-three/fiber';\nimport { useCallback, useState } from 'react';\nimport { OrthographicCamera, PerspectiveCamera } from 'three';\nimport { useScreenCallback } from './screenCallback';\n\nexport function useViewport(\n customCamera?: OrthographicCamera | PerspectiveCamera\n) {\n const { viewport, camera } = useThree();\n\n const [width, setWidth] = useState(viewport.getCurrentViewport().width);\n const [height, setHeight] = useState(viewport.getCurrentViewport().height);\n\n const viewportUpdate = useCallback(() => {\n const actualViewport = viewport.getCurrentViewport(customCamera ?? camera);\n setWidth(actualViewport.width);\n setHeight(actualViewport.height);\n }, [camera, customCamera, viewport]);\n useScreenCallback(viewportUpdate);\n\n return { width: width, height: height };\n}\n"],"mappings":"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","names":["useLayoutEffect","useCallback","useLayoutEffect","useLayoutEffect","useCallback","useLayoutEffect","useLayoutEffect","useCallback","useCallback","useLayoutEffect","useLocation","useNavigate","useCallback","useLayoutEffect","useState","useCallback","useState","useState","useCallback"]}
|
|
1
|
+
{"version":3,"sources":["../src/hooks/breakpoints.ts","../src/hooks/screenCallback.ts","../src/hooks/effectOnce.ts","../src/hooks/lenisCallback.ts","../src/setup.ts","../src/hooks/orbit.ts","../src/hooks/mouseCallback.ts","../src/hooks/navigateAnchor.ts","../src/hooks/rawParams.ts","../src/hooks/routeNormalizer.ts","../src/hooks/screen.ts","../src/hooks/viewport.ts"],"sourcesContent":["import { useCallback, useState } from 'react';\nimport { useScreenCallback } from './screenCallback';\n\nexport function useBreakpoints(breakpoints?: number[] | null) {\n const getBreakpoint = useCallback(\n (width: number) => {\n const processingBreakpoints = !breakpoints\n ? [640, 768, 1024, 1280, 1536]\n : breakpoints;\n\n if (!processingBreakpoints) {\n throw Error(\"Uhhh... so you don't want a breakpoint? Just say it.\");\n }\n\n let result = processingBreakpoints!.length;\n for (let index = 0; index < processingBreakpoints!.length; index++) {\n if (width < processingBreakpoints![index]) {\n result = index;\n break;\n }\n }\n\n return result;\n },\n [breakpoints]\n );\n\n const [breakAt, setBreakAt] = useState<number>(\n getBreakpoint(window.innerWidth)\n );\n\n const breakpointCheck = useCallback(\n (latest: { width: number; height: number }) => {\n const result = getBreakpoint(latest.width);\n if (result !== breakAt) {\n setBreakAt(result);\n }\n },\n [breakAt, getBreakpoint]\n );\n useScreenCallback(breakpointCheck);\n\n return breakAt;\n}\n","import { useLayoutEffect } from 'react';\n\nexport interface ScreenCallbackValues {\n width: number;\n height: number;\n}\n\ntype Callback = (props: ScreenCallbackValues) => void;\n\nexport function useScreenCallback(\n callback: Callback,\n options?: { initialCall?: boolean }\n) {\n useLayoutEffect(() => {\n const reportScreen = () =>\n callback({\n width: window.innerWidth,\n height: window.innerHeight,\n });\n\n // Call it first time when the hook was initialized.\n if (options?.initialCall) {\n reportScreen();\n }\n\n window.addEventListener('resize', reportScreen, { passive: true });\n\n return () => {\n window.removeEventListener('resize', reportScreen);\n };\n }, [callback, options?.initialCall]);\n}\n","import { useEffect, useLayoutEffect } from 'react';\n\nexport function useEffectOnce(callback: React.EffectCallback) {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n useEffect(callback, []);\n}\n\nexport function useLayoutEffectOnce(callback: React.EffectCallback) {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n useLayoutEffect(callback, []);\n}\n","import { type RefObject, useCallback, useLayoutEffect, useMemo } from 'react';\nimport { weaverSetup } from '../setup';\nimport { useOrbit } from './orbit';\n\ninterface HookOptions {\n /**\n * Hook will report when first initialized without waiting for scroll event to actually happens.\n */\n initialCall?: boolean;\n /**\n * Set an element to only call when the element is actually entering the viewport (with 25% `rootMargin`).\n */\n intersectOn?: RefObject<HTMLOrSVGElement | null>;\n}\n\nexport const scrollCallbackReason = {\n Resize: 'resize',\n Scroll: 'scroll',\n Initialize: 'initialize',\n} as const;\nexport type ScrollCallbackReason =\n (typeof scrollCallbackReason)[keyof typeof scrollCallbackReason];\n\ntype Callback = (latest: number, reason: ScrollCallbackReason) => void;\n\nexport function useLenisCallback(callback: Callback, options?: HookOptions) {\n if (!weaverSetup._lenisInstance) {\n throw Error(\n \"useLenisCallback won't work without a lenis instance. Provide one via weaverSetup.setLenisInstance\"\n );\n }\n\n const callbackWrapScroll = useCallback(\n () =>\n callback(\n weaverSetup._lenisInstance!.actualScroll,\n scrollCallbackReason.Scroll\n ),\n [callback]\n );\n const callbackWrapResize = useCallback(\n () =>\n callback(\n weaverSetup._lenisInstance!.actualScroll,\n scrollCallbackReason.Resize\n ),\n [callback]\n );\n\n const intersectOn = useMemo(\n () => options?.intersectOn,\n [options?.intersectOn]\n );\n const initialCall = useMemo(\n () => options?.initialCall,\n [options?.initialCall]\n );\n\n useOrbit({\n target: intersectOn as RefObject<HTMLElement | null> | undefined,\n events: {\n onIntersect(entry) {\n if (entry.isIntersecting) {\n weaverSetup._lenisInstance!.on('scroll', callbackWrapScroll);\n window.addEventListener('resize', callbackWrapResize);\n } else {\n weaverSetup._lenisInstance!.off('scroll', callbackWrapScroll);\n window.removeEventListener('resize', callbackWrapResize);\n }\n },\n },\n rootMargin: '50% 0px 50% 0px',\n });\n\n useLayoutEffect(() => {\n if (!intersectOn) {\n weaverSetup._lenisInstance!.on('scroll', callbackWrapScroll);\n window.addEventListener('resize', callbackWrapResize);\n }\n\n if (initialCall) {\n callback(\n weaverSetup._lenisInstance!.actualScroll,\n scrollCallbackReason.Initialize\n );\n }\n\n return () => {\n weaverSetup._lenisInstance!.off('scroll', callbackWrapScroll);\n window.removeEventListener('resize', callbackWrapResize);\n };\n }, [\n callback,\n callbackWrapResize,\n callbackWrapScroll,\n initialCall,\n intersectOn,\n ]);\n}\n","import Lenis from 'lenis';\nimport { ReactNode } from 'react';\n\nexport type BasicTunnelIn = ({ children }: { children: ReactNode }) => null;\n\nclass WeaverSetup {\n /**\n * This variable is handled internally by weaver. **Do not use**.\n */\n get _lenisInstance(): Lenis | undefined {\n return (globalThis as any).__weaverLenis;\n }\n set _lenisInstance(val: Lenis | undefined) {\n (globalThis as any).__weaverLenis = val;\n }\n\n /**\n * This variable is handled internally by weaver. **Do not use**.\n */\n get _Default3DTunnelIn(): BasicTunnelIn | undefined {\n return (globalThis as any).__weaver3DTunnel;\n }\n set _Default3DTunnelIn(val: BasicTunnelIn | undefined) {\n (globalThis as any).__weaver3DTunnel = val;\n }\n\n setLenisInstance(instance: Lenis) {\n this._lenisInstance = instance;\n }\n set3DTunnel(tunnelIn: BasicTunnelIn) {\n this._Default3DTunnelIn = tunnelIn;\n }\n}\n\nexport const weaverSetup = new WeaverSetup();\n","import { type RefObject, useLayoutEffect } from 'react';\n\n/**\n * A simple Orbit hook.\n *\n * @param target HTML element ref to attach to.\n * @param events Specify which events should the orbit tracks.\n */\nexport function useOrbit(options: {\n target?: RefObject<HTMLElement | null>;\n events: {\n onResize?: (entry: ResizeObserverEntry) => void;\n onIntersect?: (entry: IntersectionObserverEntry) => void;\n };\n rootMargin?: string;\n}) {\n const { onResize, onIntersect } = options.events;\n const { rootMargin = '25% 0px 25% 0px' } = options;\n\n useLayoutEffect(() => {\n if (!options.target) return;\n if (!options.target.current) return;\n\n let orbitResize = undefined;\n if (onResize) {\n orbitResize = new ResizeObserver((entries) => onResize(entries[0]));\n orbitResize.observe(options.target.current);\n }\n let orbitIntersect = undefined;\n if (onIntersect) {\n orbitIntersect = new IntersectionObserver(\n (entries) => onIntersect(entries[0]),\n { rootMargin }\n );\n orbitIntersect.observe(options.target.current);\n }\n\n return () => {\n orbitResize?.disconnect();\n orbitIntersect?.disconnect();\n };\n }, [onIntersect, onResize, rootMargin, options.target]);\n}\n","import { useId, useLayoutEffect } from 'react';\n\nexport interface MousePositionValues {\n x: number;\n y: number;\n}\n\ninterface MouseCallback {\n callback: (latest: MousePositionValues) => void;\n options: HookOptions;\n}\n\ninterface HookOptions {\n normalized?: boolean;\n}\n\ntype Callback = (latest: MousePositionValues) => void;\n\nclass MouseEventDistributor {\n private callbacks = new Map<string, MouseCallback>();\n private eventRegistered = false;\n\n constructor() {\n if (this.eventRegistered) return;\n\n window.addEventListener('pointermove', this.callbackLoop.bind(this), {\n passive: true,\n });\n\n this.eventRegistered = true;\n }\n\n addCallbackLoop(\n id: string,\n callback: (latest: MousePositionValues) => void,\n options: HookOptions\n ) {\n this.callbacks.set(id, { callback, options });\n }\n\n removeCallbackLoop(id: string) {\n this.callbacks.delete(id);\n }\n\n private processEvent(event: PointerEvent) {\n const mouse = {\n x: event.clientX,\n y: event.clientY,\n };\n const mouseNormalized = {\n x: mouse.x / (window.innerWidth / 2) - 1,\n y: mouse.y / (window.innerHeight / 2) - 1,\n };\n\n return [mouse, mouseNormalized];\n }\n\n private callbackLoop(event: PointerEvent) {\n if (event.pointerType !== 'mouse') return;\n\n const callbacks = this.callbacks.entries();\n const [mouse, mouseNormalized] = this.processEvent(event);\n\n let inspecting = callbacks.next().value;\n while (inspecting) {\n if (inspecting[1].options.normalized) {\n inspecting[1].callback(mouseNormalized);\n } else {\n inspecting[1].callback(mouse);\n }\n\n inspecting = callbacks.next().value;\n }\n }\n}\n\nconst distributor = new MouseEventDistributor();\n\nexport function useMouseCallback(\n callback: Callback,\n options: HookOptions = {\n normalized: true,\n }\n) {\n const id = useId();\n\n useLayoutEffect(() => {\n distributor.addCallbackLoop(id, callback, options);\n\n return () => {\n distributor.removeCallbackLoop(id);\n };\n }, [callback, id, options]);\n}\n","import { useCallback } from 'react';\nimport { useNavigate } from 'react-router';\n\nexport function useNavigateAnchor(onNavigate?: () => void) {\n const navigate = useNavigate();\n\n return useCallback(\n (event: React.MouseEvent<HTMLAnchorElement, MouseEvent>) => {\n event.preventDefault();\n const href = event.currentTarget.getAttribute('href');\n if (href) {\n if (onNavigate) {\n onNavigate();\n }\n\n if (href !== window.location.pathname) {\n navigate(event.currentTarget.getAttribute('href') ?? '');\n }\n }\n },\n [onNavigate, navigate]\n );\n}\n","import { useLocation } from 'react-router';\n\nexport function useRawParams(\n prefix: string,\n limit?: number\n): (string | undefined)[] {\n const { pathname } = useLocation();\n\n const prefixedPath = pathname.replace(new RegExp(prefix), '');\n if (prefixedPath === pathname) {\n return [];\n }\n\n return prefixedPath\n .split('/')\n .filter((param) => param !== '')\n .slice(limit);\n}\n","import { useCallback, useLayoutEffect } from 'react';\nimport { useLocation, useNavigate } from 'react-router';\n\nexport function useRouteNormalizer(options: { autoReplace: boolean }) {\n const { pathname } = useLocation();\n const navigate = useNavigate();\n\n const normalizer = useCallback(\n (input: string) => input.replace(/\\/+\\//g, () => '/'),\n []\n );\n\n useLayoutEffect(() => {\n const result = normalizer(pathname);\n if (options.autoReplace && result !== pathname) {\n window.location.replace(result);\n }\n }, [options.autoReplace, pathname, navigate, normalizer]);\n\n return {\n pathname,\n normalizer,\n };\n}\n","import { useCallback, useLayoutEffect, useState } from 'react';\n\nexport function useScreen() {\n const [width, setWidth] = useState(window.innerWidth);\n const [height, setHeight] = useState(window.innerHeight);\n\n const setScreen = useCallback(() => {\n setWidth(window.innerWidth);\n setHeight(window.innerHeight);\n }, []);\n\n useLayoutEffect(() => {\n window.addEventListener('resize', setScreen, { passive: true });\n\n return () => {\n window.removeEventListener('resize', setScreen);\n };\n }, [setScreen]);\n\n return { width: width, height: height };\n}\n","import { useThree } from '@react-three/fiber';\nimport { useCallback, useState } from 'react';\nimport { OrthographicCamera, PerspectiveCamera } from 'three';\nimport { useScreenCallback } from './screenCallback';\n\nexport function useViewport(\n customCamera?: OrthographicCamera | PerspectiveCamera\n) {\n const { viewport, camera } = useThree();\n\n const [width, setWidth] = useState(viewport.getCurrentViewport().width);\n const [height, setHeight] = useState(viewport.getCurrentViewport().height);\n\n const viewportUpdate = useCallback(() => {\n const actualViewport = viewport.getCurrentViewport(customCamera ?? camera);\n setWidth(actualViewport.width);\n setHeight(actualViewport.height);\n }, [camera, customCamera, viewport]);\n useScreenCallback(viewportUpdate);\n\n return { width: width, height: height };\n}\n"],"mappings":"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","names":["useLayoutEffect","useCallback","useLayoutEffect","useLayoutEffect","useCallback","useLayoutEffect","useLayoutEffect","useCallback","useCallback","useLayoutEffect","useLocation","useNavigate","useCallback","useLayoutEffect","useState","useCallback","useState","useState","useCallback"]}
|
package/dist/scene.js
CHANGED
|
@@ -261,8 +261,8 @@ function SyncInternal(props) {
|
|
|
261
261
|
const vp = properties.current.viewport;
|
|
262
262
|
if (!vp) return;
|
|
263
263
|
const domRect = attach.current.getBoundingClientRect();
|
|
264
|
-
const screenH =
|
|
265
|
-
const screenW =
|
|
264
|
+
const screenH = window.innerHeight;
|
|
265
|
+
const screenW = window.innerWidth;
|
|
266
266
|
const vpWidthRatio = vp.width / screenW;
|
|
267
267
|
const vpHeightRatio = vp.height / screenH;
|
|
268
268
|
const scrollOffset = weaverSetup._lenisInstance.actualScroll / screenH * vp.height;
|
package/dist/scene.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/scene/index.ts","../src/scene/BakeScene.tsx","../src/setup.ts","../src/scene/SceneSync.tsx","../src/hooks/effectOnce.ts","../src/hooks/lenisCallback.ts","../src/hooks/orbit.ts"],"sourcesContent":["import BakeScene from './BakeScene';\nimport SceneSync from './SceneSync';\n\nexport { BakeScene, SceneSync };\n","import { useFrame } from '@react-three/fiber';\nimport React, {\n type Dispatch,\n Fragment,\n type ReactNode,\n type SetStateAction,\n useId,\n useRef,\n} from 'react';\nimport { BasicTunnelIn, weaverSetup } from '../setup';\n\n/**\n * A core part of an in-house tool called `weaver`.\n *\n * `BakeScene`: This component will notifiy when the global 3D scene is ready.\n *\n * It works by tune in the `useFrame` from `@react-three/fiber`. When the scene is loaded, `useFreame` will fire\n * with ease, the component takes advantage of that, and because `useLoader` is unreliable.\n *\n * This component also accepts 3D elements `children` to be rendered directly to the canvas with some camera options.\n * But you don't have to put every 3D components inside the baker, for example, `SceneSync`s in the page are also\n * being watched by this component.\n *\n * The route renderer **CAN'T** detect if the page has 3D elements or not, so if a page uses any sort of 3D rendering,\n * this component **MUST** be a children iniside `Pipeline` (`index.tsx`), then pass the state value that bake changes\n * to `Pipeline`'s `contentReady` in order for the `BakeScene` to work behind loading fallback screen.\n */\nexport default function BakeScene(props: {\n children?: ReactNode;\n sceneReady: boolean;\n tunnelIn?: BasicTunnelIn;\n loadTaskDelay?: number;\n setSceneReady: Dispatch<SetStateAction<boolean>>;\n onReady?: () => void;\n}) {\n const unique = useId();\n const pipeObjects = useId();\n\n const TunnelIn = props.tunnelIn ?? weaverSetup._Default3DTunnelIn;\n\n if (!TunnelIn) {\n throw Error(\n 'Failed to find a tunnel to use. Consider setting a default tunnel.'\n );\n }\n\n return (\n <TunnelIn>\n <Fragment key={pipeObjects}>{props.children}</Fragment>\n <NotificationHandler\n key={unique}\n callback={props.onReady}\n sceneReady={props.sceneReady}\n setSceneReady={props.setSceneReady}\n />\n </TunnelIn>\n );\n}\n\nfunction NotificationHandler(props: {\n callback?: (isSceneReady: boolean) => void;\n sceneReady: boolean;\n setSceneReady: (value: boolean) => void;\n}) {\n /**\n * `useFrame` is expensive for something that only triggers once, so yea,\n * we'll remove the notification as soon as the job is done.\n */\n return !props.sceneReady && <RenderNotification {...props} />;\n}\n\nfunction RenderNotification(props: {\n callback?: (isSceneReady: boolean) => void;\n sceneReady: boolean;\n loadTaskDelay?: number;\n setSceneReady: (value: boolean) => void;\n}) {\n const scheduledForCallback = useRef(false);\n\n useFrame(() => {\n if (!props.sceneReady && !scheduledForCallback.current) {\n scheduledForCallback.current = true;\n setTimeout(() => {\n if (props.callback) {\n props.callback(true);\n }\n props.setSceneReady(true);\n }, props.loadTaskDelay ?? 50);\n }\n });\n\n return null;\n}\n","import Lenis from 'lenis';\nimport { ReactNode } from 'react';\n\nexport type BasicTunnelIn = ({ children }: { children: ReactNode }) => null;\n\nclass WeaverSetup {\n /**\n * This variable is handled internally by weaver. **Do not use**.\n */\n get _lenisInstance(): Lenis | undefined {\n return (globalThis as any).__weaverLenis;\n }\n set _lenisInstance(val: Lenis | undefined) {\n (globalThis as any).__weaverLenis = val;\n }\n\n /**\n * This variable is handled internally by weaver. **Do not use**.\n */\n get _Default3DTunnelIn(): BasicTunnelIn | undefined {\n return (globalThis as any).__weaver3DTunnel;\n }\n set _Default3DTunnelIn(val: BasicTunnelIn | undefined) {\n (globalThis as any).__weaver3DTunnel = val;\n }\n\n setLenisInstance(instance: Lenis) {\n this._lenisInstance = instance;\n }\n set3DTunnel(tunnelIn: BasicTunnelIn) {\n this._Default3DTunnelIn = tunnelIn;\n }\n}\n\nexport const weaverSetup = new WeaverSetup();\n","import { Hud } from '@react-three/drei';\nimport { useThree, type Viewport } from '@react-three/fiber';\nimport { cancelFrame, frame } from 'motion/react';\nimport React, {\n type ReactNode,\n type RefObject,\n useCallback,\n useId,\n useLayoutEffect,\n useRef,\n useState,\n} from 'react';\nimport { Group } from 'three';\nimport { useLayoutEffectOnce } from '../hooks/effectOnce';\nimport { useLenisCallback } from '../hooks/lenisCallback';\nimport { useOrbit } from '../hooks/orbit';\nimport { BasicTunnelIn, weaverSetup } from '../setup';\n\nexport type Basic3DTransforms = {\n scale: {\n set: (x: number, y: number, z: number) => void;\n };\n position: {\n x: number;\n y: number;\n };\n};\n\ninterface SyncProps {\n /**\n * HTML element ref that `<SceneSync />` will use to sync with the scene.\n *\n * ```tsx\n * <div ref={container} />\n * <SceneSync attach={container}>\n * <group />\n * </SceneSync>\n * ```\n */\n attach: RefObject<HTMLElement | null>;\n\n /**\n * This variable allows fine-grain control over your scene when passed to `<SceneSync />`.\n *\n * `<SceneSync />` will use its own ref and group when creating your scene to control its scale and position.\n * Setting this variable will disable the internal ref, and you can decide on which object gets controlled.\n *\n * This variable is needed for `hud` if you wanted to add a custom camera.\n *\n * For listening to change details, use `onLayoutChange` instead.\n */\n control?: RefObject<Basic3DTransforms | null>;\n\n /**\n * When this variable is set, `<SceneSync />` will send updates when the scene update its positions.\n *\n * The function return the calculated DOM rect, with dimension and position in 3D measurements.\n */\n onLayoutUpdate?: (\n rect: DOMRect,\n dimension: { w: number; h: number },\n position: { x: number; y: number }\n ) => void;\n\n /**\n * Use `Hud` for this scene or not.\n *\n * This is useful when you want to apply custom camera for this scene, or renders multiple scenes on each other.\n *\n * NOTE: When setting a custom camera, the `control` variable must also be set and mount to your scene, not related to the camera\n * to avoid unwanted behavior.\n *\n * `<SceneSync />` groups children passed to it by default, so the camera is also in the group, when syncer updates the group,\n * the camera is also change, ruining the effect.\n */\n hud?: boolean;\n\n /**\n * Control the scene's scaling when positioning.\n */\n scaleFactor?: number;\n\n /**\n * `<SceneSync />` avoid stretching the object by default by using the smallest dimension of the DOM element.\n *\n * This variable will tell `<SceneSync />` to stretch it anyways.\n */\n stretch?: boolean;\n\n /**\n * Disable automatic scaling on the object.\n *\n * This variable will also disable any scaling settings like `stretch` and `scaleFactor`.\n */\n disableScaling?: boolean;\n\n /**\n * `<SceneSync />` will depend on this variable to adjust how it should update.\n *\n * There are 3 modes: `relaxed`, `balanced` and `aggressive`.\n *\n * For each mode, there will be some very distinct trade-offs\n *\n * - `relaxed`: Uses IntersectionObserver paired with a scroll hook, together with ResizeObserver.\n * - (+): Minimal update calls, best performance.\n * - (-): The scene get desynced the moment DOM element moves without changing its sizes.\n * When the scene bleeds out of the DOM element too much, if IntersectionObserver reported that the DOM element\n * is out of view, the scene that did not fully moved out of view will stay there, as scroll hook will be disabled.\n * - `balanced`: Uses IntersectionObserver paired with frame-based update, together with ResizeObserver.\n * - (+): Just enough update calls to allow the DOM element to move freely while maintain aceptable performance.\n * - (-): It will update on every frame when the object gets into view as reported by IntersectionObserver. And the same\n * problem with `relaxed` mode when the scene bleeds out too much.\n * - `aggressive`: Frame-based update only. This mode is like how `<View />` from `@react-three/drei` kepts track of DOM elements.\n * - (+): Designed for precise element <-> scene updates. Can't be desynced, if desynced, that's a bug.\n * - (-): This is frame-based. It will fire updates as long as the scene is still mounted. Too many scenes with this\n * mode enabled is not a good idea. Acceptable amount would be 3 scenes with this mode.\n *\n * Best of both worlds is `balanced` mode, for simpler scenes that doesn't change its position, `relaxed` should be used.\n */\n trackingMode: 'relaxed' | 'balanced' | 'aggressive';\n\n /**\n * Set a custom tunnel for `<SceneSync />` send the components to for this scene only.\n *\n * Which is useful for example, put the objects inside a container in the scene.\n *\n * To set a default tunnel, pass it to `setDefaulTunnel` before use.\n */\n tunnelIn?: BasicTunnelIn;\n\n children: ReactNode;\n}\n\ninterface HudProps extends SyncProps {\n hud: true;\n /**\n * Set the `renderPriority` to render things for `Hud`.\n *\n * This variable is ignored when `hud` is not `true`.\n */\n hudRenderPriority: number;\n}\n\ninterface NormalProps extends SyncProps {\n hud?: false;\n}\n\n/**\n * A core part of an in-house tool called `weaver`.\n *\n * A component to allow three objects to track and sync with DOM element.\n *\n * The component uses `<Hud />` under the \"hud\", so if you want to use more than one `<SceneSync />`,\n * you must set `renderPriority`. If not, the component will render the last scene pushed through React.\n */\nexport default function SceneSync(props: NormalProps | HudProps) {\n if (!weaverSetup._lenisInstance) {\n throw Error(\n \"SceneSync won't work without a lenis instance. Provide one via weaverSetup.setLenisInstance\"\n );\n }\n\n const unique = useId();\n\n const TunnelIn = props.tunnelIn ?? weaverSetup._Default3DTunnelIn;\n\n if (!TunnelIn) {\n throw Error(\n 'Failed to find a tunnel to use. Consider setting a default tunnel.'\n );\n }\n\n if (props.hud) {\n return (\n <TunnelIn>\n <Hud key={unique} renderPriority={props.hudRenderPriority}>\n <SyncInternal {...props} />\n </Hud>\n </TunnelIn>\n );\n }\n\n return (\n <TunnelIn>\n <SyncInternal key={unique} {...props} />\n </TunnelIn>\n );\n}\n\nfunction SyncInternal(props: SyncProps) {\n const { viewport, camera } = useThree();\n\n const defaultControl = useRef<Group>(null);\n const {\n attach,\n control,\n scaleFactor,\n stretch,\n disableScaling,\n onLayoutUpdate,\n } = props;\n\n const properties: RefObject<{\n viewport?: Omit<Viewport, 'dpr' | 'initialDpr'>;\n }> = useRef({\n viewport: undefined,\n });\n\n const updatePosition = useCallback(() => {\n const activeControl = control ?? defaultControl;\n\n const vp = properties.current.viewport;\n if (!vp) return;\n\n const domRect = attach.current!.getBoundingClientRect();\n const screenH = document.documentElement.clientHeight;\n const screenW = document.body.clientWidth;\n\n const vpWidthRatio = vp.width / screenW;\n const vpHeightRatio = vp.height / screenH;\n\n const scrollOffset =\n (weaverSetup._lenisInstance!.actualScroll / screenH) * vp.height;\n\n const w = domRect.width * vpWidthRatio;\n const h = domRect.height * vpHeightRatio;\n\n const x = domRect.x * vpWidthRatio + w * 0.5 - vp.width * 0.5;\n const y =\n vp.height * 0.5 -\n (domRect.y + weaverSetup._lenisInstance!.actualScroll) * vpHeightRatio -\n h * 0.5 +\n scrollOffset;\n\n if (onLayoutUpdate) {\n onLayoutUpdate(domRect, { w, h }, { x, y });\n }\n\n const unwrapedScaleFactor = scaleFactor ?? 1;\n\n if (!disableScaling) {\n if (!stretch) {\n const minScale = Math.min(w, h) * unwrapedScaleFactor;\n activeControl.current!.scale.set(minScale, minScale, minScale);\n } else {\n activeControl.current!.scale.set(\n w * unwrapedScaleFactor,\n h * unwrapedScaleFactor,\n Math.min(w, h) * unwrapedScaleFactor\n );\n }\n }\n\n // eslint-disable-next-line react-hooks/immutability\n activeControl.current!.position.x = x;\n activeControl.current!.position.y = y;\n }, [attach, onLayoutUpdate, control, scaleFactor, disableScaling, stretch]);\n\n /**\n * Update position when `camera` changes.\n */\n useLayoutEffect(() => {\n properties.current.viewport = viewport.getCurrentViewport(camera);\n updatePosition();\n }, [camera, updatePosition, viewport]);\n\n const graceUpdate = useCallback(() => {\n try {\n updatePosition();\n } catch {\n /* empty */\n }\n }, [updatePosition]);\n\n const mode = {\n relaxed: (\n <RelaxedUpdate attach={props.attach} updatePosition={graceUpdate} />\n ),\n balanced: (\n <BalancedUpdate attach={props.attach} updatePosition={graceUpdate} />\n ),\n aggressive: <AggressiveUpdate updatePosition={graceUpdate} />,\n };\n\n if (props.control) {\n return (\n <>\n {props.children}\n {mode[props.trackingMode]}\n </>\n );\n }\n\n return (\n <group ref={defaultControl}>\n {props.children}\n {mode[props.trackingMode]}\n </group>\n );\n}\n\nfunction RelaxedUpdate(props: {\n attach: RefObject<HTMLElement | null>;\n updatePosition: () => void;\n}) {\n const { updatePosition } = props;\n\n /**\n * Scroll hook to update object correctly to the current HTML scroll position.\n */\n useLenisCallback(updatePosition, {\n initialCall: true,\n intersectOn: props.attach,\n });\n\n /**\n * Allows the element to resize too.\n */\n useOrbit({\n target: props.attach,\n events: {\n onIntersect: updatePosition,\n onResize: updatePosition,\n },\n });\n\n useLayoutEffectOnce(updatePosition);\n return null;\n}\n\nfunction BalancedUpdate(props: {\n attach: RefObject<HTMLElement | null>;\n updatePosition: () => void;\n}) {\n const { updatePosition } = props;\n\n const [shouldUpdate, setShouldUpdate] = useState(false);\n\n useOrbit({\n target: props.attach,\n events: {\n onIntersect(entry) {\n setShouldUpdate(entry.isIntersecting);\n },\n onResize: updatePosition,\n },\n rootMargin: '50% 0px 50% 0px',\n });\n\n useLayoutEffect(() => {\n if (shouldUpdate) {\n frame.read(updatePosition, true);\n } else {\n cancelFrame(updatePosition);\n }\n\n return () => {\n cancelFrame(updatePosition);\n };\n }, [updatePosition, shouldUpdate]);\n\n useLayoutEffectOnce(updatePosition);\n return null;\n}\n\nfunction AggressiveUpdate(props: { updatePosition: () => void }) {\n const { updatePosition } = props;\n\n useLayoutEffect(() => {\n frame.read(updatePosition, true);\n\n return () => {\n cancelFrame(updatePosition);\n };\n }, [updatePosition]);\n\n return null;\n}\n","import { useEffect, useLayoutEffect } from 'react';\n\nexport function useEffectOnce(callback: React.EffectCallback) {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n useEffect(callback, []);\n}\n\nexport function useLayoutEffectOnce(callback: React.EffectCallback) {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n useLayoutEffect(callback, []);\n}\n","import { type RefObject, useCallback, useLayoutEffect, useMemo } from 'react';\nimport { weaverSetup } from '../setup';\nimport { useOrbit } from './orbit';\n\ninterface HookOptions {\n /**\n * Hook will report when first initialized without waiting for scroll event to actually happens.\n */\n initialCall?: boolean;\n /**\n * Set an element to only call when the element is actually entering the viewport (with 25% `rootMargin`).\n */\n intersectOn?: RefObject<HTMLOrSVGElement | null>;\n}\n\nexport const scrollCallbackReason = {\n Resize: 'resize',\n Scroll: 'scroll',\n Initialize: 'initialize',\n} as const;\nexport type ScrollCallbackReason =\n (typeof scrollCallbackReason)[keyof typeof scrollCallbackReason];\n\ntype Callback = (latest: number, reason: ScrollCallbackReason) => void;\n\nexport function useLenisCallback(callback: Callback, options?: HookOptions) {\n if (!weaverSetup._lenisInstance) {\n throw Error(\n \"useLenisCallback won't work without a lenis instance. Provide one via weaverSetup.setLenisInstance\"\n );\n }\n\n const callbackWrapScroll = useCallback(\n () =>\n callback(\n weaverSetup._lenisInstance!.actualScroll,\n scrollCallbackReason.Scroll\n ),\n [callback]\n );\n const callbackWrapResize = useCallback(\n () =>\n callback(\n weaverSetup._lenisInstance!.actualScroll,\n scrollCallbackReason.Resize\n ),\n [callback]\n );\n\n const intersectOn = useMemo(\n () => options?.intersectOn,\n [options?.intersectOn]\n );\n const initialCall = useMemo(\n () => options?.initialCall,\n [options?.initialCall]\n );\n\n useOrbit({\n target: intersectOn as RefObject<HTMLElement | null> | undefined,\n events: {\n onIntersect(entry) {\n if (entry.isIntersecting) {\n weaverSetup._lenisInstance!.on('scroll', callbackWrapScroll);\n window.addEventListener('resize', callbackWrapResize);\n } else {\n weaverSetup._lenisInstance!.off('scroll', callbackWrapScroll);\n window.removeEventListener('resize', callbackWrapResize);\n }\n },\n },\n rootMargin: '50% 0px 50% 0px',\n });\n\n useLayoutEffect(() => {\n if (!intersectOn) {\n weaverSetup._lenisInstance!.on('scroll', callbackWrapScroll);\n window.addEventListener('resize', callbackWrapResize);\n }\n\n if (initialCall) {\n callback(\n weaverSetup._lenisInstance!.actualScroll,\n scrollCallbackReason.Initialize\n );\n }\n\n return () => {\n weaverSetup._lenisInstance!.off('scroll', callbackWrapScroll);\n window.removeEventListener('resize', callbackWrapResize);\n };\n }, [\n callback,\n callbackWrapResize,\n callbackWrapScroll,\n initialCall,\n intersectOn,\n ]);\n}\n","import { type RefObject, useLayoutEffect } from 'react';\n\n/**\n * A simple Orbit hook.\n *\n * @param target HTML element ref to attach to.\n * @param events Specify which events should the orbit tracks.\n */\nexport function useOrbit(options: {\n target?: RefObject<HTMLElement | null>;\n events: {\n onResize?: (entry: ResizeObserverEntry) => void;\n onIntersect?: (entry: IntersectionObserverEntry) => void;\n };\n rootMargin?: string;\n}) {\n const { onResize, onIntersect } = options.events;\n const { rootMargin = '25% 0px 25% 0px' } = options;\n\n useLayoutEffect(() => {\n if (!options.target) return;\n if (!options.target.current) return;\n\n let orbitResize = undefined;\n if (onResize) {\n orbitResize = new ResizeObserver((entries) => onResize(entries[0]));\n orbitResize.observe(options.target.current);\n }\n let orbitIntersect = undefined;\n if (onIntersect) {\n orbitIntersect = new IntersectionObserver(\n (entries) => onIntersect(entries[0]),\n { rootMargin }\n );\n orbitIntersect.observe(options.target.current);\n }\n\n return () => {\n orbitResize?.disconnect();\n orbitIntersect?.disconnect();\n };\n }, [onIntersect, onResize, rootMargin, options.target]);\n}\n"],"mappings":"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","names":["React","import_fiber","import_react","import_react","import_react","import_react","React"]}
|
|
1
|
+
{"version":3,"sources":["../src/scene/index.ts","../src/scene/BakeScene.tsx","../src/setup.ts","../src/scene/SceneSync.tsx","../src/hooks/effectOnce.ts","../src/hooks/lenisCallback.ts","../src/hooks/orbit.ts"],"sourcesContent":["import BakeScene from './BakeScene';\nimport SceneSync from './SceneSync';\n\nexport { BakeScene, SceneSync };\n","import { useFrame } from '@react-three/fiber';\nimport React, {\n type Dispatch,\n Fragment,\n type ReactNode,\n type SetStateAction,\n useId,\n useRef,\n} from 'react';\nimport { BasicTunnelIn, weaverSetup } from '../setup';\n\n/**\n * A core part of an in-house tool called `weaver`.\n *\n * `BakeScene`: This component will notifiy when the global 3D scene is ready.\n *\n * It works by tune in the `useFrame` from `@react-three/fiber`. When the scene is loaded, `useFreame` will fire\n * with ease, the component takes advantage of that, and because `useLoader` is unreliable.\n *\n * This component also accepts 3D elements `children` to be rendered directly to the canvas with some camera options.\n * But you don't have to put every 3D components inside the baker, for example, `SceneSync`s in the page are also\n * being watched by this component.\n *\n * The route renderer **CAN'T** detect if the page has 3D elements or not, so if a page uses any sort of 3D rendering,\n * this component **MUST** be a children iniside `Pipeline` (`index.tsx`), then pass the state value that bake changes\n * to `Pipeline`'s `contentReady` in order for the `BakeScene` to work behind loading fallback screen.\n */\nexport default function BakeScene(props: {\n children?: ReactNode;\n sceneReady: boolean;\n tunnelIn?: BasicTunnelIn;\n loadTaskDelay?: number;\n setSceneReady: Dispatch<SetStateAction<boolean>>;\n onReady?: () => void;\n}) {\n const unique = useId();\n const pipeObjects = useId();\n\n const TunnelIn = props.tunnelIn ?? weaverSetup._Default3DTunnelIn;\n\n if (!TunnelIn) {\n throw Error(\n 'Failed to find a tunnel to use. Consider setting a default tunnel.'\n );\n }\n\n return (\n <TunnelIn>\n <Fragment key={pipeObjects}>{props.children}</Fragment>\n <NotificationHandler\n key={unique}\n callback={props.onReady}\n sceneReady={props.sceneReady}\n setSceneReady={props.setSceneReady}\n />\n </TunnelIn>\n );\n}\n\nfunction NotificationHandler(props: {\n callback?: (isSceneReady: boolean) => void;\n sceneReady: boolean;\n setSceneReady: (value: boolean) => void;\n}) {\n /**\n * `useFrame` is expensive for something that only triggers once, so yea,\n * we'll remove the notification as soon as the job is done.\n */\n return !props.sceneReady && <RenderNotification {...props} />;\n}\n\nfunction RenderNotification(props: {\n callback?: (isSceneReady: boolean) => void;\n sceneReady: boolean;\n loadTaskDelay?: number;\n setSceneReady: (value: boolean) => void;\n}) {\n const scheduledForCallback = useRef(false);\n\n useFrame(() => {\n if (!props.sceneReady && !scheduledForCallback.current) {\n scheduledForCallback.current = true;\n setTimeout(() => {\n if (props.callback) {\n props.callback(true);\n }\n props.setSceneReady(true);\n }, props.loadTaskDelay ?? 50);\n }\n });\n\n return null;\n}\n","import Lenis from 'lenis';\nimport { ReactNode } from 'react';\n\nexport type BasicTunnelIn = ({ children }: { children: ReactNode }) => null;\n\nclass WeaverSetup {\n /**\n * This variable is handled internally by weaver. **Do not use**.\n */\n get _lenisInstance(): Lenis | undefined {\n return (globalThis as any).__weaverLenis;\n }\n set _lenisInstance(val: Lenis | undefined) {\n (globalThis as any).__weaverLenis = val;\n }\n\n /**\n * This variable is handled internally by weaver. **Do not use**.\n */\n get _Default3DTunnelIn(): BasicTunnelIn | undefined {\n return (globalThis as any).__weaver3DTunnel;\n }\n set _Default3DTunnelIn(val: BasicTunnelIn | undefined) {\n (globalThis as any).__weaver3DTunnel = val;\n }\n\n setLenisInstance(instance: Lenis) {\n this._lenisInstance = instance;\n }\n set3DTunnel(tunnelIn: BasicTunnelIn) {\n this._Default3DTunnelIn = tunnelIn;\n }\n}\n\nexport const weaverSetup = new WeaverSetup();\n","import { Hud } from '@react-three/drei';\nimport { useThree, type Viewport } from '@react-three/fiber';\nimport { cancelFrame, frame } from 'motion/react';\nimport React, {\n type ReactNode,\n type RefObject,\n useCallback,\n useId,\n useLayoutEffect,\n useRef,\n useState,\n} from 'react';\nimport { Group } from 'three';\nimport { useLayoutEffectOnce } from '../hooks/effectOnce';\nimport { useLenisCallback } from '../hooks/lenisCallback';\nimport { useOrbit } from '../hooks/orbit';\nimport { BasicTunnelIn, weaverSetup } from '../setup';\n\nexport type Basic3DTransforms = {\n scale: {\n set: (x: number, y: number, z: number) => void;\n };\n position: {\n x: number;\n y: number;\n };\n};\n\ninterface SyncProps {\n /**\n * HTML element ref that `<SceneSync />` will use to sync with the scene.\n *\n * ```tsx\n * <div ref={container} />\n * <SceneSync attach={container}>\n * <group />\n * </SceneSync>\n * ```\n */\n attach: RefObject<HTMLElement | null>;\n\n /**\n * This variable allows fine-grain control over your scene when passed to `<SceneSync />`.\n *\n * `<SceneSync />` will use its own ref and group when creating your scene to control its scale and position.\n * Setting this variable will disable the internal ref, and you can decide on which object gets controlled.\n *\n * This variable is needed for `hud` if you wanted to add a custom camera.\n *\n * For listening to change details, use `onLayoutChange` instead.\n */\n control?: RefObject<Basic3DTransforms | null>;\n\n /**\n * When this variable is set, `<SceneSync />` will send updates when the scene update its positions.\n *\n * The function return the calculated DOM rect, with dimension and position in 3D measurements.\n */\n onLayoutUpdate?: (\n rect: DOMRect,\n dimension: { w: number; h: number },\n position: { x: number; y: number }\n ) => void;\n\n /**\n * Use `Hud` for this scene or not.\n *\n * This is useful when you want to apply custom camera for this scene, or renders multiple scenes on each other.\n *\n * NOTE: When setting a custom camera, the `control` variable must also be set and mount to your scene, not related to the camera\n * to avoid unwanted behavior.\n *\n * `<SceneSync />` groups children passed to it by default, so the camera is also in the group, when syncer updates the group,\n * the camera is also change, ruining the effect.\n */\n hud?: boolean;\n\n /**\n * Control the scene's scaling when positioning.\n */\n scaleFactor?: number;\n\n /**\n * `<SceneSync />` avoid stretching the object by default by using the smallest dimension of the DOM element.\n *\n * This variable will tell `<SceneSync />` to stretch it anyways.\n */\n stretch?: boolean;\n\n /**\n * Disable automatic scaling on the object.\n *\n * This variable will also disable any scaling settings like `stretch` and `scaleFactor`.\n */\n disableScaling?: boolean;\n\n /**\n * `<SceneSync />` will depend on this variable to adjust how it should update.\n *\n * There are 3 modes: `relaxed`, `balanced` and `aggressive`.\n *\n * For each mode, there will be some very distinct trade-offs\n *\n * - `relaxed`: Uses IntersectionObserver paired with a scroll hook, together with ResizeObserver.\n * - (+): Minimal update calls, best performance.\n * - (-): The scene get desynced the moment DOM element moves without changing its sizes.\n * When the scene bleeds out of the DOM element too much, if IntersectionObserver reported that the DOM element\n * is out of view, the scene that did not fully moved out of view will stay there, as scroll hook will be disabled.\n * - `balanced`: Uses IntersectionObserver paired with frame-based update, together with ResizeObserver.\n * - (+): Just enough update calls to allow the DOM element to move freely while maintain aceptable performance.\n * - (-): It will update on every frame when the object gets into view as reported by IntersectionObserver. And the same\n * problem with `relaxed` mode when the scene bleeds out too much.\n * - `aggressive`: Frame-based update only. This mode is like how `<View />` from `@react-three/drei` kepts track of DOM elements.\n * - (+): Designed for precise element <-> scene updates. Can't be desynced, if desynced, that's a bug.\n * - (-): This is frame-based. It will fire updates as long as the scene is still mounted. Too many scenes with this\n * mode enabled is not a good idea. Acceptable amount would be 3 scenes with this mode.\n *\n * Best of both worlds is `balanced` mode, for simpler scenes that doesn't change its position, `relaxed` should be used.\n */\n trackingMode: 'relaxed' | 'balanced' | 'aggressive';\n\n /**\n * Set a custom tunnel for `<SceneSync />` send the components to for this scene only.\n *\n * Which is useful for example, put the objects inside a container in the scene.\n *\n * To set a default tunnel, pass it to `setDefaulTunnel` before use.\n */\n tunnelIn?: BasicTunnelIn;\n\n children: ReactNode;\n}\n\ninterface HudProps extends SyncProps {\n hud: true;\n /**\n * Set the `renderPriority` to render things for `Hud`.\n *\n * This variable is ignored when `hud` is not `true`.\n */\n hudRenderPriority: number;\n}\n\ninterface NormalProps extends SyncProps {\n hud?: false;\n}\n\n/**\n * A core part of an in-house tool called `weaver`.\n *\n * A component to allow three objects to track and sync with DOM element.\n *\n * The component uses `<Hud />` under the \"hud\", so if you want to use more than one `<SceneSync />`,\n * you must set `renderPriority`. If not, the component will render the last scene pushed through React.\n */\nexport default function SceneSync(props: NormalProps | HudProps) {\n if (!weaverSetup._lenisInstance) {\n throw Error(\n \"SceneSync won't work without a lenis instance. Provide one via weaverSetup.setLenisInstance\"\n );\n }\n\n const unique = useId();\n\n const TunnelIn = props.tunnelIn ?? weaverSetup._Default3DTunnelIn;\n\n if (!TunnelIn) {\n throw Error(\n 'Failed to find a tunnel to use. Consider setting a default tunnel.'\n );\n }\n\n if (props.hud) {\n return (\n <TunnelIn>\n <Hud key={unique} renderPriority={props.hudRenderPriority}>\n <SyncInternal {...props} />\n </Hud>\n </TunnelIn>\n );\n }\n\n return (\n <TunnelIn>\n <SyncInternal key={unique} {...props} />\n </TunnelIn>\n );\n}\n\nfunction SyncInternal(props: SyncProps) {\n const { viewport, camera } = useThree();\n\n const defaultControl = useRef<Group>(null);\n const {\n attach,\n control,\n scaleFactor,\n stretch,\n disableScaling,\n onLayoutUpdate,\n } = props;\n\n const properties: RefObject<{\n viewport?: Omit<Viewport, 'dpr' | 'initialDpr'>;\n }> = useRef({\n viewport: undefined,\n });\n\n const updatePosition = useCallback(() => {\n const activeControl = control ?? defaultControl;\n\n const vp = properties.current.viewport;\n if (!vp) return;\n\n const domRect = attach.current!.getBoundingClientRect();\n const screenH = window.innerHeight;\n const screenW = window.innerWidth;\n\n const vpWidthRatio = vp.width / screenW;\n const vpHeightRatio = vp.height / screenH;\n\n const scrollOffset =\n (weaverSetup._lenisInstance!.actualScroll / screenH) * vp.height;\n\n const w = domRect.width * vpWidthRatio;\n const h = domRect.height * vpHeightRatio;\n\n const x = domRect.x * vpWidthRatio + w * 0.5 - vp.width * 0.5;\n const y =\n vp.height * 0.5 -\n (domRect.y + weaverSetup._lenisInstance!.actualScroll) * vpHeightRatio -\n h * 0.5 +\n scrollOffset;\n\n if (onLayoutUpdate) {\n onLayoutUpdate(domRect, { w, h }, { x, y });\n }\n\n const unwrapedScaleFactor = scaleFactor ?? 1;\n\n if (!disableScaling) {\n if (!stretch) {\n const minScale = Math.min(w, h) * unwrapedScaleFactor;\n activeControl.current!.scale.set(minScale, minScale, minScale);\n } else {\n activeControl.current!.scale.set(\n w * unwrapedScaleFactor,\n h * unwrapedScaleFactor,\n Math.min(w, h) * unwrapedScaleFactor\n );\n }\n }\n\n // eslint-disable-next-line react-hooks/immutability\n activeControl.current!.position.x = x;\n activeControl.current!.position.y = y;\n }, [attach, onLayoutUpdate, control, scaleFactor, disableScaling, stretch]);\n\n /**\n * Update position when `camera` changes.\n */\n useLayoutEffect(() => {\n properties.current.viewport = viewport.getCurrentViewport(camera);\n updatePosition();\n }, [camera, updatePosition, viewport]);\n\n const graceUpdate = useCallback(() => {\n try {\n updatePosition();\n } catch {\n /* empty */\n }\n }, [updatePosition]);\n\n const mode = {\n relaxed: (\n <RelaxedUpdate attach={props.attach} updatePosition={graceUpdate} />\n ),\n balanced: (\n <BalancedUpdate attach={props.attach} updatePosition={graceUpdate} />\n ),\n aggressive: <AggressiveUpdate updatePosition={graceUpdate} />,\n };\n\n if (props.control) {\n return (\n <>\n {props.children}\n {mode[props.trackingMode]}\n </>\n );\n }\n\n return (\n <group ref={defaultControl}>\n {props.children}\n {mode[props.trackingMode]}\n </group>\n );\n}\n\nfunction RelaxedUpdate(props: {\n attach: RefObject<HTMLElement | null>;\n updatePosition: () => void;\n}) {\n const { updatePosition } = props;\n\n /**\n * Scroll hook to update object correctly to the current HTML scroll position.\n */\n useLenisCallback(updatePosition, {\n initialCall: true,\n intersectOn: props.attach,\n });\n\n /**\n * Allows the element to resize too.\n */\n useOrbit({\n target: props.attach,\n events: {\n onIntersect: updatePosition,\n onResize: updatePosition,\n },\n });\n\n useLayoutEffectOnce(updatePosition);\n return null;\n}\n\nfunction BalancedUpdate(props: {\n attach: RefObject<HTMLElement | null>;\n updatePosition: () => void;\n}) {\n const { updatePosition } = props;\n\n const [shouldUpdate, setShouldUpdate] = useState(false);\n\n useOrbit({\n target: props.attach,\n events: {\n onIntersect(entry) {\n setShouldUpdate(entry.isIntersecting);\n },\n onResize: updatePosition,\n },\n rootMargin: '50% 0px 50% 0px',\n });\n\n useLayoutEffect(() => {\n if (shouldUpdate) {\n frame.read(updatePosition, true);\n } else {\n cancelFrame(updatePosition);\n }\n\n return () => {\n cancelFrame(updatePosition);\n };\n }, [updatePosition, shouldUpdate]);\n\n useLayoutEffectOnce(updatePosition);\n return null;\n}\n\nfunction AggressiveUpdate(props: { updatePosition: () => void }) {\n const { updatePosition } = props;\n\n useLayoutEffect(() => {\n frame.read(updatePosition, true);\n\n return () => {\n cancelFrame(updatePosition);\n };\n }, [updatePosition]);\n\n return null;\n}\n","import { useEffect, useLayoutEffect } from 'react';\n\nexport function useEffectOnce(callback: React.EffectCallback) {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n useEffect(callback, []);\n}\n\nexport function useLayoutEffectOnce(callback: React.EffectCallback) {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n useLayoutEffect(callback, []);\n}\n","import { type RefObject, useCallback, useLayoutEffect, useMemo } from 'react';\nimport { weaverSetup } from '../setup';\nimport { useOrbit } from './orbit';\n\ninterface HookOptions {\n /**\n * Hook will report when first initialized without waiting for scroll event to actually happens.\n */\n initialCall?: boolean;\n /**\n * Set an element to only call when the element is actually entering the viewport (with 25% `rootMargin`).\n */\n intersectOn?: RefObject<HTMLOrSVGElement | null>;\n}\n\nexport const scrollCallbackReason = {\n Resize: 'resize',\n Scroll: 'scroll',\n Initialize: 'initialize',\n} as const;\nexport type ScrollCallbackReason =\n (typeof scrollCallbackReason)[keyof typeof scrollCallbackReason];\n\ntype Callback = (latest: number, reason: ScrollCallbackReason) => void;\n\nexport function useLenisCallback(callback: Callback, options?: HookOptions) {\n if (!weaverSetup._lenisInstance) {\n throw Error(\n \"useLenisCallback won't work without a lenis instance. Provide one via weaverSetup.setLenisInstance\"\n );\n }\n\n const callbackWrapScroll = useCallback(\n () =>\n callback(\n weaverSetup._lenisInstance!.actualScroll,\n scrollCallbackReason.Scroll\n ),\n [callback]\n );\n const callbackWrapResize = useCallback(\n () =>\n callback(\n weaverSetup._lenisInstance!.actualScroll,\n scrollCallbackReason.Resize\n ),\n [callback]\n );\n\n const intersectOn = useMemo(\n () => options?.intersectOn,\n [options?.intersectOn]\n );\n const initialCall = useMemo(\n () => options?.initialCall,\n [options?.initialCall]\n );\n\n useOrbit({\n target: intersectOn as RefObject<HTMLElement | null> | undefined,\n events: {\n onIntersect(entry) {\n if (entry.isIntersecting) {\n weaverSetup._lenisInstance!.on('scroll', callbackWrapScroll);\n window.addEventListener('resize', callbackWrapResize);\n } else {\n weaverSetup._lenisInstance!.off('scroll', callbackWrapScroll);\n window.removeEventListener('resize', callbackWrapResize);\n }\n },\n },\n rootMargin: '50% 0px 50% 0px',\n });\n\n useLayoutEffect(() => {\n if (!intersectOn) {\n weaverSetup._lenisInstance!.on('scroll', callbackWrapScroll);\n window.addEventListener('resize', callbackWrapResize);\n }\n\n if (initialCall) {\n callback(\n weaverSetup._lenisInstance!.actualScroll,\n scrollCallbackReason.Initialize\n );\n }\n\n return () => {\n weaverSetup._lenisInstance!.off('scroll', callbackWrapScroll);\n window.removeEventListener('resize', callbackWrapResize);\n };\n }, [\n callback,\n callbackWrapResize,\n callbackWrapScroll,\n initialCall,\n intersectOn,\n ]);\n}\n","import { type RefObject, useLayoutEffect } from 'react';\n\n/**\n * A simple Orbit hook.\n *\n * @param target HTML element ref to attach to.\n * @param events Specify which events should the orbit tracks.\n */\nexport function useOrbit(options: {\n target?: RefObject<HTMLElement | null>;\n events: {\n onResize?: (entry: ResizeObserverEntry) => void;\n onIntersect?: (entry: IntersectionObserverEntry) => void;\n };\n rootMargin?: string;\n}) {\n const { onResize, onIntersect } = options.events;\n const { rootMargin = '25% 0px 25% 0px' } = options;\n\n useLayoutEffect(() => {\n if (!options.target) return;\n if (!options.target.current) return;\n\n let orbitResize = undefined;\n if (onResize) {\n orbitResize = new ResizeObserver((entries) => onResize(entries[0]));\n orbitResize.observe(options.target.current);\n }\n let orbitIntersect = undefined;\n if (onIntersect) {\n orbitIntersect = new IntersectionObserver(\n (entries) => onIntersect(entries[0]),\n { rootMargin }\n );\n orbitIntersect.observe(options.target.current);\n }\n\n return () => {\n orbitResize?.disconnect();\n orbitIntersect?.disconnect();\n };\n }, [onIntersect, onResize, rootMargin, options.target]);\n}\n"],"mappings":"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","names":["React","import_fiber","import_react","import_react","import_react","import_react","React"]}
|
package/dist/scene.mjs
CHANGED
|
@@ -234,8 +234,8 @@ function SyncInternal(props) {
|
|
|
234
234
|
const vp = properties.current.viewport;
|
|
235
235
|
if (!vp) return;
|
|
236
236
|
const domRect = attach.current.getBoundingClientRect();
|
|
237
|
-
const screenH =
|
|
238
|
-
const screenW =
|
|
237
|
+
const screenH = window.innerHeight;
|
|
238
|
+
const screenW = window.innerWidth;
|
|
239
239
|
const vpWidthRatio = vp.width / screenW;
|
|
240
240
|
const vpHeightRatio = vp.height / screenH;
|
|
241
241
|
const scrollOffset = weaverSetup._lenisInstance.actualScroll / screenH * vp.height;
|
package/dist/scene.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/scene/BakeScene.tsx","../src/setup.ts","../src/scene/SceneSync.tsx","../src/hooks/effectOnce.ts","../src/hooks/lenisCallback.ts","../src/hooks/orbit.ts"],"sourcesContent":["import { useFrame } from '@react-three/fiber';\nimport React, {\n type Dispatch,\n Fragment,\n type ReactNode,\n type SetStateAction,\n useId,\n useRef,\n} from 'react';\nimport { BasicTunnelIn, weaverSetup } from '../setup';\n\n/**\n * A core part of an in-house tool called `weaver`.\n *\n * `BakeScene`: This component will notifiy when the global 3D scene is ready.\n *\n * It works by tune in the `useFrame` from `@react-three/fiber`. When the scene is loaded, `useFreame` will fire\n * with ease, the component takes advantage of that, and because `useLoader` is unreliable.\n *\n * This component also accepts 3D elements `children` to be rendered directly to the canvas with some camera options.\n * But you don't have to put every 3D components inside the baker, for example, `SceneSync`s in the page are also\n * being watched by this component.\n *\n * The route renderer **CAN'T** detect if the page has 3D elements or not, so if a page uses any sort of 3D rendering,\n * this component **MUST** be a children iniside `Pipeline` (`index.tsx`), then pass the state value that bake changes\n * to `Pipeline`'s `contentReady` in order for the `BakeScene` to work behind loading fallback screen.\n */\nexport default function BakeScene(props: {\n children?: ReactNode;\n sceneReady: boolean;\n tunnelIn?: BasicTunnelIn;\n loadTaskDelay?: number;\n setSceneReady: Dispatch<SetStateAction<boolean>>;\n onReady?: () => void;\n}) {\n const unique = useId();\n const pipeObjects = useId();\n\n const TunnelIn = props.tunnelIn ?? weaverSetup._Default3DTunnelIn;\n\n if (!TunnelIn) {\n throw Error(\n 'Failed to find a tunnel to use. Consider setting a default tunnel.'\n );\n }\n\n return (\n <TunnelIn>\n <Fragment key={pipeObjects}>{props.children}</Fragment>\n <NotificationHandler\n key={unique}\n callback={props.onReady}\n sceneReady={props.sceneReady}\n setSceneReady={props.setSceneReady}\n />\n </TunnelIn>\n );\n}\n\nfunction NotificationHandler(props: {\n callback?: (isSceneReady: boolean) => void;\n sceneReady: boolean;\n setSceneReady: (value: boolean) => void;\n}) {\n /**\n * `useFrame` is expensive for something that only triggers once, so yea,\n * we'll remove the notification as soon as the job is done.\n */\n return !props.sceneReady && <RenderNotification {...props} />;\n}\n\nfunction RenderNotification(props: {\n callback?: (isSceneReady: boolean) => void;\n sceneReady: boolean;\n loadTaskDelay?: number;\n setSceneReady: (value: boolean) => void;\n}) {\n const scheduledForCallback = useRef(false);\n\n useFrame(() => {\n if (!props.sceneReady && !scheduledForCallback.current) {\n scheduledForCallback.current = true;\n setTimeout(() => {\n if (props.callback) {\n props.callback(true);\n }\n props.setSceneReady(true);\n }, props.loadTaskDelay ?? 50);\n }\n });\n\n return null;\n}\n","import Lenis from 'lenis';\nimport { ReactNode } from 'react';\n\nexport type BasicTunnelIn = ({ children }: { children: ReactNode }) => null;\n\nclass WeaverSetup {\n /**\n * This variable is handled internally by weaver. **Do not use**.\n */\n get _lenisInstance(): Lenis | undefined {\n return (globalThis as any).__weaverLenis;\n }\n set _lenisInstance(val: Lenis | undefined) {\n (globalThis as any).__weaverLenis = val;\n }\n\n /**\n * This variable is handled internally by weaver. **Do not use**.\n */\n get _Default3DTunnelIn(): BasicTunnelIn | undefined {\n return (globalThis as any).__weaver3DTunnel;\n }\n set _Default3DTunnelIn(val: BasicTunnelIn | undefined) {\n (globalThis as any).__weaver3DTunnel = val;\n }\n\n setLenisInstance(instance: Lenis) {\n this._lenisInstance = instance;\n }\n set3DTunnel(tunnelIn: BasicTunnelIn) {\n this._Default3DTunnelIn = tunnelIn;\n }\n}\n\nexport const weaverSetup = new WeaverSetup();\n","import { Hud } from '@react-three/drei';\nimport { useThree, type Viewport } from '@react-three/fiber';\nimport { cancelFrame, frame } from 'motion/react';\nimport React, {\n type ReactNode,\n type RefObject,\n useCallback,\n useId,\n useLayoutEffect,\n useRef,\n useState,\n} from 'react';\nimport { Group } from 'three';\nimport { useLayoutEffectOnce } from '../hooks/effectOnce';\nimport { useLenisCallback } from '../hooks/lenisCallback';\nimport { useOrbit } from '../hooks/orbit';\nimport { BasicTunnelIn, weaverSetup } from '../setup';\n\nexport type Basic3DTransforms = {\n scale: {\n set: (x: number, y: number, z: number) => void;\n };\n position: {\n x: number;\n y: number;\n };\n};\n\ninterface SyncProps {\n /**\n * HTML element ref that `<SceneSync />` will use to sync with the scene.\n *\n * ```tsx\n * <div ref={container} />\n * <SceneSync attach={container}>\n * <group />\n * </SceneSync>\n * ```\n */\n attach: RefObject<HTMLElement | null>;\n\n /**\n * This variable allows fine-grain control over your scene when passed to `<SceneSync />`.\n *\n * `<SceneSync />` will use its own ref and group when creating your scene to control its scale and position.\n * Setting this variable will disable the internal ref, and you can decide on which object gets controlled.\n *\n * This variable is needed for `hud` if you wanted to add a custom camera.\n *\n * For listening to change details, use `onLayoutChange` instead.\n */\n control?: RefObject<Basic3DTransforms | null>;\n\n /**\n * When this variable is set, `<SceneSync />` will send updates when the scene update its positions.\n *\n * The function return the calculated DOM rect, with dimension and position in 3D measurements.\n */\n onLayoutUpdate?: (\n rect: DOMRect,\n dimension: { w: number; h: number },\n position: { x: number; y: number }\n ) => void;\n\n /**\n * Use `Hud` for this scene or not.\n *\n * This is useful when you want to apply custom camera for this scene, or renders multiple scenes on each other.\n *\n * NOTE: When setting a custom camera, the `control` variable must also be set and mount to your scene, not related to the camera\n * to avoid unwanted behavior.\n *\n * `<SceneSync />` groups children passed to it by default, so the camera is also in the group, when syncer updates the group,\n * the camera is also change, ruining the effect.\n */\n hud?: boolean;\n\n /**\n * Control the scene's scaling when positioning.\n */\n scaleFactor?: number;\n\n /**\n * `<SceneSync />` avoid stretching the object by default by using the smallest dimension of the DOM element.\n *\n * This variable will tell `<SceneSync />` to stretch it anyways.\n */\n stretch?: boolean;\n\n /**\n * Disable automatic scaling on the object.\n *\n * This variable will also disable any scaling settings like `stretch` and `scaleFactor`.\n */\n disableScaling?: boolean;\n\n /**\n * `<SceneSync />` will depend on this variable to adjust how it should update.\n *\n * There are 3 modes: `relaxed`, `balanced` and `aggressive`.\n *\n * For each mode, there will be some very distinct trade-offs\n *\n * - `relaxed`: Uses IntersectionObserver paired with a scroll hook, together with ResizeObserver.\n * - (+): Minimal update calls, best performance.\n * - (-): The scene get desynced the moment DOM element moves without changing its sizes.\n * When the scene bleeds out of the DOM element too much, if IntersectionObserver reported that the DOM element\n * is out of view, the scene that did not fully moved out of view will stay there, as scroll hook will be disabled.\n * - `balanced`: Uses IntersectionObserver paired with frame-based update, together with ResizeObserver.\n * - (+): Just enough update calls to allow the DOM element to move freely while maintain aceptable performance.\n * - (-): It will update on every frame when the object gets into view as reported by IntersectionObserver. And the same\n * problem with `relaxed` mode when the scene bleeds out too much.\n * - `aggressive`: Frame-based update only. This mode is like how `<View />` from `@react-three/drei` kepts track of DOM elements.\n * - (+): Designed for precise element <-> scene updates. Can't be desynced, if desynced, that's a bug.\n * - (-): This is frame-based. It will fire updates as long as the scene is still mounted. Too many scenes with this\n * mode enabled is not a good idea. Acceptable amount would be 3 scenes with this mode.\n *\n * Best of both worlds is `balanced` mode, for simpler scenes that doesn't change its position, `relaxed` should be used.\n */\n trackingMode: 'relaxed' | 'balanced' | 'aggressive';\n\n /**\n * Set a custom tunnel for `<SceneSync />` send the components to for this scene only.\n *\n * Which is useful for example, put the objects inside a container in the scene.\n *\n * To set a default tunnel, pass it to `setDefaulTunnel` before use.\n */\n tunnelIn?: BasicTunnelIn;\n\n children: ReactNode;\n}\n\ninterface HudProps extends SyncProps {\n hud: true;\n /**\n * Set the `renderPriority` to render things for `Hud`.\n *\n * This variable is ignored when `hud` is not `true`.\n */\n hudRenderPriority: number;\n}\n\ninterface NormalProps extends SyncProps {\n hud?: false;\n}\n\n/**\n * A core part of an in-house tool called `weaver`.\n *\n * A component to allow three objects to track and sync with DOM element.\n *\n * The component uses `<Hud />` under the \"hud\", so if you want to use more than one `<SceneSync />`,\n * you must set `renderPriority`. If not, the component will render the last scene pushed through React.\n */\nexport default function SceneSync(props: NormalProps | HudProps) {\n if (!weaverSetup._lenisInstance) {\n throw Error(\n \"SceneSync won't work without a lenis instance. Provide one via weaverSetup.setLenisInstance\"\n );\n }\n\n const unique = useId();\n\n const TunnelIn = props.tunnelIn ?? weaverSetup._Default3DTunnelIn;\n\n if (!TunnelIn) {\n throw Error(\n 'Failed to find a tunnel to use. Consider setting a default tunnel.'\n );\n }\n\n if (props.hud) {\n return (\n <TunnelIn>\n <Hud key={unique} renderPriority={props.hudRenderPriority}>\n <SyncInternal {...props} />\n </Hud>\n </TunnelIn>\n );\n }\n\n return (\n <TunnelIn>\n <SyncInternal key={unique} {...props} />\n </TunnelIn>\n );\n}\n\nfunction SyncInternal(props: SyncProps) {\n const { viewport, camera } = useThree();\n\n const defaultControl = useRef<Group>(null);\n const {\n attach,\n control,\n scaleFactor,\n stretch,\n disableScaling,\n onLayoutUpdate,\n } = props;\n\n const properties: RefObject<{\n viewport?: Omit<Viewport, 'dpr' | 'initialDpr'>;\n }> = useRef({\n viewport: undefined,\n });\n\n const updatePosition = useCallback(() => {\n const activeControl = control ?? defaultControl;\n\n const vp = properties.current.viewport;\n if (!vp) return;\n\n const domRect = attach.current!.getBoundingClientRect();\n const screenH = document.documentElement.clientHeight;\n const screenW = document.body.clientWidth;\n\n const vpWidthRatio = vp.width / screenW;\n const vpHeightRatio = vp.height / screenH;\n\n const scrollOffset =\n (weaverSetup._lenisInstance!.actualScroll / screenH) * vp.height;\n\n const w = domRect.width * vpWidthRatio;\n const h = domRect.height * vpHeightRatio;\n\n const x = domRect.x * vpWidthRatio + w * 0.5 - vp.width * 0.5;\n const y =\n vp.height * 0.5 -\n (domRect.y + weaverSetup._lenisInstance!.actualScroll) * vpHeightRatio -\n h * 0.5 +\n scrollOffset;\n\n if (onLayoutUpdate) {\n onLayoutUpdate(domRect, { w, h }, { x, y });\n }\n\n const unwrapedScaleFactor = scaleFactor ?? 1;\n\n if (!disableScaling) {\n if (!stretch) {\n const minScale = Math.min(w, h) * unwrapedScaleFactor;\n activeControl.current!.scale.set(minScale, minScale, minScale);\n } else {\n activeControl.current!.scale.set(\n w * unwrapedScaleFactor,\n h * unwrapedScaleFactor,\n Math.min(w, h) * unwrapedScaleFactor\n );\n }\n }\n\n // eslint-disable-next-line react-hooks/immutability\n activeControl.current!.position.x = x;\n activeControl.current!.position.y = y;\n }, [attach, onLayoutUpdate, control, scaleFactor, disableScaling, stretch]);\n\n /**\n * Update position when `camera` changes.\n */\n useLayoutEffect(() => {\n properties.current.viewport = viewport.getCurrentViewport(camera);\n updatePosition();\n }, [camera, updatePosition, viewport]);\n\n const graceUpdate = useCallback(() => {\n try {\n updatePosition();\n } catch {\n /* empty */\n }\n }, [updatePosition]);\n\n const mode = {\n relaxed: (\n <RelaxedUpdate attach={props.attach} updatePosition={graceUpdate} />\n ),\n balanced: (\n <BalancedUpdate attach={props.attach} updatePosition={graceUpdate} />\n ),\n aggressive: <AggressiveUpdate updatePosition={graceUpdate} />,\n };\n\n if (props.control) {\n return (\n <>\n {props.children}\n {mode[props.trackingMode]}\n </>\n );\n }\n\n return (\n <group ref={defaultControl}>\n {props.children}\n {mode[props.trackingMode]}\n </group>\n );\n}\n\nfunction RelaxedUpdate(props: {\n attach: RefObject<HTMLElement | null>;\n updatePosition: () => void;\n}) {\n const { updatePosition } = props;\n\n /**\n * Scroll hook to update object correctly to the current HTML scroll position.\n */\n useLenisCallback(updatePosition, {\n initialCall: true,\n intersectOn: props.attach,\n });\n\n /**\n * Allows the element to resize too.\n */\n useOrbit({\n target: props.attach,\n events: {\n onIntersect: updatePosition,\n onResize: updatePosition,\n },\n });\n\n useLayoutEffectOnce(updatePosition);\n return null;\n}\n\nfunction BalancedUpdate(props: {\n attach: RefObject<HTMLElement | null>;\n updatePosition: () => void;\n}) {\n const { updatePosition } = props;\n\n const [shouldUpdate, setShouldUpdate] = useState(false);\n\n useOrbit({\n target: props.attach,\n events: {\n onIntersect(entry) {\n setShouldUpdate(entry.isIntersecting);\n },\n onResize: updatePosition,\n },\n rootMargin: '50% 0px 50% 0px',\n });\n\n useLayoutEffect(() => {\n if (shouldUpdate) {\n frame.read(updatePosition, true);\n } else {\n cancelFrame(updatePosition);\n }\n\n return () => {\n cancelFrame(updatePosition);\n };\n }, [updatePosition, shouldUpdate]);\n\n useLayoutEffectOnce(updatePosition);\n return null;\n}\n\nfunction AggressiveUpdate(props: { updatePosition: () => void }) {\n const { updatePosition } = props;\n\n useLayoutEffect(() => {\n frame.read(updatePosition, true);\n\n return () => {\n cancelFrame(updatePosition);\n };\n }, [updatePosition]);\n\n return null;\n}\n","import { useEffect, useLayoutEffect } from 'react';\n\nexport function useEffectOnce(callback: React.EffectCallback) {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n useEffect(callback, []);\n}\n\nexport function useLayoutEffectOnce(callback: React.EffectCallback) {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n useLayoutEffect(callback, []);\n}\n","import { type RefObject, useCallback, useLayoutEffect, useMemo } from 'react';\nimport { weaverSetup } from '../setup';\nimport { useOrbit } from './orbit';\n\ninterface HookOptions {\n /**\n * Hook will report when first initialized without waiting for scroll event to actually happens.\n */\n initialCall?: boolean;\n /**\n * Set an element to only call when the element is actually entering the viewport (with 25% `rootMargin`).\n */\n intersectOn?: RefObject<HTMLOrSVGElement | null>;\n}\n\nexport const scrollCallbackReason = {\n Resize: 'resize',\n Scroll: 'scroll',\n Initialize: 'initialize',\n} as const;\nexport type ScrollCallbackReason =\n (typeof scrollCallbackReason)[keyof typeof scrollCallbackReason];\n\ntype Callback = (latest: number, reason: ScrollCallbackReason) => void;\n\nexport function useLenisCallback(callback: Callback, options?: HookOptions) {\n if (!weaverSetup._lenisInstance) {\n throw Error(\n \"useLenisCallback won't work without a lenis instance. Provide one via weaverSetup.setLenisInstance\"\n );\n }\n\n const callbackWrapScroll = useCallback(\n () =>\n callback(\n weaverSetup._lenisInstance!.actualScroll,\n scrollCallbackReason.Scroll\n ),\n [callback]\n );\n const callbackWrapResize = useCallback(\n () =>\n callback(\n weaverSetup._lenisInstance!.actualScroll,\n scrollCallbackReason.Resize\n ),\n [callback]\n );\n\n const intersectOn = useMemo(\n () => options?.intersectOn,\n [options?.intersectOn]\n );\n const initialCall = useMemo(\n () => options?.initialCall,\n [options?.initialCall]\n );\n\n useOrbit({\n target: intersectOn as RefObject<HTMLElement | null> | undefined,\n events: {\n onIntersect(entry) {\n if (entry.isIntersecting) {\n weaverSetup._lenisInstance!.on('scroll', callbackWrapScroll);\n window.addEventListener('resize', callbackWrapResize);\n } else {\n weaverSetup._lenisInstance!.off('scroll', callbackWrapScroll);\n window.removeEventListener('resize', callbackWrapResize);\n }\n },\n },\n rootMargin: '50% 0px 50% 0px',\n });\n\n useLayoutEffect(() => {\n if (!intersectOn) {\n weaverSetup._lenisInstance!.on('scroll', callbackWrapScroll);\n window.addEventListener('resize', callbackWrapResize);\n }\n\n if (initialCall) {\n callback(\n weaverSetup._lenisInstance!.actualScroll,\n scrollCallbackReason.Initialize\n );\n }\n\n return () => {\n weaverSetup._lenisInstance!.off('scroll', callbackWrapScroll);\n window.removeEventListener('resize', callbackWrapResize);\n };\n }, [\n callback,\n callbackWrapResize,\n callbackWrapScroll,\n initialCall,\n intersectOn,\n ]);\n}\n","import { type RefObject, useLayoutEffect } from 'react';\n\n/**\n * A simple Orbit hook.\n *\n * @param target HTML element ref to attach to.\n * @param events Specify which events should the orbit tracks.\n */\nexport function useOrbit(options: {\n target?: RefObject<HTMLElement | null>;\n events: {\n onResize?: (entry: ResizeObserverEntry) => void;\n onIntersect?: (entry: IntersectionObserverEntry) => void;\n };\n rootMargin?: string;\n}) {\n const { onResize, onIntersect } = options.events;\n const { rootMargin = '25% 0px 25% 0px' } = options;\n\n useLayoutEffect(() => {\n if (!options.target) return;\n if (!options.target.current) return;\n\n let orbitResize = undefined;\n if (onResize) {\n orbitResize = new ResizeObserver((entries) => onResize(entries[0]));\n orbitResize.observe(options.target.current);\n }\n let orbitIntersect = undefined;\n if (onIntersect) {\n orbitIntersect = new IntersectionObserver(\n (entries) => onIntersect(entries[0]),\n { rootMargin }\n );\n orbitIntersect.observe(options.target.current);\n }\n\n return () => {\n orbitResize?.disconnect();\n orbitIntersect?.disconnect();\n };\n }, [onIntersect, onResize, rootMargin, options.target]);\n}\n"],"mappings":"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","names":["React","useCallback","useId","useLayoutEffect","useRef","useLayoutEffect","useLayoutEffect","useLayoutEffect","useId","React","useRef","useCallback","useLayoutEffect"]}
|
|
1
|
+
{"version":3,"sources":["../src/scene/BakeScene.tsx","../src/setup.ts","../src/scene/SceneSync.tsx","../src/hooks/effectOnce.ts","../src/hooks/lenisCallback.ts","../src/hooks/orbit.ts"],"sourcesContent":["import { useFrame } from '@react-three/fiber';\nimport React, {\n type Dispatch,\n Fragment,\n type ReactNode,\n type SetStateAction,\n useId,\n useRef,\n} from 'react';\nimport { BasicTunnelIn, weaverSetup } from '../setup';\n\n/**\n * A core part of an in-house tool called `weaver`.\n *\n * `BakeScene`: This component will notifiy when the global 3D scene is ready.\n *\n * It works by tune in the `useFrame` from `@react-three/fiber`. When the scene is loaded, `useFreame` will fire\n * with ease, the component takes advantage of that, and because `useLoader` is unreliable.\n *\n * This component also accepts 3D elements `children` to be rendered directly to the canvas with some camera options.\n * But you don't have to put every 3D components inside the baker, for example, `SceneSync`s in the page are also\n * being watched by this component.\n *\n * The route renderer **CAN'T** detect if the page has 3D elements or not, so if a page uses any sort of 3D rendering,\n * this component **MUST** be a children iniside `Pipeline` (`index.tsx`), then pass the state value that bake changes\n * to `Pipeline`'s `contentReady` in order for the `BakeScene` to work behind loading fallback screen.\n */\nexport default function BakeScene(props: {\n children?: ReactNode;\n sceneReady: boolean;\n tunnelIn?: BasicTunnelIn;\n loadTaskDelay?: number;\n setSceneReady: Dispatch<SetStateAction<boolean>>;\n onReady?: () => void;\n}) {\n const unique = useId();\n const pipeObjects = useId();\n\n const TunnelIn = props.tunnelIn ?? weaverSetup._Default3DTunnelIn;\n\n if (!TunnelIn) {\n throw Error(\n 'Failed to find a tunnel to use. Consider setting a default tunnel.'\n );\n }\n\n return (\n <TunnelIn>\n <Fragment key={pipeObjects}>{props.children}</Fragment>\n <NotificationHandler\n key={unique}\n callback={props.onReady}\n sceneReady={props.sceneReady}\n setSceneReady={props.setSceneReady}\n />\n </TunnelIn>\n );\n}\n\nfunction NotificationHandler(props: {\n callback?: (isSceneReady: boolean) => void;\n sceneReady: boolean;\n setSceneReady: (value: boolean) => void;\n}) {\n /**\n * `useFrame` is expensive for something that only triggers once, so yea,\n * we'll remove the notification as soon as the job is done.\n */\n return !props.sceneReady && <RenderNotification {...props} />;\n}\n\nfunction RenderNotification(props: {\n callback?: (isSceneReady: boolean) => void;\n sceneReady: boolean;\n loadTaskDelay?: number;\n setSceneReady: (value: boolean) => void;\n}) {\n const scheduledForCallback = useRef(false);\n\n useFrame(() => {\n if (!props.sceneReady && !scheduledForCallback.current) {\n scheduledForCallback.current = true;\n setTimeout(() => {\n if (props.callback) {\n props.callback(true);\n }\n props.setSceneReady(true);\n }, props.loadTaskDelay ?? 50);\n }\n });\n\n return null;\n}\n","import Lenis from 'lenis';\nimport { ReactNode } from 'react';\n\nexport type BasicTunnelIn = ({ children }: { children: ReactNode }) => null;\n\nclass WeaverSetup {\n /**\n * This variable is handled internally by weaver. **Do not use**.\n */\n get _lenisInstance(): Lenis | undefined {\n return (globalThis as any).__weaverLenis;\n }\n set _lenisInstance(val: Lenis | undefined) {\n (globalThis as any).__weaverLenis = val;\n }\n\n /**\n * This variable is handled internally by weaver. **Do not use**.\n */\n get _Default3DTunnelIn(): BasicTunnelIn | undefined {\n return (globalThis as any).__weaver3DTunnel;\n }\n set _Default3DTunnelIn(val: BasicTunnelIn | undefined) {\n (globalThis as any).__weaver3DTunnel = val;\n }\n\n setLenisInstance(instance: Lenis) {\n this._lenisInstance = instance;\n }\n set3DTunnel(tunnelIn: BasicTunnelIn) {\n this._Default3DTunnelIn = tunnelIn;\n }\n}\n\nexport const weaverSetup = new WeaverSetup();\n","import { Hud } from '@react-three/drei';\nimport { useThree, type Viewport } from '@react-three/fiber';\nimport { cancelFrame, frame } from 'motion/react';\nimport React, {\n type ReactNode,\n type RefObject,\n useCallback,\n useId,\n useLayoutEffect,\n useRef,\n useState,\n} from 'react';\nimport { Group } from 'three';\nimport { useLayoutEffectOnce } from '../hooks/effectOnce';\nimport { useLenisCallback } from '../hooks/lenisCallback';\nimport { useOrbit } from '../hooks/orbit';\nimport { BasicTunnelIn, weaverSetup } from '../setup';\n\nexport type Basic3DTransforms = {\n scale: {\n set: (x: number, y: number, z: number) => void;\n };\n position: {\n x: number;\n y: number;\n };\n};\n\ninterface SyncProps {\n /**\n * HTML element ref that `<SceneSync />` will use to sync with the scene.\n *\n * ```tsx\n * <div ref={container} />\n * <SceneSync attach={container}>\n * <group />\n * </SceneSync>\n * ```\n */\n attach: RefObject<HTMLElement | null>;\n\n /**\n * This variable allows fine-grain control over your scene when passed to `<SceneSync />`.\n *\n * `<SceneSync />` will use its own ref and group when creating your scene to control its scale and position.\n * Setting this variable will disable the internal ref, and you can decide on which object gets controlled.\n *\n * This variable is needed for `hud` if you wanted to add a custom camera.\n *\n * For listening to change details, use `onLayoutChange` instead.\n */\n control?: RefObject<Basic3DTransforms | null>;\n\n /**\n * When this variable is set, `<SceneSync />` will send updates when the scene update its positions.\n *\n * The function return the calculated DOM rect, with dimension and position in 3D measurements.\n */\n onLayoutUpdate?: (\n rect: DOMRect,\n dimension: { w: number; h: number },\n position: { x: number; y: number }\n ) => void;\n\n /**\n * Use `Hud` for this scene or not.\n *\n * This is useful when you want to apply custom camera for this scene, or renders multiple scenes on each other.\n *\n * NOTE: When setting a custom camera, the `control` variable must also be set and mount to your scene, not related to the camera\n * to avoid unwanted behavior.\n *\n * `<SceneSync />` groups children passed to it by default, so the camera is also in the group, when syncer updates the group,\n * the camera is also change, ruining the effect.\n */\n hud?: boolean;\n\n /**\n * Control the scene's scaling when positioning.\n */\n scaleFactor?: number;\n\n /**\n * `<SceneSync />` avoid stretching the object by default by using the smallest dimension of the DOM element.\n *\n * This variable will tell `<SceneSync />` to stretch it anyways.\n */\n stretch?: boolean;\n\n /**\n * Disable automatic scaling on the object.\n *\n * This variable will also disable any scaling settings like `stretch` and `scaleFactor`.\n */\n disableScaling?: boolean;\n\n /**\n * `<SceneSync />` will depend on this variable to adjust how it should update.\n *\n * There are 3 modes: `relaxed`, `balanced` and `aggressive`.\n *\n * For each mode, there will be some very distinct trade-offs\n *\n * - `relaxed`: Uses IntersectionObserver paired with a scroll hook, together with ResizeObserver.\n * - (+): Minimal update calls, best performance.\n * - (-): The scene get desynced the moment DOM element moves without changing its sizes.\n * When the scene bleeds out of the DOM element too much, if IntersectionObserver reported that the DOM element\n * is out of view, the scene that did not fully moved out of view will stay there, as scroll hook will be disabled.\n * - `balanced`: Uses IntersectionObserver paired with frame-based update, together with ResizeObserver.\n * - (+): Just enough update calls to allow the DOM element to move freely while maintain aceptable performance.\n * - (-): It will update on every frame when the object gets into view as reported by IntersectionObserver. And the same\n * problem with `relaxed` mode when the scene bleeds out too much.\n * - `aggressive`: Frame-based update only. This mode is like how `<View />` from `@react-three/drei` kepts track of DOM elements.\n * - (+): Designed for precise element <-> scene updates. Can't be desynced, if desynced, that's a bug.\n * - (-): This is frame-based. It will fire updates as long as the scene is still mounted. Too many scenes with this\n * mode enabled is not a good idea. Acceptable amount would be 3 scenes with this mode.\n *\n * Best of both worlds is `balanced` mode, for simpler scenes that doesn't change its position, `relaxed` should be used.\n */\n trackingMode: 'relaxed' | 'balanced' | 'aggressive';\n\n /**\n * Set a custom tunnel for `<SceneSync />` send the components to for this scene only.\n *\n * Which is useful for example, put the objects inside a container in the scene.\n *\n * To set a default tunnel, pass it to `setDefaulTunnel` before use.\n */\n tunnelIn?: BasicTunnelIn;\n\n children: ReactNode;\n}\n\ninterface HudProps extends SyncProps {\n hud: true;\n /**\n * Set the `renderPriority` to render things for `Hud`.\n *\n * This variable is ignored when `hud` is not `true`.\n */\n hudRenderPriority: number;\n}\n\ninterface NormalProps extends SyncProps {\n hud?: false;\n}\n\n/**\n * A core part of an in-house tool called `weaver`.\n *\n * A component to allow three objects to track and sync with DOM element.\n *\n * The component uses `<Hud />` under the \"hud\", so if you want to use more than one `<SceneSync />`,\n * you must set `renderPriority`. If not, the component will render the last scene pushed through React.\n */\nexport default function SceneSync(props: NormalProps | HudProps) {\n if (!weaverSetup._lenisInstance) {\n throw Error(\n \"SceneSync won't work without a lenis instance. Provide one via weaverSetup.setLenisInstance\"\n );\n }\n\n const unique = useId();\n\n const TunnelIn = props.tunnelIn ?? weaverSetup._Default3DTunnelIn;\n\n if (!TunnelIn) {\n throw Error(\n 'Failed to find a tunnel to use. Consider setting a default tunnel.'\n );\n }\n\n if (props.hud) {\n return (\n <TunnelIn>\n <Hud key={unique} renderPriority={props.hudRenderPriority}>\n <SyncInternal {...props} />\n </Hud>\n </TunnelIn>\n );\n }\n\n return (\n <TunnelIn>\n <SyncInternal key={unique} {...props} />\n </TunnelIn>\n );\n}\n\nfunction SyncInternal(props: SyncProps) {\n const { viewport, camera } = useThree();\n\n const defaultControl = useRef<Group>(null);\n const {\n attach,\n control,\n scaleFactor,\n stretch,\n disableScaling,\n onLayoutUpdate,\n } = props;\n\n const properties: RefObject<{\n viewport?: Omit<Viewport, 'dpr' | 'initialDpr'>;\n }> = useRef({\n viewport: undefined,\n });\n\n const updatePosition = useCallback(() => {\n const activeControl = control ?? defaultControl;\n\n const vp = properties.current.viewport;\n if (!vp) return;\n\n const domRect = attach.current!.getBoundingClientRect();\n const screenH = window.innerHeight;\n const screenW = window.innerWidth;\n\n const vpWidthRatio = vp.width / screenW;\n const vpHeightRatio = vp.height / screenH;\n\n const scrollOffset =\n (weaverSetup._lenisInstance!.actualScroll / screenH) * vp.height;\n\n const w = domRect.width * vpWidthRatio;\n const h = domRect.height * vpHeightRatio;\n\n const x = domRect.x * vpWidthRatio + w * 0.5 - vp.width * 0.5;\n const y =\n vp.height * 0.5 -\n (domRect.y + weaverSetup._lenisInstance!.actualScroll) * vpHeightRatio -\n h * 0.5 +\n scrollOffset;\n\n if (onLayoutUpdate) {\n onLayoutUpdate(domRect, { w, h }, { x, y });\n }\n\n const unwrapedScaleFactor = scaleFactor ?? 1;\n\n if (!disableScaling) {\n if (!stretch) {\n const minScale = Math.min(w, h) * unwrapedScaleFactor;\n activeControl.current!.scale.set(minScale, minScale, minScale);\n } else {\n activeControl.current!.scale.set(\n w * unwrapedScaleFactor,\n h * unwrapedScaleFactor,\n Math.min(w, h) * unwrapedScaleFactor\n );\n }\n }\n\n // eslint-disable-next-line react-hooks/immutability\n activeControl.current!.position.x = x;\n activeControl.current!.position.y = y;\n }, [attach, onLayoutUpdate, control, scaleFactor, disableScaling, stretch]);\n\n /**\n * Update position when `camera` changes.\n */\n useLayoutEffect(() => {\n properties.current.viewport = viewport.getCurrentViewport(camera);\n updatePosition();\n }, [camera, updatePosition, viewport]);\n\n const graceUpdate = useCallback(() => {\n try {\n updatePosition();\n } catch {\n /* empty */\n }\n }, [updatePosition]);\n\n const mode = {\n relaxed: (\n <RelaxedUpdate attach={props.attach} updatePosition={graceUpdate} />\n ),\n balanced: (\n <BalancedUpdate attach={props.attach} updatePosition={graceUpdate} />\n ),\n aggressive: <AggressiveUpdate updatePosition={graceUpdate} />,\n };\n\n if (props.control) {\n return (\n <>\n {props.children}\n {mode[props.trackingMode]}\n </>\n );\n }\n\n return (\n <group ref={defaultControl}>\n {props.children}\n {mode[props.trackingMode]}\n </group>\n );\n}\n\nfunction RelaxedUpdate(props: {\n attach: RefObject<HTMLElement | null>;\n updatePosition: () => void;\n}) {\n const { updatePosition } = props;\n\n /**\n * Scroll hook to update object correctly to the current HTML scroll position.\n */\n useLenisCallback(updatePosition, {\n initialCall: true,\n intersectOn: props.attach,\n });\n\n /**\n * Allows the element to resize too.\n */\n useOrbit({\n target: props.attach,\n events: {\n onIntersect: updatePosition,\n onResize: updatePosition,\n },\n });\n\n useLayoutEffectOnce(updatePosition);\n return null;\n}\n\nfunction BalancedUpdate(props: {\n attach: RefObject<HTMLElement | null>;\n updatePosition: () => void;\n}) {\n const { updatePosition } = props;\n\n const [shouldUpdate, setShouldUpdate] = useState(false);\n\n useOrbit({\n target: props.attach,\n events: {\n onIntersect(entry) {\n setShouldUpdate(entry.isIntersecting);\n },\n onResize: updatePosition,\n },\n rootMargin: '50% 0px 50% 0px',\n });\n\n useLayoutEffect(() => {\n if (shouldUpdate) {\n frame.read(updatePosition, true);\n } else {\n cancelFrame(updatePosition);\n }\n\n return () => {\n cancelFrame(updatePosition);\n };\n }, [updatePosition, shouldUpdate]);\n\n useLayoutEffectOnce(updatePosition);\n return null;\n}\n\nfunction AggressiveUpdate(props: { updatePosition: () => void }) {\n const { updatePosition } = props;\n\n useLayoutEffect(() => {\n frame.read(updatePosition, true);\n\n return () => {\n cancelFrame(updatePosition);\n };\n }, [updatePosition]);\n\n return null;\n}\n","import { useEffect, useLayoutEffect } from 'react';\n\nexport function useEffectOnce(callback: React.EffectCallback) {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n useEffect(callback, []);\n}\n\nexport function useLayoutEffectOnce(callback: React.EffectCallback) {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n useLayoutEffect(callback, []);\n}\n","import { type RefObject, useCallback, useLayoutEffect, useMemo } from 'react';\nimport { weaverSetup } from '../setup';\nimport { useOrbit } from './orbit';\n\ninterface HookOptions {\n /**\n * Hook will report when first initialized without waiting for scroll event to actually happens.\n */\n initialCall?: boolean;\n /**\n * Set an element to only call when the element is actually entering the viewport (with 25% `rootMargin`).\n */\n intersectOn?: RefObject<HTMLOrSVGElement | null>;\n}\n\nexport const scrollCallbackReason = {\n Resize: 'resize',\n Scroll: 'scroll',\n Initialize: 'initialize',\n} as const;\nexport type ScrollCallbackReason =\n (typeof scrollCallbackReason)[keyof typeof scrollCallbackReason];\n\ntype Callback = (latest: number, reason: ScrollCallbackReason) => void;\n\nexport function useLenisCallback(callback: Callback, options?: HookOptions) {\n if (!weaverSetup._lenisInstance) {\n throw Error(\n \"useLenisCallback won't work without a lenis instance. Provide one via weaverSetup.setLenisInstance\"\n );\n }\n\n const callbackWrapScroll = useCallback(\n () =>\n callback(\n weaverSetup._lenisInstance!.actualScroll,\n scrollCallbackReason.Scroll\n ),\n [callback]\n );\n const callbackWrapResize = useCallback(\n () =>\n callback(\n weaverSetup._lenisInstance!.actualScroll,\n scrollCallbackReason.Resize\n ),\n [callback]\n );\n\n const intersectOn = useMemo(\n () => options?.intersectOn,\n [options?.intersectOn]\n );\n const initialCall = useMemo(\n () => options?.initialCall,\n [options?.initialCall]\n );\n\n useOrbit({\n target: intersectOn as RefObject<HTMLElement | null> | undefined,\n events: {\n onIntersect(entry) {\n if (entry.isIntersecting) {\n weaverSetup._lenisInstance!.on('scroll', callbackWrapScroll);\n window.addEventListener('resize', callbackWrapResize);\n } else {\n weaverSetup._lenisInstance!.off('scroll', callbackWrapScroll);\n window.removeEventListener('resize', callbackWrapResize);\n }\n },\n },\n rootMargin: '50% 0px 50% 0px',\n });\n\n useLayoutEffect(() => {\n if (!intersectOn) {\n weaverSetup._lenisInstance!.on('scroll', callbackWrapScroll);\n window.addEventListener('resize', callbackWrapResize);\n }\n\n if (initialCall) {\n callback(\n weaverSetup._lenisInstance!.actualScroll,\n scrollCallbackReason.Initialize\n );\n }\n\n return () => {\n weaverSetup._lenisInstance!.off('scroll', callbackWrapScroll);\n window.removeEventListener('resize', callbackWrapResize);\n };\n }, [\n callback,\n callbackWrapResize,\n callbackWrapScroll,\n initialCall,\n intersectOn,\n ]);\n}\n","import { type RefObject, useLayoutEffect } from 'react';\n\n/**\n * A simple Orbit hook.\n *\n * @param target HTML element ref to attach to.\n * @param events Specify which events should the orbit tracks.\n */\nexport function useOrbit(options: {\n target?: RefObject<HTMLElement | null>;\n events: {\n onResize?: (entry: ResizeObserverEntry) => void;\n onIntersect?: (entry: IntersectionObserverEntry) => void;\n };\n rootMargin?: string;\n}) {\n const { onResize, onIntersect } = options.events;\n const { rootMargin = '25% 0px 25% 0px' } = options;\n\n useLayoutEffect(() => {\n if (!options.target) return;\n if (!options.target.current) return;\n\n let orbitResize = undefined;\n if (onResize) {\n orbitResize = new ResizeObserver((entries) => onResize(entries[0]));\n orbitResize.observe(options.target.current);\n }\n let orbitIntersect = undefined;\n if (onIntersect) {\n orbitIntersect = new IntersectionObserver(\n (entries) => onIntersect(entries[0]),\n { rootMargin }\n );\n orbitIntersect.observe(options.target.current);\n }\n\n return () => {\n orbitResize?.disconnect();\n orbitIntersect?.disconnect();\n };\n }, [onIntersect, onResize, rootMargin, options.target]);\n}\n"],"mappings":"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","names":["React","useCallback","useId","useLayoutEffect","useRef","useLayoutEffect","useLayoutEffect","useLayoutEffect","useId","React","useRef","useCallback","useLayoutEffect"]}
|
package/package.json
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"author": "neveranyart",
|
|
3
3
|
"license": "GPL-3.0-or-later",
|
|
4
4
|
"name": "@neveranyart/weaver",
|
|
5
|
-
"version": "1.0.
|
|
5
|
+
"version": "1.0.16",
|
|
6
6
|
"description": "An in-house package by neverany for making interactive React CSR.",
|
|
7
7
|
"packageManager": "yarn@4.10.3",
|
|
8
8
|
"publishConfig": {
|