windrunner 1.1.2 → 1.1.3

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.ts CHANGED
@@ -1,12 +1,65 @@
1
+ // ─── Theme Configuration Types ────────────────────────────────────────────────
2
+
3
+ export type ThemeValue = string | number | ThemeScale | ThemeFunction;
4
+
5
+ export type ThemeScale = Record<string, string | number>;
6
+
7
+ export type ThemeFunction = (helpers: { theme: (key: string) => any }) => ThemeScale;
8
+
9
+ export interface ThemeColors {
10
+ [key: string]: string | Record<string, string>;
11
+ }
12
+
13
+ export interface ThemeConfig {
14
+ colors?: ThemeColors;
15
+ spacing?: ThemeScale;
16
+ screens?: Record<string, string>;
17
+ containers?: Record<string, string>;
18
+ borderRadius?: ThemeScale;
19
+ borderWidth?: ThemeScale;
20
+ fontSize?: ThemeScale;
21
+ fontFamily?: Record<string, string[]>;
22
+ fontWeight?: ThemeScale;
23
+ lineHeight?: ThemeScale;
24
+ letterSpacing?: ThemeScale;
25
+ opacity?: ThemeScale;
26
+ boxShadow?: ThemeScale;
27
+ blur?: ThemeScale;
28
+ brightness?: ThemeScale;
29
+ contrast?: ThemeScale;
30
+ grayscale?: ThemeScale;
31
+ hueRotate?: ThemeScale;
32
+ invert?: ThemeScale;
33
+ saturate?: ThemeScale;
34
+ sepia?: ThemeScale;
35
+ backdropBlur?: ThemeScale | ThemeFunction;
36
+ backdropBrightness?: ThemeScale | ThemeFunction;
37
+ backdropContrast?: ThemeScale | ThemeFunction;
38
+ backdropGrayscale?: ThemeScale | ThemeFunction;
39
+ backdropHueRotate?: ThemeScale | ThemeFunction;
40
+ backdropInvert?: ThemeScale | ThemeFunction;
41
+ backdropOpacity?: ThemeScale | ThemeFunction;
42
+ backdropSaturate?: ThemeScale | ThemeFunction;
43
+ backdropSepia?: ThemeScale | ThemeFunction;
44
+ backgroundColor?: ThemeColors | ThemeFunction;
45
+ backgroundImage?: ThemeScale;
46
+ backgroundPosition?: ThemeScale;
47
+ backgroundSize?: ThemeScale;
48
+ borderColor?: ThemeColors | ThemeFunction;
49
+ textColor?: ThemeColors | ThemeFunction;
50
+ extend?: Partial<ThemeConfig>;
51
+ [key: string]: ThemeValue | undefined;
52
+ }
53
+
1
54
  // ─── Plugin Types ─────────────────────────────────────────────────────────────
2
55
 
3
56
  export interface PluginAPI {
4
- addUtility(pattern: string | RegExp, handler: string | ((match: RegExpMatchArray, theme: any) => string)): void;
5
- addUtilities(utilities: Record<string, string | ((match: RegExpMatchArray, theme: any) => string)>): void;
57
+ addUtility(pattern: string | RegExp, handler: string | ((match: RegExpMatchArray, theme: ThemeConfig) => string | undefined)): void;
58
+ addUtilities(utilities: Record<string, string | ((match: RegExpMatchArray, theme: ThemeConfig) => string | undefined)>): void;
6
59
  addVariant(name: string, handler: (selector: string) => string): void;
7
60
  addVariants(variants: Record<string, (selector: string) => string>): void;
8
- theme(key?: string): any;
9
- config(): any;
61
+ theme<T = any>(key?: string): T;
62
+ config(): WindrunnerOptions;
10
63
  }
11
64
 
12
65
  export interface Plugin {
@@ -27,21 +80,94 @@ export function defineResponsiveUtilities(
27
80
  // ─── Runtime Options with Plugins ─────────────────────────────────────────────
28
81
 
29
82
  export interface WindrunnerOptions {
83
+ /** Unique ID for the style element (default: "tailwind-runtime-css") */
30
84
  id?: string;
85
+
86
+ /** Auto-start on initialization (default: true in browser) */
31
87
  autoStart?: boolean;
88
+
89
+ /** Include CSS preflight/reset (default: true) */
32
90
  preflight?: boolean;
91
+
92
+ /** Compatibility mode: "none" or "full" (default: "none") */
33
93
  compatMode?: "none" | "full";
94
+
95
+ /** Style element ID for compatibility mode CSS */
34
96
  compatStyleId?: string;
35
- compatGenerateCss?: (options: Record<string, any>) => string;
36
- theme?: Record<string, any>;
97
+
98
+ /** Function to generate full CSS for compatibility mode */
99
+ compatGenerateCss?: (options: WindrunnerOptions) => string;
100
+
101
+ /** Theme configuration */
102
+ theme?: ThemeConfig;
103
+
104
+ /** Array of plugins to register */
37
105
  plugins?: Plugin[];
106
+
107
+ /** Maximum cache size for compiled classes (default: 10000) */
38
108
  maxCacheSize?: number;
109
+
110
+ /** Callback fired when runtime is ready */
39
111
  onReady?: () => void;
40
- onError?: (className: string) => void;
112
+
113
+ /** Callback fired when a class name fails to compile */
114
+ onError?: (className: string, context?: ErrorContext) => void;
115
+
116
+ /** Callback fired when a class is successfully compiled */
41
117
  onCompile?: (className: string, cssRule: string) => void;
118
+
119
+ /** Callback fired when scan completes */
120
+ onScanComplete?: (stats: ScanStats) => void;
121
+
122
+ /** MutationObserver configuration options */
123
+ observerOptions?: ObserverOptions;
124
+
125
+ /** Additional user-defined options */
42
126
  [key: string]: any;
43
127
  }
44
128
 
129
+ export interface ErrorContext {
130
+ /** Reason for compilation failure */
131
+ reason: "unknown-utility" | "parse-error" | "invalid-value";
132
+
133
+ /** Base token that failed to compile */
134
+ baseToken?: string;
135
+
136
+ /** Parsed variants if available */
137
+ variants?: string[];
138
+
139
+ /** Additional error details */
140
+ details?: string;
141
+ }
142
+
143
+ export interface ScanStats {
144
+ /** Number of elements scanned */
145
+ elementCount: number;
146
+
147
+ /** Number of unique classes found */
148
+ classCount: number;
149
+
150
+ /** Number of CSS rules generated */
151
+ ruleCount: number;
152
+
153
+ /** Time taken in milliseconds */
154
+ duration?: number;
155
+ }
156
+
157
+ export interface ObserverOptions {
158
+ /** Observe child list changes (default: true) */
159
+ childList?: boolean;
160
+
161
+ /** Observe subtree changes (default: true) */
162
+ subtree?: boolean;
163
+
164
+ /** Observe attribute changes (default: true) */
165
+ attributes?: boolean;
166
+
167
+ /** Attributes to observe (default: ["class"]) */
168
+ attributeFilter?: string[];
169
+ }
170
+
45
171
  export interface RuntimeStats {
46
172
  cacheSize: number;
47
173
  insertedRuleCount: number;
@@ -51,25 +177,131 @@ export interface RuntimeStats {
51
177
  }
52
178
 
53
179
  export interface Runtime {
180
+ /** Compile and inject a single class name */
54
181
  processClassName(className: string): string | undefined;
182
+
183
+ /** Compile and inject multiple class names */
55
184
  processClassList(classList: string | string[] | ArrayLike<string>): string[];
185
+
186
+ /** Process all classes on an element */
56
187
  processElement(el: Element | null): void;
188
+
189
+ /** Scan document or element for classes */
57
190
  scan(root?: Document | Element): void;
191
+
192
+ /** Start observing for DOM changes */
58
193
  observe(root?: Element): void;
194
+
195
+ /** Flush pending element queue */
59
196
  flush(): void;
197
+
198
+ /** Start the runtime (scan + observe) */
60
199
  start(): void;
200
+
201
+ /** Stop observing and clear queues */
61
202
  disconnect(): void;
203
+
204
+ /** Clear the compilation cache */
62
205
  clearCache(): void;
206
+
207
+ /** Get runtime statistics */
63
208
  getStats(): RuntimeStats;
209
+
210
+ /** Check if compatibility mode is loaded */
64
211
  isCompatLoaded(): boolean;
212
+
213
+ /** Get current cache size */
65
214
  getCacheSize(): number;
215
+
216
+ /** Get number of inserted rules */
66
217
  getInsertedRuleCount(): number;
67
218
  }
68
219
 
220
+ // ─── Compiler API ─────────────────────────────────────────────────────────────
221
+
222
+ export interface CompilationContext {
223
+ config: WindrunnerOptions;
224
+ theme: ThemeConfig;
225
+ screens: Record<string, string>;
226
+ containers: Record<string, string>;
227
+ plugins: any;
228
+ }
229
+
230
+ export interface ParsedClass {
231
+ original: string;
232
+ baseToken: string;
233
+ variants: string[];
234
+ breakpoint: string | null;
235
+ containerBreakpoint: string | null;
236
+ important: boolean;
237
+ starting: boolean;
238
+ }
239
+
69
240
  export function createWindrunner(options?: WindrunnerOptions): Runtime;
70
- export function compileRuntimeClassNameWithContext(className: string, context: any): string;
71
- export function compileClass(className: string, options?: any): string;
72
- export function parseClass(className: string, screens?: Record<string,string>, containers?: Record<string,string>): { original: string; baseToken: string; variants: string[]; breakpoint: string | null; containerBreakpoint: string | null; important: boolean; starting: boolean } | null;
241
+
242
+ export function resolveRuntimeContext(options?: WindrunnerOptions): CompilationContext;
243
+
244
+ export function compileRuntimeClassNameWithContext(className: string, context: CompilationContext): string;
245
+
246
+ export function compileClass(className: string, options?: WindrunnerOptions): string;
247
+
248
+ export function parseClass(
249
+ className: string,
250
+ screens?: Record<string, string>,
251
+ containers?: Record<string, string>
252
+ ): ParsedClass | null;
253
+
254
+ export function getBaseTailwindOptions(options: WindrunnerOptions): Omit<WindrunnerOptions, 'id' | 'autoStart' | 'compatMode' | 'compatStyleId' | 'compatGenerateCss'>;
255
+
256
+ // ─── SSR / Critical CSS API ───────────────────────────────────────────────────
257
+
258
+ /**
259
+ * Compile multiple class names into a single CSS string for SSR / critical CSS.
260
+ * Useful for generating CSS at build time or server-side rendering.
261
+ *
262
+ * @param classNames - Single class string, array of class names, or space-separated string
263
+ * @param options - Windrunner configuration options
264
+ * @returns Combined CSS rules ready for injection
265
+ *
266
+ * @example
267
+ * ```ts
268
+ * // Server-side rendering
269
+ * import { compileCriticalCss } from 'windrunner';
270
+ *
271
+ * const css = compileCriticalCss([
272
+ * 'flex items-center gap-4',
273
+ * 'text-xl font-bold'
274
+ * ]);
275
+ *
276
+ * // Inject into HTML
277
+ * const html = `<style>${css}</style>`;
278
+ * ```
279
+ */
280
+ export function compileCriticalCss(
281
+ classNames: string | string[],
282
+ options?: WindrunnerOptions
283
+ ): string;
284
+
285
+ /**
286
+ * Extract unique class names from HTML string.
287
+ * Utility helper for compileCriticalCss.
288
+ *
289
+ * @param html - HTML content to extract classes from
290
+ * @returns Array of unique class names
291
+ *
292
+ * @example
293
+ * ```ts
294
+ * import { extractClassNames, compileCriticalCss } from 'windrunner';
295
+ *
296
+ * const html = '<div class="flex items-center">...</div>';
297
+ * const classes = extractClassNames(html);
298
+ * const css = compileCriticalCss(classes);
299
+ * ```
300
+ */
301
+ export function extractClassNames(html: string): string[];
302
+
303
+ // ─── Default Export ───────────────────────────────────────────────────────────
73
304
 
74
305
  declare function windrunner(options?: WindrunnerOptions): Runtime;
75
306
  export default windrunner;
307
+