diff --git a/editor/src/components/canvas/remix/remix-utils.tsx b/editor/src/components/canvas/remix/remix-utils.tsx index bca0b8933387..24dde9ac6ec0 100644 --- a/editor/src/components/canvas/remix/remix-utils.tsx +++ b/editor/src/components/canvas/remix/remix-utils.tsx @@ -259,54 +259,11 @@ function getRemixExportsOfModule( displayNoneInstances: Array, metadataContext: UiJsxCanvasContextData, ) => { - let resolvedFiles: MapLike> = {} - let resolvedFileNames: Array = [filename] - const requireFn = curriedRequireFn(innerProjectContents) - const resolve = curriedResolveFn(innerProjectContents) - const customRequire = (importOrigin: string, toImport: string) => { - if (resolvedFiles[importOrigin] == null) { - resolvedFiles[importOrigin] = [] - } - let resolvedFromThisOrigin = resolvedFiles[importOrigin] - - const alreadyResolved = resolvedFromThisOrigin[toImport] !== undefined - const filePathResolveResult = alreadyResolved - ? left('Already resolved') - : resolve(importOrigin, toImport) - - forEachRight(filePathResolveResult, (filepath) => resolvedFileNames.push(filepath)) - - const resolvedParseSuccess: Either> = attemptToResolveParsedComponents( - resolvedFromThisOrigin, - toImport, - innerProjectContents, - customRequire, - mutableContextRef, - topLevelComponentRendererComponents, - filename, - fileBlobs, - hiddenInstances, - displayNoneInstances, - metadataContext, - NO_OP, - false, - filePathResolveResult, - null, - ) - return foldEither( - () => { - // We did not find a ParseSuccess, fallback to standard require Fn - return requireFn(importOrigin, toImport, false) - }, - (scope) => { - // Return an artificial exports object that contains our ComponentRendererComponents - return scope - }, - resolvedParseSuccess, - ) - } + const customRequire = (importOrigin: string, toImport: string) => + requireFn(importOrigin, toImport, false) + return createExecutionScope( filename, customRequire, diff --git a/editor/src/core/property-controls/property-controls-local.ts b/editor/src/core/property-controls/property-controls-local.ts index ffd05dff6e82..508854183dea 100644 --- a/editor/src/core/property-controls/property-controls-local.ts +++ b/editor/src/core/property-controls/property-controls-local.ts @@ -97,7 +97,7 @@ import { type ComponentRendererComponent, } from '../../components/canvas/ui-jsx-canvas-renderer/component-renderer-component' import type { MapLike } from 'typescript' -import { attemptToResolveParsedComponents } from '../../components/canvas/ui-jsx-canvas' +import { emptyUiJsxCanvasContextData } from '../../components/canvas/ui-jsx-canvas' import { NO_OP } from '../shared/utils' import { createExecutionScope } from '../../components/canvas/ui-jsx-canvas-renderer/ui-jsx-canvas-execution-scope' import type { EditorDispatch } from '../../components/editor/action-types' @@ -157,93 +157,23 @@ function extendExportsWithInfo(exports: any, toImport: string): any { return exports } -export const createRequireFn = ( - editor: EditorState, - moduleName: string, - transform: (result: any, absoluteFilenameOrPackage: string) => any = identity, -) => { - let mutableContextRef: { current: MutableUtopiaCtxRefData } = { current: {} } - let topLevelComponentRendererComponents: { - current: MapLike> - } = { current: {} } - const emptyMetadataContext: UiJsxCanvasContextData = { - current: { - spyValues: { - allElementProps: {}, - metadata: {}, - variablesInScope: {}, - }, - }, - } - - let resolvedFiles: MapLike> = {} - let resolvedFileNames: Array = [moduleName] - - const requireFn = editor.codeResultCache.curriedRequireFn(editor.projectContents) - const resolve = editor.codeResultCache.curriedResolveFn(editor.projectContents) - - const customRequire = (importOrigin: string, toImport: string) => { - if (resolvedFiles[importOrigin] == null) { - resolvedFiles[importOrigin] = [] - } - let resolvedFromThisOrigin = resolvedFiles[importOrigin] - - const alreadyResolved = resolvedFromThisOrigin[toImport] !== undefined - const filePathResolveResult = alreadyResolved - ? left('Already resolved') - : resolve(importOrigin, toImport) - - forEachRight(filePathResolveResult, (filepath) => resolvedFileNames.push(filepath)) - - const resolvedParseSuccess: Either> = attemptToResolveParsedComponents( - resolvedFromThisOrigin, - toImport, - editor.projectContents, - customRequire, - mutableContextRef, - topLevelComponentRendererComponents, - moduleName, - editor.canvas.base64Blobs, - editor.hiddenInstances, - editor.displayNoneInstances, - emptyMetadataContext, - NO_OP, - false, - filePathResolveResult, - null, - ) - const result = foldEither( - () => { - // We did not find a ParseSuccess, fallback to standard require Fn - return requireFn(importOrigin, toImport, false) - }, - (scope) => { - // Return an artificial exports object that contains our ComponentRendererComponents - return scope - }, - resolvedParseSuccess, - ) - const absoluteFilenameOrPackage = defaultEither(toImport, filePathResolveResult) - return transform(result, absoluteFilenameOrPackage) - } - - return { - customRequire, - emptyMetadataContext, - mutableContextRef, - topLevelComponentRendererComponents, - } -} - export type ModuleEvaluator = (moduleName: string) => any export function createModuleEvaluator(editor: EditorState): ModuleEvaluator { return (moduleName: string) => { - const { - customRequire, - emptyMetadataContext, - mutableContextRef, - topLevelComponentRendererComponents, - } = createRequireFn(editor, moduleName, extendExportsWithInfo) + const requireFn = editor.codeResultCache.curriedRequireFn(editor.projectContents) + const resolveFn = editor.codeResultCache.curriedResolveFn(editor.projectContents) + const customRequire = (importOrigin: string, toImport: string) => { + const result = requireFn(importOrigin, toImport, false) + const filePathResolveResult = resolveFn(importOrigin, toImport) + const absoluteFilenameOrPackage = defaultEither(toImport, filePathResolveResult) + return extendExportsWithInfo(result, absoluteFilenameOrPackage) + } + + let mutableContextRef: { current: MutableUtopiaCtxRefData } = { current: {} } + let topLevelComponentRendererComponents: { + current: MapLike> + } = { current: {} } + return createExecutionScope( moduleName, customRequire, @@ -254,7 +184,7 @@ export function createModuleEvaluator(editor: EditorState): ModuleEvaluator { editor.canvas.base64Blobs, editor.hiddenInstances, editor.displayNoneInstances, - emptyMetadataContext, + emptyUiJsxCanvasContextData(), NO_OP, false, null, diff --git a/editor/src/core/tailwind/tailwind-compilation.ts b/editor/src/core/tailwind/tailwind-compilation.ts index 78f5ef83eae0..972fee42cc9c 100644 --- a/editor/src/core/tailwind/tailwind-compilation.ts +++ b/editor/src/core/tailwind/tailwind-compilation.ts @@ -18,7 +18,6 @@ import { ElementsToRerenderGLOBAL } from '../../components/canvas/ui-jsx-canvas' import { isFeatureEnabled } from '../../utils/feature-switches' import type { Config } from 'tailwindcss/types/config' import type { EditorState } from '../../components/editor/store/editor-state' -import { createRequireFn } from '../property-controls/property-controls-local' const LatestConfig: { current: { code: string; config: Config } | null } = { current: null } export function getTailwindConfigCached(editorState: EditorState): Config | null { @@ -34,8 +33,9 @@ export function getTailwindConfigCached(editorState: EditorState): Config | null if (cached != null) { return cached } - // FIXME this should use a shared long-lived require function instead of creating a brand new one - const { customRequire } = createRequireFn(editorState, TailwindConfigPath) + const requireFn = editorState.codeResultCache.curriedRequireFn(editorState.projectContents) + const customRequire = (importOrigin: string, toImport: string) => + requireFn(importOrigin, toImport, false) const config = importDefault(customRequire('/', TailwindConfigPath)) as Config LatestConfig.current = { code: tailwindConfig.fileContents.code, config: config }