reacthub-pixitweenjs 0.2.109-alpha.7 → 0.3.0-alpha.3

package/dist/pixitweenjs-logo.svg

@@ -1,97 +0,0 @@
-<svg width="600" height="200" viewBox="0 0 600 200" xmlns="http://www.w3.org/2000/svg">
-  <defs>
-    <!-- Gradient for the logo -->
-    <linearGradient id="logoGradient" x1="0%" y1="0%" x2="100%" y2="100%">
-      <stop offset="0%" style="stop-color:#4FC3F7;stop-opacity:1" />
-      <stop offset="100%" style="stop-color:#29B6F6;stop-opacity:1" />
-    </linearGradient>
-    
-    <!-- Gradient for text -->
-    <linearGradient id="textGradient" x1="0%" y1="0%" x2="100%" y2="0%">
-      <stop offset="0%" style="stop-color:#29B6F6;stop-opacity:1" />
-      <stop offset="100%" style="stop-color:#039BE5;stop-opacity:1" />
-    </linearGradient>
-
-    <!-- Animation for the play circle -->
-    <animateTransform
-      id="playAnimation"
-      attributeName="transform"
-      attributeType="XML"
-      type="rotate"
-      from="0 135 100"
-      to="360 135 100"
-      dur="3s"
-      repeatCount="indefinite"/>
-  </defs>
-  
-  <!-- Film strip frame -->
-  <g id="filmStrip">
-    <!-- Main frame -->
-    <rect x="30" y="40" width="150" height="120" rx="8" fill="none" stroke="url(#logoGradient)" stroke-width="4"/>
-    
-    <!-- Film holes - top -->
-    <rect x="40" y="45" width="12" height="8" rx="2" fill="url(#logoGradient)"/>
-    <rect x="60" y="45" width="12" height="8" rx="2" fill="url(#logoGradient)"/>
-    <rect x="80" y="45" width="12" height="8" rx="2" fill="url(#logoGradient)"/>
-    <rect x="100" y="45" width="12" height="8" rx="2" fill="url(#logoGradient)"/>
-    <rect x="120" y="45" width="12" height="8" rx="2" fill="url(#logoGradient)"/>
-    <rect x="140" y="45" width="12" height="8" rx="2" fill="url(#logoGradient)"/>
-    <rect x="160" y="45" width="12" height="8" rx="2" fill="url(#logoGradient)"/>
-    
-    <!-- Film holes - bottom -->
-    <rect x="40" y="147" width="12" height="8" rx="2" fill="url(#logoGradient)"/>
-    <rect x="60" y="147" width="12" height="8" rx="2" fill="url(#logoGradient)"/>
-    <rect x="80" y="147" width="12" height="8" rx="2" fill="url(#logoGradient)"/>
-    <rect x="100" y="147" width="12" height="8" rx="2" fill="url(#logoGradient)"/>
-    <rect x="120" y="147" width="12" height="8" rx="2" fill="url(#logoGradient)"/>
-    <rect x="140" y="147" width="12" height="8" rx="2" fill="url(#logoGradient)"/>
-    <rect x="160" y="147" width="12" height="8" rx="2" fill="url(#logoGradient)"/>
-    
-    <!-- Timeline bars inside -->
-    <rect x="50" y="75" width="50" height="4" rx="2" fill="url(#logoGradient)" opacity="0.6"/>
-    <rect x="50" y="90" width="70" height="4" rx="2" fill="url(#logoGradient)" opacity="0.6"/>
-    <rect x="50" y="105" width="40" height="4" rx="2" fill="url(#logoGradient)" opacity="0.6"/>
-    <rect x="50" y="120" width="60" height="4" rx="2" fill="url(#logoGradient)" opacity="0.6"/>
-    
-    <!-- Play button circle with animation -->
-    <g>
-      <circle cx="135" cy="100" r="22" fill="none" stroke="url(#logoGradient)" stroke-width="3" opacity="0.8">
-        <animateTransform
-          attributeName="transform"
-          attributeType="XML"
-          type="rotate"
-          from="0 135 100"
-          to="360 135 100"
-          dur="3s"
-          repeatCount="indefinite"/>
-      </circle>
-      
-      <!-- Play triangle -->
-      <polygon points="130,90 130,110 148,100" fill="url(#logoGradient)"/>
-    </g>
-  </g>
-  
-  <!-- Text: PixiTweenJS -->
-  <text x="200" y="100" font-family="'Segoe UI', -apple-system, system-ui, sans-serif" font-size="52" font-weight="700" fill="url(#textGradient)">
-    PixiTweenJS
-  </text>
-  
-  <!-- Tagline -->
-  <text x="200" y="130" font-family="'Segoe UI', -apple-system, system-ui, sans-serif" font-size="20" font-weight="400" fill="#64B5F6" opacity="0.8">
-    Timeline-based canvas animation
-  </text>
-  
-  <!-- Decorative elements -->
-  <g opacity="0.3">
-    <!-- Small sparkles -->
-    <circle cx="190" cy="65" r="2" fill="#29B6F6">
-      <animate attributeName="opacity" values="0.3;1;0.3" dur="2s" repeatCount="indefinite"/>
-    </circle>
-    <circle cx="570" cy="75" r="2" fill="#29B6F6">
-      <animate attributeName="opacity" values="0.3;1;0.3" dur="2.5s" repeatCount="indefinite"/>
-    </circle>
-    <circle cx="210" cy="145" r="2" fill="#29B6F6">
-      <animate attributeName="opacity" values="0.3;1;0.3" dur="3s" repeatCount="indefinite"/>
-    </circle>
-  </g>
-</svg>

package/dist/stories/Features/TestHowlerAudioFiles.d.ts

@@ -1,2 +0,0 @@
-declare function TestAudioFiles(): import("react/jsx-runtime").JSX.Element;
-export default TestAudioFiles;

package/dist/stories/Features/TimelineAnimations.d.ts

@@ -1,15 +0,0 @@
-import * as React from "react";
-export declare enum SpriteType {
-    Image = "Image",
-    Gif = "Gif",
-    Video = "Video"
-}
-export interface TimelineTestProps {
-    startAt: number;
-    endAt: number;
-}
-export interface TimelineProps {
-    children?: React.ReactNode;
-    sequences: TimelineTestProps[];
-}
-export declare const TimelineAnimationTest: (props: TimelineProps) => import("react/jsx-runtime").JSX.Element;

package/dist/stories/Features/TimelineTest.d.ts

@@ -1,15 +0,0 @@
-import * as React from "react";
-export declare enum SpriteType {
-    Image = "Image",
-    Gif = "Gif",
-    Video = "Video"
-}
-export interface TimelineTestProps {
-    startAt: number;
-    endAt: number;
-}
-export interface TimelineProps {
-    children?: React.ReactNode;
-    sequences: TimelineTestProps[];
-}
-export declare const TimelineTest: (props: TimelineProps) => import("react/jsx-runtime").JSX.Element;

package/dist/stories/Features/TimelineTest.stories.d.ts

@@ -1,23 +0,0 @@
-import { StoryObj } from '@storybook/react-vite';
-
-declare const meta: {
-    id: string;
-    title: string;
-    component: (props: import('./TimelineTest').TimelineProps) => import("react/jsx-runtime").JSX.Element;
-    tags: string[];
-    argTypes: {
-        sequences: {
-            description: string;
-            control: {
-                type: "object";
-            };
-        };
-    };
-};
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Normal: Story;
-export declare const GifTest: Story;
-export declare const VideoTest: Story;
-export declare const AudioTest: Story;
-export declare const Animations: Story;

package/dist/stories/Features/TimelineTestAudios.d.ts

@@ -1,15 +0,0 @@
-import * as React from "react";
-export declare enum SpriteType {
-    Image = "Image",
-    Gif = "Gif",
-    Video = "Video"
-}
-export interface TimelineTestProps {
-    startAt: number;
-    endAt: number;
-}
-export interface TimelineProps {
-    children?: React.ReactNode;
-    sequences: TimelineTestProps[];
-}
-export declare const TimelineTestAudios: (props: TimelineProps) => import("react/jsx-runtime").JSX.Element;

package/dist/stories/Features/TimelineTestWithVideos.d.ts

@@ -1,15 +0,0 @@
-import * as React from "react";
-export declare enum SpriteType {
-    Image = "Image",
-    Gif = "Gif",
-    Video = "Video"
-}
-export interface TimelineTestProps {
-    startAt: number;
-    endAt: number;
-}
-export interface TimelineProps {
-    children?: React.ReactNode;
-    sequences: TimelineTestProps[];
-}
-export declare const TimelineTestVideos: (props: TimelineProps) => import("react/jsx-runtime").JSX.Element;

package/dist/stories/Features/TimelineWithGif.d.ts

@@ -1,21 +0,0 @@
-import * as React from "react";
-export declare enum SpriteType {
-    Image = "Image",
-    Gif = "Gif",
-    Video = "Video"
-}
-export interface TimelineTestProps {
-    startAt: number;
-    endAt: number;
-}
-export interface TimelineProps {
-    children?: React.ReactNode;
-    sequences: TimelineTestProps[];
-}
-export declare const TimelineWithGif: {
-    (props: TimelineProps): import("react/jsx-runtime").JSX.Element;
-    whyDidYouRender: {
-        logOnDifferentValues: boolean;
-        customName: string;
-    };
-};

package/dist/stories/Features/common.tests.d.ts

@@ -1,411 +0,0 @@
-export declare const ImageProps: {
-    uniqueId: string;
-    src: string;
-    applyTransformer: boolean;
-    startAt: number;
-    endAt: number;
-    transformation: {
-        x: number;
-        y: number;
-        width: number;
-        height: number;
-        anchor: number;
-        rotation: number;
-        alpha: number;
-        scale: number;
-        tint: number;
-        blendMode: number;
-    };
-    visible: boolean;
-};
-export declare const GifProps: {
-    uniqueId: string;
-    src: string;
-    locked: boolean;
-    loop: boolean;
-    applyTransformer: boolean;
-    startAt: number;
-    endAt: number;
-    frameStartAt: number;
-    frameEndAt: number;
-    transformation: {
-        x: number;
-        y: number;
-        width: number;
-        height: number;
-        anchor: number;
-        rotation: number;
-        alpha: number;
-        scale: number;
-        tint: number;
-        blendMode: number;
-        colorCorrection: {};
-    };
-    visible: boolean;
-};
-export declare const videoProps: {
-    uniqueId: string;
-    src: string;
-    transformation: {
-        x: number;
-        y: number;
-        width: number;
-        height: number;
-        anchor: number;
-        rotation: number;
-        alpha: number;
-        scale: number;
-        tint: number;
-        blendMode: number;
-        colorCorrection: {};
-    };
-    applyTransformer: boolean;
-    startAt: number;
-    endAt: number;
-    frameStartAt: number;
-    frameEndAt: number;
-    visible: boolean;
-    mute: boolean;
-    locked: boolean;
-};
-export declare const audioProps: {
-    uniqueId: string;
-    src: string;
-    startAt: number;
-    endAt: number;
-    audioStartAt: number;
-    audioEndAt: number;
-    mute: boolean;
-    speed: number;
-};
-export declare const videoEditorAssets: ({
-    visible: boolean;
-    textValue: string;
-    src: string;
-    start: number;
-    isVideo: boolean;
-    mute: boolean;
-    title: string;
-    type: string;
-    transformation: {
-        strokeWidth: number;
-        rotate: number;
-        shadowOffsetX: number;
-        shadowOffsetY: number;
-        toCenter: boolean;
-        color: string;
-        shadowBlur: number;
-        blurRadius: number;
-        blurEnabled: boolean;
-        scale: number[];
-        stroke: null;
-        animation: string;
-        effect: string;
-        x: number;
-        width: number;
-        y: number;
-        opacity: number;
-        colorCorrection: {
-            reset: boolean;
-        };
-        shadowColor: null;
-        shadowEnabled: boolean;
-        height: number;
-        zIndex: number;
-        align?: undefined;
-        fontFamily?: undefined;
-        grayscaleEnabled?: undefined;
-        placeholder?: undefined;
-        fontWeight?: undefined;
-        textTransform?: undefined;
-        textValue?: undefined;
-        rotation?: undefined;
-        letterSpacing?: undefined;
-        textDecoration?: undefined;
-        brightnessEnabled?: undefined;
-        fontStyle?: undefined;
-        fill?: undefined;
-        brightness?: undefined;
-        fontSize?: undefined;
-        lineHeight?: undefined;
-        sepiaEnabled?: undefined;
-    };
-    frameEndAt: number;
-    droptype: string;
-    path: string;
-    name: string;
-    frameStartAt: number;
-    end: number;
-    isAudio: boolean;
-    id: string;
-    locked: boolean;
-    value: string;
-    scrubberRow: number;
-    uniqueId: string;
-    timestamp: number;
-    clipId: string;
-    s3Url?: undefined;
-    fileName?: undefined;
-    isAudioDetached?: undefined;
-    duration?: undefined;
-    thumbUrl?: undefined;
-    height?: undefined;
-    reducerType?: undefined;
-    frames?: undefined;
-    s3Key?: undefined;
-    width?: undefined;
-    projectId?: undefined;
-    user?: undefined;
-    pageId?: undefined;
-    fontStyle?: undefined;
-    text?: undefined;
-} | {
-    s3Url: string;
-    fileName: string;
-    type: string;
-    isAudioDetached: boolean;
-    duration: number;
-    frameStartAt: number;
-    end: number;
-    id: string;
-    thumbUrl: string;
-    locked: boolean;
-    scrubberRow: number;
-    height: number;
-    timestamp: number;
-    reducerType: string;
-    visible: boolean;
-    frames: null[];
-    src: string;
-    start: number;
-    isVideo: boolean;
-    mute: boolean;
-    transformation: {
-        strokeWidth: number;
-        rotate: number;
-        shadowOffsetX: number;
-        shadowOffsetY: number;
-        toCenter: boolean;
-        shadowBlur: number;
-        blurRadius: number;
-        blurEnabled: boolean;
-        scale: number[];
-        stroke: null;
-        animation: string;
-        effect: string;
-        width: number;
-        x: number;
-        y: number;
-        opacity: number;
-        colorCorrection: {
-            reset: boolean;
-        };
-        shadowColor: null;
-        shadowEnabled: boolean;
-        height: number;
-        zIndex: number;
-        color?: undefined;
-        align?: undefined;
-        fontFamily?: undefined;
-        grayscaleEnabled?: undefined;
-        placeholder?: undefined;
-        fontWeight?: undefined;
-        textTransform?: undefined;
-        textValue?: undefined;
-        rotation?: undefined;
-        letterSpacing?: undefined;
-        textDecoration?: undefined;
-        brightnessEnabled?: undefined;
-        fontStyle?: undefined;
-        fill?: undefined;
-        brightness?: undefined;
-        fontSize?: undefined;
-        lineHeight?: undefined;
-        sepiaEnabled?: undefined;
-    };
-    frameEndAt: number;
-    droptype: string;
-    s3Key: string;
-    name: string;
-    width: number;
-    isAudio: boolean;
-    projectId: string;
-    user: string;
-    uniqueId: string;
-    clipId: string;
-    textValue?: undefined;
-    title?: undefined;
-    path?: undefined;
-    value?: undefined;
-    pageId?: undefined;
-    fontStyle?: undefined;
-    text?: undefined;
-} | {
-    visible: boolean;
-    textValue: string;
-    start: number;
-    isVideo: boolean;
-    mute: boolean;
-    pageId: string;
-    transformation: {
-        strokeWidth: number;
-        shadowOffsetX: number;
-        rotate: number;
-        shadowOffsetY: number;
-        toCenter: boolean;
-        color: string;
-        shadowBlur: number;
-        blurRadius: number;
-        blurEnabled: boolean;
-        scale: number[];
-        align: string;
-        fontFamily: string;
-        grayscaleEnabled: boolean;
-        placeholder: string;
-        shadowColor: null;
-        fontWeight: string;
-        height: number;
-        textTransform: string;
-        zIndex: number;
-        textValue: string;
-        rotation: number;
-        letterSpacing: number;
-        textDecoration: string;
-        brightnessEnabled: boolean;
-        fontStyle: string;
-        fill: string;
-        stroke: null;
-        animation: string;
-        brightness: number;
-        effect: string;
-        x: number;
-        width: number;
-        y: number;
-        fontSize: number;
-        lineHeight: number;
-        opacity: number;
-        colorCorrection: {
-            reset: boolean;
-        };
-        shadowEnabled: boolean;
-        sepiaEnabled: boolean;
-    };
-    fontStyle: {
-        fontSize: number;
-        lineHeight: number;
-    };
-    frameEndAt: number;
-    droptype: string;
-    frameStartAt: number;
-    end: number;
-    isAudio: boolean;
-    id: string;
-    text: string;
-    locked: boolean;
-    scrubberRow: number;
-    uniqueId: string;
-    timestamp: number;
-    clipId: string;
-    src?: undefined;
-    title?: undefined;
-    type?: undefined;
-    path?: undefined;
-    name?: undefined;
-    value?: undefined;
-    s3Url?: undefined;
-    fileName?: undefined;
-    isAudioDetached?: undefined;
-    duration?: undefined;
-    thumbUrl?: undefined;
-    height?: undefined;
-    reducerType?: undefined;
-    frames?: undefined;
-    s3Key?: undefined;
-    width?: undefined;
-    projectId?: undefined;
-    user?: undefined;
-} | {
-    visible: boolean;
-    textValue: string;
-    start: number;
-    isVideo: boolean;
-    mute: boolean;
-    pageId: string;
-    transformation: {
-        strokeWidth: number;
-        shadowOffsetX: number;
-        rotate: number;
-        shadowOffsetY: number;
-        toCenter: boolean;
-        color: string;
-        shadowBlur: number;
-        blurRadius: number;
-        blurEnabled: boolean;
-        scale: number[];
-        align: string;
-        fontFamily: string;
-        grayscaleEnabled: boolean;
-        placeholder: string;
-        shadowColor: null;
-        fontWeight: string;
-        height: number;
-        textTransform: string;
-        zIndex: number;
-        rotation: number;
-        letterSpacing: number;
-        textDecoration: string;
-        brightnessEnabled: boolean;
-        fontStyle: string;
-        fill: string;
-        stroke: null;
-        animation: string;
-        brightness: number;
-        effect: string;
-        x: number;
-        width: number;
-        y: number;
-        fontSize: number;
-        lineHeight: number;
-        opacity: number;
-        colorCorrection: {
-            reset: boolean;
-        };
-        shadowEnabled: boolean;
-        sepiaEnabled: boolean;
-        textValue?: undefined;
-    };
-    fontStyle: {
-        fontSize: number;
-        lineHeight: number;
-    };
-    frameEndAt: number;
-    droptype: string;
-    frameStartAt: number;
-    end: number;
-    isAudio: boolean;
-    id: string;
-    text: string;
-    locked: boolean;
-    scrubberRow: number;
-    uniqueId: string;
-    timestamp: number;
-    clipId: string;
-    src?: undefined;
-    title?: undefined;
-    type?: undefined;
-    path?: undefined;
-    name?: undefined;
-    value?: undefined;
-    s3Url?: undefined;
-    fileName?: undefined;
-    isAudioDetached?: undefined;
-    duration?: undefined;
-    thumbUrl?: undefined;
-    height?: undefined;
-    reducerType?: undefined;
-    frames?: undefined;
-    s3Key?: undefined;
-    width?: undefined;
-    projectId?: undefined;
-    user?: undefined;
-})[];