unframer 2.8.0 → 2.9.1

package/esm/index.d.ts

@@ -1,3 +1,3 @@
 export * from './framer.js';
-export { FramerStyles, UnframerBreakpoint, WithFramerBreakpoints, } from './react.js';
+export { FramerStyles, UnframerBreakpoint, WithFramerBreakpoints, ContextProviders, } from './react.js';
 //# sourceMappingURL=index.d.ts.map

package/esm/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA;AAG3B,OAAO,EACH,YAAY,EACZ,kBAAkB,EAClB,qBAAqB,GACxB,MAAM,YAAY,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA;AAE3B,OAAO,EACH,YAAY,EACZ,kBAAkB,EAClB,qBAAqB,EACrB,gBAAgB,GACnB,MAAM,YAAY,CAAA"}

package/esm/index.js

@@ -1,3 +1,3 @@
 export * from './framer.js';
-export { FramerStyles, WithFramerBreakpoints, } from './react.js';
+export { FramerStyles, WithFramerBreakpoints, ContextProviders, } from './react.js';
 //# sourceMappingURL=index.js.map

package/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA;AAG3B,OAAO,EACH,YAAY,EAEZ,qBAAqB,GACxB,MAAM,YAAY,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA;AAE3B,OAAO,EACH,YAAY,EAEZ,qBAAqB,EACrB,gBAAgB,GACnB,MAAM,YAAY,CAAA"}

package/esm/react.d.ts

@@ -17,4 +17,14 @@ export declare const WithFramerBreakpoints: import("react").ForwardRefExoticComp
     variant?: any;
     className?: string;
 }, "variant"> & import("react").RefAttributes<unknown>>;
+export declare function ContextProviders({ locale, children, framerSiteId, routes, routeId, pathVariables, collectionUtils, locales, }: {
+    locale: any;
+    children: any;
+    framerSiteId: any;
+    routes: any;
+    routeId: any;
+    pathVariables: any;
+    collectionUtils: any;
+    locales: any;
+}): import("react/jsx-runtime.js").JSX.Element;
 //# sourceMappingURL=react.d.ts.map

package/esm/react.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"react.d.ts","sourceRoot":"","sources":["../src/react.tsx"],"names":[],"mappings":"AAGA,OAAO,EAEH,aAAa,EAKhB,MAAM,OAAO,CAAA;AACd,OAAO,EAEH,sBAAsB,EAEzB,MAAM,UAAU,CAAA;AAWjB,MAAM,MAAM,kBAAkB,GAAG,MAAM,OAAO,sBAAsB,CAAA;AA8BpE;;GAEG;AACH,wBAAgB,YAAY,CAAC,EAAE,UAAwB,EAAE;;CAAA,GAAG,GAAG,CAmD9D;AAED,eAAO,MAAM,qBAAqB;;kBACM,GAAG;oBAAc,MAAM;;;;cAAvB,GAAG;gBAAc,MAAM;uDA2E7D,CAAA"}
+{"version":3,"file":"react.d.ts","sourceRoot":"","sources":["../src/react.tsx"],"names":[],"mappings":"AAGA,OAAO,EAEH,aAAa,EAKhB,MAAM,OAAO,CAAA;AACd,OAAO,EAEH,sBAAsB,EAEzB,MAAM,UAAU,CAAA;AAWjB,MAAM,MAAM,kBAAkB,GAAG,MAAM,OAAO,sBAAsB,CAAA;AA8BpE;;GAEG;AACH,wBAAgB,YAAY,CAAC,EAAE,UAAwB,EAAE;;CAAA,GAAG,GAAG,CAmD9D;AAED,eAAO,MAAM,qBAAqB;;kBACM,GAAG;oBAAc,MAAM;;;;cAAvB,GAAG;gBAAc,MAAM;uDAuF7D,CAAA;AAiCF,wBAAgB,gBAAgB,CAAC,EAC7B,MAAM,EACN,QAAQ,EACR,YAAY,EACZ,MAAM,EACN,OAAO,EACP,aAAa,EACb,eAAe,EACf,OAAO,GACV;;;;;;;;;CAAA,8CAuBA"}

package/esm/react.js

@@ -12,7 +12,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { combinedCSSRules } from './framer.js';
-import { forwardRef, useId, useMemo, useSyncExternalStore, } from 'react';
+import { forwardRef, useId, useSyncExternalStore, } from 'react';
 import { breakpointsStyles, defaultBreakpointSizes, getFontsStyles, } from './css.js';
 function classNames(...args) {
     return args.filter(Boolean).join(' ');
@@ -73,31 +73,67 @@ export const WithFramerBreakpoints = forwardRef(function WithFramerBreakpoints(_
         // on server and during hydration
         return '';
     });
-    const parts = useMemo(() => {
-        var _a;
-        const allBreakpoints = fillBreakpoints(_breakpointsMap);
-        const variants = {};
-        for (let breakpointName of Object.keys(allBreakpoints)) {
-            const realVariant = allBreakpoints[breakpointName];
-            if (!realVariant) {
-                continue;
-            }
-            if (currentBreakpoint && currentBreakpoint !== breakpointName) {
-                continue;
-            }
-            let className = classNames(((_a = variants[realVariant]) === null || _a === void 0 ? void 0 : _a.className) || 'unframer-hidden', `unframer-${breakpointName}`);
-            variants[realVariant] = { className, variant: realVariant };
+    const allBreakpoints = fillBreakpoints(_breakpointsMap);
+    const variants = new Map();
+    for (let breakpointName of Object.keys(allBreakpoints)) {
+        const realVariant = allBreakpoints[breakpointName];
+        if (!realVariant) {
+            continue;
         }
-        return Object.values(variants).map(({ className, variant }) => {
-            return (_jsx("div", { className: className, children: _jsx(Component, Object.assign({ ref: ref, 
-                    // LayoutGroup is used internally
-                    layoutId: id + variant }, rest, { variant: variant }), variant) }, variant));
-        });
-    }, [currentBreakpoint, rest, _breakpointsMap]);
+        const existingVariant = variants.get(realVariant);
+        if (existingVariant) {
+            existingVariant.breakpoints.push(breakpointName);
+            existingVariant.className = classNames(existingVariant.className, `unframer-${breakpointName}`);
+        }
+        else {
+            variants.set(realVariant, {
+                className: classNames('unframer-hidden', `unframer-${breakpointName}`),
+                variant: realVariant,
+                breakpoints: [breakpointName],
+            });
+        }
+    }
+    const parts = [...variants.values()].map(({ className, breakpoints, variant }) => {
+        const shouldShow = !currentBreakpoint || breakpoints.includes(currentBreakpoint);
+        if (!shouldShow) {
+            return null;
+        }
+        return (_jsx("div", { className: className, children: _jsx(Component, Object.assign({ ref: ref, 
+                // LayoutGroup is used internally
+                layoutId: id + variant }, rest, { variant: variant }), variant) }, variant));
+    });
     return parts;
 });
 const onResize = (callback) => {
     window.addEventListener('resize', callback);
     return () => window.removeEventListener('resize', callback);
 };
+const onResizeWithDebounce = (callback) => {
+    let timeoutId;
+    const debouncedCallback = () => {
+        clearTimeout(timeoutId);
+        timeoutId = setTimeout(() => {
+            callback();
+        }, 16);
+    };
+    window.addEventListener('resize', debouncedCallback);
+    return () => {
+        clearTimeout(timeoutId);
+        window.removeEventListener('resize', debouncedCallback);
+    };
+};
+import { 
+// @ts-ignore
+CustomCursorHost, 
+// @ts-ignore
+FetchClientProvider, 
+// @ts-ignore
+FormContext, 
+// @ts-ignore
+Router, } from './framer.js';
+export function ContextProviders({ locale, children, framerSiteId, routes, routeId, pathVariables, collectionUtils, locales, }) {
+    var _a;
+    const localeId = (_a = locales === null || locales === void 0 ? void 0 : locales.find((l) => l.slug === locale || l.code === locale || l.id === locale)) === null || _a === void 0 ? void 0 : _a.id;
+    return (_jsx(FetchClientProvider, { children: _jsx(CustomCursorHost, { children: _jsx(FormContext.Provider, { value: framerSiteId, children: _jsx(Router, { initialRoute: routeId, initialPathVariables: pathVariables, initialLocaleId: localeId, enableImproveInpDuringHydration: true, routes: routes, collectionUtils: collectionUtils, locales: locales, children: children }) }) }) }));
+}
 //# sourceMappingURL=react.js.map

package/esm/react.js.map

@@ -1 +1 @@
-{"version":3,"file":"react.js","sourceRoot":"","sources":["../src/react.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"react.js","sourceRoot":"","sources":["../src/react.tsx"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "unframer",
-  "version": "2.8.0",
+  "version": "2.9.1",
   "description": "Import Framer components directly in your React app, type safe and customizable",
   "sideEffects": false,
   "repository": "https://github.com/remorses/unframer",
@@ -72,7 +72,7 @@
     "@types/babel__traverse": "^7.20.6",
     "@types/bun": "^1.1.6",
     "@types/fs-extra": "^11.0.4",
-    "@types/node": "^22.7.4",
+    "@types/node": "^22.10.2",
     "@types/react": "^18.3.12",
     "@xmorse/deployment-utils": "^0.2.19",
     "concurrently": "^8.2.2",
@@ -84,9 +84,9 @@
     "typescript": "^5.6.2"
   },
   "scripts": {
-    "build": "rm -rf dist && concurrently 'pnpm tsc -m esnext --outDir esm' 'pnpm tsc' && echo copying && cp ../README.md ./README.md && cp ./src/framer.d.ts ./dist/framer.d.ts && cp ./src/framer.d.ts ./esm/framer.d.ts",
+    "build": "rm -rf dist && pnpm concurrently 'pnpm tsc -m esnext --outDir esm' 'pnpm tsc' && echo copying && cp ../README.md ./README.md && cp ./src/framer.d.ts ./dist/framer.d.ts && cp ./src/framer.d.ts ./esm/framer.d.ts",
     "test": "vitest",
     "download-framer": "tsx scripts/download.ts",
-    "watch": "rm -rf dist esm && concurrently 'pnpm tsc -w' 'pnpm tsc -m esnext -w --outDir esm'"
+    "watch": "rm -rf dist esm && pnpm concurrently 'pnpm tsc -w' 'pnpm tsc -m esnext -w --outDir esm'"
   }
 }

package/src/cli.tsx

@@ -44,6 +44,8 @@ cli.command('[projectId]', 'Run unframer with optional project ID')
                     outDir,
                     projectId: data?.project?.id,
                     projectName,
+                    fullFramerProjectId: data?.project?.fullFramerProjectId,
+                    locales: data?.locales,
                     components: Object.fromEntries(
                         data.components.map((c) => [
                             componentNameToPath(c.name),
@@ -85,7 +87,7 @@ cli.command('[projectId]', 'Run unframer with optional project ID')
             config,
             watch: false,
             signal: controller.signal,
-            cwd: path.resolve(process.cwd(), outDir || 'framer'),
+            cwd: path.resolve(process.cwd(), config.outDir || 'framer'),
         })
     })
 
@@ -161,8 +163,19 @@ export type Config = {
         [name: string]: string
     }
     projectId?: string
+    fullFramerProjectId?: string
     projectName?: string
-    framerWebPages?: { webPageId: string; path: string }[]
+    framerWebPages?: {
+        webPageId: string
+        components?: string[]
+        path: string
+    }[]
+    locales?: {
+        code: string
+        id: string
+        name: string
+        slug: string
+    }[]
     breakpoints?: BreakpointSizes
     tokens?: StyleToken[]
     outDir?: string

package/src/exporter.ts

@@ -124,16 +124,62 @@ export async function bundle({
                             const url = components[name]
 
                             return {
-                                contents: /** js */ `'use client'
+                                contents: /** js **/ `
+                                'use client'
+                                import { Fragment } from 'react'
+                                import { ContextProviders } from 'unframer'
                                 import Component from '${await resolveRedirect({
                                     url,
                                     signal,
                                 })}'
                                 import { WithFramerBreakpoints } from 'unframer'
-                                Component.Responsive = (props) => {
-                                    return <WithFramerBreakpoints Component={Component} {...props} />
+                                const locales = ${
+                                    JSON.stringify(config.locales) || '[]'
                                 }
-                                export default Component
+
+                                Component.Responsive = ({ locale, ...props }) => {
+                                    return (
+                                        <ContextProviders
+                                            routeId="x"
+                                            routes={{
+                                                x: {
+                                                    elements: {},
+                                                    page: <WithFramerBreakpoints
+                                                        Component={Component}
+                                                        {...props}
+                                                    />,
+                                                    path: '/',
+                                                },
+                                            }}
+                                            framerSiteId={${JSON.stringify(
+                                                config.fullFramerProjectId,
+                                            )}}
+                                            locale={locale}
+                                            locales={locales}
+                                        />
+                                    )
+                                }
+
+                                export default function ComponentWithRoot({ locale, ...rest }) {
+                                    return (
+                                        <ContextProviders
+                                            routeId="x"
+                                            routes={{
+                                                x: {
+                                                    elements: {},
+                                                    page: <Component {...rest} />,
+                                                    path: '/',
+                                                },
+                                            }}
+                                            framerSiteId={${JSON.stringify(
+                                                config.fullFramerProjectId,
+                                            )}}
+                                            locale={locale}
+                                            locales={locales}
+                                        />
+                                    )
+                                }
+                                Object.assign(ComponentWithRoot, Component)
                                 `,
                                 loader: 'jsx',
                             }
@@ -250,7 +296,11 @@ export async function bundle({
                             fileName: path.basename(file.path),
                         })),
                     )
-                    const types = propControlsToType(propertyControls!, name)
+                    const types = propControlsToType({
+                        controls: propertyControls!,
+                        fileName: name,
+                        config,
+                    })
                     // name = 'framer-' + name
                     // logger.log('name', name)
                     fs.mkdirSync(out, { recursive: true })
@@ -528,7 +578,7 @@ export function getDarkModeSelector(opts: {
             '}'
         )
     }
-    return '.dark:root {\n' + content + '\n' + '}'
+    return '.dark {\n' + content + '\n' + '}'
 }
 
 export function getStyleTokensCss(
@@ -796,7 +846,15 @@ function safeJsonParse(text) {
     }
 }
 
-export function propControlsToType(controls: PropertyControls, fileName) {
+export function propControlsToType({
+    config,
+    fileName,
+    controls,
+}: {
+    controls: PropertyControls
+    fileName
+    config
+}) {
     try {
         const types = Object.entries(controls || ({} as PropertyControls))
             .map(([key, value]) => {
@@ -865,6 +923,7 @@ export function propControlsToType(controls: PropertyControls, fileName) {
         const defaultPropsTypes =
             [
                 'children?: React.ReactNode',
+                'locale?: Locale',
                 'style?: React.CSSProperties',
                 'className?: string',
                 'id?: string',
@@ -876,8 +935,14 @@ export function propControlsToType(controls: PropertyControls, fileName) {
                 .join('\n') + '\n'
         let t = ''
         t += '/* This file was generated by Unframer, do not edit manually */\n'
+
         t += 'import * as React from "react"\n\n'
         t += 'import { UnframerBreakpoint } from "unframer"\n\n'
+        t += `type Locale = ${
+            config.locales?.length
+                ? config.locales.map((l) => `'${l.code}'`).join(' | ')
+                : 'string'
+        }\n`
         t += `export interface Props {\n${defaultPropsTypes}${types}\n}\n\n`
         t += `const ${componentName} = (props: Props) => any\n\n`
         t += `type VariantsMap = Partial<Record<UnframerBreakpoint, Props['variant']>> & { base: Props['variant'] }\n\n`