@rendiv/transitions 0.1.0

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.
@@ -0,0 +1,32 @@
1
+ import { default as React, ReactNode } from 'react';
2
+ import { TransitionPresentation, TransitionTiming } from './types';
3
+ export interface TransitionSeriesSequenceProps {
4
+ durationInFrames: number;
5
+ name?: string;
6
+ children: ReactNode;
7
+ }
8
+ declare function TransitionSeriesSequence(_props: TransitionSeriesSequenceProps): React.ReactNode;
9
+ declare namespace TransitionSeriesSequence {
10
+ var displayName: string;
11
+ }
12
+ export interface TransitionSeriesTransitionProps {
13
+ timing: TransitionTiming;
14
+ presentation?: TransitionPresentation;
15
+ }
16
+ declare function TransitionSeriesTransition(_props: TransitionSeriesTransitionProps): React.ReactNode;
17
+ declare namespace TransitionSeriesTransition {
18
+ var displayName: string;
19
+ }
20
+ export interface TransitionSeriesProps {
21
+ children: ReactNode;
22
+ }
23
+ declare function TransitionSeriesRoot({ children }: TransitionSeriesProps): React.ReactElement;
24
+ declare namespace TransitionSeriesRoot {
25
+ var displayName: string;
26
+ }
27
+ export declare const TransitionSeries: typeof TransitionSeriesRoot & {
28
+ Sequence: typeof TransitionSeriesSequence;
29
+ Transition: typeof TransitionSeriesTransition;
30
+ };
31
+ export {};
32
+ //# sourceMappingURL=TransitionSeries.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TransitionSeries.d.ts","sourceRoot":"","sources":["../src/TransitionSeries.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAY,KAAK,SAAS,EAAsB,MAAM,OAAO,CAAC;AAE5E,OAAO,KAAK,EAAE,sBAAsB,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAIxE,MAAM,WAAW,6BAA6B;IAC5C,gBAAgB,EAAE,MAAM,CAAC;IACzB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,iBAAS,wBAAwB,CAAC,MAAM,EAAE,6BAA6B,GAAG,KAAK,CAAC,SAAS,CAIxF;kBAJQ,wBAAwB;;;AAOjC,MAAM,WAAW,+BAA+B;IAC9C,MAAM,EAAE,gBAAgB,CAAC;IACzB,YAAY,CAAC,EAAE,sBAAsB,CAAC;CACvC;AAED,iBAAS,0BAA0B,CAAC,MAAM,EAAE,+BAA+B,GAAG,KAAK,CAAC,SAAS,CAI5F;kBAJQ,0BAA0B;;;AAyEnC,MAAM,WAAW,qBAAqB;IACpC,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,iBAAS,oBAAoB,CAAC,EAAE,QAAQ,EAAE,EAAE,qBAAqB,GAAG,KAAK,CAAC,YAAY,CAuGrF;kBAvGQ,oBAAoB;;;AA2G7B,eAAO,MAAM,gBAAgB;;;CAG3B,CAAC"}
package/dist/index.cjs ADDED
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const m=require("react/jsx-runtime"),p=require("react"),u=require("@rendiv/core");function d(t){throw new Error("<TransitionSeries.Sequence> can only be used as a direct child of <TransitionSeries>.")}d.displayName="TransitionSeries.Sequence";function g(t){throw new Error("<TransitionSeries.Transition> can only be used as a direct child of <TransitionSeries>.")}g.displayName="TransitionSeries.Transition";const T={style:()=>({entering:{},exiting:{}})};function S({children:t,durationInFrames:r,enterTransition:e,exitTransition:a}){const s=u.useFrame();let n={};if(e&&s<e.timing.durationInFrames){const i=e.timing.progress(s);n=e.presentation.style(i).entering}else if(a){const i=r-a.timing.durationInFrames;if(s>=i){const c=s-i,l=a.timing.progress(c);n=a.presentation.style(l).exiting}}return m.jsx(u.Fill,{style:n,children:t})}function y({children:t}){const r=p.Children.toArray(t),e=[];for(const n of r)if(p.isValidElement(n))if(n.type===d){const i=n.props;e.push({type:"sequence",durationInFrames:i.durationInFrames,name:i.name,children:i.children})}else if(n.type===g){const i=n.props;e.push({type:"transition",timing:i.timing,presentation:i.presentation??T})}else throw new Error("Only <TransitionSeries.Sequence> and <TransitionSeries.Transition> are allowed as children of <TransitionSeries>.");const a=[];let s=0;for(let n=0;n<e.length;n++){const i=e[n];if(i.type!=="sequence")continue;let c=i.name;if(!c){const o=p.Children.toArray(i.children);if(o.length>0){const f=o[0];if(p.isValidElement(f)&&typeof f.type!="string"){const h=f.type;c=h.displayName||h.name}}}const l={from:s,durationInFrames:i.durationInFrames,name:c,children:i.children};if(n>0&&e[n-1].type==="transition"){const o=e[n-1];l.enterTransition={timing:o.timing,presentation:o.presentation},s-=o.timing.durationInFrames,l.from=s}if(n+1<e.length&&e[n+1].type==="transition"){const o=e[n+1];l.exitTransition={timing:o.timing,presentation:o.presentation}}a.push(l),s+=i.durationInFrames}return m.jsx(m.Fragment,{children:a.map((n,i)=>m.jsx(u.Sequence,{from:n.from,durationInFrames:n.durationInFrames,name:n.name,layout:"none",children:m.jsx(S,{durationInFrames:n.durationInFrames,enterTransition:n.enterTransition,exitTransition:n.exitTransition,children:n.children})},i))})}y.displayName="TransitionSeries";const x=Object.assign(y,{Sequence:d,Transition:g});function $({durationInFrames:t}){return{durationInFrames:t,progress:r=>Math.min(Math.max(r/t,0),1)}}function b({fps:t,config:r,durationInFrames:e}){return{durationInFrames:e??Math.ceil(u.getSpringDuration({fps:t,config:r})),progress:s=>u.spring({frame:s,fps:t,config:r})}}function F(){return{style:t=>({entering:{opacity:t},exiting:{opacity:1-t}})}}function k({direction:t="from-right"}={}){return{style:r=>{const e=(1-r)*100,a=r*100;let s,n;switch(t){case"from-left":s=`translateX(${-e}%)`,n=`translateX(${a}%)`;break;case"from-right":s=`translateX(${e}%)`,n=`translateX(${-a}%)`;break;case"from-top":s=`translateY(${-e}%)`,n=`translateY(${a}%)`;break;case"from-bottom":s=`translateY(${e}%)`,n=`translateY(${-a}%)`;break}return{entering:{transform:s},exiting:{transform:n}}}}}function I({direction:t="from-left"}={}){return{style:r=>{let e;switch(t){case"from-left":e=`inset(0 ${(1-r)*100}% 0 0)`;break;case"from-right":e=`inset(0 0 0 ${(1-r)*100}%)`;break;case"from-top":e=`inset(0 0 ${(1-r)*100}% 0)`;break;case"from-bottom":e=`inset(${(1-r)*100}% 0 0 0)`;break}return{entering:{clipPath:e},exiting:{}}}}}function q({direction:t="horizontal",perspective:r=1e3}={}){return{style:e=>{const a=t==="horizontal"?"Y":"X",s=Math.min(e*2,1)*90,n=Math.max(1-(e-.5)*2,0)*90;return{entering:{transform:`perspective(${r}px) rotate${a}(${n}deg)`,backfaceVisibility:"hidden",opacity:e>.5?1:0},exiting:{transform:`perspective(${r}px) rotate${a}(-${s}deg)`,backfaceVisibility:"hidden",opacity:e<=.5?1:0}}}}}function w({segments:t=64}={}){return{style:r=>{const e=r*360,a=["50% 50%","50% 0%"];for(let n=0;n<=t;n++){const i=n/t*e;if(i>e)break;const c=(i-90)*Math.PI/180,l=50+Math.cos(c)*71,o=50+Math.sin(c)*71;a.push(`${l}% ${o}%`)}return{entering:{clipPath:`polygon(${a.join(", ")})`},exiting:{}}}}}exports.TransitionSeries=x;exports.clockWipe=w;exports.fade=F;exports.flip=q;exports.linearTiming=$;exports.slide=k;exports.springTiming=b;exports.wipe=I;
@@ -0,0 +1,10 @@
1
+ export type { TransitionPresentation, TransitionStyles, TransitionTiming } from './types';
2
+ export { TransitionSeries, type TransitionSeriesProps, type TransitionSeriesSequenceProps, type TransitionSeriesTransitionProps, } from './TransitionSeries';
3
+ export { linearTiming, type LinearTimingOptions } from './timings/linear-timing';
4
+ export { springTiming, type SpringTimingOptions } from './timings/spring-timing';
5
+ export { fade } from './presentations/fade';
6
+ export { slide, type SlideDirection, type SlideOptions } from './presentations/slide';
7
+ export { wipe, type WipeDirection, type WipeOptions } from './presentations/wipe';
8
+ export { flip, type FlipDirection, type FlipOptions } from './presentations/flip';
9
+ export { clockWipe, type ClockWipeOptions } from './presentations/clock-wipe';
10
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,YAAY,EAAE,sBAAsB,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAG1F,OAAO,EACL,gBAAgB,EAChB,KAAK,qBAAqB,EAC1B,KAAK,6BAA6B,EAClC,KAAK,+BAA+B,GACrC,MAAM,oBAAoB,CAAC;AAG5B,OAAO,EAAE,YAAY,EAAE,KAAK,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AACjF,OAAO,EAAE,YAAY,EAAE,KAAK,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAGjF,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAC5C,OAAO,EAAE,KAAK,EAAE,KAAK,cAAc,EAAE,KAAK,YAAY,EAAE,MAAM,uBAAuB,CAAC;AACtF,OAAO,EAAE,IAAI,EAAE,KAAK,aAAa,EAAE,KAAK,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAClF,OAAO,EAAE,IAAI,EAAE,KAAK,aAAa,EAAE,KAAK,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAClF,OAAO,EAAE,SAAS,EAAE,KAAK,gBAAgB,EAAE,MAAM,4BAA4B,CAAC"}
package/dist/index.js ADDED
@@ -0,0 +1,241 @@
1
+ import { jsx as m, Fragment as T } from "react/jsx-runtime";
2
+ import g, { Children as h } from "react";
3
+ import { Sequence as S, useFrame as $, Fill as x, getSpringDuration as b, spring as F } from "@rendiv/core";
4
+ function f(t) {
5
+ throw new Error(
6
+ "<TransitionSeries.Sequence> can only be used as a direct child of <TransitionSeries>."
7
+ );
8
+ }
9
+ f.displayName = "TransitionSeries.Sequence";
10
+ function u(t) {
11
+ throw new Error(
12
+ "<TransitionSeries.Transition> can only be used as a direct child of <TransitionSeries>."
13
+ );
14
+ }
15
+ u.displayName = "TransitionSeries.Transition";
16
+ const I = {
17
+ style: () => ({ entering: {}, exiting: {} })
18
+ };
19
+ function k({
20
+ children: t,
21
+ durationInFrames: r,
22
+ enterTransition: e,
23
+ exitTransition: a
24
+ }) {
25
+ const o = $();
26
+ let n = {};
27
+ if (e && o < e.timing.durationInFrames) {
28
+ const i = e.timing.progress(o);
29
+ n = e.presentation.style(i).entering;
30
+ } else if (a) {
31
+ const i = r - a.timing.durationInFrames;
32
+ if (o >= i) {
33
+ const c = o - i, l = a.timing.progress(c);
34
+ n = a.presentation.style(l).exiting;
35
+ }
36
+ }
37
+ return /* @__PURE__ */ m(x, { style: n, children: t });
38
+ }
39
+ function y({ children: t }) {
40
+ const r = h.toArray(t), e = [];
41
+ for (const n of r)
42
+ if (g.isValidElement(n))
43
+ if (n.type === f) {
44
+ const i = n.props;
45
+ e.push({
46
+ type: "sequence",
47
+ durationInFrames: i.durationInFrames,
48
+ name: i.name,
49
+ children: i.children
50
+ });
51
+ } else if (n.type === u) {
52
+ const i = n.props;
53
+ e.push({
54
+ type: "transition",
55
+ timing: i.timing,
56
+ presentation: i.presentation ?? I
57
+ });
58
+ } else
59
+ throw new Error(
60
+ "Only <TransitionSeries.Sequence> and <TransitionSeries.Transition> are allowed as children of <TransitionSeries>."
61
+ );
62
+ const a = [];
63
+ let o = 0;
64
+ for (let n = 0; n < e.length; n++) {
65
+ const i = e[n];
66
+ if (i.type !== "sequence") continue;
67
+ let c = i.name;
68
+ if (!c) {
69
+ const s = h.toArray(i.children);
70
+ if (s.length > 0) {
71
+ const p = s[0];
72
+ if (g.isValidElement(p) && typeof p.type != "string") {
73
+ const d = p.type;
74
+ c = d.displayName || d.name;
75
+ }
76
+ }
77
+ }
78
+ const l = {
79
+ from: o,
80
+ durationInFrames: i.durationInFrames,
81
+ name: c,
82
+ children: i.children
83
+ };
84
+ if (n > 0 && e[n - 1].type === "transition") {
85
+ const s = e[n - 1];
86
+ l.enterTransition = {
87
+ timing: s.timing,
88
+ presentation: s.presentation
89
+ }, o -= s.timing.durationInFrames, l.from = o;
90
+ }
91
+ if (n + 1 < e.length && e[n + 1].type === "transition") {
92
+ const s = e[n + 1];
93
+ l.exitTransition = {
94
+ timing: s.timing,
95
+ presentation: s.presentation
96
+ };
97
+ }
98
+ a.push(l), o += i.durationInFrames;
99
+ }
100
+ return /* @__PURE__ */ m(T, { children: a.map((n, i) => /* @__PURE__ */ m(
101
+ S,
102
+ {
103
+ from: n.from,
104
+ durationInFrames: n.durationInFrames,
105
+ name: n.name,
106
+ layout: "none",
107
+ children: /* @__PURE__ */ m(
108
+ k,
109
+ {
110
+ durationInFrames: n.durationInFrames,
111
+ enterTransition: n.enterTransition,
112
+ exitTransition: n.exitTransition,
113
+ children: n.children
114
+ }
115
+ )
116
+ },
117
+ i
118
+ )) });
119
+ }
120
+ y.displayName = "TransitionSeries";
121
+ const A = Object.assign(y, {
122
+ Sequence: f,
123
+ Transition: u
124
+ });
125
+ function E({ durationInFrames: t }) {
126
+ return {
127
+ durationInFrames: t,
128
+ progress: (r) => Math.min(Math.max(r / t, 0), 1)
129
+ };
130
+ }
131
+ function N({ fps: t, config: r, durationInFrames: e }) {
132
+ return {
133
+ durationInFrames: e ?? Math.ceil(b({ fps: t, config: r })),
134
+ progress: (o) => F({ frame: o, fps: t, config: r })
135
+ };
136
+ }
137
+ function P() {
138
+ return {
139
+ style: (t) => ({
140
+ entering: { opacity: t },
141
+ exiting: { opacity: 1 - t }
142
+ })
143
+ };
144
+ }
145
+ function X({ direction: t = "from-right" } = {}) {
146
+ return {
147
+ style: (r) => {
148
+ const e = (1 - r) * 100, a = r * 100;
149
+ let o, n;
150
+ switch (t) {
151
+ case "from-left":
152
+ o = `translateX(${-e}%)`, n = `translateX(${a}%)`;
153
+ break;
154
+ case "from-right":
155
+ o = `translateX(${e}%)`, n = `translateX(${-a}%)`;
156
+ break;
157
+ case "from-top":
158
+ o = `translateY(${-e}%)`, n = `translateY(${a}%)`;
159
+ break;
160
+ case "from-bottom":
161
+ o = `translateY(${e}%)`, n = `translateY(${-a}%)`;
162
+ break;
163
+ }
164
+ return {
165
+ entering: { transform: o },
166
+ exiting: { transform: n }
167
+ };
168
+ }
169
+ };
170
+ }
171
+ function Y({ direction: t = "from-left" } = {}) {
172
+ return {
173
+ style: (r) => {
174
+ let e;
175
+ switch (t) {
176
+ case "from-left":
177
+ e = `inset(0 ${(1 - r) * 100}% 0 0)`;
178
+ break;
179
+ case "from-right":
180
+ e = `inset(0 0 0 ${(1 - r) * 100}%)`;
181
+ break;
182
+ case "from-top":
183
+ e = `inset(0 0 ${(1 - r) * 100}% 0)`;
184
+ break;
185
+ case "from-bottom":
186
+ e = `inset(${(1 - r) * 100}% 0 0 0)`;
187
+ break;
188
+ }
189
+ return {
190
+ entering: { clipPath: e },
191
+ exiting: {}
192
+ };
193
+ }
194
+ };
195
+ }
196
+ function V({ direction: t = "horizontal", perspective: r = 1e3 } = {}) {
197
+ return {
198
+ style: (e) => {
199
+ const a = t === "horizontal" ? "Y" : "X", o = Math.min(e * 2, 1) * 90, n = Math.max(1 - (e - 0.5) * 2, 0) * 90;
200
+ return {
201
+ entering: {
202
+ transform: `perspective(${r}px) rotate${a}(${n}deg)`,
203
+ backfaceVisibility: "hidden",
204
+ opacity: e > 0.5 ? 1 : 0
205
+ },
206
+ exiting: {
207
+ transform: `perspective(${r}px) rotate${a}(-${o}deg)`,
208
+ backfaceVisibility: "hidden",
209
+ opacity: e <= 0.5 ? 1 : 0
210
+ }
211
+ };
212
+ }
213
+ };
214
+ }
215
+ function j({ segments: t = 64 } = {}) {
216
+ return {
217
+ style: (r) => {
218
+ const e = r * 360, a = ["50% 50%", "50% 0%"];
219
+ for (let n = 0; n <= t; n++) {
220
+ const i = n / t * e;
221
+ if (i > e) break;
222
+ const c = (i - 90) * Math.PI / 180, l = 50 + Math.cos(c) * 71, s = 50 + Math.sin(c) * 71;
223
+ a.push(`${l}% ${s}%`);
224
+ }
225
+ return {
226
+ entering: { clipPath: `polygon(${a.join(", ")})` },
227
+ exiting: {}
228
+ };
229
+ }
230
+ };
231
+ }
232
+ export {
233
+ A as TransitionSeries,
234
+ j as clockWipe,
235
+ P as fade,
236
+ V as flip,
237
+ E as linearTiming,
238
+ X as slide,
239
+ N as springTiming,
240
+ Y as wipe
241
+ };
@@ -0,0 +1,7 @@
1
+ import { TransitionPresentation } from '../types';
2
+ export interface ClockWipeOptions {
3
+ /** Number of polygon points to approximate the arc. Default: 64. */
4
+ segments?: number;
5
+ }
6
+ export declare function clockWipe({ segments }?: ClockWipeOptions): TransitionPresentation;
7
+ //# sourceMappingURL=clock-wipe.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"clock-wipe.d.ts","sourceRoot":"","sources":["../../src/presentations/clock-wipe.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,UAAU,CAAC;AAEvD,MAAM,WAAW,gBAAgB;IAC/B,oEAAoE;IACpE,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,wBAAgB,SAAS,CAAC,EAAE,QAAa,EAAE,GAAE,gBAAqB,GAAG,sBAAsB,CA0B1F"}
@@ -0,0 +1,3 @@
1
+ import { TransitionPresentation } from '../types';
2
+ export declare function fade(): TransitionPresentation;
3
+ //# sourceMappingURL=fade.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"fade.d.ts","sourceRoot":"","sources":["../../src/presentations/fade.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,UAAU,CAAC;AAEvD,wBAAgB,IAAI,IAAI,sBAAsB,CAO7C"}
@@ -0,0 +1,8 @@
1
+ import { TransitionPresentation } from '../types';
2
+ export type FlipDirection = 'horizontal' | 'vertical';
3
+ export interface FlipOptions {
4
+ direction?: FlipDirection;
5
+ perspective?: number;
6
+ }
7
+ export declare function flip({ direction, perspective }?: FlipOptions): TransitionPresentation;
8
+ //# sourceMappingURL=flip.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"flip.d.ts","sourceRoot":"","sources":["../../src/presentations/flip.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,UAAU,CAAC;AAEvD,MAAM,MAAM,aAAa,GAAG,YAAY,GAAG,UAAU,CAAC;AAEtD,MAAM,WAAW,WAAW;IAC1B,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,wBAAgB,IAAI,CAAC,EAAE,SAAwB,EAAE,WAAkB,EAAE,GAAE,WAAgB,GAAG,sBAAsB,CAwB/G"}
@@ -0,0 +1,7 @@
1
+ import { TransitionPresentation } from '../types';
2
+ export type SlideDirection = 'from-left' | 'from-right' | 'from-top' | 'from-bottom';
3
+ export interface SlideOptions {
4
+ direction?: SlideDirection;
5
+ }
6
+ export declare function slide({ direction }?: SlideOptions): TransitionPresentation;
7
+ //# sourceMappingURL=slide.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"slide.d.ts","sourceRoot":"","sources":["../../src/presentations/slide.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,UAAU,CAAC;AAEvD,MAAM,MAAM,cAAc,GAAG,WAAW,GAAG,YAAY,GAAG,UAAU,GAAG,aAAa,CAAC;AAErF,MAAM,WAAW,YAAY;IAC3B,SAAS,CAAC,EAAE,cAAc,CAAC;CAC5B;AAED,wBAAgB,KAAK,CAAC,EAAE,SAAwB,EAAE,GAAE,YAAiB,GAAG,sBAAsB,CAkC7F"}
@@ -0,0 +1,7 @@
1
+ import { TransitionPresentation } from '../types';
2
+ export type WipeDirection = 'from-left' | 'from-right' | 'from-top' | 'from-bottom';
3
+ export interface WipeOptions {
4
+ direction?: WipeDirection;
5
+ }
6
+ export declare function wipe({ direction }?: WipeOptions): TransitionPresentation;
7
+ //# sourceMappingURL=wipe.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"wipe.d.ts","sourceRoot":"","sources":["../../src/presentations/wipe.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,UAAU,CAAC;AAEvD,MAAM,MAAM,aAAa,GAAG,WAAW,GAAG,YAAY,GAAG,UAAU,GAAG,aAAa,CAAC;AAEpF,MAAM,WAAW,WAAW;IAC1B,SAAS,CAAC,EAAE,aAAa,CAAC;CAC3B;AAED,wBAAgB,IAAI,CAAC,EAAE,SAAuB,EAAE,GAAE,WAAgB,GAAG,sBAAsB,CA0B1F"}
@@ -0,0 +1,6 @@
1
+ import { TransitionTiming } from '../types';
2
+ export interface LinearTimingOptions {
3
+ durationInFrames: number;
4
+ }
5
+ export declare function linearTiming({ durationInFrames }: LinearTimingOptions): TransitionTiming;
6
+ //# sourceMappingURL=linear-timing.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"linear-timing.d.ts","sourceRoot":"","sources":["../../src/timings/linear-timing.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAEjD,MAAM,WAAW,mBAAmB;IAClC,gBAAgB,EAAE,MAAM,CAAC;CAC1B;AAED,wBAAgB,YAAY,CAAC,EAAE,gBAAgB,EAAE,EAAE,mBAAmB,GAAG,gBAAgB,CAKxF"}
@@ -0,0 +1,9 @@
1
+ import { SpringConfig } from '@rendiv/core';
2
+ import { TransitionTiming } from '../types';
3
+ export interface SpringTimingOptions {
4
+ fps: number;
5
+ config?: Partial<SpringConfig>;
6
+ durationInFrames?: number;
7
+ }
8
+ export declare function springTiming({ fps, config, durationInFrames }: SpringTimingOptions): TransitionTiming;
9
+ //# sourceMappingURL=spring-timing.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"spring-timing.d.ts","sourceRoot":"","sources":["../../src/timings/spring-timing.ts"],"names":[],"mappings":"AAAA,OAAO,EAA6B,KAAK,YAAY,EAAE,MAAM,cAAc,CAAC;AAC5E,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAEjD,MAAM,WAAW,mBAAmB;IAClC,GAAG,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,CAAC;IAC/B,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAED,wBAAgB,YAAY,CAAC,EAAE,GAAG,EAAE,MAAM,EAAE,gBAAgB,EAAE,EAAE,mBAAmB,GAAG,gBAAgB,CAOrG"}
@@ -0,0 +1,13 @@
1
+ import { CSSProperties } from 'react';
2
+ export interface TransitionStyles {
3
+ entering: CSSProperties;
4
+ exiting: CSSProperties;
5
+ }
6
+ export interface TransitionPresentation {
7
+ style: (progress: number) => TransitionStyles;
8
+ }
9
+ export interface TransitionTiming {
10
+ durationInFrames: number;
11
+ progress: (frame: number) => number;
12
+ }
13
+ //# sourceMappingURL=types.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAE3C,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,EAAE,aAAa,CAAC;IACxB,OAAO,EAAE,aAAa,CAAC;CACxB;AAED,MAAM,WAAW,sBAAsB;IACrC,KAAK,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,gBAAgB,CAAC;CAC/C;AAED,MAAM,WAAW,gBAAgB;IAC/B,gBAAgB,EAAE,MAAM,CAAC;IACzB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;CACrC"}
package/package.json ADDED
@@ -0,0 +1,41 @@
1
+ {
2
+ "name": "@rendiv/transitions",
3
+ "version": "0.1.0",
4
+ "license": "MIT",
5
+ "type": "module",
6
+ "main": "./dist/index.cjs",
7
+ "module": "./dist/index.js",
8
+ "types": "./dist/index.d.ts",
9
+ "exports": {
10
+ ".": {
11
+ "types": "./dist/index.d.ts",
12
+ "import": "./dist/index.js",
13
+ "require": "./dist/index.cjs"
14
+ }
15
+ },
16
+ "files": [
17
+ "dist"
18
+ ],
19
+ "peerDependencies": {
20
+ "react": "^18.0.0 || ^19.0.0",
21
+ "react-dom": "^18.0.0 || ^19.0.0",
22
+ "@rendiv/core": "0.1.0"
23
+ },
24
+ "devDependencies": {
25
+ "@types/react": "^19.0.0",
26
+ "@types/react-dom": "^19.0.0",
27
+ "react": "^19.0.0",
28
+ "react-dom": "^19.0.0",
29
+ "vite": "^6.0.0",
30
+ "vite-plugin-dts": "^4.3.0",
31
+ "typescript": "^5.7.0",
32
+ "@rendiv/tsconfig": "0.0.0",
33
+ "@rendiv/core": "0.1.0"
34
+ },
35
+ "scripts": {
36
+ "build": "vite build",
37
+ "dev": "vite build --watch",
38
+ "typecheck": "tsc --noEmit",
39
+ "clean": "rm -rf dist"
40
+ }
41
+ }