@plumeria/turbopack-loader 2.4.1 → 3.0.0

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.
Files changed (3) hide show
  1. package/dist/index.d.ts +4 -6
  2. package/dist/index.js +144 -79
  3. package/package.json +3 -3
package/dist/index.d.ts CHANGED
@@ -1,10 +1,8 @@
1
- interface TurbopackLoaderContext {
1
+ interface LoaderContext {
2
2
  resourcePath: string;
3
- rootContext: string;
4
- context: string;
5
- clearDependencies: () => void;
3
+ async: () => (err: Error | null, content?: string) => void;
6
4
  addDependency: (path: string) => void;
7
- async: () => (err: Error | null, content?: string | Buffer, sourceMap?: any) => void;
5
+ clearDependencies: () => void;
8
6
  }
9
- export default function loader(this: TurbopackLoaderContext, source: string): void;
7
+ export default function loader(this: LoaderContext, source: string): Promise<void>;
10
8
  export {};
package/dist/index.js CHANGED
@@ -5,15 +5,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
6
  exports.default = loader;
7
7
  const core_1 = require("@swc/core");
8
- const path_1 = __importDefault(require("path"));
9
8
  const fs_1 = __importDefault(require("fs"));
9
+ const path_1 = __importDefault(require("path"));
10
10
  const zss_engine_1 = require("zss-engine");
11
11
  const utils_1 = require("@plumeria/utils");
12
- const VIRTUAL_FILE_PATH = path_1.default.resolve(__dirname, '..', 'zero-virtual.css');
13
- fs_1.default.writeFileSync(VIRTUAL_FILE_PATH, '');
14
- function loader(source) {
12
+ async function loader(source) {
15
13
  const callback = this.async();
16
- if (this.resourcePath.includes('node_modules')) {
14
+ if (this.resourcePath.includes('node_modules') ||
15
+ !source.includes('@plumeria/core')) {
17
16
  return callback(null, source);
18
17
  }
19
18
  this.clearDependencies();
@@ -28,70 +27,153 @@ function loader(source) {
28
27
  const { themeTableLocal, createThemeObjectTableLocal } = (0, utils_1.scanForCreateTheme)((path) => this.addDependency(path));
29
28
  utils_1.tables.themeTable = themeTableLocal;
30
29
  utils_1.tables.createThemeObjectTable = createThemeObjectTableLocal;
31
- const extractedObjects = [];
32
- let ast;
33
- try {
34
- ast = (0, core_1.parseSync)(source, {
35
- syntax: 'typescript',
36
- tsx: true,
37
- target: 'es2022',
38
- });
39
- }
40
- catch (err) {
41
- console.log(err);
42
- callback(null, source);
43
- return;
44
- }
30
+ const ast = (0, core_1.parseSync)(source, {
31
+ syntax: 'typescript',
32
+ tsx: true,
33
+ target: 'es2022',
34
+ });
45
35
  const localConsts = (0, utils_1.collectLocalConsts)(ast);
46
36
  Object.assign(utils_1.tables.staticTable, localConsts);
37
+ const localCreateStyles = {};
38
+ const replacements = [];
39
+ const extractedSheets = [];
47
40
  (0, utils_1.traverse)(ast, {
41
+ VariableDeclarator({ node }) {
42
+ if (node.id.type === 'Identifier' &&
43
+ node.init &&
44
+ utils_1.t.isCallExpression(node.init) &&
45
+ utils_1.t.isMemberExpression(node.init.callee) &&
46
+ utils_1.t.isIdentifier(node.init.callee.object, { name: 'css' }) &&
47
+ utils_1.t.isIdentifier(node.init.callee.property, { name: 'create' }) &&
48
+ node.init.arguments.length === 1 &&
49
+ utils_1.t.isObjectExpression(node.init.arguments[0].expression)) {
50
+ const obj = (0, utils_1.objectExpressionToObject)(node.init.arguments[0].expression, utils_1.tables.staticTable, utils_1.tables.keyframesHashTable, utils_1.tables.viewTransitionHashTable, utils_1.tables.themeTable);
51
+ if (obj) {
52
+ localCreateStyles[node.id.value] = obj;
53
+ const hashMap = {};
54
+ Object.entries(obj).forEach(([key, style]) => {
55
+ const records = (0, utils_1.getStyleRecords)(key, style, 2);
56
+ const propMap = {};
57
+ (0, utils_1.extractOndemandStyles)(style, extractedSheets);
58
+ records.forEach((r) => {
59
+ propMap[r.key] = r.hash;
60
+ extractedSheets.push(r.sheet);
61
+ });
62
+ hashMap[key] = records.map((r) => r.hash).join(' ');
63
+ });
64
+ replacements.push({
65
+ start: node.init.span.start - ast.span.start,
66
+ end: node.init.span.end - ast.span.start,
67
+ content: JSON.stringify(hashMap),
68
+ });
69
+ }
70
+ }
71
+ },
48
72
  CallExpression({ node }) {
49
73
  const callee = node.callee;
50
74
  if (utils_1.t.isMemberExpression(callee) &&
51
75
  utils_1.t.isIdentifier(callee.object, { name: 'css' }) &&
52
76
  utils_1.t.isIdentifier(callee.property)) {
77
+ const propName = callee.property.value;
53
78
  const args = node.arguments;
54
- if (callee.property.value === 'create' &&
55
- args.length === 1 &&
79
+ if (propName === 'props') {
80
+ const merged = {};
81
+ let allStatic = true;
82
+ args.forEach((arg) => {
83
+ const expr = arg.expression;
84
+ if (utils_1.t.isObjectExpression(expr)) {
85
+ const obj = (0, utils_1.objectExpressionToObject)(expr, utils_1.tables.staticTable, utils_1.tables.keyframesHashTable, utils_1.tables.viewTransitionHashTable, utils_1.tables.themeTable);
86
+ obj ? Object.assign(merged, obj) : (allStatic = false);
87
+ }
88
+ else if (utils_1.t.isMemberExpression(expr) &&
89
+ utils_1.t.isIdentifier(expr.object) &&
90
+ utils_1.t.isIdentifier(expr.property)) {
91
+ const styleSet = localCreateStyles[expr.object.value];
92
+ styleSet && styleSet[expr.property.value]
93
+ ? Object.assign(merged, styleSet[expr.property.value])
94
+ : (allStatic = false);
95
+ }
96
+ else if (utils_1.t.isIdentifier(expr)) {
97
+ const obj = localCreateStyles[expr.value];
98
+ obj ? Object.assign(merged, obj) : (allStatic = false);
99
+ }
100
+ else {
101
+ allStatic = false;
102
+ }
103
+ });
104
+ if (allStatic && Object.keys(merged).length > 0) {
105
+ (0, utils_1.extractOndemandStyles)(merged, extractedSheets);
106
+ const hash = (0, zss_engine_1.genBase36Hash)(merged, 1, 8);
107
+ const records = (0, utils_1.getStyleRecords)(hash, merged, 2);
108
+ records.forEach((r) => extractedSheets.push(r.sheet));
109
+ replacements.push({
110
+ start: node.span.start - ast.span.start,
111
+ end: node.span.end - ast.span.start,
112
+ content: JSON.stringify(records.map((r) => r.hash).join(' ')),
113
+ });
114
+ }
115
+ }
116
+ else if (propName === 'keyframes' &&
117
+ args.length > 0 &&
56
118
  utils_1.t.isObjectExpression(args[0].expression)) {
57
119
  const obj = (0, utils_1.objectExpressionToObject)(args[0].expression, utils_1.tables.staticTable, utils_1.tables.keyframesHashTable, utils_1.tables.viewTransitionHashTable, utils_1.tables.themeTable);
58
- if (obj) {
59
- extractedObjects.push(obj);
60
- }
120
+ const hash = (0, zss_engine_1.genBase36Hash)(obj, 1, 8);
121
+ utils_1.tables.keyframesObjectTable[hash] = obj;
122
+ replacements.push({
123
+ start: node.span.start - ast.span.start,
124
+ end: node.span.end - ast.span.start,
125
+ content: JSON.stringify(`kf-${hash}`),
126
+ });
127
+ }
128
+ else if (propName === 'viewTransition' &&
129
+ args.length > 0 &&
130
+ utils_1.t.isObjectExpression(args[0].expression)) {
131
+ const obj = (0, utils_1.objectExpressionToObject)(args[0].expression, utils_1.tables.staticTable, utils_1.tables.keyframesHashTable, utils_1.tables.viewTransitionHashTable, utils_1.tables.themeTable);
132
+ const hash = (0, zss_engine_1.genBase36Hash)(obj, 1, 8);
133
+ utils_1.tables.viewTransitionObjectTable[hash] = obj;
134
+ replacements.push({
135
+ start: node.span.start - ast.span.start,
136
+ end: node.span.end - ast.span.start,
137
+ content: JSON.stringify(`vt-${hash}`),
138
+ });
139
+ }
140
+ else if (propName === 'createTheme' &&
141
+ args.length > 0 &&
142
+ utils_1.t.isObjectExpression(args[0].expression)) {
143
+ const obj = (0, utils_1.objectExpressionToObject)(args[0].expression, utils_1.tables.staticTable, utils_1.tables.keyframesHashTable, utils_1.tables.viewTransitionHashTable, utils_1.tables.themeTable);
144
+ const hash = (0, zss_engine_1.genBase36Hash)(obj, 1, 8);
145
+ utils_1.tables.createThemeObjectTable[hash] = obj;
146
+ replacements.push({
147
+ start: node.span.start - ast.span.start,
148
+ end: node.span.end - ast.span.start,
149
+ content: JSON.stringify(''),
150
+ });
151
+ }
152
+ else if (callee.property.value === 'createStatic' &&
153
+ args.length > 0 &&
154
+ utils_1.t.isStringLiteral(args[0].expression)) {
155
+ replacements.push({
156
+ start: node.span.start - ast.span.start,
157
+ end: node.span.end - ast.span.start,
158
+ content: JSON.stringify(''),
159
+ });
61
160
  }
62
161
  }
63
162
  },
64
163
  });
65
- const fileStyles = {};
66
- if (extractedObjects.length > 0) {
67
- const combinedStyles = extractedObjects.reduce((acc, obj) => Object.assign(acc, obj), {});
68
- const base = (0, utils_1.createCSS)(combinedStyles);
69
- if (base) {
70
- fileStyles.baseStyles = base;
71
- }
72
- }
73
- if (Object.keys(utils_1.tables.keyframesObjectTable).length > 0) {
74
- fileStyles.keyframeStyles = Object.entries(utils_1.tables.keyframesObjectTable)
75
- .map(([hash, obj]) => (0, zss_engine_1.transpile)({ [`@keyframes kf-${hash}`]: obj }, undefined, '--global')
76
- .styleSheet)
77
- .join('\n');
78
- }
79
- if (Object.keys(utils_1.tables.viewTransitionObjectTable).length > 0) {
80
- fileStyles.viewTransitionStyles = Object.entries(utils_1.tables.viewTransitionObjectTable)
81
- .map(([hash, obj]) => (0, zss_engine_1.transpile)({
82
- [`::view-transition-group(vt-${hash})`]: obj.group,
83
- [`::view-transition-image-pair(vt-${hash})`]: obj.imagePair,
84
- [`::view-transition-old(vt-${hash})`]: obj.old,
85
- [`::view-transition-new(vt-${hash})`]: obj.new,
86
- }, undefined, '--global').styleSheet)
87
- .join('\n');
88
- }
89
- if (Object.keys(utils_1.tables.createThemeObjectTable).length > 0) {
90
- fileStyles.themeStyles = Object.values(utils_1.tables.createThemeObjectTable)
91
- .map((obj) => (0, zss_engine_1.transpile)((0, utils_1.createTheme)(obj), undefined, '--global')
92
- .styleSheet)
93
- .join('\n');
94
- }
164
+ const buffer = Buffer.from(source);
165
+ let offset = 0;
166
+ const parts = [];
167
+ replacements
168
+ .sort((a, b) => a.start - b.start)
169
+ .forEach((r) => {
170
+ parts.push(buffer.subarray(offset, r.start));
171
+ parts.push(Buffer.from(r.content));
172
+ offset = r.end;
173
+ });
174
+ parts.push(buffer.subarray(offset));
175
+ const transformedSource = Buffer.concat(parts).toString();
176
+ const VIRTUAL_FILE_PATH = path_1.default.resolve(__dirname, '..', 'zero-virtual.css');
95
177
  const VIRTUAL_CSS_PATH = require.resolve(VIRTUAL_FILE_PATH);
96
178
  function stringifyRequest(loaderContext, request) {
97
179
  const context = loaderContext.context || loaderContext.rootContext;
@@ -108,31 +190,14 @@ function loader(source) {
108
190
  }
109
191
  const virtualCssRequest = stringifyRequest(this, `${VIRTUAL_CSS_PATH}`);
110
192
  const postfix = `\nimport ${virtualCssRequest};`;
111
- const css = fs_1.default.readFileSync(VIRTUAL_FILE_PATH, 'utf-8');
112
- function generateOrderedCSS(styles) {
113
- const sections = [];
114
- if (styles.keyframeStyles?.trim()) {
115
- if (!css.includes(styles.keyframeStyles))
116
- sections.push(styles.keyframeStyles);
117
- }
118
- if (styles.viewTransitionStyles?.trim()) {
119
- if (!css.includes(styles.viewTransitionStyles))
120
- sections.push(styles.viewTransitionStyles);
121
- }
122
- if (styles.themeStyles?.trim()) {
123
- if (!css.includes(styles.themeStyles))
124
- sections.push(styles.themeStyles);
125
- }
126
- if (styles.baseStyles?.trim()) {
127
- if (!css.includes(styles.baseStyles))
128
- sections.push(styles.baseStyles);
129
- }
130
- return sections.join('\n');
193
+ if (extractedSheets.length > 0 && process.env.NODE_ENV === 'development') {
194
+ fs_1.default.appendFileSync(VIRTUAL_FILE_PATH, extractedSheets.join(''), 'utf-8');
131
195
  }
132
- const orderedCSS = generateOrderedCSS(fileStyles);
133
- if (orderedCSS) {
134
- if (!css.includes(orderedCSS))
135
- fs_1.default.appendFileSync(VIRTUAL_FILE_PATH, orderedCSS + '\n');
196
+ else if (extractedSheets.length > 0 &&
197
+ process.env.NODE_ENV === 'production') {
198
+ fs_1.default.writeFileSync(VIRTUAL_FILE_PATH, '');
136
199
  }
137
- callback(null, source + postfix);
200
+ if (process.env.NODE_ENV === 'production')
201
+ return callback(null, transformedSource);
202
+ callback(null, transformedSource + postfix);
138
203
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@plumeria/turbopack-loader",
3
- "version": "2.4.1",
3
+ "version": "3.0.0",
4
4
  "description": "Plumeria Turbopack-loader",
5
5
  "author": "Refirst 11",
6
6
  "license": "MIT",
@@ -22,11 +22,11 @@
22
22
  "zero-virtual.css"
23
23
  ],
24
24
  "dependencies": {
25
- "@plumeria/utils": "^2.4.1"
25
+ "@plumeria/utils": "^3.0.0"
26
26
  },
27
27
  "devDependencies": {
28
28
  "@swc/core": "1.15.2",
29
- "zss-engine": "2.1.0"
29
+ "zss-engine": "2.1.2"
30
30
  },
31
31
  "publishConfig": {
32
32
  "access": "public",