@yak/react 10.0.0-rc.0 → 10.0.0-rc.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +12 -0
- package/dist/context/baseContext.d.ts +1 -2
- package/dist/context/index.d.ts +3 -4
- package/dist/context/index.server.d.ts +2 -3
- package/dist/cross-file-resolver/index.d.ts +12 -12
- package/dist/cross-file-resolver/index.js +39 -5
- package/dist/cross-file-resolver/index.js.map +1 -1
- package/dist/index.d.ts +8 -8
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/dist/internal.d.ts +139 -139
- package/dist/isolated-source-eval/index.d.ts +2 -2
- package/dist/jsx-dev-runtime.js.map +1 -1
- package/dist/jsx-runtime.d.ts +2 -2
- package/dist/jsx-runtime.js.map +1 -1
- package/dist/loaders/{turbo-loader.d.cts → turbo-loader.d.ts} +3 -3
- package/dist/loaders/{turbo-loader.cjs → turbo-loader.js} +60 -47
- package/dist/loaders/turbo-loader.js.map +1 -0
- package/dist/loaders/vite-plugin.d.ts +13 -21
- package/dist/loaders/vite-plugin.js +43 -36
- package/dist/loaders/vite-plugin.js.map +1 -1
- package/dist/loaders/{webpack-loader.d.cts → webpack-loader.d.ts} +3 -3
- package/dist/loaders/{webpack-loader.cjs → webpack-loader.js} +50 -37
- package/dist/loaders/webpack-loader.js.map +1 -0
- package/dist/rsbuild/index.d.ts +2 -2
- package/dist/rsbuild/index.js +1 -2
- package/dist/rsbuild/index.js.map +1 -1
- package/dist/static/index.js +1 -1
- package/dist/static/index.js.map +1 -1
- package/dist/withYak/index.d.ts +15 -24
- package/dist/withYak/index.js +7 -13
- package/dist/withYak/index.js.map +1 -1
- package/loaders/lib/resolveCrossFileSelectors.ts +0 -1
- package/loaders/turbo-loader.ts +11 -7
- package/loaders/webpack-loader.ts +3 -6
- package/package.json +45 -104
- package/rsbuild/index.ts +2 -3
- package/withYak/index.ts +7 -21
- package/dist/context/baseContext.cjs +0 -9
- package/dist/context/baseContext.cjs.map +0 -1
- package/dist/context/baseContext.d.cts +0 -6
- package/dist/context/index.cjs +0 -45
- package/dist/context/index.cjs.map +0 -1
- package/dist/context/index.d.cts +0 -21
- package/dist/context/index.server.cjs +0 -47
- package/dist/context/index.server.cjs.map +0 -1
- package/dist/context/index.server.d.cts +0 -10
- package/dist/index.cjs +0 -2
- package/dist/index.cjs.map +0 -1
- package/dist/index.d.cts +0 -320
- package/dist/internal.cjs +0 -544
- package/dist/internal.cjs.map +0 -1
- package/dist/internal.d.cts +0 -452
- package/dist/jsx-dev-runtime.cjs +0 -2
- package/dist/jsx-dev-runtime.cjs.map +0 -1
- package/dist/jsx-dev-runtime.d.cts +0 -7
- package/dist/jsx-runtime.cjs +0 -2
- package/dist/jsx-runtime.cjs.map +0 -1
- package/dist/jsx-runtime.d.cts +0 -38
- package/dist/loaders/turbo-loader.cjs.map +0 -1
- package/dist/loaders/webpack-loader.cjs.map +0 -1
- package/dist/static/index.cjs +0 -2
- package/dist/static/index.cjs.map +0 -1
- package/dist/static/index.d.cts +0 -28
- package/dist/withYak/index.cjs +0 -208
- package/dist/withYak/index.cjs.map +0 -1
- package/dist/withYak/index.d.cts +0 -121
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../withYak/allow-global-css.ts","../../../yak-internals/config.ts","../../withYak/index.ts"],"sourcesContent":["import { existsSync } from \"node:fs\";\nimport path from \"node:path\";\n\ninterface WebpackConfig {\n module?: { rules?: unknown[] };\n}\n\ninterface Rule {\n test?: unknown;\n issuer?: unknown;\n use?: unknown;\n oneOf?: unknown;\n rules?: unknown;\n}\n\nexport function hasAppDir(projectDir: string): boolean {\n return (\n // mirrors next.js's `findDir(dir, \"app\")`\n // https://github.com/vercel/next.js/blob/v16.3.4/packages/next/src/lib/find-pages-dir.ts#L4-L13\n existsSync(path.join(projectDir, \"app\")) || existsSync(path.join(projectDir, \"src\", \"app\"))\n );\n}\n\n/**\n * Next.js (pages router) only allows global CSS imports from `_app`.\n * Everywhere else it expects CSS Modules. Yak's co-located `*.yak.css`\n * files are plain global CSS, because yak already hashes the class names\n * itself, so there's no risk of leaking styles\n *\n * Next.js has no option to allow this, so we copy its `_app` global CSS\n * rule without the `_app` issuer check and limit the copy to `.yak.css`.\n * The copy goes to the start of the same `oneOf`, so it matches before\n * Next's error rules.\n */\nexport function allowYakGlobalCss(webpackConfig: WebpackConfig) {\n const rules = webpackConfig.module?.rules;\n if (!Array.isArray(rules)) {\n return;\n }\n\n // Next.js's internal `regexCssGlobal` source\n // https://github.com/vercel/next.js/blob/v16.3.4/packages/next/src/build/webpack/config/blocks/css/index.ts#L23\n const nextGlobalCssRegExpSource = \"(?<!\\\\.module)\\\\.css$\";\n\n const isRule = (value: unknown): value is Rule =>\n typeof value === \"object\" && value !== null && !Array.isArray(value);\n\n // Next.js sets `issuer: { and: [ctx.customAppFile] }`, where\n // `customAppFile` is a RegExp for the path of `pages/_app`\n // https://github.com/vercel/next.js/blob/v16.3.4/packages/next/src/build/webpack-config.ts#L2550-L2552\n const hasAppIssuer = (rule: Rule): boolean => {\n if (!isRule(rule.issuer)) return false;\n const and = (rule.issuer as { and?: unknown }).and;\n return Array.isArray(and) && and[0] instanceof RegExp && and[0].source.endsWith(\"_app\");\n };\n\n const isAppGlobalCssRule = (rule: Rule): boolean =>\n rule.test instanceof RegExp &&\n rule.test.source === nextGlobalCssRegExpSource &&\n hasAppIssuer(rule) &&\n Array.isArray(rule.use);\n\n const findAppRule = (ruleList: unknown): { oneOf: unknown[]; appRule: Rule } | undefined => {\n if (!Array.isArray(ruleList)) return undefined;\n for (const rule of ruleList) {\n if (!isRule(rule)) continue;\n if (Array.isArray(rule.oneOf)) {\n const appRule = rule.oneOf.find(\n (item): item is Rule => isRule(item) && isAppGlobalCssRule(item),\n );\n if (appRule) return { oneOf: rule.oneOf, appRule };\n }\n const found = findAppRule(rule.oneOf) ?? findAppRule(rule.rules);\n if (found) return found;\n }\n return undefined;\n };\n\n const found = findAppRule(rules);\n if (!found) {\n console.warn(\n \"@yak/react: could not find the next.js global-CSS rules. \" +\n \"Please report this issue with your Next.js version at \" +\n \"https://github.com/DigitecGalaxus/next-yak/issues/new\",\n );\n return;\n }\n\n found.oneOf.unshift({\n test: /\\.yak\\.css$/,\n sideEffects: true,\n use: [...(found.appRule.use as unknown[])],\n });\n}\n","/// <reference types=\"node\" />\nimport { existsSync } from \"node:fs\";\nimport path from \"node:path\";\n\nexport type YakConfigOptions = {\n /**\n * Generate compact CSS class and variable names.\n * @defaultValue\n * enabled if NODE_ENV is set to `production`, otherwise disabled\n */\n minify?: boolean;\n contextPath?: string;\n /**\n * Optional prefix for generated CSS identifiers.\n * This can be used to ensure unique class names across different applications\n * or to add organization-specific prefixes.\n */\n prefix?: string;\n /**\n * Adds `displayName` to each component for better React DevTools debugging\n * - Enabled by default in development mode\n * - Disabled by default in production\n * - Increases bundle size slightly when enabled\n */\n displayNames?: boolean;\n /**\n * Fold statically known styles at build time: JSX usages of fully static\n * styled components become plain DOM elements, and a static `css` prop\n * becomes a plain `className`. Both skip the runtime wrapper and merge calls.\n * @defaultValue true\n */\n foldStatic?: boolean;\n /**\n * Fail the build when a `css` prop has a value @yak/react can't handle\n * (e.g. an array, an object or a plain string). @yak/react claims the `css`\n * prop, so a malformed value is almost always a mistake worth surfacing.\n *\n * Set to `false` to leave such props untouched instead, e.g. when another\n * library on the same element uses its own `css` prop.\n * @defaultValue true\n */\n strictCssProp?: boolean;\n experiments?: {\n /**\n * Debug logging for transformed files.\n * - `true` - log all files\n * - `object` - filter by pattern and/or output types (at least one required)\n */\n debug?:\n | true\n | { pattern: string; types?: Array<\"ts\" | \"css\" | \"css-resolved\"> }\n | { pattern?: string; types: Array<\"ts\" | \"css\" | \"css-resolved\"> };\n transpilationMode?: \"CssModule\" | \"Css\";\n /**\n * Suppress deprecation warnings for :global() selectors during migration period\n * @defaultValue false\n */\n suppressDeprecationWarnings?: boolean;\n };\n};\n\n/**\n * Build the base yak-swc plugin options shared by every bundler integration\n * (webpack, turbopack, vite, rsbuild). The caller adds the bundler-specific\n * `importMode` on top.\n *\n * @param yakOptions - Yak configuration options\n * @param basePath - Base path used by yak-swc to derive stable identifiers\n */\nexport function buildYakPluginOptions(yakOptions: YakConfigOptions, basePath: string) {\n const minify = yakOptions.minify ?? process.env.NODE_ENV === \"production\";\n return {\n minify,\n basePath,\n prefix: yakOptions.prefix,\n displayNames: yakOptions.displayNames ?? !minify,\n foldStatic: yakOptions.foldStatic ?? true,\n strictCssProp: yakOptions.strictCssProp ?? true,\n suppressDeprecationWarnings: yakOptions.experiments?.suppressDeprecationWarnings ?? false,\n reactRefreshReg: true,\n };\n}\n\n/**\n * Try to resolve yak\n */\nexport function resolveYakContext(contextPath: string | undefined, cwd: string) {\n const yakContext = contextPath\n ? path.resolve(cwd, contextPath)\n : path.resolve(cwd, \"yak.context\");\n const extensions = [\"\", \".ts\", \".tsx\", \".js\", \".jsx\"];\n for (const extension in extensions) {\n const fileName = yakContext + extensions[extension];\n if (existsSync(fileName)) {\n return fileName;\n }\n }\n if (contextPath) {\n throw new Error(`Could not find yak context file at ${yakContext}`);\n }\n}\n","/// <reference types=\"node\" />\nimport type { NextConfig } from \"next\";\nimport path, { dirname } from \"node:path\";\nimport { fileURLToPath } from \"node:url\";\nimport { allowYakGlobalCss, hasAppDir } from \"./allow-global-css.ts\";\nimport {\n buildYakPluginOptions,\n resolveYakContext,\n type YakConfigOptions,\n} from \"yak-internals/config\";\n\nexport { buildYakPluginOptions, resolveYakContext } from \"yak-internals/config\";\nexport type { YakConfigOptions } from \"yak-internals/config\";\n\nconst currentDir =\n typeof __dirname !== \"undefined\" ? __dirname : dirname(fileURLToPath(import.meta.url));\n\nconst addYak = (yakOptions: YakConfigOptions, nextConfig: NextConfig) => {\n const yakPluginOptions = buildYakPluginOptions(yakOptions, currentDir);\n\n const transpilation = yakOptions.experiments?.transpilationMode ?? \"CssModule\";\n const cssExtension = transpilation === \"CssModule\" ? \".yak.module.css\" : \".yak.css\";\n\n if (process.env.TURBOPACK === \"1\" || process.env.TURBOPACK === \"auto\") {\n addYakTurbopack(nextConfig, yakOptions, {\n ...yakPluginOptions,\n importMode: {\n value: \"data:text/css;base64,\",\n transpilation: \"Css\",\n encoding: \"Base64\",\n },\n });\n } else {\n addYakWebpack(nextConfig, yakOptions, {\n ...yakPluginOptions,\n importMode: {\n value: `./{{__BASE_NAME__}}${cssExtension}!=!./{{__BASE_NAME__}}?./{{__BASE_NAME__}}${cssExtension}`,\n transpilation,\n encoding: \"None\",\n },\n });\n }\n return nextConfig;\n};\n\n/**\n * Configure Turbopack with yak loader for CSS-in-JS transformation\n * @param nextConfig - Next.js configuration object\n * @param yakOptions - Yak configuration options\n * @param yakPluginOptions - Processed plugin options for yak-swc\n */\nfunction addYakTurbopack(\n nextConfig: NextConfig,\n yakOptions: YakConfigOptions,\n yakPluginOptions: {\n minify: boolean;\n basePath: string;\n prefix?: string;\n displayNames: boolean;\n foldStatic: boolean;\n strictCssProp: boolean;\n importMode: {\n value: string;\n transpilation: string;\n encoding: string;\n };\n },\n) {\n // turbopack can't handle options with undefined values, so we remove them\n const yakLoader = removeUndefinedRecursive({\n loader: path.join(currentDir, \"../loaders/turbo-loader.cjs\"),\n options: {\n yakOptions: yakOptions,\n yakPluginOptions: yakPluginOptions,\n },\n }) as { loader: string; options: {} };\n\n nextConfig.turbopack ||= {};\n nextConfig.turbopack.rules ||= {};\n\n const ruleKey = \"*.{js,jsx,cjs,mjs,ts,tsx,cts,mts}\";\n const rule = {\n loaders: [] as { loader: string; options: {} }[],\n ...nextConfig.turbopack.rules[ruleKey],\n };\n rule.loaders.push(yakLoader);\n nextConfig.turbopack.rules[ruleKey] = rule;\n\n // Configure resolveAlias for custom yak context (similar to webpack)\n // This allows users to provide a custom context file that will be used\n // instead of the default baseContext\n const yakContext = resolveYakContext(yakOptions.contextPath, process.cwd());\n if (yakContext) {\n nextConfig.turbopack.resolveAlias ||= {};\n nextConfig.turbopack.resolveAlias[\"@yak/react/context/baseContext\"] =\n // This is a hack around the fact that turbopack currently only supports relative paths\n // turbopack: \"server relative imports are not implemented yet\"\n // Relative is quite dangerous here as it relies on the cwd being the starting point\n `./${path.relative(process.cwd(), yakContext)}`;\n }\n}\n\n/**\n * Configure Webpack with yak SWC plugin and webpack loader for CSS-in-JS transformation\n * @param nextConfig - Next.js configuration object\n * @param yakOptions - Yak configuration options\n * @param yakPluginOptions - Processed plugin options for yak-swc\n */\nfunction addYakWebpack(\n nextConfig: NextConfig,\n yakOptions: YakConfigOptions,\n yakPluginOptions: {\n minify: boolean;\n basePath: string;\n prefix?: string;\n displayNames: boolean;\n foldStatic: boolean;\n strictCssProp: boolean;\n importMode: {\n value: string;\n transpilation: string;\n encoding: string;\n };\n },\n) {\n // Add SWC plugin for Webpack\n nextConfig.experimental ||= {};\n nextConfig.experimental.swcPlugins ||= [];\n nextConfig.experimental.swcPlugins.push([\"@yak/swc\", yakPluginOptions]);\n\n // Configure webpack loader\n const previousConfig = nextConfig.webpack;\n nextConfig.webpack = (webpackConfig, options) => {\n if (previousConfig) {\n webpackConfig = previousConfig(webpackConfig, options);\n }\n\n if (\n yakOptions.experiments?.transpilationMode === \"Css\" &&\n !options.isServer &&\n !hasAppDir(options.dir)\n ) {\n // Next.js restricts global CSS imports only in the client build of a pages-only project, so only patch its rules there\n allowYakGlobalCss(webpackConfig);\n }\n\n webpackConfig.module.rules.push({\n test:\n yakOptions.experiments?.transpilationMode === \"Css\" ? /\\.yak\\.css$/ : /\\.yak\\.module\\.css$/,\n loader: path.join(currentDir, \"../loaders/webpack-loader.cjs\"),\n options: yakOptions,\n });\n\n // With the following alias the internal @yak/react code\n // is able to import a context which works for server components\n const yakContext = resolveYakContext(\n yakOptions.contextPath,\n webpackConfig.context || process.cwd(),\n );\n if (yakContext) {\n webpackConfig.resolve.alias[\"@yak/react/context/baseContext\"] = yakContext;\n }\n\n return webpackConfig;\n };\n}\n\n/**\n * Recursively removes undefined values from an object or array.\n *\n * This function deeply traverses the input object/array and creates a new structure\n * with all undefined values filtered out. For objects, properties with undefined values\n * are omitted. For arrays, undefined elements are removed from the result.\n *\n * @param obj - The object or array to process\n * @returns A new object/array with undefined values removed, or the original value if no changes were needed\n */\nfunction removeUndefinedRecursive<T>(obj: T): {} {\n if (typeof obj !== \"object\" || obj === null) {\n return obj as {};\n }\n\n if (Array.isArray(obj)) {\n const filtered: unknown[] = [];\n for (let i = 0; i < obj.length; i++) {\n const processed = removeUndefinedRecursive(obj[i]);\n if (processed !== undefined) {\n filtered.push(processed);\n }\n }\n return filtered as {};\n }\n\n const newObj: Record<string, unknown> = {};\n let hasChanges = false;\n\n for (const key in obj) {\n if (Object.prototype.hasOwnProperty.call(obj, key)) {\n const value = removeUndefinedRecursive((obj as any)[key]);\n if (value !== undefined) {\n newObj[key] = value;\n hasChanges = true;\n }\n }\n }\n\n return hasChanges ? (newObj as {}) : obj;\n}\n\n// Wrapper to allow sync, async, and function configuration of Next.js\n/**\n * Add Yak to your Next.js app\n *\n * @usage\n *\n * ```ts\n * // next.config.js\n * const { withYak } = require(\"@yak/react/withYak\");\n * const nextConfig = {\n * // your next config here\n * };\n * module.exports = withYak(nextConfig);\n * ```\n *\n * With a custom yakConfig\n *\n * ```ts\n * // next.config.js\n * const { withYak } = require(\"@yak/react/withYak\");\n * const nextConfig = {\n * // your next config here\n * };\n * const yakConfig = {\n * // Optional prefix for generated CSS identifiers\n * prefix: \"my-app\",\n * // Other yak config options...\n * };\n * module.exports = withYak(yakConfig, nextConfig);\n * ```\n */\nexport const withYak: {\n <\n T extends\n | Record<string, any>\n | ((...args: any[]) => Record<string, any>)\n | ((...args: any[]) => Promise<Record<string, any>>),\n >(\n yakOptions: YakConfigOptions,\n nextConfig: T,\n ): T;\n // no yakConfig\n <\n T extends\n | Record<string, any>\n | ((...args: any[]) => Record<string, any>)\n | ((...args: any[]) => Promise<Record<string, any>>),\n >(\n nextConfig: T,\n _?: undefined,\n ): T;\n} = (maybeYakOptions, nextConfig) => {\n if (nextConfig === undefined) {\n return withYak({}, maybeYakOptions);\n }\n // If the second parameter is present the first parameter must be a YakConfigOptions\n const yakOptions = maybeYakOptions as YakConfigOptions;\n if (typeof nextConfig === \"function\") {\n /**\n * A NextConfig can be a sync or async function\n * https://nextjs.org/docs/pages/api-reference/next-config-js\n * @param {any[]} args\n */\n return (...args) => {\n /** Dynamic Next Configs can be async or sync */\n const config = nextConfig(...args) as NextConfig | Promise<NextConfig>;\n return config instanceof Promise\n ? config.then((config) => addYak(yakOptions, config))\n : addYak(yakOptions, config);\n };\n }\n return addYak(yakOptions, nextConfig);\n};\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../withYak/allow-global-css.ts","../../../yak-internals/config.ts","../../withYak/index.ts"],"sourcesContent":["import { existsSync } from \"node:fs\";\nimport path from \"node:path\";\n\ninterface WebpackConfig {\n module?: { rules?: unknown[] };\n}\n\ninterface Rule {\n test?: unknown;\n issuer?: unknown;\n use?: unknown;\n oneOf?: unknown;\n rules?: unknown;\n}\n\nexport function hasAppDir(projectDir: string): boolean {\n return (\n // mirrors next.js's `findDir(dir, \"app\")`\n // https://github.com/vercel/next.js/blob/v16.3.4/packages/next/src/lib/find-pages-dir.ts#L4-L13\n existsSync(path.join(projectDir, \"app\")) || existsSync(path.join(projectDir, \"src\", \"app\"))\n );\n}\n\n/**\n * Next.js (pages router) only allows global CSS imports from `_app`.\n * Everywhere else it expects CSS Modules. Yak's co-located `*.yak.css`\n * files are plain global CSS, because yak already hashes the class names\n * itself, so there's no risk of leaking styles\n *\n * Next.js has no option to allow this, so we copy its `_app` global CSS\n * rule without the `_app` issuer check and limit the copy to `.yak.css`.\n * The copy goes to the start of the same `oneOf`, so it matches before\n * Next's error rules.\n */\nexport function allowYakGlobalCss(webpackConfig: WebpackConfig) {\n const rules = webpackConfig.module?.rules;\n if (!Array.isArray(rules)) {\n return;\n }\n\n // Next.js's internal `regexCssGlobal` source\n // https://github.com/vercel/next.js/blob/v16.3.4/packages/next/src/build/webpack/config/blocks/css/index.ts#L23\n const nextGlobalCssRegExpSource = \"(?<!\\\\.module)\\\\.css$\";\n\n const isRule = (value: unknown): value is Rule =>\n typeof value === \"object\" && value !== null && !Array.isArray(value);\n\n // Next.js sets `issuer: { and: [ctx.customAppFile] }`, where\n // `customAppFile` is a RegExp for the path of `pages/_app`\n // https://github.com/vercel/next.js/blob/v16.3.4/packages/next/src/build/webpack-config.ts#L2550-L2552\n const hasAppIssuer = (rule: Rule): boolean => {\n if (!isRule(rule.issuer)) return false;\n const and = (rule.issuer as { and?: unknown }).and;\n return Array.isArray(and) && and[0] instanceof RegExp && and[0].source.endsWith(\"_app\");\n };\n\n const isAppGlobalCssRule = (rule: Rule): boolean =>\n rule.test instanceof RegExp &&\n rule.test.source === nextGlobalCssRegExpSource &&\n hasAppIssuer(rule) &&\n Array.isArray(rule.use);\n\n const findAppRule = (ruleList: unknown): { oneOf: unknown[]; appRule: Rule } | undefined => {\n if (!Array.isArray(ruleList)) return undefined;\n for (const rule of ruleList) {\n if (!isRule(rule)) continue;\n if (Array.isArray(rule.oneOf)) {\n const appRule = rule.oneOf.find(\n (item): item is Rule => isRule(item) && isAppGlobalCssRule(item),\n );\n if (appRule) return { oneOf: rule.oneOf, appRule };\n }\n const found = findAppRule(rule.oneOf) ?? findAppRule(rule.rules);\n if (found) return found;\n }\n return undefined;\n };\n\n const found = findAppRule(rules);\n if (!found) {\n console.warn(\n \"@yak/react: could not find the next.js global-CSS rules. \" +\n \"Please report this issue with your Next.js version at \" +\n \"https://github.com/DigitecGalaxus/next-yak/issues/new\",\n );\n return;\n }\n\n found.oneOf.unshift({\n test: /\\.yak\\.css$/,\n sideEffects: true,\n use: [...(found.appRule.use as unknown[])],\n });\n}\n","/// <reference types=\"node\" />\nimport { existsSync } from \"node:fs\";\nimport path from \"node:path\";\n\nexport type YakConfigOptions = {\n /**\n * Generate compact CSS class and variable names.\n * @defaultValue\n * enabled if NODE_ENV is set to `production`, otherwise disabled\n */\n minify?: boolean;\n contextPath?: string;\n /**\n * Optional prefix for generated CSS identifiers.\n * This can be used to ensure unique class names across different applications\n * or to add organization-specific prefixes.\n */\n prefix?: string;\n /**\n * Adds `displayName` to each component for better React DevTools debugging\n * - Enabled by default in development mode\n * - Disabled by default in production\n * - Increases bundle size slightly when enabled\n */\n displayNames?: boolean;\n /**\n * Fold statically known styles at build time: JSX usages of fully static\n * styled components become plain DOM elements, and a static `css` prop\n * becomes a plain `className`. Both skip the runtime wrapper and merge calls.\n * @defaultValue true\n */\n foldStatic?: boolean;\n /**\n * Fail the build when a `css` prop has a value @yak/react can't handle\n * (e.g. an array, an object or a plain string). @yak/react claims the `css`\n * prop, so a malformed value is almost always a mistake worth surfacing.\n *\n * Set to `false` to leave such props untouched instead, e.g. when another\n * library on the same element uses its own `css` prop.\n * @defaultValue true\n */\n strictCssProp?: boolean;\n /**\n * Debug logging for transformed files.\n * - `true` - log all files\n * - `object` - filter by pattern and/or output types (at least one required)\n */\n debug?:\n | true\n | { pattern: string; types?: Array<\"ts\" | \"css\" | \"css-resolved\"> }\n | { pattern?: string; types: Array<\"ts\" | \"css\" | \"css-resolved\"> };\n};\n\n/**\n * Build the base yak-swc plugin options shared by every bundler integration\n * (webpack, turbopack, vite, rsbuild). The caller adds the bundler-specific\n * `importMode` on top.\n *\n * @param yakOptions - Yak configuration options\n * @param basePath - Base path used by yak-swc to derive stable identifiers\n */\nexport function buildYakPluginOptions(yakOptions: YakConfigOptions, basePath: string) {\n const minify = yakOptions.minify ?? process.env.NODE_ENV === \"production\";\n return {\n minify,\n basePath,\n prefix: yakOptions.prefix,\n displayNames: yakOptions.displayNames ?? !minify,\n foldStatic: yakOptions.foldStatic ?? true,\n strictCssProp: yakOptions.strictCssProp ?? true,\n reactRefreshReg: true,\n };\n}\n\n/**\n * Try to resolve yak\n */\nexport function resolveYakContext(contextPath: string | undefined, cwd: string) {\n const yakContext = contextPath\n ? path.resolve(cwd, contextPath)\n : path.resolve(cwd, \"yak.context\");\n const extensions = [\"\", \".ts\", \".tsx\", \".js\", \".jsx\"];\n for (const extension in extensions) {\n const fileName = yakContext + extensions[extension];\n if (existsSync(fileName)) {\n return fileName;\n }\n }\n if (contextPath) {\n throw new Error(`Could not find yak context file at ${yakContext}`);\n }\n}\n","/// <reference types=\"node\" />\nimport type { NextConfig } from \"next\";\nimport path from \"node:path\";\nimport { allowYakGlobalCss, hasAppDir } from \"./allow-global-css.ts\";\nimport {\n buildYakPluginOptions,\n resolveYakContext,\n type YakConfigOptions,\n} from \"yak-internals/config\";\n\nexport { buildYakPluginOptions, resolveYakContext } from \"yak-internals/config\";\nexport type { YakConfigOptions } from \"yak-internals/config\";\n\nconst currentDir = import.meta.dirname;\n\nconst addYak = (yakOptions: YakConfigOptions, nextConfig: NextConfig) => {\n const yakPluginOptions = buildYakPluginOptions(yakOptions, currentDir);\n\n if (process.env.TURBOPACK === \"1\" || process.env.TURBOPACK === \"auto\") {\n addYakTurbopack(nextConfig, yakOptions, {\n ...yakPluginOptions,\n importMode: {\n value: \"data:text/css;base64,\",\n encoding: \"Base64\",\n },\n });\n } else {\n addYakWebpack(nextConfig, yakOptions, {\n ...yakPluginOptions,\n importMode: {\n value: \"./{{__BASE_NAME__}}.yak.css!=!./{{__BASE_NAME__}}?./{{__BASE_NAME__}}.yak.css\",\n encoding: \"None\",\n },\n });\n }\n return nextConfig;\n};\n\n/**\n * Configure Turbopack with yak loader for CSS-in-JS transformation\n * @param nextConfig - Next.js configuration object\n * @param yakOptions - Yak configuration options\n * @param yakPluginOptions - Processed plugin options for yak-swc\n */\nfunction addYakTurbopack(\n nextConfig: NextConfig,\n yakOptions: YakConfigOptions,\n yakPluginOptions: {\n minify: boolean;\n basePath: string;\n prefix?: string;\n displayNames: boolean;\n foldStatic: boolean;\n strictCssProp: boolean;\n importMode: {\n value: string;\n encoding: string;\n };\n },\n) {\n // turbopack can't handle options with undefined values, so we remove them\n const yakLoader = removeUndefinedRecursive({\n loader: path.join(currentDir, \"../loaders/turbo-loader.js\"),\n options: {\n yakOptions: yakOptions,\n yakPluginOptions: yakPluginOptions,\n },\n }) as { loader: string; options: {} };\n\n nextConfig.turbopack ||= {};\n nextConfig.turbopack.rules ||= {};\n\n const ruleKey = \"*.{js,jsx,cjs,mjs,ts,tsx,cts,mts}\";\n const rule = {\n loaders: [] as { loader: string; options: {} }[],\n ...nextConfig.turbopack.rules[ruleKey],\n };\n rule.loaders.push(yakLoader);\n nextConfig.turbopack.rules[ruleKey] = rule;\n\n // Configure resolveAlias for custom yak context (similar to webpack)\n // This allows users to provide a custom context file that will be used\n // instead of the default baseContext\n const yakContext = resolveYakContext(yakOptions.contextPath, process.cwd());\n if (yakContext) {\n nextConfig.turbopack.resolveAlias ||= {};\n nextConfig.turbopack.resolveAlias[\"@yak/react/context/baseContext\"] =\n // This is a hack around the fact that turbopack currently only supports relative paths\n // turbopack: \"server relative imports are not implemented yet\"\n // Relative is quite dangerous here as it relies on the cwd being the starting point\n `./${path.relative(process.cwd(), yakContext)}`;\n }\n}\n\n/**\n * Configure Webpack with yak SWC plugin and webpack loader for CSS-in-JS transformation\n * @param nextConfig - Next.js configuration object\n * @param yakOptions - Yak configuration options\n * @param yakPluginOptions - Processed plugin options for yak-swc\n */\nfunction addYakWebpack(\n nextConfig: NextConfig,\n yakOptions: YakConfigOptions,\n yakPluginOptions: {\n minify: boolean;\n basePath: string;\n prefix?: string;\n displayNames: boolean;\n foldStatic: boolean;\n strictCssProp: boolean;\n importMode: {\n value: string;\n encoding: string;\n };\n },\n) {\n // Add SWC plugin for Webpack\n nextConfig.experimental ||= {};\n nextConfig.experimental.swcPlugins ||= [];\n nextConfig.experimental.swcPlugins.push([\"@yak/swc\", yakPluginOptions]);\n\n // Configure webpack loader\n const previousConfig = nextConfig.webpack;\n nextConfig.webpack = (webpackConfig, options) => {\n if (previousConfig) {\n webpackConfig = previousConfig(webpackConfig, options);\n }\n\n if (!options.isServer && !hasAppDir(options.dir)) {\n // Next.js restricts global CSS imports only in the client build of a pages-only project, so only patch its rules there\n allowYakGlobalCss(webpackConfig);\n }\n\n webpackConfig.module.rules.push({\n test: /\\.yak\\.css$/,\n loader: path.join(currentDir, \"../loaders/webpack-loader.js\"),\n options: yakOptions,\n });\n\n // With the following alias the internal @yak/react code\n // is able to import a context which works for server components\n const yakContext = resolveYakContext(\n yakOptions.contextPath,\n webpackConfig.context || process.cwd(),\n );\n if (yakContext) {\n webpackConfig.resolve.alias[\"@yak/react/context/baseContext\"] = yakContext;\n }\n\n return webpackConfig;\n };\n}\n\n/**\n * Recursively removes undefined values from an object or array.\n *\n * This function deeply traverses the input object/array and creates a new structure\n * with all undefined values filtered out. For objects, properties with undefined values\n * are omitted. For arrays, undefined elements are removed from the result.\n *\n * @param obj - The object or array to process\n * @returns A new object/array with undefined values removed, or the original value if no changes were needed\n */\nfunction removeUndefinedRecursive<T>(obj: T): {} {\n if (typeof obj !== \"object\" || obj === null) {\n return obj as {};\n }\n\n if (Array.isArray(obj)) {\n const filtered: unknown[] = [];\n for (let i = 0; i < obj.length; i++) {\n const processed = removeUndefinedRecursive(obj[i]);\n if (processed !== undefined) {\n filtered.push(processed);\n }\n }\n return filtered as {};\n }\n\n const newObj: Record<string, unknown> = {};\n let hasChanges = false;\n\n for (const key in obj) {\n if (Object.prototype.hasOwnProperty.call(obj, key)) {\n const value = removeUndefinedRecursive((obj as any)[key]);\n if (value !== undefined) {\n newObj[key] = value;\n hasChanges = true;\n }\n }\n }\n\n return hasChanges ? (newObj as {}) : obj;\n}\n\n// Wrapper to allow sync, async, and function configuration of Next.js\n/**\n * Add Yak to your Next.js app\n *\n * @usage\n *\n * ```ts\n * // next.config.js\n * const { withYak } = require(\"@yak/react/withYak\");\n * const nextConfig = {\n * // your next config here\n * };\n * module.exports = withYak(nextConfig);\n * ```\n *\n * With a custom yakConfig\n *\n * ```ts\n * // next.config.js\n * const { withYak } = require(\"@yak/react/withYak\");\n * const nextConfig = {\n * // your next config here\n * };\n * const yakConfig = {\n * // Optional prefix for generated CSS identifiers\n * prefix: \"my-app\",\n * // Other yak config options...\n * };\n * module.exports = withYak(yakConfig, nextConfig);\n * ```\n */\nexport const withYak: {\n <\n T extends\n | Record<string, any>\n | ((...args: any[]) => Record<string, any>)\n | ((...args: any[]) => Promise<Record<string, any>>),\n >(\n yakOptions: YakConfigOptions,\n nextConfig: T,\n ): T;\n // no yakConfig\n <\n T extends\n | Record<string, any>\n | ((...args: any[]) => Record<string, any>)\n | ((...args: any[]) => Promise<Record<string, any>>),\n >(\n nextConfig: T,\n _?: undefined,\n ): T;\n} = (maybeYakOptions, nextConfig) => {\n if (nextConfig === undefined) {\n return withYak({}, maybeYakOptions);\n }\n // If the second parameter is present the first parameter must be a YakConfigOptions\n const yakOptions = maybeYakOptions as YakConfigOptions;\n if (typeof nextConfig === \"function\") {\n /**\n * A NextConfig can be a sync or async function\n * https://nextjs.org/docs/pages/api-reference/next-config-js\n * @param {any[]} args\n */\n return (...args) => {\n /** Dynamic Next Configs can be async or sync */\n const config = nextConfig(...args) as NextConfig | Promise<NextConfig>;\n return config instanceof Promise\n ? config.then((config) => addYak(yakOptions, config))\n : addYak(yakOptions, config);\n };\n }\n return addYak(yakOptions, nextConfig);\n};\n"],"mappings":"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"}
|
|
@@ -107,7 +107,6 @@ function getParseContext(loader: LoaderContext<YakConfigOptions>): ParseContext
|
|
|
107
107
|
async evaluateYakModule(modulePath) {
|
|
108
108
|
return loader.importModule(modulePath);
|
|
109
109
|
},
|
|
110
|
-
transpilationMode: loader.getOptions().experiments?.transpilationMode,
|
|
111
110
|
};
|
|
112
111
|
}
|
|
113
112
|
|
package/loaders/turbo-loader.ts
CHANGED
|
@@ -10,8 +10,8 @@ import { extractCss } from "yak-internals/extract-css";
|
|
|
10
10
|
import { parseExports } from "yak-internals/parse-exports";
|
|
11
11
|
import { getSwcParserOptions } from "yak-internals/swc-parser-options";
|
|
12
12
|
|
|
13
|
-
const
|
|
14
|
-
const yakSwcPluginPath =
|
|
13
|
+
const require = createRequire(import.meta.url);
|
|
14
|
+
const yakSwcPluginPath = require.resolve("@yak/swc");
|
|
15
15
|
const dataUrlImportPrefix = 'import "data:text/css;base64,';
|
|
16
16
|
|
|
17
17
|
/**
|
|
@@ -34,9 +34,9 @@ export default async function cssExtractLoader(
|
|
|
34
34
|
|
|
35
35
|
const {
|
|
36
36
|
yakPluginOptions,
|
|
37
|
-
yakOptions: {
|
|
37
|
+
yakOptions: { debug },
|
|
38
38
|
} = this.getOptions();
|
|
39
|
-
const debugLog = createDebugLogger(
|
|
39
|
+
const debugLog = createDebugLogger(debug, this.rootContext);
|
|
40
40
|
const resolveTurbopack = this.getResolve({});
|
|
41
41
|
const transform = createTransform(yakPluginOptions, yakSwcPluginPath);
|
|
42
42
|
|
|
@@ -69,7 +69,7 @@ export default async function cssExtractLoader(
|
|
|
69
69
|
const result = await transform(code, this.resourcePath, this.rootContext, sourceMap);
|
|
70
70
|
debugLog("ts", result.code, this.resourcePath);
|
|
71
71
|
|
|
72
|
-
let css = extractCss(result.code
|
|
72
|
+
let css = extractCss(result.code);
|
|
73
73
|
debugLog("css", css, this.resourcePath);
|
|
74
74
|
|
|
75
75
|
const { resolved } = await resolveCrossFileConstant(
|
|
@@ -77,7 +77,6 @@ export default async function cssExtractLoader(
|
|
|
77
77
|
parse: (modulePath) => {
|
|
78
78
|
return parseModule(
|
|
79
79
|
{
|
|
80
|
-
transpilationMode: "Css",
|
|
81
80
|
extractExports: async (modulePath) => {
|
|
82
81
|
const sourceContents = await fsReadFile(modulePath);
|
|
83
82
|
return parseExports(sourceContents);
|
|
@@ -116,7 +115,12 @@ export default async function cssExtractLoader(
|
|
|
116
115
|
const codeWithCrossFileResolved = replaceDataUrlImport(result.code, resolved);
|
|
117
116
|
|
|
118
117
|
debugLog("css-resolved", resolved, this.resourcePath);
|
|
119
|
-
|
|
118
|
+
// swc returns a JSON string, which babel-loader rejects as inputSourceMap
|
|
119
|
+
return callback(
|
|
120
|
+
null,
|
|
121
|
+
codeWithCrossFileResolved,
|
|
122
|
+
result.map ? JSON.parse(result.map) : undefined,
|
|
123
|
+
);
|
|
120
124
|
} catch (error) {
|
|
121
125
|
// Register cross-file dependencies even on error so turbopack re-runs
|
|
122
126
|
// this loader when a broken dependency is fixed.
|
|
@@ -26,14 +26,11 @@ export default async function cssExtractLoader(
|
|
|
26
26
|
if (!source) {
|
|
27
27
|
return callback(new Error(`Source code for ${this.resourcePath} is empty`));
|
|
28
28
|
}
|
|
29
|
-
const {
|
|
30
|
-
const debugLog = createDebugLogger(
|
|
31
|
-
experiments?.debug,
|
|
32
|
-
this._compiler?.context ?? process.cwd(),
|
|
33
|
-
);
|
|
29
|
+
const { debug } = this.getOptions();
|
|
30
|
+
const debugLog = createDebugLogger(debug, this._compiler?.context ?? process.cwd());
|
|
34
31
|
|
|
35
32
|
debugLog("ts", source, this.resourcePath);
|
|
36
|
-
const css = extractCss(source
|
|
33
|
+
const css = extractCss(source);
|
|
37
34
|
debugLog("css", css, this.resourcePath);
|
|
38
35
|
|
|
39
36
|
return resolveCrossFileConstant(this, this.context, css).then((result) => {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@yak/react",
|
|
3
|
-
"version": "10.0.0-rc.
|
|
3
|
+
"version": "10.0.0-rc.1",
|
|
4
4
|
"description": "@yak/react is a CSS-in-JS library for React: styled-components syntax with CSS extracted at build time. Works with Next.js, Vite and Rsbuild.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"css-in-js",
|
|
@@ -39,152 +39,90 @@
|
|
|
39
39
|
"types": "./dist/",
|
|
40
40
|
"exports": {
|
|
41
41
|
".": {
|
|
42
|
-
"
|
|
43
|
-
|
|
44
|
-
"default": "./dist/index.js"
|
|
45
|
-
},
|
|
46
|
-
"require": {
|
|
47
|
-
"types": "./dist/index.d.cts",
|
|
48
|
-
"default": "./dist/index.cjs"
|
|
49
|
-
}
|
|
42
|
+
"types": "./dist/index.d.ts",
|
|
43
|
+
"default": "./dist/index.js"
|
|
50
44
|
},
|
|
51
45
|
"./static": {
|
|
52
|
-
"
|
|
53
|
-
|
|
54
|
-
"default": "./dist/static/index.js"
|
|
55
|
-
},
|
|
56
|
-
"require": {
|
|
57
|
-
"types": "./dist/static/index.d.cts",
|
|
58
|
-
"default": "./dist/static/index.cjs"
|
|
59
|
-
}
|
|
46
|
+
"types": "./dist/static/index.d.ts",
|
|
47
|
+
"default": "./dist/static/index.js"
|
|
60
48
|
},
|
|
61
49
|
"./internal": {
|
|
62
|
-
"
|
|
63
|
-
|
|
64
|
-
"default": "./dist/internal.js"
|
|
65
|
-
},
|
|
66
|
-
"require": {
|
|
67
|
-
"types": "./dist/internal.d.cts",
|
|
68
|
-
"default": "./dist/internal.cjs"
|
|
69
|
-
}
|
|
50
|
+
"types": "./dist/internal.d.ts",
|
|
51
|
+
"default": "./dist/internal.js"
|
|
70
52
|
},
|
|
71
53
|
"./withYak": {
|
|
72
|
-
"
|
|
73
|
-
|
|
74
|
-
"default": "./dist/withYak/index.js"
|
|
75
|
-
},
|
|
76
|
-
"require": {
|
|
77
|
-
"types": "./dist/withYak/index.d.cts",
|
|
78
|
-
"default": "./dist/withYak/index.cjs"
|
|
79
|
-
}
|
|
54
|
+
"types": "./dist/withYak/index.d.ts",
|
|
55
|
+
"default": "./dist/withYak/index.js"
|
|
80
56
|
},
|
|
81
57
|
"./context/baseContext": {
|
|
82
|
-
"
|
|
83
|
-
|
|
84
|
-
"default": "./dist/context/baseContext.js"
|
|
85
|
-
},
|
|
86
|
-
"require": {
|
|
87
|
-
"types": "./dist/context/baseContext.d.cts",
|
|
88
|
-
"default": "./dist/context/baseContext.cjs"
|
|
89
|
-
}
|
|
58
|
+
"types": "./dist/context/baseContext.d.ts",
|
|
59
|
+
"default": "./dist/context/baseContext.js"
|
|
90
60
|
},
|
|
91
61
|
"./context": {
|
|
92
62
|
"react-server": {
|
|
93
|
-
"
|
|
94
|
-
|
|
95
|
-
"default": "./dist/context/index.server.js"
|
|
96
|
-
},
|
|
97
|
-
"require": {
|
|
98
|
-
"types": "./dist/context/index.server.d.cts",
|
|
99
|
-
"default": "./dist/context/index.server.cjs"
|
|
100
|
-
}
|
|
63
|
+
"types": "./dist/context/index.server.d.ts",
|
|
64
|
+
"default": "./dist/context/index.server.js"
|
|
101
65
|
},
|
|
102
66
|
"default": {
|
|
103
|
-
"
|
|
104
|
-
|
|
105
|
-
"default": "./dist/context/index.js"
|
|
106
|
-
},
|
|
107
|
-
"require": {
|
|
108
|
-
"types": "./dist/context/index.d.cts",
|
|
109
|
-
"default": "./dist/context/index.cjs"
|
|
110
|
-
}
|
|
67
|
+
"types": "./dist/context/index.d.ts",
|
|
68
|
+
"default": "./dist/context/index.js"
|
|
111
69
|
}
|
|
112
70
|
},
|
|
113
71
|
"./jsx-runtime": {
|
|
114
|
-
"
|
|
115
|
-
|
|
116
|
-
"default": "./dist/jsx-runtime.js"
|
|
117
|
-
},
|
|
118
|
-
"require": {
|
|
119
|
-
"types": "./dist/jsx-runtime.d.cts",
|
|
120
|
-
"default": "./dist/jsx-runtime.cjs"
|
|
121
|
-
}
|
|
72
|
+
"types": "./dist/jsx-runtime.d.ts",
|
|
73
|
+
"default": "./dist/jsx-runtime.js"
|
|
122
74
|
},
|
|
123
75
|
"./jsx-dev-runtime": {
|
|
124
|
-
"
|
|
125
|
-
|
|
126
|
-
"default": "./dist/jsx-dev-runtime.js"
|
|
127
|
-
},
|
|
128
|
-
"require": {
|
|
129
|
-
"types": "./dist/jsx-dev-runtime.d.cts",
|
|
130
|
-
"default": "./dist/jsx-dev-runtime.cjs"
|
|
131
|
-
}
|
|
76
|
+
"types": "./dist/jsx-dev-runtime.d.ts",
|
|
77
|
+
"default": "./dist/jsx-dev-runtime.js"
|
|
132
78
|
},
|
|
133
|
-
"./loaders/webpack-loader": "./dist/loaders/webpack-loader.
|
|
79
|
+
"./loaders/webpack-loader": "./dist/loaders/webpack-loader.js",
|
|
134
80
|
"./vite": {
|
|
135
|
-
"
|
|
136
|
-
|
|
137
|
-
"default": "./dist/loaders/vite-plugin.js"
|
|
138
|
-
}
|
|
81
|
+
"types": "./dist/loaders/vite-plugin.d.ts",
|
|
82
|
+
"default": "./dist/loaders/vite-plugin.js"
|
|
139
83
|
},
|
|
140
84
|
"./cross-file-resolver": {
|
|
141
|
-
"
|
|
142
|
-
|
|
143
|
-
"default": "./dist/cross-file-resolver/index.js"
|
|
144
|
-
}
|
|
85
|
+
"types": "./dist/cross-file-resolver/index.d.ts",
|
|
86
|
+
"default": "./dist/cross-file-resolver/index.js"
|
|
145
87
|
},
|
|
146
88
|
"./isolated-source-eval": {
|
|
147
|
-
"
|
|
148
|
-
|
|
149
|
-
"default": "./dist/isolated-source-eval/index.js"
|
|
150
|
-
}
|
|
89
|
+
"types": "./dist/isolated-source-eval/index.d.ts",
|
|
90
|
+
"default": "./dist/isolated-source-eval/index.js"
|
|
151
91
|
},
|
|
152
92
|
"./rsbuild": {
|
|
153
|
-
"
|
|
154
|
-
|
|
155
|
-
"default": "./dist/rsbuild/index.js"
|
|
156
|
-
}
|
|
93
|
+
"types": "./dist/rsbuild/index.d.ts",
|
|
94
|
+
"default": "./dist/rsbuild/index.js"
|
|
157
95
|
}
|
|
158
96
|
},
|
|
159
97
|
"publishConfig": {
|
|
160
98
|
"access": "public"
|
|
161
99
|
},
|
|
162
100
|
"dependencies": {
|
|
163
|
-
"@babel/parser": "^8.0.
|
|
164
|
-
"@swc/core": "~1.
|
|
165
|
-
"@yak/swc": "10.0.0-rc.
|
|
101
|
+
"@babel/parser": "^8.0.7",
|
|
102
|
+
"@swc/core": "~1.16.18",
|
|
103
|
+
"@yak/swc": "10.0.0-rc.1"
|
|
166
104
|
},
|
|
167
105
|
"devDependencies": {
|
|
168
|
-
"@rsbuild/core": "2.2.
|
|
106
|
+
"@rsbuild/core": "2.2.13",
|
|
169
107
|
"@testing-library/react": "16.3.3",
|
|
170
108
|
"@types/jest": "30.0.0",
|
|
171
|
-
"@types/node": "26.
|
|
172
|
-
"@types/react": "19.
|
|
173
|
-
"@types/react-dom": "19.
|
|
109
|
+
"@types/node": "26.6.5",
|
|
110
|
+
"@types/react": "19.3.0",
|
|
111
|
+
"@types/react-dom": "19.3.0",
|
|
174
112
|
"@types/webpack": "5.28.5",
|
|
175
|
-
"jsdom": "30.
|
|
176
|
-
"next": "16.
|
|
177
|
-
"react": "19.
|
|
178
|
-
"tsdown": "0.
|
|
113
|
+
"jsdom": "30.1.3",
|
|
114
|
+
"next": "16.4.2",
|
|
115
|
+
"react": "19.3.1",
|
|
116
|
+
"tsdown": "0.23.1",
|
|
179
117
|
"typescript": "6.0.3",
|
|
180
|
-
"vite": "8.
|
|
181
|
-
"vitest": "
|
|
118
|
+
"vite": "8.3.4",
|
|
119
|
+
"vitest": "5.0.5",
|
|
182
120
|
"yak-internals": "0.0.0"
|
|
183
121
|
},
|
|
184
122
|
"peerDependencies": {
|
|
185
123
|
"@rsbuild/core": ">=2.0.0",
|
|
186
124
|
"@types/react": ">=19",
|
|
187
|
-
"next": ">=16.
|
|
125
|
+
"next": ">=16.4.0",
|
|
188
126
|
"react": ">=19.0.0",
|
|
189
127
|
"vite": ">=7.0.0"
|
|
190
128
|
},
|
|
@@ -205,6 +143,9 @@
|
|
|
205
143
|
"optional": true
|
|
206
144
|
}
|
|
207
145
|
},
|
|
146
|
+
"engines": {
|
|
147
|
+
"node": ">=22.18.0"
|
|
148
|
+
},
|
|
208
149
|
"scripts": {
|
|
209
150
|
"build": "tsdown",
|
|
210
151
|
"watch": "tsdown --watch",
|
package/rsbuild/index.ts
CHANGED
|
@@ -11,8 +11,8 @@ import {
|
|
|
11
11
|
// provide `this.fs.readFile`, `this.getResolve` and `this.addDependency` — which
|
|
12
12
|
// is exactly what the turbopack loader uses — so the turbopack loader runs as-is
|
|
13
13
|
// on Rspack. The compiled loader lives next to this file under dist/
|
|
14
|
-
// (dist/rsbuild/index.js and dist/loaders/turbo-loader.
|
|
15
|
-
const rspackLoaderPath = fileURLToPath(new URL("../loaders/turbo-loader.
|
|
14
|
+
// (dist/rsbuild/index.js and dist/loaders/turbo-loader.js are siblings).
|
|
15
|
+
const rspackLoaderPath = fileURLToPath(new URL("../loaders/turbo-loader.js", import.meta.url));
|
|
16
16
|
|
|
17
17
|
/**
|
|
18
18
|
* Rsbuild plugin for @yak/react.
|
|
@@ -46,7 +46,6 @@ export function pluginYak(yakOptions: YakConfigOptions = {}): RsbuildPlugin {
|
|
|
46
46
|
...buildYakPluginOptions(yakOptions, rootContext),
|
|
47
47
|
importMode: {
|
|
48
48
|
value: "data:text/css;base64,",
|
|
49
|
-
transpilation: "Css",
|
|
50
49
|
encoding: "Base64",
|
|
51
50
|
},
|
|
52
51
|
};
|
package/withYak/index.ts
CHANGED
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
/// <reference types="node" />
|
|
2
2
|
import type { NextConfig } from "next";
|
|
3
|
-
import path
|
|
4
|
-
import { fileURLToPath } from "node:url";
|
|
3
|
+
import path from "node:path";
|
|
5
4
|
import { allowYakGlobalCss, hasAppDir } from "./allow-global-css.ts";
|
|
6
5
|
import {
|
|
7
6
|
buildYakPluginOptions,
|
|
@@ -12,21 +11,16 @@ import {
|
|
|
12
11
|
export { buildYakPluginOptions, resolveYakContext } from "yak-internals/config";
|
|
13
12
|
export type { YakConfigOptions } from "yak-internals/config";
|
|
14
13
|
|
|
15
|
-
const currentDir =
|
|
16
|
-
typeof __dirname !== "undefined" ? __dirname : dirname(fileURLToPath(import.meta.url));
|
|
14
|
+
const currentDir = import.meta.dirname;
|
|
17
15
|
|
|
18
16
|
const addYak = (yakOptions: YakConfigOptions, nextConfig: NextConfig) => {
|
|
19
17
|
const yakPluginOptions = buildYakPluginOptions(yakOptions, currentDir);
|
|
20
18
|
|
|
21
|
-
const transpilation = yakOptions.experiments?.transpilationMode ?? "CssModule";
|
|
22
|
-
const cssExtension = transpilation === "CssModule" ? ".yak.module.css" : ".yak.css";
|
|
23
|
-
|
|
24
19
|
if (process.env.TURBOPACK === "1" || process.env.TURBOPACK === "auto") {
|
|
25
20
|
addYakTurbopack(nextConfig, yakOptions, {
|
|
26
21
|
...yakPluginOptions,
|
|
27
22
|
importMode: {
|
|
28
23
|
value: "data:text/css;base64,",
|
|
29
|
-
transpilation: "Css",
|
|
30
24
|
encoding: "Base64",
|
|
31
25
|
},
|
|
32
26
|
});
|
|
@@ -34,8 +28,7 @@ const addYak = (yakOptions: YakConfigOptions, nextConfig: NextConfig) => {
|
|
|
34
28
|
addYakWebpack(nextConfig, yakOptions, {
|
|
35
29
|
...yakPluginOptions,
|
|
36
30
|
importMode: {
|
|
37
|
-
value:
|
|
38
|
-
transpilation,
|
|
31
|
+
value: "./{{__BASE_NAME__}}.yak.css!=!./{{__BASE_NAME__}}?./{{__BASE_NAME__}}.yak.css",
|
|
39
32
|
encoding: "None",
|
|
40
33
|
},
|
|
41
34
|
});
|
|
@@ -61,14 +54,13 @@ function addYakTurbopack(
|
|
|
61
54
|
strictCssProp: boolean;
|
|
62
55
|
importMode: {
|
|
63
56
|
value: string;
|
|
64
|
-
transpilation: string;
|
|
65
57
|
encoding: string;
|
|
66
58
|
};
|
|
67
59
|
},
|
|
68
60
|
) {
|
|
69
61
|
// turbopack can't handle options with undefined values, so we remove them
|
|
70
62
|
const yakLoader = removeUndefinedRecursive({
|
|
71
|
-
loader: path.join(currentDir, "../loaders/turbo-loader.
|
|
63
|
+
loader: path.join(currentDir, "../loaders/turbo-loader.js"),
|
|
72
64
|
options: {
|
|
73
65
|
yakOptions: yakOptions,
|
|
74
66
|
yakPluginOptions: yakPluginOptions,
|
|
@@ -118,7 +110,6 @@ function addYakWebpack(
|
|
|
118
110
|
strictCssProp: boolean;
|
|
119
111
|
importMode: {
|
|
120
112
|
value: string;
|
|
121
|
-
transpilation: string;
|
|
122
113
|
encoding: string;
|
|
123
114
|
};
|
|
124
115
|
},
|
|
@@ -135,19 +126,14 @@ function addYakWebpack(
|
|
|
135
126
|
webpackConfig = previousConfig(webpackConfig, options);
|
|
136
127
|
}
|
|
137
128
|
|
|
138
|
-
if (
|
|
139
|
-
yakOptions.experiments?.transpilationMode === "Css" &&
|
|
140
|
-
!options.isServer &&
|
|
141
|
-
!hasAppDir(options.dir)
|
|
142
|
-
) {
|
|
129
|
+
if (!options.isServer && !hasAppDir(options.dir)) {
|
|
143
130
|
// Next.js restricts global CSS imports only in the client build of a pages-only project, so only patch its rules there
|
|
144
131
|
allowYakGlobalCss(webpackConfig);
|
|
145
132
|
}
|
|
146
133
|
|
|
147
134
|
webpackConfig.module.rules.push({
|
|
148
|
-
test:
|
|
149
|
-
|
|
150
|
-
loader: path.join(currentDir, "../loaders/webpack-loader.cjs"),
|
|
135
|
+
test: /\.yak\.css$/,
|
|
136
|
+
loader: path.join(currentDir, "../loaders/webpack-loader.js"),
|
|
151
137
|
options: yakOptions,
|
|
152
138
|
});
|
|
153
139
|
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
2
|
-
//#region runtime/context/baseContext.tsx
|
|
3
|
-
function getYakThemeContext() {
|
|
4
|
-
return {};
|
|
5
|
-
}
|
|
6
|
-
|
|
7
|
-
//#endregion
|
|
8
|
-
exports.getYakThemeContext = getYakThemeContext;
|
|
9
|
-
//# sourceMappingURL=baseContext.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"baseContext.cjs","names":[],"sources":["../../runtime/context/baseContext.tsx"],"sourcesContent":["import type { YakTheme } from \"@yak/react\";\n\nexport function getYakThemeContext() {\n return {} as YakTheme | undefined;\n}\n"],"mappings":";;AAEA,SAAgB,qBAAqB;CACnC,OAAO,CAAC;AACV"}
|
package/dist/context/index.cjs
DELETED
|
@@ -1,45 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
4
|
-
//#region \0rolldown/runtime.js
|
|
5
|
-
var __create = Object.create;
|
|
6
|
-
var __defProp = Object.defineProperty;
|
|
7
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
8
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
9
|
-
var __getProtoOf = Object.getPrototypeOf;
|
|
10
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
11
|
-
var __copyProps = (to, from, except, desc) => {
|
|
12
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
13
|
-
for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
|
|
14
|
-
key = keys[i];
|
|
15
|
-
if (!__hasOwnProp.call(to, key) && key !== except) {
|
|
16
|
-
__defProp(to, key, {
|
|
17
|
-
get: ((k) => from[k]).bind(null, key),
|
|
18
|
-
enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
|
|
19
|
-
});
|
|
20
|
-
}
|
|
21
|
-
}
|
|
22
|
-
}
|
|
23
|
-
return to;
|
|
24
|
-
};
|
|
25
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule || !__hasOwnProp.call(mod, "default") ? __defProp(target, "default", {
|
|
26
|
-
value: mod,
|
|
27
|
-
enumerable: true
|
|
28
|
-
}) : target, mod));
|
|
29
|
-
|
|
30
|
-
//#endregion
|
|
31
|
-
let react = require("react");
|
|
32
|
-
react = __toESM(react, 1);
|
|
33
|
-
|
|
34
|
-
//#region runtime/context/index.tsx
|
|
35
|
-
const YakContext = (0, react.createContext)({});
|
|
36
|
-
const useTheme = () => {
|
|
37
|
-
const context = (0, react.use)(YakContext);
|
|
38
|
-
return context instanceof Promise ? (0, react.use)(context) : context;
|
|
39
|
-
};
|
|
40
|
-
const YakThemeProvider = ({ children, theme = {} }) => /* @__PURE__ */ react.default.createElement(YakContext.Provider, { value: theme }, children);
|
|
41
|
-
|
|
42
|
-
//#endregion
|
|
43
|
-
exports.YakThemeProvider = YakThemeProvider;
|
|
44
|
-
exports.useTheme = useTheme;
|
|
45
|
-
//# sourceMappingURL=index.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","names":["createContext","use"],"sources":["../../runtime/context/index.tsx"],"sourcesContent":["\"use client\";\n//\n// This file is the client component (browser & ssr) version of index.server.tsx\n//\nimport React, { ReactNode, createContext, use } from \"react\";\n\nexport interface YakTheme {}\n\n/**\n * The yak theme context\n * @see https://github.com/DigitecGalaxus/next-yak/blob/main/packages/yak-react/runtime/context/README.md\n */\nconst YakContext = createContext<YakTheme>({});\n\n/**\n * Returns the current yak theme context\n *\n * @see https://github.com/DigitecGalaxus/next-yak/blob/main/packages/yak-react/runtime/context/README.md\n */\nexport const useTheme = (): YakTheme => {\n const context = use(YakContext);\n return context instanceof Promise ? use(context) : context;\n};\n\n/**\n * Yak theme context provider\n *\n * @see https://github.com/DigitecGalaxus/next-yak/blob/main/packages/yak-react/runtime/context/README.md\n */\nexport const YakThemeProvider = ({\n children,\n theme = {},\n}: {\n children: ReactNode;\n theme?: YakTheme;\n}) => <YakContext.Provider value={theme}>{children}</YakContext.Provider>;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYA,MAAM,iBAAaA,qBAAwB,CAAC,CAAC;AAO7C,MAAa,iBAA2B;CACtC,MAAM,cAAUC,WAAI,UAAU;CAC9B,OAAO,mBAAmB,cAAUA,WAAI,OAAO,IAAI;AACrD;AAOA,MAAa,oBAAoB,EAC/B,UACA,QAAQ,CAAC,QAIL,4CAAC,WAAW,UAAZ,EAAqB,OAAO,MAAsC,GAA9B,QAA8B"}
|
package/dist/context/index.d.cts
DELETED
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
import React, { ReactNode } from "react";
|
|
2
|
-
//#region runtime/context/index.d.ts
|
|
3
|
-
interface YakTheme {}
|
|
4
|
-
/**
|
|
5
|
-
* Returns the current yak theme context
|
|
6
|
-
*
|
|
7
|
-
* @see https://github.com/DigitecGalaxus/next-yak/blob/main/packages/yak-react/runtime/context/README.md
|
|
8
|
-
*/
|
|
9
|
-
declare const useTheme: () => YakTheme;
|
|
10
|
-
/**
|
|
11
|
-
* Yak theme context provider
|
|
12
|
-
*
|
|
13
|
-
* @see https://github.com/DigitecGalaxus/next-yak/blob/main/packages/yak-react/runtime/context/README.md
|
|
14
|
-
*/
|
|
15
|
-
declare const YakThemeProvider: ({ children, theme }: {
|
|
16
|
-
children: ReactNode;
|
|
17
|
-
theme?: YakTheme;
|
|
18
|
-
}) => React.JSX.Element;
|
|
19
|
-
//#endregion
|
|
20
|
-
export { YakTheme, YakThemeProvider, useTheme };
|
|
21
|
-
//# sourceMappingURL=index.d.cts.map
|
|
@@ -1,47 +0,0 @@
|
|
|
1
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
2
|
-
//#region \0rolldown/runtime.js
|
|
3
|
-
var __create = Object.create;
|
|
4
|
-
var __defProp = Object.defineProperty;
|
|
5
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
6
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
7
|
-
var __getProtoOf = Object.getPrototypeOf;
|
|
8
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
9
|
-
var __copyProps = (to, from, except, desc) => {
|
|
10
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
11
|
-
for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
|
|
12
|
-
key = keys[i];
|
|
13
|
-
if (!__hasOwnProp.call(to, key) && key !== except) {
|
|
14
|
-
__defProp(to, key, {
|
|
15
|
-
get: ((k) => from[k]).bind(null, key),
|
|
16
|
-
enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
|
|
17
|
-
});
|
|
18
|
-
}
|
|
19
|
-
}
|
|
20
|
-
}
|
|
21
|
-
return to;
|
|
22
|
-
};
|
|
23
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule || !__hasOwnProp.call(mod, "default") ? __defProp(target, "default", {
|
|
24
|
-
value: mod,
|
|
25
|
-
enumerable: true
|
|
26
|
-
}) : target, mod));
|
|
27
|
-
|
|
28
|
-
//#endregion
|
|
29
|
-
let react = require("react");
|
|
30
|
-
react = __toESM(react, 1);
|
|
31
|
-
let runtime_context_index_js = require("./index.js");
|
|
32
|
-
let _yak_react_context_baseContext = require("@yak/react/context/baseContext");
|
|
33
|
-
|
|
34
|
-
//#region runtime/context/index.server.tsx
|
|
35
|
-
const getYakContext = (0, react.cache)(() => (0, _yak_react_context_baseContext.getYakThemeContext)());
|
|
36
|
-
const useTheme = () => {
|
|
37
|
-
const theme = getYakContext();
|
|
38
|
-
return theme instanceof Promise ? (0, react.use)(theme) : theme;
|
|
39
|
-
};
|
|
40
|
-
const YakThemeProvider = ({ children }) => {
|
|
41
|
-
return /* @__PURE__ */ react.default.createElement(runtime_context_index_js.YakThemeProvider, { theme: getYakContext() }, children);
|
|
42
|
-
};
|
|
43
|
-
|
|
44
|
-
//#endregion
|
|
45
|
-
exports.YakThemeProvider = YakThemeProvider;
|
|
46
|
-
exports.useTheme = useTheme;
|
|
47
|
-
//# sourceMappingURL=index.server.cjs.map
|