@stacksjs/ts-css 0.1.4 → 0.3.2
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/ENGINE.md +677 -0
- package/PLUGIN.md +217 -0
- package/dist/bin/cli.js +29 -38
- package/dist/bin/cssx.js +405 -0
- package/dist/chunk-0h48763m.js +2 -0
- package/dist/chunk-br9jax0b.js +2 -0
- package/dist/chunk-f9gzb0a5.js +3 -0
- package/dist/chunk-genwkevp.js +3 -0
- package/dist/chunk-jj3s4ctf.js +62 -0
- package/dist/chunk-mz87cw2e.js +2 -0
- package/dist/engine/build.d.ts +26 -0
- package/dist/engine/color-modifier.d.ts +8 -0
- package/dist/engine/config.d.ts +5 -0
- package/dist/engine/format.d.ts +20 -0
- package/dist/engine/generator.d.ts +14 -0
- package/dist/engine/index.d.ts +13 -0
- package/dist/engine/index.js +653 -0
- package/dist/engine/parser.d.ts +68 -0
- package/dist/engine/plugin.d.ts +22 -0
- package/dist/engine/preflight-forms.d.ts +6 -0
- package/dist/engine/preflight.d.ts +3 -0
- package/dist/engine/rules-advanced.d.ts +27 -0
- package/dist/engine/rules-effects.d.ts +35 -0
- package/dist/engine/rules-forms.d.ts +8 -0
- package/dist/engine/rules-grid.d.ts +13 -0
- package/dist/engine/rules-icons.d.ts +2 -0
- package/dist/engine/rules-interactivity.d.ts +41 -0
- package/dist/engine/rules-layout.d.ts +28 -0
- package/dist/engine/rules-transforms.d.ts +35 -0
- package/dist/engine/rules-typography.d.ts +47 -0
- package/dist/engine/rules.d.ts +56 -0
- package/dist/engine/scanner.d.ts +16 -0
- package/dist/engine/style/api.d.ts +95 -0
- package/dist/engine/style/collect.d.ts +10 -0
- package/dist/engine/style/evaluate.d.ts +11 -0
- package/dist/engine/style/hash.d.ts +15 -0
- package/dist/engine/style/index.d.ts +56 -0
- package/dist/engine/style/plugin.d.ts +27 -0
- package/dist/engine/style/priority.d.ts +12 -0
- package/dist/engine/style/registry.d.ts +56 -0
- package/dist/engine/style/types.d.ts +54 -0
- package/dist/engine/style/value.d.ts +15 -0
- package/dist/engine/transformer-compile-class.d.ts +34 -0
- package/dist/engine/types.d.ts +156 -0
- package/dist/index.js +1 -60
- package/dist/optimize/index.js +1 -1
- package/dist/parse/index.js +1 -1
- package/dist/parse/list.d.ts +1 -1
- package/dist/select/index.js +1 -1
- package/dist/what/index.js +1 -1
- package/package.json +35 -19
- package/dist/chunk-1kmkypmr.js +0 -3
- package/dist/chunk-2wsah70r.js +0 -2
- package/dist/chunk-9ep6bwwb.js +0 -2
- package/dist/chunk-edwg811g.js +0 -2
- package/dist/chunk-thy3p95k.js +0 -3
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
/** Serialises everything `css.create()` and friends have registered so far. */
|
|
2
|
+
export declare function renderStyles(minify?: boolean): string;
|
|
3
|
+
/** Empties the registry. Tests and watch-mode rebuilds need this. */
|
|
4
|
+
export declare function resetStyles(): void;
|
|
5
|
+
/** How many distinct atomic classes exist right now. */
|
|
6
|
+
export declare function styleCount(): number;
|
|
7
|
+
/**
|
|
8
|
+
* Increments every time the registry is cleared.
|
|
9
|
+
*
|
|
10
|
+
* Rules are registered as a side effect of module evaluation, and a module
|
|
11
|
+
* only evaluates once per specifier — so after a reset the modules that
|
|
12
|
+
* declared those rules would stay cached and never re-register them. Folding
|
|
13
|
+
* this counter into the import specifier makes a reset genuinely start over.
|
|
14
|
+
*/
|
|
15
|
+
export declare function styleGeneration(): number;
|
|
16
|
+
export declare const registry: StyleRegistry;
|
|
17
|
+
/**
|
|
18
|
+
* One atomic declaration: a single property/value pair under a fixed chain of
|
|
19
|
+
* conditions, owning exactly one class name.
|
|
20
|
+
*/
|
|
21
|
+
export declare interface AtomicRule {
|
|
22
|
+
className: string
|
|
23
|
+
property: string
|
|
24
|
+
values: string[]
|
|
25
|
+
conditions: string[]
|
|
26
|
+
priority: number
|
|
27
|
+
}
|
|
28
|
+
/** A `@keyframes` block keyed by its generated animation name. */
|
|
29
|
+
export declare interface KeyframesRule {
|
|
30
|
+
name: string
|
|
31
|
+
css: string
|
|
32
|
+
}
|
|
33
|
+
/** A custom-property definition, optionally scoped to a selector/at-rule. */
|
|
34
|
+
export declare interface VarRule {
|
|
35
|
+
selector: string
|
|
36
|
+
atRule?: string
|
|
37
|
+
declarations: Record<string, string>
|
|
38
|
+
}
|
|
39
|
+
/**
|
|
40
|
+
* Process-wide store of everything the style API has generated.
|
|
41
|
+
*
|
|
42
|
+
* `css.create()` registers as a side effect of module evaluation, which is
|
|
43
|
+
* what lets the build collect styles by simply importing the modules that
|
|
44
|
+
* declare them — no AST pass, and no chance of the emitted CSS disagreeing
|
|
45
|
+
* with the class names the app actually renders.
|
|
46
|
+
*/
|
|
47
|
+
declare class StyleRegistry {
|
|
48
|
+
addRule(rule: AtomicRule): void;
|
|
49
|
+
addKeyframes(rule: KeyframesRule): void;
|
|
50
|
+
addVars(rule: VarRule): void;
|
|
51
|
+
has(className: string): boolean;
|
|
52
|
+
get size(): number;
|
|
53
|
+
clear(): void;
|
|
54
|
+
get currentGeneration(): number;
|
|
55
|
+
toCSS(minify?: boolean): string;
|
|
56
|
+
}
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
/** Marks the tuple a dynamic style returns, so `props` never mistakes it for a list. */
|
|
2
|
+
export declare const DYNAMIC_STYLE: unique symbol;
|
|
3
|
+
/**
|
|
4
|
+
* A style object. Keys are camelCase CSS properties; keys starting with `:`,
|
|
5
|
+
* `::` or `@`, or containing `&`, open a nested condition instead.
|
|
6
|
+
*
|
|
7
|
+
* A property may also map to an object of conditions:
|
|
8
|
+
* `{ color: { default: 'blue', ':hover': 'red' } }`.
|
|
9
|
+
*/
|
|
10
|
+
export declare interface StyleRule {
|
|
11
|
+
[key: string]: StyleValue | StyleRule
|
|
12
|
+
}
|
|
13
|
+
/** The compiled form of one named style: merge key -> class name. */
|
|
14
|
+
export declare interface CompiledStyle {
|
|
15
|
+
readonly [key: string]: string | null
|
|
16
|
+
}
|
|
17
|
+
/** What `css.props()` spreads onto an element. */
|
|
18
|
+
export declare interface StyleProps {
|
|
19
|
+
className?: string
|
|
20
|
+
style?: Record<string, string>
|
|
21
|
+
}
|
|
22
|
+
/** A `@keyframes` body: percentage/`from`/`to` keys mapping to style objects. */
|
|
23
|
+
export declare interface KeyframeDefinition {
|
|
24
|
+
[step: string]: StyleRule
|
|
25
|
+
}
|
|
26
|
+
/**
|
|
27
|
+
* Public types for the style object API.
|
|
28
|
+
*/
|
|
29
|
+
/** A single declaration's value. `null` explicitly unsets an inherited style. */
|
|
30
|
+
export type StyleValue = string | number | null | undefined | readonly (string | number)[];
|
|
31
|
+
/** A compiled style plus the inline custom properties that parameterise it. */
|
|
32
|
+
export type DynamicStyle = readonly [CompiledStyle, Readonly<Record<string, string>>] & {
|
|
33
|
+
readonly [DYNAMIC_STYLE]?: true
|
|
34
|
+
}
|
|
35
|
+
/** Anything `css.props()` accepts. Falsy entries are skipped. */
|
|
36
|
+
export type StyleArg = | CompiledStyle
|
|
37
|
+
| DynamicStyle
|
|
38
|
+
| false
|
|
39
|
+
| null
|
|
40
|
+
| undefined
|
|
41
|
+
| readonly StyleArg[];
|
|
42
|
+
// `_args` only names the tuple that `A` is inferred from — matching the
|
|
43
|
+
// `_match` convention the `CustomRule` signature already uses.
|
|
44
|
+
export type CompiledOf<T> = T extends (..._args: infer A) => any
|
|
45
|
+
? (..._args: A) => DynamicStyle
|
|
46
|
+
: CompiledStyle;
|
|
47
|
+
/** The map `css.create()` hands back, one entry per named style. */
|
|
48
|
+
export type CreatedStyles<T> = { readonly [K in keyof T]: CompiledOf<T[K]> }
|
|
49
|
+
/** A variable group's value: a plain value, or per-condition values. */
|
|
50
|
+
export type VarValue = | string
|
|
51
|
+
| number
|
|
52
|
+
| { default: string | number, [condition: string]: string | number }
|
|
53
|
+
/** What `css.defineVars()` returns — every key is a ready-to-use `var(…)`. */
|
|
54
|
+
export type VarGroup<T> = { readonly [K in keyof T]: string }
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* `backgroundColor` -> `background-color`, `WebkitLineClamp` ->
|
|
3
|
+
* `-webkit-line-clamp`. Custom properties (`--brand`) pass through untouched.
|
|
4
|
+
*/
|
|
5
|
+
export declare function toKebabCase(property: string): string;
|
|
6
|
+
/**
|
|
7
|
+
* Numbers become `px` unless the property is unitless or the value is zero.
|
|
8
|
+
* Everything else is stringified as-is.
|
|
9
|
+
*/
|
|
10
|
+
export declare function normalizeValue(property: string, value: string | number): string;
|
|
11
|
+
/**
|
|
12
|
+
* Renders one declaration's value. Arrays become CSS fallbacks — the caller
|
|
13
|
+
* emits one declaration per entry, in order, so the last supported one wins.
|
|
14
|
+
*/
|
|
15
|
+
export declare function normalizeValues(property: string, value: string | number | readonly (string | number)[]): string[];
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import type { CssConfig } from './types';
|
|
2
|
+
/**
|
|
3
|
+
* Extract compile class markers from content
|
|
4
|
+
*/
|
|
5
|
+
export declare function extractCompileClasses(content: string, options?: CompileClassOptions): Map<string, string[]>;
|
|
6
|
+
/**
|
|
7
|
+
* Transform content by replacing compile markers with generated class names
|
|
8
|
+
*/
|
|
9
|
+
export declare function transformContent(content: string, compiledClassMap: Map<string, string>, options?: CompileClassOptions): string;
|
|
10
|
+
/**
|
|
11
|
+
* Generate class names for compiled classes
|
|
12
|
+
*/
|
|
13
|
+
export declare function generateCompiledClassNames(compiledClasses: Map<string, string[]>, options?: CompileClassOptions): Map<string, string>;
|
|
14
|
+
export declare interface CompileClassOptions {
|
|
15
|
+
trigger?: string
|
|
16
|
+
classPrefix?: string
|
|
17
|
+
hashFn?: (content: string) => string
|
|
18
|
+
layer?: string
|
|
19
|
+
}
|
|
20
|
+
/**
|
|
21
|
+
* Main transformer class
|
|
22
|
+
*/
|
|
23
|
+
export declare class CompileClassTransformer {
|
|
24
|
+
constructor(options?: CompileClassOptions);
|
|
25
|
+
processFile(content: string): { content: string, hasChanges: boolean };
|
|
26
|
+
getCompiledClasses(): Map<string, { className: string, utilities: string[] }>;
|
|
27
|
+
generateCSS(config: CssConfig, generator: any): string;
|
|
28
|
+
reset(): void;
|
|
29
|
+
getStats(): {
|
|
30
|
+
totalGroups: number
|
|
31
|
+
totalUtilities: number
|
|
32
|
+
averageUtilitiesPerGroup: number
|
|
33
|
+
};
|
|
34
|
+
}
|
|
@@ -0,0 +1,156 @@
|
|
|
1
|
+
import type { CodeStringsConfig } from './parser';
|
|
2
|
+
export declare interface CompileClassConfig {
|
|
3
|
+
enabled?: boolean
|
|
4
|
+
trigger?: string
|
|
5
|
+
classPrefix?: string
|
|
6
|
+
layer?: string
|
|
7
|
+
}
|
|
8
|
+
export declare interface AttributifyConfig {
|
|
9
|
+
enabled?: boolean
|
|
10
|
+
prefix?: string
|
|
11
|
+
ignoreAttributes?: string[]
|
|
12
|
+
}
|
|
13
|
+
export declare interface BracketSyntaxConfig {
|
|
14
|
+
enabled?: boolean
|
|
15
|
+
colonSyntax?: boolean
|
|
16
|
+
aliases?: Record<string, string>
|
|
17
|
+
}
|
|
18
|
+
/**
|
|
19
|
+
* Web-font loading. Crosswind maps `font-*` utilities to family stacks, but it
|
|
20
|
+
* never loaded the actual font files — declare them here and ts-css emits the
|
|
21
|
+
* `@import` / `@font-face` so the fonts render with zero extra wiring.
|
|
22
|
+
*/
|
|
23
|
+
export declare interface FontConfig {
|
|
24
|
+
google?: string[]
|
|
25
|
+
display?: 'auto' | 'block' | 'swap' | 'fallback' | 'optional'
|
|
26
|
+
faces?: string[]
|
|
27
|
+
}
|
|
28
|
+
export declare interface CssConfig {
|
|
29
|
+
content: string[]
|
|
30
|
+
output: string
|
|
31
|
+
minify: boolean
|
|
32
|
+
watch: boolean
|
|
33
|
+
verbose?: boolean
|
|
34
|
+
includePreflight?: boolean
|
|
35
|
+
darkMode?: 'class' | 'media'
|
|
36
|
+
theme: Theme
|
|
37
|
+
fonts?: FontConfig
|
|
38
|
+
shortcuts: Record<string, string | string[]>
|
|
39
|
+
rules: CustomRule[]
|
|
40
|
+
variants: VariantConfig
|
|
41
|
+
safelist: string[]
|
|
42
|
+
blocklist: string[]
|
|
43
|
+
preflights: Preflight[]
|
|
44
|
+
presets: Preset[]
|
|
45
|
+
compileClass?: CompileClassConfig
|
|
46
|
+
attributify?: AttributifyConfig
|
|
47
|
+
bracketSyntax?: BracketSyntaxConfig
|
|
48
|
+
codeStrings?: CodeStringsConfig
|
|
49
|
+
cssVariables?: boolean
|
|
50
|
+
styles?: string[]
|
|
51
|
+
}
|
|
52
|
+
export declare interface Theme {
|
|
53
|
+
colors: Record<string, string | Record<string, string>>
|
|
54
|
+
spacing: Record<string, string>
|
|
55
|
+
fontSize: Record<string, [string, { lineHeight: string }]>
|
|
56
|
+
fontFamily: Record<string, string[]>
|
|
57
|
+
lineHeight?: Record<string, string>
|
|
58
|
+
screens: Record<string, string>
|
|
59
|
+
borderRadius: Record<string, string>
|
|
60
|
+
boxShadow: Record<string, string>
|
|
61
|
+
extend?: Partial<Omit<Theme, 'extend'>>
|
|
62
|
+
}
|
|
63
|
+
export declare interface VariantConfig {
|
|
64
|
+
'responsive': boolean
|
|
65
|
+
'hover': boolean
|
|
66
|
+
'focus': boolean
|
|
67
|
+
'active': boolean
|
|
68
|
+
'disabled': boolean
|
|
69
|
+
'dark': boolean
|
|
70
|
+
'light': boolean
|
|
71
|
+
'group': boolean
|
|
72
|
+
'peer': boolean
|
|
73
|
+
'before': boolean
|
|
74
|
+
'after': boolean
|
|
75
|
+
'marker': boolean
|
|
76
|
+
'first': boolean
|
|
77
|
+
'last': boolean
|
|
78
|
+
'odd': boolean
|
|
79
|
+
'even': boolean
|
|
80
|
+
'first-of-type': boolean
|
|
81
|
+
'last-of-type': boolean
|
|
82
|
+
'visited': boolean
|
|
83
|
+
'checked': boolean
|
|
84
|
+
'focus-within': boolean
|
|
85
|
+
'focus-visible': boolean
|
|
86
|
+
'placeholder': boolean
|
|
87
|
+
'selection': boolean
|
|
88
|
+
'file': boolean
|
|
89
|
+
'required': boolean
|
|
90
|
+
'valid': boolean
|
|
91
|
+
'invalid': boolean
|
|
92
|
+
'read-only': boolean
|
|
93
|
+
'autofill': boolean
|
|
94
|
+
'open': boolean
|
|
95
|
+
'closed': boolean
|
|
96
|
+
'empty': boolean
|
|
97
|
+
'enabled': boolean
|
|
98
|
+
'only': boolean
|
|
99
|
+
'target': boolean
|
|
100
|
+
'indeterminate': boolean
|
|
101
|
+
'default': boolean
|
|
102
|
+
'optional': boolean
|
|
103
|
+
'aria': boolean
|
|
104
|
+
'data': boolean
|
|
105
|
+
'has': boolean
|
|
106
|
+
'not': boolean
|
|
107
|
+
'supports': boolean
|
|
108
|
+
'print': boolean
|
|
109
|
+
'landscape': boolean
|
|
110
|
+
'portrait': boolean
|
|
111
|
+
'forced-colors': boolean
|
|
112
|
+
'rtl': boolean
|
|
113
|
+
'ltr': boolean
|
|
114
|
+
'motion-safe': boolean
|
|
115
|
+
'motion-reduce': boolean
|
|
116
|
+
'contrast-more': boolean
|
|
117
|
+
'contrast-less': boolean
|
|
118
|
+
}
|
|
119
|
+
export declare interface ParsedClass {
|
|
120
|
+
raw: string
|
|
121
|
+
base: string
|
|
122
|
+
variants: string[]
|
|
123
|
+
utility: string
|
|
124
|
+
value?: string
|
|
125
|
+
important: boolean
|
|
126
|
+
arbitrary: boolean
|
|
127
|
+
modifierArbitrary?: boolean
|
|
128
|
+
typeHint?: string
|
|
129
|
+
}
|
|
130
|
+
export declare interface CSSRule {
|
|
131
|
+
selector: string
|
|
132
|
+
properties: Record<string, string>
|
|
133
|
+
mediaQuery?: string
|
|
134
|
+
childSelector?: string
|
|
135
|
+
}
|
|
136
|
+
export declare interface UtilityRuleResult {
|
|
137
|
+
properties: Record<string, string>
|
|
138
|
+
childSelector?: string
|
|
139
|
+
pseudoElement?: string
|
|
140
|
+
}
|
|
141
|
+
export declare interface Preflight {
|
|
142
|
+
getCSS: () => string
|
|
143
|
+
}
|
|
144
|
+
export declare interface Preset {
|
|
145
|
+
name: string
|
|
146
|
+
theme?: Partial<Theme>
|
|
147
|
+
rules?: CustomRule[]
|
|
148
|
+
shortcuts?: Record<string, string | string[]>
|
|
149
|
+
variants?: Partial<VariantConfig>
|
|
150
|
+
preflights?: Preflight[]
|
|
151
|
+
}
|
|
152
|
+
export type CustomRule = [RegExp, (_match: RegExpMatchArray) => Record<string, string> | undefined];
|
|
153
|
+
declare type DeepPartial<T> = {
|
|
154
|
+
[P in keyof T]?: T[P] extends object ? DeepPartial<T[P]> : T[P]
|
|
155
|
+
}
|
|
156
|
+
export type CssOptions = DeepPartial<CssConfig>;
|