unframer 0.6.0

package/dist/react.js

@@ -0,0 +1,157 @@
+'use client';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { combinedCSSRules } from '../framer-fixed/dist/framer.js';
+import { useSyncExternalStore, } from 'react';
+function getFonts(component) {
+    const fonts = component.fonts;
+    return fonts || [];
+}
+function classNames(...args) {
+    return args.filter(Boolean).join(' ');
+}
+const defaultBreakpoints = ['Desktop', 'Tablet', 'Mobile'];
+let defaultMap = Object.fromEntries(defaultBreakpoints.map((x) => [x, x]));
+function getClassMap(breakpoints) {
+    const classMap = {
+        Desktop: '',
+        Tablet: '',
+        Mobile: '',
+    };
+    if (breakpoints.length === 1) {
+        classMap[breakpoints[0]] = 'FramerDesktop FramerTablet FramerMobile';
+    }
+    else if (breakpoints.length === 2) {
+        if (breakpoints.includes('Desktop')) {
+            classMap.Desktop = 'Desktop';
+            classMap[breakpoints.find((b) => b !== 'Desktop')] =
+                'FramerTablet FramerMobile';
+        }
+        else if (breakpoints.includes('Tablet')) {
+            classMap.Tablet = 'Tablet';
+            classMap[breakpoints.find((b) => b !== 'Tablet')] =
+                'FramerDesktop FramerMobile';
+        }
+        else {
+            classMap.Mobile = 'Mobile';
+            classMap[breakpoints.find((b) => b !== 'Mobile')] =
+                'FramerDesktop FramerTablet';
+        }
+    }
+    else if (breakpoints.length === 3) {
+        classMap.Desktop = 'FramerDesktop';
+        classMap.Tablet = 'FramerTablet';
+        classMap.Mobile = 'FramerMobile';
+    }
+    return classMap;
+}
+function deduplicateByKey(arr, key) {
+    let map = new Map();
+    for (let item of arr) {
+        let value = item[key(item)];
+        if (map.has(value)) {
+            continue;
+        }
+        map.set(value, item);
+    }
+    return Array.from(map.values());
+}
+export function getFontsStyles(Components) {
+    const allFonts = deduplicateByKey(Components.map(getFonts).flat(), (x) => x.url).filter((x) => x.url);
+    // console.log(JSON.stringify(fonts, null, 2))
+    let str = allFonts
+        .map((x) => {
+        let str = `@font-face { font-family: '${x.family}'; src: url(${x.url});`;
+        if (x.style) {
+            str += ` font-style: ${x.style};`;
+        }
+        if (x.weight) {
+            str += ` font-weight: ${x.weight};`;
+        }
+        str += ` }`;
+        return str;
+    })
+        .join('\n');
+    return str;
+}
+const breakpointSizes = {
+    Desktop: 1024,
+    Tablet: 768,
+    Mobile: 0,
+};
+function getBreakpointNameFromWindowWidth(windowWidth) {
+    return defaultBreakpoints.find((name) => windowWidth >= breakpointSizes[name]);
+}
+const breakpointsStyles = `
+
+.FramerTablet,
+.FramerMobile,
+.FramerDesktop {
+    display: none;
+}
+
+@media (min-width: ${breakpointSizes.Desktop}px) {
+    .FramerDesktop {
+        display: contents;
+    }
+}
+
+@media (min-width: ${breakpointSizes.Tablet}px) and (max-width: ${breakpointSizes.Desktop}px) {
+    .FramerTablet {
+        display: contents;
+    }
+}
+
+@media (max-width: ${breakpointSizes.Tablet}px) {
+    .FramerMobile {
+        display: contents;
+    }
+}
+
+.contents {
+    display: contents;
+}
+
+`;
+export function FramerStyles({ Components = [] }) {
+    return (_jsxs(_Fragment, { children: [_jsx("style", { dangerouslySetInnerHTML: { __html: getFontsStyles(Components) }, suppressHydrationWarning: true, hidden: true }), _jsx("style", { dangerouslySetInnerHTML: {
+                    __html: combinedCSSRules.join('\n'),
+                }, suppressHydrationWarning: true, hidden: true }), _jsx("style", { dangerouslySetInnerHTML: { __html: breakpointsStyles }, suppressHydrationWarning: true, hidden: true })] }));
+}
+export function WithFramerBreakpoints({ Component, variants: breakpointsMap = defaultMap, ...rest }) {
+    const controls = Component['propertyControls'];
+    const variantControls = controls?.['variant'];
+    if (!variantControls) {
+        // @ts-expect-error
+        return _jsx(Component, { variant: undefined, ...rest });
+    }
+    const options = variantControls?.optionTitles;
+    const currentBreakpoint = useSyncExternalStore(onResize, () => {
+        // console.log('window.innerWidth', window.innerWidth)
+        const breakpoint = getBreakpointNameFromWindowWidth(window.innerWidth);
+        return breakpoint;
+    }, () => {
+        // on server
+        return '';
+    });
+    // console.log('currentBreakpoint', currentBreakpoint)
+    let parts = [];
+    for (let breakpointName of defaultBreakpoints) {
+        if (currentBreakpoint && currentBreakpoint !== breakpointName) {
+            continue;
+        }
+        let realVariant = breakpointsMap[breakpointName];
+        if (!realVariant) {
+            continue;
+        }
+        let mapped = defaultBreakpoints.filter((x) => breakpointsMap[x]);
+        let map = getClassMap(mapped)[breakpointName];
+        let className = classNames('', map);
+        parts.push(_jsx("div", { className: className, children: _jsx(Component, { ...rest, variant: realVariant }) }, breakpointName));
+    }
+    return parts;
+}
+const onResize = (callback) => {
+    window.addEventListener('resize', callback);
+    return () => window.removeEventListener('resize', callback);
+};
+//# sourceMappingURL=react.js.map

package/dist/react.js.map

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