@tenphi/tasty 0.0.0-snapshot.db103fd → 0.0.0-snapshot.dc62ea3

package/dist/chunks/renderChunk.js

@@ -1,59 +0,0 @@
-import { extractLocalPredefinedStates } from "../states/index.js";
-import { hasPipelineCacheEntry, renderStyles } from "../pipeline/index.js";
-import { CHUNK_NAMES } from "./definitions.js";
-//#region src/chunks/renderChunk.ts
-/**
-* Build a filtered styles object for a regular chunk.
-*/
-function buildFilteredStyles(styles, styleKeys) {
-	const localPredefinedStates = extractLocalPredefinedStates(styles);
-	const filteredStyles = {};
-	for (const [key, value] of Object.entries(localPredefinedStates)) filteredStyles[key] = value;
-	for (const key of styleKeys) {
-		const value = styles[key];
-		if (value !== void 0) filteredStyles[key] = value;
-	}
-	return filteredStyles;
-}
-/**
-* Build a filtered styles object for the subcomponents chunk.
-*/
-function buildSubcomponentFilteredStyles(styles, selectorKeys) {
-	const localPredefinedStates = extractLocalPredefinedStates(styles);
-	const filteredStyles = {};
-	for (const [key, value] of Object.entries(localPredefinedStates)) filteredStyles[key] = value;
-	for (const key of selectorKeys) {
-		const value = styles[key];
-		if (value !== void 0) filteredStyles[key] = value;
-	}
-	if (styles.$ !== void 0) filteredStyles.$ = styles.$;
-	return filteredStyles;
-}
-/**
-* Render styles for a specific chunk.
-*
-* On pipeline cache hit, avoids building the filtered styles object entirely.
-* Only constructs it on cache miss when the pipeline actually needs the styles.
-*
-* IMPORTANT: Local predefined states (e.g., '@mobile': '@media(w < 600px)')
-* are always included in the filtered styles, regardless of which chunk is
-* being rendered. This ensures that state references like '@mobile' in any
-* chunk can be properly resolved by the pipeline.
-*
-* @param styles - The full styles object
-* @param chunkName - Name of the chunk being rendered
-* @param styleKeys - Keys of styles belonging to this chunk
-* @returns RenderResult with rules for this chunk
-*/
-function renderStylesForChunk(styles, chunkName, styleKeys, pipelineCacheKey) {
-	if (styleKeys.length === 0) return {
-		rules: [],
-		className: ""
-	};
-	if (pipelineCacheKey && hasPipelineCacheEntry(pipelineCacheKey)) return renderStyles(void 0, void 0, void 0, pipelineCacheKey);
-	return renderStyles(chunkName === CHUNK_NAMES.SUBCOMPONENTS ? buildSubcomponentFilteredStyles(styles, styleKeys) : buildFilteredStyles(styles, styleKeys), void 0, void 0, pipelineCacheKey);
-}
-//#endregion
-export { renderStylesForChunk };
-
-//# sourceMappingURL=renderChunk.js.map

package/dist/chunks/renderChunk.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"renderChunk.js","names":[],"sources":["../../src/chunks/renderChunk.ts"],"sourcesContent":["/**\n * Chunk-specific style rendering.\n *\n * Renders styles for a specific chunk by filtering the styles object\n * to only include relevant keys before passing to renderStyles.\n */\n\nimport type { RenderResult } from '../pipeline';\nimport { hasPipelineCacheEntry, renderStyles } from '../pipeline';\nimport { extractLocalPredefinedStates } from '../states';\nimport type { Styles } from '../styles/types';\n\nimport { CHUNK_NAMES } from './definitions';\n\n/**\n * Build a filtered styles object for a regular chunk.\n */\nfunction buildFilteredStyles(styles: Styles, styleKeys: string[]): Styles {\n  const localPredefinedStates = extractLocalPredefinedStates(styles);\n  const filteredStyles: Styles = {};\n\n  for (const [key, value] of Object.entries(localPredefinedStates)) {\n    filteredStyles[key] = value;\n  }\n\n  for (const key of styleKeys) {\n    const value = styles[key];\n    if (value !== undefined) {\n      filteredStyles[key] = value;\n    }\n  }\n\n  return filteredStyles;\n}\n\n/**\n * Build a filtered styles object for the subcomponents chunk.\n */\nfunction buildSubcomponentFilteredStyles(\n  styles: Styles,\n  selectorKeys: string[],\n): Styles {\n  const localPredefinedStates = extractLocalPredefinedStates(styles);\n  const filteredStyles: Styles = {};\n\n  for (const [key, value] of Object.entries(localPredefinedStates)) {\n    filteredStyles[key] = value;\n  }\n\n  for (const key of selectorKeys) {\n    const value = styles[key];\n    if (value !== undefined) {\n      filteredStyles[key] = value;\n    }\n  }\n\n  if (styles.$ !== undefined) {\n    filteredStyles.$ = styles.$;\n  }\n\n  return filteredStyles;\n}\n\n/**\n * Render styles for a specific chunk.\n *\n * On pipeline cache hit, avoids building the filtered styles object entirely.\n * Only constructs it on cache miss when the pipeline actually needs the styles.\n *\n * IMPORTANT: Local predefined states (e.g., '@mobile': '@media(w < 600px)')\n * are always included in the filtered styles, regardless of which chunk is\n * being rendered. This ensures that state references like '@mobile' in any\n * chunk can be properly resolved by the pipeline.\n *\n * @param styles - The full styles object\n * @param chunkName - Name of the chunk being rendered\n * @param styleKeys - Keys of styles belonging to this chunk\n * @returns RenderResult with rules for this chunk\n */\nexport function renderStylesForChunk(\n  styles: Styles,\n  chunkName: string,\n  styleKeys: string[],\n  pipelineCacheKey?: string,\n): RenderResult {\n  if (styleKeys.length === 0) {\n    return { rules: [], className: '' };\n  }\n\n  // Fast path: skip building filteredStyles when pipeline has a cached result\n  if (pipelineCacheKey && hasPipelineCacheEntry(pipelineCacheKey)) {\n    return renderStyles(undefined, undefined, undefined, pipelineCacheKey);\n  }\n\n  // Cache miss: build filtered styles and run pipeline\n  const filteredStyles =\n    chunkName === CHUNK_NAMES.SUBCOMPONENTS\n      ? buildSubcomponentFilteredStyles(styles, styleKeys)\n      : buildFilteredStyles(styles, styleKeys);\n\n  return renderStyles(filteredStyles, undefined, undefined, pipelineCacheKey);\n}\n"],"mappings":";;;;;;;AAiBA,SAAS,oBAAoB,QAAgB,WAA6B;CACxE,MAAM,wBAAwB,6BAA6B,OAAO;CAClE,MAAM,iBAAyB,EAAE;AAEjC,MAAK,MAAM,CAAC,KAAK,UAAU,OAAO,QAAQ,sBAAsB,CAC9D,gBAAe,OAAO;AAGxB,MAAK,MAAM,OAAO,WAAW;EAC3B,MAAM,QAAQ,OAAO;AACrB,MAAI,UAAU,KAAA,EACZ,gBAAe,OAAO;;AAI1B,QAAO;;;;;AAMT,SAAS,gCACP,QACA,cACQ;CACR,MAAM,wBAAwB,6BAA6B,OAAO;CAClE,MAAM,iBAAyB,EAAE;AAEjC,MAAK,MAAM,CAAC,KAAK,UAAU,OAAO,QAAQ,sBAAsB,CAC9D,gBAAe,OAAO;AAGxB,MAAK,MAAM,OAAO,cAAc;EAC9B,MAAM,QAAQ,OAAO;AACrB,MAAI,UAAU,KAAA,EACZ,gBAAe,OAAO;;AAI1B,KAAI,OAAO,MAAM,KAAA,EACf,gBAAe,IAAI,OAAO;AAG5B,QAAO;;;;;;;;;;;;;;;;;;AAmBT,SAAgB,qBACd,QACA,WACA,WACA,kBACc;AACd,KAAI,UAAU,WAAW,EACvB,QAAO;EAAE,OAAO,EAAE;EAAE,WAAW;EAAI;AAIrC,KAAI,oBAAoB,sBAAsB,iBAAiB,CAC7D,QAAO,aAAa,KAAA,GAAW,KAAA,GAAW,KAAA,GAAW,iBAAiB;AASxE,QAAO,aAJL,cAAc,YAAY,gBACtB,gCAAgC,QAAQ,UAAU,GAClD,oBAAoB,QAAQ,UAAU,EAER,KAAA,GAAW,KAAA,GAAW,iBAAiB"}

package/dist/config.d.ts

@@ -1,366 +0,0 @@
-import { CounterStyleDescriptors, FontFaceInput, KeyframesSteps, PropertyDefinition } from "./injector/types.js";
-import { StyleDetails, UnitHandler } from "./parser/types.js";
-import { StyleHandlerDefinition } from "./utils/styles.js";
-import { ConfigTokens, RecipeStyles } from "./styles/types.js";
-import { StyleInjector } from "./injector/injector.js";
-import { ColorSpace } from "./utils/color-space.js";
-import { TastyPlugin } from "./plugins/types.js";
-
-//#region src/config.d.ts
-/**
- * Configuration options for the Tasty style system
- */
-interface TastyConfig {
-  /** CSP nonce for style elements */
-  nonce?: string;
-  /** Maximum rules per stylesheet (default: 8192) */
-  maxRulesPerSheet?: number;
-  /** Threshold for bulk cleanup of unused styles (default: 500) */
-  unusedStylesThreshold?: number;
-  /** Delay before bulk cleanup in ms, ignored if idleCleanup is true (default: 5000) */
-  bulkCleanupDelay?: number;
-  /** Use requestIdleCallback for cleanup when available (default: true) */
-  idleCleanup?: boolean;
-  /** Force text injection mode, auto-detected in test environments (default: auto) */
-  forceTextInjection?: boolean;
-  /** Enable development mode features: performance metrics and debug info (default: auto) */
-  devMode?: boolean;
-  /**
-   * Ratio of unused styles to delete per bulk cleanup run (0..1).
-   * Defaults to 0.5 (oldest half) to reduce risk of removing styles
-   * that may be restored shortly after being marked unused.
-   */
-  bulkCleanupBatchRatio?: number;
-  /**
-   * Minimum age (in ms) a style must remain unused before eligible for deletion.
-   * Helps avoid races during rapid mount/unmount cycles. Default: 10000ms.
-   */
-  unusedStylesMinAgeMs?: number;
-  /**
-   * Global predefined states for advanced state mapping.
-   * These are state aliases that can be used in any component.
-   * Example: { '@mobile': '@media(w < 920px)', '@dark': '@root(theme=dark)' }
-   */
-  states?: Record<string, string>;
-  /**
-   * Parser LRU cache size (default: 1000).
-   * Larger values improve performance for apps with many unique style values.
-   */
-  parserCacheSize?: number;
-  /**
-   * Custom units for the style parser (merged with built-in units).
-   * Units transform numeric values like `2x` → `calc(2 * var(--gap))`.
-   * @example { em: 'em', vw: 'vw', custom: (n) => `${n * 10}px` }
-   */
-  units?: Record<string, string | UnitHandler>;
-  /**
-   * Custom functions for the style parser (merged with existing).
-   * Functions process parsed style groups and return CSS values.
-   * @example { myFunc: (groups) => groups.map(g => g.output).join(' ') }
-   */
-  funcs?: Record<string, (groups: StyleDetails[]) => string>;
-  /**
-   * Color space used for decomposed color token companion variables.
-   * Controls the CSS function and suffix for alpha composition.
-   *
-   * - `'rgb'`   — suffix `-rgb`, e.g. `rgb(var(--name-color-rgb) / .5)`
-   * - `'hsl'`   — suffix `-hsl`, e.g. `hsl(var(--name-color-hsl) / .5)`
-   * - `'oklch'` — suffix `-oklch`, e.g. `oklch(var(--name-color-oklch) / .5)`
-   *
-   * @default 'oklch'
-   */
-  colorSpace?: ColorSpace;
-  /**
-   * Automatically infer and register CSS @property declarations
-   * from custom property values found in styles, keyframes, and global config.
-   * Covers all types: \<color\>, \<number\>, \<length\>, \<angle\>, \<percentage\>, \<time\>.
-   * When false, only explicitly declared @properties are registered.
-   * @default true
-   */
-  autoPropertyTypes?: boolean;
-  /**
-   * Plugins that extend tasty with custom functions, units, or states.
-   * Plugins are processed in order, with later plugins overriding earlier ones.
-   * @example
-   * ```ts
-   * import { okhslPlugin } from '@tenphi/tasty';
-   *
-   * configure({
-   *   plugins: [okhslPlugin()],
-   * });
-   * ```
-   */
-  plugins?: TastyPlugin[];
-  /**
-   * Global keyframes definitions that can be referenced by animation names in styles.
-   * Keys are animation names, values are keyframes step definitions.
-   * Keyframes are only injected when actually used in styles.
-   * @example
-   * ```ts
-   * configure({
-   *   keyframes: {
-   *     fadeIn: { from: { opacity: 0 }, to: { opacity: 1 } },
-   *     pulse: { '0%, 100%': { transform: 'scale(1)' }, '50%': { transform: 'scale(1.05)' } },
-   *   },
-   * });
-   * ```
-   */
-  keyframes?: Record<string, KeyframesSteps>;
-  /**
-   * Global CSS @property definitions for custom properties.
-   * Keys use tasty token syntax ($name for properties, #name for colors).
-   * Properties are only injected when the component using them is rendered.
-   *
-   * For color tokens (#name), `syntax: '<color>'` is auto-set and
-   * `initialValue` defaults to `'transparent'` if not specified.
-   *
-   * @example
-   * ```ts
-   * configure({
-   *   properties: {
-   *     '$rotation': { syntax: '<angle>', initialValue: '0deg' },
-   *     '$scale': { syntax: '<number>', inherits: false, initialValue: 1 },
-   *     '#accent': { initialValue: 'purple' }, // syntax: '<color>' auto-set
-   *   },
-   * });
-   *
-   * // Now use in styles - properties are registered when component renders:
-   * const Spinner = tasty({
-   *   styles: {
-   *     transform: 'rotate($rotation)',
-   *     transition: '$$rotation 0.3s', // outputs: --rotation 0.3s
-   *   },
-   * });
-   * ```
-   */
-  properties?: Record<string, PropertyDefinition>;
-  /**
-   * Global @font-face definitions.
-   * Keys are font-family names, values are descriptors or arrays of descriptors
-   * (for multiple weights/styles of the same family).
-   * Injected eagerly when styles are first generated.
-   * @example
-   * ```ts
-   * configure({
-   *   fontFace: {
-   *     'Brand Sans': [
-   *       { src: 'url("/fonts/brand-regular.woff2") format("woff2")', fontWeight: 400, fontDisplay: 'swap' },
-   *       { src: 'url("/fonts/brand-bold.woff2") format("woff2")', fontWeight: 700, fontDisplay: 'swap' },
-   *     ],
-   *     Icons: { src: 'url("/fonts/icons.woff2") format("woff2")', fontDisplay: 'block' },
-   *   },
-   * });
-   * ```
-   */
-  fontFace?: Record<string, FontFaceInput>;
-  /**
-   * Global @counter-style definitions.
-   * Keys are counter-style names, values are descriptor objects.
-   * Injected eagerly when styles are first generated.
-   * @example
-   * ```ts
-   * configure({
-   *   counterStyle: {
-   *     thumbs: { system: 'cyclic', symbols: '"👍"', suffix: '" "' },
-   *   },
-   * });
-   * ```
-   */
-  counterStyle?: Record<string, CounterStyleDescriptors>;
-  /**
-   * Custom style handlers that transform style properties into CSS declarations.
-   * Handlers replace built-in handlers for the same style name.
-   * @example
-   * ```ts
-   * import { styleHandlers } from '@tenphi/tasty';
-   *
-   * configure({
-   *   handlers: {
-   *     // Override fill with custom behavior
-   *     fill: ({ fill }) => {
-   *       if (fill?.startsWith('gradient:')) {
-   *         return { background: fill.slice(9) };
-   *       }
-   *       return styleHandlers.fill({ fill });
-   *     },
-   *     // Add new custom style
-   *     elevation: ({ elevation }) => {
-   *       const level = parseInt(elevation) || 1;
-   *       return {
-   *         'box-shadow': `0 ${level * 2}px ${level * 4}px rgba(0,0,0,0.1)`,
-   *         'z-index': String(level * 100),
-   *       };
-   *     },
-   *   },
-   * });
-   * ```
-   */
-  handlers?: Record<string, StyleHandlerDefinition>;
-  /**
-   * Design tokens injected as CSS custom properties on `:root`.
-   * Values are parsed through the Tasty DSL. Supports state maps
-   * for responsive/theme-aware tokens.
-   *
-   * - `$name` keys become `--name` CSS custom properties
-   * - `#name` keys become `--name-color` and `--name-color-{colorSpace}` properties
-   *
-   * Tokens are injected once when the first style is rendered.
-   *
-   * @example
-   * ```ts
-   * configure({
-   *   tokens: {
-   *     '$gap': '4px',
-   *     '#primary': {
-   *       '': '#purple',
-   *       '@dark': '#light-purple',
-   *     },
-   *   },
-   * });
-   * ```
-   */
-  tokens?: ConfigTokens;
-  /**
-   * Predefined tokens that are replaced during style parsing (parse-time substitution).
-   * Use `$name` for custom properties and `#name` for color tokens.
-   * Values are substituted inline before CSS generation, unlike `tokens` which
-   * inject CSS custom properties on `:root`.
-   *
-   * For color tokens (#name), boolean `true` is converted to `transparent`.
-   *
-   * @example
-   * ```ts
-   * configure({
-   *   replaceTokens: {
-   *     $spacing: '2x',
-   *     '#accent': '#purple',
-   *     '#overlay': true, // → transparent
-   *   },
-   * });
-   *
-   * // Now use in styles - tokens are replaced at parse time:
-   * const Card = tasty({
-   *   styles: {
-   *     padding: '$spacing',  // → calc(2 * var(--gap))
-   *     fill: '#accent',      // → var(--purple-color)
-   *   },
-   * });
-   * ```
-   */
-  replaceTokens?: Record<`$${string}`, string | number | boolean> & Record<`#${string}`, string | number | boolean>;
-  /**
-   * Predefined style recipes -- named style bundles that can be applied via `recipe` style property.
-   * Recipe values are flat tasty styles (no sub-element keys). They may contain base styles,
-   * tokens (`$name`/`#name` definitions), local states, `@keyframes`, and `@properties`.
-   *
-   * Components reference recipes via: `recipe: 'name1 name2'` in their styles.
-   * Use `/` to separate base recipes from post recipes: `recipe: 'base1 base2 / post1'`.
-   * Use `none` to skip base recipes: `recipe: 'none / post1'`.
-   * Resolution order: `base_recipes → component styles → post_recipes`.
-   *
-   * Recipes cannot reference other recipes.
-   *
-   * @example
-   * ```ts
-   * configure({
-   *   recipes: {
-   *     card: { padding: '4x', fill: '#surface', radius: '1r', border: true },
-   *     elevated: { shadow: '2x 2x 4x #shadow' },
-   *   },
-   * });
-   *
-   * // Usage in styles:
-   * const Card = tasty({
-   *   styles: {
-   *     recipe: 'card elevated',
-   *     color: '#text', // Overrides recipe values
-   *   },
-   * });
-   * ```
-   */
-  recipes?: Record<string, RecipeStyles>;
-}
-declare const GLOBAL_INJECTOR_KEY = "__TASTY_GLOBAL_INJECTOR__";
-declare global {
-  interface Window {
-    [GLOBAL_INJECTOR_KEY]?: StyleInjector;
-  }
-  var __TASTY_GLOBAL_INJECTOR__: StyleInjector | undefined;
-}
-/**
- * Detect if we're running in a test environment
- */
-declare function isTestEnvironment(): boolean;
-/**
- * Check if styles have been generated (configuration is locked)
- */
-declare function hasStylesGenerated(): boolean;
-/**
- * Check if any global keyframes are configured.
- * Uses a pre-computed flag to avoid Object.keys() allocation on every call.
- */
-declare function hasGlobalKeyframes(): boolean;
-/**
- * Get global keyframes configuration.
- * Returns null if no keyframes configured (fast path for zero-overhead).
- */
-declare function getGlobalKeyframes(): Record<string, KeyframesSteps> | null;
-/**
- * Get global font-face configuration.
- * Returns null if no font faces configured.
- */
-declare function getGlobalFontFace(): Record<string, FontFaceInput> | null;
-/**
- * Get global counter-style configuration.
- * Returns null if no counter styles configured.
- */
-declare function getGlobalCounterStyle(): Record<string, CounterStyleDescriptors> | null;
-/**
- * Check if any global recipes are configured.
- * Fast path: returns false if no recipes were ever set.
- */
-declare function hasGlobalRecipes(): boolean;
-/**
- * Get global recipes configuration.
- * Returns null if no recipes configured (fast path for zero-overhead).
- */
-declare function getGlobalRecipes(): Record<string, RecipeStyles> | null;
-/**
- * Check if configuration is locked (styles have been generated)
- */
-declare function isConfigLocked(): boolean;
-/**
- * Configure the Tasty style system.
- *
- * Must be called BEFORE any styles are generated (before first render that uses tasty).
- * After styles are generated, configuration is locked and calls to configure() will
- * emit a warning and be ignored.
- *
- * @example
- * ```ts
- * import { configure } from '@tenphi/tasty';
- *
- * // Configure before app renders
- * configure({
- *   nonce: 'abc123',
- *   states: {
- *     '@mobile': '@media(w < 768px)',
- *     '@dark': '@root(theme=dark)',
- *   },
- * });
- * ```
- */
-declare function configure(config?: Partial<TastyConfig>): void;
-/**
- * Get the current configuration.
- * If not configured, returns default configuration.
- */
-declare function getConfig(): TastyConfig;
-/**
- * Reset configuration (for testing only).
- * Clears the global injector and allows reconfiguration.
- */
-declare function resetConfig(): void;
-//#endregion
-export { TastyConfig, configure, getConfig, getGlobalCounterStyle, getGlobalFontFace, getGlobalKeyframes, getGlobalRecipes, hasGlobalKeyframes, hasGlobalRecipes, hasStylesGenerated, isConfigLocked, isTestEnvironment, resetConfig };
-//# sourceMappingURL=config.d.ts.map