@pikacss/integration 0.0.40 → 0.0.41

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/dist/index.cjs CHANGED
@@ -309,12 +309,6 @@ function useTransform({ cwd, cssCodegenFilepath, tsCodegenFilepath, scan, fnName
309
309
  `${fnName$1}["arr"]`,
310
310
  `${fnName$1}[\`arr\`]`
311
311
  ]),
312
- forceInline: new Set([
313
- `${fnName$1}.inl`,
314
- `${fnName$1}['inl']`,
315
- `${fnName$1}["inl"]`,
316
- `${fnName$1}[\`inl\`]`
317
- ]),
318
312
  normalPreview: new Set([`${fnName$1}p`]),
319
313
  forceStringPreview: new Set([
320
314
  `${fnName$1}p.str`,
@@ -327,20 +321,13 @@ function useTransform({ cwd, cssCodegenFilepath, tsCodegenFilepath, scan, fnName
327
321
  `${fnName$1}p['arr']`,
328
322
  `${fnName$1}p["arr"]`,
329
323
  `${fnName$1}p[\`arr\`]`
330
- ]),
331
- forceInlinePreview: new Set([
332
- `${fnName$1}p.inl`,
333
- `${fnName$1}p['inl']`,
334
- `${fnName$1}p["inl"]`,
335
- `${fnName$1}p[\`inl\`]`
336
324
  ])
337
325
  };
338
326
  return {
339
327
  isNormal: (fnName$2) => available.normal.has(fnName$2) || available.normalPreview.has(fnName$2),
340
328
  isForceString: (fnName$2) => available.forceString.has(fnName$2) || available.forceStringPreview.has(fnName$2),
341
329
  isForceArray: (fnName$2) => available.forceArray.has(fnName$2) || available.forceArrayPreview.has(fnName$2),
342
- isForceInline: (fnName$2) => available.forceInline.has(fnName$2) || available.forceInlinePreview.has(fnName$2),
343
- isPreview: (fnName$2) => available.normalPreview.has(fnName$2) || available.forceStringPreview.has(fnName$2) || available.forceArrayPreview.has(fnName$2) || available.forceInlinePreview.has(fnName$2),
330
+ isPreview: (fnName$2) => available.normalPreview.has(fnName$2) || available.forceStringPreview.has(fnName$2) || available.forceArrayPreview.has(fnName$2),
344
331
  RE: new RegExp(`\\b(${Object.values(available).flatMap((s) => [...s].map((f) => `(${f.replace(ESCAPE_REPLACE_RE, "\\$&")})`)).join("|")})\\(`, "g")
345
332
  };
346
333
  }
@@ -434,7 +421,6 @@ function useTransform({ cwd, cssCodegenFilepath, tsCodegenFilepath, scan, fnName
434
421
  if (fnUtils.isNormal(fnCall.fnName)) transformedContent = transformedFormat === "array" ? `[${names.map((n) => `'${n}'`).join(", ")}]` : transformedFormat === "string" ? `'${names.join(" ")}'` : names.join(" ");
435
422
  else if (fnUtils.isForceString(fnCall.fnName)) transformedContent = `'${names.join(" ")}'`;
436
423
  else if (fnUtils.isForceArray(fnCall.fnName)) transformedContent = `[${names.map((n) => `'${n}'`).join(", ")}]`;
437
- else if (fnUtils.isForceInline(fnCall.fnName)) transformedContent = names.join(" ");
438
424
  else throw new Error(`Unexpected function name: ${fnCall.fnName}`);
439
425
  transformed.update(fnCall.start, fnCall.end + 1, transformedContent);
440
426
  }
package/dist/index.d.cts CHANGED
@@ -21,7 +21,6 @@ interface FnUtils {
21
21
  isNormal: (fnName: string) => boolean;
22
22
  isForceString: (fnName: string) => boolean;
23
23
  isForceArray: (fnName: string) => boolean;
24
- isForceInline: (fnName: string) => boolean;
25
24
  isPreview: (fnName: string) => boolean;
26
25
  RE: RegExp;
27
26
  }
package/dist/index.d.mts CHANGED
@@ -21,7 +21,6 @@ interface FnUtils {
21
21
  isNormal: (fnName: string) => boolean;
22
22
  isForceString: (fnName: string) => boolean;
23
23
  isForceArray: (fnName: string) => boolean;
24
- isForceInline: (fnName: string) => boolean;
25
24
  isPreview: (fnName: string) => boolean;
26
25
  RE: RegExp;
27
26
  }
package/dist/index.mjs CHANGED
@@ -283,12 +283,6 @@ function useTransform({ cwd, cssCodegenFilepath, tsCodegenFilepath, scan, fnName
283
283
  `${fnName$1}["arr"]`,
284
284
  `${fnName$1}[\`arr\`]`
285
285
  ]),
286
- forceInline: new Set([
287
- `${fnName$1}.inl`,
288
- `${fnName$1}['inl']`,
289
- `${fnName$1}["inl"]`,
290
- `${fnName$1}[\`inl\`]`
291
- ]),
292
286
  normalPreview: new Set([`${fnName$1}p`]),
293
287
  forceStringPreview: new Set([
294
288
  `${fnName$1}p.str`,
@@ -301,20 +295,13 @@ function useTransform({ cwd, cssCodegenFilepath, tsCodegenFilepath, scan, fnName
301
295
  `${fnName$1}p['arr']`,
302
296
  `${fnName$1}p["arr"]`,
303
297
  `${fnName$1}p[\`arr\`]`
304
- ]),
305
- forceInlinePreview: new Set([
306
- `${fnName$1}p.inl`,
307
- `${fnName$1}p['inl']`,
308
- `${fnName$1}p["inl"]`,
309
- `${fnName$1}p[\`inl\`]`
310
298
  ])
311
299
  };
312
300
  return {
313
301
  isNormal: (fnName$2) => available.normal.has(fnName$2) || available.normalPreview.has(fnName$2),
314
302
  isForceString: (fnName$2) => available.forceString.has(fnName$2) || available.forceStringPreview.has(fnName$2),
315
303
  isForceArray: (fnName$2) => available.forceArray.has(fnName$2) || available.forceArrayPreview.has(fnName$2),
316
- isForceInline: (fnName$2) => available.forceInline.has(fnName$2) || available.forceInlinePreview.has(fnName$2),
317
- isPreview: (fnName$2) => available.normalPreview.has(fnName$2) || available.forceStringPreview.has(fnName$2) || available.forceArrayPreview.has(fnName$2) || available.forceInlinePreview.has(fnName$2),
304
+ isPreview: (fnName$2) => available.normalPreview.has(fnName$2) || available.forceStringPreview.has(fnName$2) || available.forceArrayPreview.has(fnName$2),
318
305
  RE: new RegExp(`\\b(${Object.values(available).flatMap((s) => [...s].map((f) => `(${f.replace(ESCAPE_REPLACE_RE, "\\$&")})`)).join("|")})\\(`, "g")
319
306
  };
320
307
  }
@@ -408,7 +395,6 @@ function useTransform({ cwd, cssCodegenFilepath, tsCodegenFilepath, scan, fnName
408
395
  if (fnUtils.isNormal(fnCall.fnName)) transformedContent = transformedFormat === "array" ? `[${names.map((n) => `'${n}'`).join(", ")}]` : transformedFormat === "string" ? `'${names.join(" ")}'` : names.join(" ");
409
396
  else if (fnUtils.isForceString(fnCall.fnName)) transformedContent = `'${names.join(" ")}'`;
410
397
  else if (fnUtils.isForceArray(fnCall.fnName)) transformedContent = `[${names.map((n) => `'${n}'`).join(", ")}]`;
411
- else if (fnUtils.isForceInline(fnCall.fnName)) transformedContent = names.join(" ");
412
398
  else throw new Error(`Unexpected function name: ${fnCall.fnName}`);
413
399
  transformed.update(fnCall.start, fnCall.end + 1, transformedContent);
414
400
  }
package/package.json CHANGED
@@ -1,16 +1,16 @@
1
1
  {
2
2
  "name": "@pikacss/integration",
3
3
  "type": "module",
4
- "version": "0.0.40",
4
+ "version": "0.0.41",
5
5
  "author": "DevilTea <ch19980814@gmail.com>",
6
6
  "license": "MIT",
7
7
  "repository": {
8
8
  "type": "git",
9
- "url": "https://github.com/pikacss/pikacss.github.io.git",
9
+ "url": "https://github.com/pikacss/pikacss.git",
10
10
  "directory": "packages/integration"
11
11
  },
12
12
  "bugs": {
13
- "url": "https://github.com/pikacss/pikacss.github.io/issues"
13
+ "url": "https://github.com/pikacss/pikacss/issues"
14
14
  },
15
15
  "keywords": [
16
16
  "pikacss",
@@ -49,7 +49,7 @@
49
49
  "micromatch": "^4.0.8",
50
50
  "pathe": "^2.0.3",
51
51
  "perfect-debounce": "^2.0.0",
52
- "@pikacss/core": "0.0.40"
52
+ "@pikacss/core": "0.0.41"
53
53
  },
54
54
  "devDependencies": {
55
55
  "@types/micromatch": "^4.0.10"
package/README.md DELETED
@@ -1,325 +0,0 @@
1
- # @pikacss/integration
2
-
3
- Low-level integration API for building PikaCSS bundler and framework plugins.
4
-
5
- ## ⚠️ Internal Package
6
-
7
- **This is an internal package** used by official PikaCSS integration plugins.
8
-
9
- **Most users should use these instead:**
10
- - **[`@pikacss/unplugin-pikacss`](../unplugin/)** - Universal plugin for multiple bundlers
11
- - **[`@pikacss/nuxt-pikacss`](../nuxt/)** - Nuxt module
12
-
13
- ## Installation
14
-
15
- Only needed for plugin development:
16
-
17
- ```bash
18
- pnpm add @pikacss/integration
19
- ```
20
-
21
- ## Overview
22
-
23
- This package provides the bridge between the @pikacss/core style engine and build tools. It handles:
24
-
25
- - 🔍 **Source code scanning** - Find `pika()` function calls in your project
26
- - 🔄 **Build-time transformation** - Evaluate style arguments and replace with class names
27
- - ⚙️ **Config loading** - Resolve and load `pika.config.js/ts` files
28
- - 📝 **Code generation** - Generate `pika.gen.css` and `pika.gen.ts` files
29
- - 🎯 **Engine integration** - Connect source code to the core style engine
30
-
31
- ## API Reference
32
-
33
- ### `createCtx(options)`
34
-
35
- Creates an integration context for managing PikaCSS transformations.
36
-
37
- ```typescript
38
- import { createCtx } from '@pikacss/integration'
39
-
40
- const ctx = createCtx({
41
- cwd: process.cwd(),
42
- currentPackageName: '@my-org/my-plugin',
43
- scan: {
44
- include: ['src/**/*.{ts,tsx,js,jsx,vue}'],
45
- exclude: ['node_modules/**', 'dist/**']
46
- },
47
- configOrPath: './pika.config.ts',
48
- fnName: 'pika',
49
- transformedFormat: 'string',
50
- tsCodegen: 'pika.gen.ts',
51
- cssCodegen: 'pika.gen.css',
52
- autoCreateConfig: true
53
- })
54
-
55
- await ctx.setup()
56
- ```
57
-
58
- **Parameters:**
59
-
60
- - `options: IntegrationContextOptions` - Configuration object
61
-
62
- **Returns:** `IntegrationContext` - Context object with transformation methods
63
-
64
- ### `IntegrationContextOptions`
65
-
66
- Configuration options for creating an integration context.
67
-
68
- ```typescript
69
- interface IntegrationContextOptions {
70
- // Working directory (usually process.cwd())
71
- cwd: string
72
-
73
- // Package name using this integration (for config generation)
74
- currentPackageName: string
75
-
76
- // File scanning patterns
77
- scan: {
78
- include: string[] // Glob patterns to include
79
- exclude: string[] // Glob patterns to exclude
80
- }
81
-
82
- // Engine config (inline object or path to config file)
83
- configOrPath: EngineConfig | string | Nullish
84
-
85
- // Function name to detect (default: 'pika')
86
- fnName: string
87
-
88
- // Output format for transformed code
89
- transformedFormat: 'string' | 'array' | 'inline'
90
-
91
- // TypeScript codegen file path (false to disable)
92
- tsCodegen: false | string
93
-
94
- // CSS codegen file path
95
- cssCodegen: string
96
-
97
- // Auto-create config file if not found
98
- autoCreateConfig: boolean
99
- }
100
- ```
101
-
102
- **Field descriptions:**
103
-
104
- - **`cwd`**: Root directory for file operations
105
- - **`currentPackageName`**: Identifier for the consuming plugin (used in generated config files)
106
- - **`scan.include`**: Glob patterns for files to transform (e.g., `['src/**/*.tsx']`)
107
- - **`scan.exclude`**: Glob patterns to skip (e.g., `['node_modules/**']`)
108
- - **`configOrPath`**: Either an inline `EngineConfig` object or a path to config file
109
- - **`fnName`**: Name of style function to detect (supports variants like `pika.str`, `pika.arr`, `pika.inl`)
110
- - **`transformedFormat`**: Default output format - `'string'` for space-separated classes, `'array'` for array of classes, `'inline'` for bare string
111
- - **`tsCodegen`**: Path for generated TypeScript definitions (set to `false` to disable)
112
- - **`cssCodegen`**: Path for generated CSS file
113
- - **`autoCreateConfig`**: Whether to generate a default config file if none exists
114
-
115
- ### `IntegrationContext`
116
-
117
- The context object returned by `createCtx()` with methods for transformation and code generation.
118
-
119
- ```typescript
120
- interface IntegrationContext {
121
- // Configuration properties
122
- cwd: string
123
- currentPackageName: string
124
- fnName: string
125
- transformedFormat: 'string' | 'array' | 'inline'
126
- cssCodegenFilepath: string
127
- tsCodegenFilepath: string | Nullish
128
-
129
- // Environment detection
130
- hasVue: boolean // Whether Vue is installed
131
-
132
- // Loaded config
133
- resolvedConfig: EngineConfig | Nullish
134
- resolvedConfigPath: string | Nullish
135
- resolvedConfigContent: string | Nullish
136
-
137
- // Config loading
138
- loadConfig: () => Promise<
139
- | { config: EngineConfig, file: null }
140
- | { config: null, file: null }
141
- | { config: EngineConfig, file: string }
142
- >
143
-
144
- // Usage tracking
145
- usages: Map<string, UsageRecord[]>
146
-
147
- // Event hooks
148
- hooks: {
149
- styleUpdated: EventHook<void>
150
- tsCodegenUpdated: EventHook<void>
151
- }
152
-
153
- // Style engine
154
- engine: Engine
155
-
156
- // Transform filter
157
- transformFilter: {
158
- include: string[]
159
- exclude: string[]
160
- }
161
-
162
- // Core methods
163
- transform: (code: string, id: string) => Promise<{ code: string, map: SourceMap } | Nullish>
164
- getCssCodegenContent: () => Promise<string | Nullish>
165
- getTsCodegenContent: () => Promise<string | Nullish>
166
- writeCssCodegenFile: () => Promise<void>
167
- writeTsCodegenFile: () => Promise<void>
168
- fullyCssCodegen: () => Promise<void>
169
-
170
- // Lifecycle
171
- setupPromise: Promise<void> | null
172
- setup: () => Promise<void>
173
- }
174
- ```
175
-
176
- **Key methods:**
177
-
178
- - **`setup()`**: Initialize the context (load config, create engine). Must be called before using other methods.
179
- - **`transform(code, id)`**: Transform source code by replacing `pika()` calls with class names. Returns transformed code and source map.
180
- - **`getCssCodegenContent()`**: Generate CSS content from all collected style usages.
181
- - **`getTsCodegenContent()`**: Generate TypeScript definitions for the global `pika` function.
182
- - **`writeCssCodegenFile()`**: Write generated CSS to `cssCodegenFilepath`.
183
- - **`writeTsCodegenFile()`**: Write generated TypeScript definitions to `tsCodegenFilepath`.
184
- - **`fullyCssCodegen()`**: Scan all files matching `scan` patterns, collect usages, and write CSS file.
185
-
186
- **Event hooks:**
187
-
188
- - **`hooks.styleUpdated`**: Triggered when atomic styles or preflights change
189
- - **`hooks.tsCodegenUpdated`**: Triggered when TypeScript autocomplete config changes
190
-
191
- ### `UsageRecord`
192
-
193
- Tracks a single `pika()` function call and its generated class names.
194
-
195
- ```typescript
196
- interface UsageRecord {
197
- atomicStyleIds: string[] // Generated class names
198
- params: Parameters<Engine['use']> // Original style arguments
199
- }
200
- ```
201
-
202
- ## Usage Example
203
-
204
- Complete example for a custom bundler plugin:
205
-
206
- ```typescript
207
- import { createCtx } from '@pikacss/integration'
208
-
209
- export function myPikaCSSPlugin(options = {}) {
210
- let ctx
211
-
212
- return {
213
- name: 'my-pikacss-plugin',
214
-
215
- async buildStart() {
216
- // Create context
217
- ctx = createCtx({
218
- cwd: process.cwd(),
219
- currentPackageName: '@my-org/my-plugin',
220
- scan: {
221
- include: options.include || ['src/**/*.{ts,tsx}'],
222
- exclude: options.exclude || ['node_modules/**']
223
- },
224
- configOrPath: options.config,
225
- fnName: options.fnName || 'pika',
226
- transformedFormat: options.format || 'string',
227
- tsCodegen: options.tsCodegen !== false ? 'pika.gen.ts' : false,
228
- cssCodegen: options.cssCodegen || 'pika.gen.css',
229
- autoCreateConfig: options.autoCreateConfig !== false
230
- })
231
-
232
- // Initialize context
233
- await ctx.setup()
234
-
235
- // Listen for style updates
236
- ctx.hooks.styleUpdated.on(async () => {
237
- await ctx.writeCssCodegenFile()
238
- })
239
-
240
- ctx.hooks.tsCodegenUpdated.on(async () => {
241
- await ctx.writeTsCodegenFile()
242
- })
243
- },
244
-
245
- // Resolve virtual module
246
- resolveId(id) {
247
- if (id === 'pika.css') {
248
- return id // Mark as virtual module
249
- }
250
- },
251
-
252
- // Load virtual module
253
- async load(id) {
254
- if (id === 'pika.css') {
255
- const content = await ctx.getCssCodegenContent()
256
- return content
257
- }
258
- },
259
-
260
- // Transform source files
261
- async transform(code, id) {
262
- // Check if file should be transformed
263
- const shouldTransform = ctx.transformFilter.include.some(pattern =>
264
- micromatch.isMatch(id, pattern)
265
- ) && !ctx.transformFilter.exclude.some(pattern =>
266
- micromatch.isMatch(id, pattern)
267
- )
268
-
269
- if (!shouldTransform)
270
- return
271
-
272
- // Transform code
273
- const result = await ctx.transform(code, id)
274
- if (result) {
275
- return {
276
- code: result.code,
277
- map: result.map
278
- }
279
- }
280
- }
281
- }
282
- }
283
- ```
284
-
285
- ## Core Re-exports
286
-
287
- This package re-exports all exports from `@pikacss/core`:
288
-
289
- ```typescript
290
- export * from '@pikacss/core'
291
- ```
292
-
293
- This includes:
294
- - `createEngine`, `defineEngineConfig`, `defineEnginePlugin`
295
- - `Engine`, `EngineConfig`, `EnginePlugin` types
296
- - All core style utilities and types
297
-
298
- See [@pikacss/core documentation](../core/README.md) for details.
299
-
300
- ## For Plugin Authors
301
-
302
- If you're building a custom integration:
303
-
304
- 1. **Study existing implementations:**
305
- - [`@pikacss/unplugin-pikacss`](../unplugin/src/index.ts) - Universal plugin using unplugin
306
- - [`@pikacss/nuxt-pikacss`](../nuxt/src/index.ts) - Nuxt module integration
307
-
308
- 2. **Key integration points:**
309
- - Call `ctx.setup()` during plugin initialization
310
- - Use `ctx.transform()` in your bundler's transform hook
311
- - Resolve `'pika.css'` as virtual module returning `await ctx.getCssCodegenContent()`
312
- - Listen to `ctx.hooks.styleUpdated` for HMR support
313
-
314
- 3. **Testing:**
315
- - Create fixture projects with valid/invalid PikaCSS usage
316
- - Test build-time transformation and error reporting
317
- - Verify source maps are preserved
318
-
319
- ## Documentation
320
-
321
- For complete documentation, visit: [PikaCSS Documentation](https://pikacss.github.io/pikacss/)
322
-
323
- ## License
324
-
325
- MIT © DevilTea