@cliquify.me/transitions 0.11.16 → 0.11.18

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/index.umd.js CHANGED
@@ -1,26 +1,5 @@
1
- (function(h,a){typeof exports=="object"&&typeof module<"u"?a(exports,require("remotion"),require("react"),require("@remotion/paths"),require("@remotion/shapes")):typeof define=="function"&&define.amd?define(["exports","remotion","react","@remotion/paths","@remotion/shapes"],a):(h=typeof globalThis<"u"?globalThis:h||self,a(h.transitions={},h.Remotion,h.React,h.RemotionPaths,h.RemotionShapes))})(this,function(h,a,m,Z,se){"use strict";const _=r=>({getDurationInFrames:()=>r.durationInFrames,getProgress:({frame:t})=>a.interpolate(t,[0,r.durationInFrames],[0,1],{easing:r.easing,extrapolateLeft:"clamp",extrapolateRight:"clamp"})}),Se=(r={})=>({getDurationInFrames:({fps:t})=>r.durationInFrames?r.durationInFrames:a.measureSpring({config:r.config,threshold:r.durationRestThreshold,fps:t}),getProgress:({fps:t,frame:e})=>{const o=r.reverse?0:1,i=r.reverse?1:0;return a.spring({fps:t,frame:e,to:o,from:i,config:r.config,durationInFrames:r.durationInFrames,durationRestThreshold:r.durationRestThreshold,reverse:r.reverse})}});var Q={exports:{}},W={};/**
2
- * @license React
3
- * react-jsx-runtime.production.js
4
- *
5
- * Copyright (c) Meta Platforms, Inc. and affiliates.
6
- *
7
- * This source code is licensed under the MIT license found in the
8
- * LICENSE file in the root directory of this source tree.
9
- */var ie;function ve(){if(ie)return W;ie=1;var r=Symbol.for("react.transitional.element"),t=Symbol.for("react.fragment");function e(o,i,c){var d=null;if(c!==void 0&&(d=""+c),i.key!==void 0&&(d=""+i.key),"key"in i){c={};for(var f in i)f!=="key"&&(c[f]=i[f])}else c=i;return i=c.ref,{$$typeof:r,type:o,key:d,ref:i!==void 0?i:null,props:c}}return W.Fragment=t,W.jsx=e,W.jsxs=e,W}var D={};/**
10
- * @license React
11
- * react-jsx-runtime.development.js
12
- *
13
- * Copyright (c) Meta Platforms, Inc. and affiliates.
14
- *
15
- * This source code is licensed under the MIT license found in the
16
- * LICENSE file in the root directory of this source tree.
17
- */var ae;function Ee(){return ae||(ae=1,process.env.NODE_ENV!=="production"&&function(){function r(n){if(n==null)return null;if(typeof n=="function")return n.$$typeof===re?null:n.displayName||n.name||null;if(typeof n=="string")return n;switch(n){case k:return"Fragment";case I:return"Profiler";case F:return"StrictMode";case te:return"Suspense";case X:return"SuspenseList";case N:return"Activity"}if(typeof n=="object")switch(typeof n.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),n.$$typeof){case M:return"Portal";case A:return n.displayName||"Context";case we:return(n._context.displayName||"Context")+".Consumer";case C:var u=n.render;return n=n.displayName,n||(n=u.displayName||u.name||"",n=n!==""?"ForwardRef("+n+")":"ForwardRef"),n;case T:return u=n.displayName||null,u!==null?u:r(n.type)||"Memo";case q:u=n._payload,n=n._init;try{return r(n(u))}catch{}}return null}function t(n){return""+n}function e(n){try{t(n);var u=!1}catch{u=!0}if(u){u=console;var p=u.error,x=typeof Symbol=="function"&&Symbol.toStringTag&&n[Symbol.toStringTag]||n.constructor.name||"Object";return p.call(u,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",x),t(n)}}function o(n){if(n===k)return"<>";if(typeof n=="object"&&n!==null&&n.$$typeof===q)return"<...>";try{var u=r(n);return u?"<"+u+">":"<...>"}catch{return"<...>"}}function i(){var n=j.A;return n===null?null:n.getOwner()}function c(){return Error("react-stack-top-frame")}function d(n){if(P.call(n,"key")){var u=Object.getOwnPropertyDescriptor(n,"key").get;if(u&&u.isReactWarning)return!1}return n.key!==void 0}function f(n,u){function p(){O||(O=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",u))}p.isReactWarning=!0,Object.defineProperty(n,"key",{get:p,configurable:!0})}function l(){var n=r(this.type);return Y[n]||(Y[n]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),n=this.props.ref,n!==void 0?n:null}function w(n,u,p,x,H,ne){var S=p.ref;return n={$$typeof:B,type:n,key:u,props:p,_owner:x},(S!==void 0?S:null)!==null?Object.defineProperty(n,"ref",{enumerable:!1,get:l}):Object.defineProperty(n,"ref",{enumerable:!1,value:null}),n._store={},Object.defineProperty(n._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(n,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(n,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:H}),Object.defineProperty(n,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:ne}),Object.freeze&&(Object.freeze(n.props),Object.freeze(n)),n}function g(n,u,p,x,H,ne){var S=u.children;if(S!==void 0)if(x)if(R(S)){for(x=0;x<S.length;x++)v(S[x]);Object.freeze&&Object.freeze(S)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else v(S);if(P.call(u,"key")){S=r(n);var L=Object.keys(u).filter(function(rt){return rt!=="key"});x=0<L.length?"{key: someKey, "+L.join(": ..., ")+": ...}":"{key: someKey}",G[S+x]||(L=0<L.length?"{"+L.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
18
- let props = %s;
19
- <%s {...props} />
20
- React keys must be passed directly to JSX without using spread:
21
- let props = %s;
22
- <%s key={someKey} {...props} />`,x,S,L,S),G[S+x]=!0)}if(S=null,p!==void 0&&(e(p),S=""+p),d(u)&&(e(u.key),S=""+u.key),"key"in u){p={};for(var oe in u)oe!=="key"&&(p[oe]=u[oe])}else p=u;return S&&f(p,typeof n=="function"?n.displayName||n.name||"Unknown":n),w(n,S,p,i(),H,ne)}function v(n){y(n)?n._store&&(n._store.validated=1):typeof n=="object"&&n!==null&&n.$$typeof===q&&(n._payload.status==="fulfilled"?y(n._payload.value)&&n._payload.value._store&&(n._payload.value._store.validated=1):n._store&&(n._store.validated=1))}function y(n){return typeof n=="object"&&n!==null&&n.$$typeof===B}var b=m,B=Symbol.for("react.transitional.element"),M=Symbol.for("react.portal"),k=Symbol.for("react.fragment"),F=Symbol.for("react.strict_mode"),I=Symbol.for("react.profiler"),we=Symbol.for("react.consumer"),A=Symbol.for("react.context"),C=Symbol.for("react.forward_ref"),te=Symbol.for("react.suspense"),X=Symbol.for("react.suspense_list"),T=Symbol.for("react.memo"),q=Symbol.for("react.lazy"),N=Symbol.for("react.activity"),re=Symbol.for("react.client.reference"),j=b.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,P=Object.prototype.hasOwnProperty,R=Array.isArray,$=console.createTask?console.createTask:function(){return null};b={react_stack_bottom_frame:function(n){return n()}};var O,Y={},z=b.react_stack_bottom_frame.bind(b,c)(),V=$(o(c)),G={};D.Fragment=k,D.jsx=function(n,u,p){var x=1e4>j.recentlyCreatedOwnerStacks++;return g(n,u,p,!1,x?Error("react-stack-top-frame"):z,x?$(o(n)):V)},D.jsxs=function(n,u,p){var x=1e4>j.recentlyCreatedOwnerStacks++;return g(n,u,p,!0,x?Error("react-stack-top-frame"):z,x?$(o(n)):V)}}()),D}process.env.NODE_ENV==="production"?Q.exports=ve():Q.exports=Ee();var s=Q.exports;typeof window<"u"&&(window.remotion_renderReady=!1,window.remotion_delayRenderTimeouts||(window.remotion_delayRenderTimeouts={}),window.remotion_delayRenderHandles=[]);var $e={"style.transformOrigin":{type:"transform-origin",step:1,default:"50% 50%",description:"Transform origin"},"style.translate":{type:"translate",step:1,default:"0px 0px",description:"Offset"},"style.scale":{type:"scale",max:100,step:.01,default:1,description:"Scale",defaultKeyframeOutput:"perceptual-scale"},"style.rotate":{type:"rotation-css",step:1,default:"0deg",description:"Rotation"},"style.opacity":{type:"number",min:0,max:1,step:.01,default:1,description:"Opacity",hiddenFromList:!1}},Fe={"style.borderWidth":{type:"number",default:void 0,min:0,step:1,description:"Border width",hiddenFromList:!1},"style.borderStyle":{type:"enum",default:"none",description:"Border style",variants:{none:{},hidden:{},solid:{},dashed:{},dotted:{},double:{},groove:{},ridge:{},inset:{},outset:{}}},"style.borderColor":{type:"color",default:void 0,description:"Border color"}},je={"style.borderRadius":{type:"number",default:0,min:0,step:1,description:"Border radius",hiddenFromList:!1,keyframable:!0},"style.borderTopLeftRadius":{type:"number",default:0,min:0,step:1,description:"Top left radius",hiddenFromList:!1},"style.borderTopRightRadius":{type:"number",default:0,min:0,step:1,description:"Top right radius",hiddenFromList:!1},"style.borderBottomRightRadius":{type:"number",default:0,min:0,step:1,description:"Bottom right radius",hiddenFromList:!1},"style.borderBottomLeftRadius":{type:"number",default:0,min:0,step:1,description:"Bottom left radius",hiddenFromList:!1}},_e={"style.backgroundColor":{type:"color",default:"transparent",description:"Color"}},Ie={premountFor:{type:"number",default:0,description:"Premount For",min:0,step:1,hiddenFromList:!1,keyframable:!1},postmountFor:{type:"number",default:0,min:0,step:1,hiddenFromList:!0,keyframable:!1}},Pe={...Ie},ke={cropLeft:{type:"number",default:0,description:"Crop left",min:0,max:1,step:.01,hiddenFromList:!1,keyframable:!0},cropRight:{type:"number",default:0,description:"Crop right",min:0,max:1,step:.01,hiddenFromList:!1,keyframable:!0},cropTop:{type:"number",default:0,description:"Crop top",min:0,max:1,step:.01,hiddenFromList:!1,keyframable:!0},cropBottom:{type:"number",default:0,description:"Crop bottom",min:0,max:1,step:.01,hiddenFromList:!1,keyframable:!0}},Ae=ke,Re={...Ae,...$e,..._e,...Fe,...je,...Pe},Oe={layout:{type:"enum",default:"absolute-fill",description:"Layout",variants:{"absolute-fill":Re,none:{}}}};({...Oe.layout});function Me(r,t){const{allowFloats:e,component:o}=t;if(typeof r>"u")throw new Error(`The "durationInFrames" prop ${o} is missing.`);if(typeof r!="number")throw new Error(`The "durationInFrames" prop ${o} must be a number, but you passed a value of type ${typeof r}`);if(r<=0)throw new TypeError(`The "durationInFrames" prop ${o} must be positive, but got ${r}.`);if(!e&&r%1!==0)throw new TypeError(`The "durationInFrames" prop ${o} must be an integer, but got ${r}.`);if(!Number.isFinite(r))throw new TypeError(`The "durationInFrames" prop ${o} must be finite, but got ${r}.`)}var Ce={validateDurationInFrames:Me};const le=m.createContext(null),ue=m.createContext(null),ce=({presentationProgress:r,children:t})=>{const e=m.useMemo(()=>({enteringProgress:r}),[r]);return s.jsx(le.Provider,{value:e,children:t})},fe=({presentationProgress:r,children:t})=>{const e=m.useMemo(()=>({exitingProgress:r}),[r]);return s.jsx(ue.Provider,{value:e,children:t})},de=r=>m.Children.toArray(r).reduce((e,o)=>o.type===m.Fragment?e.concat(de(o.props.children)):(e.push(o),e),[]),Ne=.01,qe=({children:r,presentationProgress:t,presentationDirection:e,passedProps:{direction:o="from-left",enterStyle:i,exitStyle:c}})=>{const d=m.useMemo(()=>{const l=t===1?t*100:t*100-Ne;if(e==="exiting")switch(o){case"from-left":return{transform:`translateX(${l}%)`};case"from-right":return{transform:`translateX(${-t*100}%)`};case"from-top":return{transform:`translateY(${l}%)`};case"from-bottom":return{transform:`translateY(${-t*100}%)`};default:throw new Error(`Invalid direction: ${o}`)}switch(o){case"from-left":return{transform:`translateX(${-100+t*100}%)`};case"from-right":return{transform:`translateX(${100-l}%)`};case"from-top":return{transform:`translateY(${-100+t*100}%)`};case"from-bottom":return{transform:`translateY(${100-l}%)`};default:throw new Error(`Invalid direction: ${o}`)}},[e,t,o]),f=m.useMemo(()=>({width:"100%",height:"100%",justifyContent:"center",alignItems:"center",...d,...e==="entering"?i:c}),[d,i,c,e]);return s.jsx(a.AbsoluteFill,{style:f,children:r})},J=r=>({component:qe,props:{}}),Ye=Ce.validateDurationInFrames,U=function(r){return null},K=({children:r})=>s.jsx(s.Fragment,{children:r}),Le=({children:r})=>{const{fps:t}=a.useVideoConfig(),e=a.useCurrentFrame(),o=m.useMemo(()=>{let i=0,c=0;const d=de(r);return m.Children.map(d,(f,l)=>{const w=f;if(typeof w=="string"){if(w.trim()==="")return null;throw new TypeError(`The <TransitionSeries /> component only accepts a list of <TransitionSeries.Sequence /> components as its children, but you passed a string "${w}"`)}const g=d[l-1],v=d[l+1],y=typeof g=="string"||typeof g>"u"?null:g.type===U?g:null,b=typeof v=="string"||typeof v>"u"?null:v.type===U?v:null,B=typeof g=="string"||typeof g>"u"?!1:g.type===U;if(w.type===U){if(B)throw new TypeError(`A <TransitionSeries.Transition /> component must not be followed by another <TransitionSeries.Transition /> component (nth children = ${l-1} and ${l})`);return null}if(w.type!==K)throw new TypeError(`The <TransitionSeries /> component only accepts a list of <TransitionSeries.Sequence /> and <TransitionSeries.Transition /> components as its children, but got ${w} instead`);const M=w,k=`index = ${l}, duration = ${M.props.durationInFrames}`;if(!(M!=null&&M.props.children))throw new TypeError(`A <TransitionSeries.Sequence /> component (${k}) was detected to not have any children. Delete it to fix this error.`);const F=M.props.durationInFrames,{durationInFrames:I,children:we,...A}=M.props;Ye(F,{component:"of a <TransitionSeries.Sequence /> component",allowFloats:!0});const C=M.props.offset??0;if(Number.isNaN(C))throw new TypeError(`The "offset" property of a <TransitionSeries.Sequence /> must not be NaN, but got NaN (${k}).`);if(!Number.isFinite(C))throw new TypeError(`The "offset" property of a <TransitionSeries.Sequence /> must be finite, but got ${C} (${k}).`);if(C%1!==0)throw new TypeError(`The "offset" property of a <TransitionSeries.Sequence /> must be finite, but got ${C} (${k}).`);const te=c+C;let X=0;y&&(X=y.props.timing.getDurationInFrames({fps:t}),i-=X/2);let T=te-X/2;c+=F+C,T<0&&(T=0);const q=b?b.props.timing.getProgress({frame:e-T-I+b.props.timing.getDurationInFrames({fps:t})/2+i,fps:t}):null,N=y?y.props.timing.getProgress({frame:e-T,fps:t}):null,re=y?y.props.timing.getProgress({frame:e-(T+I),fps:t}):null;if(b&&F<b.props.timing.getDurationInFrames({fps:t})/2)throw new Error(`The duration of a <TransitionSeries.Sequence /> must not be shorter than the duration of the next <TransitionSeries.Transition />. The transition is ${b.props.timing.getDurationInFrames({fps:t})} frames long, but the sequence is only ${F} frames long (${k})`);if(y&&F<y.props.timing.getDurationInFrames({fps:t})/2)throw new Error(`The duration of a <TransitionSeries.Sequence /> must not be shorter than the duration of the previous <TransitionSeries.Transition />. The transition is ${y.props.timing.getDurationInFrames({fps:t})} frames long, but the sequence is only ${F} frames long (${k})`);if(b&&y&&re!==null&&N!==null){const j=b.props.presentation??J(),P=y.props.presentation??J(),R=y.props.timing.getDurationInFrames({fps:t}),$=b.props.timing.getDurationInFrames({fps:t}),O=j.component,Y=P.component,z=e<+Math.floor(T)+R/2,V=e>Math.floor(T)+Math.floor(I)+R/2,G=V?Math.floor(T)+Math.floor(I)+Math.floor($/2):Math.floor(T),n=z?Math.floor(T):Math.floor(T)+R/2,u=b.props.timing.getProgress({frame:e-(n+I-$/2),fps:t}),p=e>T,x=e<T+I+$/2+R/2;return s.jsx(a.Freeze,{active:x&&p&&(z||V),frame:G,children:s.jsx(a.Sequence,{from:n,durationInFrames:F+$/2,...A,name:A.name||"<TS.Sequence>",children:s.jsx(O,{passedProps:j.props??{},presentationDirection:"exiting",presentationProgress:u,presentationDurationInFrames:b.props.timing.getDurationInFrames({fps:t}),onElementImage:()=>{},onUnmount:()=>{},bothEnteringAndExiting:!1,children:s.jsx(fe,{presentationProgress:u,children:s.jsx(Y,{passedProps:P.props??{},presentationDirection:"entering",presentationProgress:N,presentationDurationInFrames:y.props.timing.getDurationInFrames({fps:t}),onElementImage:()=>{},onUnmount:()=>{},bothEnteringAndExiting:!1,children:s.jsx(ce,{presentationProgress:N,children:f})})})})},l)},l)}if(N!==null&&y){const j=y.props.timing.getDurationInFrames({fps:t})/2,P=y.props.presentation??J(),R=P.component,$=e<T+j,O=$?Math.floor(T):Math.floor(T)+j,Y=e>O;return s.jsx(a.Freeze,{active:Y&&$,frame:O,children:s.jsx(a.Sequence,{from:O,durationInFrames:F,...A,name:A.name||"<TS.Sequence>",children:s.jsx(R,{passedProps:P.props??{},presentationDirection:"entering",presentationProgress:N,presentationDurationInFrames:y.props.timing.getDurationInFrames({fps:t}),onElementImage:()=>{},onUnmount:()=>{},bothEnteringAndExiting:!1,children:s.jsx(ce,{presentationProgress:N,children:f})})},l)},l)}if(q!==null&&b){const j=b.props.timing.getDurationInFrames({fps:t})/2,P=b.props.presentation??J(),R=P.component,$=e>Math.floor(I)+Math.floor(T),O=e<Math.floor(I)+Math.floor(T)+j;return s.jsx(a.Freeze,{active:O&&$,frame:Math.floor(I),children:s.jsx(a.Sequence,{from:Math.floor(T),durationInFrames:F+j,...A,name:A.name||"<TS.Sequence>",children:s.jsx(R,{passedProps:P.props??{},presentationDirection:"exiting",presentationProgress:q,presentationDurationInFrames:b.props.timing.getDurationInFrames({fps:t}),onElementImage:()=>{},onUnmount:()=>{},bothEnteringAndExiting:!1,children:s.jsx(fe,{presentationProgress:q,children:f})})},l)},l)}return s.jsx(a.Sequence,{from:Math.floor(T),durationInFrames:F,...A,name:A.name||"<TS.Sequence>",children:f},l)})},[r,t,e]);return s.jsx(s.Fragment,{children:o})},E=({children:r,name:t,layout:e,...o})=>{const i=t??"<TransitionSeries>",c=e??"absolute-fill";return s.jsx(a.Sequence,{name:i,layout:c,...o,children:s.jsx(Le,{children:r})})};E.Sequence=K,E.Transition=U,a.Internals.addSequenceStackTraces(E),a.Internals.addSequenceStackTraces(K);const We=()=>{const r=m.useContext(le),t=m.useContext(ue);return!r&&!t?{isInTransitionSeries:!1,entering:1,exiting:0}:{isInTransitionSeries:!0,entering:(r==null?void 0:r.enteringProgress)??1,exiting:(t==null?void 0:t.exitingProgress)??0}},De=({children:r,presentationDirection:t,presentationProgress:e,passedProps:o})=>{const c=Math.sqrt(o.width**2+o.height**2)/2*e,d=Ue(o.width/2,o.height/2,c),[f]=m.useState(()=>String(a.random(null))),l=m.useMemo(()=>({width:"100%",height:"100%",clipPath:t==="exiting"?void 0:`url(#${f})`}),[f,t]);return s.jsxs(a.AbsoluteFill,{children:[s.jsx(a.AbsoluteFill,{style:l,children:r}),t==="exiting"?null:s.jsx(a.AbsoluteFill,{children:s.jsx("svg",{width:o.width,height:o.height,children:s.jsx("defs",{children:s.jsx("clipPath",{id:f,children:s.jsx("path",{d,fill:"black"})})})})})]})},me=r=>({component:De,props:r}),Ue=(r,t,e)=>`M ${r}, ${t}
1
+ (function(f,i){typeof exports=="object"&&typeof module<"u"?i(exports,require("remotion"),require("react/jsx-runtime"),require("react"),require("@remotion/paths"),require("@remotion/shapes")):typeof define=="function"&&define.amd?define(["exports","remotion","react/jsx-runtime","react","@remotion/paths","@remotion/shapes"],i):(f=typeof globalThis<"u"?globalThis:f||self,i(f.transitions={},f.Remotion,f.jsxRuntime,f.React,f.RemotionPaths,f.RemotionShapes))})(this,function(f,i,o,l,W,z){"use strict";const b=r=>({getDurationInFrames:()=>r.durationInFrames,getProgress:({frame:t})=>i.interpolate(t,[0,r.durationInFrames],[0,1],{easing:r.easing,extrapolateLeft:"clamp",extrapolateRight:"clamp"})}),me=(r={})=>({getDurationInFrames:({fps:t})=>r.durationInFrames?r.durationInFrames:i.measureSpring({config:r.config,threshold:r.durationRestThreshold,fps:t}),getProgress:({fps:t,frame:e})=>{const n=r.reverse?0:1,a=r.reverse?1:0;return i.spring({fps:t,frame:e,to:n,from:a,config:r.config,durationInFrames:r.durationInFrames,durationRestThreshold:r.durationRestThreshold,reverse:r.reverse})}});typeof window<"u"&&(window.remotion_renderReady=!1,window.remotion_delayRenderTimeouts||(window.remotion_delayRenderTimeouts={}),window.remotion_delayRenderHandles=[]);var ge={"style.transformOrigin":{type:"transform-origin",step:1,default:"50% 50%",description:"Transform origin"},"style.translate":{type:"translate",step:1,default:"0px 0px",description:"Offset"},"style.scale":{type:"scale",max:100,step:.01,default:1,description:"Scale",defaultKeyframeOutput:"perceptual-scale"},"style.rotate":{type:"rotation-css",step:1,default:"0deg",description:"Rotation"},"style.opacity":{type:"number",min:0,max:1,step:.01,default:1,description:"Opacity",hiddenFromList:!1}},ye={"style.borderWidth":{type:"number",default:void 0,min:0,step:1,description:"Border width",hiddenFromList:!1},"style.borderStyle":{type:"enum",default:"none",description:"Border style",variants:{none:{},hidden:{},solid:{},dashed:{},dotted:{},double:{},groove:{},ridge:{},inset:{},outset:{}}},"style.borderColor":{type:"color",default:void 0,description:"Border color"}},Te={"style.borderRadius":{type:"number",default:0,min:0,step:1,description:"Border radius",hiddenFromList:!1,keyframable:!0},"style.borderTopLeftRadius":{type:"number",default:0,min:0,step:1,description:"Top left radius",hiddenFromList:!1},"style.borderTopRightRadius":{type:"number",default:0,min:0,step:1,description:"Top right radius",hiddenFromList:!1},"style.borderBottomRightRadius":{type:"number",default:0,min:0,step:1,description:"Bottom right radius",hiddenFromList:!1},"style.borderBottomLeftRadius":{type:"number",default:0,min:0,step:1,description:"Bottom left radius",hiddenFromList:!1}},Se={"style.backgroundColor":{type:"color",default:"transparent",description:"Color"}},be={premountFor:{type:"number",default:0,description:"Premount For",min:0,step:1,hiddenFromList:!1,keyframable:!1},postmountFor:{type:"number",default:0,min:0,step:1,hiddenFromList:!0,keyframable:!1}},we={...be},$e={cropLeft:{type:"number",default:0,description:"Crop left",min:0,max:1,step:.01,hiddenFromList:!1,keyframable:!0},cropRight:{type:"number",default:0,description:"Crop right",min:0,max:1,step:.01,hiddenFromList:!1,keyframable:!0},cropTop:{type:"number",default:0,description:"Crop top",min:0,max:1,step:.01,hiddenFromList:!1,keyframable:!0},cropBottom:{type:"number",default:0,description:"Crop bottom",min:0,max:1,step:.01,hiddenFromList:!1,keyframable:!0}},Fe=$e,ve={...Fe,...ge,...Se,...ye,...Te,...we},Ie={layout:{type:"enum",default:"absolute-fill",description:"Layout",variants:{"absolute-fill":ve,none:{}}}};({...Ie.layout});function xe(r,t){const{allowFloats:e,component:n}=t;if(typeof r>"u")throw new Error(`The "durationInFrames" prop ${n} is missing.`);if(typeof r!="number")throw new Error(`The "durationInFrames" prop ${n} must be a number, but you passed a value of type ${typeof r}`);if(r<=0)throw new TypeError(`The "durationInFrames" prop ${n} must be positive, but got ${r}.`);if(!e&&r%1!==0)throw new TypeError(`The "durationInFrames" prop ${n} must be an integer, but got ${r}.`);if(!Number.isFinite(r))throw new TypeError(`The "durationInFrames" prop ${n} must be finite, but got ${r}.`)}var Ee={validateDurationInFrames:xe};const D=l.createContext(null),j=l.createContext(null),_=({presentationProgress:r,children:t})=>{const e=l.useMemo(()=>({enteringProgress:r}),[r]);return o.jsx(D.Provider,{value:e,children:t})},V=({presentationProgress:r,children:t})=>{const e=l.useMemo(()=>({exitingProgress:r}),[r]);return o.jsx(j.Provider,{value:e,children:t})},H=r=>l.Children.toArray(r).reduce((e,n)=>n.type===l.Fragment?e.concat(H(n.props.children)):(e.push(n),e),[]),qe=.01,Me=({children:r,presentationProgress:t,presentationDirection:e,passedProps:{direction:n="from-left",enterStyle:a,exitStyle:u}})=>{const d=l.useMemo(()=>{const s=t===1?t*100:t*100-qe;if(e==="exiting")switch(n){case"from-left":return{transform:`translateX(${s}%)`};case"from-right":return{transform:`translateX(${-t*100}%)`};case"from-top":return{transform:`translateY(${s}%)`};case"from-bottom":return{transform:`translateY(${-t*100}%)`};default:throw new Error(`Invalid direction: ${n}`)}switch(n){case"from-left":return{transform:`translateX(${-100+t*100}%)`};case"from-right":return{transform:`translateX(${100-s}%)`};case"from-top":return{transform:`translateY(${-100+t*100}%)`};case"from-bottom":return{transform:`translateY(${100-s}%)`};default:throw new Error(`Invalid direction: ${n}`)}},[e,t,n]),c=l.useMemo(()=>({width:"100%",height:"100%",justifyContent:"center",alignItems:"center",...d,...e==="entering"?a:u}),[d,a,u,e]);return o.jsx(i.AbsoluteFill,{style:c,children:r})},L=r=>({component:Me,props:{}}),Pe=Ee.validateDurationInFrames,k=function(r){return null};k.isTransitionSeriesTransition=!0;const N=({children:r})=>o.jsx(o.Fragment,{children:r});N.isSeriesSequence=!0;const Ce=({children:r})=>{const{fps:t}=i.useVideoConfig(),e=i.useCurrentFrame(),n=l.useMemo(()=>{let a=0,u=0;const d=H(r);return l.Children.map(d,(c,s)=>{var ne,oe,ie,se,ae,le,ue,ce;const p=c;if(typeof p=="string"){if(p.trim()==="")return null;throw new TypeError(`The <TransitionSeries /> component only accepts a list of <TransitionSeries.Sequence /> components as its children, but you passed a string "${p}"`)}const h=d[s-1],y=d[s+1],B=typeof h!="string"&&typeof h<"u"&&(h.type===k||((ne=h.type)==null?void 0:ne.isTransitionSeriesTransition)||((oe=h.type)==null?void 0:oe.name)==="TransitionSeriesTransition"),g=typeof h=="string"||typeof h>"u"?null:B?h:null,re=typeof y!="string"&&typeof y<"u"&&(y.type===k||((ie=y.type)==null?void 0:ie.isTransitionSeriesTransition)||((se=y.type)==null?void 0:se.name)==="TransitionSeriesTransition"),T=typeof y=="string"||typeof y>"u"?null:re?y:null,He=B;if(p.type===k||((ae=p.type)==null?void 0:ae.isTransitionSeriesTransition)||((le=p.type)==null?void 0:le.name)==="TransitionSeriesTransition"){if(He)throw new TypeError(`A <TransitionSeries.Transition /> component must not be followed by another <TransitionSeries.Transition /> component (nth children = ${s-1} and ${s})`);return null}if(!(p.type===N||((ue=p.type)==null?void 0:ue.isSeriesSequence)||((ce=p.type)==null?void 0:ce.name)==="SeriesSequence"))throw new TypeError(`The <TransitionSeries /> component only accepts a list of <TransitionSeries.Sequence /> and <TransitionSeries.Transition /> components as its children, but got ${p} instead`);const q=p,C=`index = ${s}, duration = ${q.props.durationInFrames}`;if(!(q!=null&&q.props.children))throw new TypeError(`A <TransitionSeries.Sequence /> component (${C}) was detected to not have any children. Delete it to fix this error.`);const w=q.props.durationInFrames,{durationInFrames:$,children:tt,...v}=q.props;Pe(w,{component:"of a <TransitionSeries.Sequence /> component",allowFloats:!0});const M=q.props.offset??0;if(Number.isNaN(M))throw new TypeError(`The "offset" property of a <TransitionSeries.Sequence /> must not be NaN, but got NaN (${C}).`);if(!Number.isFinite(M))throw new TypeError(`The "offset" property of a <TransitionSeries.Sequence /> must be finite, but got ${M} (${C}).`);if(M%1!==0)throw new TypeError(`The "offset" property of a <TransitionSeries.Sequence /> must be finite, but got ${M} (${C}).`);const Je=u+M;let X=0;g&&(X=g.props.timing.getDurationInFrames({fps:t}),a-=X/2);let m=Je-X/2;u+=w+M,m<0&&(m=0);const U=T?T.props.timing.getProgress({frame:e-m-$+T.props.timing.getDurationInFrames({fps:t})/2+a,fps:t}):null,A=g?g.props.timing.getProgress({frame:e-m,fps:t}):null,Ke=g?g.props.timing.getProgress({frame:e-(m+$),fps:t}):null;if(T&&w<T.props.timing.getDurationInFrames({fps:t})/2)throw new Error(`The duration of a <TransitionSeries.Sequence /> must not be shorter than the duration of the next <TransitionSeries.Transition />. The transition is ${T.props.timing.getDurationInFrames({fps:t})} frames long, but the sequence is only ${w} frames long (${C})`);if(g&&w<g.props.timing.getDurationInFrames({fps:t})/2)throw new Error(`The duration of a <TransitionSeries.Sequence /> must not be shorter than the duration of the previous <TransitionSeries.Transition />. The transition is ${g.props.timing.getDurationInFrames({fps:t})} frames long, but the sequence is only ${w} frames long (${C})`);if(T&&g&&Ke!==null&&A!==null){const I=T.props.presentation??L(),x=g.props.presentation??L(),E=g.props.timing.getDurationInFrames({fps:t}),F=T.props.timing.getDurationInFrames({fps:t}),P=I.component,Y=x.component,de=e<+Math.floor(m)+E/2,fe=e>Math.floor(m)+Math.floor($)+E/2,Ge=fe?Math.floor(m)+Math.floor($)+Math.floor(F/2):Math.floor(m),pe=de?Math.floor(m):Math.floor(m)+E/2,he=T.props.timing.getProgress({frame:e-(pe+$-F/2),fps:t}),Qe=e>m,Ze=e<m+$+F/2+E/2;return o.jsx(i.Freeze,{active:Ze&&Qe&&(de||fe),frame:Ge,children:o.jsx(i.Sequence,{from:pe,durationInFrames:w+F/2,...v,name:v.name||"<TS.Sequence>",children:o.jsx(P,{passedProps:I.props??{},presentationDirection:"exiting",presentationProgress:he,presentationDurationInFrames:T.props.timing.getDurationInFrames({fps:t}),onElementImage:()=>{},onUnmount:()=>{},bothEnteringAndExiting:!1,children:o.jsx(V,{presentationProgress:he,children:o.jsx(Y,{passedProps:x.props??{},presentationDirection:"entering",presentationProgress:A,presentationDurationInFrames:g.props.timing.getDurationInFrames({fps:t}),onElementImage:()=>{},onUnmount:()=>{},bothEnteringAndExiting:!1,children:o.jsx(_,{presentationProgress:A,children:c})})})})},s)},s)}if(A!==null&&g){const I=g.props.timing.getDurationInFrames({fps:t})/2,x=g.props.presentation??L(),E=x.component,F=e<m+I,P=F?Math.floor(m):Math.floor(m)+I,Y=e>P;return o.jsx(i.Freeze,{active:Y&&F,frame:P,children:o.jsx(i.Sequence,{from:P,durationInFrames:w,...v,name:v.name||"<TS.Sequence>",children:o.jsx(E,{passedProps:x.props??{},presentationDirection:"entering",presentationProgress:A,presentationDurationInFrames:g.props.timing.getDurationInFrames({fps:t}),onElementImage:()=>{},onUnmount:()=>{},bothEnteringAndExiting:!1,children:o.jsx(_,{presentationProgress:A,children:c})})},s)},s)}if(U!==null&&T){const I=T.props.timing.getDurationInFrames({fps:t})/2,x=T.props.presentation??L(),E=x.component,F=e>Math.floor($)+Math.floor(m),P=e<Math.floor($)+Math.floor(m)+I;return o.jsx(i.Freeze,{active:P&&F,frame:Math.floor($),children:o.jsx(i.Sequence,{from:Math.floor(m),durationInFrames:w+I,...v,name:v.name||"<TS.Sequence>",children:o.jsx(E,{passedProps:x.props??{},presentationDirection:"exiting",presentationProgress:U,presentationDurationInFrames:T.props.timing.getDurationInFrames({fps:t}),onElementImage:()=>{},onUnmount:()=>{},bothEnteringAndExiting:!1,children:o.jsx(V,{presentationProgress:U,children:c})})},s)},s)}return o.jsx(i.Sequence,{from:Math.floor(m),durationInFrames:w,...v,name:v.name||"<TS.Sequence>",children:c},s)})},[r,t,e]);return o.jsx(o.Fragment,{children:n})},S=({children:r,name:t,layout:e,...n})=>{const a=t??"<TransitionSeries>",u=e??"absolute-fill";return o.jsx(i.Sequence,{name:a,layout:u,...n,children:o.jsx(Ce,{children:r})})};S.Sequence=N,S.Transition=k,i.Internals.addSequenceStackTraces(S),i.Internals.addSequenceStackTraces(N);const Ae=()=>{const r=l.useContext(D),t=l.useContext(j);return!r&&!t?{isInTransitionSeries:!1,entering:1,exiting:0}:{isInTransitionSeries:!0,entering:(r==null?void 0:r.enteringProgress)??1,exiting:(t==null?void 0:t.exitingProgress)??0}},ke=({children:r,presentationDirection:t,presentationProgress:e,passedProps:n})=>{const u=Math.sqrt(n.width**2+n.height**2)/2*e,d=Le(n.width/2,n.height/2,u),[c]=l.useState(()=>String(i.random(null))),s=l.useMemo(()=>({width:"100%",height:"100%",clipPath:t==="exiting"?void 0:`url(#${c})`}),[c,t]);return o.jsxs(i.AbsoluteFill,{children:[o.jsx(i.AbsoluteFill,{style:s,children:r}),t==="exiting"?null:o.jsx(i.AbsoluteFill,{children:o.jsx("svg",{width:n.width,height:n.height,children:o.jsx("defs",{children:o.jsx("clipPath",{id:c,children:o.jsx("path",{d,fill:"black"})})})})})]})},J=r=>({component:ke,props:r}),Le=(r,t,e)=>`M ${r}, ${t}
23
2
  m -${e}, 0
24
3
  a ${e},${e} 0 1,0 ${e*2},0
25
- a ${e},${e} 0 1,0 -${e*2},0`,Be=({children:r,presentationDirection:t,presentationProgress:e,passedProps:o})=>{const{width:i,height:c}=o,d=i*e,f=c*e,l=i/2-d/2,w=c/2-f/2,[g]=m.useState(()=>String(a.random(null))),v=m.useMemo(()=>({width:"100%",height:"100%",clipPath:t==="exiting"?void 0:`url(#${g})`}),[g,t]);return s.jsxs(a.AbsoluteFill,{children:[s.jsx(a.AbsoluteFill,{style:v,children:r}),t==="exiting"?null:s.jsx(a.AbsoluteFill,{children:s.jsx("svg",{children:s.jsx("defs",{children:s.jsx("clipPath",{id:g,children:s.jsx("rect",{x:l,y:w,width:d,height:f,fill:"black"})})})})})]})},pe=r=>({component:Be,props:r}),Xe=({children:r,presentationDirection:t,presentationProgress:e,passedProps:o})=>{const i=Math.sqrt(o.width**2+o.height**2)/2,c=i*e,d=i*2*e,{path:f}=se.makeStar({innerRadius:c,outerRadius:d,points:5}),l=Z.getBoundingBox(f),w=Z.translatePath(f,o.width/2-l.width/2,o.height/2-l.height/2),[g]=m.useState(()=>String(a.random(null))),v=m.useMemo(()=>({width:"100%",height:"100%",clipPath:t==="exiting"?void 0:`url(#${g})`}),[g,t]);return s.jsxs(a.AbsoluteFill,{children:[s.jsx(a.AbsoluteFill,{style:v,children:r}),t==="exiting"?null:s.jsx(a.AbsoluteFill,{children:s.jsx("svg",{children:s.jsx("defs",{children:s.jsx("clipPath",{id:g,children:s.jsx("path",{d:w,fill:"black"})})})})})]})},he=r=>({component:Xe,props:r}),ze=({children:r,presentationDirection:t,presentationProgress:e,passedProps:o})=>{const{width:i,height:c}=o,d=i*e,f=i/2-d/2,[l]=m.useState(()=>String(a.random(null))),w=m.useMemo(()=>({width:"100%",height:"100%",clipPath:t==="exiting"?void 0:`url(#${l})`}),[l,t]);return s.jsxs(a.AbsoluteFill,{children:[s.jsx(a.AbsoluteFill,{style:w,children:r}),t==="exiting"?null:s.jsx(a.AbsoluteFill,{children:s.jsx("svg",{children:s.jsx("defs",{children:s.jsx("clipPath",{id:l,children:s.jsx("rect",{x:f,y:0,width:d,height:c,fill:"black"})})})})})]})},ge=r=>({component:ze,props:r});var Ve=({children:r,presentationDirection:t,presentationProgress:e,passedProps:o})=>{const i=t==="entering",c=m.useMemo(()=>({opacity:i?e:o.shouldFadeOutExitingScene?1-e:1,...t==="entering"?o.enterStyle:o.exitStyle}),[i,o.enterStyle,o.exitStyle,o.shouldFadeOutExitingScene,t,e]);return s.jsx(a.AbsoluteFill,{style:c,children:r})},ee=r=>({component:Ve,props:r??{}}),Je=.01,Ge=({children:r,presentationProgress:t,presentationDirection:e,passedProps:{direction:o="from-left",enterStyle:i,exitStyle:c}})=>{const d=m.useMemo(()=>{const l=t===1?t*100:t*100-Je;if(e==="exiting")switch(o){case"from-left":return{transform:`translateX(${l}%)`};case"from-right":return{transform:`translateX(${-t*100}%)`};case"from-top":return{transform:`translateY(${l}%)`};case"from-bottom":return{transform:`translateY(${-t*100}%)`};default:throw new Error(`Invalid direction: ${o}`)}switch(o){case"from-left":return{transform:`translateX(${-100+t*100}%)`};case"from-right":return{transform:`translateX(${100-l}%)`};case"from-top":return{transform:`translateY(${-100+t*100}%)`};case"from-bottom":return{transform:`translateY(${100-l}%)`};default:throw new Error(`Invalid direction: ${o}`)}},[e,t,o]),f=m.useMemo(()=>({width:"100%",height:"100%",justifyContent:"center",alignItems:"center",...d,...e==="entering"?i:c}),[d,i,c,e]);return s.jsx(a.AbsoluteFill,{style:f,children:r})},ye=r=>({component:Ge,props:r??{}}),He=(r,t)=>{const e=r*100;switch(t){case"from-left":return`polygon(0% 0%, ${e}% 0%, ${e}% 100%, 0% 100%)`;case"from-top-left":return`polygon(0% 0%, ${e*2}% 0%, 0% ${e*2}%)`;case"from-top":return`polygon(0% 0%, 100% 0%, 100% ${e}%, 0% ${e}%)`;case"from-top-right":return`polygon(100% 0%, ${100-e*2}% 0%, 100% ${e*2}%)`;case"from-right":return`polygon(100% 0%, 100% 100%, ${100-e}% 100%, ${100-e}% 0%)`;case"from-bottom-right":return`polygon(100% 100%, ${100-e*2}% 100%, 100% ${100-e*2}%)`;case"from-bottom":return`polygon(0% 100%, 100% 100%, 100% ${100-e}%, 0% ${100-e}%)`;case"from-bottom-left":return`polygon(0% 100%, 0% ${100-e*2}%, ${e*2}% 100%)`;default:throw new Error(`Unknown direction ${JSON.stringify(t)}`)}},Ze=(r,t)=>{const e=r*100;switch(t){case"from-left":return`polygon(100% 100%, ${100-e}% 100%, ${100-e}% 0%, 100% 0%)`;case"from-top-left":return`polygon(100% 100%, ${100-e*2}% 100%, 100% ${100-e*2}%)`;case"from-top":return`polygon(100% 100%, 0% 100%, 0% ${100-e}%, 100% ${100-e}%)`;case"from-top-right":return`polygon(0% 100%, ${e*2}% 100%, 0% ${100-e*2}%)`;case"from-right":return`polygon(0% 0%, ${e}% 0%, ${e}% 100%, 0% 100%)`;case"from-bottom-right":return`polygon(0% 0%, ${e*2}% 0%, 0% ${e*2}%)`;case"from-bottom":return`polygon(100% 0%, 0% 0%, 0% ${e}%, 100% ${e}%)`;case"from-bottom-left":return`polygon(100% 0%, ${100-e*2}% 0%, 100% ${e*2}%)`;default:throw new Error(`Unknown direction ${JSON.stringify(t)}`)}},Qe=({children:r,presentationProgress:t,presentationDirection:e,passedProps:{direction:o="from-left",innerEnterStyle:i,innerExitStyle:c,outerEnterStyle:d,outerExitStyle:f}})=>{const l=e==="entering"?t:1-t,w=e==="entering"?He(l,o):Ze(l,o),g=m.useMemo(()=>({width:"100%",height:"100%",justifyContent:"center",alignItems:"center",clipPath:w,...e==="entering"?i:c}),[w,i,c,e]),v=m.useMemo(()=>e==="entering"?d:f,[d,f,e]);return s.jsx(a.AbsoluteFill,{style:v,children:s.jsx(a.AbsoluteFill,{style:g,children:r})})},be=r=>({component:Qe,props:r??{}}),Ke=({children:r,presentationDirection:t,presentationProgress:e,passedProps:{direction:o="from-left",perspective:i=1e3,innerEnterStyle:c,innerExitStyle:d,outerEnterStyle:f,outerExitStyle:l}})=>{const w=m.useMemo(()=>{const v=o==="from-right"||o==="from-top"?180:-180,y=o==="from-right"||o==="from-top"?-180:180,b=t==="entering"?a.interpolate(e,[0,1],[v,0]):a.interpolate(e,[0,1],[0,y]);return{width:"100%",height:"100%",transform:`${o==="from-top"||o==="from-bottom"?"rotateX":"rotateY"}(${b}deg)`,backfaceVisibility:"hidden",WebkitBackfaceVisibility:"hidden",...t==="entering"?c:d}},[o,c,d,t,e]),g=m.useMemo(()=>({perspective:i,transformStyle:"preserve-3d",...t==="entering"?f:l}),[f,l,i,t]);return s.jsx(a.AbsoluteFill,{style:g,children:s.jsx(a.AbsoluteFill,{style:w,children:r})})},Te=r=>({component:Ke,props:r??{}}),et=({children:r,presentationDirection:t,presentationProgress:e,passedProps:o})=>{const i=Math.sqrt(o.width**2+o.height**2)/2,{path:c}=se.makePie({radius:i,progress:e}),d=Z.translatePath(c,-(i*2-o.width)/2,-(i*2-o.height)/2),f=m.useMemo(()=>({width:"100%",height:"100%",clipPath:t==="exiting"?void 0:`path("${d}")`,...t==="entering"?o.innerEnterStyle:o.innerExitStyle}),[d,o.innerEnterStyle,o.innerExitStyle,t]),l=m.useMemo(()=>t==="entering"?o.outerEnterStyle:o.outerExitStyle,[o.outerEnterStyle,o.outerExitStyle,t]);return s.jsx(a.AbsoluteFill,{style:l,children:s.jsx(a.AbsoluteFill,{style:f,children:r})})},xe=r=>({component:et,props:r??{}});const tt={none:({id:r})=>s.jsx(E.Transition,{presentation:ee(),timing:_({durationInFrames:1})},r),fade:({durationInFrames:r,id:t})=>s.jsx(E.Transition,{presentation:ee(),timing:_({durationInFrames:r})},t),slide:({durationInFrames:r,id:t,direction:e})=>s.jsx(E.Transition,{presentation:ye({direction:e}),timing:_({durationInFrames:r})},t),wipe:({durationInFrames:r,id:t,direction:e})=>s.jsx(E.Transition,{presentation:be({direction:e}),timing:_({durationInFrames:r})},t),flip:({durationInFrames:r,id:t})=>s.jsx(E.Transition,{presentation:Te(),timing:_({durationInFrames:r})},t),clockWipe:({width:r,height:t,durationInFrames:e,id:o})=>s.jsx(E.Transition,{presentation:xe({width:r,height:t}),timing:_({durationInFrames:e})},o),star:({width:r,height:t,durationInFrames:e,id:o})=>s.jsx(E.Transition,{presentation:he({width:r,height:t}),timing:_({durationInFrames:e})},o),circle:({width:r,height:t,durationInFrames:e,id:o})=>s.jsx(E.Transition,{presentation:me({width:r,height:t}),timing:_({durationInFrames:e})},o),rectangle:({width:r,height:t,durationInFrames:e,id:o})=>s.jsx(E.Transition,{presentation:pe({width:r,height:t}),timing:_({durationInFrames:e})},o),slidingDoors:({width:r,height:t,durationInFrames:e,id:o})=>s.jsx(E.Transition,{presentation:ge({width:r,height:t}),timing:_({durationInFrames:e})},o)};h.TransitionSeries=E,h.Transitions=tt,h.circle=me,h.clockWipe=xe,h.fade=ee,h.flip=Te,h.linearTiming=_,h.rectangle=pe,h.slide=ye,h.slidingDoors=ge,h.springTiming=Se,h.star=he,h.useTransitionProgress=We,h.wipe=be,Object.defineProperty(h,Symbol.toStringTag,{value:"Module"})});
4
+ a ${e},${e} 0 1,0 -${e*2},0`,Ne=({children:r,presentationDirection:t,presentationProgress:e,passedProps:n})=>{const{width:a,height:u}=n,d=a*e,c=u*e,s=a/2-d/2,p=u/2-c/2,[h]=l.useState(()=>String(i.random(null))),y=l.useMemo(()=>({width:"100%",height:"100%",clipPath:t==="exiting"?void 0:`url(#${h})`}),[h,t]);return o.jsxs(i.AbsoluteFill,{children:[o.jsx(i.AbsoluteFill,{style:y,children:r}),t==="exiting"?null:o.jsx(i.AbsoluteFill,{children:o.jsx("svg",{children:o.jsx("defs",{children:o.jsx("clipPath",{id:h,children:o.jsx("rect",{x:s,y:p,width:d,height:c,fill:"black"})})})})})]})},K=r=>({component:Ne,props:r}),Be=({children:r,presentationDirection:t,presentationProgress:e,passedProps:n})=>{const a=Math.sqrt(n.width**2+n.height**2)/2,u=a*e,d=a*2*e,{path:c}=z.makeStar({innerRadius:u,outerRadius:d,points:5}),s=W.getBoundingBox(c),p=W.translatePath(c,n.width/2-s.width/2,n.height/2-s.height/2),[h]=l.useState(()=>String(i.random(null))),y=l.useMemo(()=>({width:"100%",height:"100%",clipPath:t==="exiting"?void 0:`url(#${h})`}),[h,t]);return o.jsxs(i.AbsoluteFill,{children:[o.jsx(i.AbsoluteFill,{style:y,children:r}),t==="exiting"?null:o.jsx(i.AbsoluteFill,{children:o.jsx("svg",{children:o.jsx("defs",{children:o.jsx("clipPath",{id:h,children:o.jsx("path",{d:p,fill:"black"})})})})})]})},G=r=>({component:Be,props:r}),We=({children:r,presentationDirection:t,presentationProgress:e,passedProps:n})=>{const{width:a,height:u}=n,d=a*e,c=a/2-d/2,[s]=l.useState(()=>String(i.random(null))),p=l.useMemo(()=>({width:"100%",height:"100%",clipPath:t==="exiting"?void 0:`url(#${s})`}),[s,t]);return o.jsxs(i.AbsoluteFill,{children:[o.jsx(i.AbsoluteFill,{style:p,children:r}),t==="exiting"?null:o.jsx(i.AbsoluteFill,{children:o.jsx("svg",{children:o.jsx("defs",{children:o.jsx("clipPath",{id:s,children:o.jsx("rect",{x:c,y:0,width:d,height:u,fill:"black"})})})})})]})},Q=r=>({component:We,props:r});var Oe=({children:r,presentationDirection:t,presentationProgress:e,passedProps:n})=>{const a=t==="entering",u=l.useMemo(()=>({opacity:a?e:n.shouldFadeOutExitingScene?1-e:1,...t==="entering"?n.enterStyle:n.exitStyle}),[a,n.enterStyle,n.exitStyle,n.shouldFadeOutExitingScene,t,e]);return o.jsx(i.AbsoluteFill,{style:u,children:r})},O=r=>({component:Oe,props:r??{}}),Xe=.01,Ue=({children:r,presentationProgress:t,presentationDirection:e,passedProps:{direction:n="from-left",enterStyle:a,exitStyle:u}})=>{const d=l.useMemo(()=>{const s=t===1?t*100:t*100-Xe;if(e==="exiting")switch(n){case"from-left":return{transform:`translateX(${s}%)`};case"from-right":return{transform:`translateX(${-t*100}%)`};case"from-top":return{transform:`translateY(${s}%)`};case"from-bottom":return{transform:`translateY(${-t*100}%)`};default:throw new Error(`Invalid direction: ${n}`)}switch(n){case"from-left":return{transform:`translateX(${-100+t*100}%)`};case"from-right":return{transform:`translateX(${100-s}%)`};case"from-top":return{transform:`translateY(${-100+t*100}%)`};case"from-bottom":return{transform:`translateY(${100-s}%)`};default:throw new Error(`Invalid direction: ${n}`)}},[e,t,n]),c=l.useMemo(()=>({width:"100%",height:"100%",justifyContent:"center",alignItems:"center",...d,...e==="entering"?a:u}),[d,a,u,e]);return o.jsx(i.AbsoluteFill,{style:c,children:r})},Z=r=>({component:Ue,props:r??{}}),Ye=(r,t)=>{const e=r*100;switch(t){case"from-left":return`polygon(0% 0%, ${e}% 0%, ${e}% 100%, 0% 100%)`;case"from-top-left":return`polygon(0% 0%, ${e*2}% 0%, 0% ${e*2}%)`;case"from-top":return`polygon(0% 0%, 100% 0%, 100% ${e}%, 0% ${e}%)`;case"from-top-right":return`polygon(100% 0%, ${100-e*2}% 0%, 100% ${e*2}%)`;case"from-right":return`polygon(100% 0%, 100% 100%, ${100-e}% 100%, ${100-e}% 0%)`;case"from-bottom-right":return`polygon(100% 100%, ${100-e*2}% 100%, 100% ${100-e*2}%)`;case"from-bottom":return`polygon(0% 100%, 100% 100%, 100% ${100-e}%, 0% ${100-e}%)`;case"from-bottom-left":return`polygon(0% 100%, 0% ${100-e*2}%, ${e*2}% 100%)`;default:throw new Error(`Unknown direction ${JSON.stringify(t)}`)}},ze=(r,t)=>{const e=r*100;switch(t){case"from-left":return`polygon(100% 100%, ${100-e}% 100%, ${100-e}% 0%, 100% 0%)`;case"from-top-left":return`polygon(100% 100%, ${100-e*2}% 100%, 100% ${100-e*2}%)`;case"from-top":return`polygon(100% 100%, 0% 100%, 0% ${100-e}%, 100% ${100-e}%)`;case"from-top-right":return`polygon(0% 100%, ${e*2}% 100%, 0% ${100-e*2}%)`;case"from-right":return`polygon(0% 0%, ${e}% 0%, ${e}% 100%, 0% 100%)`;case"from-bottom-right":return`polygon(0% 0%, ${e*2}% 0%, 0% ${e*2}%)`;case"from-bottom":return`polygon(100% 0%, 0% 0%, 0% ${e}%, 100% ${e}%)`;case"from-bottom-left":return`polygon(100% 0%, ${100-e*2}% 0%, 100% ${e*2}%)`;default:throw new Error(`Unknown direction ${JSON.stringify(t)}`)}},De=({children:r,presentationProgress:t,presentationDirection:e,passedProps:{direction:n="from-left",innerEnterStyle:a,innerExitStyle:u,outerEnterStyle:d,outerExitStyle:c}})=>{const s=e==="entering"?t:1-t,p=e==="entering"?Ye(s,n):ze(s,n),h=l.useMemo(()=>({width:"100%",height:"100%",justifyContent:"center",alignItems:"center",clipPath:p,...e==="entering"?a:u}),[p,a,u,e]),y=l.useMemo(()=>e==="entering"?d:c,[d,c,e]);return o.jsx(i.AbsoluteFill,{style:y,children:o.jsx(i.AbsoluteFill,{style:h,children:r})})},R=r=>({component:De,props:r??{}}),je=({children:r,presentationDirection:t,presentationProgress:e,passedProps:{direction:n="from-left",perspective:a=1e3,innerEnterStyle:u,innerExitStyle:d,outerEnterStyle:c,outerExitStyle:s}})=>{const p=l.useMemo(()=>{const y=n==="from-right"||n==="from-top"?180:-180,B=n==="from-right"||n==="from-top"?-180:180,g=t==="entering"?i.interpolate(e,[0,1],[y,0]):i.interpolate(e,[0,1],[0,B]);return{width:"100%",height:"100%",transform:`${n==="from-top"||n==="from-bottom"?"rotateX":"rotateY"}(${g}deg)`,backfaceVisibility:"hidden",WebkitBackfaceVisibility:"hidden",...t==="entering"?u:d}},[n,u,d,t,e]),h=l.useMemo(()=>({perspective:a,transformStyle:"preserve-3d",...t==="entering"?c:s}),[c,s,a,t]);return o.jsx(i.AbsoluteFill,{style:h,children:o.jsx(i.AbsoluteFill,{style:p,children:r})})},ee=r=>({component:je,props:r??{}}),_e=({children:r,presentationDirection:t,presentationProgress:e,passedProps:n})=>{const a=Math.sqrt(n.width**2+n.height**2)/2,{path:u}=z.makePie({radius:a,progress:e}),d=W.translatePath(u,-(a*2-n.width)/2,-(a*2-n.height)/2),c=l.useMemo(()=>({width:"100%",height:"100%",clipPath:t==="exiting"?void 0:`path("${d}")`,...t==="entering"?n.innerEnterStyle:n.innerExitStyle}),[d,n.innerEnterStyle,n.innerExitStyle,t]),s=l.useMemo(()=>t==="entering"?n.outerEnterStyle:n.outerExitStyle,[n.outerEnterStyle,n.outerExitStyle,t]);return o.jsx(i.AbsoluteFill,{style:s,children:o.jsx(i.AbsoluteFill,{style:c,children:r})})},te=r=>({component:_e,props:r??{}});const Ve={none:({id:r})=>o.jsx(S.Transition,{presentation:O(),timing:b({durationInFrames:1})},r),fade:({durationInFrames:r,id:t})=>o.jsx(S.Transition,{presentation:O(),timing:b({durationInFrames:r})},t),slide:({durationInFrames:r,id:t,direction:e})=>o.jsx(S.Transition,{presentation:Z({direction:e}),timing:b({durationInFrames:r})},t),wipe:({durationInFrames:r,id:t,direction:e})=>o.jsx(S.Transition,{presentation:R({direction:e}),timing:b({durationInFrames:r})},t),flip:({durationInFrames:r,id:t})=>o.jsx(S.Transition,{presentation:ee(),timing:b({durationInFrames:r})},t),clockWipe:({width:r,height:t,durationInFrames:e,id:n})=>o.jsx(S.Transition,{presentation:te({width:r,height:t}),timing:b({durationInFrames:e})},n),star:({width:r,height:t,durationInFrames:e,id:n})=>o.jsx(S.Transition,{presentation:G({width:r,height:t}),timing:b({durationInFrames:e})},n),circle:({width:r,height:t,durationInFrames:e,id:n})=>o.jsx(S.Transition,{presentation:J({width:r,height:t}),timing:b({durationInFrames:e})},n),rectangle:({width:r,height:t,durationInFrames:e,id:n})=>o.jsx(S.Transition,{presentation:K({width:r,height:t}),timing:b({durationInFrames:e})},n),slidingDoors:({width:r,height:t,durationInFrames:e,id:n})=>o.jsx(S.Transition,{presentation:Q({width:r,height:t}),timing:b({durationInFrames:e})},n)};f.TransitionSeries=S,f.Transitions=Ve,f.circle=J,f.clockWipe=te,f.fade=O,f.flip=ee,f.linearTiming=b,f.rectangle=K,f.slide=Z,f.slidingDoors=Q,f.springTiming=me,f.star=G,f.useTransitionProgress=Ae,f.wipe=R,Object.defineProperty(f,Symbol.toStringTag,{value:"Module"})});
26
5
  //# sourceMappingURL=index.umd.js.map