@pikacss/core 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.d.cts +15 -13
- package/dist/index.d.mts +15 -13
- package/package.json +3 -3
- package/README.md +0 -238
package/dist/index.d.cts
CHANGED
|
@@ -26,7 +26,7 @@ interface DynamicRule<T> {
|
|
|
26
26
|
createResolved: (matched: RegExpMatchArray) => Awaitable<T>;
|
|
27
27
|
}
|
|
28
28
|
declare abstract class AbstractResolver<T> {
|
|
29
|
-
|
|
29
|
+
_resolvedResultsMap: Map<string, ResolvedResult<T>>;
|
|
30
30
|
staticRulesMap: Map<string, StaticRule<T>>;
|
|
31
31
|
dynamicRulesMap: Map<string, DynamicRule<T>>;
|
|
32
32
|
onResolved: (string: string, type: 'static' | 'dynamic', result: ResolvedResult<T>) => void;
|
|
@@ -326,18 +326,20 @@ declare class Engine {
|
|
|
326
326
|
}
|
|
327
327
|
//#endregion
|
|
328
328
|
//#region src/internal/plugin.d.ts
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
329
|
+
type DefineHooks<Hooks extends Record<string, [type: 'sync' | 'async', payload: any, returnValue?: any]>> = Hooks;
|
|
330
|
+
type EngineHooksDefinition = DefineHooks<{
|
|
331
|
+
configureRawConfig: ['async', config: EngineConfig$1];
|
|
332
|
+
rawConfigConfigured: ['sync', config: EngineConfig$1, void];
|
|
333
|
+
configureResolvedConfig: ['async', resolvedConfig: ResolvedEngineConfig];
|
|
334
|
+
configureEngine: ['async', engine: Engine];
|
|
335
|
+
transformSelectors: ['async', selectors: string[]];
|
|
336
|
+
transformStyleItems: ['async', styleItems: ResolvedStyleItem[]];
|
|
337
|
+
transformStyleDefinitions: ['async', styleDefinitions: ResolvedStyleDefinition[]];
|
|
338
|
+
preflightUpdated: ['sync', void];
|
|
339
|
+
atomicStyleAdded: ['sync', AtomicStyle];
|
|
340
|
+
autocompleteConfigUpdated: ['sync', void];
|
|
341
|
+
}>;
|
|
342
|
+
type EnginePluginHooksOptions = { [K in keyof EngineHooksDefinition]?: EngineHooksDefinition[K][0] extends 'async' ? (...params: EngineHooksDefinition[K][1] extends void ? [] : [payload: EngineHooksDefinition[K][1]]) => Awaitable<EngineHooksDefinition[K][1] | void> : (...params: EngineHooksDefinition[K][1] extends void ? [] : [payload: EngineHooksDefinition[K][1]]) => EngineHooksDefinition[K][1] | void };
|
|
341
343
|
interface EnginePlugin extends EnginePluginHooksOptions {
|
|
342
344
|
name: string;
|
|
343
345
|
order?: 'pre' | 'post';
|
package/dist/index.d.mts
CHANGED
|
@@ -26,7 +26,7 @@ interface DynamicRule<T> {
|
|
|
26
26
|
createResolved: (matched: RegExpMatchArray) => Awaitable<T>;
|
|
27
27
|
}
|
|
28
28
|
declare abstract class AbstractResolver<T> {
|
|
29
|
-
|
|
29
|
+
_resolvedResultsMap: Map<string, ResolvedResult<T>>;
|
|
30
30
|
staticRulesMap: Map<string, StaticRule<T>>;
|
|
31
31
|
dynamicRulesMap: Map<string, DynamicRule<T>>;
|
|
32
32
|
onResolved: (string: string, type: 'static' | 'dynamic', result: ResolvedResult<T>) => void;
|
|
@@ -326,18 +326,20 @@ declare class Engine {
|
|
|
326
326
|
}
|
|
327
327
|
//#endregion
|
|
328
328
|
//#region src/internal/plugin.d.ts
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
329
|
+
type DefineHooks<Hooks extends Record<string, [type: 'sync' | 'async', payload: any, returnValue?: any]>> = Hooks;
|
|
330
|
+
type EngineHooksDefinition = DefineHooks<{
|
|
331
|
+
configureRawConfig: ['async', config: EngineConfig$1];
|
|
332
|
+
rawConfigConfigured: ['sync', config: EngineConfig$1, void];
|
|
333
|
+
configureResolvedConfig: ['async', resolvedConfig: ResolvedEngineConfig];
|
|
334
|
+
configureEngine: ['async', engine: Engine];
|
|
335
|
+
transformSelectors: ['async', selectors: string[]];
|
|
336
|
+
transformStyleItems: ['async', styleItems: ResolvedStyleItem[]];
|
|
337
|
+
transformStyleDefinitions: ['async', styleDefinitions: ResolvedStyleDefinition[]];
|
|
338
|
+
preflightUpdated: ['sync', void];
|
|
339
|
+
atomicStyleAdded: ['sync', AtomicStyle];
|
|
340
|
+
autocompleteConfigUpdated: ['sync', void];
|
|
341
|
+
}>;
|
|
342
|
+
type EnginePluginHooksOptions = { [K in keyof EngineHooksDefinition]?: EngineHooksDefinition[K][0] extends 'async' ? (...params: EngineHooksDefinition[K][1] extends void ? [] : [payload: EngineHooksDefinition[K][1]]) => Awaitable<EngineHooksDefinition[K][1] | void> : (...params: EngineHooksDefinition[K][1] extends void ? [] : [payload: EngineHooksDefinition[K][1]]) => EngineHooksDefinition[K][1] | void };
|
|
341
343
|
interface EnginePlugin extends EnginePluginHooksOptions {
|
|
342
344
|
name: string;
|
|
343
345
|
order?: 'pre' | 'post';
|
package/package.json
CHANGED
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pikacss/core",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "0.0.
|
|
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.
|
|
9
|
+
"url": "https://github.com/pikacss/pikacss.git",
|
|
10
10
|
"directory": "packages/core"
|
|
11
11
|
},
|
|
12
12
|
"bugs": {
|
|
13
|
-
"url": "https://github.com/pikacss/pikacss
|
|
13
|
+
"url": "https://github.com/pikacss/pikacss/issues"
|
|
14
14
|
},
|
|
15
15
|
"keywords": [
|
|
16
16
|
"pikacss",
|
package/README.md
DELETED
|
@@ -1,238 +0,0 @@
|
|
|
1
|
-
# @pikacss/core
|
|
2
|
-
|
|
3
|
-
The core Atomic CSS-in-JS engine of PikaCSS.
|
|
4
|
-
|
|
5
|
-
## Installation
|
|
6
|
-
|
|
7
|
-
```bash
|
|
8
|
-
pnpm add @pikacss/core
|
|
9
|
-
```
|
|
10
|
-
|
|
11
|
-
## Quick Start
|
|
12
|
-
|
|
13
|
-
```typescript
|
|
14
|
-
import { createEngine, defineEngineConfig } from '@pikacss/core'
|
|
15
|
-
|
|
16
|
-
const config = defineEngineConfig({
|
|
17
|
-
// Engine configuration
|
|
18
|
-
prefix: 'pk-',
|
|
19
|
-
defaultSelector: '.%',
|
|
20
|
-
plugins: []
|
|
21
|
-
})
|
|
22
|
-
|
|
23
|
-
// createEngine is async and returns a fully initialized engine
|
|
24
|
-
const engine = await createEngine(config)
|
|
25
|
-
```
|
|
26
|
-
|
|
27
|
-
## Features
|
|
28
|
-
|
|
29
|
-
- ⚡ High-performance Atomic CSS-in-JS engine
|
|
30
|
-
- 🎯 Type-safe with full TypeScript support
|
|
31
|
-
- 🔌 Extensible plugin system with hooks
|
|
32
|
-
- 🎨 Built-in support for shortcuts, selectors, variables, keyframes, and important rules
|
|
33
|
-
- 🔧 Fully configurable with type-safe helpers
|
|
34
|
-
- 🌐 Framework-agnostic core (zero dependencies except csstype)
|
|
35
|
-
|
|
36
|
-
## Usage for Integration Developers
|
|
37
|
-
|
|
38
|
-
### Creating an Engine
|
|
39
|
-
|
|
40
|
-
```typescript
|
|
41
|
-
import { createEngine, defineEngineConfig } from '@pikacss/core'
|
|
42
|
-
|
|
43
|
-
const config = defineEngineConfig({
|
|
44
|
-
// Prefix for generated atomic CSS class names
|
|
45
|
-
prefix: 'pk-',
|
|
46
|
-
|
|
47
|
-
// Default selector format (% will be replaced with atomic ID)
|
|
48
|
-
defaultSelector: '.%',
|
|
49
|
-
|
|
50
|
-
// Plugins to extend functionality
|
|
51
|
-
plugins: [],
|
|
52
|
-
|
|
53
|
-
// Global CSS preflights
|
|
54
|
-
preflights: [],
|
|
55
|
-
})
|
|
56
|
-
|
|
57
|
-
// createEngine is async - it returns a fully initialized engine
|
|
58
|
-
const engine = await createEngine(config)
|
|
59
|
-
```
|
|
60
|
-
|
|
61
|
-
### Engine Methods and Properties
|
|
62
|
-
|
|
63
|
-
The `Engine` instance provides methods and sub-systems for managing CSS generation:
|
|
64
|
-
|
|
65
|
-
```typescript
|
|
66
|
-
// Add global CSS preflight
|
|
67
|
-
engine.addPreflight('* { box-sizing: border-box; }')
|
|
68
|
-
|
|
69
|
-
// Process style items and get atomic class IDs
|
|
70
|
-
const classNames = await engine.use({ color: 'red' }, { display: 'flex' })
|
|
71
|
-
|
|
72
|
-
// Render generated preflights
|
|
73
|
-
const preflightCSS = await engine.renderPreflights(true)
|
|
74
|
-
|
|
75
|
-
// Render generated atomic styles
|
|
76
|
-
const atomicCSS = await engine.renderAtomicStyles(true)
|
|
77
|
-
|
|
78
|
-
// Access sub-systems (provided by built-in plugins)
|
|
79
|
-
engine.variables // { store: Map, add: (variables) => void }
|
|
80
|
-
engine.keyframes // { store: Map, add: (...keyframes) => void }
|
|
81
|
-
engine.selectors // { resolver: SelectorResolver, add: (...selectors) => void }
|
|
82
|
-
engine.shortcuts // { resolver: ShortcutResolver, add: (...shortcuts) => void }
|
|
83
|
-
|
|
84
|
-
// Access configuration
|
|
85
|
-
engine.config // ResolvedEngineConfig
|
|
86
|
-
|
|
87
|
-
// Autocomplete helpers
|
|
88
|
-
engine.appendAutocompleteSelectors('hover', 'focus')
|
|
89
|
-
engine.appendAutocompleteStyleItemStrings('flex-center')
|
|
90
|
-
```
|
|
91
|
-
|
|
92
|
-
### Configuration
|
|
93
|
-
|
|
94
|
-
Use `defineEngineConfig` for type-safe configuration:
|
|
95
|
-
|
|
96
|
-
```typescript
|
|
97
|
-
import { defineEngineConfig } from '@pikacss/core'
|
|
98
|
-
|
|
99
|
-
export default defineEngineConfig({
|
|
100
|
-
// Prefix for atomic class IDs
|
|
101
|
-
prefix: 'pk-',
|
|
102
|
-
|
|
103
|
-
// Default selector format (% = atomic ID)
|
|
104
|
-
defaultSelector: '.%',
|
|
105
|
-
|
|
106
|
-
// Global CSS preflights (string or function)
|
|
107
|
-
preflights: [
|
|
108
|
-
':root { --primary: #3b82f6; }',
|
|
109
|
-
// Or function:
|
|
110
|
-
(engine, isFormatted) => '/* Generated CSS */'
|
|
111
|
-
],
|
|
112
|
-
|
|
113
|
-
// Shortcuts configuration
|
|
114
|
-
shortcuts: {
|
|
115
|
-
shortcuts: [
|
|
116
|
-
['flex-center', {
|
|
117
|
-
display: 'flex',
|
|
118
|
-
alignItems: 'center',
|
|
119
|
-
justifyContent: 'center'
|
|
120
|
-
}],
|
|
121
|
-
]
|
|
122
|
-
},
|
|
123
|
-
|
|
124
|
-
// Plugins to extend functionality
|
|
125
|
-
plugins: []
|
|
126
|
-
})
|
|
127
|
-
```
|
|
128
|
-
|
|
129
|
-
## API
|
|
130
|
-
|
|
131
|
-
### Main Exports
|
|
132
|
-
|
|
133
|
-
```typescript
|
|
134
|
-
// Engine creation (async)
|
|
135
|
-
export function createEngine(config?: EngineConfig): Promise<Engine>
|
|
136
|
-
|
|
137
|
-
// Type-safe config helpers
|
|
138
|
-
export function defineEngineConfig(config: EngineConfig): EngineConfig
|
|
139
|
-
export function defineEnginePlugin(plugin: EnginePlugin): EnginePlugin
|
|
140
|
-
export function defineStyleDefinition(def: StyleDefinition): StyleDefinition
|
|
141
|
-
export function definePreflight(preflight: Preflight): Preflight
|
|
142
|
-
export function defineKeyframes(keyframes: Keyframes): Keyframes
|
|
143
|
-
export function defineSelector(selector: Selector): Selector
|
|
144
|
-
export function defineShortcut(shortcut: Shortcut): Shortcut
|
|
145
|
-
export function defineVariables(variables: VariablesDefinition): VariablesDefinition
|
|
146
|
-
|
|
147
|
-
// Utilities
|
|
148
|
-
export {
|
|
149
|
-
appendAutocompleteCssPropertyValues,
|
|
150
|
-
appendAutocompleteExtraCssProperties,
|
|
151
|
-
appendAutocompleteExtraProperties,
|
|
152
|
-
appendAutocompletePropertyValues,
|
|
153
|
-
appendAutocompleteSelectors,
|
|
154
|
-
appendAutocompleteStyleItemStrings,
|
|
155
|
-
createLogger,
|
|
156
|
-
log,
|
|
157
|
-
renderCSSStyleBlocks,
|
|
158
|
-
}
|
|
159
|
-
```
|
|
160
|
-
|
|
161
|
-
### Engine Instance
|
|
162
|
-
|
|
163
|
-
The `Engine` instance provides:
|
|
164
|
-
|
|
165
|
-
**Core methods:**
|
|
166
|
-
- `engine.addPreflight(css)` - Add global CSS preflight
|
|
167
|
-
- `engine.use(...styleItems)` - Process style items and return atomic class IDs
|
|
168
|
-
- `engine.renderPreflights(isFormatted)` - Render all preflight CSS
|
|
169
|
-
- `engine.renderAtomicStyles(isFormatted, options?)` - Render atomic style CSS
|
|
170
|
-
|
|
171
|
-
**Sub-systems (provided by built-in plugins):**
|
|
172
|
-
- `engine.variables` - CSS variables management with `store` and `add()`
|
|
173
|
-
- `engine.keyframes` - CSS keyframes management with `store` and `add()`
|
|
174
|
-
- `engine.selectors` - CSS selectors management with `resolver` and `add()`
|
|
175
|
-
- `engine.shortcuts` - CSS shortcuts management with `resolver` and `add()`
|
|
176
|
-
|
|
177
|
-
**Properties:**
|
|
178
|
-
- `engine.config` - Resolved engine configuration
|
|
179
|
-
- `engine.store` - Internal storage for atomic styles and IDs
|
|
180
|
-
- `engine.extract` - Style extraction function
|
|
181
|
-
|
|
182
|
-
## Plugin Development
|
|
183
|
-
|
|
184
|
-
Create custom plugins to extend PikaCSS using the `EnginePlugin` interface:
|
|
185
|
-
|
|
186
|
-
```typescript
|
|
187
|
-
/* eslint-disable pikacss/pika-module-augmentation */
|
|
188
|
-
import type { EnginePlugin } from '@pikacss/core'
|
|
189
|
-
import { defineEnginePlugin } from '@pikacss/core'
|
|
190
|
-
|
|
191
|
-
export function myPlugin(): EnginePlugin {
|
|
192
|
-
return defineEnginePlugin({
|
|
193
|
-
name: 'my-plugin',
|
|
194
|
-
|
|
195
|
-
// Optional: Control execution order ('pre' | 'post')
|
|
196
|
-
order: 'pre',
|
|
197
|
-
|
|
198
|
-
// Hook into engine lifecycle
|
|
199
|
-
async configureEngine(engine) {
|
|
200
|
-
// Add global CSS
|
|
201
|
-
engine.addPreflight('/* plugin styles */')
|
|
202
|
-
|
|
203
|
-
// Add custom shortcuts
|
|
204
|
-
engine.shortcuts.add([
|
|
205
|
-
'my-shortcut',
|
|
206
|
-
{ display: 'flex', gap: '1rem' }
|
|
207
|
-
])
|
|
208
|
-
|
|
209
|
-
// Add custom selectors
|
|
210
|
-
engine.selectors.add(['hover', '$:hover'])
|
|
211
|
-
},
|
|
212
|
-
|
|
213
|
-
// Transform style definitions
|
|
214
|
-
async transformStyleDefinitions(definitions) {
|
|
215
|
-
// Modify or add style definitions
|
|
216
|
-
return definitions
|
|
217
|
-
},
|
|
218
|
-
|
|
219
|
-
// Other available hooks:
|
|
220
|
-
// - configureRawConfig(config)
|
|
221
|
-
// - rawConfigConfigured(config)
|
|
222
|
-
// - configureResolvedConfig(config)
|
|
223
|
-
// - transformSelectors(selectors)
|
|
224
|
-
// - transformStyleItems(styleItems)
|
|
225
|
-
// - preflightUpdated()
|
|
226
|
-
// - atomicStyleAdded(atomicStyle)
|
|
227
|
-
// - autocompleteConfigUpdated()
|
|
228
|
-
})
|
|
229
|
-
}
|
|
230
|
-
```
|
|
231
|
-
|
|
232
|
-
## Documentation
|
|
233
|
-
|
|
234
|
-
For complete documentation, visit: [PikaCSS Documentation](https://pikacss.github.io/pikacss/)
|
|
235
|
-
|
|
236
|
-
## License
|
|
237
|
-
|
|
238
|
-
MIT © DevilTea
|