@r2digisolutions/components 0.1.7 → 0.3.0

package/dist/types/xyflow-svelte.d.ts

@@ -0,0 +1,62 @@
+/**
+ * Ambient helpers for @xyflow/svelte component re-exports.
+ * NodeNext resolution does not always surface `.svelte` default re-exports from the package entry.
+ */
+declare module '@xyflow/svelte' {
+	import type { Component } from 'svelte';
+
+	export const SvelteFlow: Component<Record<string, unknown>>;
+	export const Background: Component<Record<string, unknown>>;
+	export const Controls: Component<Record<string, unknown>>;
+	export const MiniMap: Component<Record<string, unknown>>;
+	export const Handle: Component<Record<string, unknown>>;
+	export const Panel: Component<Record<string, unknown>>;
+
+	export enum BackgroundVariant {
+		Lines = 'lines',
+		Dots = 'dots',
+		Cross = 'cross'
+	}
+
+	export enum Position {
+		Left = 'left',
+		Top = 'top',
+		Right = 'right',
+		Bottom = 'bottom'
+	}
+
+	export enum MarkerType {
+		Arrow = 'arrow',
+		ArrowClosed = 'arrowclosed'
+	}
+
+	export type Connection = {
+		source: string;
+		target: string;
+		sourceHandle: string | null;
+		targetHandle: string | null;
+	};
+
+	export type Edge = Connection & {
+		id?: string;
+		[key: string]: unknown;
+	};
+
+	export type NodeProps = {
+		id: string;
+		data: Record<string, unknown>;
+		selected?: boolean;
+		type?: string;
+		[key: string]: unknown;
+	};
+
+	// Custom nodes have typed props; xyflow accepts them at runtime.
+	// eslint-disable-next-line @typescript-eslint/no-explicit-any
+	export type NodeTypes = Record<string, Component<any>>;
+
+	export function useSvelteFlow(): {
+		fitView: (opts?: { padding?: number; duration?: number }) => Promise<boolean> | boolean | void;
+		screenToFlowPosition: (pos: { x: number; y: number }) => { x: number; y: number };
+		[key: string]: unknown;
+	};
+}

package/dist/utils/audioProject.d.ts

@@ -0,0 +1,19 @@
+import { type MediaAsset, type MediaTrack } from './mediaTracks.js';
+export interface MixerChannelState {
+    trackId: string;
+    volume: number;
+    pan: number;
+    muted: boolean;
+    solo: boolean;
+}
+export interface AudioProject {
+    version: 1;
+    sampleRate: number;
+    bpm?: number;
+    durationMs: number;
+    tracks: MediaTrack[];
+    assets: MediaAsset[];
+    mixer: MixerChannelState[];
+}
+export declare function emptyAudioProject(partial?: Partial<Omit<AudioProject, 'version'>>): AudioProject;
+export declare function createDemoAudioProject(): AudioProject;

package/dist/utils/audioProject.js

@@ -0,0 +1,70 @@
+import { createMediaTrack, uid } from './mediaTracks.js';
+export function emptyAudioProject(partial) {
+    const tracks = partial?.tracks ??
+        [
+            createMediaTrack({ name: 'Track 1', kind: 'audio', color: '#3b82f6' }),
+            createMediaTrack({ name: 'Track 2', kind: 'audio', color: '#10b981' })
+        ];
+    return {
+        version: 1,
+        sampleRate: partial?.sampleRate ?? 44100,
+        bpm: partial?.bpm ?? 120,
+        durationMs: partial?.durationMs ?? 60_000,
+        tracks,
+        assets: partial?.assets ?? [],
+        mixer: partial?.mixer ??
+            tracks.map((t) => ({
+                trackId: t.id,
+                volume: 0.8,
+                pan: 0,
+                muted: false,
+                solo: false
+            }))
+    };
+}
+export function createDemoAudioProject() {
+    const project = emptyAudioProject({ durationMs: 45_000 });
+    const [t1, t2] = project.tracks;
+    return {
+        ...project,
+        tracks: [
+            {
+                ...t1,
+                clips: [
+                    {
+                        id: uid('clip'),
+                        trackId: t1.id,
+                        name: 'Drums',
+                        kind: 'audio',
+                        startMs: 0,
+                        endMs: 16000,
+                        color: t1.color
+                    },
+                    {
+                        id: uid('clip'),
+                        trackId: t1.id,
+                        name: 'Drums 2',
+                        kind: 'audio',
+                        startMs: 16000,
+                        endMs: 32000,
+                        color: t1.color
+                    }
+                ]
+            },
+            {
+                ...t2,
+                clips: [
+                    {
+                        id: uid('clip'),
+                        trackId: t2.id,
+                        name: 'Bass',
+                        kind: 'audio',
+                        startMs: 2000,
+                        endMs: 30000,
+                        color: t2.color
+                    }
+                ]
+            }
+        ]
+    };
+}

package/dist/utils/blogDocument.d.ts

@@ -0,0 +1,175 @@
+/**
+ * Blog document model: parse/serialize + optional component registry.
+ */
+import type { Component } from 'svelte';
+export type BlogBlockType = 'heading' | 'paragraph' | 'image' | 'code' | 'callout' | 'quote' | 'list' | 'divider' | 'markdown' | 'video' | 'embed' | 'gallery' | 'table' | 'cta' | 'spacer' | 'html' | 'component';
+export type BlogHeadingLevel = 1 | 2 | 3 | 4;
+export type BlogAlign = 'left' | 'center' | 'right';
+export type BlogWidth = 'full' | 'wide' | 'content' | 'narrow';
+export type BlogCalloutTone = 'info' | 'success' | 'warning' | 'danger' | 'neutral';
+export interface BlogHeadingData {
+    level: BlogHeadingLevel;
+    text: string;
+    align?: BlogAlign;
+    anchor?: string;
+}
+export interface BlogParagraphData {
+    text: string;
+    align?: BlogAlign;
+    lead?: boolean;
+    muted?: boolean;
+}
+export interface BlogImageData {
+    src: string;
+    alt?: string;
+    caption?: string;
+    href?: string;
+    align?: BlogAlign;
+    width?: BlogWidth;
+    rounded?: boolean;
+    shadow?: boolean;
+}
+export interface BlogCodeData {
+    code: string;
+    language?: string;
+    filename?: string;
+    showLineNumbers?: boolean;
+    highlightLines?: string;
+}
+export interface BlogCalloutData {
+    tone?: BlogCalloutTone;
+    title?: string;
+    text: string;
+    collapsible?: boolean;
+}
+export interface BlogQuoteData {
+    text: string;
+    cite?: string;
+    role?: string;
+    align?: BlogAlign;
+}
+export interface BlogListData {
+    ordered?: boolean;
+    items: string[];
+    tight?: boolean;
+    start?: number;
+}
+export interface BlogMarkdownData {
+    source: string;
+}
+export interface BlogDividerData {
+    style?: 'solid' | 'dashed' | 'dotted';
+    label?: string;
+    spacing?: 'sm' | 'md' | 'lg';
+}
+export interface BlogVideoData {
+    src: string;
+    poster?: string;
+    caption?: string;
+    controls?: boolean;
+    autoplay?: boolean;
+    loop?: boolean;
+    muted?: boolean;
+    align?: BlogAlign;
+    width?: BlogWidth;
+}
+export interface BlogEmbedData {
+    url: string;
+    title?: string;
+    aspectRatio?: '16:9' | '4:3' | '1:1' | '9:16';
+    height?: number;
+    caption?: string;
+}
+export interface BlogGalleryImage {
+    src: string;
+    alt?: string;
+    caption?: string;
+}
+export interface BlogGalleryData {
+    images: BlogGalleryImage[];
+    columns?: 2 | 3 | 4;
+    gap?: 'sm' | 'md' | 'lg';
+    rounded?: boolean;
+}
+export interface BlogTableData {
+    headers: string[];
+    rows: string[][];
+    striped?: boolean;
+    compact?: boolean;
+    caption?: string;
+}
+export interface BlogCtaData {
+    label: string;
+    href?: string;
+    variant?: 'primary' | 'secondary' | 'ghost' | 'outline';
+    align?: BlogAlign;
+    subtitle?: string;
+    openInNewTab?: boolean;
+}
+export interface BlogSpacerData {
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+}
+export interface BlogHtmlData {
+    html: string;
+}
+export interface BlogComponentPropField {
+    key: string;
+    label: string;
+    type: 'string' | 'number' | 'boolean' | 'select' | 'textarea' | 'color';
+    options?: {
+        value: string;
+        label: string;
+    }[];
+    placeholder?: string;
+    description?: string;
+}
+export interface BlogComponentData {
+    componentId: string;
+    props?: Record<string, unknown>;
+}
+export type BlogBlockData = BlogHeadingData | BlogParagraphData | BlogImageData | BlogCodeData | BlogCalloutData | BlogQuoteData | BlogListData | BlogMarkdownData | BlogDividerData | BlogVideoData | BlogEmbedData | BlogGalleryData | BlogTableData | BlogCtaData | BlogSpacerData | BlogHtmlData | BlogComponentData | Record<string, never>;
+export interface BlogBlock {
+    id: string;
+    type: BlogBlockType;
+    data: BlogBlockData;
+}
+export interface BlogDocument {
+    version: 1;
+    title?: string;
+    description?: string;
+    coverImage?: string;
+    author?: string;
+    tags?: string[];
+    publishedAt?: string;
+    blocks: BlogBlock[];
+}
+export interface BlogComponentRegistration {
+    label: string;
+    component: Component<any>;
+    defaultProps?: Record<string, unknown>;
+    description?: string;
+    /** Optional schema so BlogEditor can show typed prop fields. */
+    propFields?: BlogComponentPropField[];
+}
+export declare function emptyBlogDocument(title?: string): BlogDocument;
+export declare function defaultDataForType(type: BlogBlockType): BlogBlockData;
+export declare function createBlock(type: BlogBlockType, data?: Partial<BlogBlockData>): BlogBlock;
+export declare function createComponentBlock(componentId: string, props?: Record<string, unknown>): BlogBlock;
+export declare function serializeBlogDocument(doc: BlogDocument): string;
+export declare function parseBlogDocument(raw: string | BlogDocument): BlogDocument;
+export declare function registerBlogComponent(id: string, registration: BlogComponentRegistration): void;
+export declare function unregisterBlogComponent(id: string): void;
+export declare function getBlogComponent(id: string): BlogComponentRegistration | undefined;
+export declare function listBlogComponents(): {
+    id: string;
+    registration: BlogComponentRegistration;
+}[];
+export declare function clearBlogComponentRegistry(): void;
+export declare function blogWidthClass(width?: BlogWidth): string;
+export declare function blogAlignClass(align?: BlogAlign): string;
+export declare function blogAspectPadding(ratio?: BlogEmbedData['aspectRatio']): string;
+export declare const NATIVE_BLOCK_TYPES: {
+    type: Exclude<BlogBlockType, 'component'>;
+    label: string;
+    group: string;
+}[];

package/dist/utils/blogDocument.js

@@ -0,0 +1,220 @@
+/**
+ * Blog document model: parse/serialize + optional component registry.
+ */
+const registry = new Map();
+function uid(prefix = 'b') {
+    return `${prefix}-${Date.now().toString(36)}-${Math.random().toString(36).slice(2, 7)}`;
+}
+export function emptyBlogDocument(title = '') {
+    return { version: 1, title, blocks: [] };
+}
+export function defaultDataForType(type) {
+    switch (type) {
+        case 'heading':
+            return { level: 2, text: 'Heading', align: 'left' };
+        case 'paragraph':
+            return { text: '', align: 'left', lead: false, muted: false };
+        case 'image':
+            return {
+                src: '',
+                alt: '',
+                caption: '',
+                align: 'center',
+                width: 'content',
+                rounded: true,
+                shadow: false
+            };
+        case 'code':
+            return {
+                code: '',
+                language: 'typescript',
+                filename: '',
+                showLineNumbers: false,
+                highlightLines: ''
+            };
+        case 'callout':
+            return { tone: 'info', title: '', text: '', collapsible: false };
+        case 'quote':
+            return { text: '', cite: '', role: '', align: 'left' };
+        case 'list':
+            return { ordered: false, items: [''], tight: false, start: 1 };
+        case 'divider':
+            return { style: 'solid', label: '', spacing: 'md' };
+        case 'markdown':
+            return { source: '' };
+        case 'video':
+            return {
+                src: '',
+                poster: '',
+                caption: '',
+                controls: true,
+                autoplay: false,
+                loop: false,
+                muted: false,
+                align: 'center',
+                width: 'content'
+            };
+        case 'embed':
+            return { url: '', title: '', aspectRatio: '16:9', caption: '' };
+        case 'gallery':
+            return {
+                images: [{ src: '', alt: '' }],
+                columns: 3,
+                gap: 'md',
+                rounded: true
+            };
+        case 'table':
+            return {
+                headers: ['Column A', 'Column B'],
+                rows: [
+                    ['', ''],
+                    ['', '']
+                ],
+                striped: true,
+                compact: false,
+                caption: ''
+            };
+        case 'cta':
+            return {
+                label: 'Get started',
+                href: '#',
+                variant: 'primary',
+                align: 'center',
+                subtitle: '',
+                openInNewTab: false
+            };
+        case 'spacer':
+            return { size: 'md' };
+        case 'html':
+            return { html: '' };
+        case 'component':
+            return { componentId: '', props: {} };
+        default:
+            return {};
+    }
+}
+export function createBlock(type, data) {
+    return {
+        id: uid(),
+        type,
+        data: { ...defaultDataForType(type), ...data }
+    };
+}
+export function createComponentBlock(componentId, props) {
+    const reg = registry.get(componentId);
+    return createBlock('component', {
+        componentId,
+        props: { ...(reg?.defaultProps ?? {}), ...(props ?? {}) }
+    });
+}
+export function serializeBlogDocument(doc) {
+    return JSON.stringify(doc, null, 2);
+}
+export function parseBlogDocument(raw) {
+    if (typeof raw !== 'string') {
+        return normalizeDocument(raw);
+    }
+    try {
+        const parsed = JSON.parse(raw);
+        return normalizeDocument(parsed);
+    }
+    catch {
+        return emptyBlogDocument();
+    }
+}
+function normalizeDocument(input) {
+    if (!input || typeof input !== 'object')
+        return emptyBlogDocument();
+    const obj = input;
+    const blocks = Array.isArray(obj.blocks)
+        ? obj.blocks
+            .filter((b) => !!b && typeof b === 'object' && 'type' in b && 'id' in b)
+            .map((b) => ({
+            id: String(b.id),
+            type: b.type,
+            data: {
+                ...defaultDataForType(b.type),
+                ...(b.data ?? {})
+            }
+        }))
+        : [];
+    const tags = Array.isArray(obj.tags)
+        ? obj.tags.filter((t) => typeof t === 'string')
+        : undefined;
+    return {
+        version: 1,
+        title: typeof obj.title === 'string' ? obj.title : '',
+        description: typeof obj.description === 'string' ? obj.description : undefined,
+        coverImage: typeof obj.coverImage === 'string' ? obj.coverImage : undefined,
+        author: typeof obj.author === 'string' ? obj.author : undefined,
+        tags,
+        publishedAt: typeof obj.publishedAt === 'string' ? obj.publishedAt : undefined,
+        blocks
+    };
+}
+export function registerBlogComponent(id, registration) {
+    registry.set(id, registration);
+}
+export function unregisterBlogComponent(id) {
+    registry.delete(id);
+}
+export function getBlogComponent(id) {
+    return registry.get(id);
+}
+export function listBlogComponents() {
+    return [...registry.entries()].map(([id, registration]) => ({ id, registration }));
+}
+export function clearBlogComponentRegistry() {
+    registry.clear();
+}
+export function blogWidthClass(width) {
+    switch (width) {
+        case 'full':
+            return 'w-full max-w-none';
+        case 'wide':
+            return 'w-full max-w-4xl mx-auto';
+        case 'narrow':
+            return 'w-full max-w-md mx-auto';
+        case 'content':
+        default:
+            return 'w-full max-w-3xl mx-auto';
+    }
+}
+export function blogAlignClass(align) {
+    if (align === 'center')
+        return 'text-center mx-auto';
+    if (align === 'right')
+        return 'text-right ml-auto';
+    return 'text-left';
+}
+export function blogAspectPadding(ratio) {
+    switch (ratio) {
+        case '4:3':
+            return '75%';
+        case '1:1':
+            return '100%';
+        case '9:16':
+            return '177.78%';
+        case '16:9':
+        default:
+            return '56.25%';
+    }
+}
+export const NATIVE_BLOCK_TYPES = [
+    { type: 'heading', label: 'Heading', group: 'Text' },
+    { type: 'paragraph', label: 'Paragraph', group: 'Text' },
+    { type: 'quote', label: 'Quote', group: 'Text' },
+    { type: 'list', label: 'List', group: 'Text' },
+    { type: 'markdown', label: 'Markdown', group: 'Text' },
+    { type: 'callout', label: 'Callout', group: 'Text' },
+    { type: 'code', label: 'Code', group: 'Media' },
+    { type: 'image', label: 'Image', group: 'Media' },
+    { type: 'video', label: 'Video', group: 'Media' },
+    { type: 'gallery', label: 'Gallery', group: 'Media' },
+    { type: 'embed', label: 'Embed', group: 'Media' },
+    { type: 'table', label: 'Table', group: 'Layout' },
+    { type: 'cta', label: 'Button / CTA', group: 'Layout' },
+    { type: 'divider', label: 'Divider', group: 'Layout' },
+    { type: 'spacer', label: 'Spacer', group: 'Layout' },
+    { type: 'html', label: 'HTML', group: 'Advanced' }
+];

package/dist/utils/blueprintRuntime.d.ts

@@ -0,0 +1,34 @@
+/**
+ * Lightweight Blueprint graph simulator — follows exec wires, resolves data pins
+ * (literals + pure nodes), and emits Print String lines. Not a full UE VM.
+ */
+import { type BlueprintDocument, type BlueprintVariable } from './nodeGraph.js';
+export type BlueprintLogLevel = 'system' | 'print' | 'warn' | 'error';
+export interface BlueprintLogEntry {
+    id: string;
+    level: BlueprintLogLevel;
+    text: string;
+    nodeId?: string;
+    at: number;
+}
+export interface SimulateBlueprintOptions {
+    /** Entry node type (default: event_begin). */
+    entryType?: string;
+    signal?: AbortSignal;
+    onLog?: (entry: BlueprintLogEntry) => void;
+    /** Multiplier for Delay durations (1 = real seconds). */
+    timeScale?: number;
+    /** Cap Delay wait in ms (default 10_000). */
+    maxDelayMs?: number;
+}
+export interface SimulateBlueprintResult {
+    logs: BlueprintLogEntry[];
+    /** Final variable values after Sets. */
+    variables: BlueprintVariable[];
+    aborted: boolean;
+}
+/**
+ * Run the graph from Event BeginPlay (or `entryType`).
+ * Print String lines use level `print`; flow uses `system`.
+ */
+export declare function simulateBlueprint(doc: BlueprintDocument, opts?: SimulateBlueprintOptions): Promise<SimulateBlueprintResult>;