@cliquify.me/transitions 0.11.15 → 0.11.17

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,s){typeof exports=="object"&&typeof module<"u"?s(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"],s):(f=typeof globalThis<"u"?globalThis:f||self,s(f.transitions={},f.Remotion,f.jsxRuntime,f.React,f.RemotionPaths,f.RemotionShapes))})(this,function(f,s,o,l,B,Y){"use strict";const $=r=>({getDurationInFrames:()=>r.durationInFrames,getProgress:({frame:t})=>s.interpolate(t,[0,r.durationInFrames],[0,1],{easing:r.easing,extrapolateLeft:"clamp",extrapolateRight:"clamp"})}),ie=(r={})=>({getDurationInFrames:({fps:t})=>r.durationInFrames?r.durationInFrames:s.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 s.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 ae={"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}},le={"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"}},ue={"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}},ce={"style.backgroundColor":{type:"color",default:"transparent",description:"Color"}},de={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}},fe={...de},he={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}},pe=he,me={...pe,...ae,...ce,...le,...ue,...fe},ge={layout:{type:"enum",default:"absolute-fill",description:"Layout",variants:{"absolute-fill":me,none:{}}}};({...ge.layout});function ye(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 be={validateDurationInFrames:ye};const z=l.createContext(null),D=l.createContext(null),j=({presentationProgress:r,children:t})=>{const e=l.useMemo(()=>({enteringProgress:r}),[r]);return o.jsx(z.Provider,{value:e,children:t})},_=({presentationProgress:r,children:t})=>{const e=l.useMemo(()=>({exitingProgress:r}),[r]);return o.jsx(D.Provider,{value:e,children:t})},V=r=>l.Children.toArray(r).reduce((e,n)=>n.type===l.Fragment?e.concat(V(n.props.children)):(e.push(n),e),[]),we=.01,$e=({children:r,presentationProgress:t,presentationDirection:e,passedProps:{direction:n="from-left",enterStyle:a,exitStyle:u}})=>{const d=l.useMemo(()=>{const i=t===1?t*100:t*100-we;if(e==="exiting")switch(n){case"from-left":return{transform:`translateX(${i}%)`};case"from-right":return{transform:`translateX(${-t*100}%)`};case"from-top":return{transform:`translateY(${i}%)`};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-i}%)`};case"from-top":return{transform:`translateY(${-100+t*100}%)`};case"from-bottom":return{transform:`translateY(${100-i}%)`};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(s.AbsoluteFill,{style:c,children:r})},L=r=>({component:$e,props:{}}),Te=be.validateDurationInFrames,C=function(r){return null},N=({children:r})=>o.jsx(o.Fragment,{children:r}),Se=({children:r})=>{const{fps:t}=s.useVideoConfig(),e=s.useCurrentFrame(),n=l.useMemo(()=>{let a=0,u=0;const d=V(r);return l.Children.map(d,(c,i)=>{const g=c;if(typeof g=="string"){if(g.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 "${g}"`)}const p=d[i-1],w=d[i+1],m=typeof p=="string"||typeof p>"u"?null:p.type===C?p:null,y=typeof w=="string"||typeof w>"u"?null:w.type===C?w:null,te=typeof p=="string"||typeof p>"u"?!1:p.type===C;if(g.type===C){if(te)throw new TypeError(`A <TransitionSeries.Transition /> component must not be followed by another <TransitionSeries.Transition /> component (nth children = ${i-1} and ${i})`);return null}if(g.type!==N)throw new TypeError(`The <TransitionSeries /> component only accepts a list of <TransitionSeries.Sequence /> and <TransitionSeries.Transition /> components as its children, but got ${g} instead`);const M=g,A=`index = ${i}, duration = ${M.props.durationInFrames}`;if(!(M!=null&&M.props.children))throw new TypeError(`A <TransitionSeries.Sequence /> component (${A}) was detected to not have any children. Delete it to fix this error.`);const T=M.props.durationInFrames,{durationInFrames:S,children:De,...v}=M.props;Te(T,{component:"of a <TransitionSeries.Sequence /> component",allowFloats:!0});const q=M.props.offset??0;if(Number.isNaN(q))throw new TypeError(`The "offset" property of a <TransitionSeries.Sequence /> must not be NaN, but got NaN (${A}).`);if(!Number.isFinite(q))throw new TypeError(`The "offset" property of a <TransitionSeries.Sequence /> must be finite, but got ${q} (${A}).`);if(q%1!==0)throw new TypeError(`The "offset" property of a <TransitionSeries.Sequence /> must be finite, but got ${q} (${A}).`);const Oe=u+q;let O=0;m&&(O=m.props.timing.getDurationInFrames({fps:t}),a-=O/2);let h=Oe-O/2;u+=T+q,h<0&&(h=0);const X=y?y.props.timing.getProgress({frame:e-h-S+y.props.timing.getDurationInFrames({fps:t})/2+a,fps:t}):null,k=m?m.props.timing.getProgress({frame:e-h,fps:t}):null,Xe=m?m.props.timing.getProgress({frame:e-(h+S),fps:t}):null;if(y&&T<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 next <TransitionSeries.Transition />. The transition is ${y.props.timing.getDurationInFrames({fps:t})} frames long, but the sequence is only ${T} frames long (${A})`);if(m&&T<m.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 ${m.props.timing.getDurationInFrames({fps:t})} frames long, but the sequence is only ${T} frames long (${A})`);if(y&&m&&Xe!==null&&k!==null){const I=y.props.presentation??L(),x=m.props.presentation??L(),E=m.props.timing.getDurationInFrames({fps:t}),F=y.props.timing.getDurationInFrames({fps:t}),P=I.component,U=x.component,re=e<+Math.floor(h)+E/2,ne=e>Math.floor(h)+Math.floor(S)+E/2,Ue=ne?Math.floor(h)+Math.floor(S)+Math.floor(F/2):Math.floor(h),oe=re?Math.floor(h):Math.floor(h)+E/2,se=y.props.timing.getProgress({frame:e-(oe+S-F/2),fps:t}),Ye=e>h,ze=e<h+S+F/2+E/2;return o.jsx(s.Freeze,{active:ze&&Ye&&(re||ne),frame:Ue,children:o.jsx(s.Sequence,{from:oe,durationInFrames:T+F/2,...v,name:v.name||"<TS.Sequence>",children:o.jsx(P,{passedProps:I.props??{},presentationDirection:"exiting",presentationProgress:se,presentationDurationInFrames:y.props.timing.getDurationInFrames({fps:t}),onElementImage:()=>{},onUnmount:()=>{},bothEnteringAndExiting:!1,children:o.jsx(_,{presentationProgress:se,children:o.jsx(U,{passedProps:x.props??{},presentationDirection:"entering",presentationProgress:k,presentationDurationInFrames:m.props.timing.getDurationInFrames({fps:t}),onElementImage:()=>{},onUnmount:()=>{},bothEnteringAndExiting:!1,children:o.jsx(j,{presentationProgress:k,children:c})})})})},i)},i)}if(k!==null&&m){const I=m.props.timing.getDurationInFrames({fps:t})/2,x=m.props.presentation??L(),E=x.component,F=e<h+I,P=F?Math.floor(h):Math.floor(h)+I,U=e>P;return o.jsx(s.Freeze,{active:U&&F,frame:P,children:o.jsx(s.Sequence,{from:P,durationInFrames:T,...v,name:v.name||"<TS.Sequence>",children:o.jsx(E,{passedProps:x.props??{},presentationDirection:"entering",presentationProgress:k,presentationDurationInFrames:m.props.timing.getDurationInFrames({fps:t}),onElementImage:()=>{},onUnmount:()=>{},bothEnteringAndExiting:!1,children:o.jsx(j,{presentationProgress:k,children:c})})},i)},i)}if(X!==null&&y){const I=y.props.timing.getDurationInFrames({fps:t})/2,x=y.props.presentation??L(),E=x.component,F=e>Math.floor(S)+Math.floor(h),P=e<Math.floor(S)+Math.floor(h)+I;return o.jsx(s.Freeze,{active:P&&F,frame:Math.floor(S),children:o.jsx(s.Sequence,{from:Math.floor(h),durationInFrames:T+I,...v,name:v.name||"<TS.Sequence>",children:o.jsx(E,{passedProps:x.props??{},presentationDirection:"exiting",presentationProgress:X,presentationDurationInFrames:y.props.timing.getDurationInFrames({fps:t}),onElementImage:()=>{},onUnmount:()=>{},bothEnteringAndExiting:!1,children:o.jsx(_,{presentationProgress:X,children:c})})},i)},i)}return o.jsx(s.Sequence,{from:Math.floor(h),durationInFrames:T,...v,name:v.name||"<TS.Sequence>",children:c},i)})},[r,t,e]);return o.jsx(o.Fragment,{children:n})},b=({children:r,name:t,layout:e,...n})=>{const a=t??"<TransitionSeries>",u=e??"absolute-fill";return o.jsx(s.Sequence,{name:a,layout:u,...n,children:o.jsx(Se,{children:r})})};b.Sequence=N,b.Transition=C,s.Internals.addSequenceStackTraces(b),s.Internals.addSequenceStackTraces(N);const Fe=()=>{const r=l.useContext(z),t=l.useContext(D);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}},ve=({children:r,presentationDirection:t,presentationProgress:e,passedProps:n})=>{const u=Math.sqrt(n.width**2+n.height**2)/2*e,d=Ie(n.width/2,n.height/2,u),[c]=l.useState(()=>String(s.random(null))),i=l.useMemo(()=>({width:"100%",height:"100%",clipPath:t==="exiting"?void 0:`url(#${c})`}),[c,t]);return o.jsxs(s.AbsoluteFill,{children:[o.jsx(s.AbsoluteFill,{style:i,children:r}),t==="exiting"?null:o.jsx(s.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"})})})})})]})},H=r=>({component:ve,props:r}),Ie=(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`,xe=({children:r,presentationDirection:t,presentationProgress:e,passedProps:n})=>{const{width:a,height:u}=n,d=a*e,c=u*e,i=a/2-d/2,g=u/2-c/2,[p]=l.useState(()=>String(s.random(null))),w=l.useMemo(()=>({width:"100%",height:"100%",clipPath:t==="exiting"?void 0:`url(#${p})`}),[p,t]);return o.jsxs(s.AbsoluteFill,{children:[o.jsx(s.AbsoluteFill,{style:w,children:r}),t==="exiting"?null:o.jsx(s.AbsoluteFill,{children:o.jsx("svg",{children:o.jsx("defs",{children:o.jsx("clipPath",{id:p,children:o.jsx("rect",{x:i,y:g,width:d,height:c,fill:"black"})})})})})]})},J=r=>({component:xe,props:r}),Ee=({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}=Y.makeStar({innerRadius:u,outerRadius:d,points:5}),i=B.getBoundingBox(c),g=B.translatePath(c,n.width/2-i.width/2,n.height/2-i.height/2),[p]=l.useState(()=>String(s.random(null))),w=l.useMemo(()=>({width:"100%",height:"100%",clipPath:t==="exiting"?void 0:`url(#${p})`}),[p,t]);return o.jsxs(s.AbsoluteFill,{children:[o.jsx(s.AbsoluteFill,{style:w,children:r}),t==="exiting"?null:o.jsx(s.AbsoluteFill,{children:o.jsx("svg",{children:o.jsx("defs",{children:o.jsx("clipPath",{id:p,children:o.jsx("path",{d:g,fill:"black"})})})})})]})},K=r=>({component:Ee,props:r}),Me=({children:r,presentationDirection:t,presentationProgress:e,passedProps:n})=>{const{width:a,height:u}=n,d=a*e,c=a/2-d/2,[i]=l.useState(()=>String(s.random(null))),g=l.useMemo(()=>({width:"100%",height:"100%",clipPath:t==="exiting"?void 0:`url(#${i})`}),[i,t]);return o.jsxs(s.AbsoluteFill,{children:[o.jsx(s.AbsoluteFill,{style:g,children:r}),t==="exiting"?null:o.jsx(s.AbsoluteFill,{children:o.jsx("svg",{children:o.jsx("defs",{children:o.jsx("clipPath",{id:i,children:o.jsx("rect",{x:c,y:0,width:d,height:u,fill:"black"})})})})})]})},G=r=>({component:Me,props:r});var qe=({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(s.AbsoluteFill,{style:u,children:r})},W=r=>({component:qe,props:r??{}}),Pe=.01,Ae=({children:r,presentationProgress:t,presentationDirection:e,passedProps:{direction:n="from-left",enterStyle:a,exitStyle:u}})=>{const d=l.useMemo(()=>{const i=t===1?t*100:t*100-Pe;if(e==="exiting")switch(n){case"from-left":return{transform:`translateX(${i}%)`};case"from-right":return{transform:`translateX(${-t*100}%)`};case"from-top":return{transform:`translateY(${i}%)`};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-i}%)`};case"from-top":return{transform:`translateY(${-100+t*100}%)`};case"from-bottom":return{transform:`translateY(${100-i}%)`};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(s.AbsoluteFill,{style:c,children:r})},Q=r=>({component:Ae,props:r??{}}),ke=(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)}`)}},Ce=(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)}`)}},Le=({children:r,presentationProgress:t,presentationDirection:e,passedProps:{direction:n="from-left",innerEnterStyle:a,innerExitStyle:u,outerEnterStyle:d,outerExitStyle:c}})=>{const i=e==="entering"?t:1-t,g=e==="entering"?ke(i,n):Ce(i,n),p=l.useMemo(()=>({width:"100%",height:"100%",justifyContent:"center",alignItems:"center",clipPath:g,...e==="entering"?a:u}),[g,a,u,e]),w=l.useMemo(()=>e==="entering"?d:c,[d,c,e]);return o.jsx(s.AbsoluteFill,{style:w,children:o.jsx(s.AbsoluteFill,{style:p,children:r})})},Z=r=>({component:Le,props:r??{}}),Be=({children:r,presentationDirection:t,presentationProgress:e,passedProps:{direction:n="from-left",perspective:a=1e3,innerEnterStyle:u,innerExitStyle:d,outerEnterStyle:c,outerExitStyle:i}})=>{const g=l.useMemo(()=>{const w=n==="from-right"||n==="from-top"?180:-180,m=n==="from-right"||n==="from-top"?-180:180,y=t==="entering"?s.interpolate(e,[0,1],[w,0]):s.interpolate(e,[0,1],[0,m]);return{width:"100%",height:"100%",transform:`${n==="from-top"||n==="from-bottom"?"rotateX":"rotateY"}(${y}deg)`,backfaceVisibility:"hidden",WebkitBackfaceVisibility:"hidden",...t==="entering"?u:d}},[n,u,d,t,e]),p=l.useMemo(()=>({perspective:a,transformStyle:"preserve-3d",...t==="entering"?c:i}),[c,i,a,t]);return o.jsx(s.AbsoluteFill,{style:p,children:o.jsx(s.AbsoluteFill,{style:g,children:r})})},R=r=>({component:Be,props:r??{}}),Ne=({children:r,presentationDirection:t,presentationProgress:e,passedProps:n})=>{const a=Math.sqrt(n.width**2+n.height**2)/2,{path:u}=Y.makePie({radius:a,progress:e}),d=B.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]),i=l.useMemo(()=>t==="entering"?n.outerEnterStyle:n.outerExitStyle,[n.outerEnterStyle,n.outerExitStyle,t]);return o.jsx(s.AbsoluteFill,{style:i,children:o.jsx(s.AbsoluteFill,{style:c,children:r})})},ee=r=>({component:Ne,props:r??{}});const We={none:({id:r})=>o.jsx(b.Transition,{presentation:W(),timing:$({durationInFrames:1})},r),fade:({durationInFrames:r,id:t})=>o.jsx(b.Transition,{presentation:W(),timing:$({durationInFrames:r})},t),slide:({durationInFrames:r,id:t,direction:e})=>o.jsx(b.Transition,{presentation:Q({direction:e}),timing:$({durationInFrames:r})},t),wipe:({durationInFrames:r,id:t,direction:e})=>o.jsx(b.Transition,{presentation:Z({direction:e}),timing:$({durationInFrames:r})},t),flip:({durationInFrames:r,id:t})=>o.jsx(b.Transition,{presentation:R(),timing:$({durationInFrames:r})},t),clockWipe:({width:r,height:t,durationInFrames:e,id:n})=>o.jsx(b.Transition,{presentation:ee({width:r,height:t}),timing:$({durationInFrames:e})},n),star:({width:r,height:t,durationInFrames:e,id:n})=>o.jsx(b.Transition,{presentation:K({width:r,height:t}),timing:$({durationInFrames:e})},n),circle:({width:r,height:t,durationInFrames:e,id:n})=>o.jsx(b.Transition,{presentation:H({width:r,height:t}),timing:$({durationInFrames:e})},n),rectangle:({width:r,height:t,durationInFrames:e,id:n})=>o.jsx(b.Transition,{presentation:J({width:r,height:t}),timing:$({durationInFrames:e})},n),slidingDoors:({width:r,height:t,durationInFrames:e,id:n})=>o.jsx(b.Transition,{presentation:G({width:r,height:t}),timing:$({durationInFrames:e})},n)};f.TransitionSeries=b,f.Transitions=We,f.circle=H,f.clockWipe=ee,f.fade=W,f.flip=R,f.linearTiming=$,f.rectangle=J,f.slide=Q,f.slidingDoors=G,f.springTiming=ie,f.star=K,f.useTransitionProgress=Fe,f.wipe=Z,Object.defineProperty(f,Symbol.toStringTag,{value:"Module"})});
26
5
  //# sourceMappingURL=index.umd.js.map