@reframejs/unframer 4.2.0-reframe.0

package/dist/index.d.ts

@@ -0,0 +1,10 @@
+export * from './framer.js';
+import { AdaptedLink as Link, ResolveLinksAdapted as ResolveLinks } from './react.js';
+export { FramerStyles, type UnframerBreakpoint, WithFramerBreakpoints, ContextProviders, AdaptedLink, UnframerProvider, } from './react.js';
+export { Link, ResolveLinks };
+export { propCamelCaseJustLikeFramer } from './compat.js';
+export { propControlsToTypedocComments, componentCamelCase, } from './typescript.js';
+import { withCSS as withCSSOriginal } from './framer.js';
+import { withCSS } from './css.js';
+export { withCSSOriginal, withCSS };
+//# sourceMappingURL=index.d.ts.map

package/dist/index.js

@@ -0,0 +1,13 @@
+export * from './framer.js';
+import { AdaptedLink as Link, ResolveLinksAdapted as ResolveLinks, } from './react.js';
+export { FramerStyles, WithFramerBreakpoints, ContextProviders, AdaptedLink, UnframerProvider,
+// withCSS,
+ } from './react.js';
+export { Link, ResolveLinks };
+export { propCamelCaseJustLikeFramer } from './compat.js';
+export { propControlsToTypedocComments, componentCamelCase, } from './typescript.js';
+// Override withCSS with our custom implementation that restores style tags
+import { withCSS as withCSSOriginal } from './framer.js';
+import { withCSS } from './css.js';
+export { withCSSOriginal, withCSS };
+//# sourceMappingURL=index.js.map

package/dist/package-manager.d.ts

@@ -0,0 +1,10 @@
+export declare function getPackageManager(targetDir?: string): Promise<"bun" | "deno" | "npm" | "pnpm" | "yarn">;
+export declare function installPackagesBatch({ packageNames, cwd, isDev }: {
+    packageNames: string[];
+    cwd: string;
+    isDev?: boolean;
+}): Promise<{
+    success: boolean;
+    error?: string;
+}>;
+//# sourceMappingURL=package-manager.d.ts.map

package/dist/package-manager.js

@@ -0,0 +1,138 @@
+import { exec, spawn } from 'child_process';
+import { promisify } from 'util';
+import { spinner } from './utils.js';
+const execAsync = promisify(exec);
+export async function getPackageManager(targetDir) {
+    const { detect } = await import('@antfu/ni');
+    const packageManager = await detect({ programmatic: true, cwd: targetDir });
+    if (packageManager === 'yarn@berry') {
+        return 'yarn';
+    }
+    else if (packageManager === 'pnpm@6' || packageManager === 'pnpm') {
+        return 'pnpm';
+    }
+    else if (packageManager === 'bun') {
+        return 'bun';
+    }
+    else if (packageManager === 'deno') {
+        return 'deno';
+    }
+    else if (packageManager === 'npm' || packageManager === 'yarn') {
+        return packageManager;
+    }
+    const userAgent = process.env.npm_config_user_agent || '';
+    if (userAgent.startsWith('yarn')) {
+        return 'yarn';
+    }
+    if (userAgent.startsWith('pnpm')) {
+        return 'pnpm';
+    }
+    if (userAgent.startsWith('bun')) {
+        return 'bun';
+    }
+    return 'npm';
+}
+export async function installPackagesBatch({ packageNames, cwd, isDev = false, }) {
+    // Framer sometimes has links that point to !missing for some reason. bug in Framer
+    packageNames = packageNames.filter((x) => x !== '!missing');
+    if (packageNames.length === 0) {
+        return { success: true };
+    }
+    try {
+        const packageManager = await getPackageManager(cwd);
+        const devFlag = isDev
+            ? packageManager === 'npm'
+                ? '--save-dev'
+                : '-D'
+            : '';
+        const packagesStr = packageNames.join(' ');
+        spinner.info(`Installing packages with ${packageManager}: ${packagesStr}`);
+        spinner.start(`Installing packages: ${packagesStr}`);
+        return new Promise((resolve) => {
+            let command;
+            let args;
+            switch (packageManager) {
+                case 'npm':
+                    command = 'npm';
+                    args = ['install', ...packageNames];
+                    if (devFlag)
+                        args.push(devFlag);
+                    break;
+                case 'yarn':
+                    command = 'yarn';
+                    args = ['add', ...packageNames];
+                    if (devFlag)
+                        args.push(devFlag);
+                    break;
+                case 'pnpm':
+                    command = 'pnpm';
+                    args = ['add', ...packageNames];
+                    if (devFlag)
+                        args.push(devFlag);
+                    break;
+                case 'bun':
+                    command = 'bun';
+                    args = ['add', ...packageNames];
+                    if (devFlag)
+                        args.push(devFlag);
+                    break;
+                default:
+                    command = 'npm';
+                    args = ['install', ...packageNames];
+                    if (devFlag)
+                        args.push(devFlag);
+            }
+            const child = spawn(command, args, {
+                cwd,
+                stdio: ['ignore', 'pipe', 'pipe'],
+            });
+            let hasOutput = false;
+            child.stdout?.on('data', (data) => {
+                hasOutput = true;
+                const lines = data
+                    .toString()
+                    .split('\n')
+                    .filter((line) => line.trim());
+                lines.forEach((line) => {
+                    if (line.trim()) {
+                        spinner.update(`Installing: ${line.trim()}`);
+                    }
+                });
+            });
+            child.stderr?.on('data', (data) => {
+                hasOutput = true;
+                const lines = data
+                    .toString()
+                    .split('\n')
+                    .filter((line) => line.trim());
+                lines.forEach((line) => {
+                    if (line.trim()) {
+                        spinner.update(`Installing: ${line.trim()}`);
+                    }
+                });
+            });
+            child.on('close', (code) => {
+                if (code === 0) {
+                    spinner.info(`Successfully installed packages`);
+                    resolve({ success: true });
+                }
+                else {
+                    const errorMessage = `Installation failed with exit code ${code}`;
+                    spinner.error(`Failed to install packages: ${errorMessage}`);
+                    resolve({ success: false, error: errorMessage });
+                }
+            });
+            child.on('error', (error) => {
+                const errorMessage = error.message || 'Unknown error';
+                spinner.error(`Failed to install packages: ${errorMessage}`);
+                resolve({ success: false, error: errorMessage });
+            });
+        });
+    }
+    catch (error) {
+        const errorMessage = error.message || 'Unknown error';
+        spinner.error(`Failed to install packages: ${errorMessage}`);
+        return { success: false, error: errorMessage };
+    }
+}
+//# sourceMappingURL=package-manager.js.map

package/dist/plugin-mcp-dist/lib/client-websocket.d.ts

@@ -0,0 +1,5 @@
+export declare function websocketClientHandling({ handle, websocketId }: {
+    handle: any;
+    websocketId: any;
+}): Promise<(() => void) | undefined>;
+//# sourceMappingURL=client-websocket.d.ts.map

package/dist/plugin-mcp-dist/lib/client-websocket.js

@@ -0,0 +1,103 @@
+import { useStore } from "./store.js";
+// Function for handling websocket connection based on session cookie
+export async function websocketClientHandling({ handle, websocketId, }) {
+    if (typeof window === 'undefined')
+        return;
+    const websocketUrl = `wss://unframer.co/_tunnel/upstream?id=${websocketId}`;
+    let ws;
+    let pingInterval = null;
+    let reconnectInterval = 1000;
+    let shouldReconnect = true;
+    function connect() {
+        console.log('connecting over mcp websocketId', websocketId);
+        ws = new WebSocket(websocketUrl);
+        ws.onopen = () => {
+            console.log('websocket client connected', websocketId);
+            reconnectInterval = 1000; // reset backoff
+            ws.send(JSON.stringify({ type: 'ready' }));
+            // Setup ping interval
+            if (pingInterval)
+                clearInterval(pingInterval);
+            pingInterval = setInterval(() => {
+                if (ws.readyState === WebSocket.OPEN) {
+                    ws.send(JSON.stringify({ type: 'ping' }));
+                }
+            }, 1000);
+        };
+        ws.onmessage = async (event) => {
+            let data;
+            try {
+                data = JSON.parse(event.data);
+            }
+            catch {
+                console.error(`websocket sent invalid json`, event.data);
+                return;
+            }
+            const { id, payload } = data || {};
+            if (!payload?.type) {
+                console.error(`websocket sent invalid data`, event.data);
+                return;
+            }
+            if (payload.type === 'ready') {
+                ws.send(JSON.stringify({ type: 'ready' }));
+                useStore.setState({ isConnected: true });
+                return;
+            }
+            if (payload.type === 'close') {
+                useStore.setState({ isConnected: false });
+                return;
+            }
+            console.log(`websocket message received`, payload);
+            try {
+                const output = await handle(payload);
+                console.log(`websocket message handled`, payload.type, output);
+                if (ws.readyState === WebSocket.OPEN) {
+                    ws.send(JSON.stringify({
+                        id,
+                        payload: {
+                            input: payload.input,
+                            type: payload.type,
+                            output,
+                        },
+                    }));
+                }
+            }
+            catch (e) {
+                console.error(`websocket error`, e);
+                if (ws.readyState === WebSocket.OPEN) {
+                    ws.send(JSON.stringify({
+                        id,
+                        error: e instanceof Error ? e.message : String(e),
+                    }));
+                }
+            }
+        };
+        ws.onerror = (error) => {
+            console.error('websocket error', error);
+        };
+        ws.onclose = (event) => {
+            console.log(`websocket client disconnected (${event.code}), reconnecting in ${reconnectInterval}ms`);
+            useStore.setState({ isConnected: false });
+            if (pingInterval) {
+                clearInterval(pingInterval);
+                pingInterval = null;
+            }
+            if (shouldReconnect) {
+                setTimeout(connect, reconnectInterval);
+                // exponential backoff (max 30s)
+                reconnectInterval = Math.min(30000, reconnectInterval * 1.5);
+            }
+        };
+    }
+    // Start the connection
+    connect();
+    // Return a cleanup function to close connection
+    return () => {
+        shouldReconnect = false;
+        if (pingInterval)
+            clearInterval(pingInterval);
+        ws.close();
+    };
+}
+//# sourceMappingURL=client-websocket.js.map
+//# sourceMappingURL=client-websocket.js.map

package/dist/plugin-mcp-dist/lib/cms.d.ts

@@ -0,0 +1,10 @@
+export declare function mapValueToFieldValue(value: any, field: any): {
+    type: any;
+    value: any;
+    contentType?: undefined;
+} | {
+    type: string;
+    value: string;
+    contentType: string;
+} | null;
+//# sourceMappingURL=cms.d.ts.map

package/dist/plugin-mcp-dist/lib/cms.js

@@ -0,0 +1,58 @@
+export function mapValueToFieldValue(value, field) {
+    if (!field?.type) {
+        return null;
+    }
+    if (value == null) {
+        return {
+            type: field.type,
+            value,
+        };
+    }
+    if (field.type === 'string') {
+        return { type: 'string', value: String(value) || '' };
+    }
+    if (field.type === 'number') {
+        return { type: 'number', value: Number(value) ?? null };
+    }
+    if (field.type === 'boolean') {
+        return { type: 'boolean', value: Boolean(value) };
+    }
+    if (field.type === 'date') {
+        try {
+            if (!value)
+                return null;
+            const date = new Date(value);
+            return { type: 'date', value: date.toISOString() };
+        }
+        catch (e) {
+            return null;
+        }
+    }
+    if (field.type === 'enum') {
+        return { type: 'enum', value: String(value) || '' };
+    }
+    if (field.type === 'formattedText') {
+        const valueString = String(value) || '';
+        const looksLikeHtml = valueString.trim().startsWith('<');
+        return {
+            type: 'formattedText',
+            value: valueString,
+            contentType: looksLikeHtml ? 'html' : 'markdown',
+        };
+    }
+    if (field.type === 'color') {
+        return { type: 'color', value: String(value) || '' };
+    }
+    if (field.type === 'link') {
+        return { type: 'link', value: String(value) || '' };
+    }
+    if (field.type === 'image') {
+        return { type: 'image', value: String(value) || '' };
+    }
+    return {
+        type: field.type,
+        value,
+    };
+}
+//# sourceMappingURL=cms.js.map
+//# sourceMappingURL=cms.js.map

package/dist/plugin-mcp-dist/lib/errors.d.ts

@@ -0,0 +1,5 @@
+export declare function notifyError(error: any, msg: any): void;
+export declare class KnownError extends Error {
+    constructor(message: any);
+}
+//# sourceMappingURL=errors.d.ts.map

package/dist/plugin-mcp-dist/lib/errors.js

@@ -0,0 +1,48 @@
+import { framer } from '#framer-client';
+import { init, captureException } from 'sentries';
+init({
+    dsn: 'https://d6ad60582fec2961afffe60e5a189844@o4508014272446464.ingest.de.sentry.io/4508014275985488',
+    integrations: [],
+    // Performance Monitoring
+    tracesSampleRate: 0.01, //  Capture 100% of the transactions
+    // Set sampling rate for profiling - this is relative to tracesSampleRate
+    profilesSampleRate: 0.01,
+    beforeSend(event, hint) {
+        // do not send in development
+        if (process.env.NODE_ENV === 'development') {
+            return null;
+        }
+        if (event?.['name'] === 'AbortError') {
+            return null;
+        }
+        if (hint?.originalException instanceof KnownError) {
+            return null;
+        }
+        return event;
+    },
+});
+export function notifyError(error, msg) {
+    if (error instanceof Error && error.name === 'AbortError') {
+        return;
+    }
+    if (error instanceof Error &&
+        error.message === 'BodyStreamBuffer was aborted') {
+        return;
+    }
+    console.error(error?.error || error);
+    captureException(error?.error || error, { extra: { msg } });
+    // Only call framer.notify in plugin context (browser), not in server runtime (Cloudflare Worker)
+    // Check if we're in a browser environment where framer.notify is available
+    if (typeof window !== 'undefined') {
+        framer.notify(String(error.message || error), { variant: 'error' });
+    }
+}
+export class KnownError extends Error {
+    constructor(message) {
+        super(message);
+        this.name = 'KnownError';
+        Object.setPrototypeOf(this, KnownError.prototype);
+    }
+}
+//# sourceMappingURL=errors.js.map
+//# sourceMappingURL=errors.js.map

package/dist/plugin-mcp-dist/lib/framer-client.d.ts

@@ -0,0 +1,2 @@
+export * from 'framer-plugin';
+//# sourceMappingURL=framer-client.d.ts.map

package/dist/plugin-mcp-dist/lib/framer-client.js

@@ -0,0 +1,4 @@
+// Browser shim: re-exports from framer-plugin (used when running inside Framer)
+export * from 'framer-plugin';
+//# sourceMappingURL=framer-client.js.map
+//# sourceMappingURL=framer-client.js.map

package/dist/plugin-mcp-dist/lib/framer-client.server.d.ts

@@ -0,0 +1,3 @@
+export * from 'framer-api';
+export declare const framer: {};
+//# sourceMappingURL=framer-client.server.d.ts.map

package/dist/plugin-mcp-dist/lib/framer-client.server.js

@@ -0,0 +1,46 @@
+export * from 'framer-api';
+const allowAllPermissions = () => {
+    return true;
+};
+const noOpNotify = async (message, options) => {
+    console.warn('[framer-api server shim notify]', message, options);
+};
+const emptySelection = async () => {
+    return [];
+};
+const noOpZoomIntoView = async () => {
+    return;
+};
+function getRuntimeFramer() {
+    const globalWithFramer = globalThis;
+    if (!globalWithFramer.framer) {
+        throw new Error('Server runtime framer client is not initialized. Connect first and assign globalThis.framer.');
+    }
+    return globalWithFramer.framer;
+}
+export const framer = new Proxy({}, {
+    get(_target, property, receiver) {
+        const runtimeFramer = getRuntimeFramer();
+        const value = Reflect.get(runtimeFramer, property, receiver);
+        if (value === undefined) {
+            if (property === 'isAllowedTo') {
+                return allowAllPermissions;
+            }
+            if (property === 'notify') {
+                return noOpNotify;
+            }
+            if (property === 'getSelection') {
+                return emptySelection;
+            }
+            if (property === 'zoomIntoView') {
+                return noOpZoomIntoView;
+            }
+        }
+        if (typeof value === 'function') {
+            return value.bind(runtimeFramer);
+        }
+        return value;
+    },
+});
+//# sourceMappingURL=framer-client.server.js.map
+//# sourceMappingURL=framer-client.server.js.map

package/dist/plugin-mcp-dist/lib/framer.d.ts

@@ -0,0 +1,30 @@
+export declare function clearUploadedImagesCache(): void;
+export declare function replaceEnumIdsForControls(controls: any, propControls: any): any;
+export declare function getComponentPropertyControls(url: any): Promise<any>;
+export declare var ControlType: any;
+export declare function getAttributeComments(controls: any, availablePagePaths?: string[]): {};
+export declare function getInstanceComponentId(componentInstance: any): string | undefined;
+export declare function isNodeZoomable(node: any): Promise<boolean>;
+export declare function getFramerTree({ rootNodes, recursive }: {
+    recursive?: boolean | undefined;
+    rootNodes: any;
+}): Promise<any[]>;
+export declare function discardFramerChanges({ previousTree: previousTree }: {
+    previousTree: any;
+}): Promise<void[]>;
+export declare const ATTRIBUTE_DEFAULTS: {
+    opacity: number;
+    visible: boolean;
+    locked: boolean;
+    rotation: number;
+    position: string;
+    gap: string;
+    padding: string;
+    stackWrap: boolean;
+    gridFillWidth: boolean;
+    gridFillHeight: boolean;
+};
+export declare function serializeAttributesForXml(attributes: any): {};
+export declare function applyAttributes(node: any, _attributes: any): Promise<void>;
+export declare function getParentNodesArray(node: any): Promise<any[]>;
+//# sourceMappingURL=framer.d.ts.map