@tenphi/tasty 0.1.3 → 0.3.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.
- package/README.md +329 -126
- package/dist/config.d.ts +2 -1
- package/dist/config.js +6 -3
- package/dist/config.js.map +1 -1
- package/dist/pipeline/conditions.js +22 -1
- package/dist/pipeline/conditions.js.map +1 -1
- package/dist/pipeline/index.js +2 -1
- package/dist/pipeline/index.js.map +1 -1
- package/dist/pipeline/materialize.js +76 -3
- package/dist/pipeline/materialize.js.map +1 -1
- package/dist/pipeline/parseStateKey.js +23 -2
- package/dist/pipeline/parseStateKey.js.map +1 -1
- package/dist/states/index.d.ts +1 -1
- package/dist/states/index.js +29 -2
- package/dist/states/index.js.map +1 -1
- package/dist/styles/types.d.ts +4 -2
- package/dist/utils/resolve-recipes.js +16 -12
- package/dist/utils/resolve-recipes.js.map +1 -1
- package/package.json +1 -1
package/dist/states/index.js
CHANGED
|
@@ -18,6 +18,7 @@ const BUILTIN_STATES = new Set([
|
|
|
18
18
|
const RESERVED_PREFIXES = [
|
|
19
19
|
"@media",
|
|
20
20
|
"@root",
|
|
21
|
+
"@parent",
|
|
21
22
|
"@own",
|
|
22
23
|
"@(",
|
|
23
24
|
"@starting",
|
|
@@ -56,7 +57,7 @@ function setGlobalPredefinedStates(states) {
|
|
|
56
57
|
warnOnce(`reserved-state:${name}`, `[Tasty] Cannot define predefined state '${name}'. This name is reserved for built-in functionality.`);
|
|
57
58
|
continue;
|
|
58
59
|
}
|
|
59
|
-
if (name === "@media" || name === "@root" || name === "@own" || name.startsWith("@(")) {
|
|
60
|
+
if (name === "@media" || name === "@root" || name === "@parent" || name === "@own" || name.startsWith("@(")) {
|
|
60
61
|
warnOnce(`reserved-prefix:${name}`, `[Tasty] Cannot define predefined state '${name}'. This prefix is reserved for built-in functionality.`);
|
|
61
62
|
continue;
|
|
62
63
|
}
|
|
@@ -102,6 +103,7 @@ function isPredefinedStateRef(stateKey) {
|
|
|
102
103
|
for (const prefix of RESERVED_PREFIXES) if (stateKey === prefix || stateKey.startsWith(prefix)) {
|
|
103
104
|
if (stateKey === "@media" || stateKey.startsWith("@media(") || stateKey.startsWith("@media:")) return false;
|
|
104
105
|
if (stateKey === "@root" || stateKey.startsWith("@root(")) return false;
|
|
106
|
+
if (stateKey === "@parent" || stateKey.startsWith("@parent(")) return false;
|
|
105
107
|
if (stateKey === "@own" || stateKey.startsWith("@own(")) return false;
|
|
106
108
|
if (stateKey.startsWith("@(")) return false;
|
|
107
109
|
}
|
|
@@ -118,7 +120,7 @@ function extractLocalPredefinedStates(styles) {
|
|
|
118
120
|
for (const [key, value] of Object.entries(styles)) if (key.startsWith("@") && typeof value === "string") {
|
|
119
121
|
if (!/^@[A-Za-z][A-Za-z0-9-]*$/.test(key)) continue;
|
|
120
122
|
if (BUILTIN_STATES.has(key)) continue;
|
|
121
|
-
if (key === "@media" || key === "@root" || key === "@own" || key.startsWith("@(")) continue;
|
|
123
|
+
if (key === "@media" || key === "@root" || key === "@parent" || key === "@own" || key.startsWith("@(")) continue;
|
|
122
124
|
const crossRefs = extractPredefinedStateRefs(value);
|
|
123
125
|
if (crossRefs.length > 0) {
|
|
124
126
|
warnOnce(`local-cross-ref:${key}`, `[Tasty] Predefined state '${key}' references another predefined state '${crossRefs[0]}'.\nPredefined states cannot reference each other. Use the full definition instead.`);
|
|
@@ -245,6 +247,31 @@ function parseAdvancedState(stateKey, ctx) {
|
|
|
245
247
|
raw
|
|
246
248
|
};
|
|
247
249
|
}
|
|
250
|
+
if (stateKey.startsWith("@parent(")) {
|
|
251
|
+
const endParen = findMatchingParen(stateKey, 7);
|
|
252
|
+
if (endParen === -1) {
|
|
253
|
+
warnOnce(`unclosed-parent:${stateKey}`, `[Tasty] Unclosed parent state '${stateKey}'. Missing closing parenthesis.`);
|
|
254
|
+
return {
|
|
255
|
+
type: "modifier",
|
|
256
|
+
condition: stateKey,
|
|
257
|
+
raw
|
|
258
|
+
};
|
|
259
|
+
}
|
|
260
|
+
const condition = stateKey.slice(8, endParen);
|
|
261
|
+
if (!condition.trim()) {
|
|
262
|
+
warnOnce(`empty-parent:${stateKey}`, `[Tasty] Empty parent state condition '${stateKey}'.`);
|
|
263
|
+
return {
|
|
264
|
+
type: "modifier",
|
|
265
|
+
condition: stateKey,
|
|
266
|
+
raw
|
|
267
|
+
};
|
|
268
|
+
}
|
|
269
|
+
return {
|
|
270
|
+
type: "parent",
|
|
271
|
+
condition,
|
|
272
|
+
raw
|
|
273
|
+
};
|
|
274
|
+
}
|
|
248
275
|
if (stateKey.startsWith("@own(")) {
|
|
249
276
|
const endParen = findMatchingParen(stateKey, 4);
|
|
250
277
|
if (endParen === -1) {
|
package/dist/states/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../src/states/index.ts"],"sourcesContent":["/**\n * Advanced State Mapping - Predefined States Management\n *\n * This module handles global and local predefined states for the Tasty styling system.\n * See ADVANCED_STATE_MAPPING.md for full specification.\n */\n\nimport { hasStylesGenerated } from '../config';\nimport type { Styles } from '../styles/types';\nimport { isDevEnv } from '../utils/is-dev-env';\n\n/**\n * Parsed advanced state information\n */\nexport interface ParsedAdvancedState {\n type:\n | 'media'\n | 'container'\n | 'root'\n | 'own'\n | 'starting'\n | 'predefined'\n | 'modifier';\n condition: string; // e.g., 'width <= 920px' or 'hovered'\n containerName?: string; // for container queries\n raw: string; // original state key\n mediaType?: string; // for @media:screen, @media:print, etc.\n}\n\n/**\n * Context for state parsing operations\n */\nexport interface StateParserContext {\n localPredefinedStates: Record<string, string>;\n globalPredefinedStates: Record<string, string>;\n isSubElement?: boolean; // true when processing sub-element styles (for @own() validation)\n}\n\n/**\n * At-rule context for CSS generation\n */\nexport interface AtRuleContext {\n media?: string[]; // @media conditions to wrap rule in (merged with 'and')\n container?: { name?: string; condition: string }[]; // @container conditions (nested)\n startingStyle?: boolean;\n rootStates?: string[]; // :root state selectors (e.g., '[data-theme=\"dark\"]')\n negatedRootStates?: string[]; // Negated :root state selectors for non-overlapping rules (e.g., ':not([data-theme=\"dark\"])')\n}\n\n// Built-in state names that cannot be overridden\nconst BUILTIN_STATES = new Set([\n '@starting',\n '@keyframes',\n '@properties',\n '@supports',\n // @inherit is a value (not a key), but reserved here to prevent\n // users from accidentally defining a state named '@inherit'.\n '@inherit',\n]);\n\n// Reserved prefixes that are built-in\nconst RESERVED_PREFIXES = [\n '@media',\n '@root',\n '@own',\n '@(',\n '@starting',\n '@keyframes',\n '@properties',\n '@supports',\n '@inherit',\n];\n\n// Global predefined states storage\nlet globalPredefinedStates: Record<string, string> = {};\n\n// Warnings tracking to avoid duplicates\nconst emittedWarnings = new Set<string>();\n\nconst devMode = isDevEnv();\n\n/**\n * Emit a warning only once\n */\nfunction warnOnce(key: string, message: string): void {\n if (devMode && !emittedWarnings.has(key)) {\n emittedWarnings.add(key);\n console.warn(message);\n }\n}\n\n/**\n * Configure global predefined states\n */\nexport function setGlobalPredefinedStates(\n states: Record<string, string>,\n): void {\n if (hasStylesGenerated()) {\n const newStateNames = Object.keys(states).join(', ');\n warnOnce(\n `dynamic-states:${newStateNames}`,\n `[Tasty] Cannot update predefined states after styles have been generated.\\n` +\n `The new definition(s) for ${newStateNames} will be ignored.`,\n );\n return;\n }\n\n // Validate state names\n for (const [name, value] of Object.entries(states)) {\n // Check for valid name format\n if (!/^@[A-Za-z][A-Za-z0-9-]*$/.test(name)) {\n warnOnce(\n `invalid-state-name:${name}`,\n `[Tasty] Invalid predefined state name '${name}'. Must start with '@' followed by a letter.`,\n );\n continue;\n }\n\n // Check for reserved names\n if (BUILTIN_STATES.has(name)) {\n warnOnce(\n `reserved-state:${name}`,\n `[Tasty] Cannot define predefined state '${name}'. This name is reserved for built-in functionality.`,\n );\n continue;\n }\n\n // Check for reserved prefixes (but only exact matches, not user-defined states like @mobile)\n // Reserved prefixes are: @media, @root, @own, @(\n // A user state like @mobile should NOT be blocked\n const isReservedPrefix =\n name === '@media' ||\n name === '@root' ||\n name === '@own' ||\n name.startsWith('@(');\n\n if (isReservedPrefix) {\n warnOnce(\n `reserved-prefix:${name}`,\n `[Tasty] Cannot define predefined state '${name}'. This prefix is reserved for built-in functionality.`,\n );\n continue;\n }\n\n // Check for cross-references\n const crossRefs = extractPredefinedStateRefs(value);\n if (crossRefs.length > 0) {\n warnOnce(\n `cross-ref:${name}`,\n `[Tasty] Predefined state '${name}' references another predefined state '${crossRefs[0]}'.\\n` +\n `Predefined states cannot reference each other. Use the full definition instead.`,\n );\n continue;\n }\n\n // Check for duplicates\n if (\n globalPredefinedStates[name] &&\n globalPredefinedStates[name] !== value\n ) {\n warnOnce(\n `duplicate-state:${name}`,\n `[Tasty] Duplicate predefined state '${name}' in configure(). The last definition will be used.`,\n );\n }\n\n globalPredefinedStates[name] = value;\n }\n}\n\n/**\n * Get global predefined states\n */\nexport function getGlobalPredefinedStates(): Record<string, string> {\n return globalPredefinedStates;\n}\n\n/**\n * Clear global predefined states (for testing only)\n */\nexport function clearGlobalPredefinedStates(): void {\n globalPredefinedStates = {};\n emittedWarnings.clear();\n}\n\n/**\n * Regex to match predefined state references in a string\n * Matches @name that is NOT followed by ( or : and is a complete word\n * Uses word boundary and negative lookahead\n */\nconst PREDEFINED_STATE_PATTERN = /@([A-Za-z][A-Za-z0-9-]*)(?![A-Za-z0-9-:(])/g;\n\n/**\n * Extract predefined state references from a string\n */\nexport function extractPredefinedStateRefs(value: string): string[] {\n const matches = value.matchAll(PREDEFINED_STATE_PATTERN);\n const refs: string[] = [];\n\n for (const match of matches) {\n const stateName = '@' + match[1];\n // Skip built-in states (@starting) and duplicates\n // Note: @media, @root, @own are always followed by '(' so the regex\n // negative lookahead (?![A-Za-z0-9-:(]) already excludes them\n if (!BUILTIN_STATES.has(stateName) && !refs.includes(stateName)) {\n refs.push(stateName);\n }\n }\n\n return refs;\n}\n\n/**\n * Check if a state key is a predefined state reference\n */\nexport function isPredefinedStateRef(stateKey: string): boolean {\n if (!stateKey.startsWith('@')) return false;\n if (BUILTIN_STATES.has(stateKey)) return false;\n\n // Check if it's NOT a built-in prefix\n for (const prefix of RESERVED_PREFIXES) {\n if (stateKey === prefix || stateKey.startsWith(prefix)) {\n // Check if it's exactly @media, @root, @own, or starts with @( or @media(\n if (\n stateKey === '@media' ||\n stateKey.startsWith('@media(') ||\n stateKey.startsWith('@media:')\n ) {\n return false;\n }\n if (stateKey === '@root' || stateKey.startsWith('@root(')) return false;\n if (stateKey === '@own' || stateKey.startsWith('@own(')) return false;\n if (stateKey.startsWith('@(')) return false;\n }\n }\n\n // Must match the predefined state pattern\n return /^@[A-Za-z][A-Za-z0-9-]*$/.test(stateKey);\n}\n\n/**\n * Extract local predefined states from a styles object\n * Local predefined states are top-level keys starting with @ that have string values\n * and are valid predefined state names (not built-in like @media, @root, etc.)\n */\nexport function extractLocalPredefinedStates(\n styles: Styles,\n): Record<string, string> {\n const localStates: Record<string, string> = {};\n\n if (!styles || typeof styles !== 'object') {\n return localStates;\n }\n\n for (const [key, value] of Object.entries(styles)) {\n // Check if it's a predefined state definition (starts with @, has string value)\n if (key.startsWith('@') && typeof value === 'string') {\n // Validate name format - must be @[letter][letters/numbers/dashes]*\n if (!/^@[A-Za-z][A-Za-z0-9-]*$/.test(key)) {\n continue; // Skip invalid names silently (might be something else)\n }\n\n // Skip built-in states\n if (BUILTIN_STATES.has(key)) {\n continue;\n }\n\n // Skip reserved prefixes\n if (\n key === '@media' ||\n key === '@root' ||\n key === '@own' ||\n key.startsWith('@(')\n ) {\n continue;\n }\n\n // Check for cross-references (predefined states cannot reference each other)\n const crossRefs = extractPredefinedStateRefs(value);\n if (crossRefs.length > 0) {\n warnOnce(\n `local-cross-ref:${key}`,\n `[Tasty] Predefined state '${key}' references another predefined state '${crossRefs[0]}'.\\n` +\n `Predefined states cannot reference each other. Use the full definition instead.`,\n );\n continue;\n }\n\n localStates[key] = value;\n }\n }\n\n return localStates;\n}\n\n/**\n * Create a state parser context from styles\n */\nexport function createStateParserContext(\n styles?: Styles,\n isSubElement?: boolean,\n): StateParserContext {\n const localStates = styles ? extractLocalPredefinedStates(styles) : {};\n\n return {\n localPredefinedStates: localStates,\n globalPredefinedStates: getGlobalPredefinedStates(),\n isSubElement,\n };\n}\n\n/**\n * Resolve a predefined state reference to its value\n * Returns the resolved value or null if not found\n */\nexport function resolvePredefinedState(\n stateKey: string,\n ctx: StateParserContext,\n): string | null {\n // Check local first (higher priority)\n if (ctx.localPredefinedStates[stateKey]) {\n return ctx.localPredefinedStates[stateKey];\n }\n\n // Then check global\n if (ctx.globalPredefinedStates[stateKey]) {\n return ctx.globalPredefinedStates[stateKey];\n }\n\n // Not found - emit warning\n warnOnce(\n `undefined-state:${stateKey}`,\n `[Tasty] Undefined predefined state '${stateKey}'.\\n` +\n `Define it in configure({ states: { '${stateKey}': '...' } }) or in the component's styles.`,\n );\n\n return null;\n}\n\n/**\n * Normalize state key by trimming whitespace and removing trailing/leading operators\n */\nexport function normalizeStateKey(stateKey: string): {\n key: string;\n warnings: string[];\n} {\n const warnings: string[] = [];\n let key = stateKey;\n\n // Check for whitespace-only\n if (key.trim() === '') {\n if (key !== '') {\n warnings.push(\n `[Tasty] Whitespace-only state key normalized to default state ''.`,\n );\n }\n return { key: '', warnings };\n }\n\n // Trim whitespace\n key = key.trim();\n\n // Remove trailing operators\n const trailingOpMatch = key.match(/\\s*[&|^]\\s*$/);\n if (trailingOpMatch) {\n const originalKey = key;\n key = key.slice(0, -trailingOpMatch[0].length).trim();\n warnings.push(\n `[Tasty] State key '${originalKey}' has trailing operator. Normalized to '${key}'.`,\n );\n }\n\n // Remove leading operators (except !)\n const leadingOpMatch = key.match(/^\\s*[&|^]\\s*/);\n if (leadingOpMatch) {\n const originalKey = key;\n key = key.slice(leadingOpMatch[0].length).trim();\n warnings.push(\n `[Tasty] State key '${originalKey}' has leading operator. Normalized to '${key}'.`,\n );\n }\n\n return { key, warnings };\n}\n\n/**\n * Expand dimension shorthands in a condition string\n * w -> width, h -> height, is -> inline-size, bs -> block-size\n */\nexport function expandDimensionShorthands(condition: string): string {\n // Replace dimension shorthands (only when they appear as standalone words)\n let result = condition;\n\n // w -> width (but not part of other words)\n result = result.replace(/\\bw\\b/g, 'width');\n\n // h -> height\n result = result.replace(/\\bh\\b/g, 'height');\n\n // is -> inline-size\n result = result.replace(/\\bis\\b/g, 'inline-size');\n\n // bs -> block-size\n result = result.replace(/\\bbs\\b/g, 'block-size');\n\n return result;\n}\n\n/**\n * Convert tasty units in a string (e.g., 40x -> calc(var(--gap) * 40))\n */\nexport function expandTastyUnits(value: string): string {\n // Match number followed by 'x' unit (tasty gap unit)\n return value.replace(/(\\d+(?:\\.\\d+)?)\\s*x\\b/g, (_, num) => {\n return `calc(var(--gap) * ${num})`;\n });\n}\n\n/**\n * Parse an advanced state key and return its type and components\n */\nexport function parseAdvancedState(\n stateKey: string,\n ctx: StateParserContext,\n): ParsedAdvancedState {\n const raw = stateKey;\n\n // Check for @starting (exact match)\n if (stateKey === '@starting') {\n return {\n type: 'starting',\n condition: '',\n raw,\n };\n }\n\n // Check for @media:type (e.g., @media:print)\n if (stateKey.startsWith('@media:')) {\n const mediaType = stateKey.slice(7); // Remove '@media:'\n if (!['all', 'screen', 'print', 'speech'].includes(mediaType)) {\n warnOnce(\n `unknown-media-type:${mediaType}`,\n `[Tasty] Unknown media type '${mediaType}'. Valid types: all, screen, print, speech.`,\n );\n }\n return {\n type: 'media',\n condition: '',\n mediaType,\n raw,\n };\n }\n\n // Check for @media(...) - media query with condition\n if (stateKey.startsWith('@media(')) {\n const endParen = findMatchingParen(stateKey, 6);\n if (endParen === -1) {\n warnOnce(\n `unclosed-media:${stateKey}`,\n `[Tasty] Unclosed media query '${stateKey}'. Missing closing parenthesis.`,\n );\n return { type: 'modifier', condition: stateKey, raw };\n }\n\n let condition = stateKey.slice(7, endParen);\n\n // Check for empty condition\n if (!condition.trim()) {\n warnOnce(\n `empty-media:${stateKey}`,\n `[Tasty] Empty media query condition '${stateKey}'.`,\n );\n return { type: 'modifier', condition: stateKey, raw };\n }\n\n // Expand shorthands and units\n condition = expandDimensionShorthands(condition);\n condition = expandTastyUnits(condition);\n\n return {\n type: 'media',\n condition,\n raw,\n };\n }\n\n // Check for @root(...) - root state\n if (stateKey.startsWith('@root(')) {\n const endParen = findMatchingParen(stateKey, 5);\n if (endParen === -1) {\n warnOnce(\n `unclosed-root:${stateKey}`,\n `[Tasty] Unclosed root state '${stateKey}'. Missing closing parenthesis.`,\n );\n return { type: 'modifier', condition: stateKey, raw };\n }\n\n const condition = stateKey.slice(6, endParen);\n\n if (!condition.trim()) {\n warnOnce(\n `empty-root:${stateKey}`,\n `[Tasty] Empty root state condition '${stateKey}'.`,\n );\n return { type: 'modifier', condition: stateKey, raw };\n }\n\n return {\n type: 'root',\n condition,\n raw,\n };\n }\n\n // Check for @own(...) - sub-element own state\n if (stateKey.startsWith('@own(')) {\n const endParen = findMatchingParen(stateKey, 4);\n if (endParen === -1) {\n warnOnce(\n `unclosed-own:${stateKey}`,\n `[Tasty] Unclosed own state '${stateKey}'. Missing closing parenthesis.`,\n );\n return { type: 'modifier', condition: stateKey, raw };\n }\n\n const condition = stateKey.slice(5, endParen);\n\n if (!condition.trim()) {\n warnOnce(\n `empty-own:${stateKey}`,\n `[Tasty] Empty own state condition '${stateKey}'.`,\n );\n return { type: 'modifier', condition: stateKey, raw };\n }\n\n // Check if used outside sub-element context\n if (!ctx.isSubElement) {\n warnOnce(\n `own-outside-subelement:${stateKey}`,\n `[Tasty] @own(${condition}) used outside sub-element context.\\n` +\n `@own() is equivalent to '${condition}' at the root level. ` +\n `Did you mean to use it inside a sub-element?`,\n );\n // Treat as regular modifier\n return {\n type: 'modifier',\n condition,\n raw,\n };\n }\n\n return {\n type: 'own',\n condition,\n raw,\n };\n }\n\n // Check for @(...) - container query (unnamed or named)\n if (stateKey.startsWith('@(')) {\n const endParen = findMatchingParen(stateKey, 1);\n if (endParen === -1) {\n warnOnce(\n `unclosed-container:${stateKey}`,\n `[Tasty] Unclosed container query '${stateKey}'. Missing closing parenthesis.`,\n );\n return { type: 'modifier', condition: stateKey, raw };\n }\n\n const content = stateKey.slice(2, endParen);\n\n if (!content.trim()) {\n warnOnce(\n `empty-container:${stateKey}`,\n `[Tasty] Empty container query '${stateKey}'.`,\n );\n return { type: 'modifier', condition: stateKey, raw };\n }\n\n // Check if named container (first token is name, followed by comma)\n // Use parentheses-aware comma search so inner commas (e.g., scroll-state(a, b)) are skipped\n const commaIndex = findTopLevelComma(content);\n let containerName: string | undefined;\n let condition: string;\n\n if (commaIndex !== -1) {\n // Named container: @(layout, w < 600px)\n containerName = content.slice(0, commaIndex).trim();\n condition = content.slice(commaIndex + 1).trim();\n } else {\n // Unnamed container: @(w < 600px)\n condition = content.trim();\n }\n\n // Check for style query shorthand (starts with $)\n if (condition.startsWith('$')) {\n // Style query: @(layout, $compact) or @(layout, $variant=compact)\n const styleCondition = parseStyleQuery(condition);\n if (!styleCondition) {\n warnOnce(\n `invalid-style-query:${stateKey}`,\n `[Tasty] Invalid style query '${condition}' in container query.`,\n );\n return { type: 'modifier', condition: stateKey, raw };\n }\n condition = styleCondition;\n } else if (/^[a-zA-Z][\\w-]*\\s*\\(/.test(condition)) {\n // Function-like syntax: scroll-state(...), style(...), etc.\n // Pass through verbatim — no dimension expansion needed\n } else {\n // Dimension query - expand shorthands and units\n condition = expandDimensionShorthands(condition);\n condition = expandTastyUnits(condition);\n }\n\n return {\n type: 'container',\n condition,\n containerName,\n raw,\n };\n }\n\n // Check for predefined state reference\n if (isPredefinedStateRef(stateKey)) {\n const resolved = resolvePredefinedState(stateKey, ctx);\n if (resolved) {\n // Recursively parse the resolved value to extract the actual state type\n // (e.g., @mobile -> @media(w < 768px) should become a media state)\n const parsedResolved = parseAdvancedState(resolved, ctx);\n return {\n ...parsedResolved,\n raw, // Keep original raw for traceability\n };\n }\n // If not resolved, treat as modifier (will likely produce invalid CSS)\n return {\n type: 'modifier',\n condition: stateKey,\n raw,\n };\n }\n\n // Regular modifier (boolean mod, pseudo-class, class, attribute)\n return {\n type: 'modifier',\n condition: stateKey,\n raw,\n };\n}\n\n/**\n * Parse a style query condition (e.g., $compact, $variant=compact, $variant=\"very compact\")\n */\nfunction parseStyleQuery(condition: string): string | null {\n // Remove $ prefix\n const query = condition.slice(1);\n\n // Check for comparison operators (not supported)\n if (/[<>]/.test(query)) {\n warnOnce(\n `style-query-comparison:${condition}`,\n `[Tasty] Style queries only support equality. '${condition}' is invalid. Use '${condition.split(/[<>]/)[0]}=...' instead.`,\n );\n return null;\n }\n\n // Check for equality\n const eqIndex = query.indexOf('=');\n if (eqIndex === -1) {\n // Just existence check: style(--compact)\n return `style(--${query})`;\n }\n\n const propName = query.slice(0, eqIndex).trim();\n let value = query.slice(eqIndex + 1).trim();\n\n // Handle quoted values\n if (\n (value.startsWith('\"') && value.endsWith('\"')) ||\n (value.startsWith(\"'\") && value.endsWith(\"'\"))\n ) {\n // Keep quotes for CSS\n } else {\n // Add quotes if needed\n value = `\"${value}\"`;\n }\n\n // Expand tasty units in value\n value = expandTastyUnits(value);\n\n return `style(--${propName}: ${value})`;\n}\n\n/**\n * Find the index of the first comma at parentheses depth 0.\n * Returns -1 if no top-level comma is found.\n * This prevents splitting on commas inside function calls like scroll-state(a, b).\n */\nexport function findTopLevelComma(s: string): number {\n let depth = 0;\n\n for (let i = 0; i < s.length; i++) {\n if (s[i] === '(') depth++;\n else if (s[i] === ')') depth--;\n else if (s[i] === ',' && depth === 0) return i;\n }\n\n return -1;\n}\n\nfunction findMatchingParen(str: string, startIndex: number): number {\n let depth = 1;\n let i = startIndex + 1;\n\n while (i < str.length && depth > 0) {\n if (str[i] === '(') depth++;\n else if (str[i] === ')') depth--;\n i++;\n }\n\n return depth === 0 ? i - 1 : -1;\n}\n\n/**\n * Check if a state key is an advanced state (starts with @)\n */\nexport function isAdvancedState(stateKey: string): boolean {\n return stateKey.startsWith('@') || stateKey.startsWith('!@');\n}\n\n/**\n * Detect the type of advanced state from a raw state key\n */\nexport function detectAdvancedStateType(\n stateKey: string,\n): ParsedAdvancedState['type'] {\n // Handle negation prefix\n const key = stateKey.startsWith('!') ? stateKey.slice(1) : stateKey;\n\n if (key === '@starting') return 'starting';\n if (key.startsWith('@media')) return 'media';\n if (key.startsWith('@root(')) return 'root';\n if (key.startsWith('@own(')) return 'own';\n if (key.startsWith('@(')) return 'container';\n if (isPredefinedStateRef(key)) return 'predefined';\n return 'modifier';\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../src/states/index.ts"],"sourcesContent":["/**\n * Advanced State Mapping - Predefined States Management\n *\n * This module handles global and local predefined states for the Tasty styling system.\n * See ADVANCED_STATE_MAPPING.md for full specification.\n */\n\nimport { hasStylesGenerated } from '../config';\nimport type { Styles } from '../styles/types';\nimport { isDevEnv } from '../utils/is-dev-env';\n\n/**\n * Parsed advanced state information\n */\nexport interface ParsedAdvancedState {\n type:\n | 'media'\n | 'container'\n | 'root'\n | 'parent'\n | 'own'\n | 'starting'\n | 'predefined'\n | 'modifier';\n condition: string; // e.g., 'width <= 920px' or 'hovered'\n containerName?: string; // for container queries\n raw: string; // original state key\n mediaType?: string; // for @media:screen, @media:print, etc.\n}\n\n/**\n * Context for state parsing operations\n */\nexport interface StateParserContext {\n localPredefinedStates: Record<string, string>;\n globalPredefinedStates: Record<string, string>;\n isSubElement?: boolean; // true when processing sub-element styles (for @own() validation)\n}\n\n/**\n * At-rule context for CSS generation\n */\nexport interface AtRuleContext {\n media?: string[]; // @media conditions to wrap rule in (merged with 'and')\n container?: { name?: string; condition: string }[]; // @container conditions (nested)\n startingStyle?: boolean;\n rootStates?: string[]; // :root state selectors (e.g., '[data-theme=\"dark\"]')\n negatedRootStates?: string[]; // Negated :root state selectors for non-overlapping rules (e.g., ':not([data-theme=\"dark\"])')\n}\n\n// Built-in state names that cannot be overridden\nconst BUILTIN_STATES = new Set([\n '@starting',\n '@keyframes',\n '@properties',\n '@supports',\n // @inherit is a value (not a key), but reserved here to prevent\n // users from accidentally defining a state named '@inherit'.\n '@inherit',\n]);\n\n// Reserved prefixes that are built-in\nconst RESERVED_PREFIXES = [\n '@media',\n '@root',\n '@parent',\n '@own',\n '@(',\n '@starting',\n '@keyframes',\n '@properties',\n '@supports',\n '@inherit',\n];\n\n// Global predefined states storage\nlet globalPredefinedStates: Record<string, string> = {};\n\n// Warnings tracking to avoid duplicates\nconst emittedWarnings = new Set<string>();\n\nconst devMode = isDevEnv();\n\n/**\n * Emit a warning only once\n */\nfunction warnOnce(key: string, message: string): void {\n if (devMode && !emittedWarnings.has(key)) {\n emittedWarnings.add(key);\n console.warn(message);\n }\n}\n\n/**\n * Configure global predefined states\n */\nexport function setGlobalPredefinedStates(\n states: Record<string, string>,\n): void {\n if (hasStylesGenerated()) {\n const newStateNames = Object.keys(states).join(', ');\n warnOnce(\n `dynamic-states:${newStateNames}`,\n `[Tasty] Cannot update predefined states after styles have been generated.\\n` +\n `The new definition(s) for ${newStateNames} will be ignored.`,\n );\n return;\n }\n\n // Validate state names\n for (const [name, value] of Object.entries(states)) {\n // Check for valid name format\n if (!/^@[A-Za-z][A-Za-z0-9-]*$/.test(name)) {\n warnOnce(\n `invalid-state-name:${name}`,\n `[Tasty] Invalid predefined state name '${name}'. Must start with '@' followed by a letter.`,\n );\n continue;\n }\n\n // Check for reserved names\n if (BUILTIN_STATES.has(name)) {\n warnOnce(\n `reserved-state:${name}`,\n `[Tasty] Cannot define predefined state '${name}'. This name is reserved for built-in functionality.`,\n );\n continue;\n }\n\n // Check for reserved prefixes (but only exact matches, not user-defined states like @mobile)\n // Reserved prefixes are: @media, @root, @parent, @own, @(\n // A user state like @mobile should NOT be blocked\n const isReservedPrefix =\n name === '@media' ||\n name === '@root' ||\n name === '@parent' ||\n name === '@own' ||\n name.startsWith('@(');\n\n if (isReservedPrefix) {\n warnOnce(\n `reserved-prefix:${name}`,\n `[Tasty] Cannot define predefined state '${name}'. This prefix is reserved for built-in functionality.`,\n );\n continue;\n }\n\n // Check for cross-references\n const crossRefs = extractPredefinedStateRefs(value);\n if (crossRefs.length > 0) {\n warnOnce(\n `cross-ref:${name}`,\n `[Tasty] Predefined state '${name}' references another predefined state '${crossRefs[0]}'.\\n` +\n `Predefined states cannot reference each other. Use the full definition instead.`,\n );\n continue;\n }\n\n // Check for duplicates\n if (\n globalPredefinedStates[name] &&\n globalPredefinedStates[name] !== value\n ) {\n warnOnce(\n `duplicate-state:${name}`,\n `[Tasty] Duplicate predefined state '${name}' in configure(). The last definition will be used.`,\n );\n }\n\n globalPredefinedStates[name] = value;\n }\n}\n\n/**\n * Get global predefined states\n */\nexport function getGlobalPredefinedStates(): Record<string, string> {\n return globalPredefinedStates;\n}\n\n/**\n * Clear global predefined states (for testing only)\n */\nexport function clearGlobalPredefinedStates(): void {\n globalPredefinedStates = {};\n emittedWarnings.clear();\n}\n\n/**\n * Regex to match predefined state references in a string\n * Matches @name that is NOT followed by ( or : and is a complete word\n * Uses word boundary and negative lookahead\n */\nconst PREDEFINED_STATE_PATTERN = /@([A-Za-z][A-Za-z0-9-]*)(?![A-Za-z0-9-:(])/g;\n\n/**\n * Extract predefined state references from a string\n */\nexport function extractPredefinedStateRefs(value: string): string[] {\n const matches = value.matchAll(PREDEFINED_STATE_PATTERN);\n const refs: string[] = [];\n\n for (const match of matches) {\n const stateName = '@' + match[1];\n // Skip built-in states (@starting) and duplicates\n // Note: @media, @root, @own are always followed by '(' so the regex\n // negative lookahead (?![A-Za-z0-9-:(]) already excludes them\n if (!BUILTIN_STATES.has(stateName) && !refs.includes(stateName)) {\n refs.push(stateName);\n }\n }\n\n return refs;\n}\n\n/**\n * Check if a state key is a predefined state reference\n */\nexport function isPredefinedStateRef(stateKey: string): boolean {\n if (!stateKey.startsWith('@')) return false;\n if (BUILTIN_STATES.has(stateKey)) return false;\n\n // Check if it's NOT a built-in prefix\n for (const prefix of RESERVED_PREFIXES) {\n if (stateKey === prefix || stateKey.startsWith(prefix)) {\n // Check if it's exactly @media, @root, @parent, @own, or starts with @( or @media(\n if (\n stateKey === '@media' ||\n stateKey.startsWith('@media(') ||\n stateKey.startsWith('@media:')\n ) {\n return false;\n }\n if (stateKey === '@root' || stateKey.startsWith('@root(')) return false;\n if (stateKey === '@parent' || stateKey.startsWith('@parent('))\n return false;\n if (stateKey === '@own' || stateKey.startsWith('@own(')) return false;\n if (stateKey.startsWith('@(')) return false;\n }\n }\n\n // Must match the predefined state pattern\n return /^@[A-Za-z][A-Za-z0-9-]*$/.test(stateKey);\n}\n\n/**\n * Extract local predefined states from a styles object\n * Local predefined states are top-level keys starting with @ that have string values\n * and are valid predefined state names (not built-in like @media, @root, etc.)\n */\nexport function extractLocalPredefinedStates(\n styles: Styles,\n): Record<string, string> {\n const localStates: Record<string, string> = {};\n\n if (!styles || typeof styles !== 'object') {\n return localStates;\n }\n\n for (const [key, value] of Object.entries(styles)) {\n // Check if it's a predefined state definition (starts with @, has string value)\n if (key.startsWith('@') && typeof value === 'string') {\n // Validate name format - must be @[letter][letters/numbers/dashes]*\n if (!/^@[A-Za-z][A-Za-z0-9-]*$/.test(key)) {\n continue; // Skip invalid names silently (might be something else)\n }\n\n // Skip built-in states\n if (BUILTIN_STATES.has(key)) {\n continue;\n }\n\n // Skip reserved prefixes\n if (\n key === '@media' ||\n key === '@root' ||\n key === '@parent' ||\n key === '@own' ||\n key.startsWith('@(')\n ) {\n continue;\n }\n\n // Check for cross-references (predefined states cannot reference each other)\n const crossRefs = extractPredefinedStateRefs(value);\n if (crossRefs.length > 0) {\n warnOnce(\n `local-cross-ref:${key}`,\n `[Tasty] Predefined state '${key}' references another predefined state '${crossRefs[0]}'.\\n` +\n `Predefined states cannot reference each other. Use the full definition instead.`,\n );\n continue;\n }\n\n localStates[key] = value;\n }\n }\n\n return localStates;\n}\n\n/**\n * Create a state parser context from styles\n */\nexport function createStateParserContext(\n styles?: Styles,\n isSubElement?: boolean,\n): StateParserContext {\n const localStates = styles ? extractLocalPredefinedStates(styles) : {};\n\n return {\n localPredefinedStates: localStates,\n globalPredefinedStates: getGlobalPredefinedStates(),\n isSubElement,\n };\n}\n\n/**\n * Resolve a predefined state reference to its value\n * Returns the resolved value or null if not found\n */\nexport function resolvePredefinedState(\n stateKey: string,\n ctx: StateParserContext,\n): string | null {\n // Check local first (higher priority)\n if (ctx.localPredefinedStates[stateKey]) {\n return ctx.localPredefinedStates[stateKey];\n }\n\n // Then check global\n if (ctx.globalPredefinedStates[stateKey]) {\n return ctx.globalPredefinedStates[stateKey];\n }\n\n // Not found - emit warning\n warnOnce(\n `undefined-state:${stateKey}`,\n `[Tasty] Undefined predefined state '${stateKey}'.\\n` +\n `Define it in configure({ states: { '${stateKey}': '...' } }) or in the component's styles.`,\n );\n\n return null;\n}\n\n/**\n * Normalize state key by trimming whitespace and removing trailing/leading operators\n */\nexport function normalizeStateKey(stateKey: string): {\n key: string;\n warnings: string[];\n} {\n const warnings: string[] = [];\n let key = stateKey;\n\n // Check for whitespace-only\n if (key.trim() === '') {\n if (key !== '') {\n warnings.push(\n `[Tasty] Whitespace-only state key normalized to default state ''.`,\n );\n }\n return { key: '', warnings };\n }\n\n // Trim whitespace\n key = key.trim();\n\n // Remove trailing operators\n const trailingOpMatch = key.match(/\\s*[&|^]\\s*$/);\n if (trailingOpMatch) {\n const originalKey = key;\n key = key.slice(0, -trailingOpMatch[0].length).trim();\n warnings.push(\n `[Tasty] State key '${originalKey}' has trailing operator. Normalized to '${key}'.`,\n );\n }\n\n // Remove leading operators (except !)\n const leadingOpMatch = key.match(/^\\s*[&|^]\\s*/);\n if (leadingOpMatch) {\n const originalKey = key;\n key = key.slice(leadingOpMatch[0].length).trim();\n warnings.push(\n `[Tasty] State key '${originalKey}' has leading operator. Normalized to '${key}'.`,\n );\n }\n\n return { key, warnings };\n}\n\n/**\n * Expand dimension shorthands in a condition string\n * w -> width, h -> height, is -> inline-size, bs -> block-size\n */\nexport function expandDimensionShorthands(condition: string): string {\n // Replace dimension shorthands (only when they appear as standalone words)\n let result = condition;\n\n // w -> width (but not part of other words)\n result = result.replace(/\\bw\\b/g, 'width');\n\n // h -> height\n result = result.replace(/\\bh\\b/g, 'height');\n\n // is -> inline-size\n result = result.replace(/\\bis\\b/g, 'inline-size');\n\n // bs -> block-size\n result = result.replace(/\\bbs\\b/g, 'block-size');\n\n return result;\n}\n\n/**\n * Convert tasty units in a string (e.g., 40x -> calc(var(--gap) * 40))\n */\nexport function expandTastyUnits(value: string): string {\n // Match number followed by 'x' unit (tasty gap unit)\n return value.replace(/(\\d+(?:\\.\\d+)?)\\s*x\\b/g, (_, num) => {\n return `calc(var(--gap) * ${num})`;\n });\n}\n\n/**\n * Parse an advanced state key and return its type and components\n */\nexport function parseAdvancedState(\n stateKey: string,\n ctx: StateParserContext,\n): ParsedAdvancedState {\n const raw = stateKey;\n\n // Check for @starting (exact match)\n if (stateKey === '@starting') {\n return {\n type: 'starting',\n condition: '',\n raw,\n };\n }\n\n // Check for @media:type (e.g., @media:print)\n if (stateKey.startsWith('@media:')) {\n const mediaType = stateKey.slice(7); // Remove '@media:'\n if (!['all', 'screen', 'print', 'speech'].includes(mediaType)) {\n warnOnce(\n `unknown-media-type:${mediaType}`,\n `[Tasty] Unknown media type '${mediaType}'. Valid types: all, screen, print, speech.`,\n );\n }\n return {\n type: 'media',\n condition: '',\n mediaType,\n raw,\n };\n }\n\n // Check for @media(...) - media query with condition\n if (stateKey.startsWith('@media(')) {\n const endParen = findMatchingParen(stateKey, 6);\n if (endParen === -1) {\n warnOnce(\n `unclosed-media:${stateKey}`,\n `[Tasty] Unclosed media query '${stateKey}'. Missing closing parenthesis.`,\n );\n return { type: 'modifier', condition: stateKey, raw };\n }\n\n let condition = stateKey.slice(7, endParen);\n\n // Check for empty condition\n if (!condition.trim()) {\n warnOnce(\n `empty-media:${stateKey}`,\n `[Tasty] Empty media query condition '${stateKey}'.`,\n );\n return { type: 'modifier', condition: stateKey, raw };\n }\n\n // Expand shorthands and units\n condition = expandDimensionShorthands(condition);\n condition = expandTastyUnits(condition);\n\n return {\n type: 'media',\n condition,\n raw,\n };\n }\n\n // Check for @root(...) - root state\n if (stateKey.startsWith('@root(')) {\n const endParen = findMatchingParen(stateKey, 5);\n if (endParen === -1) {\n warnOnce(\n `unclosed-root:${stateKey}`,\n `[Tasty] Unclosed root state '${stateKey}'. Missing closing parenthesis.`,\n );\n return { type: 'modifier', condition: stateKey, raw };\n }\n\n const condition = stateKey.slice(6, endParen);\n\n if (!condition.trim()) {\n warnOnce(\n `empty-root:${stateKey}`,\n `[Tasty] Empty root state condition '${stateKey}'.`,\n );\n return { type: 'modifier', condition: stateKey, raw };\n }\n\n return {\n type: 'root',\n condition,\n raw,\n };\n }\n\n // Check for @parent(...) - parent element state\n if (stateKey.startsWith('@parent(')) {\n const endParen = findMatchingParen(stateKey, 7);\n if (endParen === -1) {\n warnOnce(\n `unclosed-parent:${stateKey}`,\n `[Tasty] Unclosed parent state '${stateKey}'. Missing closing parenthesis.`,\n );\n return { type: 'modifier', condition: stateKey, raw };\n }\n\n const condition = stateKey.slice(8, endParen);\n\n if (!condition.trim()) {\n warnOnce(\n `empty-parent:${stateKey}`,\n `[Tasty] Empty parent state condition '${stateKey}'.`,\n );\n return { type: 'modifier', condition: stateKey, raw };\n }\n\n return {\n type: 'parent',\n condition,\n raw,\n };\n }\n\n // Check for @own(...) - sub-element own state\n if (stateKey.startsWith('@own(')) {\n const endParen = findMatchingParen(stateKey, 4);\n if (endParen === -1) {\n warnOnce(\n `unclosed-own:${stateKey}`,\n `[Tasty] Unclosed own state '${stateKey}'. Missing closing parenthesis.`,\n );\n return { type: 'modifier', condition: stateKey, raw };\n }\n\n const condition = stateKey.slice(5, endParen);\n\n if (!condition.trim()) {\n warnOnce(\n `empty-own:${stateKey}`,\n `[Tasty] Empty own state condition '${stateKey}'.`,\n );\n return { type: 'modifier', condition: stateKey, raw };\n }\n\n // Check if used outside sub-element context\n if (!ctx.isSubElement) {\n warnOnce(\n `own-outside-subelement:${stateKey}`,\n `[Tasty] @own(${condition}) used outside sub-element context.\\n` +\n `@own() is equivalent to '${condition}' at the root level. ` +\n `Did you mean to use it inside a sub-element?`,\n );\n // Treat as regular modifier\n return {\n type: 'modifier',\n condition,\n raw,\n };\n }\n\n return {\n type: 'own',\n condition,\n raw,\n };\n }\n\n // Check for @(...) - container query (unnamed or named)\n if (stateKey.startsWith('@(')) {\n const endParen = findMatchingParen(stateKey, 1);\n if (endParen === -1) {\n warnOnce(\n `unclosed-container:${stateKey}`,\n `[Tasty] Unclosed container query '${stateKey}'. Missing closing parenthesis.`,\n );\n return { type: 'modifier', condition: stateKey, raw };\n }\n\n const content = stateKey.slice(2, endParen);\n\n if (!content.trim()) {\n warnOnce(\n `empty-container:${stateKey}`,\n `[Tasty] Empty container query '${stateKey}'.`,\n );\n return { type: 'modifier', condition: stateKey, raw };\n }\n\n // Check if named container (first token is name, followed by comma)\n // Use parentheses-aware comma search so inner commas (e.g., scroll-state(a, b)) are skipped\n const commaIndex = findTopLevelComma(content);\n let containerName: string | undefined;\n let condition: string;\n\n if (commaIndex !== -1) {\n // Named container: @(layout, w < 600px)\n containerName = content.slice(0, commaIndex).trim();\n condition = content.slice(commaIndex + 1).trim();\n } else {\n // Unnamed container: @(w < 600px)\n condition = content.trim();\n }\n\n // Check for style query shorthand (starts with $)\n if (condition.startsWith('$')) {\n // Style query: @(layout, $compact) or @(layout, $variant=compact)\n const styleCondition = parseStyleQuery(condition);\n if (!styleCondition) {\n warnOnce(\n `invalid-style-query:${stateKey}`,\n `[Tasty] Invalid style query '${condition}' in container query.`,\n );\n return { type: 'modifier', condition: stateKey, raw };\n }\n condition = styleCondition;\n } else if (/^[a-zA-Z][\\w-]*\\s*\\(/.test(condition)) {\n // Function-like syntax: scroll-state(...), style(...), etc.\n // Pass through verbatim — no dimension expansion needed\n } else {\n // Dimension query - expand shorthands and units\n condition = expandDimensionShorthands(condition);\n condition = expandTastyUnits(condition);\n }\n\n return {\n type: 'container',\n condition,\n containerName,\n raw,\n };\n }\n\n // Check for predefined state reference\n if (isPredefinedStateRef(stateKey)) {\n const resolved = resolvePredefinedState(stateKey, ctx);\n if (resolved) {\n // Recursively parse the resolved value to extract the actual state type\n // (e.g., @mobile -> @media(w < 768px) should become a media state)\n const parsedResolved = parseAdvancedState(resolved, ctx);\n return {\n ...parsedResolved,\n raw, // Keep original raw for traceability\n };\n }\n // If not resolved, treat as modifier (will likely produce invalid CSS)\n return {\n type: 'modifier',\n condition: stateKey,\n raw,\n };\n }\n\n // Regular modifier (boolean mod, pseudo-class, class, attribute)\n return {\n type: 'modifier',\n condition: stateKey,\n raw,\n };\n}\n\n/**\n * Parse a style query condition (e.g., $compact, $variant=compact, $variant=\"very compact\")\n */\nfunction parseStyleQuery(condition: string): string | null {\n // Remove $ prefix\n const query = condition.slice(1);\n\n // Check for comparison operators (not supported)\n if (/[<>]/.test(query)) {\n warnOnce(\n `style-query-comparison:${condition}`,\n `[Tasty] Style queries only support equality. '${condition}' is invalid. Use '${condition.split(/[<>]/)[0]}=...' instead.`,\n );\n return null;\n }\n\n // Check for equality\n const eqIndex = query.indexOf('=');\n if (eqIndex === -1) {\n // Just existence check: style(--compact)\n return `style(--${query})`;\n }\n\n const propName = query.slice(0, eqIndex).trim();\n let value = query.slice(eqIndex + 1).trim();\n\n // Handle quoted values\n if (\n (value.startsWith('\"') && value.endsWith('\"')) ||\n (value.startsWith(\"'\") && value.endsWith(\"'\"))\n ) {\n // Keep quotes for CSS\n } else {\n // Add quotes if needed\n value = `\"${value}\"`;\n }\n\n // Expand tasty units in value\n value = expandTastyUnits(value);\n\n return `style(--${propName}: ${value})`;\n}\n\n/**\n * Find the index of the first comma at parentheses depth 0.\n * Returns -1 if no top-level comma is found.\n * This prevents splitting on commas inside function calls like scroll-state(a, b).\n */\nexport function findTopLevelComma(s: string): number {\n let depth = 0;\n\n for (let i = 0; i < s.length; i++) {\n if (s[i] === '(') depth++;\n else if (s[i] === ')') depth--;\n else if (s[i] === ',' && depth === 0) return i;\n }\n\n return -1;\n}\n\nfunction findMatchingParen(str: string, startIndex: number): number {\n let depth = 1;\n let i = startIndex + 1;\n\n while (i < str.length && depth > 0) {\n if (str[i] === '(') depth++;\n else if (str[i] === ')') depth--;\n i++;\n }\n\n return depth === 0 ? i - 1 : -1;\n}\n\n/**\n * Check if a state key is an advanced state (starts with @)\n */\nexport function isAdvancedState(stateKey: string): boolean {\n return stateKey.startsWith('@') || stateKey.startsWith('!@');\n}\n\n/**\n * Detect the type of advanced state from a raw state key\n */\nexport function detectAdvancedStateType(\n stateKey: string,\n): ParsedAdvancedState['type'] {\n // Handle negation prefix\n const key = stateKey.startsWith('!') ? stateKey.slice(1) : stateKey;\n\n if (key === '@starting') return 'starting';\n if (key.startsWith('@media')) return 'media';\n if (key.startsWith('@root(')) return 'root';\n if (key.startsWith('@parent(')) return 'parent';\n if (key.startsWith('@own(')) return 'own';\n if (key.startsWith('@(')) return 'container';\n if (isPredefinedStateRef(key)) return 'predefined';\n return 'modifier';\n}\n"],"mappings":"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"}
|
package/dist/styles/types.d.ts
CHANGED
|
@@ -441,13 +441,15 @@ interface StylesInterface extends Omit<CSSProperties, 'color' | 'fill' | 'font'
|
|
|
441
441
|
/**
|
|
442
442
|
* Apply one or more predefined style recipes by name.
|
|
443
443
|
* Recipes are defined globally via `configure({ recipes: { ... } })`.
|
|
444
|
-
* Multiple recipes are space-separated. Use
|
|
444
|
+
* Multiple recipes are space-separated. Use `/` to separate base recipes
|
|
445
445
|
* (applied before component styles) from post recipes (applied after, via mergeStyles).
|
|
446
|
+
* Use `none` to explicitly skip base recipes.
|
|
446
447
|
*
|
|
447
448
|
* Examples:
|
|
448
449
|
* - `recipe: 'card'` // Apply the 'card' recipe
|
|
449
450
|
* - `recipe: 'card elevated'` // Apply 'card' then 'elevated', then component styles
|
|
450
|
-
* - `recipe: 'reset input
|
|
451
|
+
* - `recipe: 'reset input / input-autofill'` // Base recipes, then post recipe
|
|
452
|
+
* - `recipe: 'none / disabled'` // No base recipes, only post recipe
|
|
451
453
|
* - `recipe: ''` // Clear recipes from base styles when extending
|
|
452
454
|
*/
|
|
453
455
|
recipe?: string;
|
|
@@ -13,7 +13,7 @@ import { mergeStyles } from "./merge-styles.js";
|
|
|
13
13
|
* Resolution order per level (top-level and each sub-element independently):
|
|
14
14
|
* base_recipe_1 base_recipe_2 → component styles → post_recipe_1 post_recipe_2
|
|
15
15
|
*
|
|
16
|
-
* The
|
|
16
|
+
* The `/` separator splits base recipes (before component styles)
|
|
17
17
|
* from post recipes (after component styles). All merges use mergeStyles
|
|
18
18
|
* semantics: primitives and state maps with '' key fully replace;
|
|
19
19
|
* state maps without '' key extend the existing value.
|
|
@@ -24,10 +24,11 @@ const devMode = isDevEnv();
|
|
|
24
24
|
/**
|
|
25
25
|
* Parse a recipe string into base and post recipe name groups.
|
|
26
26
|
*
|
|
27
|
-
* Syntax: `'base1 base2
|
|
27
|
+
* Syntax: `'base1 base2 / post1 post2'`
|
|
28
28
|
* - Names are space-separated within each group
|
|
29
|
-
* -
|
|
30
|
-
* -
|
|
29
|
+
* - `/` separates base (before component) from post (after component) groups
|
|
30
|
+
* - `/` is optional; if absent, all names are base
|
|
31
|
+
* - `none` as the sole base value means "no base recipes"
|
|
31
32
|
*
|
|
32
33
|
* Returns `{ base: null, post: null }` if the string is empty or invalid.
|
|
33
34
|
*/
|
|
@@ -39,15 +40,18 @@ function parseRecipeNames(value) {
|
|
|
39
40
|
if (typeof value !== "string") return empty;
|
|
40
41
|
const trimmed = value.trim();
|
|
41
42
|
if (trimmed === "") return empty;
|
|
42
|
-
const
|
|
43
|
-
if (
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
43
|
+
const slashIndex = trimmed.indexOf("/");
|
|
44
|
+
if (slashIndex === -1) {
|
|
45
|
+
if (trimmed === "none") return empty;
|
|
46
|
+
return {
|
|
47
|
+
base: splitNames(trimmed),
|
|
48
|
+
post: null
|
|
49
|
+
};
|
|
50
|
+
}
|
|
51
|
+
const basePart = trimmed.slice(0, slashIndex);
|
|
52
|
+
const postPart = trimmed.slice(slashIndex + 1);
|
|
49
53
|
return {
|
|
50
|
-
base: splitNames(basePart),
|
|
54
|
+
base: basePart.trim() === "none" ? null : splitNames(basePart),
|
|
51
55
|
post: splitNames(postPart)
|
|
52
56
|
};
|
|
53
57
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"resolve-recipes.js","names":[],"sources":["../../src/utils/resolve-recipes.ts"],"sourcesContent":["/**\n * Recipe resolution utility.\n *\n * Resolves `recipe` style properties by looking up predefined recipe styles\n * from global configuration and merging them with the component's own styles.\n *\n * Resolution order per level (top-level and each sub-element independently):\n * base_recipe_1 base_recipe_2 → component styles → post_recipe_1 post_recipe_2\n *\n * The
|
|
1
|
+
{"version":3,"file":"resolve-recipes.js","names":[],"sources":["../../src/utils/resolve-recipes.ts"],"sourcesContent":["/**\n * Recipe resolution utility.\n *\n * Resolves `recipe` style properties by looking up predefined recipe styles\n * from global configuration and merging them with the component's own styles.\n *\n * Resolution order per level (top-level and each sub-element independently):\n * base_recipe_1 base_recipe_2 → component styles → post_recipe_1 post_recipe_2\n *\n * The `/` separator splits base recipes (before component styles)\n * from post recipes (after component styles). All merges use mergeStyles\n * semantics: primitives and state maps with '' key fully replace;\n * state maps without '' key extend the existing value.\n *\n * Returns the same object reference if no recipes are present (zero overhead).\n */\n\nimport { getGlobalRecipes } from '../config';\nimport { isSelector } from '../pipeline';\nimport type { RecipeStyles, Styles } from '../styles/types';\n\nimport { isDevEnv } from './is-dev-env';\nimport { mergeStyles } from './merge-styles';\n\nconst devMode = isDevEnv();\n\ninterface ParsedRecipeGroups {\n base: string[] | null;\n post: string[] | null;\n}\n\n/**\n * Parse a recipe string into base and post recipe name groups.\n *\n * Syntax: `'base1 base2 / post1 post2'`\n * - Names are space-separated within each group\n * - `/` separates base (before component) from post (after component) groups\n * - `/` is optional; if absent, all names are base\n * - `none` as the sole base value means \"no base recipes\"\n *\n * Returns `{ base: null, post: null }` if the string is empty or invalid.\n */\nfunction parseRecipeNames(value: unknown): ParsedRecipeGroups {\n const empty: ParsedRecipeGroups = { base: null, post: null };\n\n if (typeof value !== 'string') return empty;\n const trimmed = value.trim();\n if (trimmed === '') return empty;\n\n const slashIndex = trimmed.indexOf('/');\n\n if (slashIndex === -1) {\n if (trimmed === 'none') return empty;\n const names = splitNames(trimmed);\n return { base: names, post: null };\n }\n\n const basePart = trimmed.slice(0, slashIndex);\n const postPart = trimmed.slice(slashIndex + 1);\n\n return {\n base: basePart.trim() === 'none' ? null : splitNames(basePart),\n post: splitNames(postPart),\n };\n}\n\nfunction splitNames(s: string): string[] | null {\n const names = s.split(/\\s+/).filter(Boolean);\n return names.length > 0 ? names : null;\n}\n\n/**\n * Collect merged styles for a list of recipe names.\n * Each recipe is flat-spread on top of the previous.\n */\nfunction collectRecipeStyles(\n names: string[],\n recipes: Record<string, RecipeStyles>,\n): Record<string, unknown> {\n let merged: Record<string, unknown> = {};\n\n for (const name of names) {\n const recipeStyles = recipes[name];\n\n if (!recipeStyles) {\n if (devMode) {\n console.warn(\n `[Tasty] Recipe \"${name}\" not found. ` +\n `Make sure it is defined in configure({ recipes: { ... } }).`,\n );\n }\n continue;\n }\n\n merged = { ...merged, ...(recipeStyles as Record<string, unknown>) };\n }\n\n return merged;\n}\n\n/**\n * Resolve recipe references in a flat styles object (no sub-elements).\n * Returns null if no `recipe` key is present.\n *\n * Resolution: base recipes → component styles → post recipes (all via mergeStyles)\n */\nfunction resolveRecipesForLevel(\n styles: Record<string, unknown>,\n recipes: Record<string, RecipeStyles>,\n): Record<string, unknown> | null {\n if (!('recipe' in styles)) return null;\n\n const { base, post } = parseRecipeNames(styles.recipe);\n\n // Separate selector keys (sub-elements) from flat style properties.\n // mergeStyles handles selectors with its own semantics (e.g. false = delete),\n // but at this level we only want recipe merging on flat properties.\n\n const { recipe: _recipe, ...allRest } = styles;\n const flatStyles: Record<string, unknown> = {};\n const selectorStyles: Record<string, unknown> = {};\n\n for (const key of Object.keys(allRest)) {\n if (isSelector(key)) {\n selectorStyles[key] = allRest[key];\n } else {\n flatStyles[key] = allRest[key];\n }\n }\n\n if (!base && !post) {\n return allRest;\n }\n\n // 1. Merge base recipes, then component styles on top (via mergeStyles)\n let result: Record<string, unknown>;\n\n if (base) {\n const baseStyles = collectRecipeStyles(base, recipes);\n result = mergeStyles(baseStyles as Styles, flatStyles as Styles) as Record<\n string,\n unknown\n >;\n } else {\n result = { ...flatStyles };\n }\n\n // 2. Apply post recipes via mergeStyles (state map extend semantics)\n if (post) {\n const postStyles = collectRecipeStyles(post, recipes);\n result = mergeStyles(result as Styles, postStyles as Styles) as Record<\n string,\n unknown\n >;\n }\n\n // Re-attach selector keys unchanged\n for (const key of Object.keys(selectorStyles)) {\n result[key] = selectorStyles[key];\n }\n\n return result;\n}\n\n/**\n * Resolve all `recipe` style properties in a styles object.\n *\n * Handles both top-level and sub-element recipe references.\n * Returns the same object reference if no recipes are present anywhere\n * (zero overhead for the common case).\n *\n * @param styles - The styles object potentially containing `recipe` keys\n * @returns Resolved styles with recipe values merged in, or the original object if unchanged\n */\nexport function resolveRecipes(styles: Styles): Styles {\n const recipes = getGlobalRecipes();\n\n // Fast path: no recipes configured globally\n if (!recipes) return styles;\n\n let changed = false;\n\n // Resolve top-level recipe\n const topResolved = resolveRecipesForLevel(\n styles as Record<string, unknown>,\n recipes,\n );\n\n let result: Record<string, unknown>;\n\n if (topResolved) {\n changed = true;\n result = topResolved;\n } else {\n // Keep reference; a shallow copy is deferred until a sub-element actually changes\n result = styles as Record<string, unknown>;\n }\n\n // Resolve sub-element recipes\n const keys = Object.keys(result);\n\n for (const key of keys) {\n if (!isSelector(key)) continue;\n\n const subStyles = result[key];\n\n if (\n !subStyles ||\n typeof subStyles !== 'object' ||\n Array.isArray(subStyles)\n ) {\n continue;\n }\n\n const subRecord = subStyles as Record<string, unknown>;\n\n if (!('recipe' in subRecord)) continue;\n\n const subResolved = resolveRecipesForLevel(subRecord, recipes);\n\n if (subResolved) {\n if (!changed) {\n // First change in sub-elements -- need to shallow-copy the top level\n changed = true;\n result = { ...(styles as Record<string, unknown>) };\n }\n result[key] = subResolved;\n }\n }\n\n return changed ? (result as Styles) : styles;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAwBA,MAAM,UAAU,UAAU;;;;;;;;;;;;AAkB1B,SAAS,iBAAiB,OAAoC;CAC5D,MAAM,QAA4B;EAAE,MAAM;EAAM,MAAM;EAAM;AAE5D,KAAI,OAAO,UAAU,SAAU,QAAO;CACtC,MAAM,UAAU,MAAM,MAAM;AAC5B,KAAI,YAAY,GAAI,QAAO;CAE3B,MAAM,aAAa,QAAQ,QAAQ,IAAI;AAEvC,KAAI,eAAe,IAAI;AACrB,MAAI,YAAY,OAAQ,QAAO;AAE/B,SAAO;GAAE,MADK,WAAW,QAAQ;GACX,MAAM;GAAM;;CAGpC,MAAM,WAAW,QAAQ,MAAM,GAAG,WAAW;CAC7C,MAAM,WAAW,QAAQ,MAAM,aAAa,EAAE;AAE9C,QAAO;EACL,MAAM,SAAS,MAAM,KAAK,SAAS,OAAO,WAAW,SAAS;EAC9D,MAAM,WAAW,SAAS;EAC3B;;AAGH,SAAS,WAAW,GAA4B;CAC9C,MAAM,QAAQ,EAAE,MAAM,MAAM,CAAC,OAAO,QAAQ;AAC5C,QAAO,MAAM,SAAS,IAAI,QAAQ;;;;;;AAOpC,SAAS,oBACP,OACA,SACyB;CACzB,IAAI,SAAkC,EAAE;AAExC,MAAK,MAAM,QAAQ,OAAO;EACxB,MAAM,eAAe,QAAQ;AAE7B,MAAI,CAAC,cAAc;AACjB,OAAI,QACF,SAAQ,KACN,mBAAmB,KAAK,0EAEzB;AAEH;;AAGF,WAAS;GAAE,GAAG;GAAQ,GAAI;GAA0C;;AAGtE,QAAO;;;;;;;;AAST,SAAS,uBACP,QACA,SACgC;AAChC,KAAI,EAAE,YAAY,QAAS,QAAO;CAElC,MAAM,EAAE,MAAM,SAAS,iBAAiB,OAAO,OAAO;CAMtD,MAAM,EAAE,QAAQ,SAAS,GAAG,YAAY;CACxC,MAAM,aAAsC,EAAE;CAC9C,MAAM,iBAA0C,EAAE;AAElD,MAAK,MAAM,OAAO,OAAO,KAAK,QAAQ,CACpC,KAAI,WAAW,IAAI,CACjB,gBAAe,OAAO,QAAQ;KAE9B,YAAW,OAAO,QAAQ;AAI9B,KAAI,CAAC,QAAQ,CAAC,KACZ,QAAO;CAIT,IAAI;AAEJ,KAAI,KAEF,UAAS,YADU,oBAAoB,MAAM,QAAQ,EACV,WAAqB;KAKhE,UAAS,EAAE,GAAG,YAAY;AAI5B,KAAI,MAAM;EACR,MAAM,aAAa,oBAAoB,MAAM,QAAQ;AACrD,WAAS,YAAY,QAAkB,WAAqB;;AAO9D,MAAK,MAAM,OAAO,OAAO,KAAK,eAAe,CAC3C,QAAO,OAAO,eAAe;AAG/B,QAAO;;;;;;;;;;;;AAaT,SAAgB,eAAe,QAAwB;CACrD,MAAM,UAAU,kBAAkB;AAGlC,KAAI,CAAC,QAAS,QAAO;CAErB,IAAI,UAAU;CAGd,MAAM,cAAc,uBAClB,QACA,QACD;CAED,IAAI;AAEJ,KAAI,aAAa;AACf,YAAU;AACV,WAAS;OAGT,UAAS;CAIX,MAAM,OAAO,OAAO,KAAK,OAAO;AAEhC,MAAK,MAAM,OAAO,MAAM;AACtB,MAAI,CAAC,WAAW,IAAI,CAAE;EAEtB,MAAM,YAAY,OAAO;AAEzB,MACE,CAAC,aACD,OAAO,cAAc,YACrB,MAAM,QAAQ,UAAU,CAExB;EAGF,MAAM,YAAY;AAElB,MAAI,EAAE,YAAY,WAAY;EAE9B,MAAM,cAAc,uBAAuB,WAAW,QAAQ;AAE9D,MAAI,aAAa;AACf,OAAI,CAAC,SAAS;AAEZ,cAAU;AACV,aAAS,EAAE,GAAI,QAAoC;;AAErD,UAAO,OAAO;;;AAIlB,QAAO,UAAW,SAAoB"}
|