payload-plugin-decks 1.0.0

package/dist/decks/schema.d.ts

@@ -0,0 +1,59 @@
+export declare const DECKS_DEFAULTS: {
+    readonly animationType: "fadeIn";
+    readonly autoPlay: true;
+    readonly backgroundColor: "#000000";
+    readonly durationPerSlide: 3;
+    readonly fps: 30;
+    readonly imageZoom: true;
+    readonly loop: true;
+    readonly showControls: false;
+    readonly textColor: "#ffffff";
+    readonly textPosition: "center";
+    readonly transitionDuration: 15;
+};
+export declare const decksTextPositionOptions: readonly [{
+    readonly label: "Top Left";
+    readonly value: "top-left";
+}, {
+    readonly label: "Top Center";
+    readonly value: "top-center";
+}, {
+    readonly label: "Top Right";
+    readonly value: "top-right";
+}, {
+    readonly label: "Center Left";
+    readonly value: "center-left";
+}, {
+    readonly label: "Center";
+    readonly value: "center";
+}, {
+    readonly label: "Center Right";
+    readonly value: "center-right";
+}, {
+    readonly label: "Bottom Left";
+    readonly value: "bottom-left";
+}, {
+    readonly label: "Bottom Center";
+    readonly value: "bottom-center";
+}, {
+    readonly label: "Bottom Right";
+    readonly value: "bottom-right";
+}];
+export declare const decksAnimationOptions: readonly [{
+    readonly label: "Fade In";
+    readonly value: "fadeIn";
+}, {
+    readonly label: "Slide Up";
+    readonly value: "slideUp";
+}, {
+    readonly label: "Slide Down";
+    readonly value: "slideDown";
+}, {
+    readonly label: "Scale In";
+    readonly value: "scaleIn";
+}, {
+    readonly label: "None";
+    readonly value: "none";
+}];
+export type DecksAnimationType = (typeof decksAnimationOptions)[number]['value'];
+export type DecksTextPosition = (typeof decksTextPositionOptions)[number]['value'];

package/dist/decks/schema.js

@@ -0,0 +1,75 @@
+export const DECKS_DEFAULTS = {
+    animationType: 'fadeIn',
+    autoPlay: true,
+    backgroundColor: '#000000',
+    durationPerSlide: 3,
+    fps: 30,
+    imageZoom: true,
+    loop: true,
+    showControls: false,
+    textColor: '#ffffff',
+    textPosition: 'center',
+    transitionDuration: 15
+};
+export const decksTextPositionOptions = [
+    {
+        label: 'Top Left',
+        value: 'top-left'
+    },
+    {
+        label: 'Top Center',
+        value: 'top-center'
+    },
+    {
+        label: 'Top Right',
+        value: 'top-right'
+    },
+    {
+        label: 'Center Left',
+        value: 'center-left'
+    },
+    {
+        label: 'Center',
+        value: 'center'
+    },
+    {
+        label: 'Center Right',
+        value: 'center-right'
+    },
+    {
+        label: 'Bottom Left',
+        value: 'bottom-left'
+    },
+    {
+        label: 'Bottom Center',
+        value: 'bottom-center'
+    },
+    {
+        label: 'Bottom Right',
+        value: 'bottom-right'
+    }
+];
+export const decksAnimationOptions = [
+    {
+        label: 'Fade In',
+        value: 'fadeIn'
+    },
+    {
+        label: 'Slide Up',
+        value: 'slideUp'
+    },
+    {
+        label: 'Slide Down',
+        value: 'slideDown'
+    },
+    {
+        label: 'Scale In',
+        value: 'scaleIn'
+    },
+    {
+        label: 'None',
+        value: 'none'
+    }
+];
+
+//# sourceMappingURL=schema.js.map

package/dist/decks/schema.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/decks/schema.ts"],"sourcesContent":["export const DECKS_DEFAULTS = {\n  animationType: 'fadeIn',\n  autoPlay: true,\n  backgroundColor: '#000000',\n  durationPerSlide: 3,\n  fps: 30,\n  imageZoom: true,\n  loop: true,\n  showControls: false,\n  textColor: '#ffffff',\n  textPosition: 'center',\n  transitionDuration: 15,\n} as const\n\nexport const decksTextPositionOptions = [\n  { label: 'Top Left', value: 'top-left' },\n  { label: 'Top Center', value: 'top-center' },\n  { label: 'Top Right', value: 'top-right' },\n  { label: 'Center Left', value: 'center-left' },\n  { label: 'Center', value: 'center' },\n  { label: 'Center Right', value: 'center-right' },\n  { label: 'Bottom Left', value: 'bottom-left' },\n  { label: 'Bottom Center', value: 'bottom-center' },\n  { label: 'Bottom Right', value: 'bottom-right' },\n] as const\n\nexport const decksAnimationOptions = [\n  { label: 'Fade In', value: 'fadeIn' },\n  { label: 'Slide Up', value: 'slideUp' },\n  { label: 'Slide Down', value: 'slideDown' },\n  { label: 'Scale In', value: 'scaleIn' },\n  { label: 'None', value: 'none' },\n] as const\n\nexport type DecksAnimationType =\n  (typeof decksAnimationOptions)[number]['value']\n\nexport type DecksTextPosition =\n  (typeof decksTextPositionOptions)[number]['value']\n"],"names":["DECKS_DEFAULTS","animationType","autoPlay","backgroundColor","durationPerSlide","fps","imageZoom","loop","showControls","textColor","textPosition","transitionDuration","decksTextPositionOptions","label","value","decksAnimationOptions"],"mappings":"AAAA,OAAO,MAAMA,iBAAiB;IAC5BC,eAAe;IACfC,UAAU;IACVC,iBAAiB;IACjBC,kBAAkB;IAClBC,KAAK;IACLC,WAAW;IACXC,MAAM;IACNC,cAAc;IACdC,WAAW;IACXC,cAAc;IACdC,oBAAoB;AACtB,EAAU;AAEV,OAAO,MAAMC,2BAA2B;IACtC;QAAEC,OAAO;QAAYC,OAAO;IAAW;IACvC;QAAED,OAAO;QAAcC,OAAO;IAAa;IAC3C;QAAED,OAAO;QAAaC,OAAO;IAAY;IACzC;QAAED,OAAO;QAAeC,OAAO;IAAc;IAC7C;QAAED,OAAO;QAAUC,OAAO;IAAS;IACnC;QAAED,OAAO;QAAgBC,OAAO;IAAe;IAC/C;QAAED,OAAO;QAAeC,OAAO;IAAc;IAC7C;QAAED,OAAO;QAAiBC,OAAO;IAAgB;IACjD;QAAED,OAAO;QAAgBC,OAAO;IAAe;CAChD,CAAS;AAEV,OAAO,MAAMC,wBAAwB;IACnC;QAAEF,OAAO;QAAWC,OAAO;IAAS;IACpC;QAAED,OAAO;QAAYC,OAAO;IAAU;IACtC;QAAED,OAAO;QAAcC,OAAO;IAAY;IAC1C;QAAED,OAAO;QAAYC,OAAO;IAAU;IACtC;QAAED,OAAO;QAAQC,OAAO;IAAO;CAChC,CAAS"}

package/dist/decks/timeline.d.ts

@@ -0,0 +1,37 @@
+import type { CSSProperties } from 'react';
+export type SlideMetricInput = {
+    frame: number;
+    slideDuration: number;
+    transitionDuration: number;
+};
+export declare const getSlideDurationFrames: ({ durationPerSlide, fps, }: {
+    durationPerSlide: number;
+    fps: number;
+}) => number;
+export declare const getSlideOpacity: ({ frame, slideDuration, transitionDuration, }: SlideMetricInput) => number;
+export declare const getImageScale: ({ frame, imageZoom, slideDuration, }: {
+    frame: number;
+    imageZoom: boolean;
+    slideDuration: number;
+}) => number;
+export declare const getPositionStyles: (position: string) => CSSProperties;
+export declare const getTextAnimationStyles: ({ animationType, frame, transitionDuration, }: {
+    animationType?: string;
+    frame: number;
+    transitionDuration: number;
+}) => CSSProperties;
+export interface SlideStylesInput {
+    animationType?: string;
+    frame: number;
+    imageZoom: boolean;
+    slideDuration: number;
+    textPosition: string;
+    transitionDuration: number;
+}
+export interface SlideStyles {
+    imageScale: number;
+    opacity: number;
+    position: CSSProperties;
+    textAnimation: CSSProperties;
+}
+export declare const getSlideStyles: ({ animationType, frame, imageZoom, slideDuration, textPosition, transitionDuration, }: SlideStylesInput) => SlideStyles;

package/dist/decks/timeline.js

@@ -0,0 +1,205 @@
+import { interpolate } from 'remotion';
+export const getSlideDurationFrames = ({ durationPerSlide, fps })=>{
+    return durationPerSlide * fps;
+};
+export const getSlideOpacity = ({ frame, slideDuration, transitionDuration })=>{
+    return interpolate(frame, [
+        0,
+        transitionDuration,
+        slideDuration - transitionDuration,
+        slideDuration
+    ], [
+        0,
+        1,
+        1,
+        0
+    ], {
+        extrapolateLeft: 'clamp',
+        extrapolateRight: 'clamp'
+    });
+};
+export const getImageScale = ({ frame, imageZoom, slideDuration })=>{
+    if (!imageZoom) {
+        return 1;
+    }
+    return interpolate(frame, [
+        0,
+        slideDuration
+    ], [
+        1,
+        1.1
+    ], {
+        extrapolateLeft: 'clamp',
+        extrapolateRight: 'clamp'
+    });
+};
+export const getPositionStyles = (position)=>{
+    const baseStyles = {
+        maxWidth: '80%',
+        padding: '2rem',
+        position: 'absolute'
+    };
+    switch(position){
+        case 'bottom-center':
+            return {
+                ...baseStyles,
+                bottom: '10%',
+                left: '50%',
+                textAlign: 'center',
+                transform: 'translateX(-50%)'
+            };
+        case 'bottom-left':
+            return {
+                ...baseStyles,
+                bottom: '10%',
+                left: '5%',
+                textAlign: 'left'
+            };
+        case 'bottom-right':
+            return {
+                ...baseStyles,
+                bottom: '10%',
+                right: '5%',
+                textAlign: 'right'
+            };
+        case 'center':
+            return {
+                ...baseStyles,
+                left: '50%',
+                textAlign: 'center',
+                top: '50%',
+                transform: 'translate(-50%, -50%)'
+            };
+        case 'center-left':
+            return {
+                ...baseStyles,
+                left: '5%',
+                textAlign: 'left',
+                top: '50%',
+                transform: 'translateY(-50%)'
+            };
+        case 'center-right':
+            return {
+                ...baseStyles,
+                right: '5%',
+                textAlign: 'right',
+                top: '50%',
+                transform: 'translateY(-50%)'
+            };
+        case 'top-center':
+            return {
+                ...baseStyles,
+                left: '50%',
+                textAlign: 'center',
+                top: '10%',
+                transform: 'translateX(-50%)'
+            };
+        case 'top-left':
+            return {
+                ...baseStyles,
+                left: '5%',
+                textAlign: 'left',
+                top: '10%'
+            };
+        case 'top-right':
+            return {
+                ...baseStyles,
+                right: '5%',
+                textAlign: 'right',
+                top: '10%'
+            };
+        default:
+            return {
+                ...baseStyles,
+                left: '50%',
+                textAlign: 'center',
+                top: '50%',
+                transform: 'translate(-50%, -50%)'
+            };
+    }
+};
+export const getTextAnimationStyles = ({ animationType, frame, transitionDuration })=>{
+    const animationProgress = interpolate(frame, [
+        transitionDuration,
+        transitionDuration + 20
+    ], [
+        0,
+        1
+    ], {
+        extrapolateLeft: 'clamp',
+        extrapolateRight: 'clamp'
+    });
+    switch(animationType){
+        case 'none':
+            return {};
+        case 'scaleIn':
+            {
+                const scaleValue = interpolate(animationProgress, [
+                    0,
+                    1
+                ], [
+                    0.8,
+                    1
+                ]);
+                return {
+                    opacity: animationProgress,
+                    transform: `scale(${scaleValue})`
+                };
+            }
+        case 'slideDown':
+            {
+                const translateYDown = interpolate(animationProgress, [
+                    0,
+                    1
+                ], [
+                    -50,
+                    0
+                ]);
+                return {
+                    opacity: animationProgress,
+                    transform: `translateY(${translateYDown}px)`
+                };
+            }
+        case 'slideUp':
+            {
+                const translateY = interpolate(animationProgress, [
+                    0,
+                    1
+                ], [
+                    50,
+                    0
+                ]);
+                return {
+                    opacity: animationProgress,
+                    transform: `translateY(${translateY}px)`
+                };
+            }
+        case 'fadeIn':
+        default:
+            return {
+                opacity: animationProgress
+            };
+    }
+};
+export const getSlideStyles = ({ animationType, frame, imageZoom, slideDuration, textPosition, transitionDuration })=>{
+    return {
+        imageScale: getImageScale({
+            frame,
+            imageZoom,
+            slideDuration
+        }),
+        opacity: getSlideOpacity({
+            frame,
+            slideDuration,
+            transitionDuration
+        }),
+        position: getPositionStyles(textPosition),
+        textAnimation: getTextAnimationStyles({
+            animationType,
+            frame,
+            transitionDuration
+        })
+    };
+};
+
+//# sourceMappingURL=timeline.js.map

package/dist/decks/timeline.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/decks/timeline.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\n\nimport { interpolate } from 'remotion'\n\nexport type SlideMetricInput = {\n  frame: number\n  slideDuration: number\n  transitionDuration: number\n}\n\nexport const getSlideDurationFrames = ({\n  durationPerSlide,\n  fps,\n}: {\n  durationPerSlide: number\n  fps: number\n}) => {\n  return durationPerSlide * fps\n}\n\nexport const getSlideOpacity = ({\n  frame,\n  slideDuration,\n  transitionDuration,\n}: SlideMetricInput) => {\n  return interpolate(\n    frame,\n    [0, transitionDuration, slideDuration - transitionDuration, slideDuration],\n    [0, 1, 1, 0],\n    {\n      extrapolateLeft: 'clamp',\n      extrapolateRight: 'clamp',\n    },\n  )\n}\n\nexport const getImageScale = ({\n  frame,\n  imageZoom,\n  slideDuration,\n}: {\n  frame: number\n  imageZoom: boolean\n  slideDuration: number\n}) => {\n  if (!imageZoom) {\n    return 1\n  }\n\n  return interpolate(frame, [0, slideDuration], [1, 1.1], {\n    extrapolateLeft: 'clamp',\n    extrapolateRight: 'clamp',\n  })\n}\n\nexport const getPositionStyles = (position: string): CSSProperties => {\n  const baseStyles: CSSProperties = {\n    maxWidth: '80%',\n    padding: '2rem',\n    position: 'absolute',\n  }\n\n  switch (position) {\n    case 'bottom-center':\n      return {\n        ...baseStyles,\n        bottom: '10%',\n        left: '50%',\n        textAlign: 'center',\n        transform: 'translateX(-50%)',\n      }\n    case 'bottom-left':\n      return { ...baseStyles, bottom: '10%', left: '5%', textAlign: 'left' }\n    case 'bottom-right':\n      return { ...baseStyles, bottom: '10%', right: '5%', textAlign: 'right' }\n    case 'center':\n      return {\n        ...baseStyles,\n        left: '50%',\n        textAlign: 'center',\n        top: '50%',\n        transform: 'translate(-50%, -50%)',\n      }\n    case 'center-left':\n      return {\n        ...baseStyles,\n        left: '5%',\n        textAlign: 'left',\n        top: '50%',\n        transform: 'translateY(-50%)',\n      }\n    case 'center-right':\n      return {\n        ...baseStyles,\n        right: '5%',\n        textAlign: 'right',\n        top: '50%',\n        transform: 'translateY(-50%)',\n      }\n    case 'top-center':\n      return {\n        ...baseStyles,\n        left: '50%',\n        textAlign: 'center',\n        top: '10%',\n        transform: 'translateX(-50%)',\n      }\n    case 'top-left':\n      return { ...baseStyles, left: '5%', textAlign: 'left', top: '10%' }\n    case 'top-right':\n      return { ...baseStyles, right: '5%', textAlign: 'right', top: '10%' }\n    default:\n      return {\n        ...baseStyles,\n        left: '50%',\n        textAlign: 'center',\n        top: '50%',\n        transform: 'translate(-50%, -50%)',\n      }\n  }\n}\n\nexport const getTextAnimationStyles = ({\n  animationType,\n  frame,\n  transitionDuration,\n}: {\n  animationType?: string\n  frame: number\n  transitionDuration: number\n}): CSSProperties => {\n  const animationProgress = interpolate(\n    frame,\n    [transitionDuration, transitionDuration + 20],\n    [0, 1],\n    {\n      extrapolateLeft: 'clamp',\n      extrapolateRight: 'clamp',\n    },\n  )\n\n  switch (animationType) {\n    case 'none':\n      return {}\n    case 'scaleIn': {\n      const scaleValue = interpolate(animationProgress, [0, 1], [0.8, 1])\n      return { opacity: animationProgress, transform: `scale(${scaleValue})` }\n    }\n    case 'slideDown': {\n      const translateYDown = interpolate(animationProgress, [0, 1], [-50, 0])\n      return { opacity: animationProgress, transform: `translateY(${translateYDown}px)` }\n    }\n    case 'slideUp': {\n      const translateY = interpolate(animationProgress, [0, 1], [50, 0])\n      return { opacity: animationProgress, transform: `translateY(${translateY}px)` }\n    }\n    case 'fadeIn':\n    default:\n      return { opacity: animationProgress }\n  }\n}\n\nexport interface SlideStylesInput {\n  animationType?: string\n  frame: number\n  imageZoom: boolean\n  slideDuration: number\n  textPosition: string\n  transitionDuration: number\n}\n\nexport interface SlideStyles {\n  imageScale: number\n  opacity: number\n  position: CSSProperties\n  textAnimation: CSSProperties\n}\n\nexport const getSlideStyles = ({\n  animationType,\n  frame,\n  imageZoom,\n  slideDuration,\n  textPosition,\n  transitionDuration,\n}: SlideStylesInput): SlideStyles => {\n  return {\n    imageScale: getImageScale({ frame, imageZoom, slideDuration }),\n    opacity: getSlideOpacity({ frame, slideDuration, transitionDuration }),\n    position: getPositionStyles(textPosition),\n    textAnimation: getTextAnimationStyles({ animationType, frame, transitionDuration }),\n  }\n}\n"],"names":["interpolate","getSlideDurationFrames","durationPerSlide","fps","getSlideOpacity","frame","slideDuration","transitionDuration","extrapolateLeft","extrapolateRight","getImageScale","imageZoom","getPositionStyles","position","baseStyles","maxWidth","padding","bottom","left","textAlign","transform","right","top","getTextAnimationStyles","animationType","animationProgress","scaleValue","opacity","translateYDown","translateY","getSlideStyles","textPosition","imageScale","textAnimation"],"mappings":"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"}

package/dist/decks/timeline.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/decks/timeline.spec.js

@@ -0,0 +1,75 @@
+import { describe, expect, test } from 'vitest';
+import { getImageScale, getPositionStyles, getSlideDurationFrames, getSlideOpacity, getSlideStyles, getTextAnimationStyles } from './timeline.js';
+describe('decks timeline', ()=>{
+    test('calculates frame duration from seconds and fps', ()=>{
+        expect(getSlideDurationFrames({
+            durationPerSlide: 3,
+            fps: 30
+        })).toBe(90);
+    });
+    test('fades slides in and out around the transition frames', ()=>{
+        expect(getSlideOpacity({
+            frame: 0,
+            slideDuration: 90,
+            transitionDuration: 15
+        })).toBe(0);
+        expect(getSlideOpacity({
+            frame: 15,
+            slideDuration: 90,
+            transitionDuration: 15
+        })).toBe(1);
+        expect(getSlideOpacity({
+            frame: 75,
+            slideDuration: 90,
+            transitionDuration: 15
+        })).toBe(1);
+        expect(getSlideOpacity({
+            frame: 90,
+            slideDuration: 90,
+            transitionDuration: 15
+        })).toBe(0);
+    });
+    test('describes image and text layout without rendering Remotion', ()=>{
+        expect(getImageScale({
+            frame: 45,
+            imageZoom: true,
+            slideDuration: 90
+        })).toBeCloseTo(1.05);
+        expect(getImageScale({
+            frame: 45,
+            imageZoom: false,
+            slideDuration: 90
+        })).toBe(1);
+        expect(getPositionStyles('bottom-center')).toMatchObject({
+            bottom: '10%',
+            left: '50%',
+            textAlign: 'center'
+        });
+        expect(getTextAnimationStyles({
+            animationType: 'slideUp',
+            frame: 35,
+            transitionDuration: 15
+        })).toMatchObject({
+            opacity: 1,
+            transform: 'translateY(0px)'
+        });
+    });
+    test('composes all slide styles through a single aggregate call', ()=>{
+        const styles = getSlideStyles({
+            animationType: 'fadeIn',
+            frame: 45,
+            imageZoom: true,
+            slideDuration: 90,
+            textPosition: 'bottom-center',
+            transitionDuration: 15
+        });
+        expect(styles.opacity).toBe(1);
+        expect(styles.imageScale).toBeCloseTo(1.05);
+        expect(styles.position).toMatchObject({
+            bottom: '10%'
+        });
+        expect(styles.textAnimation).toHaveProperty('opacity');
+    });
+});
+
+//# sourceMappingURL=timeline.spec.js.map

package/dist/decks/timeline.spec.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/decks/timeline.spec.ts"],"sourcesContent":["import { describe, expect, test } from 'vitest'\n\nimport {\n  getImageScale,\n  getPositionStyles,\n  getSlideDurationFrames,\n  getSlideOpacity,\n  getSlideStyles,\n  getTextAnimationStyles,\n} from './timeline.js'\n\ndescribe('decks timeline', () => {\n  test('calculates frame duration from seconds and fps', () => {\n    expect(getSlideDurationFrames({ durationPerSlide: 3, fps: 30 })).toBe(90)\n  })\n\n  test('fades slides in and out around the transition frames', () => {\n    expect(getSlideOpacity({ frame: 0, slideDuration: 90, transitionDuration: 15 })).toBe(0)\n    expect(getSlideOpacity({ frame: 15, slideDuration: 90, transitionDuration: 15 })).toBe(1)\n    expect(getSlideOpacity({ frame: 75, slideDuration: 90, transitionDuration: 15 })).toBe(1)\n    expect(getSlideOpacity({ frame: 90, slideDuration: 90, transitionDuration: 15 })).toBe(0)\n  })\n\n  test('describes image and text layout without rendering Remotion', () => {\n    expect(getImageScale({ frame: 45, imageZoom: true, slideDuration: 90 })).toBeCloseTo(1.05)\n    expect(getImageScale({ frame: 45, imageZoom: false, slideDuration: 90 })).toBe(1)\n    expect(getPositionStyles('bottom-center')).toMatchObject({\n      bottom: '10%',\n      left: '50%',\n      textAlign: 'center',\n    })\n    expect(\n      getTextAnimationStyles({\n        animationType: 'slideUp',\n        frame: 35,\n        transitionDuration: 15,\n      }),\n    ).toMatchObject({\n      opacity: 1,\n      transform: 'translateY(0px)',\n    })\n  })\n\n  test('composes all slide styles through a single aggregate call', () => {\n    const styles = getSlideStyles({\n      animationType: 'fadeIn',\n      frame: 45,\n      imageZoom: true,\n      slideDuration: 90,\n      textPosition: 'bottom-center',\n      transitionDuration: 15,\n    })\n\n    expect(styles.opacity).toBe(1)\n    expect(styles.imageScale).toBeCloseTo(1.05)\n    expect(styles.position).toMatchObject({ bottom: '10%' })\n    expect(styles.textAnimation).toHaveProperty('opacity')\n  })\n})\n\n"],"names":["describe","expect","test","getImageScale","getPositionStyles","getSlideDurationFrames","getSlideOpacity","getSlideStyles","getTextAnimationStyles","durationPerSlide","fps","toBe","frame","slideDuration","transitionDuration","imageZoom","toBeCloseTo","toMatchObject","bottom","left","textAlign","animationType","opacity","transform","styles","textPosition","imageScale","position","textAnimation","toHaveProperty"],"mappings":"AAAA,SAASA,QAAQ,EAAEC,MAAM,EAAEC,IAAI,QAAQ,SAAQ;AAE/C,SACEC,aAAa,EACbC,iBAAiB,EACjBC,sBAAsB,EACtBC,eAAe,EACfC,cAAc,EACdC,sBAAsB,QACjB,gBAAe;AAEtBR,SAAS,kBAAkB;IACzBE,KAAK,kDAAkD;QACrDD,OAAOI,uBAAuB;YAAEI,kBAAkB;YAAGC,KAAK;QAAG,IAAIC,IAAI,CAAC;IACxE;IAEAT,KAAK,wDAAwD;QAC3DD,OAAOK,gBAAgB;YAAEM,OAAO;YAAGC,eAAe;YAAIC,oBAAoB;QAAG,IAAIH,IAAI,CAAC;QACtFV,OAAOK,gBAAgB;YAAEM,OAAO;YAAIC,eAAe;YAAIC,oBAAoB;QAAG,IAAIH,IAAI,CAAC;QACvFV,OAAOK,gBAAgB;YAAEM,OAAO;YAAIC,eAAe;YAAIC,oBAAoB;QAAG,IAAIH,IAAI,CAAC;QACvFV,OAAOK,gBAAgB;YAAEM,OAAO;YAAIC,eAAe;YAAIC,oBAAoB;QAAG,IAAIH,IAAI,CAAC;IACzF;IAEAT,KAAK,8DAA8D;QACjED,OAAOE,cAAc;YAAES,OAAO;YAAIG,WAAW;YAAMF,eAAe;QAAG,IAAIG,WAAW,CAAC;QACrFf,OAAOE,cAAc;YAAES,OAAO;YAAIG,WAAW;YAAOF,eAAe;QAAG,IAAIF,IAAI,CAAC;QAC/EV,OAAOG,kBAAkB,kBAAkBa,aAAa,CAAC;YACvDC,QAAQ;YACRC,MAAM;YACNC,WAAW;QACb;QACAnB,OACEO,uBAAuB;YACrBa,eAAe;YACfT,OAAO;YACPE,oBAAoB;QACtB,IACAG,aAAa,CAAC;YACdK,SAAS;YACTC,WAAW;QACb;IACF;IAEArB,KAAK,6DAA6D;QAChE,MAAMsB,SAASjB,eAAe;YAC5Bc,eAAe;YACfT,OAAO;YACPG,WAAW;YACXF,eAAe;YACfY,cAAc;YACdX,oBAAoB;QACtB;QAEAb,OAAOuB,OAAOF,OAAO,EAAEX,IAAI,CAAC;QAC5BV,OAAOuB,OAAOE,UAAU,EAAEV,WAAW,CAAC;QACtCf,OAAOuB,OAAOG,QAAQ,EAAEV,aAAa,CAAC;YAAEC,QAAQ;QAAM;QACtDjB,OAAOuB,OAAOI,aAAa,EAAEC,cAAc,CAAC;IAC9C;AACF"}

package/dist/exports/client.d.ts

@@ -0,0 +1 @@
+export { DecksBlock } from '../components/decks/DecksBlock.js';

package/dist/exports/client.js

@@ -0,0 +1,3 @@
+export { DecksBlock } from '../components/decks/DecksBlock.js';
+
+//# sourceMappingURL=client.js.map

package/dist/exports/client.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/exports/client.ts"],"sourcesContent":["export { DecksBlock } from '../components/decks/DecksBlock.js'\n"],"names":["DecksBlock"],"mappings":"AAAA,SAASA,UAAU,QAAQ,oCAAmC"}

package/dist/index.d.ts

@@ -0,0 +1,7 @@
+import type { Config } from 'payload';
+import { type PayloadDecksConfig } from './decks/install.js';
+export { DecksBlock } from './blocks/decks/config.js';
+export type { PayloadDecksConfig } from './decks/install.js';
+export type { DecksBlockProps, DecksSlide, } from './decks/model.js';
+export { normalizeDecksBlock } from './decks/model.js';
+export declare const payloadDecks: (pluginOptions?: PayloadDecksConfig) => (config: Config) => Config;

package/dist/index.js

@@ -0,0 +1,9 @@
+import { installDecksField } from './decks/install.js';
+export { DecksBlock } from './blocks/decks/config.js';
+export { normalizeDecksBlock } from './decks/model.js';
+export const payloadDecks = (pluginOptions = {})=>(config)=>{
+        installDecksField(config, pluginOptions);
+        return config;
+    };
+
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["import type { Config } from 'payload'\n\nimport { installDecksField, type PayloadDecksConfig } from './decks/install.js'\n\nexport { DecksBlock } from './blocks/decks/config.js'\nexport type { PayloadDecksConfig } from './decks/install.js'\nexport type {\n  DecksBlockProps,\n  DecksSlide,\n} from './decks/model.js'\nexport { normalizeDecksBlock } from './decks/model.js'\n\nexport const payloadDecks =\n  (pluginOptions: PayloadDecksConfig = {}) =>\n  (config: Config): Config => {\n    installDecksField(config, pluginOptions)\n\n    return config\n  }\n"],"names":["installDecksField","DecksBlock","normalizeDecksBlock","payloadDecks","pluginOptions","config"],"mappings":"AAEA,SAASA,iBAAiB,QAAiC,qBAAoB;AAE/E,SAASC,UAAU,QAAQ,2BAA0B;AAMrD,SAASC,mBAAmB,QAAQ,mBAAkB;AAEtD,OAAO,MAAMC,eACX,CAACC,gBAAoC,CAAC,CAAC,GACvC,CAACC;QACCL,kBAAkBK,QAAQD;QAE1B,OAAOC;IACT,EAAC"}

package/package.json

@@ -0,0 +1,135 @@
+{
+  "name": "payload-plugin-decks",
+  "version": "1.0.0",
+  "description": "Deck blocks and renderers for Payload CMS",
+  "license": "MIT",
+  "author": "Krzysztof Radomski",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/krzysztofradomski/payload-plugin-decks.git"
+  },
+  "bugs": {
+    "url": "https://github.com/krzysztofradomski/payload-plugin-decks/issues"
+  },
+  "homepage": "https://github.com/krzysztofradomski/payload-plugin-decks#readme",
+  "keywords": [
+    "payload",
+    "payloadcms",
+    "payload-plugin",
+    "cms",
+    "headless-cms",
+    "slideshow",
+    "decks",
+    "payload-plugin-decks"
+  ],
+  "type": "module",
+  "exports": {
+    ".": {
+      "import": "./src/index.ts",
+      "types": "./src/index.ts",
+      "default": "./src/index.ts"
+    },
+    "./client": {
+      "import": "./src/exports/client.ts",
+      "types": "./src/exports/client.ts",
+      "default": "./src/exports/client.ts"
+    }
+  },
+  "main": "./src/index.ts",
+  "types": "./src/index.ts",
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "build": "pnpm copyfiles && pnpm build:types && pnpm build:swc",
+    "build:swc": "swc ./src -d ./dist --config-file .swcrc --strip-leading-paths",
+    "build:types": "tsc --outDir dist --rootDir ./src",
+    "clean": "rimraf {dist,*.tsbuildinfo}",
+    "copyfiles": "copyfiles -u 1 \"src/**/*.{html,css,scss,ttf,woff,woff2,eot,svg,jpg,png,json}\" dist/",
+    "dev": "next dev dev --turbo",
+    "dev:generate-importmap": "pnpm dev:payload generate:importmap",
+    "dev:generate-types": "pnpm dev:payload generate:types",
+    "dev:payload": "cross-env PAYLOAD_CONFIG_PATH=./dev/payload.config.ts payload",
+    "generate:importmap": "pnpm dev:generate-importmap",
+    "generate:types": "pnpm dev:generate-types",
+    "lint": "eslint",
+    "lint:fix": "eslint ./src --fix",
+    "test": "pnpm test:int && pnpm test:e2e",
+    "test:e2e": "playwright test",
+    "test:int": "vitest",
+    "typecheck": "tsc --noEmit"
+  },
+  "devDependencies": {
+    "@eslint/eslintrc": "^3.2.0",
+    "@payloadcms/db-mongodb": "3.84.0",
+    "@payloadcms/db-postgres": "3.84.0",
+    "@payloadcms/db-sqlite": "3.84.0",
+    "@payloadcms/eslint-config": "3.28.0",
+    "@payloadcms/next": "3.84.0",
+    "@payloadcms/richtext-lexical": "3.84.0",
+    "@payloadcms/ui": "3.84.0",
+    "@playwright/test": "1.58.2",
+    "@remotion/player": "4.0.447",
+    "@swc-node/register": "1.10.9",
+    "@swc/cli": "0.6.0",
+    "@types/node": "22.19.9",
+    "@types/react": "19.2.14",
+    "@types/react-dom": "19.2.3",
+    "copyfiles": "2.4.1",
+    "cross-env": "^7.0.3",
+    "eslint": "^9.23.0",
+    "eslint-config-next": "16.2.3",
+    "graphql": "^16.8.1",
+    "mongodb-memory-server": "10.1.4",
+    "next": "16.2.3",
+    "open": "^10.1.0",
+    "payload": "3.84.0",
+    "prettier": "^3.4.2",
+    "qs-esm": "8.0.1",
+    "react": "19.2.4",
+    "react-dom": "19.2.4",
+    "remotion": "4.0.447",
+    "rimraf": "3.0.2",
+    "sharp": "0.34.2",
+    "sort-package-json": "^2.10.0",
+    "typescript": "5.7.3",
+    "vite-tsconfig-paths": "6.0.5",
+    "vitest": "4.0.18"
+  },
+  "peerDependencies": {
+    "@remotion/player": "^4.0.0",
+    "payload": "^3.84.0",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "remotion": "^4.0.0"
+  },
+  "engines": {
+    "node": "^18.20.2 || >=20.9.0",
+    "pnpm": "^9 || ^10"
+  },
+  "publishConfig": {
+    "exports": {
+      ".": {
+        "import": "./dist/index.js",
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.js"
+      },
+      "./client": {
+        "import": "./dist/exports/client.js",
+        "types": "./dist/exports/client.d.ts",
+        "default": "./dist/exports/client.js"
+      }
+    },
+    "main": "./dist/index.js",
+    "types": "./dist/index.d.ts"
+  },
+  "pnpm": {
+    "onlyBuiltDependencies": [
+      "sharp",
+      "esbuild",
+      "unrs-resolver"
+    ]
+  },
+  "registry": "https://registry.npmjs.org/",
+  "packageManager": "pnpm@10.33.0+sha512.10568bb4a6afb58c9eb3630da90cc9516417abebd3fabbe6739f0ae795728da1491e9db5a544c76ad8eb7570f5c4bb3d6c637b2cb41bfdcdb47fa823c8649319"
+}