diff --git a/packages/core/src/vite/hooks/resolveCss/resolveCssModuleId.ts b/packages/core/src/vite/hooks/resolveCss/resolveCssModuleId.ts deleted file mode 100644 index a40fa32..0000000 --- a/packages/core/src/vite/hooks/resolveCss/resolveCssModuleId.ts +++ /dev/null @@ -1,18 +0,0 @@ -import { buildResolvedCssModuleIdFromVirtualCssModuleId } from "#@/vite/resolvedCssModuleId/buildResolvedCssModuleIdFromVirtualCssModuleId"; -import { isResolvedCssModuleId } from "#@/vite/resolvedCssModuleId/isResolvedCssModuleId"; -import type { ResolvedCssModuleId } from "#@/vite/resolvedCssModuleId/types"; -import { isVirtualCssModuleId } from "#@/vite/virtualCssModuleId"; - -export function resolveCssModuleId({ - id, -}: { - id: string; -}): ResolvedCssModuleId | null { - if (isResolvedCssModuleId(id)) { - return id; - } - if (isVirtualCssModuleId(id)) { - return buildResolvedCssModuleIdFromVirtualCssModuleId({ id }); - } - return null; -} diff --git a/packages/core/src/vite/hooks/resolveCss/resolveGlobalStyleId.ts b/packages/core/src/vite/hooks/resolveCss/resolveGlobalStyleId.ts deleted file mode 100644 index 24ad82d..0000000 --- a/packages/core/src/vite/hooks/resolveCss/resolveGlobalStyleId.ts +++ /dev/null @@ -1,18 +0,0 @@ -import type { ResolvedGlobalStyleId } from "#@/vite/resolvedGlobalStyleId"; -import { buildResolvedGlobalStyleIdFromVirtualGlobalStyleId } from "#@/vite/resolvedGlobalStyleId"; -import { isResolvedGlobalStyleId } from "#@/vite/resolvedGlobalStyleId"; -import { isVirtualGlobalStyleId } from "#@/vite/virtualGlobalStyleId"; - -export function resolveGlobalStyleId({ - id, -}: { - id: string; -}): ResolvedGlobalStyleId | null { - if (isResolvedGlobalStyleId(id)) { - return id; - } - if (isVirtualGlobalStyleId(id)) { - return buildResolvedGlobalStyleIdFromVirtualGlobalStyleId({ id }); - } - return null; -} diff --git a/packages/core/src/vite/hooks/transform/stages/1.capture-tagged-styles/plugin/index.ts b/packages/core/src/vite/hooks/transform/stages/1.capture-tagged-styles/plugin/index.ts deleted file mode 100644 index 18c4d94..0000000 --- a/packages/core/src/vite/hooks/transform/stages/1.capture-tagged-styles/plugin/index.ts +++ /dev/null @@ -1,66 +0,0 @@ -import type { NodePath, PluginObj, PluginPass, types } from "@babel/core"; -import { isCasablancaImport } from "@casablanca-css/utils"; -import type { BabelState } from "../types"; -import { captureGlobalStyles } from "./captureGlobalStyles"; -import { captureVariableNames } from "./captureVariables"; -import { collectImportSources } from "./collectImportSources"; -import { removeImports } from "./removeImports"; - -export function plugin(): PluginObj { - return { - pre() { - this.shouldTraverse = false; - }, - visitor: { - Program: { - enter: (path, state) => { - const found = path - .get("body") - .find((p): p is NodePath => - isCasablancaImport(p, "core"), - ); - - if (found) { - state.shouldTraverse = true; - } - }, - exit: (path, state) => { - if (!state.shouldTraverse) { - return; - } - path.traverse({ - ImportDeclaration: { - enter: (p) => { - removeImports(p); - }, - }, - }); - }, - }, - ImportDeclaration: { - enter: (path, state) => { - if (!state.shouldTraverse) { - return; - } - collectImportSources(path, state); - }, - }, - VariableDeclarator: { - enter: (path, state) => { - if (!state.shouldTraverse) { - return; - } - captureVariableNames(path, state); - }, - }, - ExpressionStatement: { - enter: (path, state) => { - if (!state.shouldTraverse) { - return; - } - captureGlobalStyles(path, state); - }, - }, - }, - }; -} diff --git a/packages/core/src/vite/hooks/transform/stages/4.assign-composed-styles-to-uuid/resolveEmbeddedUuids.ts b/packages/core/src/vite/hooks/transform/stages/4.assign-composed-styles-to-uuid/resolveEmbeddedUuids.ts deleted file mode 100644 index 37a12fc..0000000 --- a/packages/core/src/vite/hooks/transform/stages/4.assign-composed-styles-to-uuid/resolveEmbeddedUuids.ts +++ /dev/null @@ -1,33 +0,0 @@ -import type { ResolvedUuidToStyle } from "./types"; - -export function resolveEmbeddedUuids({ - uuidToStyle, -}: { - uuidToStyle: Map< - string, - { - style: string; - dependsOn: Set; - uuid: string; - className: string; - } - >; -}): ResolvedUuidToStyle { - const resolved: ResolvedUuidToStyle = new Map(); - for (const { className, dependsOn, style, uuid } of uuidToStyle.values()) { - let s = style; - for (const depsUuid of dependsOn) { - const d = resolved.get(depsUuid) ?? uuidToStyle.get(depsUuid); - if (!d) { - throw new Error(`Broken composition of ${className}`); - } - s = s.replaceAll(depsUuid, d.style); - dependsOn.delete(depsUuid); - for (const dependency of d.dependsOn) { - dependsOn.add(dependency); - } - } - resolved.set(uuid, { dependsOn, style: s, uuid }); - } - return resolved; -} diff --git a/packages/core/src/vite/index.ts b/packages/core/src/vite/index.ts index c24fec2..3740bed 100644 --- a/packages/core/src/vite/index.ts +++ b/packages/core/src/vite/index.ts @@ -2,6 +2,6 @@ import type { Plugin } from "vite"; import { plugin } from "./plugin"; import type { PluginOption } from "./types"; -export function casablanca(options?: Partial): Plugin { +export function casablanca(options?: Partial): Plugin[] { return plugin(options); } diff --git a/packages/core/src/vite/plugin.ts b/packages/core/src/vite/plugin.ts deleted file mode 100644 index 5dd1311..0000000 --- a/packages/core/src/vite/plugin.ts +++ /dev/null @@ -1,220 +0,0 @@ -import { parseAsync } from "@babel/core"; -import { extractPathAndParamsFromId } from "@casablanca-css/utils"; -import type { Plugin, ResolvedConfig, ViteDevServer } from "vite"; -import { extractTargetFilePath } from "./helpers/extractTargetFilePath"; -import { invalidateModule } from "./helpers/invalidateModule"; -import { loadCssModule } from "./hooks/loadCss/loadCssModule"; -import { loadGlobalStyle } from "./hooks/loadCss/loadGlobalStyle"; -import { resolveCssModuleId } from "./hooks/resolveCss/resolveCssModuleId"; -import { resolveGlobalStyleId } from "./hooks/resolveCss/resolveGlobalStyleId"; -import { transform } from "./hooks/transform"; -import { buildResolvedCssModuleIdFromVirtualCssModuleId } from "./resolvedCssModuleId"; -import { buildResolvedGlobalStyleIdFromVirtualGlobalStyleId } from "./resolvedGlobalStyleId"; -import type { - CssModulesLookup, - GlobalStylesLookup, - JsToCssModuleLookup, - JsToGlobalStyleLookup, - OnExitTransform, - PluginOption, -} from "./types"; -import type { VirtualCssModuleId } from "./virtualCssModuleId"; -import type { VirtualGlobalStyleId } from "./virtualGlobalStyleId"; - -export function plugin( - options?: Partial & { - onExitTransform?: OnExitTransform; - }, -): Plugin { - const cssModulesLookup: CssModulesLookup = new Map(); - const jsToCssModuleLookup: JsToCssModuleLookup = new Map(); - - const globalStylesLookup: GlobalStylesLookup = new Map(); - const jsToGlobalStyleLookup: JsToGlobalStyleLookup = new Map(); - - let config: ResolvedConfig | null = null; - let server: ViteDevServer | null = null; - const { - babelOptions = {}, - extensions = [".mjs", ".cjs", ".js", ".jsx", ".mts", ".cts", ".ts", ".tsx"], - onExitTransform = async () => {}, - evaluateOptions = {}, - } = options ?? {}; - const include = new Set(options?.includes ?? []); - - const registerCssModule = ({ - virtualId, - style, - classNameToStyle, - map, - path, - }: { - virtualId: VirtualCssModuleId; - style: string; - classNameToStyle: Map; - map: string | null; - path: string; - }): void => { - const resolvedId = buildResolvedCssModuleIdFromVirtualCssModuleId({ - id: virtualId, - }); - cssModulesLookup.set(resolvedId, { - style, - classNameToStyleMap: classNameToStyle, - map, - }); - jsToCssModuleLookup.set(path, { - resolvedId, - virtualId, - style, - }); - if (server) { - invalidateModule({ moduleId: resolvedId, server }); - } - }; - - const registerGlobalStyle = ({ - virtualId, - style, - map, - path, - }: { - virtualId: VirtualGlobalStyleId; - style: string; - map: string | null; - path: string; - }): void => { - const resolvedId = buildResolvedGlobalStyleIdFromVirtualGlobalStyleId({ - id: virtualId, - }); - globalStylesLookup.set(resolvedId, { - style, - map, - }); - jsToGlobalStyleLookup.set(path, { - resolvedId, - virtualId, - style, - }); - if (server) { - invalidateModule({ moduleId: resolvedId, server }); - } - }; - - return { - name: "casablanca", - async transform(code, id) { - if (!config) { - throw new Error("Vite config is not resolved"); - } - - const path = extractTargetFilePath({ extensions, id, include }); - if (!path) { - return; - } - - const isDev = config.mode === "development"; - - const parsed = await parseAsync(code, { - ...babelOptions, - ast: true, - sourceMaps: isDev ? "inline" : false, - }); - - if (!parsed) { - return; - } - - const transformResult = await transform({ - cssModulesLookup, - ctx: this, - isDev, - originalAst: parsed, - path, - projectRoot: config.root, - server, - originalCode: code, - evaluateOptions, - }); - if (!transformResult) { - return; - } - - const { cssModule, globalStyle, js, stageResults } = transformResult; - - registerCssModule({ - classNameToStyle: new Map( - cssModule.composedStyles.map(({ style, originalName }) => [ - originalName, - { style, className: originalName }, - ]), - ), - map: cssModule.map || null, - path, - style: cssModule.style, - virtualId: cssModule.importId, - }); - registerGlobalStyle({ - path, - style: globalStyle.style, - map: globalStyle.map || null, - virtualId: globalStyle.importId, - }); - - await onExitTransform({ - cssModulesLookup, - globalStylesLookup, - jsToCssModuleLookup, - jsToGlobalStyleLookup, - path, - stages: stageResults, - transformed: js.code, - }); - - return { - code: js.code, - map: js.map, - }; - }, - configResolved(config_) { - config = config_; - }, - async configureServer(server_) { - server = server_; - }, - resolveId(id) { - return resolveCssModuleId({ id }) ?? resolveGlobalStyleId({ id }); - }, - load(id) { - return ( - loadCssModule({ cssModulesLookup, id }) ?? - loadGlobalStyle({ globalStylesLookup, id }) - ); - }, - handleHotUpdate({ modules, server }) { - const affectedModules = modules.flatMap((m) => { - const { id } = m; - if (!id) { - return [m]; - } - const { path } = extractPathAndParamsFromId(id); - const { resolvedId: cssModuleId } = jsToCssModuleLookup.get(path) ?? {}; - const cssModule = cssModuleId - ? server.moduleGraph.getModuleById(cssModuleId) - : null; - - const { resolvedId: globalStyleId } = - jsToGlobalStyleLookup.get(path) ?? {}; - const globalStyle = globalStyleId - ? server.moduleGraph.getModuleById(globalStyleId) - : null; - - return [m, cssModule, globalStyle].filter( - (x): x is NonNullable => !!x, - ); - }); - - return affectedModules; - }, - }; -} diff --git a/packages/core/src/vite/hooks/loadCss/loadCssModule.ts b/packages/core/src/vite/plugin/cssLookup/hooks/load/loadCssModule.ts similarity index 86% rename from packages/core/src/vite/hooks/loadCss/loadCssModule.ts rename to packages/core/src/vite/plugin/cssLookup/hooks/load/loadCssModule.ts index ab69ba7..0024ec6 100644 --- a/packages/core/src/vite/hooks/loadCss/loadCssModule.ts +++ b/packages/core/src/vite/plugin/cssLookup/hooks/load/loadCssModule.ts @@ -1,5 +1,5 @@ import { extractPathAndParamsFromId } from "@casablanca-css/utils"; -import { isResolvedCssModuleId } from "../../resolvedCssModuleId/isResolvedCssModuleId"; +import { isResolvedCssModuleId } from "#@/vite/types/resolvedCssModuleId"; import type { CssModulesLookup } from "../../types"; type LoadCssModuleReturn = { code: string; map: string | null }; diff --git a/packages/core/src/vite/hooks/loadCss/loadGlobalStyle.ts b/packages/core/src/vite/plugin/cssLookup/hooks/load/loadGlobalStyle.ts similarity index 80% rename from packages/core/src/vite/hooks/loadCss/loadGlobalStyle.ts rename to packages/core/src/vite/plugin/cssLookup/hooks/load/loadGlobalStyle.ts index a123b4a..c0d4061 100644 --- a/packages/core/src/vite/hooks/loadCss/loadGlobalStyle.ts +++ b/packages/core/src/vite/plugin/cssLookup/hooks/load/loadGlobalStyle.ts @@ -1,6 +1,6 @@ import { extractPathAndParamsFromId } from "@casablanca-css/utils"; -import { isResolvedGlobalStyleId } from "#@/vite/resolvedGlobalStyleId"; -import type { GlobalStylesLookup } from "#@/vite/types"; +import { isResolvedGlobalStyleId } from "#@/vite/types/resolvedGlobalStyleId"; +import type { GlobalStylesLookup } from "../../types"; type LoadGlobalStyleReturn = { code: string; map: string | null }; diff --git a/packages/core/src/vite/plugin/cssLookup/index.ts b/packages/core/src/vite/plugin/cssLookup/index.ts new file mode 100644 index 0000000..a23b313 --- /dev/null +++ b/packages/core/src/vite/plugin/cssLookup/index.ts @@ -0,0 +1,174 @@ +import { extractPathAndParamsFromId } from "@casablanca-css/utils"; +import type { Plugin, ViteDevServer } from "vite"; +import { + type ResolvedCssModuleId, + buildResolvedCssModuleId, +} from "#@/vite/types/resolvedCssModuleId"; +import { + type ResolvedGlobalStyleId, + buildResolvedGlobalStyleId, +} from "#@/vite/types/resolvedGlobalStyleId"; +import type { VirtualCssModuleId } from "#@/vite/types/virtualCssModuleId"; +import type { VirtualGlobalStyleId } from "#@/vite/types/virtualGlobalStyleId"; +import { loadCssModule } from "./hooks/load/loadCssModule"; +import { loadGlobalStyle } from "./hooks/load/loadGlobalStyle"; +import { invalidateModule } from "./invalidateModule"; +import type { + CssModulesLookup, + GlobalStylesLookup, + JsToCssModuleLookup, + JsToGlobalStyleLookup, +} from "./types"; + +export const cssLookupPluginName = "casablanca-css:css-lookup"; + +export type CssLookupApi = { + cssModule: { + register: (args: { + virtualId: VirtualCssModuleId; + style: string; + classNameToStyle: Map; + map: string | null; + path: string; + }) => void; + getFromResolvedId: (id: ResolvedCssModuleId) => + | { + style: string; + map: string | null; + classNameToStyleMap: Map; + } + | undefined; + getFromJsPath: (path: string) => + | { + virtualId: VirtualCssModuleId; + resolvedId: ResolvedCssModuleId; + style: string; + } + | undefined; + }; + globalStyle: { + register: (args: { + virtualId: VirtualGlobalStyleId; + style: string; + map: string | null; + path: string; + }) => void; + getFromResolvedId: (id: ResolvedGlobalStyleId) => + | { + style: string; + map: string | null; + } + | undefined; + getFromJsPath: (path: string) => + | { + virtualId: VirtualGlobalStyleId; + resolvedId: ResolvedGlobalStyleId; + style: string; + } + | undefined; + }; +}; + +export function cssLookupPlugin(): Plugin { + let server: ViteDevServer | null = null; + + const cssModulesLookup: CssModulesLookup = new Map(); + const jsToCssModuleLookup: JsToCssModuleLookup = new Map(); + + const globalStylesLookup: GlobalStylesLookup = new Map(); + const jsToGlobalStyleLookup: JsToGlobalStyleLookup = new Map(); + + const api: CssLookupApi = { + cssModule: { + register({ classNameToStyle, map, path, style, virtualId }) { + const resolvedId = buildResolvedCssModuleId({ + id: virtualId, + }); + cssModulesLookup.set(resolvedId, { + style, + classNameToStyleMap: classNameToStyle, + map, + }); + jsToCssModuleLookup.set(path, { + resolvedId, + virtualId, + style, + }); + if (server) { + invalidateModule({ moduleId: resolvedId, server }); + } + }, + getFromResolvedId(id) { + return cssModulesLookup.get(id); + }, + getFromJsPath(path) { + return jsToCssModuleLookup.get(path); + }, + }, + globalStyle: { + register({ map, path, style, virtualId }) { + const resolvedId = buildResolvedGlobalStyleId({ + id: virtualId, + }); + globalStylesLookup.set(resolvedId, { + style, + map, + }); + jsToGlobalStyleLookup.set(path, { + resolvedId, + virtualId, + style, + }); + if (server) { + invalidateModule({ moduleId: resolvedId, server }); + } + }, + getFromResolvedId(id) { + return globalStylesLookup.get(id); + }, + getFromJsPath(path) { + return jsToGlobalStyleLookup.get(path); + }, + }, + }; + + return { + name: cssLookupPluginName, + configureServer(_server) { + server = _server; + }, + load(id) { + return ( + loadCssModule({ cssModulesLookup, id }) ?? + loadGlobalStyle({ globalStylesLookup, id }) + ); + }, + api, + handleHotUpdate({ modules, server }) { + const affectedModules = modules.flatMap((m) => { + const { id } = m; + if (!id) { + return [m]; + } + const { path } = extractPathAndParamsFromId(id); + const { resolvedId: cssModuleId } = + api.cssModule.getFromJsPath(path) ?? {}; + const cssModule = cssModuleId + ? server.moduleGraph.getModuleById(cssModuleId) + : null; + + const { resolvedId: globalStyleId } = + api.globalStyle.getFromJsPath(path) ?? {}; + const globalStyle = globalStyleId + ? server.moduleGraph.getModuleById(globalStyleId) + : null; + + return [m, cssModule, globalStyle].filter( + (x): x is NonNullable => !!x, + ); + }); + + return affectedModules; + }, + }; +} diff --git a/packages/core/src/vite/helpers/invalidateModule.ts b/packages/core/src/vite/plugin/cssLookup/invalidateModule.ts similarity index 100% rename from packages/core/src/vite/helpers/invalidateModule.ts rename to packages/core/src/vite/plugin/cssLookup/invalidateModule.ts diff --git a/packages/core/src/vite/plugin/cssLookup/types.ts b/packages/core/src/vite/plugin/cssLookup/types.ts new file mode 100644 index 0000000..a629990 --- /dev/null +++ b/packages/core/src/vite/plugin/cssLookup/types.ts @@ -0,0 +1,39 @@ +"#@/vite/virtualGlobalStyleId"; + +import type { ResolvedCssModuleId } from "#@/vite/types/resolvedCssModuleId"; +import type { ResolvedGlobalStyleId } from "#@/vite/types/resolvedGlobalStyleId"; +import type { VirtualCssModuleId } from "#@/vite/types/virtualCssModuleId"; +import type { VirtualGlobalStyleId } from "#@/vite/types/virtualGlobalStyleId"; + +export type CssModulesLookup = Map< + ResolvedCssModuleId, + { + style: string; + map: string | null; + classNameToStyleMap: Map; + } +>; +export type JsToCssModuleLookup = Map< + string, + { + virtualId: VirtualCssModuleId; + resolvedId: ResolvedCssModuleId; + style: string; + } +>; + +export type GlobalStylesLookup = Map< + ResolvedGlobalStyleId, + { + style: string; + map: string | null; + } +>; +export type JsToGlobalStyleLookup = Map< + string, + { + virtualId: VirtualGlobalStyleId; + resolvedId: ResolvedGlobalStyleId; + style: string; + } +>; diff --git a/packages/core/src/vite/plugin/index.ts b/packages/core/src/vite/plugin/index.ts new file mode 100644 index 0000000..ea2cd95 --- /dev/null +++ b/packages/core/src/vite/plugin/index.ts @@ -0,0 +1,14 @@ +import type { Plugin } from "vite"; +import type { PluginOption } from "../types"; +import { cssLookupPlugin } from "./cssLookup"; +import { resolveIdPlugin } from "./resolveId"; +import { transformPlugin } from "./transform"; +import type { OnExitTransform } from "./transform/types"; + +export function plugin( + options?: Partial & { + onExitTransform?: OnExitTransform; + }, +): Plugin[] { + return [transformPlugin(options), cssLookupPlugin(), resolveIdPlugin()]; +} diff --git a/packages/core/src/vite/plugin/resolveId/hooks/resolveId/resolveCssModuleId.ts b/packages/core/src/vite/plugin/resolveId/hooks/resolveId/resolveCssModuleId.ts new file mode 100644 index 0000000..fc24eb0 --- /dev/null +++ b/packages/core/src/vite/plugin/resolveId/hooks/resolveId/resolveCssModuleId.ts @@ -0,0 +1,20 @@ +import { + type ResolvedCssModuleId, + buildResolvedCssModuleId, + isResolvedCssModuleId, +} from "#@/vite/types/resolvedCssModuleId"; +import { isVirtualCssModuleId } from "#@/vite/types/virtualCssModuleId"; + +export function resolveCssModuleId({ + id, +}: { + id: string; +}): ResolvedCssModuleId | null { + if (isResolvedCssModuleId(id)) { + return id; + } + if (isVirtualCssModuleId(id)) { + return buildResolvedCssModuleId({ id }); + } + return null; +} diff --git a/packages/core/src/vite/plugin/resolveId/hooks/resolveId/resolveGlobalStyleId.ts b/packages/core/src/vite/plugin/resolveId/hooks/resolveId/resolveGlobalStyleId.ts new file mode 100644 index 0000000..9db8871 --- /dev/null +++ b/packages/core/src/vite/plugin/resolveId/hooks/resolveId/resolveGlobalStyleId.ts @@ -0,0 +1,20 @@ +import { + type ResolvedGlobalStyleId, + buildResolvedGlobalStyleId, + isResolvedGlobalStyleId, +} from "#@/vite/types/resolvedGlobalStyleId"; +import { isVirtualGlobalStyleId } from "#@/vite/types/virtualGlobalStyleId"; + +export function resolveGlobalStyleId({ + id, +}: { + id: string; +}): ResolvedGlobalStyleId | null { + if (isResolvedGlobalStyleId(id)) { + return id; + } + if (isVirtualGlobalStyleId(id)) { + return buildResolvedGlobalStyleId({ id }); + } + return null; +} diff --git a/packages/core/src/vite/plugin/resolveId/index.ts b/packages/core/src/vite/plugin/resolveId/index.ts new file mode 100644 index 0000000..7418a2b --- /dev/null +++ b/packages/core/src/vite/plugin/resolveId/index.ts @@ -0,0 +1,12 @@ +import type { Plugin } from "vite"; +import { resolveCssModuleId } from "./hooks/resolveId/resolveCssModuleId"; +import { resolveGlobalStyleId } from "./hooks/resolveId/resolveGlobalStyleId"; + +export function resolveIdPlugin(): Plugin { + return { + name: "casablanca-css:resolve-id", + resolveId(id) { + return resolveCssModuleId({ id }) ?? resolveGlobalStyleId({ id }); + }, + }; +} diff --git a/packages/core/src/vite/hooks/transform/index.ts b/packages/core/src/vite/plugin/transform/hooks/transform/index.ts similarity index 93% rename from packages/core/src/vite/hooks/transform/index.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/index.ts index 1426889..dcd030f 100644 --- a/packages/core/src/vite/hooks/transform/index.ts +++ b/packages/core/src/vite/plugin/transform/hooks/transform/index.ts @@ -1,8 +1,8 @@ import type { ParseResult } from "@babel/core"; import type { Rollup, ViteDevServer } from "vite"; -import type { CssModulesLookup } from "#@/vite/types"; -import type { VirtualCssModuleId } from "#@/vite/virtualCssModuleId"; -import type { VirtualGlobalStyleId } from "#@/vite/virtualGlobalStyleId"; +import type { CssLookupApi } from "#@/vite/plugin/cssLookup"; +import type { VirtualCssModuleId } from "#@/vite/types/virtualCssModuleId"; +import type { VirtualGlobalStyleId } from "#@/vite/types/virtualGlobalStyleId"; import { captureTaggedStyles } from "./stages/1.capture-tagged-styles"; import { prepareCompositions } from "./stages/2.prepare-compositions"; import { createEvaluator } from "./stages/3.evaluate-module"; @@ -20,7 +20,7 @@ type TransformArgs = { isDev: boolean; projectRoot: string; server: ViteDevServer | null; - cssModulesLookup: CssModulesLookup; + cssModulesLookupApi: CssLookupApi["cssModule"]; evaluateOptions: Partial; }; @@ -48,7 +48,7 @@ export async function transform({ isDev, projectRoot, server, - cssModulesLookup, + cssModulesLookupApi, evaluateOptions, }: TransformArgs): Promise { // find tagged templates, then remove all tags. @@ -104,7 +104,7 @@ export async function transform({ }); const { composedStyles } = replaceUuidWithStyles({ - cssModulesLookup, + cssModulesLookupApi, ownedClassNamesToStyles: mapOfClassNamesToStyles, uuidToStylesMap, }); diff --git a/packages/core/src/vite/hooks/transform/stages/1.capture-tagged-styles/capture.test.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/1.capture-tagged-styles/capture.test.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/1.capture-tagged-styles/capture.test.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/1.capture-tagged-styles/capture.test.ts diff --git a/packages/core/src/vite/hooks/transform/stages/1.capture-tagged-styles/fixtures/static.tsx b/packages/core/src/vite/plugin/transform/hooks/transform/stages/1.capture-tagged-styles/fixtures/static.tsx similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/1.capture-tagged-styles/fixtures/static.tsx rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/1.capture-tagged-styles/fixtures/static.tsx diff --git a/packages/core/src/vite/hooks/transform/stages/1.capture-tagged-styles/index.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/1.capture-tagged-styles/index.ts similarity index 95% rename from packages/core/src/vite/hooks/transform/stages/1.capture-tagged-styles/index.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/1.capture-tagged-styles/index.ts index 3d5390c..96170df 100644 --- a/packages/core/src/vite/hooks/transform/stages/1.capture-tagged-styles/index.ts +++ b/packages/core/src/vite/plugin/transform/hooks/transform/stages/1.capture-tagged-styles/index.ts @@ -3,7 +3,7 @@ import { transformFromAstAsync } from "@babel/core"; import { plugin } from "./plugin"; import type { CapturedVariableNames, - GlobalStylePositions, + GlobalStylePosition, ImportSource, Options, } from "./types"; @@ -18,7 +18,7 @@ export type CaptureTaggedStylesReturn = { ast: types.File; capturedVariableNames: CapturedVariableNames; capturedGlobalStylesTempNames: string[]; - globalStylePositions: GlobalStylePositions; + globalStylePositions: GlobalStylePosition[]; importSources: ImportSource[]; }; diff --git a/packages/core/src/vite/hooks/transform/stages/1.capture-tagged-styles/plugin/captureGlobalStyles.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/1.capture-tagged-styles/plugin/captureGlobalStyle.ts similarity index 55% rename from packages/core/src/vite/hooks/transform/stages/1.capture-tagged-styles/plugin/captureGlobalStyles.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/1.capture-tagged-styles/plugin/captureGlobalStyle.ts index 626f467..51c3c99 100644 --- a/packages/core/src/vite/hooks/transform/stages/1.capture-tagged-styles/plugin/captureGlobalStyles.ts +++ b/packages/core/src/vite/plugin/transform/hooks/transform/stages/1.capture-tagged-styles/plugin/captureGlobalStyle.ts @@ -1,23 +1,28 @@ -import { type NodePath, type PluginPass, types } from "@babel/core"; +import { type NodePath, types } from "@babel/core"; import { isCasablancaCssTemplate, isTopLevelStatement, } from "@casablanca-css/utils"; -import type { BabelState } from "../types"; +import type { GlobalStylePosition } from "../types"; -export function captureGlobalStyles( - path: NodePath, - state: PluginPass & BabelState, -): boolean { +export function captureGlobalStyle(path: NodePath): { + exportingTemporalNode: types.ExportNamedDeclaration; + temporalGlobalStyleName: string; + originalPosition: GlobalStylePosition; +} | null { + // capture tagged global style + // injectGlobal`...style`; + // -> + // export const temporalName = `...style`; if (!isTopLevelStatement(path)) { - return false; + return null; } const exp = path.get("expression"); if (!exp.isTaggedTemplateExpression()) { - return false; + return null; } if (!isCasablancaCssTemplate(exp, "injectGlobal")) { - return false; + return null; } if (!path.node.loc) { throw new Error("Missing node location"); @@ -26,7 +31,6 @@ export function captureGlobalStyles( start: { ...path.node.loc.start }, end: { ...path.node.loc.end }, }; - // create temp var const temporalId = path.scope.generateUidIdentifier("temporal_global"); // assign style @@ -35,9 +39,10 @@ export function captureGlobalStyles( types.variableDeclarator(temporalId, exp.get("quasi").node), ]), ); - path.replaceWith(exportingTemporalNode); - // push to capturedGlobalStyleTempNames - state.opts.capturedGlobalStylesTempNames.push(temporalId.name); - state.opts.globalStylePositions.push(originalPosition); - return true; + + return { + exportingTemporalNode, + temporalGlobalStyleName: temporalId.name, + originalPosition, + }; } diff --git a/packages/core/src/vite/hooks/transform/stages/1.capture-tagged-styles/plugin/captureVariables.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/1.capture-tagged-styles/plugin/captureVariableName.ts similarity index 52% rename from packages/core/src/vite/hooks/transform/stages/1.capture-tagged-styles/plugin/captureVariables.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/1.capture-tagged-styles/plugin/captureVariableName.ts index 1d5885b..8c3d740 100644 --- a/packages/core/src/vite/hooks/transform/stages/1.capture-tagged-styles/plugin/captureVariables.ts +++ b/packages/core/src/vite/plugin/transform/hooks/transform/stages/1.capture-tagged-styles/plugin/captureVariableName.ts @@ -1,26 +1,33 @@ -import { type NodePath, type PluginPass, types } from "@babel/core"; +import { type NodePath, types } from "@babel/core"; import { isCasablancaCssTemplate, isTopLevelStatement, } from "@casablanca-css/utils"; -import type { BabelState } from "../types"; +import type { VariableInfo } from "../types"; -export function captureVariableNames( - path: NodePath, - state: PluginPass & BabelState, -): boolean { +export function captureVariableName(path: NodePath): { + exportingTemporalCssNode: types.ExportNamedDeclaration; + originalClassNameNode: types.StringLiteral; + capturedVariableInfo: VariableInfo; +} | null { + // capture variable name using tagged template + // const originalName = css`...styles`; + // -> + // const originalName = "originalName"; + // export const temporalName = `...styles`; const declaration = path.parentPath; if (!(declaration.isDeclaration() && isTopLevelStatement(declaration))) { - return false; + return null; } + const init = path.get("init"); if (!isCasablancaCssTemplate(init, "css")) { - return false; + return null; } const id = path.get("id"); if (!id.isIdentifier()) { - return false; + return null; } const originalName = id.node.name; @@ -36,23 +43,22 @@ export function captureVariableNames( `temporal_${originalName}`, ); - const exportingTemporalNode = types.exportNamedDeclaration( + const exportingTemporalCssNode = types.exportNamedDeclaration( types.variableDeclaration("const", [ types.variableDeclarator(temporalId, init.get("quasi").node), ]), ); - if (declaration.isExportNamedDeclaration()) { - declaration.parentPath.insertAfter(exportingTemporalNode); - } else { - declaration.insertAfter(exportingTemporalNode); - } - init.replaceWith(types.stringLiteral(originalName)); - - state.opts.capturedVariableNames.set(originalName, { + const originalClassNameNode = types.stringLiteral(originalName); + const capturedVariableInfo = { originalName, temporalName: temporalId.name, start: originalPosition.start, end: originalPosition.end, - }); - return true; + }; + + return { + capturedVariableInfo, + exportingTemporalCssNode, + originalClassNameNode, + }; } diff --git a/packages/core/src/vite/hooks/transform/stages/1.capture-tagged-styles/plugin/collectImportSources.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/1.capture-tagged-styles/plugin/collectImportSource.ts similarity index 67% rename from packages/core/src/vite/hooks/transform/stages/1.capture-tagged-styles/plugin/collectImportSources.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/1.capture-tagged-styles/plugin/collectImportSource.ts index 48ae7eb..4fa2fb4 100644 --- a/packages/core/src/vite/hooks/transform/stages/1.capture-tagged-styles/plugin/collectImportSources.ts +++ b/packages/core/src/vite/plugin/transform/hooks/transform/stages/1.capture-tagged-styles/plugin/collectImportSource.ts @@ -1,10 +1,11 @@ -import type { NodePath, PluginPass, types } from "@babel/core"; -import type { BabelState, ImportSource } from "../types"; +import type { NodePath, types } from "@babel/core"; +import type { ImportSource } from "../types"; -export function collectImportSources( +export function collectImportSource( path: NodePath, - state: PluginPass & BabelState, -): boolean { +): ImportSource { + // collect imported classNames + // import {className as localName} from "source"; const source = path.get("source").node.value; const names = path .get("specifiers") @@ -19,6 +20,5 @@ export function collectImportSources( return { className, localName }; }) .filter((x): x is ImportSource["names"][number] => !!x); - state.opts.importSources.push({ names, source }); - return true; + return { names, source }; } diff --git a/packages/core/src/vite/hooks/transform/stages/1.capture-tagged-styles/plugin/helpers/getImportedName.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/1.capture-tagged-styles/plugin/helpers/getImportedName.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/1.capture-tagged-styles/plugin/helpers/getImportedName.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/1.capture-tagged-styles/plugin/helpers/getImportedName.ts diff --git a/packages/core/src/vite/plugin/transform/hooks/transform/stages/1.capture-tagged-styles/plugin/index.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/1.capture-tagged-styles/plugin/index.ts new file mode 100644 index 0000000..b6b354f --- /dev/null +++ b/packages/core/src/vite/plugin/transform/hooks/transform/stages/1.capture-tagged-styles/plugin/index.ts @@ -0,0 +1,103 @@ +import type { NodePath, PluginObj, PluginPass, types } from "@babel/core"; +import { isCasablancaImport } from "@casablanca-css/utils"; +import type { BabelState } from "../types"; +import { captureGlobalStyle } from "./captureGlobalStyle"; +import { captureVariableName } from "./captureVariableName"; +import { collectImportSource } from "./collectImportSource"; +import { removeImports } from "./removeImports"; + +export function plugin(): PluginObj { + return { + pre() { + this.shouldTraverse = false; + }, + visitor: { + Program: { + enter: (path, state) => { + const found = path + .get("body") + .find((p): p is NodePath => + isCasablancaImport(p, "core"), + ); + + if (found) { + state.shouldTraverse = true; + } + }, + exit: (path, state) => { + if (!state.shouldTraverse) { + return; + } + path.traverse({ + ImportDeclaration: { + enter: (p) => { + removeImports(p); + }, + }, + }); + }, + }, + ImportDeclaration: { + enter: (path, state) => { + if (!state.shouldTraverse) { + return; + } + const importSource = collectImportSource(path); + state.opts.importSources.push(importSource); + }, + }, + VariableDeclarator: { + enter: (path, state) => { + if (!state.shouldTraverse) { + return; + } + const captured = captureVariableName(path); + if (!captured) { + return; + } + const { + capturedVariableInfo, + exportingTemporalCssNode, + originalClassNameNode, + } = captured; + + const declaration = path.parentPath; + if (declaration.isExportNamedDeclaration()) { + declaration.parentPath.insertAfter(exportingTemporalCssNode); + } else { + declaration.insertAfter(exportingTemporalCssNode); + } + + const init = path.get("init"); + init.replaceWith(originalClassNameNode); + + state.opts.capturedVariableNames.set( + capturedVariableInfo.originalName, + capturedVariableInfo, + ); + }, + }, + ExpressionStatement: { + enter: (path, state) => { + if (!state.shouldTraverse) { + return; + } + const captured = captureGlobalStyle(path); + if (!captured) { + return; + } + const { + exportingTemporalNode, + originalPosition, + temporalGlobalStyleName, + } = captured; + path.replaceWith(exportingTemporalNode); + state.opts.capturedGlobalStylesTempNames.push( + temporalGlobalStyleName, + ); + state.opts.globalStylePositions.push(originalPosition); + }, + }, + }, + }; +} diff --git a/packages/core/src/vite/hooks/transform/stages/1.capture-tagged-styles/plugin/removeImports.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/1.capture-tagged-styles/plugin/removeImports.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/1.capture-tagged-styles/plugin/removeImports.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/1.capture-tagged-styles/plugin/removeImports.ts diff --git a/packages/core/src/vite/hooks/transform/stages/1.capture-tagged-styles/types.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/1.capture-tagged-styles/types.ts similarity index 59% rename from packages/core/src/vite/hooks/transform/stages/1.capture-tagged-styles/types.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/1.capture-tagged-styles/types.ts index cbd8847..c6b7a20 100644 --- a/packages/core/src/vite/hooks/transform/stages/1.capture-tagged-styles/types.ts +++ b/packages/core/src/vite/plugin/transform/hooks/transform/stages/1.capture-tagged-styles/types.ts @@ -1,25 +1,24 @@ -export type CapturedVariableNames = Map< - string, - { - originalName: string; - temporalName: string; - start: { - line: number; - column: number; - }; - end: { - line: number; - column: number; - }; - } ->; +export type VariableInfo = { + originalName: string; + temporalName: string; + start: { + line: number; + column: number; + }; + end: { + line: number; + column: number; + }; +}; + +export type CapturedVariableNames = Map; export type CapturedGlobalStyleTempNames = string[]; -export type GlobalStylePositions = { +export type GlobalStylePosition = { start: { line: number; column: number }; end: { line: number; column: number }; -}[]; +}; export type ImportSource = { names: { className: string; localName: string }[]; @@ -29,7 +28,7 @@ export type ImportSource = { export type Options = { capturedVariableNames: CapturedVariableNames; capturedGlobalStylesTempNames: CapturedGlobalStyleTempNames; - globalStylePositions: GlobalStylePositions; + globalStylePositions: GlobalStylePosition[]; importSources: ImportSource[]; }; diff --git a/packages/core/src/vite/hooks/transform/stages/2.prepare-compositions/buildEmbeddedToClassNameMap.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/2.prepare-compositions/buildEmbeddedToClassNameMap.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/2.prepare-compositions/buildEmbeddedToClassNameMap.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/2.prepare-compositions/buildEmbeddedToClassNameMap.ts diff --git a/packages/core/src/vite/hooks/transform/stages/2.prepare-compositions/compose.test.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/2.prepare-compositions/compose.test.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/2.prepare-compositions/compose.test.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/2.prepare-compositions/compose.test.ts diff --git a/packages/core/src/vite/hooks/transform/stages/2.prepare-compositions/fixtures/composed.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/2.prepare-compositions/fixtures/composed.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/2.prepare-compositions/fixtures/composed.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/2.prepare-compositions/fixtures/composed.ts diff --git a/packages/core/src/vite/hooks/transform/stages/2.prepare-compositions/fixtures/composing.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/2.prepare-compositions/fixtures/composing.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/2.prepare-compositions/fixtures/composing.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/2.prepare-compositions/fixtures/composing.ts diff --git a/packages/core/src/vite/hooks/transform/stages/2.prepare-compositions/index.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/2.prepare-compositions/index.ts similarity index 96% rename from packages/core/src/vite/hooks/transform/stages/2.prepare-compositions/index.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/2.prepare-compositions/index.ts index 23cfb0a..ef03509 100644 --- a/packages/core/src/vite/hooks/transform/stages/2.prepare-compositions/index.ts +++ b/packages/core/src/vite/plugin/transform/hooks/transform/stages/2.prepare-compositions/index.ts @@ -35,7 +35,7 @@ export async function prepareCompositions({ resolve, }); - // replace `compose` calls with `composes: ...;` expressions. + // replace `composes: ...;` expressions with `compose` calls. const uuidToStylesMap: UuidToStylesMap = new Map(); const pluginOption: Options = { temporalVariableNames: stage1Result.variableNames.map( diff --git a/packages/core/src/vite/hooks/transform/stages/2.prepare-compositions/plugin/helpers/buildComposeInternalExpression.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/2.prepare-compositions/plugin/helpers/buildComposeInternalExpression.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/2.prepare-compositions/plugin/helpers/buildComposeInternalExpression.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/2.prepare-compositions/plugin/helpers/buildComposeInternalExpression.ts diff --git a/packages/core/src/vite/hooks/transform/stages/2.prepare-compositions/plugin/helpers/buildResolvedIdFromJsId.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/2.prepare-compositions/plugin/helpers/buildResolvedIdFromJsId.ts similarity index 53% rename from packages/core/src/vite/hooks/transform/stages/2.prepare-compositions/plugin/helpers/buildResolvedIdFromJsId.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/2.prepare-compositions/plugin/helpers/buildResolvedIdFromJsId.ts index 96ae32f..bf3a6c2 100644 --- a/packages/core/src/vite/hooks/transform/stages/2.prepare-compositions/plugin/helpers/buildResolvedIdFromJsId.ts +++ b/packages/core/src/vite/plugin/transform/hooks/transform/stages/2.prepare-compositions/plugin/helpers/buildResolvedIdFromJsId.ts @@ -1,7 +1,9 @@ import { extractPathAndParamsFromId } from "@casablanca-css/utils"; -import { buildResolvedCssModuleIdFromVirtualCssModuleId } from "#@/vite/resolvedCssModuleId"; -import type { ResolvedCssModuleId } from "#@/vite/resolvedCssModuleId"; -import { buildVirtualCssModuleId } from "#@/vite/virtualCssModuleId"; +import { + type ResolvedCssModuleId, + buildResolvedCssModuleId, +} from "#@/vite/types/resolvedCssModuleId"; +import { buildVirtualCssModuleId } from "#@/vite/types/virtualCssModuleId"; export function buildResolvedIdFromJsId({ jsId, @@ -15,5 +17,5 @@ export function buildResolvedIdFromJsId({ importerPath: path, projectRoot, }); - return buildResolvedCssModuleIdFromVirtualCssModuleId({ id: virtualId }); + return buildResolvedCssModuleId({ id: virtualId }); } diff --git a/packages/core/src/vite/hooks/transform/stages/2.prepare-compositions/plugin/helpers/collectComposeArgsValues.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/2.prepare-compositions/plugin/helpers/collectComposeArgsValues.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/2.prepare-compositions/plugin/helpers/collectComposeArgsValues.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/2.prepare-compositions/plugin/helpers/collectComposeArgsValues.ts diff --git a/packages/core/src/vite/hooks/transform/stages/2.prepare-compositions/plugin/helpers/extractPathsFromQuasi.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/2.prepare-compositions/plugin/helpers/extractPathsFromQuasi.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/2.prepare-compositions/plugin/helpers/extractPathsFromQuasi.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/2.prepare-compositions/plugin/helpers/extractPathsFromQuasi.ts diff --git a/packages/core/src/vite/hooks/transform/stages/2.prepare-compositions/plugin/helpers/extractTemplatePathFromDeclarator.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/2.prepare-compositions/plugin/helpers/extractTemplatePathFromDeclarator.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/2.prepare-compositions/plugin/helpers/extractTemplatePathFromDeclarator.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/2.prepare-compositions/plugin/helpers/extractTemplatePathFromDeclarator.ts diff --git a/packages/core/src/vite/hooks/transform/stages/2.prepare-compositions/plugin/helpers/isImportedClassName.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/2.prepare-compositions/plugin/helpers/isImportedClassName.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/2.prepare-compositions/plugin/helpers/isImportedClassName.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/2.prepare-compositions/plugin/helpers/isImportedClassName.ts diff --git a/packages/core/src/vite/hooks/transform/stages/2.prepare-compositions/plugin/helpers/markImportedSelectorsAsGlobal.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/2.prepare-compositions/plugin/helpers/markImportedSelectorsAsGlobal.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/2.prepare-compositions/plugin/helpers/markImportedSelectorsAsGlobal.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/2.prepare-compositions/plugin/helpers/markImportedSelectorsAsGlobal.ts diff --git a/packages/core/src/vite/hooks/transform/stages/2.prepare-compositions/plugin/index.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/2.prepare-compositions/plugin/index.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/2.prepare-compositions/plugin/index.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/2.prepare-compositions/plugin/index.ts diff --git a/packages/core/src/vite/hooks/transform/stages/2.prepare-compositions/types.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/2.prepare-compositions/types.ts similarity index 86% rename from packages/core/src/vite/hooks/transform/stages/2.prepare-compositions/types.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/2.prepare-compositions/types.ts index 03525ca..74d860f 100644 --- a/packages/core/src/vite/hooks/transform/stages/2.prepare-compositions/types.ts +++ b/packages/core/src/vite/plugin/transform/hooks/transform/stages/2.prepare-compositions/types.ts @@ -1,5 +1,5 @@ import type { types } from "@babel/core"; -import type { ResolvedCssModuleId } from "#@/vite/resolvedCssModuleId"; +import type { ResolvedCssModuleId } from "#@/vite/types/resolvedCssModuleId"; import type { ComposeInternalArg } from "../3.evaluate-module/createComposeInternal"; export type UuidToStylesMap = Map< diff --git a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/build/index.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/build/index.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/3.evaluate-module/build/index.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/build/index.ts diff --git a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/build/loaders/loadAbsoluteModule.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/build/loaders/loadAbsoluteModule.ts similarity index 92% rename from packages/core/src/vite/hooks/transform/stages/3.evaluate-module/build/loaders/loadAbsoluteModule.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/build/loaders/loadAbsoluteModule.ts index 93aec10..7887d54 100644 --- a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/build/loaders/loadAbsoluteModule.ts +++ b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/build/loaders/loadAbsoluteModule.ts @@ -1,6 +1,6 @@ import vm, { type Module } from "node:vm"; -import { isVirtualCssModuleId } from "#@/vite/virtualCssModuleId"; -import { isVirtualGlobalStyleId } from "#@/vite/virtualGlobalStyleId"; +import { isVirtualCssModuleId } from "#@/vite/types/virtualCssModuleId"; +import { isVirtualGlobalStyleId } from "#@/vite/types/virtualGlobalStyleId"; import { buildInitializeImportMeta } from "../../initializeImportMeta"; import type { LoadModuleReturn, TransformContext } from "../../types"; diff --git a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/build/loaders/loadRelativeModule.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/build/loaders/loadRelativeModule.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/3.evaluate-module/build/loaders/loadRelativeModule.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/build/loaders/loadRelativeModule.ts diff --git a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/build/loaders/loadViteModule.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/build/loaders/loadViteModule.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/3.evaluate-module/build/loaders/loadViteModule.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/build/loaders/loadViteModule.ts diff --git a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/createComposeInternal.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/createComposeInternal.ts similarity index 92% rename from packages/core/src/vite/hooks/transform/stages/3.evaluate-module/createComposeInternal.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/createComposeInternal.ts index faf40e0..41d5bd6 100644 --- a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/createComposeInternal.ts +++ b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/createComposeInternal.ts @@ -1,5 +1,5 @@ import type { TaggedStyle } from "@casablanca-css/utils"; -import type { ResolvedCssModuleId } from "#@/vite/resolvedCssModuleId"; +import type { ResolvedCssModuleId } from "#@/vite/types/resolvedCssModuleId"; import type { UuidToStylesMap } from "../2.prepare-compositions/types"; export type ComposeInternalArg = { diff --git a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/createGlobalContext.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/createGlobalContext.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/3.evaluate-module/createGlobalContext.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/createGlobalContext.ts diff --git a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/evaluate.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/evaluate.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/3.evaluate-module/evaluate.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/evaluate.ts diff --git a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/evaluateForProductionBuild.test.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/evaluateForProductionBuild.test.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/3.evaluate-module/evaluateForProductionBuild.test.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/evaluateForProductionBuild.test.ts diff --git a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/evaluateWithServer.test.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/evaluateWithServer.test.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/3.evaluate-module/evaluateWithServer.test.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/evaluateWithServer.test.ts diff --git a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/fixtures/globalStyles.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/fixtures/globalStyles.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/3.evaluate-module/fixtures/globalStyles.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/fixtures/globalStyles.ts diff --git a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/fixtures/simple.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/fixtures/simple.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/3.evaluate-module/fixtures/simple.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/fixtures/simple.ts diff --git a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/fixtures/styles.css b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/fixtures/styles.css similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/3.evaluate-module/fixtures/styles.css rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/fixtures/styles.css diff --git a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/fixtures/testHelpers.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/fixtures/testHelpers.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/3.evaluate-module/fixtures/testHelpers.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/fixtures/testHelpers.ts diff --git a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/fixtures/themes.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/fixtures/themes.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/3.evaluate-module/fixtures/themes.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/fixtures/themes.ts diff --git a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/fixtures/thirdParty.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/fixtures/thirdParty.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/3.evaluate-module/fixtures/thirdParty.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/fixtures/thirdParty.ts diff --git a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/fixtures/useAssetFile.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/fixtures/useAssetFile.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/3.evaluate-module/fixtures/useAssetFile.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/fixtures/useAssetFile.ts diff --git a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/fixtures/useLocalFile.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/fixtures/useLocalFile.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/3.evaluate-module/fixtures/useLocalFile.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/fixtures/useLocalFile.ts diff --git a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/fixtures/values.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/fixtures/values.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/3.evaluate-module/fixtures/values.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/fixtures/values.ts diff --git a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/index.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/index.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/3.evaluate-module/index.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/index.ts diff --git a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/initializeImportMeta.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/initializeImportMeta.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/3.evaluate-module/initializeImportMeta.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/initializeImportMeta.ts diff --git a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/injectReactRefresh.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/injectReactRefresh.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/3.evaluate-module/injectReactRefresh.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/injectReactRefresh.ts diff --git a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/loadModule.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/loadModule.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/3.evaluate-module/loadModule.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/loadModule.ts diff --git a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/loaders/loadBuiltinModule.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/loaders/loadBuiltinModule.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/3.evaluate-module/loaders/loadBuiltinModule.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/loaders/loadBuiltinModule.ts diff --git a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/loaders/loadNodeModule.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/loaders/loadNodeModule.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/3.evaluate-module/loaders/loadNodeModule.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/loaders/loadNodeModule.ts diff --git a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/merge.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/merge.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/3.evaluate-module/merge.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/merge.ts diff --git a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/serve/index.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/serve/index.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/3.evaluate-module/serve/index.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/serve/index.ts diff --git a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/serve/loaders/loadRelativeModule.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/serve/loaders/loadRelativeModule.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/3.evaluate-module/serve/loaders/loadRelativeModule.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/serve/loaders/loadRelativeModule.ts diff --git a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/serve/loaders/loadViteModule.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/serve/loaders/loadViteModule.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/3.evaluate-module/serve/loaders/loadViteModule.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/serve/loaders/loadViteModule.ts diff --git a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/serve/normalizeSpecifier.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/serve/normalizeSpecifier.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/3.evaluate-module/serve/normalizeSpecifier.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/serve/normalizeSpecifier.ts diff --git a/packages/core/src/vite/hooks/transform/stages/3.evaluate-module/types.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/types.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/3.evaluate-module/types.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/3.evaluate-module/types.ts diff --git a/packages/core/src/vite/hooks/transform/stages/4.assign-composed-styles-to-uuid/assignStyles.test.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/4.assign-composed-styles-to-uuid/assignStyles.test.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/4.assign-composed-styles-to-uuid/assignStyles.test.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/4.assign-composed-styles-to-uuid/assignStyles.test.ts diff --git a/packages/core/src/vite/hooks/transform/stages/4.assign-composed-styles-to-uuid/fixtures/composed.tsx b/packages/core/src/vite/plugin/transform/hooks/transform/stages/4.assign-composed-styles-to-uuid/fixtures/composed.tsx similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/4.assign-composed-styles-to-uuid/fixtures/composed.tsx rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/4.assign-composed-styles-to-uuid/fixtures/composed.tsx diff --git a/packages/core/src/vite/hooks/transform/stages/4.assign-composed-styles-to-uuid/fixtures/composing.tsx b/packages/core/src/vite/plugin/transform/hooks/transform/stages/4.assign-composed-styles-to-uuid/fixtures/composing.tsx similarity index 91% rename from packages/core/src/vite/hooks/transform/stages/4.assign-composed-styles-to-uuid/fixtures/composing.tsx rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/4.assign-composed-styles-to-uuid/fixtures/composing.tsx index e079f42..de0f0fc 100644 --- a/packages/core/src/vite/hooks/transform/stages/4.assign-composed-styles-to-uuid/fixtures/composing.tsx +++ b/packages/core/src/vite/plugin/transform/hooks/transform/stages/4.assign-composed-styles-to-uuid/fixtures/composing.tsx @@ -9,8 +9,13 @@ export const styleA = css` color: red; `; +const composedInComposed = css` + font-style: italic; +`; + const _styledLocalComponent = css` display: block; + composes: ${composedInComposed}; `; const LocalComponent = (() => (
Foo
diff --git a/packages/core/src/vite/hooks/transform/stages/4.assign-composed-styles-to-uuid/fixtures/deps/composed.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/4.assign-composed-styles-to-uuid/fixtures/deps/composed.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/4.assign-composed-styles-to-uuid/fixtures/deps/composed.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/4.assign-composed-styles-to-uuid/fixtures/deps/composed.ts diff --git a/packages/core/src/vite/hooks/transform/stages/4.assign-composed-styles-to-uuid/getResolvedMapElement.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/4.assign-composed-styles-to-uuid/getResolvedMapElement.ts similarity index 57% rename from packages/core/src/vite/hooks/transform/stages/4.assign-composed-styles-to-uuid/getResolvedMapElement.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/4.assign-composed-styles-to-uuid/getResolvedMapElement.ts index e45725c..fdafa46 100644 --- a/packages/core/src/vite/hooks/transform/stages/4.assign-composed-styles-to-uuid/getResolvedMapElement.ts +++ b/packages/core/src/vite/plugin/transform/hooks/transform/stages/4.assign-composed-styles-to-uuid/getResolvedMapElement.ts @@ -1,18 +1,18 @@ -import type { ResolvedCssModuleId } from "#@/vite/resolvedCssModuleId"; -import type { CssModulesLookup } from "#@/vite/types"; +import type { CssLookupApi } from "#@/vite/plugin/cssLookup"; +import type { ResolvedCssModuleId } from "#@/vite/types/resolvedCssModuleId"; import type { MapElement } from "./types"; export function getResolvedMapElement({ - cssModulesLookup, + cssModulesLookupApi, resolvedId, className, }: { - cssModulesLookup: CssModulesLookup; + cssModulesLookupApi: CssLookupApi["cssModule"]; resolvedId: ResolvedCssModuleId; className: string; }): MapElement { - const style = cssModulesLookup - .get(resolvedId) + const style = cssModulesLookupApi + .getFromResolvedId(resolvedId) ?.classNameToStyleMap.get(className)?.style; if (!style) { throw new Error(`Broken composition of ${className}`); diff --git a/packages/core/src/vite/hooks/transform/stages/4.assign-composed-styles-to-uuid/getUnresolvedMapElement.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/4.assign-composed-styles-to-uuid/getUnresolvedMapElement.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/4.assign-composed-styles-to-uuid/getUnresolvedMapElement.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/4.assign-composed-styles-to-uuid/getUnresolvedMapElement.ts diff --git a/packages/core/src/vite/hooks/transform/stages/4.assign-composed-styles-to-uuid/index.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/4.assign-composed-styles-to-uuid/index.ts similarity index 80% rename from packages/core/src/vite/hooks/transform/stages/4.assign-composed-styles-to-uuid/index.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/4.assign-composed-styles-to-uuid/index.ts index cf585cb..465335d 100644 --- a/packages/core/src/vite/hooks/transform/stages/4.assign-composed-styles-to-uuid/index.ts +++ b/packages/core/src/vite/plugin/transform/hooks/transform/stages/4.assign-composed-styles-to-uuid/index.ts @@ -1,4 +1,4 @@ -import type { CssModulesLookup } from "#@/vite/types"; +import type { CssLookupApi } from "#@/vite/plugin/cssLookup"; import type { UuidToStylesMap } from "../2.prepare-compositions/types"; import { getResolvedMapElement } from "./getResolvedMapElement"; import { getUnresolvedMapElement } from "./getUnresolvedMapElement"; @@ -8,7 +8,7 @@ import type { OwnedClassNamesToStyles } from "./types"; type ReplaceUuidToStylesArgs = { ownedClassNamesToStyles: OwnedClassNamesToStyles; uuidToStylesMap: UuidToStylesMap; - cssModulesLookup: CssModulesLookup; + cssModulesLookupApi: CssLookupApi["cssModule"]; }; export type ReplaceUuidToStylesReturn = { composedStyles: { @@ -19,16 +19,20 @@ export type ReplaceUuidToStylesReturn = { }; export function replaceUuidWithStyles({ - cssModulesLookup, + cssModulesLookupApi, ownedClassNamesToStyles, uuidToStylesMap: uuidToClassNamesMap, }: ReplaceUuidToStylesArgs): ReplaceUuidToStylesReturn { const uuids = Array.from(uuidToClassNamesMap.keys()); const uuidToStyle = new Map( - Array.from(uuidToClassNamesMap.entries()) - .map(([uuid, { className, resolvedId }]) => { + Array.from(uuidToClassNamesMap.entries()).map( + ([uuid, { className, resolvedId }]) => { const e = resolvedId - ? getResolvedMapElement({ className, cssModulesLookup, resolvedId }) + ? getResolvedMapElement({ + className, + cssModulesLookupApi, + resolvedId, + }) : getUnresolvedMapElement({ className, ownedClassNamesToStyles, @@ -42,8 +46,8 @@ export function replaceUuidWithStyles({ ...e, }, ] as const; - }) - .sort(([, a], [, b]) => a.dependsOn.size - b.dependsOn.size), + }, + ), ); const resolvedUuidToStyle = resolveEmbeddedUuids({ uuidToStyle }); @@ -56,5 +60,6 @@ export function replaceUuidWithStyles({ return { style: s, temporalVariableName, originalName }; }, ); + return { composedStyles: result }; } diff --git a/packages/core/src/vite/plugin/transform/hooks/transform/stages/4.assign-composed-styles-to-uuid/resolveEmbeddedUuids.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/4.assign-composed-styles-to-uuid/resolveEmbeddedUuids.ts new file mode 100644 index 0000000..862abca --- /dev/null +++ b/packages/core/src/vite/plugin/transform/hooks/transform/stages/4.assign-composed-styles-to-uuid/resolveEmbeddedUuids.ts @@ -0,0 +1,26 @@ +import { resolveRecursive } from "./resolveRecursive"; +import type { ResolvedUuidToStyle } from "./types"; + +export function resolveEmbeddedUuids({ + uuidToStyle, +}: { + uuidToStyle: Map< + string, + { + style: string; + dependsOn: Set; + uuid: string; + className: string; + } + >; +}): ResolvedUuidToStyle { + const resolved: ResolvedUuidToStyle = new Map(); + for (const target of uuidToStyle.values()) { + resolveRecursive({ + resolvedStylesMap: resolved, + target, + unresolvedStyledMap: uuidToStyle, + }); + } + return resolved; +} diff --git a/packages/core/src/vite/plugin/transform/hooks/transform/stages/4.assign-composed-styles-to-uuid/resolveRecursive.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/4.assign-composed-styles-to-uuid/resolveRecursive.ts new file mode 100644 index 0000000..6c17ff2 --- /dev/null +++ b/packages/core/src/vite/plugin/transform/hooks/transform/stages/4.assign-composed-styles-to-uuid/resolveRecursive.ts @@ -0,0 +1,53 @@ +import type { ResolvedUuidToStyle } from "./types"; + +export function resolveRecursive({ + resolvedStylesMap, + target: { className, dependsOn, style, uuid }, + unresolvedStyledMap, +}: { + target: { + style: string; + dependsOn: Set; + uuid: string; + className: string; + }; + resolvedStylesMap: ResolvedUuidToStyle; + unresolvedStyledMap: Map< + string, + { + style: string; + dependsOn: Set; + uuid: string; + className: string; + } + >; +}): { resolvedStyle: string; uuid: string; className: string } { + let s = style; + + for (const depsUuid of dependsOn) { + const resolved = resolvedStylesMap.get(depsUuid); + if (resolved) { + s = s.replaceAll(resolved.uuid, resolved.style); + continue; + } + const unresolved = unresolvedStyledMap.get(depsUuid); + if (!unresolved) { + throw new Error(`Broken composition of ${className}`); + } + + const resolvedDepsStyle = resolveRecursive({ + resolvedStylesMap, + target: unresolved, + unresolvedStyledMap, + }); + s = s.replaceAll(resolvedDepsStyle.uuid, resolvedDepsStyle.resolvedStyle); + } + resolvedStylesMap.set(uuid, { style: s, uuid, className }); + unresolvedStyledMap.set(uuid, { + className, + dependsOn: new Set(), + style: s, + uuid, + }); + return { resolvedStyle: s, uuid, className }; +} diff --git a/packages/core/src/vite/hooks/transform/stages/4.assign-composed-styles-to-uuid/types.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/4.assign-composed-styles-to-uuid/types.ts similarity index 91% rename from packages/core/src/vite/hooks/transform/stages/4.assign-composed-styles-to-uuid/types.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/4.assign-composed-styles-to-uuid/types.ts index 48bd7ac..0e8280b 100644 --- a/packages/core/src/vite/hooks/transform/stages/4.assign-composed-styles-to-uuid/types.ts +++ b/packages/core/src/vite/plugin/transform/hooks/transform/stages/4.assign-composed-styles-to-uuid/types.ts @@ -17,6 +17,6 @@ export type ResolvedUuidToStyle = Map< { uuid: string; style: string; - dependsOn: Set; + className: string; } >; diff --git a/packages/core/src/vite/hooks/transform/stages/5.create-virtual-modules/dev/buildCssModule.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/5.create-virtual-modules/dev/buildCssModule.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/5.create-virtual-modules/dev/buildCssModule.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/5.create-virtual-modules/dev/buildCssModule.ts diff --git a/packages/core/src/vite/hooks/transform/stages/5.create-virtual-modules/dev/buildGlobalStyle.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/5.create-virtual-modules/dev/buildGlobalStyle.ts similarity index 93% rename from packages/core/src/vite/hooks/transform/stages/5.create-virtual-modules/dev/buildGlobalStyle.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/5.create-virtual-modules/dev/buildGlobalStyle.ts index b73c458..2301128 100644 --- a/packages/core/src/vite/hooks/transform/stages/5.create-virtual-modules/dev/buildGlobalStyle.ts +++ b/packages/core/src/vite/plugin/transform/hooks/transform/stages/5.create-virtual-modules/dev/buildGlobalStyle.ts @@ -1,14 +1,14 @@ import remapping from "@ampproject/remapping"; import { SourceMapGenerator } from "source-map"; import type { Rollup } from "vite"; -import type { GlobalStylePositions } from "../../1.capture-tagged-styles/types"; +import type { GlobalStylePosition } from "../../1.capture-tagged-styles/types"; type BuildGlobalStyleArgs = { filename: string; content: string; projectRoot: string; evaluatedGlobalStyles: string[]; - jsGlobalStylePositions: GlobalStylePositions; + jsGlobalStylePositions: GlobalStylePosition[]; previousSourceMap: Rollup.SourceMap; }; diff --git a/packages/core/src/vite/hooks/transform/stages/5.create-virtual-modules/dev/index.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/5.create-virtual-modules/dev/index.ts similarity index 82% rename from packages/core/src/vite/hooks/transform/stages/5.create-virtual-modules/dev/index.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/5.create-virtual-modules/dev/index.ts index 4af62f9..260df24 100644 --- a/packages/core/src/vite/hooks/transform/stages/5.create-virtual-modules/dev/index.ts +++ b/packages/core/src/vite/plugin/transform/hooks/transform/stages/5.create-virtual-modules/dev/index.ts @@ -1,9 +1,13 @@ import type { Rollup } from "vite"; -import type { VirtualCssModuleId } from "#@/vite/virtualCssModuleId"; -import { buildVirtualCssModuleId } from "#@/vite/virtualCssModuleId"; -import type { VirtualGlobalStyleId } from "#@/vite/virtualGlobalStyleId"; -import { buildVirtualGlobalStyleId } from "#@/vite/virtualGlobalStyleId"; -import type { GlobalStylePositions } from "../../1.capture-tagged-styles/types"; +import { + type VirtualCssModuleId, + buildVirtualCssModuleId, +} from "#@/vite/types/virtualCssModuleId"; +import { + type VirtualGlobalStyleId, + buildVirtualGlobalStyleId, +} from "#@/vite/types/virtualGlobalStyleId"; +import type { GlobalStylePosition } from "../../1.capture-tagged-styles/types"; import { buildCssModule } from "./buildCssModule"; import { buildGlobalStyle } from "./buildGlobalStyle"; @@ -27,7 +31,7 @@ export type BuildForDevArgs = { end: { line: number; column: number }; } >; - jsGlobalStylePositions: GlobalStylePositions; + jsGlobalStylePositions: GlobalStylePosition[]; }; }; diff --git a/packages/core/src/vite/hooks/transform/stages/5.create-virtual-modules/fixtures/styles.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/5.create-virtual-modules/fixtures/styles.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/5.create-virtual-modules/fixtures/styles.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/5.create-virtual-modules/fixtures/styles.ts diff --git a/packages/core/src/vite/hooks/transform/stages/5.create-virtual-modules/index.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/5.create-virtual-modules/index.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/5.create-virtual-modules/index.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/5.create-virtual-modules/index.ts diff --git a/packages/core/src/vite/hooks/transform/stages/5.create-virtual-modules/production/index.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/5.create-virtual-modules/production/index.ts similarity index 78% rename from packages/core/src/vite/hooks/transform/stages/5.create-virtual-modules/production/index.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/5.create-virtual-modules/production/index.ts index 41ab752..f759c64 100644 --- a/packages/core/src/vite/hooks/transform/stages/5.create-virtual-modules/production/index.ts +++ b/packages/core/src/vite/plugin/transform/hooks/transform/stages/5.create-virtual-modules/production/index.ts @@ -1,7 +1,11 @@ -import type { VirtualCssModuleId } from "#@/vite/virtualCssModuleId"; -import { buildVirtualCssModuleId } from "#@/vite/virtualCssModuleId"; -import type { VirtualGlobalStyleId } from "#@/vite/virtualGlobalStyleId"; -import { buildVirtualGlobalStyleId } from "#@/vite/virtualGlobalStyleId"; +import { + type VirtualCssModuleId, + buildVirtualCssModuleId, +} from "#@/vite/types/virtualCssModuleId"; +import { + type VirtualGlobalStyleId, + buildVirtualGlobalStyleId, +} from "#@/vite/types/virtualGlobalStyleId"; export type BuildForProductionArgs = { importerPath: string; diff --git a/packages/core/src/vite/hooks/transform/stages/5.create-virtual-modules/virtualCss.test.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/5.create-virtual-modules/virtualCss.test.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/5.create-virtual-modules/virtualCss.test.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/5.create-virtual-modules/virtualCss.test.ts diff --git a/packages/core/src/vite/hooks/transform/stages/6.assign-styles-to-variables/assign.test.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/6.assign-styles-to-variables/assign.test.ts similarity index 70% rename from packages/core/src/vite/hooks/transform/stages/6.assign-styles-to-variables/assign.test.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/6.assign-styles-to-variables/assign.test.ts index daf30c0..8ace482 100644 --- a/packages/core/src/vite/hooks/transform/stages/6.assign-styles-to-variables/assign.test.ts +++ b/packages/core/src/vite/plugin/transform/hooks/transform/stages/6.assign-styles-to-variables/assign.test.ts @@ -15,15 +15,15 @@ test("should replace variable initializations with `styles[xxx]`, then append `i }); await build(buildInlineConfig(moduleId)); - const { transformed, jsToCssModuleLookup } = transformResult[moduleId] ?? {}; - assert(transformed && jsToCssModuleLookup); + const { transformed, cssLookupApi } = transformResult[moduleId] ?? {}; + assert(transformed && cssLookupApi); assert(transformed); expect(transformed).not.toMatch(styleA); expect(transformed).not.toMatch("export const styleB"); expect(transformed).toMatch(notCss); - assert(jsToCssModuleLookup.has(moduleId)); + assert(cssLookupApi.cssModule.getFromJsPath(moduleId)); }); test("should remove temporal variables, import global styles", async ({ @@ -37,13 +37,13 @@ test("should remove temporal variables, import global styles", async ({ }); await build(buildInlineConfig(moduleId)); - const { transformed, jsToGlobalStyleLookup } = - transformResult[moduleId] ?? {}; - assert(transformed && jsToGlobalStyleLookup); + const { transformed, cssLookupApi } = transformResult[moduleId] ?? {}; + assert(transformed && cssLookupApi); assert(transformed); expect(transformed).not.toMatch("box-sizing"); - assert(jsToGlobalStyleLookup.has(moduleId)); + + assert(cssLookupApi.globalStyle.getFromJsPath(moduleId)); }); test("should work with a file using both `css` and `injectGlobal`", async ({ @@ -57,14 +57,13 @@ test("should work with a file using both `css` and `injectGlobal`", async ({ }); await build(buildInlineConfig(moduleId)); - const { transformed, jsToGlobalStyleLookup, jsToCssModuleLookup } = - transformResult[moduleId] ?? {}; - assert(transformed && jsToGlobalStyleLookup && jsToCssModuleLookup); + const { transformed, cssLookupApi } = transformResult[moduleId] ?? {}; + assert(transformed && cssLookupApi); assert(transformed); expect(transformed).not.toMatch("aliceblue"); expect(transformed).not.toMatch("box-sizing"); - assert(jsToCssModuleLookup.has(moduleId)); - assert(jsToGlobalStyleLookup.has(moduleId)); + assert(cssLookupApi.cssModule.getFromJsPath(moduleId)); + assert(cssLookupApi.globalStyle.getFromJsPath(moduleId)); }); diff --git a/packages/core/src/vite/hooks/transform/stages/6.assign-styles-to-variables/assignStyles.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/6.assign-styles-to-variables/assignStyles.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/6.assign-styles-to-variables/assignStyles.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/6.assign-styles-to-variables/assignStyles.ts diff --git a/packages/core/src/vite/hooks/transform/stages/6.assign-styles-to-variables/fixtures/globalOnly.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/6.assign-styles-to-variables/fixtures/globalOnly.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/6.assign-styles-to-variables/fixtures/globalOnly.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/6.assign-styles-to-variables/fixtures/globalOnly.ts diff --git a/packages/core/src/vite/hooks/transform/stages/6.assign-styles-to-variables/fixtures/mixed.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/6.assign-styles-to-variables/fixtures/mixed.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/6.assign-styles-to-variables/fixtures/mixed.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/6.assign-styles-to-variables/fixtures/mixed.ts diff --git a/packages/core/src/vite/hooks/transform/stages/6.assign-styles-to-variables/fixtures/simple.tsx b/packages/core/src/vite/plugin/transform/hooks/transform/stages/6.assign-styles-to-variables/fixtures/simple.tsx similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/6.assign-styles-to-variables/fixtures/simple.tsx rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/6.assign-styles-to-variables/fixtures/simple.tsx diff --git a/packages/core/src/vite/hooks/transform/stages/6.assign-styles-to-variables/importGlobalStyle.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/6.assign-styles-to-variables/importGlobalStyle.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/6.assign-styles-to-variables/importGlobalStyle.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/6.assign-styles-to-variables/importGlobalStyle.ts diff --git a/packages/core/src/vite/hooks/transform/stages/6.assign-styles-to-variables/index.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/6.assign-styles-to-variables/index.ts similarity index 92% rename from packages/core/src/vite/hooks/transform/stages/6.assign-styles-to-variables/index.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/6.assign-styles-to-variables/index.ts index 1af4718..5ce8a7b 100644 --- a/packages/core/src/vite/hooks/transform/stages/6.assign-styles-to-variables/index.ts +++ b/packages/core/src/vite/plugin/transform/hooks/transform/stages/6.assign-styles-to-variables/index.ts @@ -1,7 +1,7 @@ import type { types } from "@babel/core"; import { transformFromAstAsync } from "@babel/core"; -import type { VirtualCssModuleId } from "#@/vite/virtualCssModuleId"; -import type { VirtualGlobalStyleId } from "#@/vite/virtualGlobalStyleId"; +import type { VirtualCssModuleId } from "#@/vite/types/virtualCssModuleId"; +import type { VirtualGlobalStyleId } from "#@/vite/types/virtualGlobalStyleId"; import type { CapturedVariableNames } from "../1.capture-tagged-styles/types"; import { assignStylesPlugin } from "./assignStyles"; import { importGlobalStylePlugin } from "./importGlobalStyle"; diff --git a/packages/core/src/vite/hooks/transform/stages/6.assign-styles-to-variables/removeTemporalVariable.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/6.assign-styles-to-variables/removeTemporalVariable.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/6.assign-styles-to-variables/removeTemporalVariable.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/6.assign-styles-to-variables/removeTemporalVariable.ts diff --git a/packages/core/src/vite/hooks/transform/stages/6.assign-styles-to-variables/replaceOriginalVariable.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/6.assign-styles-to-variables/replaceOriginalVariable.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/6.assign-styles-to-variables/replaceOriginalVariable.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/6.assign-styles-to-variables/replaceOriginalVariable.ts diff --git a/packages/core/src/vite/hooks/transform/stages/6.assign-styles-to-variables/types.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/6.assign-styles-to-variables/types.ts similarity index 68% rename from packages/core/src/vite/hooks/transform/stages/6.assign-styles-to-variables/types.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/6.assign-styles-to-variables/types.ts index bcb4818..2f7914c 100644 --- a/packages/core/src/vite/hooks/transform/stages/6.assign-styles-to-variables/types.ts +++ b/packages/core/src/vite/plugin/transform/hooks/transform/stages/6.assign-styles-to-variables/types.ts @@ -1,5 +1,5 @@ -import type { VirtualCssModuleId } from "#@/vite/virtualCssModuleId"; -import type { VirtualGlobalStyleId } from "#@/vite/virtualGlobalStyleId"; +import type { VirtualCssModuleId } from "#@/vite/types/virtualCssModuleId"; +import type { VirtualGlobalStyleId } from "#@/vite/types/virtualGlobalStyleId"; import type { CapturedVariableNames } from "../1.capture-tagged-styles/types"; export type Options = { diff --git a/packages/core/src/vite/hooks/transform/stages/fixtures/buildModuleId.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/fixtures/buildModuleId.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/stages/fixtures/buildModuleId.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/fixtures/buildModuleId.ts diff --git a/packages/core/src/vite/hooks/transform/stages/fixtures/extendedTest.ts b/packages/core/src/vite/plugin/transform/hooks/transform/stages/fixtures/extendedTest.ts similarity index 93% rename from packages/core/src/vite/hooks/transform/stages/fixtures/extendedTest.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/stages/fixtures/extendedTest.ts index 1e8a396..d87dd24 100644 --- a/packages/core/src/vite/hooks/transform/stages/fixtures/extendedTest.ts +++ b/packages/core/src/vite/plugin/transform/hooks/transform/stages/fixtures/extendedTest.ts @@ -1,7 +1,7 @@ import type { InlineConfig } from "vite"; import { test as t } from "vitest"; import { plugin as plugin_ } from "#@/vite/plugin"; -import type { TransformResult } from "#@/vite/types"; +import type { TransformResult } from "#@/vite/plugin/transform/types"; type TestContext = { plugin: ReturnType; diff --git a/packages/core/src/vite/hooks/transform/types.ts b/packages/core/src/vite/plugin/transform/hooks/transform/types.ts similarity index 100% rename from packages/core/src/vite/hooks/transform/types.ts rename to packages/core/src/vite/plugin/transform/hooks/transform/types.ts diff --git a/packages/core/src/vite/plugin/transform/index.ts b/packages/core/src/vite/plugin/transform/index.ts new file mode 100644 index 0000000..8a48046 --- /dev/null +++ b/packages/core/src/vite/plugin/transform/index.ts @@ -0,0 +1,116 @@ +import { parseAsync } from "@babel/core"; +import type { Plugin, ResolvedConfig, ViteDevServer } from "vite"; +import { extractTargetFilePath } from "#@/vite/helpers/extractTargetFilePath"; +import type { PluginOption } from "#@/vite/types"; +import { type CssLookupApi, cssLookupPluginName } from "../cssLookup"; +import { transform } from "./hooks/transform"; +import type { OnExitTransform } from "./types"; + +export function transformPlugin( + options?: Partial & { + onExitTransform?: OnExitTransform; + }, +): Plugin { + let config: ResolvedConfig | null = null; + let server: ViteDevServer | null = null; + const { + babelOptions = {}, + extensions = [".mjs", ".cjs", ".js", ".jsx", ".mts", ".cts", ".ts", ".tsx"], + onExitTransform = async () => {}, + evaluateOptions = {}, + } = options ?? {}; + const include = new Set(options?.includes ?? []); + + let cssLookup: CssLookupApi | null = null; + + return { + name: "casablanca-css:transform", + async transform(code, id) { + if (!config) { + throw new Error("Vite config is not resolved"); + } + if (!cssLookup) { + throw new Error(`Plugin ${cssLookupPluginName} was not found.`); + } + + const path = extractTargetFilePath({ extensions, id, include }); + if (!path) { + return; + } + + const isDev = config.mode === "development"; + + const parsed = await parseAsync(code, { + ...babelOptions, + ast: true, + sourceMaps: isDev ? "inline" : false, + }); + + if (!parsed) { + return; + } + + const transformResult = await transform({ + cssModulesLookupApi: cssLookup.cssModule, + ctx: this, + isDev, + originalAst: parsed, + path, + projectRoot: config.root, + server, + originalCode: code, + evaluateOptions, + }); + if (!transformResult) { + return; + } + + const { cssModule, globalStyle, js, stageResults } = transformResult; + + cssLookup.cssModule.register({ + classNameToStyle: new Map( + cssModule.composedStyles.map(({ style, originalName }) => [ + originalName, + { style, className: originalName }, + ]), + ), + map: cssModule.map || null, + path, + style: cssModule.style, + virtualId: cssModule.importId, + }); + cssLookup.globalStyle.register({ + path, + style: globalStyle.style, + map: globalStyle.map || null, + virtualId: globalStyle.importId, + }); + + await onExitTransform({ + cssLookupApi: cssLookup, + path, + stages: stageResults, + transformed: js.code, + }); + + return { + code: js.code, + map: js.map, + }; + }, + configResolved(config_) { + config = config_; + + const cssLookupPlugin = config.plugins.find( + (p) => p.name === cssLookupPluginName, + ); + if (!cssLookupPlugin) { + throw new Error(`Plugin ${cssLookupPluginName} was not found.`); + } + cssLookup = cssLookupPlugin.api; + }, + async configureServer(server_) { + server = server_; + }, + }; +} diff --git a/packages/core/src/vite/plugin/transform/types.ts b/packages/core/src/vite/plugin/transform/types.ts new file mode 100644 index 0000000..f6c922f --- /dev/null +++ b/packages/core/src/vite/plugin/transform/types.ts @@ -0,0 +1,11 @@ +import type { CssLookupApi } from "../cssLookup"; +import type { StageResults } from "./hooks/transform/types"; + +export type TransformResult = { + path: string; + transformed: string; + cssLookupApi: CssLookupApi; + stages: StageResults; +}; + +export type OnExitTransform = (params: TransformResult) => Promise; diff --git a/packages/core/src/vite/types.ts b/packages/core/src/vite/types.ts deleted file mode 100644 index 3533367..0000000 --- a/packages/core/src/vite/types.ts +++ /dev/null @@ -1,59 +0,0 @@ -import type { TransformOptions } from "vite"; -import type { EvaluateOptions } from "./hooks/transform/stages/3.evaluate-module/types"; -import type { StageResults } from "./hooks/transform/types"; -import type { ResolvedCssModuleId } from "./resolvedCssModuleId"; -import type { ResolvedGlobalStyleId } from "./resolvedGlobalStyleId"; -import type { VirtualCssModuleId } from "./virtualCssModuleId"; -import type { VirtualGlobalStyleId } from "./virtualGlobalStyleId"; - -export type PluginOption = { - babelOptions: TransformOptions; - evaluateOptions: Partial; - extensions: `.${string}`[]; - includes: string[]; -}; - -export type TransformResult = { - path: string; - transformed: string; - cssModulesLookup: CssModulesLookup; - jsToCssModuleLookup: JsToCssModuleLookup; - globalStylesLookup: GlobalStylesLookup; - jsToGlobalStyleLookup: JsToGlobalStyleLookup; - stages: StageResults; -}; - -export type OnExitTransform = (params: TransformResult) => Promise; - -export type CssModulesLookup = Map< - ResolvedCssModuleId, - { - style: string; - map: string | null; - classNameToStyleMap: Map; - } ->; -export type JsToCssModuleLookup = Map< - string, - { - virtualId: VirtualCssModuleId; - resolvedId: ResolvedCssModuleId; - style: string; - } ->; - -export type GlobalStylesLookup = Map< - ResolvedGlobalStyleId, - { - style: string; - map: string | null; - } ->; -export type JsToGlobalStyleLookup = Map< - string, - { - virtualId: VirtualGlobalStyleId; - resolvedId: ResolvedGlobalStyleId; - style: string; - } ->; diff --git a/packages/core/src/vite/types/index.ts b/packages/core/src/vite/types/index.ts new file mode 100644 index 0000000..5d74a66 --- /dev/null +++ b/packages/core/src/vite/types/index.ts @@ -0,0 +1 @@ +export type { PluginOption } from "./pluginOption"; diff --git a/packages/core/src/vite/types/pluginOption.ts b/packages/core/src/vite/types/pluginOption.ts new file mode 100644 index 0000000..88d2cb3 --- /dev/null +++ b/packages/core/src/vite/types/pluginOption.ts @@ -0,0 +1,9 @@ +import type { TransformOptions } from "vite"; +import type { EvaluateOptions } from "../plugin/transform/hooks/transform/stages/3.evaluate-module/types"; + +export type PluginOption = { + babelOptions: TransformOptions; + evaluateOptions: Partial; + extensions: `.${string}`[]; + includes: string[]; +}; diff --git a/packages/core/src/vite/resolvedCssModuleId/buildResolvedCssModuleIdFromVirtualCssModuleId.ts b/packages/core/src/vite/types/resolvedCssModuleId/buildResolvedCssModuleId.ts similarity index 87% rename from packages/core/src/vite/resolvedCssModuleId/buildResolvedCssModuleIdFromVirtualCssModuleId.ts rename to packages/core/src/vite/types/resolvedCssModuleId/buildResolvedCssModuleId.ts index 234e173..3681fb2 100644 --- a/packages/core/src/vite/resolvedCssModuleId/buildResolvedCssModuleIdFromVirtualCssModuleId.ts +++ b/packages/core/src/vite/types/resolvedCssModuleId/buildResolvedCssModuleId.ts @@ -3,7 +3,7 @@ import type { VirtualCssModuleId } from "../virtualCssModuleId"; import { isVirtualCssModuleId } from "../virtualCssModuleId"; import type { ResolvedCssModuleId } from "./types"; -export function buildResolvedCssModuleIdFromVirtualCssModuleId({ +export function buildResolvedCssModuleId({ id, }: { id: VirtualCssModuleId; diff --git a/packages/core/src/vite/resolvedCssModuleId/index.ts b/packages/core/src/vite/types/resolvedCssModuleId/index.ts similarity index 50% rename from packages/core/src/vite/resolvedCssModuleId/index.ts rename to packages/core/src/vite/types/resolvedCssModuleId/index.ts index 9ff0e10..83036ad 100644 --- a/packages/core/src/vite/resolvedCssModuleId/index.ts +++ b/packages/core/src/vite/types/resolvedCssModuleId/index.ts @@ -1,3 +1,3 @@ -export { buildResolvedCssModuleIdFromVirtualCssModuleId } from "./buildResolvedCssModuleIdFromVirtualCssModuleId"; +export { buildResolvedCssModuleId } from "./buildResolvedCssModuleId"; export { isResolvedCssModuleId } from "./isResolvedCssModuleId"; export type { ResolvedCssModuleId } from "./types"; diff --git a/packages/core/src/vite/resolvedCssModuleId/isResolvedCssModuleId.ts b/packages/core/src/vite/types/resolvedCssModuleId/isResolvedCssModuleId.ts similarity index 100% rename from packages/core/src/vite/resolvedCssModuleId/isResolvedCssModuleId.ts rename to packages/core/src/vite/types/resolvedCssModuleId/isResolvedCssModuleId.ts diff --git a/packages/core/src/vite/resolvedCssModuleId/types.ts b/packages/core/src/vite/types/resolvedCssModuleId/types.ts similarity index 100% rename from packages/core/src/vite/resolvedCssModuleId/types.ts rename to packages/core/src/vite/types/resolvedCssModuleId/types.ts diff --git a/packages/core/src/vite/resolvedGlobalStyleId/buildResolvedGlobalStyleIdFromVirtualGlobalStyleId.ts b/packages/core/src/vite/types/resolvedGlobalStyleId/buildResolvedGlobalStyleId.ts similarity index 86% rename from packages/core/src/vite/resolvedGlobalStyleId/buildResolvedGlobalStyleIdFromVirtualGlobalStyleId.ts rename to packages/core/src/vite/types/resolvedGlobalStyleId/buildResolvedGlobalStyleId.ts index 116c797..e7962f3 100644 --- a/packages/core/src/vite/resolvedGlobalStyleId/buildResolvedGlobalStyleIdFromVirtualGlobalStyleId.ts +++ b/packages/core/src/vite/types/resolvedGlobalStyleId/buildResolvedGlobalStyleId.ts @@ -5,7 +5,7 @@ import { } from "../virtualGlobalStyleId"; import type { ResolvedGlobalStyleId } from "./types"; -export function buildResolvedGlobalStyleIdFromVirtualGlobalStyleId({ +export function buildResolvedGlobalStyleId({ id, }: { id: VirtualGlobalStyleId; diff --git a/packages/core/src/vite/resolvedGlobalStyleId/index.ts b/packages/core/src/vite/types/resolvedGlobalStyleId/index.ts similarity index 50% rename from packages/core/src/vite/resolvedGlobalStyleId/index.ts rename to packages/core/src/vite/types/resolvedGlobalStyleId/index.ts index 66cf44c..f61fbcb 100644 --- a/packages/core/src/vite/resolvedGlobalStyleId/index.ts +++ b/packages/core/src/vite/types/resolvedGlobalStyleId/index.ts @@ -1,3 +1,3 @@ -export { buildResolvedGlobalStyleIdFromVirtualGlobalStyleId } from "./buildResolvedGlobalStyleIdFromVirtualGlobalStyleId"; +export { buildResolvedGlobalStyleId } from "./buildResolvedGlobalStyleId"; export { isResolvedGlobalStyleId } from "./isResolvedGlobalStyleId"; export type { ResolvedGlobalStyleId } from "./types"; diff --git a/packages/core/src/vite/resolvedGlobalStyleId/isResolvedGlobalStyleId.ts b/packages/core/src/vite/types/resolvedGlobalStyleId/isResolvedGlobalStyleId.ts similarity index 100% rename from packages/core/src/vite/resolvedGlobalStyleId/isResolvedGlobalStyleId.ts rename to packages/core/src/vite/types/resolvedGlobalStyleId/isResolvedGlobalStyleId.ts diff --git a/packages/core/src/vite/resolvedGlobalStyleId/types.ts b/packages/core/src/vite/types/resolvedGlobalStyleId/types.ts similarity index 100% rename from packages/core/src/vite/resolvedGlobalStyleId/types.ts rename to packages/core/src/vite/types/resolvedGlobalStyleId/types.ts diff --git a/packages/core/src/vite/virtualCssModuleId/buildVirtualCssModuleId.ts b/packages/core/src/vite/types/virtualCssModuleId/buildVirtualCssModuleId.ts similarity index 100% rename from packages/core/src/vite/virtualCssModuleId/buildVirtualCssModuleId.ts rename to packages/core/src/vite/types/virtualCssModuleId/buildVirtualCssModuleId.ts diff --git a/packages/core/src/vite/virtualCssModuleId/index.ts b/packages/core/src/vite/types/virtualCssModuleId/index.ts similarity index 100% rename from packages/core/src/vite/virtualCssModuleId/index.ts rename to packages/core/src/vite/types/virtualCssModuleId/index.ts diff --git a/packages/core/src/vite/virtualCssModuleId/isVirtualCssModuleId.ts b/packages/core/src/vite/types/virtualCssModuleId/isVirtualCssModuleId.ts similarity index 100% rename from packages/core/src/vite/virtualCssModuleId/isVirtualCssModuleId.ts rename to packages/core/src/vite/types/virtualCssModuleId/isVirtualCssModuleId.ts diff --git a/packages/core/src/vite/virtualCssModuleId/types.ts b/packages/core/src/vite/types/virtualCssModuleId/types.ts similarity index 100% rename from packages/core/src/vite/virtualCssModuleId/types.ts rename to packages/core/src/vite/types/virtualCssModuleId/types.ts diff --git a/packages/core/src/vite/virtualGlobalStyleId/buildVirtualGlobalStyleId.ts b/packages/core/src/vite/types/virtualGlobalStyleId/buildVirtualGlobalStyleId.ts similarity index 100% rename from packages/core/src/vite/virtualGlobalStyleId/buildVirtualGlobalStyleId.ts rename to packages/core/src/vite/types/virtualGlobalStyleId/buildVirtualGlobalStyleId.ts diff --git a/packages/core/src/vite/virtualGlobalStyleId/index.ts b/packages/core/src/vite/types/virtualGlobalStyleId/index.ts similarity index 100% rename from packages/core/src/vite/virtualGlobalStyleId/index.ts rename to packages/core/src/vite/types/virtualGlobalStyleId/index.ts diff --git a/packages/core/src/vite/virtualGlobalStyleId/isVirtualGlobalStyleId.ts b/packages/core/src/vite/types/virtualGlobalStyleId/isVirtualGlobalStyleId.ts similarity index 100% rename from packages/core/src/vite/virtualGlobalStyleId/isVirtualGlobalStyleId.ts rename to packages/core/src/vite/types/virtualGlobalStyleId/isVirtualGlobalStyleId.ts diff --git a/packages/core/src/vite/virtualGlobalStyleId/types.ts b/packages/core/src/vite/types/virtualGlobalStyleId/types.ts similarity index 100% rename from packages/core/src/vite/virtualGlobalStyleId/types.ts rename to packages/core/src/vite/types/virtualGlobalStyleId/types.ts diff --git a/packages/styled/src/vite/hooks/transform/stages/1.create-classNames-for-components/createClassNames.test.ts b/packages/styled/src/vite/hooks/transform/stages/1.create-classNames-for-components/createClassNames.test.ts index ab21db5..a628107 100644 --- a/packages/styled/src/vite/hooks/transform/stages/1.create-classNames-for-components/createClassNames.test.ts +++ b/packages/styled/src/vite/hooks/transform/stages/1.create-classNames-for-components/createClassNames.test.ts @@ -27,5 +27,4 @@ test("should create css-tagged styles from styled-tagged components", async ({ expect(code).not.toMatch("NotExportedComponent = styled"); expect(code).not.toMatch("${(p) =>}"); expect(code).toMatch(/\${"var\(--.+\)"}/); - console.log(code); }); diff --git a/packages/styled/src/vite/plugin.ts b/packages/styled/src/vite/plugin.ts index d0d55ac..b3da97e 100644 --- a/packages/styled/src/vite/plugin.ts +++ b/packages/styled/src/vite/plugin.ts @@ -25,7 +25,7 @@ export function plugin( const include = new Set(options?.includes ?? []); return { - name: "casablanca:react", + name: "casablanca-css:styled", enforce: "pre", async transform(code, id) { if (!config) {