From b9ea4c8444b59a5030d0e411d407a3722746508d Mon Sep 17 00:00:00 2001 From: remorses Date: Mon, 27 Jan 2025 14:09:46 +0100 Subject: [PATCH] nextjs shit does not work for some reason, never use it --- nextjs-app/src/app/page.tsx | 55 ++++++-------- .../src/framer-simplicity/section-hero.js | 6 +- pnpm-lock.yaml | 70 ++++++++---------- remix-app/app/routes/_index.tsx | 66 +---------------- remix-app/app/routes/legacy.tsx | 73 +++++++++++++++++++ remix-app/tailwind.config.ts | 5 +- unframer/src/framer.js | 2 +- unframer/src/react.tsx | 8 +- 8 files changed, 142 insertions(+), 143 deletions(-) create mode 100644 remix-app/app/routes/legacy.tsx diff --git a/nextjs-app/src/app/page.tsx b/nextjs-app/src/app/page.tsx index a5127296..4a1ec50d 100644 --- a/nextjs-app/src/app/page.tsx +++ b/nextjs-app/src/app/page.tsx @@ -1,48 +1,39 @@ 'use client' -import '@/framer/styles.css' - -import Card from '@/framer/card' -import Collection from '@/framer/collection' -import Footer from '@/framer/footer' -import Form from '@/framer/form' -import Nav from '@/framer/framerNav' -import GrowthSpaceMenu from '@/framer/GrowthSpaceMenu' -import Hero from '@/framer/hero' -import InputFramerComponent from '@/framer/input' -import MenuOverlay from '@/framer/menu-overlay' -import Menus from '@/framer/menus' -import Test from '@/framer/testimonials' +import '@/framer-simplicity/styles.css' +import { SSRParentVariantsContext } from 'unframer' +import SectionCallToActionFramerComponent from '@/framer-simplicity/section-call-to-action' +import SectionFeaturesFramerComponent from '@/framer-simplicity/section-features' +import SectionFooterFramerComponent from '@/framer-simplicity/section-footer' +import SectionFrequentlyAskedQuestionsFramerComponent from '@/framer-simplicity/section-frequently-asked-questions' import SectionHeroFramerComponent from '@/framer-simplicity/section-hero' -import SectionLogosFramerComponent from '@/framer-simplicity/section-logos' import SectionHowItWorksFramerComponent from '@/framer-simplicity/section-how-it-works' import SectionLargeTestimonialFramerComponent from '@/framer-simplicity/section-large-testimonial' -import SectionFeaturesFramerComponent from '@/framer-simplicity/section-features' +import SectionLogosFramerComponent from '@/framer-simplicity/section-logos' import SectionPricingFramerComponent from '@/framer-simplicity/section-pricing' -import SectionFrequentlyAskedQuestionsFramerComponent from '@/framer-simplicity/section-frequently-asked-questions' -import SectionCallToActionFramerComponent from '@/framer-simplicity/section-call-to-action' -import SectionFooterFramerComponent from '@/framer-simplicity/section-footer' import SectionTestimonialsFramerComponent from '@/framer-simplicity/section-testimonials' +import NavigationFramerComponent from '@/framer-simplicity/navigation/navigation' export default function Page() { return } -function Home() { +export function Home() { return ( -
-
- - - - - - - - - - -
+
+ + + + + + + + + + + + +
) } diff --git a/nextjs-app/src/framer-simplicity/section-hero.js b/nextjs-app/src/framer-simplicity/section-hero.js index cca1d6ee..0cb0662c 100644 --- a/nextjs-app/src/framer-simplicity/section-hero.js +++ b/nextjs-app/src/framer-simplicity/section-hero.js @@ -205,7 +205,7 @@ var className2 = 'framer-a3inn'; // /:https://framerusercontent.com/modules/AMs1BHWFE26iLmA4bGBY/MEgFpTddklVVfqQ1ss5q/aKlzorVQO.js var ElementsBadgeFonts = getFonts(stdin_default,); -var MotionDivWithFXWithOptimizedAppearEffect = withOptimizedAppearEffect(withFX(motion.div,),); +var MotionDivWithFXWithOptimizedAppearEffect = withOptimizedAppearEffect(withFX(motion.div,)); var ButtonsButtonFonts = getFonts(stdin_default2,); var cycleOrder = ['L_pX4uUkR', 'Gbz9maQw1', 'K1iE6Mz7N',]; var serializationHash = 'framer-VjguY'; @@ -351,7 +351,7 @@ var Component = /* @__PURE__ */ React.forwardRef(function (props, ref,) { ), children: /* @__PURE__ */ _jsx(MotionDivWithFXWithOptimizedAppearEffect, { __perspectiveFX: false, - __smartComponentFX: true, + // __smartComponentFX: true, __targetOpacity: 1, animate: animation, className: 'framer-pz5jso-container', @@ -359,7 +359,7 @@ var Component = /* @__PURE__ */ React.forwardRef(function (props, ref,) { initial: animation1, layoutDependency, layoutId: 'EBGIPu010-container', - optimized: true, + // optimized: true, children: /* @__PURE__ */ _jsx(stdin_default, { D_QyhowU2: 'Export Framer Components to React', height: '100%', diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 72c28ad0..c2288273 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -28,10 +28,10 @@ importers: version: 4.19.2 vite: specifier: ^5.4.11 - version: 5.4.11(@types/node@22.10.2)(terser@5.37.0) + version: 5.4.11(@types/node@22.10.10)(terser@5.37.0) vitest: specifier: ^2.1.8 - version: 2.1.8(@types/node@22.10.2)(terser@5.37.0) + version: 2.1.8(@types/node@22.10.10)(terser@5.37.0) nextjs-app: dependencies: @@ -73,7 +73,7 @@ importers: dependencies: '@builder.io/react-hydration-overlay': specifier: ^0.1.0 - version: 0.1.0(@spotlightjs/spotlight@2.3.2)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)(webpack@5.94.0) + version: 0.1.0(@spotlightjs/spotlight@2.3.2)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)(webpack@5.94.0(esbuild@0.17.6)) '@remix-run/node': specifier: ^2.15.2 version: 2.15.2(typescript@5.7.2) @@ -101,7 +101,7 @@ importers: devDependencies: '@remix-run/dev': specifier: 2.15.2 - version: 2.15.2(@remix-run/react@2.15.2(react-dom@19.0.0(react@19.0.0))(react@19.0.0)(typescript@5.7.2))(@remix-run/serve@2.15.2(typescript@5.7.2))(@types/node@22.10.2)(terser@5.37.0)(typescript@5.7.2)(vite@5.4.11(@types/node@22.10.2)(terser@5.37.0)) + version: 2.15.2(@remix-run/react@2.15.2(react-dom@19.0.0(react@19.0.0))(react@19.0.0)(typescript@5.7.2))(@remix-run/serve@2.15.2(typescript@5.7.2))(@types/node@22.10.10)(terser@5.37.0)(typescript@5.7.2)(vite@5.4.11(@types/node@22.10.10)(terser@5.37.0)) '@types/react': specifier: ^18.3.5 version: 18.3.5 @@ -4583,10 +4583,6 @@ packages: resolution: {integrity: sha512-PS08Iboia9mts/2ygV3eLpY5ghnUcfLV/EXTOW1E2qYxJKGGBUtNjN76FYHnMs36RmARn41bC0AZmn+rR0OVpQ==} engines: {node: ^10 || ^12 || >=14} - postcss@8.4.49: - resolution: {integrity: sha512-OCVPnIObs4N29kxTjzLfUryOkvZEq+pf8jTF0lg8E7uETuWHA+v7j3c/xJmiqpX450191LlmZfUKkXxkTry7nA==} - engines: {node: ^10 || ^12 || >=14} - postcss@8.5.1: resolution: {integrity: sha512-6oz2beyjc5VMn/KV1pPw8fliQkhBXrVn1Z3TVyqZxU8kZpzEKhBdmCFqI6ZbmGtamQvQGuU1sgPTk8ZrXDD7jQ==} engines: {node: ^10 || ^12 || >=14} @@ -6221,14 +6217,14 @@ snapshots: '@bcoe/v8-coverage@0.2.3': {} - '@builder.io/react-hydration-overlay@0.1.0(@spotlightjs/spotlight@2.3.2)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)(webpack@5.94.0)': + '@builder.io/react-hydration-overlay@0.1.0(@spotlightjs/spotlight@2.3.2)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)(webpack@5.94.0(esbuild@0.17.6))': dependencies: '@spotlightjs/spotlight': 2.3.2 beautify: 0.0.8 react: 19.0.0 react-diff-viewer: 3.1.1(react-dom@19.0.0(react@19.0.0))(react@19.0.0) react-dom: 19.0.0(react@19.0.0) - webpack: 5.94.0 + webpack: 5.94.0(esbuild@0.17.6) transitivePeerDependencies: - supports-color @@ -7016,7 +7012,7 @@ snapshots: '@pkgjs/parseargs@0.11.0': optional: true - '@remix-run/dev@2.15.2(@remix-run/react@2.15.2(react-dom@19.0.0(react@19.0.0))(react@19.0.0)(typescript@5.7.2))(@remix-run/serve@2.15.2(typescript@5.7.2))(@types/node@22.10.2)(terser@5.37.0)(typescript@5.7.2)(vite@5.4.11(@types/node@22.10.2)(terser@5.37.0))': + '@remix-run/dev@2.15.2(@remix-run/react@2.15.2(react-dom@19.0.0(react@19.0.0))(react@19.0.0)(typescript@5.7.2))(@remix-run/serve@2.15.2(typescript@5.7.2))(@types/node@22.10.10)(terser@5.37.0)(typescript@5.7.2)(vite@5.4.11(@types/node@22.10.10)(terser@5.37.0))': dependencies: '@babel/core': 7.25.2 '@babel/generator': 7.25.6 @@ -7033,7 +7029,7 @@ snapshots: '@remix-run/router': 1.21.0 '@remix-run/server-runtime': 2.15.2(typescript@5.7.2) '@types/mdx': 2.0.13 - '@vanilla-extract/integration': 6.5.0(@types/node@22.10.2)(terser@5.37.0) + '@vanilla-extract/integration': 6.5.0(@types/node@22.10.10)(terser@5.37.0) arg: 5.0.2 cacache: 17.1.4 chalk: 4.1.2 @@ -7072,12 +7068,12 @@ snapshots: tar-fs: 2.1.1 tsconfig-paths: 4.2.0 valibot: 0.41.0(typescript@5.7.2) - vite-node: 1.6.0(@types/node@22.10.2)(terser@5.37.0) + vite-node: 1.6.0(@types/node@22.10.10)(terser@5.37.0) ws: 7.5.10 optionalDependencies: '@remix-run/serve': 2.15.2(typescript@5.7.2) typescript: 5.7.2 - vite: 5.4.11(@types/node@22.10.2)(terser@5.37.0) + vite: 5.4.11(@types/node@22.10.10)(terser@5.37.0) transitivePeerDependencies: - '@types/node' - babel-plugin-macros @@ -7484,7 +7480,7 @@ snapshots: transitivePeerDependencies: - babel-plugin-macros - '@vanilla-extract/integration@6.5.0(@types/node@22.10.2)(terser@5.37.0)': + '@vanilla-extract/integration@6.5.0(@types/node@22.10.10)(terser@5.37.0)': dependencies: '@babel/core': 7.25.2 '@babel/plugin-syntax-typescript': 7.25.4(@babel/core@7.25.2) @@ -7497,8 +7493,8 @@ snapshots: lodash: 4.17.21 mlly: 1.7.1 outdent: 0.8.0 - vite: 5.4.11(@types/node@22.10.2)(terser@5.37.0) - vite-node: 1.6.0(@types/node@22.10.2)(terser@5.37.0) + vite: 5.4.11(@types/node@22.10.10)(terser@5.37.0) + vite-node: 1.6.0(@types/node@22.10.10)(terser@5.37.0) transitivePeerDependencies: - '@types/node' - babel-plugin-macros @@ -7520,13 +7516,13 @@ snapshots: chai: 5.1.2 tinyrainbow: 1.2.0 - '@vitest/mocker@2.1.8(vite@5.4.11(@types/node@22.10.2)(terser@5.37.0))': + '@vitest/mocker@2.1.8(vite@5.4.11(@types/node@22.10.10)(terser@5.37.0))': dependencies: '@vitest/spy': 2.1.8 estree-walker: 3.0.3 magic-string: 0.30.17 optionalDependencies: - vite: 5.4.11(@types/node@22.10.2)(terser@5.37.0) + vite: 5.4.11(@types/node@22.10.10)(terser@5.37.0) '@vitest/pretty-format@2.1.8': dependencies: @@ -10734,12 +10730,6 @@ snapshots: picocolors: 1.1.1 source-map-js: 1.2.1 - postcss@8.4.49: - dependencies: - nanoid: 3.3.8 - picocolors: 1.1.1 - source-map-js: 1.2.1 - postcss@8.5.1: dependencies: nanoid: 3.3.8 @@ -11467,14 +11457,16 @@ snapshots: term-size@2.2.1: {} - terser-webpack-plugin@5.3.11(webpack@5.94.0): + terser-webpack-plugin@5.3.11(esbuild@0.17.6)(webpack@5.94.0(esbuild@0.17.6)): dependencies: '@jridgewell/trace-mapping': 0.3.25 jest-worker: 27.5.1 schema-utils: 4.3.0 serialize-javascript: 6.0.2 terser: 5.37.0 - webpack: 5.94.0 + webpack: 5.94.0(esbuild@0.17.6) + optionalDependencies: + esbuild: 0.17.6 terser@5.37.0: dependencies: @@ -11790,13 +11782,13 @@ snapshots: unist-util-stringify-position: 3.0.3 vfile-message: 3.1.4 - vite-node@1.6.0(@types/node@22.10.2)(terser@5.37.0): + vite-node@1.6.0(@types/node@22.10.10)(terser@5.37.0): dependencies: cac: 6.7.14 debug: 4.4.0 pathe: 1.1.2 picocolors: 1.1.1 - vite: 5.4.11(@types/node@22.10.2)(terser@5.37.0) + vite: 5.4.11(@types/node@22.10.10)(terser@5.37.0) transitivePeerDependencies: - '@types/node' - less @@ -11808,13 +11800,13 @@ snapshots: - supports-color - terser - vite-node@2.1.8(@types/node@22.10.2)(terser@5.37.0): + vite-node@2.1.8(@types/node@22.10.10)(terser@5.37.0): dependencies: cac: 6.7.14 debug: 4.4.0 es-module-lexer: 1.6.0 pathe: 1.1.2 - vite: 5.4.11(@types/node@22.10.2)(terser@5.37.0) + vite: 5.4.11(@types/node@22.10.10)(terser@5.37.0) transitivePeerDependencies: - '@types/node' - less @@ -11850,17 +11842,17 @@ snapshots: vite@5.4.11(@types/node@22.10.2)(terser@5.37.0): dependencies: esbuild: 0.21.5 - postcss: 8.4.49 + postcss: 8.5.1 rollup: 4.28.0 optionalDependencies: '@types/node': 22.10.2 fsevents: 2.3.3 terser: 5.37.0 - vitest@2.1.8(@types/node@22.10.2)(terser@5.37.0): + vitest@2.1.8(@types/node@22.10.10)(terser@5.37.0): dependencies: '@vitest/expect': 2.1.8 - '@vitest/mocker': 2.1.8(vite@5.4.11(@types/node@22.10.2)(terser@5.37.0)) + '@vitest/mocker': 2.1.8(vite@5.4.11(@types/node@22.10.10)(terser@5.37.0)) '@vitest/pretty-format': 2.1.8 '@vitest/runner': 2.1.8 '@vitest/snapshot': 2.1.8 @@ -11876,11 +11868,11 @@ snapshots: tinyexec: 0.3.2 tinypool: 1.0.2 tinyrainbow: 1.2.0 - vite: 5.4.11(@types/node@22.10.2)(terser@5.37.0) - vite-node: 2.1.8(@types/node@22.10.2)(terser@5.37.0) + vite: 5.4.11(@types/node@22.10.10)(terser@5.37.0) + vite-node: 2.1.8(@types/node@22.10.10)(terser@5.37.0) why-is-node-running: 2.3.0 optionalDependencies: - '@types/node': 22.10.2 + '@types/node': 22.10.10 transitivePeerDependencies: - less - lightningcss @@ -11915,7 +11907,7 @@ snapshots: webpack-sources@3.2.3: {} - webpack@5.94.0: + webpack@5.94.0(esbuild@0.17.6): dependencies: '@types/estree': 1.0.6 '@webassemblyjs/ast': 1.14.1 @@ -11937,7 +11929,7 @@ snapshots: neo-async: 2.6.2 schema-utils: 3.3.0 tapable: 2.2.1 - terser-webpack-plugin: 5.3.11(webpack@5.94.0) + terser-webpack-plugin: 5.3.11(esbuild@0.17.6)(webpack@5.94.0(esbuild@0.17.6)) watchpack: 2.4.2 webpack-sources: 3.2.3 transitivePeerDependencies: diff --git a/remix-app/app/routes/_index.tsx b/remix-app/app/routes/_index.tsx index 5c70c7f4..c0e91abc 100644 --- a/remix-app/app/routes/_index.tsx +++ b/remix-app/app/routes/_index.tsx @@ -1,73 +1,15 @@ 'use client' -import 'nextjs-app/src/framer/styles.css' -import { - AnimatePresence, - MotionConfig, - MotionConfigContext, - PageRoot, -} from 'unframer' +import 'nextjs-app/src/framer-simplicity/styles.css' -import Logos from 'nextjs-app/src/framer/logos' -import Menus from 'nextjs-app/src/framer/menus' -import Test from 'nextjs-app/src/framer/testimonials' -import Comp from 'nextjs-app/src/framer/fylo' -import FullPage from 'nextjs-app/src/framer/full-page' -import FramerNav from 'nextjs-app/src/framer/framerNav' -import Hero from 'nextjs-app/src/framer/hero' -import MenuOverlay from 'nextjs-app/src/framer/menu-overlay' -import Collection from 'nextjs-app/src/framer/collection' -import Card from 'nextjs-app/src/framer/card' import { useLoaderData } from '@remix-run/react' -import PluginComponentTestFramerComponent from '../../framer-canvas-pages/plugin-component-test' +import { Home } from 'nextjs-app/src/app/page' export function loader() { return {} } -export default function Home() { +export default function Page() { const {} = useLoaderData() as any - return ( - <> - {/* */} - -
- -
- -
- -
- - - - -
- -
- - {/* */} - {/* */} - - - -
-
- - ) + return } diff --git a/remix-app/app/routes/legacy.tsx b/remix-app/app/routes/legacy.tsx new file mode 100644 index 00000000..5c70c7f4 --- /dev/null +++ b/remix-app/app/routes/legacy.tsx @@ -0,0 +1,73 @@ +'use client' + +import 'nextjs-app/src/framer/styles.css' +import { + AnimatePresence, + MotionConfig, + MotionConfigContext, + PageRoot, +} from 'unframer' + +import Logos from 'nextjs-app/src/framer/logos' +import Menus from 'nextjs-app/src/framer/menus' +import Test from 'nextjs-app/src/framer/testimonials' +import Comp from 'nextjs-app/src/framer/fylo' +import FullPage from 'nextjs-app/src/framer/full-page' +import FramerNav from 'nextjs-app/src/framer/framerNav' +import Hero from 'nextjs-app/src/framer/hero' +import MenuOverlay from 'nextjs-app/src/framer/menu-overlay' +import Collection from 'nextjs-app/src/framer/collection' +import Card from 'nextjs-app/src/framer/card' +import { useLoaderData } from '@remix-run/react' +import PluginComponentTestFramerComponent from '../../framer-canvas-pages/plugin-component-test' + +export function loader() { + return {} +} + +export default function Home() { + const {} = useLoaderData() as any + return ( + <> + {/* */} + +
+ +
+ +
+ +
+ + + + +
+ +
+ + {/* */} + {/* */} + + + +
+
+ + ) +} diff --git a/remix-app/tailwind.config.ts b/remix-app/tailwind.config.ts index b1967304..0522c38c 100644 --- a/remix-app/tailwind.config.ts +++ b/remix-app/tailwind.config.ts @@ -1,7 +1,10 @@ import type { Config } from 'tailwindcss' export default { - content: ['./app/**/*.{js,jsx,ts,tsx}'], + content: [ + './app/**/*.{js,jsx,ts,tsx}', // + '../nextjs-app/src/**/*.{js,jsx,ts,tsx}', // + ], darkMode: 'class', theme: { extend: {}, diff --git a/unframer/src/framer.js b/unframer/src/framer.js index 80c462b8..aebf4c90 100644 --- a/unframer/src/framer.js +++ b/unframer/src/framer.js @@ -541354,7 +541354,7 @@ function cloneChildrenWithProps(children, props, asNode,) { children: cloned, },); } -var SSRParentVariantsContext = /* @__PURE__ */ React4.createContext(void 0,); +export var SSRParentVariantsContext = /* @__PURE__ */ React4.createContext(void 0,); var SSRVariantClassName = 'ssr-variant'; function renderBranchedChildrenFromPropertyOverrides( overrides, diff --git a/unframer/src/react.tsx b/unframer/src/react.tsx index d1f35562..6cd1ff06 100644 --- a/unframer/src/react.tsx +++ b/unframer/src/react.tsx @@ -172,20 +172,19 @@ export const WithFramerBreakpoints = forwardRef(function WithFramerBreakpoints< } } const parts = [...variants.values()].map( - ({ className, breakpoints, variant }) => { + ({ className, breakpoints, variant }, i) => { const shouldShow = !currentBreakpoint || breakpoints.includes(currentBreakpoint) if (!shouldShow) { return null } return ( -
+
{/* @ts-ignore */}