framer-motion 5.3.3 → 5.4.0-beta

package/dist/size-rollup-m.js

@@ -1 +1 @@
-import*as t from"react";import n,{createContext as r,useContext as e,useLayoutEffect as o,useEffect as a,useRef as i,useCallback as s,useMemo as u,forwardRef as l,createElement as c}from"react";var f=function(t,n){return(f=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,n){t.__proto__=n}||function(t,n){for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(t[r]=n[r])})(t,n)};var d=function(){return(d=Object.assign||function(t){for(var n,r=1,e=arguments.length;r<e;r++)for(var o in n=arguments[r])Object.prototype.hasOwnProperty.call(n,o)&&(t[o]=n[o]);return t}).apply(this,arguments)};function p(t,n){var r={};for(var e in t)Object.prototype.hasOwnProperty.call(t,e)&&n.indexOf(e)<0&&(r[e]=t[e]);if(null!=t&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(e=Object.getOwnPropertySymbols(t);o<e.length;o++)n.indexOf(e[o])<0&&Object.prototype.propertyIsEnumerable.call(t,e[o])&&(r[e[o]]=t[e[o]])}return r}var v=function(t){return{isEnabled:function(n){return t.some((function(t){return!!n[t]}))}}},m={measureLayout:v(["layout","layoutId","drag"]),animation:v(["animate","exit","variants","whileHover","whileTap","whileFocus","whileDrag","whileInView"]),exit:v(["exit"]),drag:v(["drag","dragControls"]),focus:v(["whileFocus"]),hover:v(["whileHover","onHoverStart","onHoverEnd"]),tap:v(["whileTap","onTap","onTapStart","onTapCancel"]),pan:v(["onPan","onPanStart","onPanSessionStart","onPanEnd"]),inView:v(["whileInView","onViewportEnter","onViewportLeave"])};var y=r({strict:!1}),g=Object.keys(m),h=g.length;var w=r({transformPagePoint:function(t){return t},isStatic:!1}),b=r({});var O=r(null),S="undefined"!=typeof window,x=S?o:a;function j(t,n,r,o){var s=e(y),u=e(b).visualElement,l=e(O),c=i(void 0);o||(o=s.renderer),!c.current&&o&&(c.current=o(t,{visualState:n,parent:u,props:r,presenceId:null==l?void 0:l.id,blockInitialAnimation:!1===(null==l?void 0:l.initial)}));var f=c.current;return x((function(){null==f||f.syncRender()})),a((function(){var t;null===(t=null==f?void 0:f.animationState)||void 0===t||t.animateChanges()})),x((function(){return function(){return null==f?void 0:f.notifyUnmount()}}),[]),f}function E(t){return"object"==typeof t&&Object.prototype.hasOwnProperty.call(t,"current")}function P(t){return"string"==typeof t||function(t){return Array.isArray(t)}(t)}function C(t){var n;return"function"==typeof(null===(n=t.animate)||void 0===n?void 0:n.start)||P(t.initial)||P(t.animate)||P(t.whileHover)||P(t.whileDrag)||P(t.whileTap)||P(t.whileFocus)||P(t.exit)}function T(t){var n=function(t,n){if(C(t)){var r=t.initial,e=t.animate;return{initial:!1===r||P(r)?r:void 0,animate:P(e)?e:void 0}}return!1!==t.inherit?n:{}}(t,e(b)),r=n.initial,o=n.animate;return u((function(){return{initial:r,animate:o}}),[V(r),V(o)])}function V(t){return Array.isArray(t)?t.join(" "):t}function k(t){var n=i(null);return null===n.current&&(n.current=t()),n.current}const A="undefined"!=typeof performance?()=>performance.now():()=>Date.now(),L="undefined"!=typeof window?t=>window.requestAnimationFrame(t):t=>setTimeout(()=>t(A()),1/60*1e3);let R=!0,M=!1,B=!1;const D={delta:0,timestamp:0},X=["read","update","preRender","render","postRender"],Y=X.reduce((t,n)=>(t[n]=function(t){let n=[],r=[],e=0,o=!1,a=!1;const i=new WeakSet,s={schedule:(t,a=!1,s=!1)=>{const u=s&&o,l=u?n:r;return a&&i.add(t),-1===l.indexOf(t)&&(l.push(t),u&&o&&(e=n.length)),t},cancel:t=>{const n=r.indexOf(t);-1!==n&&r.splice(n,1),i.delete(t)},process:u=>{if(o)a=!0;else{if(o=!0,[n,r]=[r,n],r.length=0,e=n.length,e)for(let r=0;r<e;r++){const e=n[r];e(u),i.has(e)&&(s.schedule(e),t())}o=!1,a&&(a=!1,s.process(u))}}};return s}(()=>M=!0),t),{});X.reduce((t,n)=>{const r=Y[n];return t[n]=(t,n=!1,e=!1)=>(M||W(),r.schedule(t,n,e)),t},{}),X.reduce((t,n)=>(t[n]=Y[n].cancel,t),{}),X.reduce((t,n)=>(t[n]=()=>Y[n].process(D),t),{});const H=t=>Y[t].process(D),I=t=>{M=!1,D.delta=R?1/60*1e3:Math.max(Math.min(t-D.timestamp,40),1),D.timestamp=t,B=!0,X.forEach(H),B=!1,M&&(R=!1,L(I))},W=()=>{M=!0,R=!0,B||L(I)};const F={test:t=>"number"==typeof t,parse:parseFloat,transform:t=>t},Z=Object.assign(Object.assign({},F),{transform:(_=0,z=1,t=>Math.max(Math.min(t,z),_))});var _,z;const U=Object.assign(Object.assign({},F),{default:1}),N=t=>({test:n=>function(t){return"string"==typeof t}(n)&&n.endsWith(t)&&1===n.split(" ").length,parse:parseFloat,transform:n=>`${n}${t}`}),K=N("deg"),$=N("%"),q=N("px"),G=Object.assign(Object.assign({},$),{parse:t=>$.parse(t)/100,transform:t=>$.transform(100*t)});var J=function(t){return null!==t&&"object"==typeof t&&t.getVelocity},Q=d(d({},F),{transform:Math.round}),tt={borderWidth:q,borderTopWidth:q,borderRightWidth:q,borderBottomWidth:q,borderLeftWidth:q,borderRadius:q,radius:q,borderTopLeftRadius:q,borderTopRightRadius:q,borderBottomRightRadius:q,borderBottomLeftRadius:q,width:q,maxWidth:q,height:q,maxHeight:q,size:q,top:q,right:q,bottom:q,left:q,padding:q,paddingTop:q,paddingRight:q,paddingBottom:q,paddingLeft:q,margin:q,marginTop:q,marginRight:q,marginBottom:q,marginLeft:q,rotate:K,rotateX:K,rotateY:K,rotateZ:K,scale:U,scaleX:U,scaleY:U,scaleZ:U,skew:K,skewX:K,skewY:K,distance:q,translateX:q,translateY:q,translateZ:q,x:q,y:q,z:q,perspective:q,transformPerspective:q,opacity:Z,originX:G,originY:G,originZ:q,zIndex:Q,fillOpacity:Z,strokeOpacity:Z,numOctaves:Q},nt={},rt=["","X","Y","Z"],et=["transformPerspective","x","y","z"];function ot(t,n){return et.indexOf(t)-et.indexOf(n)}["translate","scale","rotate","skew"].forEach((function(t){return rt.forEach((function(n){return et.push(t+n)}))}));var at=new Set(et);function it(t){return at.has(t)}var st=new Set(["originX","originY","originZ"]);function ut(t){return st.has(t)}function lt(t){var n,r=J(t)?t.get():t;return n=r,Boolean(n&&"object"==typeof n&&n.mix&&n.toValue)?r.toValue():r}var ct=!1,ft=1;var dt=r({}),pt=r({});var vt=function(t){function n(){return null!==t&&t.apply(this,arguments)||this}return function(t,n){if("function"!=typeof n&&null!==n)throw new TypeError("Class extends value "+String(n)+" is not a constructor or null");function r(){this.constructor=t}f(t,n),t.prototype=null===n?Object.create(n):(r.prototype=n.prototype,new r)}(n,t),n.prototype.getSnapshotBeforeUpdate=function(){return this.updateProps(),null},n.prototype.componentDidUpdate=function(){},n.prototype.updateProps=function(){var t=this.props,n=t.visualElement,r=t.props;n&&n.setProps(r)},n.prototype.render=function(){return this.props.children},n}(n.Component);function mt(n){var r=n.preloadedFeatures,o=n.createVisualElement,a=n.projectionNodeConstructor,i=n.useRender,u=n.useVisualState,c=n.Component;return r&&function(t){for(var n in t)null!==t[n]&&("projectionNodeConstructor"===n?m.projectionNodeConstructor=t[n]:m[n].Component=t[n])}(r),l((function(n,r){var l=function(t){var n,r=t.layoutId,o=null===(n=e(dt))||void 0===n?void 0:n.id;return o&&void 0!==r?o+"-"+r:r}(n);n=d(d({},n),{layoutId:l});var f=e(w),p=null,v=T(n),O=k((function(){if(ct)return ft++})),x=u(n,f.isStatic);return!f.isStatic&&S&&(v.visualElement=j(c,x,d(d({},f),n),o),function(t,n,r,o){var a,i=n.layoutId,s=n.layout,u=n.drag,l=n.dragConstraints,c=n.layoutScroll,f=e(pt);o&&r&&!(null==r?void 0:r.projection)&&(r.projection=new o(t,r.getLatestValues(),null===(a=r.parent)||void 0===a?void 0:a.projection),r.projection.setOptions({layoutId:i,layout:s,alwaysMeasureLayout:Boolean(u)||l&&E(l),visualElement:r,scheduleRender:function(){return r.scheduleRender()},animationType:"string"==typeof s?s:"both",initialPromotionConfig:f,layoutScroll:c}))}(O,n,v.visualElement,a||m.projectionNodeConstructor),p=function(n,r,o){var a=[];if(e(y),!r)return null;for(var i=0;i<h;i++){var s=g[i],u=m[s],l=u.isEnabled,c=u.Component;l(n)&&c&&a.push(t.createElement(c,d({key:s},n,{visualElement:r})))}return a}(n,v.visualElement)),t.createElement(vt,{visualElement:v.visualElement,props:d(d({},f),n)},p,t.createElement(b.Provider,{value:v},i(c,n,O,function(t,n,r){return s((function(e){var o;e&&(null===(o=t.mount)||void 0===o||o.call(t,e)),n&&(e?n.mount(e):n.unmount()),r&&("function"==typeof r?r(e):E(r)&&(r.current=e))}),[n])}(x,v.visualElement,r),x,f.isStatic)))}))}var yt=["animate","circle","defs","desc","ellipse","g","image","line","filter","marker","mask","metadata","path","pattern","polygon","polyline","rect","stop","svg","switch","symbol","text","tspan","use","view"];function gt(t){return"string"==typeof t&&!t.includes("-")&&!!(yt.indexOf(t)>-1||/[A-Z]/.test(t))}function ht(t,n){var r=n.layout,e=n.layoutId;return it(t)||ut(t)||(r||void 0!==e)&&(!!nt[t]||"opacity"===t)}var wt={x:"translateX",y:"translateY",z:"translateZ",transformPerspective:"perspective"};function bt(t){return t.startsWith("--")}var Ot=function(t,n){return n&&"number"==typeof t?n.transform(t):t};function St(t,n,r,e){var o,a=t.style,i=t.vars,s=t.transform,u=t.transformKeys,l=t.transformOrigin;u.length=0;var c=!1,f=!1,d=!0;for(var p in n){var v=n[p];if(bt(p))i[p]=v;else{var m=tt[p],y=Ot(v,m);if(it(p)){if(c=!0,s[p]=y,u.push(p),!d)continue;v!==(null!==(o=m.default)&&void 0!==o?o:0)&&(d=!1)}else ut(p)?(l[p]=y,f=!0):a[p]=y}}c?a.transform=function(t,n,r,e){var o=t.transform,a=t.transformKeys,i=n.enableHardwareAcceleration,s=void 0===i||i,u=n.allowTransformNone,l=void 0===u||u,c="";a.sort(ot);for(var f=!1,d=a.length,p=0;p<d;p++){var v=a[p];c+="".concat(wt[v]||v,"(").concat(o[v],") "),"z"===v&&(f=!0)}return!f&&s?c+="translateZ(0)":c=c.trim(),e?c=e(o,r?"":c):l&&r&&(c="none"),c}(t,r,d,e):e&&(a.transform=e({},"")),f&&(a.transformOrigin=function(t){var n=t.originX,r=void 0===n?"50%":n,e=t.originY,o=void 0===e?"50%":e,a=t.originZ,i=void 0===a?0:a;return"".concat(r," ").concat(o," ").concat(i)}(l))}var xt=function(){return{style:{},transform:{},transformKeys:[],transformOrigin:{},vars:{}}};function jt(t,n,r){for(var e in n)J(n[e])||ht(e,r)||(t[e]=n[e])}function Et(t,n,r){var e={};return jt(e,t.style||{},t),Object.assign(e,function(t,n,r){var e=t.transformTemplate;return u((function(){var t={style:{},transform:{},transformKeys:[],transformOrigin:{},vars:{}};St(t,n,{enableHardwareAcceleration:!r},e);var o=t.style;return d(d({},t.vars),o)}),[n])}(t,n,r)),t.transformValues&&(e=t.transformValues(e)),e}function Pt(t,n,r){var e={},o=Et(t,n,r);return Boolean(t.drag)&&!1!==t.dragListener&&(e.draggable=!1,o.userSelect=o.WebkitUserSelect=o.WebkitTouchCallout="none",o.touchAction=!0===t.drag?"none":"pan-".concat("x"===t.drag?"y":"x")),e.style=o,e}var Ct=new Set(["initial","animate","exit","style","variants","transition","transformTemplate","transformValues","custom","inherit","layout","layoutId","layoutDependency","onLayoutAnimationComplete","onLayoutMeasure","onBeforeLayoutMeasure","onAnimationStart","onAnimationComplete","onUpdate","onDragStart","onDrag","onDragEnd","onMeasureDragConstraints","onDirectionLock","onDragTransitionEnd","drag","dragControls","dragListener","dragConstraints","dragDirectionLock","dragSnapToOrigin","_dragX","_dragY","dragElastic","dragMomentum","dragPropagation","dragTransition","whileDrag","onPan","onPanStart","onPanEnd","onPanSessionStart","onTap","onTapStart","onTapCancel","onHoverStart","onHoverEnd","whileFocus","whileTap","whileHover","whileInView","onViewportEnter","onViewportLeave","viewport","layoutScroll"]);function Tt(t){return Ct.has(t)}var Vt=function(t){return!Tt(t)};try{var kt=require("@emotion/is-prop-valid").default;Vt=function(t){return t.startsWith("on")?!Tt(t):kt(t)}}catch(t){}function At(t,n,r){return"string"==typeof t?t:q.transform(n+r*t)}var Lt={offset:"stroke-dashoffset",array:"stroke-dasharray"},Rt={offset:"strokeDashoffset",array:"strokeDasharray"};function Mt(t,n,r,e){var o=n.attrX,a=n.attrY,i=n.originX,s=n.originY,u=n.pathLength,l=n.pathSpacing,c=void 0===l?1:l,f=n.pathOffset,d=void 0===f?0:f;St(t,p(n,["attrX","attrY","originX","originY","pathLength","pathSpacing","pathOffset"]),r,e),t.attrs=t.style,t.style={};var v=t.attrs,m=t.style,y=t.dimensions;v.transform&&(y&&(m.transform=v.transform),delete v.transform),y&&(void 0!==i||void 0!==s||m.transform)&&(m.transformOrigin=function(t,n,r){var e=At(n,t.x,t.width),o=At(r,t.y,t.height);return"".concat(e," ").concat(o)}(y,void 0!==i?i:.5,void 0!==s?s:.5)),void 0!==o&&(v.x=o),void 0!==a&&(v.y=a),void 0!==u&&function(t,n,r,e,o){void 0===r&&(r=1),void 0===e&&(e=0),void 0===o&&(o=!0),t.pathLength=1;var a=o?Lt:Rt;t[a.offset]=q.transform(-e);var i=q.transform(n),s=q.transform(r);t[a.array]="".concat(i," ").concat(s)}(v,u,c,d,!1)}var Bt=function(){return d(d({},{style:{},transform:{},transformKeys:[],transformOrigin:{},vars:{}}),{attrs:{}})};function Dt(t,n){var r=u((function(){var r=Bt();return Mt(r,n,{enableHardwareAcceleration:!1},t.transformTemplate),d(d({},r.attrs),{style:d({},r.style)})}),[n]);if(t.style){var e={};jt(e,t.style,t),r.style=d(d({},e),r.style)}return r}function Xt(t){void 0===t&&(t=!1);return function(n,r,e,o,a,i){var s=a.latestValues,u=(gt(n)?Dt:Pt)(r,s,i),l=function(t,n,r){var e={};for(var o in t)(Vt(o)||!0===r&&Tt(o)||!n&&!Tt(o)||t.draggable&&o.startsWith("onDrag"))&&(e[o]=t[o]);return e}(r,"string"==typeof n,t),f=d(d(d({},l),u),{ref:o});return e&&(f["data-projection-id"]=e),c(n,f)}}var Yt=/([a-z])([A-Z])/g;var Ht=new Set(["baseFrequency","diffuseConstant","kernelMatrix","kernelUnitLength","keySplines","keyTimes","limitingConeAngle","markerHeight","markerWidth","numOctaves","targetX","targetY","surfaceScale","specularConstant","specularExponent","stdDeviation","tableValues","viewBox","gradientTransform","pathLength"]);function It(t,n){for(var r in function(t,n,r,e){var o=n.style,a=n.vars;for(var i in Object.assign(t.style,o,e&&e.getProjectionStyles(r)),a)t.style.setProperty(i,a[i])}(t,n),n.attrs)t.setAttribute(Ht.has(r)?r:r.replace(Yt,"$1-$2").toLowerCase(),n.attrs[r])}function Wt(t){var n=t.style,r={};for(var e in n)(J(n[e])||ht(e,t))&&(r[e]=n[e]);return r}function Ft(t,n,r,e){var o=t.scrapeMotionValuesFromProps,a=t.createRenderState,i=t.onMount,s={latestValues:_t(n,r,e,o),renderState:a()};return i&&(s.mount=function(t){return i(n,t,s)}),s}var Zt=function(t){return function(n,r){var o=e(b),a=e(O);return r?Ft(t,n,o,a):k((function(){return Ft(t,n,o,a)}))}};function _t(t,n,r,e){var o={},a=!1===(null==r?void 0:r.initial),i=e(t);for(var s in i)o[s]=lt(i[s]);var u=t.initial,l=t.animate,c=C(t),f=function(t){return Boolean(C(t)||t.variants)}(t);n&&f&&!c&&!1!==t.inherit&&(null!=u||(u=n.initial),null!=l||(l=n.animate));var d,v=a||!1===u,m=v?l:u;!m||"boolean"==typeof m||"object"==typeof(d=m)&&"function"==typeof d.start||(Array.isArray(m)?m:[m]).forEach((function(n){var r=function(t,n,r,e,o){var a;return void 0===e&&(e={}),void 0===o&&(o={}),"function"==typeof n&&(n=n(null!=r?r:t.custom,e,o)),"string"==typeof n&&(n=null===(a=t.variants)||void 0===a?void 0:a[n]),"function"==typeof n&&(n=n(null!=r?r:t.custom,e,o)),n}(t,n);if(r){var e=r.transitionEnd;r.transition;var a=p(r,["transitionEnd","transition"]);for(var i in a){var s=a[i];if(Array.isArray(s))s=s[v?s.length-1:0];null!==s&&(o[i]=s)}for(var i in e)o[i]=e[i]}}));return o}var zt={useVisualState:Zt({scrapeMotionValuesFromProps:function(t){var n=Wt(t);for(var r in t){if(J(t[r]))n["x"===r||"y"===r?"attr"+r.toUpperCase():r]=t[r]}return n},createRenderState:Bt,onMount:function(t,n,r){var e=r.renderState,o=r.latestValues;try{e.dimensions="function"==typeof n.getBBox?n.getBBox():n.getBoundingClientRect()}catch(t){e.dimensions={x:0,y:0,width:0,height:0}}Mt(e,o,{enableHardwareAcceleration:!1},t.transformTemplate),It(n,e)}})},Ut={useVisualState:Zt({scrapeMotionValuesFromProps:Wt,createRenderState:xt})};var Nt=function(t){function n(n,r){return void 0===r&&(r={}),mt(t(n,r))}if("undefined"==typeof Proxy)return n;var r=new Map;return new Proxy(n,{get:function(t,e){return r.has(e)||r.set(e,n(e)),r.get(e)}})}((function(t,n,r,e,o){var a=n.forwardMotionProps,i=void 0!==a&&a,s=gt(t)?zt:Ut;return d(d({},s),{preloadedFeatures:r,useRender:Xt(i),createVisualElement:e,projectionNodeConstructor:o,Component:t})}));export{Nt as m};
+import*as t from"react";import n,{createContext as r,useContext as e,useLayoutEffect as o,useEffect as a,useRef as i,useCallback as s,useMemo as u,forwardRef as l,createElement as c}from"react";var f=function(t,n){return(f=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,n){t.__proto__=n}||function(t,n){for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(t[r]=n[r])})(t,n)};var d=function(){return(d=Object.assign||function(t){for(var n,r=1,e=arguments.length;r<e;r++)for(var o in n=arguments[r])Object.prototype.hasOwnProperty.call(n,o)&&(t[o]=n[o]);return t}).apply(this,arguments)};function p(t,n){var r={};for(var e in t)Object.prototype.hasOwnProperty.call(t,e)&&n.indexOf(e)<0&&(r[e]=t[e]);if(null!=t&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(e=Object.getOwnPropertySymbols(t);o<e.length;o++)n.indexOf(e[o])<0&&Object.prototype.propertyIsEnumerable.call(t,e[o])&&(r[e[o]]=t[e[o]])}return r}var v=function(t){return{isEnabled:function(n){return t.some((function(t){return!!n[t]}))}}},m={measureLayout:v(["layout","layoutId","drag"]),animation:v(["animate","exit","variants","whileHover","whileTap","whileFocus","whileDrag","whileInView"]),exit:v(["exit"]),drag:v(["drag","dragControls"]),focus:v(["whileFocus"]),hover:v(["whileHover","onHoverStart","onHoverEnd"]),tap:v(["whileTap","onTap","onTapStart","onTapCancel"]),pan:v(["onPan","onPanStart","onPanSessionStart","onPanEnd"]),inView:v(["whileInView","onViewportEnter","onViewportLeave"])};var y=r({strict:!1}),g=Object.keys(m),h=g.length;var w=r({transformPagePoint:function(t){return t},isStatic:!1}),b=r({});var O=r(null),S="undefined"!=typeof window,x=S?o:a;function E(t,n,r,o){var s=e(y),u=e(b).visualElement,l=e(O),c=i(void 0);o||(o=s.renderer),!c.current&&o&&(c.current=o(t,{visualState:n,parent:u,props:r,presenceId:null==l?void 0:l.id,blockInitialAnimation:!1===(null==l?void 0:l.initial)}));var f=c.current;return x((function(){null==f||f.syncRender()})),a((function(){var t;null===(t=null==f?void 0:f.animationState)||void 0===t||t.animateChanges()})),x((function(){return function(){return null==f?void 0:f.notifyUnmount()}}),[]),f}function j(t){return"object"==typeof t&&Object.prototype.hasOwnProperty.call(t,"current")}function P(t){return"string"==typeof t||function(t){return Array.isArray(t)}(t)}function C(t){var n;return"function"==typeof(null===(n=t.animate)||void 0===n?void 0:n.start)||P(t.initial)||P(t.animate)||P(t.whileHover)||P(t.whileDrag)||P(t.whileTap)||P(t.whileFocus)||P(t.exit)}function T(t){var n=function(t,n){if(C(t)){var r=t.initial,e=t.animate;return{initial:!1===r||P(r)?r:void 0,animate:P(e)?e:void 0}}return!1!==t.inherit?n:{}}(t,e(b)),r=n.initial,o=n.animate;return u((function(){return{initial:r,animate:o}}),[V(r),V(o)])}function V(t){return Array.isArray(t)?t.join(" "):t}function k(t){var n=i(null);return null===n.current&&(n.current=t()),n.current}const A="undefined"!=typeof performance?()=>performance.now():()=>Date.now(),L="undefined"!=typeof window?t=>window.requestAnimationFrame(t):t=>setTimeout(()=>t(A()),1/60*1e3);let R=!0,M=!1,B=!1;const D={delta:0,timestamp:0},X=["read","update","preRender","render","postRender"],Y=X.reduce((t,n)=>(t[n]=function(t){let n=[],r=[],e=0,o=!1,a=!1;const i=new WeakSet,s={schedule:(t,a=!1,s=!1)=>{const u=s&&o,l=u?n:r;return a&&i.add(t),-1===l.indexOf(t)&&(l.push(t),u&&o&&(e=n.length)),t},cancel:t=>{const n=r.indexOf(t);-1!==n&&r.splice(n,1),i.delete(t)},process:u=>{if(o)a=!0;else{if(o=!0,[n,r]=[r,n],r.length=0,e=n.length,e)for(let r=0;r<e;r++){const e=n[r];e(u),i.has(e)&&(s.schedule(e),t())}o=!1,a&&(a=!1,s.process(u))}}};return s}(()=>M=!0),t),{});X.reduce((t,n)=>{const r=Y[n];return t[n]=(t,n=!1,e=!1)=>(M||W(),r.schedule(t,n,e)),t},{}),X.reduce((t,n)=>(t[n]=Y[n].cancel,t),{}),X.reduce((t,n)=>(t[n]=()=>Y[n].process(D),t),{});const H=t=>Y[t].process(D),I=t=>{M=!1,D.delta=R?1/60*1e3:Math.max(Math.min(t-D.timestamp,40),1),D.timestamp=t,B=!0,X.forEach(H),B=!1,M&&(R=!1,L(I))},W=()=>{M=!0,R=!0,B||L(I)};const F={test:t=>"number"==typeof t,parse:parseFloat,transform:t=>t},Z=Object.assign(Object.assign({},F),{transform:(_=0,z=1,t=>Math.max(Math.min(t,z),_))});var _,z;const U=Object.assign(Object.assign({},F),{default:1}),N=t=>({test:n=>function(t){return"string"==typeof t}(n)&&n.endsWith(t)&&1===n.split(" ").length,parse:parseFloat,transform:n=>`${n}${t}`}),K=N("deg"),$=N("%"),q=N("px"),G=Object.assign(Object.assign({},$),{parse:t=>$.parse(t)/100,transform:t=>$.transform(100*t)});var J=function(t){return null!==t&&"object"==typeof t&&t.getVelocity},Q=d(d({},F),{transform:Math.round}),tt={borderWidth:q,borderTopWidth:q,borderRightWidth:q,borderBottomWidth:q,borderLeftWidth:q,borderRadius:q,radius:q,borderTopLeftRadius:q,borderTopRightRadius:q,borderBottomRightRadius:q,borderBottomLeftRadius:q,width:q,maxWidth:q,height:q,maxHeight:q,size:q,top:q,right:q,bottom:q,left:q,padding:q,paddingTop:q,paddingRight:q,paddingBottom:q,paddingLeft:q,margin:q,marginTop:q,marginRight:q,marginBottom:q,marginLeft:q,rotate:K,rotateX:K,rotateY:K,rotateZ:K,scale:U,scaleX:U,scaleY:U,scaleZ:U,skew:K,skewX:K,skewY:K,distance:q,translateX:q,translateY:q,translateZ:q,x:q,y:q,z:q,perspective:q,transformPerspective:q,opacity:Z,originX:G,originY:G,originZ:q,zIndex:Q,fillOpacity:Z,strokeOpacity:Z,numOctaves:Q},nt={},rt=["","X","Y","Z"],et=["transformPerspective","x","y","z"];function ot(t,n){return et.indexOf(t)-et.indexOf(n)}["translate","scale","rotate","skew"].forEach((function(t){return rt.forEach((function(n){return et.push(t+n)}))}));var at=new Set(et);function it(t){return at.has(t)}var st=new Set(["originX","originY","originZ"]);function ut(t){return st.has(t)}function lt(t){var n,r=J(t)?t.get():t;return n=r,Boolean(n&&"object"==typeof n&&n.mix&&n.toValue)?r.toValue():r}var ct=!1,ft=1;var dt=r({}),pt=r({});var vt=function(t){function n(){return null!==t&&t.apply(this,arguments)||this}return function(t,n){if("function"!=typeof n&&null!==n)throw new TypeError("Class extends value "+String(n)+" is not a constructor or null");function r(){this.constructor=t}f(t,n),t.prototype=null===n?Object.create(n):(r.prototype=n.prototype,new r)}(n,t),n.prototype.getSnapshotBeforeUpdate=function(){return this.updateProps(),null},n.prototype.componentDidUpdate=function(){},n.prototype.updateProps=function(){var t=this.props,n=t.visualElement,r=t.props;n&&n.setProps(r)},n.prototype.render=function(){return this.props.children},n}(n.Component);function mt(n){var r=n.preloadedFeatures,o=n.createVisualElement,a=n.projectionNodeConstructor,i=n.useRender,u=n.useVisualState,c=n.Component;return r&&function(t){for(var n in t)null!==t[n]&&("projectionNodeConstructor"===n?m.projectionNodeConstructor=t[n]:m[n].Component=t[n])}(r),l((function(n,r){var l=function(t){var n,r=t.layoutId,o=null===(n=e(dt))||void 0===n?void 0:n.id;return o&&void 0!==r?o+"-"+r:r}(n);n=d(d({},n),{layoutId:l});var f=e(w),p=null,v=T(n),O=k((function(){if(ct)return ft++})),x=u(n,f.isStatic);return!f.isStatic&&S&&(v.visualElement=E(c,x,d(d({},f),n),o),function(t,n,r,o){var a,i=n.layoutId,s=n.layout,u=n.drag,l=n.dragConstraints,c=n.layoutScroll,f=e(pt);o&&r&&!(null==r?void 0:r.projection)&&(r.projection=new o(t,r.getLatestValues(),null===(a=r.parent)||void 0===a?void 0:a.projection),r.projection.setOptions({layoutId:i,layout:s,alwaysMeasureLayout:Boolean(u)||l&&j(l),visualElement:r,scheduleRender:function(){return r.scheduleRender()},animationType:"string"==typeof s?s:"both",initialPromotionConfig:f,layoutScroll:c}))}(O,n,v.visualElement,a||m.projectionNodeConstructor),p=function(n,r,o){var a=[];if(e(y),!r)return null;for(var i=0;i<h;i++){var s=g[i],u=m[s],l=u.isEnabled,c=u.Component;l(n)&&c&&a.push(t.createElement(c,d({key:s},n,{visualElement:r})))}return a}(n,v.visualElement)),t.createElement(vt,{visualElement:v.visualElement,props:d(d({},f),n)},p,t.createElement(b.Provider,{value:v},i(c,n,O,function(t,n,r){return s((function(e){var o;e&&(null===(o=t.mount)||void 0===o||o.call(t,e)),n&&(e?n.mount(e):n.unmount()),r&&("function"==typeof r?r(e):j(r)&&(r.current=e))}),[n])}(x,v.visualElement,r),x,f.isStatic,v.visualElement)))}))}var yt=["animate","circle","defs","desc","ellipse","g","image","line","filter","marker","mask","metadata","path","pattern","polygon","polyline","rect","stop","svg","switch","symbol","text","tspan","use","view"];function gt(t){return"string"==typeof t&&!t.includes("-")&&!!(yt.indexOf(t)>-1||/[A-Z]/.test(t))}function ht(t,n){var r=n.layout,e=n.layoutId;return it(t)||ut(t)||(r||void 0!==e)&&(!!nt[t]||"opacity"===t)}var wt={x:"translateX",y:"translateY",z:"translateZ",transformPerspective:"perspective"};function bt(t){return t.startsWith("--")}var Ot=function(t,n){return n&&"number"==typeof t?n.transform(t):t};function St(t,n,r,e){var o,a=t.style,i=t.vars,s=t.transform,u=t.transformKeys,l=t.transformOrigin;u.length=0;var c=!1,f=!1,d=!0;for(var p in n){var v=n[p];if(bt(p))i[p]=v;else{var m=tt[p],y=Ot(v,m);if(it(p)){if(c=!0,s[p]=y,u.push(p),!d)continue;v!==(null!==(o=m.default)&&void 0!==o?o:0)&&(d=!1)}else ut(p)?(l[p]=y,f=!0):a[p]=y}}c?a.transform=function(t,n,r,e){var o=t.transform,a=t.transformKeys,i=n.enableHardwareAcceleration,s=void 0===i||i,u=n.allowTransformNone,l=void 0===u||u,c="";a.sort(ot);for(var f=!1,d=a.length,p=0;p<d;p++){var v=a[p];c+="".concat(wt[v]||v,"(").concat(o[v],") "),"z"===v&&(f=!0)}return!f&&s?c+="translateZ(0)":c=c.trim(),e?c=e(o,r?"":c):l&&r&&(c="none"),c}(t,r,d,e):e&&(a.transform=e({},"")),f&&(a.transformOrigin=function(t){var n=t.originX,r=void 0===n?"50%":n,e=t.originY,o=void 0===e?"50%":e,a=t.originZ,i=void 0===a?0:a;return"".concat(r," ").concat(o," ").concat(i)}(l))}var xt=function(){return{style:{},transform:{},transformKeys:[],transformOrigin:{},vars:{}}};function Et(t,n,r){for(var e in n)J(n[e])||ht(e,r)||(t[e]=n[e])}function jt(t,n,r){var e={};return Et(e,t.style||{},t),Object.assign(e,function(t,n,r){var e=t.transformTemplate;return u((function(){var t={style:{},transform:{},transformKeys:[],transformOrigin:{},vars:{}};St(t,n,{enableHardwareAcceleration:!r},e);var o=t.style;return d(d({},t.vars),o)}),[n])}(t,n,r)),t.transformValues&&(e=t.transformValues(e)),e}function Pt(t,n,r){var e={},o=jt(t,n,r);return Boolean(t.drag)&&!1!==t.dragListener&&(e.draggable=!1,o.userSelect=o.WebkitUserSelect=o.WebkitTouchCallout="none",o.touchAction=!0===t.drag?"none":"pan-".concat("x"===t.drag?"y":"x")),e.style=o,e}var Ct=new Set(["initial","animate","exit","style","variants","transition","transformTemplate","transformValues","custom","inherit","layout","layoutId","layoutDependency","onLayoutAnimationComplete","onLayoutMeasure","onBeforeLayoutMeasure","onAnimationStart","onAnimationComplete","onUpdate","onDragStart","onDrag","onDragEnd","onMeasureDragConstraints","onDirectionLock","onDragTransitionEnd","drag","dragControls","dragListener","dragConstraints","dragDirectionLock","dragSnapToOrigin","_dragX","_dragY","dragElastic","dragMomentum","dragPropagation","dragTransition","whileDrag","onPan","onPanStart","onPanEnd","onPanSessionStart","onTap","onTapStart","onTapCancel","onHoverStart","onHoverEnd","whileFocus","whileTap","whileHover","whileInView","onViewportEnter","onViewportLeave","viewport","layoutScroll"]);function Tt(t){return Ct.has(t)}var Vt=function(t){return!Tt(t)};try{var kt=require("@emotion/is-prop-valid").default;Vt=function(t){return t.startsWith("on")?!Tt(t):kt(t)}}catch(t){}function At(t,n,r){return"string"==typeof t?t:q.transform(n+r*t)}var Lt={offset:"stroke-dashoffset",array:"stroke-dasharray"},Rt={offset:"strokeDashoffset",array:"strokeDasharray"};function Mt(t,n,r,e){var o=n.attrX,a=n.attrY,i=n.originX,s=n.originY,u=n.pathLength,l=n.pathSpacing,c=void 0===l?1:l,f=n.pathOffset,d=void 0===f?0:f;St(t,p(n,["attrX","attrY","originX","originY","pathLength","pathSpacing","pathOffset"]),r,e),t.attrs=t.style,t.style={};var v=t.attrs,m=t.style,y=t.dimensions;v.transform&&(y&&(m.transform=v.transform),delete v.transform),y&&(void 0!==i||void 0!==s||m.transform)&&(m.transformOrigin=function(t,n,r){var e=At(n,t.x,t.width),o=At(r,t.y,t.height);return"".concat(e," ").concat(o)}(y,void 0!==i?i:.5,void 0!==s?s:.5)),void 0!==o&&(v.x=o),void 0!==a&&(v.y=a),void 0!==u&&function(t,n,r,e,o){void 0===r&&(r=1),void 0===e&&(e=0),void 0===o&&(o=!0),t.pathLength=1;var a=o?Lt:Rt;t[a.offset]=q.transform(-e);var i=q.transform(n),s=q.transform(r);t[a.array]="".concat(i," ").concat(s)}(v,u,c,d,!1)}var Bt=function(){return d(d({},{style:{},transform:{},transformKeys:[],transformOrigin:{},vars:{}}),{attrs:{}})};function Dt(t,n){var r=u((function(){var r=Bt();return Mt(r,n,{enableHardwareAcceleration:!1},t.transformTemplate),d(d({},r.attrs),{style:d({},r.style)})}),[n]);if(t.style){var e={};Et(e,t.style,t),r.style=d(d({},e),r.style)}return r}function Xt(t){void 0===t&&(t=!1);return function(n,r,e,o,a,i){var s=a.latestValues,u=(gt(n)?Dt:Pt)(r,s,i),l=function(t,n,r){var e={};for(var o in t)(Vt(o)||!0===r&&Tt(o)||!n&&!Tt(o)||t.draggable&&o.startsWith("onDrag"))&&(e[o]=t[o]);return e}(r,"string"==typeof n,t),f=d(d(d({},l),u),{ref:o});return e&&(f["data-projection-id"]=e),c(n,f)}}var Yt=/([a-z])([A-Z])/g;var Ht=new Set(["baseFrequency","diffuseConstant","kernelMatrix","kernelUnitLength","keySplines","keyTimes","limitingConeAngle","markerHeight","markerWidth","numOctaves","targetX","targetY","surfaceScale","specularConstant","specularExponent","stdDeviation","tableValues","viewBox","gradientTransform","pathLength"]);function It(t,n){for(var r in function(t,n,r,e){var o=n.style,a=n.vars;for(var i in Object.assign(t.style,o,e&&e.getProjectionStyles(r)),a)t.style.setProperty(i,a[i])}(t,n),n.attrs)t.setAttribute(Ht.has(r)?r:r.replace(Yt,"$1-$2").toLowerCase(),n.attrs[r])}function Wt(t){var n=t.style,r={};for(var e in n)(J(n[e])||ht(e,t))&&(r[e]=n[e]);return r}function Ft(t,n,r,e){var o=t.scrapeMotionValuesFromProps,a=t.createRenderState,i=t.onMount,s={latestValues:_t(n,r,e,o),renderState:a()};return i&&(s.mount=function(t){return i(n,t,s)}),s}var Zt=function(t){return function(n,r){var o=e(b),a=e(O);return r?Ft(t,n,o,a):k((function(){return Ft(t,n,o,a)}))}};function _t(t,n,r,e){var o={},a=!1===(null==r?void 0:r.initial),i=e(t);for(var s in i)o[s]=lt(i[s]);var u=t.initial,l=t.animate,c=C(t),f=function(t){return Boolean(C(t)||t.variants)}(t);n&&f&&!c&&!1!==t.inherit&&(null!=u||(u=n.initial),null!=l||(l=n.animate));var d,v=a||!1===u,m=v?l:u;!m||"boolean"==typeof m||"object"==typeof(d=m)&&"function"==typeof d.start||(Array.isArray(m)?m:[m]).forEach((function(n){var r=function(t,n,r,e,o){var a;return void 0===e&&(e={}),void 0===o&&(o={}),"function"==typeof n&&(n=n(null!=r?r:t.custom,e,o)),"string"==typeof n&&(n=null===(a=t.variants)||void 0===a?void 0:a[n]),"function"==typeof n&&(n=n(null!=r?r:t.custom,e,o)),n}(t,n);if(r){var e=r.transitionEnd;r.transition;var a=p(r,["transitionEnd","transition"]);for(var i in a){var s=a[i];if(Array.isArray(s))s=s[v?s.length-1:0];null!==s&&(o[i]=s)}for(var i in e)o[i]=e[i]}}));return o}var zt={useVisualState:Zt({scrapeMotionValuesFromProps:function(t){var n=Wt(t);for(var r in t){if(J(t[r]))n["x"===r||"y"===r?"attr"+r.toUpperCase():r]=t[r]}return n},createRenderState:Bt,onMount:function(t,n,r){var e=r.renderState,o=r.latestValues;try{e.dimensions="function"==typeof n.getBBox?n.getBBox():n.getBoundingClientRect()}catch(t){e.dimensions={x:0,y:0,width:0,height:0}}Mt(e,o,{enableHardwareAcceleration:!1},t.transformTemplate),It(n,e)}})},Ut={useVisualState:Zt({scrapeMotionValuesFromProps:Wt,createRenderState:xt})};var Nt=function(t){function n(n,r){return void 0===r&&(r={}),mt(t(n,r))}if("undefined"==typeof Proxy)return n;var r=new Map;return new Proxy(n,{get:function(t,e){return r.has(e)||r.set(e,n(e)),r.get(e)}})}((function(t,n,r,e,o){var a=n.forwardMotionProps,i=void 0!==a&&a,s=gt(t)?zt:Ut;return d(d({},s),{preloadedFeatures:r,useRender:Xt(i),createVisualElement:e,projectionNodeConstructor:o,Component:t})}));export{Nt as m};

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "framer-motion",
-    "version": "5.3.3",
+    "version": "5.4.0-beta",
     "description": "A simple and powerful React animation library",
     "main": "dist/framer-motion.cjs.js",
     "module": "dist/es/index.mjs",
@@ -10,6 +10,11 @@
             "import": "./dist/es/index.mjs",
             "default": "./dist/framer-motion.cjs.js"
         },
+        "./three": {
+            "require": "./dist/framer-motion-three.cjs.js",
+            "import": "./dist/es/render/three/index.mjs",
+            "default": "./dist/framer-motion-three.cjs.js"
+        },
         "./package.json": "./package.json"
     },
     "types": "types/index.d.ts",
@@ -20,6 +25,8 @@
     "keywords": [
         "react animation",
         "react",
+        "three",
+        "3d",
         "pose",
         "react pose",
         "animation",
@@ -54,12 +61,24 @@
         "start-dev-server": "webpack serve --config dev/webpack/config.js --hot"
     },
     "peerDependencies": {
+        "@react-three/fiber": "^7.0.21",
         "react": ">=16.8 || ^17.0.0",
-        "react-dom": ">=16.8 || ^17.0.0"
+        "react-dom": ">=16.8 || ^17.0.0",
+        "three": "^0.135.0"
+    },
+    "peerDependenciesMeta": {
+        "@react-three/fiber": {
+            "optional": true
+        },
+        "three": {
+            "optional": true
+        }
     },
     "devDependencies": {
         "@cypress/webpack-preprocessor": "^4.1.0",
         "@pmmmwh/react-refresh-webpack-plugin": "^0.4.3",
+        "@react-three/fiber": "^7.0.21",
+        "@react-three/test-renderer": "^7.0.20",
         "@rollup/plugin-node-resolve": "^8.0.0",
         "@rollup/plugin-replace": "^2.3.2",
         "@testing-library/dom": "^6.10.1",
@@ -70,6 +89,7 @@
         "@types/react": "17.0.9",
         "@types/react-dom": "17.0.6",
         "@types/styled-components": "^4.1.0",
+        "@types/three": "^0.134.0",
         "@typescript-eslint/eslint-plugin": "^1.5.0",
         "@typescript-eslint/parser": "^1.5.0",
         "bundlesize": "^0.18.0",
@@ -101,6 +121,7 @@
         "rollup-plugin-visualizer": "^2.4.3",
         "start-server-and-test": "^1.9.1",
         "styled-components": "^4.1.1",
+        "three": "^0.135.0",
         "ts-jest": "^24.0.2",
         "ts-loader": "^5.3.0",
         "type-fest": "^1.0.1",
@@ -113,7 +134,7 @@
     "dependencies": {
         "framesync": "6.0.1",
         "hey-listen": "^1.0.8",
-        "popmotion": "11.0.0",
+        "popmotion": "11.0.2",
         "style-value-types": "5.0.0",
         "tslib": "^2.1.0"
     },

package/types/motion/features/types.d.ts

@@ -49,4 +49,4 @@ export declare type FeatureDefinitions = {
 export declare type LoadedFeatures = FeatureDefinitions & {
     projectionNodeConstructor?: any;
 };
-export declare type RenderComponent<Instance, RenderState> = (Component: string | React.ComponentType, props: MotionProps, projectionId: number | undefined, ref: React.Ref<Instance>, visualState: VisualState<Instance, RenderState>, isStatic: boolean) => any;
+export declare type RenderComponent<Instance, RenderState> = (Component: string | React.ComponentType, props: MotionProps, projectionId: number | undefined, ref: React.Ref<Instance>, visualState: VisualState<Instance, RenderState>, isStatic: boolean, visualElement?: VisualElement) => any;

package/types/render/three/create-visual-element.d.ts

@@ -0,0 +1,6 @@
+import { CreateVisualElement, ScrapeMotionValuesFromProps } from "../types";
+import { Object3DNode } from "@react-three/fiber";
+export declare const scrapeMotionValuesFromProps: ScrapeMotionValuesFromProps;
+export declare const createRenderState: () => {};
+export declare const threeVisualElement: ({ parent, props, presenceId, blockInitialAnimation, visualState, }: import("../types").VisualElementOptions<Object3DNode<any, any>, any>, options?: {}) => import("../types").VisualElement<Object3DNode<any, any>, any>;
+export declare const createVisualElement: CreateVisualElement<any>;

package/types/render/three/gestures/use-hover.d.ts

@@ -0,0 +1,10 @@
+import { MeshProps, ThreeEvent } from "@react-three/fiber";
+import { VisualElement } from "../../types";
+import { ThreeMotionProps } from "../types";
+export declare function useHover(isStatic: boolean, { whileHover, onHoverStart, onHoverEnd, onPointerOver, onPointerOut, }: ThreeMotionProps & MeshProps, visualElement?: VisualElement): {
+    onPointerOver?: undefined;
+    onPointerOut?: undefined;
+} | {
+    onPointerOver: (event: ThreeEvent<any>) => void;
+    onPointerOut: (event: ThreeEvent<any>) => void;
+};

package/types/render/three/gestures/use-tap.d.ts

@@ -0,0 +1,8 @@
+import { MeshProps } from "@react-three/fiber";
+import { VisualElement } from "../../types";
+import { ThreeMotionProps } from "../types";
+export declare function useTap(isStatic: boolean, { whileTap, onTapStart, onTap, onTapCancel, onPointerDown, }: ThreeMotionProps & MeshProps, visualElement?: VisualElement): {
+    onPointerDown?: undefined;
+} | {
+    onPointerDown: EventListener;
+};

package/types/render/three/motion.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import type { ThreeMotionComponents } from "./types";
+declare function custom<Props>(Component: string): import("react").ForwardRefExoticComponent<import("react").PropsWithoutRef<Props & import("../..").MotionProps> & import("react").RefAttributes<any>>;
+export declare const motion: typeof custom & ThreeMotionComponents;
+export {};

package/types/render/three/types.d.ts

@@ -0,0 +1,24 @@
+import { MeshProps } from "@react-three/fiber";
+import type { ForwardRefExoticComponent, PropsWithoutRef, RefAttributes } from "react";
+import { HoverHandlers, TapHandlers } from "../..";
+import { AnimationProps } from "../../motion/types";
+import { ResolvedValues } from "../types";
+import { AnimationLifecycles } from "../utils/lifecycles";
+export interface ThreeMotionProps extends AnimationLifecycles, AnimationProps, TapHandlers, HoverHandlers {
+    onInstanceUpdate?: MeshProps["onUpdate"];
+}
+export interface ThreeRenderState {
+    latestValues: ResolvedValues;
+}
+/**
+ * @public
+ */
+export declare type ForwardRefComponent<T, P> = ForwardRefExoticComponent<PropsWithoutRef<P> & RefAttributes<T>>;
+/**
+ * Motion-optimised versions of React's HTML components.
+ *
+ * @public
+ */
+export declare type ThreeMotionComponents = {
+    [K in keyof JSX.IntrinsicElements]: ForwardRefComponent<JSX.IntrinsicElements[K], ThreeMotionProps & Omit<JSX.IntrinsicElements[K], "onUpdate">>;
+};

package/types/render/three/use-render.d.ts

@@ -0,0 +1,4 @@
+import { RenderComponent } from "../..";
+import { ThreeRenderState } from "./types";
+import { Object3DNode } from "@react-three/fiber";
+export declare const useRender: RenderComponent<Object3DNode<any, any>, ThreeRenderState>;

package/types/render/three/utils/read-value.d.ts

@@ -0,0 +1,2 @@
+import { Object3DNode } from "@react-three/fiber";
+export declare function readThreeValue(instance: Object3DNode<any, any>, name: string): any;

package/types/render/three/utils/set-value.d.ts

@@ -0,0 +1,2 @@
+import { ThreeRenderState } from "../types";
+export declare function setThreeValue(instance: any, key: string, values: ThreeRenderState): void;

package/types/render/utils/lifecycles.d.ts

@@ -12,12 +12,15 @@ export declare type LayoutAnimationCompleteListener = () => void;
 export declare type SetAxisTargetListener = () => void;
 export declare type RenderListener = () => void;
 export declare type OnViewportBoxUpdate = (box: Axis, delta: Delta) => void;
-/**
- * TODO: Make more of these lifecycle events available as props
- */
-export interface VisualElementLifecycles {
+export interface LayoutLifecycles {
     onBeforeLayoutMeasure?(box: Box): void;
     onLayoutMeasure?(box: Box, prevBox: Box): void;
+    /**
+     * @internal
+     */
+    onLayoutAnimationComplete?(): void;
+}
+export interface AnimationLifecycles {
     /**
      * Callback with latest motion values, fired max once per frame.
      *
@@ -71,15 +74,12 @@ export interface VisualElementLifecycles {
      * ```
      */
     onAnimationComplete?(definition: AnimationDefinition): void;
-    /**
-     * @internal
-     */
-    onLayoutAnimationComplete?(): void;
     /**
      * @internal
      */
     onUnmount?(): void;
 }
+export declare type VisualElementLifecycles = LayoutLifecycles & AnimationLifecycles;
 export interface LifecycleManager {
     onLayoutMeasure: (callback: LayoutMeasureListener) => () => void;
     notifyLayoutMeasure: LayoutMeasureListener;

package/types/render/utils/setters.d.ts

@@ -567,6 +567,7 @@ export declare function getOrigin(target: Target, transition: Transition, visual
     WebkitFontSmoothing?: import("csstype").Property.FontSmooth<string | number> | undefined;
     WebkitFontVariantLigatures?: import("csstype").Property.FontVariantLigatures | undefined;
     WebkitHyphens?: import("csstype").Property.Hyphens | undefined;
+    WebkitInitialLetter?: import("csstype").Property.InitialLetter | undefined;
     WebkitJustifyContent?: import("csstype").Property.JustifyContent | undefined;
     WebkitLineBreak?: import("csstype").Property.LineBreak | undefined;
     WebkitLineClamp?: import("csstype").Property.WebkitLineClamp | undefined;

package/types/three-entry.d.ts

@@ -0,0 +1 @@
+export { motion } from "./render/three/motion";