@nethesis/phone-island 0.18.5 → 0.18.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/IslandDrag.js +1 -1
- package/dist/components/IslandDrag.js.map +1 -1
- package/dist/node_modules/framer-motion/dist/es/animation/hooks/animation-controls.mjs.js +2 -0
- package/dist/node_modules/framer-motion/dist/es/animation/hooks/animation-controls.mjs.js.map +1 -0
- package/dist/node_modules/framer-motion/dist/es/animation/hooks/use-animation.mjs.js +2 -0
- package/dist/node_modules/framer-motion/dist/es/animation/hooks/use-animation.mjs.js.map +1 -0
- package/dist/node_modules/framer-motion/dist/es/projection/node/create-projection-node.mjs.js +1 -1
- package/dist/node_modules/framer-motion/dist/es/projection/node/create-projection-node.mjs.js.map +1 -1
- package/dist/node_modules/motion-dom/dist/es/animation/JSAnimation.mjs.js +1 -1
- package/dist/node_modules/motion-dom/dist/es/animation/JSAnimation.mjs.js.map +1 -1
- package/dist/node_modules/webrtc-adapter/src/js/common_shim.js +1 -1
- package/dist/node_modules/webrtc-adapter/src/js/common_shim.js.map +1 -1
- package/dist/node_modules/webrtc-adapter/src/js/utils.js +1 -1
- package/dist/node_modules/webrtc-adapter/src/js/utils.js.map +1 -1
- package/dist/package.json.js +1 -1
- package/package.json +2 -2
- package/dist/node_modules/motion-dom/dist/es/stats/animation-count.mjs.js +0 -2
- package/dist/node_modules/motion-dom/dist/es/stats/animation-count.mjs.js.map +0 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../node_modules/tslib/tslib.es6.js"),t=require("react"),r=require("../store/index.js");require("../node_modules/react-redux/es/index.js");var o=require("../utils/customHooks/
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../node_modules/tslib/tslib.es6.js"),t=require("react"),r=require("../store/index.js");require("../node_modules/react-redux/es/index.js");var o=require("../utils/customHooks/useEventListener.js"),s=require("../utils/customHooks/useLocalStorage.js"),n=require("../utils/customHooks/useLongPress.js"),i=require("../utils/genericFunctions/styleTransformValues.js"),a=require("../lib/island/island.js"),u=require("../node_modules/framer-motion/dist/es/gestures/drag/use-drag-controls.mjs.js"),l=require("../node_modules/framer-motion/dist/es/animation/hooks/use-animation.mjs.js"),d=require("../node_modules/framer-motion/dist/es/render/components/motion/proxy.mjs.js"),c=require("../node_modules/react-redux/es/hooks/useSelector.js"),m=require("../node_modules/react-redux/es/hooks/useDispatch.js");function p(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var g=p(t),f=function(p){var f=p.children,v=p.islandContainerRef,j=c.useSelector((function(e){return e.island})).startPosition,x=t.useState(!1),h=x[0],y=x[1],_=m.useDispatch(),q=u.useDragControls(),b=l.useAnimation(),S=s.useLocalStorage("phone-island",null),D=S[0],P=S[1],L=t.useRef(null),k=t.useState(D&&D.position?D.position:null),C=k[0],w=k[1];o.useEventListener("phone-island-reset-position",(function(){return e.__awaiter(void 0,void 0,void 0,(function(){return e.__generator(this,(function(e){switch(e.label){case 0:return localStorage.removeItem("phone-island"),w(null),[4,b.start({x:j.x,y:j.y,transition:{duration:.3,ease:"easeOut"}})];case 1:return e.sent(),[2]}}))}))}));var E=n.useLongPress((function(){}),(function(e){var t,o;if(e&&e.target){var s=e.target;if(s.closest('[data-stop-propagation="true"]')||s.hasAttribute("data-stop-propagation"))return}!(null===(o=null===(t=null===r.store||void 0===r.store?void 0:r.store.getState())||void 0===t?void 0:t.island)||void 0===o?void 0:o.isOpen)&&_.island.handleToggleIsOpen()}),h,(function(){return y(!1)}),{shouldPreventDefault:!0,delay:250});return g.default.createElement(d.motion.div,e.__assign({drag:!0,onPointerDown:function(e){var t=e.target;t.closest('[data-stop-propagation="true"]')||t.hasAttribute("data-stop-propagation")||q.start(e)},onDragStart:function(){y(!0)},dragTransition:{power:0,timeConstant:300},initial:{x:(null==C?void 0:C.x)||j.x,y:(null==C?void 0:C.y)||j.y},animate:b,dragControls:q,dragListener:!1,dragConstraints:v,onDragEnd:function(){var e=i.styleTransformValues(L.current),t=e.x,r=e.y;t=a.xPosition(Math.round(t),L.current,v.current),r=a.yPosition(Math.round(r),L.current,v.current),P({position:{x:t,y:r}}),w({x:t,y:r})},ref:L},E,{className:"pi-absolute"}),f&&f)};exports.IslandDrag=f,exports.default=f;
|
|
2
2
|
//# sourceMappingURL=IslandDrag.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IslandDrag.js","sources":["../../src/components/IslandDrag.tsx"],"sourcesContent":["// Copyright (C) 2025 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n\nimport React, { type ReactNode, FC, useState, useRef, MutableRefObject } from 'react'\nimport { RootState, Dispatch, store } from '../store'\nimport { useSelector, useDispatch } from 'react-redux'\nimport { motion, useDragControls } from 'framer-motion'\nimport { useLongPress, useLocalStorage, styleTransformValues } from '../utils'\nimport { xPosition, yPosition } from '../lib/island/island'\n\nexport const IslandDrag: FC<IslandDragProps> = ({ children, islandContainerRef }) => {\n const { startPosition } = useSelector((state: RootState) => state.island)\n\n // Initialize the moved property\n const [moved, setMoved] = useState<boolean>(false)\n\n // Initialize dispatch\n const dispatch = useDispatch<Dispatch>()\n\n // Initialize Island drag controls\n const controls = useDragControls()\n\n // Initialize Island storage\n const [phoneIslandStorage, setPhoneIslandStorage] =\n useLocalStorage<PhoneIslandStorageTypes | null>('phone-island', null)\n\n // The Island reference\n const islandRef = useRef<any>(null)\n\n // Initialize position or get from storage\n const [position, setPosition] = useState<PositionTypes | null>(\n phoneIslandStorage && phoneIslandStorage.position ? phoneIslandStorage.position : null,\n )\n\n // Handles the drag started event\n function handleStartDrag(event: React.PointerEvent<Element>) {\n const target = event.target as HTMLElement\n if (\n target.closest('[data-stop-propagation=\"true\"]') ||\n target.hasAttribute('data-stop-propagation')\n ) {\n return\n }\n\n controls.start(event)\n }\n\n // Handles log press event\n const handleLongPress = () => {}\n\n const handleIslandClick = (event?: React.MouseEvent<Element> | any) => {\n if (event && event.target) {\n const target = event.target as HTMLElement\n if (\n target.closest('[data-stop-propagation=\"true\"]') ||\n target.hasAttribute('data-stop-propagation')\n ) {\n return\n }\n }\n\n // Only if phone island is close is possible to open it trough the click\n const isPhoneIslandAlreadyOpen = store?.getState()?.island?.isOpen\n !isPhoneIslandAlreadyOpen && dispatch.island.handleToggleIsOpen()\n }\n\n // Handles drag end event\n const handleDragEnd = () => {\n // Get initial transform values\n let { x, y }: any = styleTransformValues(islandRef.current)\n // Round position\n x = xPosition(Math.round(x), islandRef.current, islandContainerRef.current)\n y = yPosition(Math.round(y), islandRef.current, islandContainerRef.current)\n // Save the new position to localstorage\n setPhoneIslandStorage({\n position: {\n x,\n y,\n },\n })\n // Set position to variable\n setPosition({\n x,\n y,\n })\n }\n\n // Handles drag started event\n function handleDragStarted() {\n setMoved(true)\n }\n\n // Initialize the longPressEvent object\n const longPressEvent = useLongPress(\n handleLongPress,\n handleIslandClick,\n moved,\n () => setMoved(false),\n {\n shouldPreventDefault: true,\n delay: 250,\n },\n )\n\n return (\n <motion.div\n drag\n onPointerDown={handleStartDrag}\n onDragStart={handleDragStarted}\n dragTransition={{ \n power: 0,\n timeConstant: 300\n }}\n initial={{\n x: position?.x || startPosition.x,\n y: position?.y || startPosition.y,\n }}\n dragControls={controls}\n dragListener={false}\n dragConstraints={islandContainerRef}\n onDragEnd={handleDragEnd}\n ref={islandRef}\n {...longPressEvent}\n className='pi-absolute'\n >\n {children && children}\n </motion.div>\n )\n}\n\nexport default IslandDrag\n\nexport interface IslandDragProps {\n children: ReactNode\n islandContainerRef: MutableRefObject<HTMLDivElement>\n}\n\ninterface PhoneIslandStorageTypes {\n position: PositionTypes\n}\n\ninterface PositionTypes {\n x: number\n y: number\n}\n"],"names":["IslandDrag","_a","children","islandContainerRef","startPosition","useSelector","state","island","_b","useState","moved","setMoved","dispatch","useDispatch","controls","useDragControls","_c","useLocalStorage","phoneIslandStorage","setPhoneIslandStorage","islandRef","useRef","_d","position","setPosition","longPressEvent","useLongPress","event","target","closest","hasAttribute","store","getState","isOpen","handleToggleIsOpen","shouldPreventDefault","delay","React","createElement","motion","div","drag","onPointerDown","
|
|
1
|
+
{"version":3,"file":"IslandDrag.js","sources":["../../src/components/IslandDrag.tsx"],"sourcesContent":["// Copyright (C) 2025 Nethesis S.r.l.\n// SPDX-License-Identifier: AGPL-3.0-or-later\n\nimport React, { type ReactNode, FC, useState, useRef, MutableRefObject } from 'react'\nimport { RootState, Dispatch, store } from '../store'\nimport { useSelector, useDispatch } from 'react-redux'\nimport { motion, useDragControls, useAnimation } from 'framer-motion'\nimport { useLongPress, useLocalStorage, styleTransformValues, useEventListener } from '../utils'\nimport { xPosition, yPosition } from '../lib/island/island'\n\nexport const IslandDrag: FC<IslandDragProps> = ({ children, islandContainerRef }) => {\n const { startPosition } = useSelector((state: RootState) => state.island)\n\n // Initialize the moved property\n const [moved, setMoved] = useState<boolean>(false)\n\n // Initialize dispatch\n const dispatch = useDispatch<Dispatch>()\n\n // Initialize Island drag controls\n const controls = useDragControls()\n\n // Initialize animation controls for reset functionality\n const animationControls = useAnimation()\n\n // Initialize Island storage\n const [phoneIslandStorage, setPhoneIslandStorage] =\n useLocalStorage<PhoneIslandStorageTypes | null>('phone-island', null)\n\n // The Island reference\n const islandRef = useRef<any>(null)\n\n // Initialize position or get from storage\n const [position, setPosition] = useState<PositionTypes | null>(\n phoneIslandStorage && phoneIslandStorage.position ? phoneIslandStorage.position : null,\n )\n\n // Handles reset position to default\n const handleResetPosition = async () => {\n // Clear localStorage\n localStorage.removeItem('phone-island')\n \n // Reset position state\n setPosition(null)\n \n // Animate back to default position\n await animationControls.start({\n x: startPosition.x,\n y: startPosition.y,\n transition: {\n duration: 0.3,\n ease: 'easeOut',\n },\n })\n }\n\n // Listen for reset position event\n useEventListener('phone-island-reset-position', handleResetPosition)\n\n // Handles the drag started event\n function handleStartDrag(event: React.PointerEvent<Element>) {\n const target = event.target as HTMLElement\n if (\n target.closest('[data-stop-propagation=\"true\"]') ||\n target.hasAttribute('data-stop-propagation')\n ) {\n return\n }\n\n controls.start(event)\n }\n\n // Handles log press event\n const handleLongPress = () => {}\n\n const handleIslandClick = (event?: React.MouseEvent<Element> | any) => {\n if (event && event.target) {\n const target = event.target as HTMLElement\n if (\n target.closest('[data-stop-propagation=\"true\"]') ||\n target.hasAttribute('data-stop-propagation')\n ) {\n return\n }\n }\n\n // Only if phone island is close is possible to open it trough the click\n const isPhoneIslandAlreadyOpen = store?.getState()?.island?.isOpen\n !isPhoneIslandAlreadyOpen && dispatch.island.handleToggleIsOpen()\n }\n\n // Handles drag end event\n const handleDragEnd = () => {\n // Get initial transform values\n let { x, y }: any = styleTransformValues(islandRef.current)\n // Round position\n x = xPosition(Math.round(x), islandRef.current, islandContainerRef.current)\n y = yPosition(Math.round(y), islandRef.current, islandContainerRef.current)\n // Save the new position to localstorage\n setPhoneIslandStorage({\n position: {\n x,\n y,\n },\n })\n // Set position to variable\n setPosition({\n x,\n y,\n })\n }\n\n // Handles drag started event\n function handleDragStarted() {\n setMoved(true)\n }\n\n // Initialize the longPressEvent object\n const longPressEvent = useLongPress(\n handleLongPress,\n handleIslandClick,\n moved,\n () => setMoved(false),\n {\n shouldPreventDefault: true,\n delay: 250,\n },\n )\n\n return (\n <motion.div\n drag\n onPointerDown={handleStartDrag}\n onDragStart={handleDragStarted}\n dragTransition={{ \n power: 0,\n timeConstant: 300\n }}\n initial={{\n x: position?.x || startPosition.x,\n y: position?.y || startPosition.y,\n }}\n animate={animationControls}\n dragControls={controls}\n dragListener={false}\n dragConstraints={islandContainerRef}\n onDragEnd={handleDragEnd}\n ref={islandRef}\n {...longPressEvent}\n className='pi-absolute'\n >\n {children && children}\n </motion.div>\n )\n}\n\nexport default IslandDrag\n\nexport interface IslandDragProps {\n children: ReactNode\n islandContainerRef: MutableRefObject<HTMLDivElement>\n}\n\ninterface PhoneIslandStorageTypes {\n position: PositionTypes\n}\n\ninterface PositionTypes {\n x: number\n y: number\n}\n"],"names":["IslandDrag","_a","children","islandContainerRef","startPosition","useSelector","state","island","_b","useState","moved","setMoved","dispatch","useDispatch","controls","useDragControls","animationControls","useAnimation","_c","useLocalStorage","phoneIslandStorage","setPhoneIslandStorage","islandRef","useRef","_d","position","setPosition","useEventListener","__awaiter","localStorage","removeItem","start","x","y","transition","duration","ease","sent","longPressEvent","useLongPress","event","target","closest","hasAttribute","store","getState","isOpen","handleToggleIsOpen","shouldPreventDefault","delay","React","createElement","motion","div","drag","onPointerDown","onDragStart","dragTransition","power","timeConstant","initial","animate","dragControls","dragListener","dragConstraints","onDragEnd","styleTransformValues","current","xPosition","Math","round","yPosition","ref","className"],"mappings":"k8BAUaA,EAAkC,SAACC,OAAEC,EAAQD,EAAAC,SAAEC,EAAkBF,EAAAE,mBACpEC,EAAkBC,eAAY,SAACC,GAAqB,OAAAA,EAAMC,wBAG5DC,EAAoBC,EAAAA,UAAkB,GAArCC,EAAKF,EAAA,GAAEG,EAAQH,EAAA,GAGhBI,EAAWC,EAAAA,cAGXC,EAAWC,EAAAA,kBAGXC,EAAoBC,EAAAA,eAGpBC,EACJC,EAAAA,gBAAgD,eAAgB,MAD3DC,EAAkBF,EAAA,GAAEG,OAIrBC,EAAYC,SAAY,MAGxBC,EAA0Bf,EAAAA,SAC9BW,GAAsBA,EAAmBK,SAAWL,EAAmBK,SAAW,MAD7EA,EAAQD,EAAA,GAAEE,EAAWF,EAAA,GAwB5BG,mBAAiB,+BAnBW,WAAA,OAAAC,EAAAA,eAAA,OAAA,OAAA,GAAA,yEAQ1B,OANAC,aAAaC,WAAW,gBAGxBJ,EAAY,MAGN,CAAA,EAAAV,EAAkBe,MAAM,CAC5BC,EAAG5B,EAAc4B,EACjBC,EAAG7B,EAAc6B,EACjBC,WAAY,CACVC,SAAU,GACVC,KAAM,4BALVnC,EAAAoC,qBAwEF,IAAMC,EAAiBC,EAAAA,cA7CC,eAEE,SAACC,WACzB,GAAIA,GAASA,EAAMC,OAAQ,CACzB,IAAMA,EAASD,EAAMC,OACrB,GACEA,EAAOC,QAAQ,mCACfD,EAAOE,aAAa,yBAEpB,MAEH,GAGyD,QAAzBnC,EAAiB,QAAjBP,SAAA2C,EAAAA,YAAK,IAALA,EAAKA,WAAA,EAALA,EAAAA,MAAOC,kBAAU,IAAA5C,OAAA,EAAAA,EAAEM,cAAM,IAAAC,OAAA,EAAAA,EAAEsC,SAC/BlC,EAASL,OAAOwC,oBAC/C,GAgCErC,GACA,WAAM,OAAAC,GAAS,KACf,CACEqC,sBAAsB,EACtBC,MAAO,MAIX,OACEC,EAAC,QAAAC,cAAAC,SAAOC,gBACNC,MAAI,EACJC,cAxEJ,SAAyBf,GACvB,IAAMC,EAASD,EAAMC,OAEnBA,EAAOC,QAAQ,mCACfD,EAAOE,aAAa,0BAKtB7B,EAASiB,MAAMS,EAChB,EA+DGgB,YApBJ,WACE7C,GAAS,EACV,EAmBG8C,eAAgB,CACdC,MAAO,EACPC,aAAc,KAEhBC,QAAS,CACP5B,GAAGP,aAAQ,EAARA,EAAUO,IAAK5B,EAAc4B,EAChCC,GAAGR,aAAQ,EAARA,EAAUQ,IAAK7B,EAAc6B,GAElC4B,QAAS7C,EACT8C,aAAchD,EACdiD,cAAc,EACdC,gBAAiB7D,EACjB8D,UAtDkB,WAEhB,IAAAhE,EAAgBiE,EAAAA,qBAAqB5C,EAAU6C,SAA7CnC,EAAC/B,EAAA+B,EAAEC,MAETD,EAAIoC,EAAAA,UAAUC,KAAKC,MAAMtC,GAAIV,EAAU6C,QAAShE,EAAmBgE,SACnElC,EAAIsC,EAAAA,UAAUF,KAAKC,MAAMrC,GAAIX,EAAU6C,QAAShE,EAAmBgE,SAEnE9C,EAAsB,CACpBI,SAAU,CACRO,EAACA,EACDC,EAACA,KAILP,EAAY,CACVM,EAACA,EACDC,EAACA,GAEL,EAqCIuC,IAAKlD,GACDgB,EACJ,CAAAmC,UAAU,gBAETvE,GAAYA,EAGnB"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../render/utils/setters.mjs.js"),t=require("../interfaces/visual-element.mjs.js"),r=require("../../../../../motion-utils/dist/es/errors.mjs.js");function s(t,r){[...r].reverse().forEach((n=>{const o=t.getVariant(n);o&&e.setTarget(t,o),t.variantChildren&&t.variantChildren.forEach((e=>{s(e,r)}))}))}function n(t,r){return Array.isArray(r)?s(t,r):"string"==typeof r?s(t,[r]):void e.setTarget(t,r)}exports.animationControls=function(){let e=!1;const s=new Set,o={subscribe:e=>(s.add(e),()=>{s.delete(e)}),start(n,o){r.invariant(e,"controls.start() should only be called after a component has mounted. Consider calling within a useEffect hook.");const a=[];return s.forEach((e=>{a.push(t.animateVisualElement(e,n,{transitionOverride:o}))})),Promise.all(a)},set:t=>(r.invariant(e,"controls.set() should only be called after a component has mounted. Consider calling within a useEffect hook."),s.forEach((e=>{n(e,t)}))),stop(){s.forEach((e=>{!function(e){e.values.forEach((e=>e.stop()))}(e)}))},mount:()=>(e=!0,()=>{e=!1,o.stop()})};return o},exports.setValues=n;
|
|
2
|
+
//# sourceMappingURL=animation-controls.mjs.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"animation-controls.mjs.js","sources":["../../../../../../../node_modules/framer-motion/dist/es/animation/hooks/animation-controls.mjs"],"sourcesContent":["import { invariant } from 'motion-utils';\nimport { setTarget } from '../../render/utils/setters.mjs';\nimport { animateVisualElement } from '../interfaces/visual-element.mjs';\n\nfunction stopAnimation(visualElement) {\n visualElement.values.forEach((value) => value.stop());\n}\nfunction setVariants(visualElement, variantLabels) {\n const reversedLabels = [...variantLabels].reverse();\n reversedLabels.forEach((key) => {\n const variant = visualElement.getVariant(key);\n variant && setTarget(visualElement, variant);\n if (visualElement.variantChildren) {\n visualElement.variantChildren.forEach((child) => {\n setVariants(child, variantLabels);\n });\n }\n });\n}\nfunction setValues(visualElement, definition) {\n if (Array.isArray(definition)) {\n return setVariants(visualElement, definition);\n }\n else if (typeof definition === \"string\") {\n return setVariants(visualElement, [definition]);\n }\n else {\n setTarget(visualElement, definition);\n }\n}\n/**\n * @public\n */\nfunction animationControls() {\n /**\n * Track whether the host component has mounted.\n */\n let hasMounted = false;\n /**\n * A collection of linked component animation controls.\n */\n const subscribers = new Set();\n const controls = {\n subscribe(visualElement) {\n subscribers.add(visualElement);\n return () => void subscribers.delete(visualElement);\n },\n start(definition, transitionOverride) {\n invariant(hasMounted, \"controls.start() should only be called after a component has mounted. Consider calling within a useEffect hook.\");\n const animations = [];\n subscribers.forEach((visualElement) => {\n animations.push(animateVisualElement(visualElement, definition, {\n transitionOverride,\n }));\n });\n return Promise.all(animations);\n },\n set(definition) {\n invariant(hasMounted, \"controls.set() should only be called after a component has mounted. Consider calling within a useEffect hook.\");\n return subscribers.forEach((visualElement) => {\n setValues(visualElement, definition);\n });\n },\n stop() {\n subscribers.forEach((visualElement) => {\n stopAnimation(visualElement);\n });\n },\n mount() {\n hasMounted = true;\n return () => {\n hasMounted = false;\n controls.stop();\n };\n },\n };\n return controls;\n}\n\nexport { animationControls, setValues };\n"],"names":["setVariants","visualElement","variantLabels","reverse","forEach","key","variant","getVariant","setTarget","variantChildren","child","setValues","definition","Array","isArray","hasMounted","subscribers","Set","controls","subscribe","add","delete","start","transitionOverride","invariant","animations","push","animateVisualElement","Promise","all","set","stop","values","value","stopAnimation","mount"],"mappings":"uOAOA,SAASA,EAAYC,EAAeC,GACT,IAAIA,GAAeC,UAC3BC,SAASC,IACpB,MAAMC,EAAUL,EAAcM,WAAWF,GACzCC,GAAWE,EAASA,UAACP,EAAeK,GAChCL,EAAcQ,iBACdR,EAAcQ,gBAAgBL,SAASM,IACnCV,EAAYU,EAAOR,EAAc,GAEzC,GAER,CACA,SAASS,EAAUV,EAAeW,GAC9B,OAAIC,MAAMC,QAAQF,GACPZ,EAAYC,EAAeW,GAEP,iBAAfA,EACLZ,EAAYC,EAAe,CAACW,SAGnCJ,YAAUP,EAAeW,EAEjC,2BAIA,WAII,IAAIG,GAAa,EAIjB,MAAMC,EAAc,IAAIC,IAClBC,EAAW,CACbC,UAAUlB,IACNe,EAAYI,IAAInB,GACT,KAAWe,EAAYK,OAAOpB,EAAc,GAEvDqB,KAAAA,CAAMV,EAAYW,GACdC,YAAUT,EAAY,mHACtB,MAAMU,EAAa,GAMnB,OALAT,EAAYZ,SAASH,IACjBwB,EAAWC,KAAKC,uBAAqB1B,EAAeW,EAAY,CAC5DW,uBACD,IAEAK,QAAQC,IAAIJ,EACtB,EACDK,IAAIlB,IACAY,YAAUT,EAAY,iHACfC,EAAYZ,SAASH,IACxBU,EAAUV,EAAeW,EAAW,KAG5CmB,IAAAA,GACIf,EAAYZ,SAASH,KA5DjC,SAAuBA,GACnBA,EAAc+B,OAAO5B,SAAS6B,GAAUA,EAAMF,QAClD,CA2DgBG,CAAcjC,EAAc,GAEnC,EACDkC,MAAKA,KACDpB,GAAa,EACN,KACHA,GAAa,EACbG,EAASa,MAAM,IAI3B,OAAOb,CACX"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var s=require("./animation-controls.mjs.js"),t=require("../../utils/use-constant.mjs.js"),e=require("../../utils/use-isomorphic-effect.mjs.js");function o(){const o=t.useConstant(s.animationControls);return e.useIsomorphicLayoutEffect(o.mount,[]),o}const n=o;exports.useAnimation=n,exports.useAnimationControls=o;
|
|
2
|
+
//# sourceMappingURL=use-animation.mjs.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-animation.mjs.js","sources":["../../../../../../../node_modules/framer-motion/dist/es/animation/hooks/use-animation.mjs"],"sourcesContent":["import { animationControls } from './animation-controls.mjs';\nimport { useConstant } from '../../utils/use-constant.mjs';\nimport { useIsomorphicLayoutEffect } from '../../utils/use-isomorphic-effect.mjs';\n\n/**\n * Creates `AnimationControls`, which can be used to manually start, stop\n * and sequence animations on one or more components.\n *\n * The returned `AnimationControls` should be passed to the `animate` property\n * of the components you want to animate.\n *\n * These components can then be animated with the `start` method.\n *\n * ```jsx\n * import * as React from 'react'\n * import { motion, useAnimation } from 'framer-motion'\n *\n * export function MyComponent(props) {\n * const controls = useAnimation()\n *\n * controls.start({\n * x: 100,\n * transition: { duration: 0.5 },\n * })\n *\n * return <motion.div animate={controls} />\n * }\n * ```\n *\n * @returns Animation controller with `start` and `stop` methods\n *\n * @public\n */\nfunction useAnimationControls() {\n const controls = useConstant(animationControls);\n useIsomorphicLayoutEffect(controls.mount, []);\n return controls;\n}\nconst useAnimation = useAnimationControls;\n\nexport { useAnimation, useAnimationControls };\n"],"names":["useAnimationControls","controls","useConstant","animationControls","useIsomorphicLayoutEffect","mount","useAnimation"],"mappings":"oNAiCA,SAASA,IACL,MAAMC,EAAWC,cAAYC,EAAAA,mBAE7B,OADAC,EAAAA,0BAA0BH,EAASI,MAAO,IACnCJ,CACX,CACMK,MAAAA,EAAeN"}
|
package/dist/node_modules/framer-motion/dist/es/projection/node/create-projection-node.mjs.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("../../animation/animate/single-value.mjs.js"),e=require("../../animation/optimized-appear/get-appear-id.mjs.js"),i=require("../../render/dom/utils/is-svg-element.mjs.js"),s=require("../../render/utils/flat-tree.mjs.js"),o=require("../../utils/delay.mjs.js"),a=require("../../value/utils/resolve-motion-value.mjs.js"),r=require("../animation/mix-values.mjs.js"),n=require("../geometry/copy.mjs.js"),l=require("../geometry/delta-apply.mjs.js"),h=require("../geometry/delta-calc.mjs.js"),c=require("../geometry/delta-remove.mjs.js"),u=require("../geometry/models.mjs.js"),m=require("../geometry/utils.mjs.js"),d=require("../shared/stack.mjs.js"),p=require("../styles/scale-correction.mjs.js"),y=require("../styles/transform.mjs.js"),g=require("../utils/each-axis.mjs.js"),f=require("../utils/has-transform.mjs.js"),v=require("./state.mjs.js"),x=require("../../../../../motion-utils/dist/es/noop.mjs.js"),j=require("../../../../../motion-utils/dist/es/subscription-manager.mjs.js"),T=require("../../../../../motion-dom/dist/es/animation/utils/get-value-transition.mjs.js"),D=require("../../../../../motion-dom/dist/es/frameloop/frame.mjs.js"),B=require("../../../../../motion-dom/dist/es/frameloop/sync-time.mjs.js"),P=require("../../../../../motion-utils/dist/es/clamp.mjs.js"),S=require("../../../../../motion-dom/dist/es/frameloop/microtask.mjs.js"),A=require("../../../../../motion-dom/dist/es/stats/animation-count.mjs.js"),R=require("../../../../../motion-dom/dist/es/utils/mix/number.mjs.js");const V=["","X","Y","Z"],L={visibility:"hidden"};let k=0;function E(t,e,i,s){const{latestValues:o}=e;o[t]&&(i[t]=o[t],e.setStaticValue(t,0),s&&(s[t]=0))}function U(t){if(t.hasCheckedOptimisedAppear=!0,t.root===t)return;const{visualElement:i}=t.options;if(!i)return;const s=e.getOptimisedAppearId(i);if(window.MotionHasOptimisedAnimation(s,"transform")){const{layout:e,layoutId:i}=t.options;window.MotionCancelOptimisedAnimation(s,"transform",D.frame,!(e||i))}const{parent:o}=t;o&&!o.hasCheckedOptimisedAppear&&U(o)}function C(t){t.updateLayout()}function F(t){const e=t.resumeFrom?.snapshot||t.snapshot;if(t.isLead()&&t.layout&&e&&t.hasListeners("didUpdate")){const{layoutBox:i,measuredBox:s}=t.layout,{animationType:o}=t.options,a=e.source!==t.layout.source;"size"===o?g.eachAxis((t=>{const s=a?e.measuredBox[t]:e.layoutBox[t],o=h.calcLength(s);s.min=i[t].min,s.max=s.min+o})):tt(o,e.layoutBox,i)&&g.eachAxis((s=>{const o=a?e.measuredBox[s]:e.layoutBox[s],r=h.calcLength(i[s]);o.max=o.min+r,t.relativeTarget&&!t.currentAnimation&&(t.isProjectionDirty=!0,t.relativeTarget[s].max=t.relativeTarget[s].min+r)}));const r=u.createDelta();h.calcBoxDelta(r,i,e.layoutBox);const n=u.createDelta();a?h.calcBoxDelta(n,t.applyTransform(s,!0),e.measuredBox):h.calcBoxDelta(n,i,e.layoutBox);const l=!m.isDeltaZero(r);let c=!1;if(!t.resumeFrom){const s=t.getClosestProjectingParent();if(s&&!s.resumeFrom){const{snapshot:o,layout:a}=s;if(o&&a){const r=u.createBox();h.calcRelativePosition(r,e.layoutBox,o.layoutBox);const n=u.createBox();h.calcRelativePosition(n,i,a.layoutBox),m.boxEqualsRounded(r,n)||(c=!0),s.options.layoutRoot&&(t.relativeTarget=n,t.relativeTargetOrigin=r,t.relativeParent=s)}}}t.notifyListeners("didUpdate",{layout:i,snapshot:e,delta:n,layoutDelta:r,hasLayoutChanged:l,hasRelativeLayoutChanged:c})}else if(t.isLead()){const{onExitComplete:e}=t.options;e&&e()}t.options.transition=void 0}function w(t){t.parent&&(t.isProjecting()||(t.isProjectionDirty=t.parent.isProjectionDirty),t.isSharedProjectionDirty||(t.isSharedProjectionDirty=Boolean(t.isProjectionDirty||t.parent.isProjectionDirty||t.parent.isSharedProjectionDirty)),t.isTransformDirty||(t.isTransformDirty=t.parent.isTransformDirty))}function I(t){t.isProjectionDirty=t.isSharedProjectionDirty=t.isTransformDirty=!1}function q(t){t.clearSnapshot()}function O(t){t.clearMeasurements()}function b(t){t.isLayoutDirty=!1}function M(t){const{visualElement:e}=t.options;e&&e.getProps().onBeforeLayoutMeasure&&e.notify("BeforeLayoutMeasure"),t.resetTransform()}function N(t){t.finishAnimation(),t.targetDelta=t.relativeTarget=t.target=void 0,t.isProjectionDirty=!0}function z(t){t.resolveTargetDelta()}function H(t){t.calcProjection()}function W(t){t.resetSkewAndRotation()}function G(t){t.removeLeadSnapshot()}function Z(t,e,i){t.translate=R.mixNumber(e.translate,0,i),t.scale=R.mixNumber(e.scale,1,i),t.origin=e.origin,t.originPoint=e.originPoint}function $(t,e,i,s){t.min=R.mixNumber(e.min,i.min,s),t.max=R.mixNumber(e.max,i.max,s)}function X(t,e,i,s){$(t.x,e.x,i.x,s),$(t.y,e.y,i.y,s)}function Y(t){return t.animationValues&&void 0!==t.animationValues.opacityExit}const _={duration:.45,ease:[.4,0,.1,1]},J=t=>"undefined"!=typeof navigator&&navigator.userAgent&&navigator.userAgent.toLowerCase().includes(t),K=J("applewebkit/")&&!J("chrome/")?Math.round:x.noop;function Q(t){t.min=K(t.min),t.max=K(t.max)}function tt(t,e,i){return"position"===t||"preserve-aspect"===t&&!h.isNear(m.aspectRatio(e),m.aspectRatio(i),.2)}function et(t){return t!==t.root&&t.scroll?.wasRoot}exports.cleanDirtyNodes=I,exports.createProjectionNode=function({attachResizeListener:e,defaultParent:g,measureScroll:x,checkIsScrollRoot:R,resetTransform:$}){return class{constructor(t={},e=g?.()){this.id=k++,this.animationId=0,this.children=new Set,this.options={},this.isTreeAnimating=!1,this.isAnimationBlocked=!1,this.isLayoutDirty=!1,this.isProjectionDirty=!1,this.isSharedProjectionDirty=!1,this.isTransformDirty=!1,this.updateManuallyBlocked=!1,this.updateBlockedByResize=!1,this.isUpdating=!1,this.isSVG=!1,this.needsReset=!1,this.shouldResetTransform=!1,this.hasCheckedOptimisedAppear=!1,this.treeScale={x:1,y:1},this.eventHandlers=new Map,this.hasTreeAnimated=!1,this.updateScheduled=!1,this.scheduleUpdate=()=>this.update(),this.projectionUpdateScheduled=!1,this.checkUpdateFailed=()=>{this.isUpdating&&(this.isUpdating=!1,this.clearAllSnapshots())},this.updateProjection=()=>{this.projectionUpdateScheduled=!1,this.nodes.forEach(w),this.nodes.forEach(z),this.nodes.forEach(H),this.nodes.forEach(I)},this.resolvedRelativeTargetAt=0,this.hasProjected=!1,this.isVisible=!0,this.animationProgress=0,this.sharedNodes=new Map,this.latestValues=t,this.root=e?e.root||e:this,this.path=e?[...e.path,e]:[],this.parent=e,this.depth=e?e.depth+1:0;for(let t=0;t<this.path.length;t++)this.path[t].shouldResetTransform=!0;this.root===this&&(this.nodes=new s.FlatTree)}addEventListener(t,e){return this.eventHandlers.has(t)||this.eventHandlers.set(t,new j.SubscriptionManager),this.eventHandlers.get(t).add(e)}notifyListeners(t,...e){const i=this.eventHandlers.get(t);i&&i.notify(...e)}hasListeners(t){return this.eventHandlers.has(t)}mount(t,s=this.root.hasTreeAnimated){if(this.instance)return;this.isSVG=i.isSVGElement(t),this.instance=t;const{layoutId:a,layout:r,visualElement:n}=this.options;if(n&&!n.current&&n.mount(t),this.root.nodes.add(this),this.parent&&this.parent.children.add(this),s&&(r||a)&&(this.isLayoutDirty=!0),e){let i;const s=()=>this.root.updateBlockedByResize=!1;e(t,(()=>{this.root.updateBlockedByResize=!0,i&&i(),i=o.delay(s,250),v.globalProjectionState.hasAnimatedSinceResize&&(v.globalProjectionState.hasAnimatedSinceResize=!1,this.nodes.forEach(N))}))}a&&this.root.registerSharedNode(a,this),!1!==this.options.animate&&n&&(a||r)&&this.addEventListener("didUpdate",(({delta:t,hasLayoutChanged:e,hasRelativeLayoutChanged:i,layout:s})=>{if(this.isTreeAnimationBlocked())return this.target=void 0,void(this.relativeTarget=void 0);const o=this.options.transition||n.getDefaultTransition()||_,{onLayoutAnimationStart:a,onLayoutAnimationComplete:r}=n.getProps(),l=!this.targetLayout||!m.boxEqualsRounded(this.targetLayout,s),h=!e&&i;if(this.options.layoutRoot||this.resumeFrom||h||e&&(l||!this.currentAnimation)){this.resumeFrom&&(this.resumingFrom=this.resumeFrom,this.resumingFrom.resumingFrom=void 0),this.setAnimationOrigin(t,h);const e={...T.getValueTransition(o,"layout"),onPlay:a,onComplete:r};(n.shouldReduceMotion||this.options.layoutRoot)&&(e.delay=0,e.type=!1),this.startAnimation(e)}else e||N(this),this.isLead()&&this.options.onExitComplete&&this.options.onExitComplete();this.targetLayout=s}))}unmount(){this.options.layoutId&&this.willUpdate(),this.root.nodes.remove(this);const t=this.getStack();t&&t.remove(this),this.parent&&this.parent.children.delete(this),this.instance=void 0,D.cancelFrame(this.updateProjection)}blockUpdate(){this.updateManuallyBlocked=!0}unblockUpdate(){this.updateManuallyBlocked=!1}isUpdateBlocked(){return this.updateManuallyBlocked||this.updateBlockedByResize}isTreeAnimationBlocked(){return this.isAnimationBlocked||this.parent&&this.parent.isTreeAnimationBlocked()||!1}startUpdate(){this.isUpdateBlocked()||(this.isUpdating=!0,this.nodes&&this.nodes.forEach(W),this.animationId++)}getTransformTemplate(){const{visualElement:t}=this.options;return t&&t.getProps().transformTemplate}willUpdate(t=!0){if(this.root.hasTreeAnimated=!0,this.root.isUpdateBlocked())return void(this.options.onExitComplete&&this.options.onExitComplete());if(window.MotionCancelOptimisedAnimation&&!this.hasCheckedOptimisedAppear&&U(this),!this.root.isUpdating&&this.root.startUpdate(),this.isLayoutDirty)return;this.isLayoutDirty=!0;for(let t=0;t<this.path.length;t++){const e=this.path[t];e.shouldResetTransform=!0,e.updateScroll("snapshot"),e.options.layoutRoot&&e.willUpdate(!1)}const{layoutId:e,layout:i}=this.options;if(void 0===e&&!i)return;const s=this.getTransformTemplate();this.prevTransformTemplateValue=s?s(this.latestValues,""):void 0,this.updateSnapshot(),t&&this.notifyListeners("willUpdate")}update(){this.updateScheduled=!1;if(this.isUpdateBlocked())return this.unblockUpdate(),this.clearAllSnapshots(),void this.nodes.forEach(O);this.isUpdating||this.nodes.forEach(b),this.isUpdating=!1,this.nodes.forEach(M),this.nodes.forEach(C),this.nodes.forEach(F),this.clearAllSnapshots();const t=B.time.now();D.frameData.delta=P.clamp(0,1e3/60,t-D.frameData.timestamp),D.frameData.timestamp=t,D.frameData.isProcessing=!0,D.frameSteps.update.process(D.frameData),D.frameSteps.preRender.process(D.frameData),D.frameSteps.render.process(D.frameData),D.frameData.isProcessing=!1}didUpdate(){this.updateScheduled||(this.updateScheduled=!0,S.microtask.read(this.scheduleUpdate))}clearAllSnapshots(){this.nodes.forEach(q),this.sharedNodes.forEach(G)}scheduleUpdateProjection(){this.projectionUpdateScheduled||(this.projectionUpdateScheduled=!0,D.frame.preRender(this.updateProjection,!1,!0))}scheduleCheckAfterUnmount(){D.frame.postRender((()=>{this.isLayoutDirty?this.root.didUpdate():this.root.checkUpdateFailed()}))}updateSnapshot(){!this.snapshot&&this.instance&&(this.snapshot=this.measure(),!this.snapshot||h.calcLength(this.snapshot.measuredBox.x)||h.calcLength(this.snapshot.measuredBox.y)||(this.snapshot=void 0))}updateLayout(){if(!this.instance)return;if(this.updateScroll(),!(this.options.alwaysMeasureLayout&&this.isLead()||this.isLayoutDirty))return;if(this.resumeFrom&&!this.resumeFrom.instance)for(let t=0;t<this.path.length;t++){this.path[t].updateScroll()}const t=this.layout;this.layout=this.measure(!1),this.layoutCorrected=u.createBox(),this.isLayoutDirty=!1,this.projectionDelta=void 0,this.notifyListeners("measure",this.layout.layoutBox);const{visualElement:e}=this.options;e&&e.notify("LayoutMeasure",this.layout.layoutBox,t?t.layoutBox:void 0)}updateScroll(t="measure"){let e=Boolean(this.options.layoutScroll&&this.instance);if(this.scroll&&this.scroll.animationId===this.root.animationId&&this.scroll.phase===t&&(e=!1),e){const e=R(this.instance);this.scroll={animationId:this.root.animationId,phase:t,isRoot:e,offset:x(this.instance),wasRoot:this.scroll?this.scroll.isRoot:e}}}resetTransform(){if(!$)return;const t=this.isLayoutDirty||this.shouldResetTransform||this.options.alwaysMeasureLayout,e=this.projectionDelta&&!m.isDeltaZero(this.projectionDelta),i=this.getTransformTemplate(),s=i?i(this.latestValues,""):void 0,o=s!==this.prevTransformTemplateValue;t&&(e||f.hasTransform(this.latestValues)||o)&&($(this.instance,s),this.shouldResetTransform=!1,this.scheduleRender())}measure(t=!0){const e=this.measurePageBox();let i=this.removeElementScroll(e);var s;return t&&(i=this.removeTransform(i)),Q((s=i).x),Q(s.y),{animationId:this.root.animationId,measuredBox:e,layoutBox:i,latestValues:{},source:this.id}}measurePageBox(){const{visualElement:t}=this.options;if(!t)return u.createBox();const e=t.measureViewportBox();if(!(this.scroll?.wasRoot||this.path.some(et))){const{scroll:t}=this.root;t&&(l.translateAxis(e.x,t.offset.x),l.translateAxis(e.y,t.offset.y))}return e}removeElementScroll(t){const e=u.createBox();if(n.copyBoxInto(e,t),this.scroll?.wasRoot)return e;for(let i=0;i<this.path.length;i++){const s=this.path[i],{scroll:o,options:a}=s;s!==this.root&&o&&a.layoutScroll&&(o.wasRoot&&n.copyBoxInto(e,t),l.translateAxis(e.x,o.offset.x),l.translateAxis(e.y,o.offset.y))}return e}applyTransform(t,e=!1){const i=u.createBox();n.copyBoxInto(i,t);for(let t=0;t<this.path.length;t++){const s=this.path[t];!e&&s.options.layoutScroll&&s.scroll&&s!==s.root&&l.transformBox(i,{x:-s.scroll.offset.x,y:-s.scroll.offset.y}),f.hasTransform(s.latestValues)&&l.transformBox(i,s.latestValues)}return f.hasTransform(this.latestValues)&&l.transformBox(i,this.latestValues),i}removeTransform(t){const e=u.createBox();n.copyBoxInto(e,t);for(let t=0;t<this.path.length;t++){const i=this.path[t];if(!i.instance)continue;if(!f.hasTransform(i.latestValues))continue;f.hasScale(i.latestValues)&&i.updateSnapshot();const s=u.createBox(),o=i.measurePageBox();n.copyBoxInto(s,o),c.removeBoxTransforms(e,i.latestValues,i.snapshot?i.snapshot.layoutBox:void 0,s)}return f.hasTransform(this.latestValues)&&c.removeBoxTransforms(e,this.latestValues),e}setTargetDelta(t){this.targetDelta=t,this.root.scheduleUpdateProjection(),this.isProjectionDirty=!0}setOptions(t){this.options={...this.options,...t,crossfade:void 0===t.crossfade||t.crossfade}}clearMeasurements(){this.scroll=void 0,this.layout=void 0,this.snapshot=void 0,this.prevTransformTemplateValue=void 0,this.targetDelta=void 0,this.target=void 0,this.isLayoutDirty=!1}forceRelativeParentToResolveTarget(){this.relativeParent&&this.relativeParent.resolvedRelativeTargetAt!==D.frameData.timestamp&&this.relativeParent.resolveTargetDelta(!0)}resolveTargetDelta(t=!1){const e=this.getLead();this.isProjectionDirty||(this.isProjectionDirty=e.isProjectionDirty),this.isTransformDirty||(this.isTransformDirty=e.isTransformDirty),this.isSharedProjectionDirty||(this.isSharedProjectionDirty=e.isSharedProjectionDirty);const i=Boolean(this.resumingFrom)||this!==e;if(!(t||i&&this.isSharedProjectionDirty||this.isProjectionDirty||this.parent?.isProjectionDirty||this.attemptToResolveRelativeTarget||this.root.updateBlockedByResize))return;const{layout:s,layoutId:o}=this.options;if(this.layout&&(s||o)){if(this.resolvedRelativeTargetAt=D.frameData.timestamp,!this.targetDelta&&!this.relativeTarget){const t=this.getClosestProjectingParent();t&&t.layout&&1!==this.animationProgress?(this.relativeParent=t,this.forceRelativeParentToResolveTarget(),this.relativeTarget=u.createBox(),this.relativeTargetOrigin=u.createBox(),h.calcRelativePosition(this.relativeTargetOrigin,this.layout.layoutBox,t.layout.layoutBox),n.copyBoxInto(this.relativeTarget,this.relativeTargetOrigin)):this.relativeParent=this.relativeTarget=void 0}if((this.relativeTarget||this.targetDelta)&&(this.target||(this.target=u.createBox(),this.targetWithTransforms=u.createBox()),this.relativeTarget&&this.relativeTargetOrigin&&this.relativeParent&&this.relativeParent.target?(this.forceRelativeParentToResolveTarget(),h.calcRelativeBox(this.target,this.relativeTarget,this.relativeParent.target)):this.targetDelta?(Boolean(this.resumingFrom)?this.target=this.applyTransform(this.layout.layoutBox):n.copyBoxInto(this.target,this.layout.layoutBox),l.applyBoxDelta(this.target,this.targetDelta)):n.copyBoxInto(this.target,this.layout.layoutBox),this.attemptToResolveRelativeTarget)){this.attemptToResolveRelativeTarget=!1;const t=this.getClosestProjectingParent();t&&Boolean(t.resumingFrom)===Boolean(this.resumingFrom)&&!t.options.layoutScroll&&t.target&&1!==this.animationProgress?(this.relativeParent=t,this.forceRelativeParentToResolveTarget(),this.relativeTarget=u.createBox(),this.relativeTargetOrigin=u.createBox(),h.calcRelativePosition(this.relativeTargetOrigin,this.target,t.target),n.copyBoxInto(this.relativeTarget,this.relativeTargetOrigin)):this.relativeParent=this.relativeTarget=void 0}}}getClosestProjectingParent(){if(this.parent&&!f.hasScale(this.parent.latestValues)&&!f.has2DTranslate(this.parent.latestValues))return this.parent.isProjecting()?this.parent:this.parent.getClosestProjectingParent()}isProjecting(){return Boolean((this.relativeTarget||this.targetDelta||this.options.layoutRoot)&&this.layout)}calcProjection(){const t=this.getLead(),e=Boolean(this.resumingFrom)||this!==t;let i=!0;if((this.isProjectionDirty||this.parent?.isProjectionDirty)&&(i=!1),e&&(this.isSharedProjectionDirty||this.isTransformDirty)&&(i=!1),this.resolvedRelativeTargetAt===D.frameData.timestamp&&(i=!1),i)return;const{layout:s,layoutId:o}=this.options;if(this.isTreeAnimating=Boolean(this.parent&&this.parent.isTreeAnimating||this.currentAnimation||this.pendingAnimation),this.isTreeAnimating||(this.targetDelta=this.relativeTarget=void 0),!this.layout||!s&&!o)return;n.copyBoxInto(this.layoutCorrected,this.layout.layoutBox);const a=this.treeScale.x,r=this.treeScale.y;l.applyTreeDeltas(this.layoutCorrected,this.treeScale,this.path,e),!t.layout||t.target||1===this.treeScale.x&&1===this.treeScale.y||(t.target=t.layout.layoutBox,t.targetWithTransforms=u.createBox());const{target:c}=t;c?(this.projectionDelta&&this.prevProjectionDelta?(n.copyAxisDeltaInto(this.prevProjectionDelta.x,this.projectionDelta.x),n.copyAxisDeltaInto(this.prevProjectionDelta.y,this.projectionDelta.y)):this.createProjectionDeltas(),h.calcBoxDelta(this.projectionDelta,this.layoutCorrected,c,this.latestValues),this.treeScale.x===a&&this.treeScale.y===r&&m.axisDeltaEquals(this.projectionDelta.x,this.prevProjectionDelta.x)&&m.axisDeltaEquals(this.projectionDelta.y,this.prevProjectionDelta.y)||(this.hasProjected=!0,this.scheduleRender(),this.notifyListeners("projectionUpdate",c))):this.prevProjectionDelta&&(this.createProjectionDeltas(),this.scheduleRender())}hide(){this.isVisible=!1}show(){this.isVisible=!0}scheduleRender(t=!0){if(this.options.visualElement?.scheduleRender(),t){const t=this.getStack();t&&t.scheduleRender()}this.resumingFrom&&!this.resumingFrom.instance&&(this.resumingFrom=void 0)}createProjectionDeltas(){this.prevProjectionDelta=u.createDelta(),this.projectionDelta=u.createDelta(),this.projectionDeltaWithTransform=u.createDelta()}setAnimationOrigin(t,e=!1){const i=this.snapshot,s=i?i.latestValues:{},o={...this.latestValues},a=u.createDelta();this.relativeParent&&this.relativeParent.options.layoutRoot||(this.relativeTarget=this.relativeTargetOrigin=void 0),this.attemptToResolveRelativeTarget=!e;const l=u.createBox(),c=(i?i.source:void 0)!==(this.layout?this.layout.source:void 0),d=this.getStack(),p=!d||d.members.length<=1,y=Boolean(c&&!p&&!0===this.options.crossfade&&!this.path.some(Y));let g;this.animationProgress=0,this.mixTargetDelta=e=>{const i=e/1e3;Z(a.x,t.x,i),Z(a.y,t.y,i),this.setTargetDelta(a),this.relativeTarget&&this.relativeTargetOrigin&&this.layout&&this.relativeParent&&this.relativeParent.layout&&(h.calcRelativePosition(l,this.layout.layoutBox,this.relativeParent.layout.layoutBox),X(this.relativeTarget,this.relativeTargetOrigin,l,i),g&&m.boxEquals(this.relativeTarget,g)&&(this.isProjectionDirty=!1),g||(g=u.createBox()),n.copyBoxInto(g,this.relativeTarget)),c&&(this.animationValues=o,r.mixValues(o,s,this.latestValues,i,y,p)),this.root.scheduleUpdateProjection(),this.scheduleRender(),this.animationProgress=i},this.mixTargetDelta(this.options.layoutRoot?1e3:0)}startAnimation(e){this.notifyListeners("animationStart"),this.currentAnimation&&this.currentAnimation.stop(),this.resumingFrom&&this.resumingFrom.currentAnimation&&this.resumingFrom.currentAnimation.stop(),this.pendingAnimation&&(D.cancelFrame(this.pendingAnimation),this.pendingAnimation=void 0),this.pendingAnimation=D.frame.update((()=>{v.globalProjectionState.hasAnimatedSinceResize=!0,A.activeAnimations.layout++,this.currentAnimation=t.animateSingleValue(0,1e3,{...e,onUpdate:t=>{this.mixTargetDelta(t),e.onUpdate&&e.onUpdate(t)},onStop:()=>{A.activeAnimations.layout--},onComplete:()=>{A.activeAnimations.layout--,e.onComplete&&e.onComplete(),this.completeAnimation()}}),this.resumingFrom&&(this.resumingFrom.currentAnimation=this.currentAnimation),this.pendingAnimation=void 0}))}completeAnimation(){this.resumingFrom&&(this.resumingFrom.currentAnimation=void 0,this.resumingFrom.preserveOpacity=void 0);const t=this.getStack();t&&t.exitAnimationComplete(),this.resumingFrom=this.currentAnimation=this.animationValues=void 0,this.notifyListeners("animationComplete")}finishAnimation(){this.currentAnimation&&(this.mixTargetDelta&&this.mixTargetDelta(1e3),this.currentAnimation.stop()),this.completeAnimation()}applyTransformsToTarget(){const t=this.getLead();let{targetWithTransforms:e,target:i,layout:s,latestValues:o}=t;if(e&&i&&s){if(this!==t&&this.layout&&s&&tt(this.options.animationType,this.layout.layoutBox,s.layoutBox)){i=this.target||u.createBox();const e=h.calcLength(this.layout.layoutBox.x);i.x.min=t.target.x.min,i.x.max=i.x.min+e;const s=h.calcLength(this.layout.layoutBox.y);i.y.min=t.target.y.min,i.y.max=i.y.min+s}n.copyBoxInto(e,i),l.transformBox(e,o),h.calcBoxDelta(this.projectionDeltaWithTransform,this.layoutCorrected,e,o)}}registerSharedNode(t,e){this.sharedNodes.has(t)||this.sharedNodes.set(t,new d.NodeStack);this.sharedNodes.get(t).add(e);const i=e.options.initialPromotionConfig;e.promote({transition:i?i.transition:void 0,preserveFollowOpacity:i&&i.shouldPreserveFollowOpacity?i.shouldPreserveFollowOpacity(e):void 0})}isLead(){const t=this.getStack();return!t||t.lead===this}getLead(){const{layoutId:t}=this.options;return t&&this.getStack()?.lead||this}getPrevLead(){const{layoutId:t}=this.options;return t?this.getStack()?.prevLead:void 0}getStack(){const{layoutId:t}=this.options;if(t)return this.root.sharedNodes.get(t)}promote({needsReset:t,transition:e,preserveFollowOpacity:i}={}){const s=this.getStack();s&&s.promote(this,i),t&&(this.projectionDelta=void 0,this.needsReset=!0),e&&this.setOptions({transition:e})}relegate(){const t=this.getStack();return!!t&&t.relegate(this)}resetSkewAndRotation(){const{visualElement:t}=this.options;if(!t)return;let e=!1;const{latestValues:i}=t;if((i.z||i.rotate||i.rotateX||i.rotateY||i.rotateZ||i.skewX||i.skewY)&&(e=!0),!e)return;const s={};i.z&&E("z",t,s,this.animationValues);for(let e=0;e<V.length;e++)E(`rotate${V[e]}`,t,s,this.animationValues),E(`skew${V[e]}`,t,s,this.animationValues);t.render();for(const e in s)t.setStaticValue(e,s[e]),this.animationValues&&(this.animationValues[e]=s[e]);t.scheduleRender()}getProjectionStyles(t){if(!this.instance||this.isSVG)return;if(!this.isVisible)return L;const e={visibility:""},i=this.getTransformTemplate();if(this.needsReset)return this.needsReset=!1,e.opacity="",e.pointerEvents=a.resolveMotionValue(t?.pointerEvents)||"",e.transform=i?i(this.latestValues,""):"none",e;const s=this.getLead();if(!this.projectionDelta||!this.layout||!s.target){const e={};return this.options.layoutId&&(e.opacity=void 0!==this.latestValues.opacity?this.latestValues.opacity:1,e.pointerEvents=a.resolveMotionValue(t?.pointerEvents)||""),this.hasProjected&&!f.hasTransform(this.latestValues)&&(e.transform=i?i({},""):"none",this.hasProjected=!1),e}const o=s.animationValues||s.latestValues;this.applyTransformsToTarget(),e.transform=y.buildProjectionTransform(this.projectionDeltaWithTransform,this.treeScale,o),i&&(e.transform=i(o,e.transform));const{x:r,y:n}=this.projectionDelta;e.transformOrigin=`${100*r.origin}% ${100*n.origin}% 0`,s.animationValues?e.opacity=s===this?o.opacity??this.latestValues.opacity??1:this.preserveOpacity?this.latestValues.opacity:o.opacityExit:e.opacity=s===this?void 0!==o.opacity?o.opacity:"":void 0!==o.opacityExit?o.opacityExit:0;for(const t in p.scaleCorrectors){if(void 0===o[t])continue;const{correct:i,applyTo:a,isCSSVariable:r}=p.scaleCorrectors[t],n="none"===e.transform?o[t]:i(o[t],s);if(a){const t=a.length;for(let i=0;i<t;i++)e[a[i]]=n}else r?this.options.visualElement.renderState.vars[t]=n:e[t]=n}return this.options.layoutId&&(e.pointerEvents=s===this?a.resolveMotionValue(t?.pointerEvents)||"":"none"),e}clearSnapshot(){this.resumeFrom=this.snapshot=void 0}resetTree(){this.root.nodes.forEach((t=>t.currentAnimation?.stop())),this.root.nodes.forEach(O),this.root.sharedNodes.clear()}}},exports.mixAxis=$,exports.mixAxisDelta=Z,exports.mixBox=X,exports.propagateDirtyNodes=w;
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("../../animation/animate/single-value.mjs.js"),e=require("../../animation/optimized-appear/get-appear-id.mjs.js"),i=require("../../render/dom/utils/is-svg-element.mjs.js"),s=require("../../render/utils/flat-tree.mjs.js"),o=require("../../utils/delay.mjs.js"),a=require("../../value/utils/resolve-motion-value.mjs.js"),r=require("../animation/mix-values.mjs.js"),n=require("../geometry/copy.mjs.js"),l=require("../geometry/delta-apply.mjs.js"),h=require("../geometry/delta-calc.mjs.js"),c=require("../geometry/delta-remove.mjs.js"),u=require("../geometry/models.mjs.js"),m=require("../geometry/utils.mjs.js"),d=require("../shared/stack.mjs.js"),p=require("../styles/scale-correction.mjs.js"),y=require("../styles/transform.mjs.js"),g=require("../utils/each-axis.mjs.js"),f=require("../utils/has-transform.mjs.js"),v=require("./state.mjs.js"),x=require("../../../../../motion-utils/dist/es/noop.mjs.js"),T=require("../../../../../motion-utils/dist/es/subscription-manager.mjs.js"),j=require("../../../../../motion-dom/dist/es/animation/utils/get-value-transition.mjs.js"),D=require("../../../../../motion-dom/dist/es/frameloop/frame.mjs.js"),B=require("../../../../../motion-dom/dist/es/frameloop/sync-time.mjs.js"),P=require("../../../../../motion-utils/dist/es/clamp.mjs.js"),S=require("../../../../../motion-dom/dist/es/frameloop/microtask.mjs.js"),R=require("../../../../../motion-dom/dist/es/utils/mix/number.mjs.js");const A=["","X","Y","Z"],V={visibility:"hidden"};let L=0;function k(t,e,i,s){const{latestValues:o}=e;o[t]&&(i[t]=o[t],e.setStaticValue(t,0),s&&(s[t]=0))}function E(t){if(t.hasCheckedOptimisedAppear=!0,t.root===t)return;const{visualElement:i}=t.options;if(!i)return;const s=e.getOptimisedAppearId(i);if(window.MotionHasOptimisedAnimation(s,"transform")){const{layout:e,layoutId:i}=t.options;window.MotionCancelOptimisedAnimation(s,"transform",D.frame,!(e||i))}const{parent:o}=t;o&&!o.hasCheckedOptimisedAppear&&E(o)}function U(t){t.updateLayout()}function C(t){const e=t.resumeFrom?.snapshot||t.snapshot;if(t.isLead()&&t.layout&&e&&t.hasListeners("didUpdate")){const{layoutBox:i,measuredBox:s}=t.layout,{animationType:o}=t.options,a=e.source!==t.layout.source;"size"===o?g.eachAxis((t=>{const s=a?e.measuredBox[t]:e.layoutBox[t],o=h.calcLength(s);s.min=i[t].min,s.max=s.min+o})):Q(o,e.layoutBox,i)&&g.eachAxis((s=>{const o=a?e.measuredBox[s]:e.layoutBox[s],r=h.calcLength(i[s]);o.max=o.min+r,t.relativeTarget&&!t.currentAnimation&&(t.isProjectionDirty=!0,t.relativeTarget[s].max=t.relativeTarget[s].min+r)}));const r=u.createDelta();h.calcBoxDelta(r,i,e.layoutBox);const n=u.createDelta();a?h.calcBoxDelta(n,t.applyTransform(s,!0),e.measuredBox):h.calcBoxDelta(n,i,e.layoutBox);const l=!m.isDeltaZero(r);let c=!1;if(!t.resumeFrom){const s=t.getClosestProjectingParent();if(s&&!s.resumeFrom){const{snapshot:o,layout:a}=s;if(o&&a){const r=u.createBox();h.calcRelativePosition(r,e.layoutBox,o.layoutBox);const n=u.createBox();h.calcRelativePosition(n,i,a.layoutBox),m.boxEqualsRounded(r,n)||(c=!0),s.options.layoutRoot&&(t.relativeTarget=n,t.relativeTargetOrigin=r,t.relativeParent=s)}}}t.notifyListeners("didUpdate",{layout:i,snapshot:e,delta:n,layoutDelta:r,hasLayoutChanged:l,hasRelativeLayoutChanged:c})}else if(t.isLead()){const{onExitComplete:e}=t.options;e&&e()}t.options.transition=void 0}function F(t){t.parent&&(t.isProjecting()||(t.isProjectionDirty=t.parent.isProjectionDirty),t.isSharedProjectionDirty||(t.isSharedProjectionDirty=Boolean(t.isProjectionDirty||t.parent.isProjectionDirty||t.parent.isSharedProjectionDirty)),t.isTransformDirty||(t.isTransformDirty=t.parent.isTransformDirty))}function w(t){t.isProjectionDirty=t.isSharedProjectionDirty=t.isTransformDirty=!1}function I(t){t.clearSnapshot()}function q(t){t.clearMeasurements()}function O(t){t.isLayoutDirty=!1}function b(t){const{visualElement:e}=t.options;e&&e.getProps().onBeforeLayoutMeasure&&e.notify("BeforeLayoutMeasure"),t.resetTransform()}function M(t){t.finishAnimation(),t.targetDelta=t.relativeTarget=t.target=void 0,t.isProjectionDirty=!0}function N(t){t.resolveTargetDelta()}function z(t){t.calcProjection()}function H(t){t.resetSkewAndRotation()}function W(t){t.removeLeadSnapshot()}function G(t,e,i){t.translate=R.mixNumber(e.translate,0,i),t.scale=R.mixNumber(e.scale,1,i),t.origin=e.origin,t.originPoint=e.originPoint}function Z(t,e,i,s){t.min=R.mixNumber(e.min,i.min,s),t.max=R.mixNumber(e.max,i.max,s)}function $(t,e,i,s){Z(t.x,e.x,i.x,s),Z(t.y,e.y,i.y,s)}function X(t){return t.animationValues&&void 0!==t.animationValues.opacityExit}const Y={duration:.45,ease:[.4,0,.1,1]},_=t=>"undefined"!=typeof navigator&&navigator.userAgent&&navigator.userAgent.toLowerCase().includes(t),J=_("applewebkit/")&&!_("chrome/")?Math.round:x.noop;function K(t){t.min=J(t.min),t.max=J(t.max)}function Q(t,e,i){return"position"===t||"preserve-aspect"===t&&!h.isNear(m.aspectRatio(e),m.aspectRatio(i),.2)}function tt(t){return t!==t.root&&t.scroll?.wasRoot}exports.cleanDirtyNodes=w,exports.createProjectionNode=function({attachResizeListener:e,defaultParent:g,measureScroll:x,checkIsScrollRoot:R,resetTransform:Z}){return class{constructor(t={},e=g?.()){this.id=L++,this.animationId=0,this.children=new Set,this.options={},this.isTreeAnimating=!1,this.isAnimationBlocked=!1,this.isLayoutDirty=!1,this.isProjectionDirty=!1,this.isSharedProjectionDirty=!1,this.isTransformDirty=!1,this.updateManuallyBlocked=!1,this.updateBlockedByResize=!1,this.isUpdating=!1,this.isSVG=!1,this.needsReset=!1,this.shouldResetTransform=!1,this.hasCheckedOptimisedAppear=!1,this.treeScale={x:1,y:1},this.eventHandlers=new Map,this.hasTreeAnimated=!1,this.updateScheduled=!1,this.scheduleUpdate=()=>this.update(),this.projectionUpdateScheduled=!1,this.checkUpdateFailed=()=>{this.isUpdating&&(this.isUpdating=!1,this.clearAllSnapshots())},this.updateProjection=()=>{this.projectionUpdateScheduled=!1,this.nodes.forEach(F),this.nodes.forEach(N),this.nodes.forEach(z),this.nodes.forEach(w)},this.resolvedRelativeTargetAt=0,this.hasProjected=!1,this.isVisible=!0,this.animationProgress=0,this.sharedNodes=new Map,this.latestValues=t,this.root=e?e.root||e:this,this.path=e?[...e.path,e]:[],this.parent=e,this.depth=e?e.depth+1:0;for(let t=0;t<this.path.length;t++)this.path[t].shouldResetTransform=!0;this.root===this&&(this.nodes=new s.FlatTree)}addEventListener(t,e){return this.eventHandlers.has(t)||this.eventHandlers.set(t,new T.SubscriptionManager),this.eventHandlers.get(t).add(e)}notifyListeners(t,...e){const i=this.eventHandlers.get(t);i&&i.notify(...e)}hasListeners(t){return this.eventHandlers.has(t)}mount(t,s=this.root.hasTreeAnimated){if(this.instance)return;this.isSVG=i.isSVGElement(t),this.instance=t;const{layoutId:a,layout:r,visualElement:n}=this.options;if(n&&!n.current&&n.mount(t),this.root.nodes.add(this),this.parent&&this.parent.children.add(this),s&&(r||a)&&(this.isLayoutDirty=!0),e){let i;const s=()=>this.root.updateBlockedByResize=!1;e(t,(()=>{this.root.updateBlockedByResize=!0,i&&i(),i=o.delay(s,250),v.globalProjectionState.hasAnimatedSinceResize&&(v.globalProjectionState.hasAnimatedSinceResize=!1,this.nodes.forEach(M))}))}a&&this.root.registerSharedNode(a,this),!1!==this.options.animate&&n&&(a||r)&&this.addEventListener("didUpdate",(({delta:t,hasLayoutChanged:e,hasRelativeLayoutChanged:i,layout:s})=>{if(this.isTreeAnimationBlocked())return this.target=void 0,void(this.relativeTarget=void 0);const o=this.options.transition||n.getDefaultTransition()||Y,{onLayoutAnimationStart:a,onLayoutAnimationComplete:r}=n.getProps(),l=!this.targetLayout||!m.boxEqualsRounded(this.targetLayout,s),h=!e&&i;if(this.options.layoutRoot||this.resumeFrom||h||e&&(l||!this.currentAnimation)){this.resumeFrom&&(this.resumingFrom=this.resumeFrom,this.resumingFrom.resumingFrom=void 0),this.setAnimationOrigin(t,h);const e={...j.getValueTransition(o,"layout"),onPlay:a,onComplete:r};(n.shouldReduceMotion||this.options.layoutRoot)&&(e.delay=0,e.type=!1),this.startAnimation(e)}else e||M(this),this.isLead()&&this.options.onExitComplete&&this.options.onExitComplete();this.targetLayout=s}))}unmount(){this.options.layoutId&&this.willUpdate(),this.root.nodes.remove(this);const t=this.getStack();t&&t.remove(this),this.parent&&this.parent.children.delete(this),this.instance=void 0,D.cancelFrame(this.updateProjection)}blockUpdate(){this.updateManuallyBlocked=!0}unblockUpdate(){this.updateManuallyBlocked=!1}isUpdateBlocked(){return this.updateManuallyBlocked||this.updateBlockedByResize}isTreeAnimationBlocked(){return this.isAnimationBlocked||this.parent&&this.parent.isTreeAnimationBlocked()||!1}startUpdate(){this.isUpdateBlocked()||(this.isUpdating=!0,this.nodes&&this.nodes.forEach(H),this.animationId++)}getTransformTemplate(){const{visualElement:t}=this.options;return t&&t.getProps().transformTemplate}willUpdate(t=!0){if(this.root.hasTreeAnimated=!0,this.root.isUpdateBlocked())return void(this.options.onExitComplete&&this.options.onExitComplete());if(window.MotionCancelOptimisedAnimation&&!this.hasCheckedOptimisedAppear&&E(this),!this.root.isUpdating&&this.root.startUpdate(),this.isLayoutDirty)return;this.isLayoutDirty=!0;for(let t=0;t<this.path.length;t++){const e=this.path[t];e.shouldResetTransform=!0,e.updateScroll("snapshot"),e.options.layoutRoot&&e.willUpdate(!1)}const{layoutId:e,layout:i}=this.options;if(void 0===e&&!i)return;const s=this.getTransformTemplate();this.prevTransformTemplateValue=s?s(this.latestValues,""):void 0,this.updateSnapshot(),t&&this.notifyListeners("willUpdate")}update(){this.updateScheduled=!1;if(this.isUpdateBlocked())return this.unblockUpdate(),this.clearAllSnapshots(),void this.nodes.forEach(q);this.isUpdating||this.nodes.forEach(O),this.isUpdating=!1,this.nodes.forEach(b),this.nodes.forEach(U),this.nodes.forEach(C),this.clearAllSnapshots();const t=B.time.now();D.frameData.delta=P.clamp(0,1e3/60,t-D.frameData.timestamp),D.frameData.timestamp=t,D.frameData.isProcessing=!0,D.frameSteps.update.process(D.frameData),D.frameSteps.preRender.process(D.frameData),D.frameSteps.render.process(D.frameData),D.frameData.isProcessing=!1}didUpdate(){this.updateScheduled||(this.updateScheduled=!0,S.microtask.read(this.scheduleUpdate))}clearAllSnapshots(){this.nodes.forEach(I),this.sharedNodes.forEach(W)}scheduleUpdateProjection(){this.projectionUpdateScheduled||(this.projectionUpdateScheduled=!0,D.frame.preRender(this.updateProjection,!1,!0))}scheduleCheckAfterUnmount(){D.frame.postRender((()=>{this.isLayoutDirty?this.root.didUpdate():this.root.checkUpdateFailed()}))}updateSnapshot(){!this.snapshot&&this.instance&&(this.snapshot=this.measure(),!this.snapshot||h.calcLength(this.snapshot.measuredBox.x)||h.calcLength(this.snapshot.measuredBox.y)||(this.snapshot=void 0))}updateLayout(){if(!this.instance)return;if(this.updateScroll(),!(this.options.alwaysMeasureLayout&&this.isLead()||this.isLayoutDirty))return;if(this.resumeFrom&&!this.resumeFrom.instance)for(let t=0;t<this.path.length;t++){this.path[t].updateScroll()}const t=this.layout;this.layout=this.measure(!1),this.layoutCorrected=u.createBox(),this.isLayoutDirty=!1,this.projectionDelta=void 0,this.notifyListeners("measure",this.layout.layoutBox);const{visualElement:e}=this.options;e&&e.notify("LayoutMeasure",this.layout.layoutBox,t?t.layoutBox:void 0)}updateScroll(t="measure"){let e=Boolean(this.options.layoutScroll&&this.instance);if(this.scroll&&this.scroll.animationId===this.root.animationId&&this.scroll.phase===t&&(e=!1),e){const e=R(this.instance);this.scroll={animationId:this.root.animationId,phase:t,isRoot:e,offset:x(this.instance),wasRoot:this.scroll?this.scroll.isRoot:e}}}resetTransform(){if(!Z)return;const t=this.isLayoutDirty||this.shouldResetTransform||this.options.alwaysMeasureLayout,e=this.projectionDelta&&!m.isDeltaZero(this.projectionDelta),i=this.getTransformTemplate(),s=i?i(this.latestValues,""):void 0,o=s!==this.prevTransformTemplateValue;t&&(e||f.hasTransform(this.latestValues)||o)&&(Z(this.instance,s),this.shouldResetTransform=!1,this.scheduleRender())}measure(t=!0){const e=this.measurePageBox();let i=this.removeElementScroll(e);var s;return t&&(i=this.removeTransform(i)),K((s=i).x),K(s.y),{animationId:this.root.animationId,measuredBox:e,layoutBox:i,latestValues:{},source:this.id}}measurePageBox(){const{visualElement:t}=this.options;if(!t)return u.createBox();const e=t.measureViewportBox();if(!(this.scroll?.wasRoot||this.path.some(tt))){const{scroll:t}=this.root;t&&(l.translateAxis(e.x,t.offset.x),l.translateAxis(e.y,t.offset.y))}return e}removeElementScroll(t){const e=u.createBox();if(n.copyBoxInto(e,t),this.scroll?.wasRoot)return e;for(let i=0;i<this.path.length;i++){const s=this.path[i],{scroll:o,options:a}=s;s!==this.root&&o&&a.layoutScroll&&(o.wasRoot&&n.copyBoxInto(e,t),l.translateAxis(e.x,o.offset.x),l.translateAxis(e.y,o.offset.y))}return e}applyTransform(t,e=!1){const i=u.createBox();n.copyBoxInto(i,t);for(let t=0;t<this.path.length;t++){const s=this.path[t];!e&&s.options.layoutScroll&&s.scroll&&s!==s.root&&l.transformBox(i,{x:-s.scroll.offset.x,y:-s.scroll.offset.y}),f.hasTransform(s.latestValues)&&l.transformBox(i,s.latestValues)}return f.hasTransform(this.latestValues)&&l.transformBox(i,this.latestValues),i}removeTransform(t){const e=u.createBox();n.copyBoxInto(e,t);for(let t=0;t<this.path.length;t++){const i=this.path[t];if(!i.instance)continue;if(!f.hasTransform(i.latestValues))continue;f.hasScale(i.latestValues)&&i.updateSnapshot();const s=u.createBox(),o=i.measurePageBox();n.copyBoxInto(s,o),c.removeBoxTransforms(e,i.latestValues,i.snapshot?i.snapshot.layoutBox:void 0,s)}return f.hasTransform(this.latestValues)&&c.removeBoxTransforms(e,this.latestValues),e}setTargetDelta(t){this.targetDelta=t,this.root.scheduleUpdateProjection(),this.isProjectionDirty=!0}setOptions(t){this.options={...this.options,...t,crossfade:void 0===t.crossfade||t.crossfade}}clearMeasurements(){this.scroll=void 0,this.layout=void 0,this.snapshot=void 0,this.prevTransformTemplateValue=void 0,this.targetDelta=void 0,this.target=void 0,this.isLayoutDirty=!1}forceRelativeParentToResolveTarget(){this.relativeParent&&this.relativeParent.resolvedRelativeTargetAt!==D.frameData.timestamp&&this.relativeParent.resolveTargetDelta(!0)}resolveTargetDelta(t=!1){const e=this.getLead();this.isProjectionDirty||(this.isProjectionDirty=e.isProjectionDirty),this.isTransformDirty||(this.isTransformDirty=e.isTransformDirty),this.isSharedProjectionDirty||(this.isSharedProjectionDirty=e.isSharedProjectionDirty);const i=Boolean(this.resumingFrom)||this!==e;if(!(t||i&&this.isSharedProjectionDirty||this.isProjectionDirty||this.parent?.isProjectionDirty||this.attemptToResolveRelativeTarget||this.root.updateBlockedByResize))return;const{layout:s,layoutId:o}=this.options;if(this.layout&&(s||o)){if(this.resolvedRelativeTargetAt=D.frameData.timestamp,!this.targetDelta&&!this.relativeTarget){const t=this.getClosestProjectingParent();t&&t.layout&&1!==this.animationProgress?(this.relativeParent=t,this.forceRelativeParentToResolveTarget(),this.relativeTarget=u.createBox(),this.relativeTargetOrigin=u.createBox(),h.calcRelativePosition(this.relativeTargetOrigin,this.layout.layoutBox,t.layout.layoutBox),n.copyBoxInto(this.relativeTarget,this.relativeTargetOrigin)):this.relativeParent=this.relativeTarget=void 0}if((this.relativeTarget||this.targetDelta)&&(this.target||(this.target=u.createBox(),this.targetWithTransforms=u.createBox()),this.relativeTarget&&this.relativeTargetOrigin&&this.relativeParent&&this.relativeParent.target?(this.forceRelativeParentToResolveTarget(),h.calcRelativeBox(this.target,this.relativeTarget,this.relativeParent.target)):this.targetDelta?(Boolean(this.resumingFrom)?this.target=this.applyTransform(this.layout.layoutBox):n.copyBoxInto(this.target,this.layout.layoutBox),l.applyBoxDelta(this.target,this.targetDelta)):n.copyBoxInto(this.target,this.layout.layoutBox),this.attemptToResolveRelativeTarget)){this.attemptToResolveRelativeTarget=!1;const t=this.getClosestProjectingParent();t&&Boolean(t.resumingFrom)===Boolean(this.resumingFrom)&&!t.options.layoutScroll&&t.target&&1!==this.animationProgress?(this.relativeParent=t,this.forceRelativeParentToResolveTarget(),this.relativeTarget=u.createBox(),this.relativeTargetOrigin=u.createBox(),h.calcRelativePosition(this.relativeTargetOrigin,this.target,t.target),n.copyBoxInto(this.relativeTarget,this.relativeTargetOrigin)):this.relativeParent=this.relativeTarget=void 0}}}getClosestProjectingParent(){if(this.parent&&!f.hasScale(this.parent.latestValues)&&!f.has2DTranslate(this.parent.latestValues))return this.parent.isProjecting()?this.parent:this.parent.getClosestProjectingParent()}isProjecting(){return Boolean((this.relativeTarget||this.targetDelta||this.options.layoutRoot)&&this.layout)}calcProjection(){const t=this.getLead(),e=Boolean(this.resumingFrom)||this!==t;let i=!0;if((this.isProjectionDirty||this.parent?.isProjectionDirty)&&(i=!1),e&&(this.isSharedProjectionDirty||this.isTransformDirty)&&(i=!1),this.resolvedRelativeTargetAt===D.frameData.timestamp&&(i=!1),i)return;const{layout:s,layoutId:o}=this.options;if(this.isTreeAnimating=Boolean(this.parent&&this.parent.isTreeAnimating||this.currentAnimation||this.pendingAnimation),this.isTreeAnimating||(this.targetDelta=this.relativeTarget=void 0),!this.layout||!s&&!o)return;n.copyBoxInto(this.layoutCorrected,this.layout.layoutBox);const a=this.treeScale.x,r=this.treeScale.y;l.applyTreeDeltas(this.layoutCorrected,this.treeScale,this.path,e),!t.layout||t.target||1===this.treeScale.x&&1===this.treeScale.y||(t.target=t.layout.layoutBox,t.targetWithTransforms=u.createBox());const{target:c}=t;c?(this.projectionDelta&&this.prevProjectionDelta?(n.copyAxisDeltaInto(this.prevProjectionDelta.x,this.projectionDelta.x),n.copyAxisDeltaInto(this.prevProjectionDelta.y,this.projectionDelta.y)):this.createProjectionDeltas(),h.calcBoxDelta(this.projectionDelta,this.layoutCorrected,c,this.latestValues),this.treeScale.x===a&&this.treeScale.y===r&&m.axisDeltaEquals(this.projectionDelta.x,this.prevProjectionDelta.x)&&m.axisDeltaEquals(this.projectionDelta.y,this.prevProjectionDelta.y)||(this.hasProjected=!0,this.scheduleRender(),this.notifyListeners("projectionUpdate",c))):this.prevProjectionDelta&&(this.createProjectionDeltas(),this.scheduleRender())}hide(){this.isVisible=!1}show(){this.isVisible=!0}scheduleRender(t=!0){if(this.options.visualElement?.scheduleRender(),t){const t=this.getStack();t&&t.scheduleRender()}this.resumingFrom&&!this.resumingFrom.instance&&(this.resumingFrom=void 0)}createProjectionDeltas(){this.prevProjectionDelta=u.createDelta(),this.projectionDelta=u.createDelta(),this.projectionDeltaWithTransform=u.createDelta()}setAnimationOrigin(t,e=!1){const i=this.snapshot,s=i?i.latestValues:{},o={...this.latestValues},a=u.createDelta();this.relativeParent&&this.relativeParent.options.layoutRoot||(this.relativeTarget=this.relativeTargetOrigin=void 0),this.attemptToResolveRelativeTarget=!e;const l=u.createBox(),c=(i?i.source:void 0)!==(this.layout?this.layout.source:void 0),d=this.getStack(),p=!d||d.members.length<=1,y=Boolean(c&&!p&&!0===this.options.crossfade&&!this.path.some(X));let g;this.animationProgress=0,this.mixTargetDelta=e=>{const i=e/1e3;G(a.x,t.x,i),G(a.y,t.y,i),this.setTargetDelta(a),this.relativeTarget&&this.relativeTargetOrigin&&this.layout&&this.relativeParent&&this.relativeParent.layout&&(h.calcRelativePosition(l,this.layout.layoutBox,this.relativeParent.layout.layoutBox),$(this.relativeTarget,this.relativeTargetOrigin,l,i),g&&m.boxEquals(this.relativeTarget,g)&&(this.isProjectionDirty=!1),g||(g=u.createBox()),n.copyBoxInto(g,this.relativeTarget)),c&&(this.animationValues=o,r.mixValues(o,s,this.latestValues,i,y,p)),this.root.scheduleUpdateProjection(),this.scheduleRender(),this.animationProgress=i},this.mixTargetDelta(this.options.layoutRoot?1e3:0)}startAnimation(e){this.notifyListeners("animationStart"),this.currentAnimation&&this.currentAnimation.stop(),this.resumingFrom&&this.resumingFrom.currentAnimation&&this.resumingFrom.currentAnimation.stop(),this.pendingAnimation&&(D.cancelFrame(this.pendingAnimation),this.pendingAnimation=void 0),this.pendingAnimation=D.frame.update((()=>{v.globalProjectionState.hasAnimatedSinceResize=!0,this.currentAnimation=t.animateSingleValue(0,1e3,{...e,onUpdate:t=>{this.mixTargetDelta(t),e.onUpdate&&e.onUpdate(t)},onStop:()=>{},onComplete:()=>{e.onComplete&&e.onComplete(),this.completeAnimation()}}),this.resumingFrom&&(this.resumingFrom.currentAnimation=this.currentAnimation),this.pendingAnimation=void 0}))}completeAnimation(){this.resumingFrom&&(this.resumingFrom.currentAnimation=void 0,this.resumingFrom.preserveOpacity=void 0);const t=this.getStack();t&&t.exitAnimationComplete(),this.resumingFrom=this.currentAnimation=this.animationValues=void 0,this.notifyListeners("animationComplete")}finishAnimation(){this.currentAnimation&&(this.mixTargetDelta&&this.mixTargetDelta(1e3),this.currentAnimation.stop()),this.completeAnimation()}applyTransformsToTarget(){const t=this.getLead();let{targetWithTransforms:e,target:i,layout:s,latestValues:o}=t;if(e&&i&&s){if(this!==t&&this.layout&&s&&Q(this.options.animationType,this.layout.layoutBox,s.layoutBox)){i=this.target||u.createBox();const e=h.calcLength(this.layout.layoutBox.x);i.x.min=t.target.x.min,i.x.max=i.x.min+e;const s=h.calcLength(this.layout.layoutBox.y);i.y.min=t.target.y.min,i.y.max=i.y.min+s}n.copyBoxInto(e,i),l.transformBox(e,o),h.calcBoxDelta(this.projectionDeltaWithTransform,this.layoutCorrected,e,o)}}registerSharedNode(t,e){this.sharedNodes.has(t)||this.sharedNodes.set(t,new d.NodeStack);this.sharedNodes.get(t).add(e);const i=e.options.initialPromotionConfig;e.promote({transition:i?i.transition:void 0,preserveFollowOpacity:i&&i.shouldPreserveFollowOpacity?i.shouldPreserveFollowOpacity(e):void 0})}isLead(){const t=this.getStack();return!t||t.lead===this}getLead(){const{layoutId:t}=this.options;return t&&this.getStack()?.lead||this}getPrevLead(){const{layoutId:t}=this.options;return t?this.getStack()?.prevLead:void 0}getStack(){const{layoutId:t}=this.options;if(t)return this.root.sharedNodes.get(t)}promote({needsReset:t,transition:e,preserveFollowOpacity:i}={}){const s=this.getStack();s&&s.promote(this,i),t&&(this.projectionDelta=void 0,this.needsReset=!0),e&&this.setOptions({transition:e})}relegate(){const t=this.getStack();return!!t&&t.relegate(this)}resetSkewAndRotation(){const{visualElement:t}=this.options;if(!t)return;let e=!1;const{latestValues:i}=t;if((i.z||i.rotate||i.rotateX||i.rotateY||i.rotateZ||i.skewX||i.skewY)&&(e=!0),!e)return;const s={};i.z&&k("z",t,s,this.animationValues);for(let e=0;e<A.length;e++)k(`rotate${A[e]}`,t,s,this.animationValues),k(`skew${A[e]}`,t,s,this.animationValues);t.render();for(const e in s)t.setStaticValue(e,s[e]),this.animationValues&&(this.animationValues[e]=s[e]);t.scheduleRender()}getProjectionStyles(t){if(!this.instance||this.isSVG)return;if(!this.isVisible)return V;const e={visibility:""},i=this.getTransformTemplate();if(this.needsReset)return this.needsReset=!1,e.opacity="",e.pointerEvents=a.resolveMotionValue(t?.pointerEvents)||"",e.transform=i?i(this.latestValues,""):"none",e;const s=this.getLead();if(!this.projectionDelta||!this.layout||!s.target){const e={};return this.options.layoutId&&(e.opacity=void 0!==this.latestValues.opacity?this.latestValues.opacity:1,e.pointerEvents=a.resolveMotionValue(t?.pointerEvents)||""),this.hasProjected&&!f.hasTransform(this.latestValues)&&(e.transform=i?i({},""):"none",this.hasProjected=!1),e}const o=s.animationValues||s.latestValues;this.applyTransformsToTarget(),e.transform=y.buildProjectionTransform(this.projectionDeltaWithTransform,this.treeScale,o),i&&(e.transform=i(o,e.transform));const{x:r,y:n}=this.projectionDelta;e.transformOrigin=`${100*r.origin}% ${100*n.origin}% 0`,s.animationValues?e.opacity=s===this?o.opacity??this.latestValues.opacity??1:this.preserveOpacity?this.latestValues.opacity:o.opacityExit:e.opacity=s===this?void 0!==o.opacity?o.opacity:"":void 0!==o.opacityExit?o.opacityExit:0;for(const t in p.scaleCorrectors){if(void 0===o[t])continue;const{correct:i,applyTo:a,isCSSVariable:r}=p.scaleCorrectors[t],n="none"===e.transform?o[t]:i(o[t],s);if(a){const t=a.length;for(let i=0;i<t;i++)e[a[i]]=n}else r?this.options.visualElement.renderState.vars[t]=n:e[t]=n}return this.options.layoutId&&(e.pointerEvents=s===this?a.resolveMotionValue(t?.pointerEvents)||"":"none"),e}clearSnapshot(){this.resumeFrom=this.snapshot=void 0}resetTree(){this.root.nodes.forEach((t=>t.currentAnimation?.stop())),this.root.nodes.forEach(q),this.root.sharedNodes.clear()}}},exports.mixAxis=Z,exports.mixAxisDelta=G,exports.mixBox=$,exports.propagateDirtyNodes=F;
|
|
2
2
|
//# sourceMappingURL=create-projection-node.mjs.js.map
|