@cube-dev/ui-kit 0.0.0-canary-76be278 → 0.0.0-canary-7e4ec9d

package/es/tasty/utils/typography.js

@@ -1,67 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-76be278
- * Released under the MIT license.
- */
-
-import { TYPOGRAPHY_PRESETS } from '../../tokens/typography';
-/**
- * Generate typography tokens with $ prefix for CSS custom properties.
- *
- * Each preset generates the following CSS custom properties:
- * - `${name}-font-size`
- * - `${name}-line-height`
- * - `${name}-letter-spacing`
- * - `${name}-font-weight`
- * - `${name}-bold-font-weight` (if defined)
- * - `${name}-icon-size` (if defined)
- * - `${name}-text-transform` (if defined)
- * - `${name}-font-family` (if defined)
- * - `${name}-font-style` (if defined)
- *
- * @param presets - Typography presets object (defaults to TYPOGRAPHY_PRESETS)
- * @returns Styles object with $ prefixed keys
- *
- * @example
- * // Using default presets
- * const tokens = generateTypographyTokens();
- * // tokens['$h1-font-size'] === '36px'
- *
- * @example
- * // Using custom presets
- * const customTokens = generateTypographyTokens({
- *   myHeading: { fontSize: '24px', lineHeight: '32px', fontWeight: '700' }
- * });
- */
-export function generateTypographyTokens(presets = TYPOGRAPHY_PRESETS) {
-    const tokens = {};
-    for (const [name, preset] of Object.entries(presets)) {
-        tokens[`$${name}-font-size`] = preset.fontSize;
-        tokens[`$${name}-line-height`] = preset.lineHeight;
-        tokens[`$${name}-letter-spacing`] = preset.letterSpacing ?? '0';
-        tokens[`$${name}-font-weight`] = preset.fontWeight;
-        if (preset.boldFontWeight !== undefined) {
-            // Handle different property naming for c1 (uses font-bold-weight instead of bold-font-weight)
-            const boldKey = name === 'c1'
-                ? `$${name}-font-bold-weight`
-                : `$${name}-bold-font-weight`;
-            tokens[boldKey] = preset.boldFontWeight;
-        }
-        if (preset.iconSize !== undefined) {
-            tokens[`$${name}-icon-size`] = preset.iconSize;
-        }
-        if (preset.textTransform !== undefined) {
-            tokens[`$${name}-text-transform`] = preset.textTransform;
-        }
-        if (preset.fontFamily !== undefined) {
-            tokens[`$${name}-font-family`] = preset.fontFamily;
-        }
-        if (preset.fontStyle !== undefined) {
-            tokens[`$${name}-font-style`] = preset.fontStyle;
-        }
-    }
-    return tokens;
-}
-
-        

package/es/tasty/zero/babel.js

@@ -1,401 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-76be278
- * Released under the MIT license.
- */
-
-/**
- * Babel plugin for zero-runtime tasty static site generation.
- *
- * Transforms:
- * - `tastyStatic(styles)` → StaticStyle object { className, styles, toString() }
- * - `tastyStatic(base, styles)` → StaticStyle object with merged styles
- * - `tastyStatic(selector, styles)` → removed entirely
- *
- * Usage:
- * ```javascript
- * // babel.config.js
- * module.exports = {
- *   plugins: [
- *     ['@cube-dev/ui-kit/tasty/zero/babel', { output: 'public/tasty.css' }]
- *   ]
- * };
- * ```
- */
-import { declare } from '@babel/helper-plugin-utils';
-import * as t from '@babel/types';
-import { setGlobalPredefinedStates } from '../states';
-import { mergeStyles } from '../utils/mergeStyles';
-import { CUSTOM_UNITS, getGlobalFuncs, getGlobalParser } from '../utils/styles';
-import { CSSWriter } from './css-writer';
-import { extractStylesForSelector, extractStylesWithChunks } from './extractor';
-export default declare((api, options) => {
-    api.assertVersion(7);
-    const outputPath = options.output || 'tasty.css';
-    const config = options.config || {};
-    const devMode = config.devMode ?? false;
-    // Apply global predefined states if configured
-    if (config.states) {
-        setGlobalPredefinedStates(config.states);
-    }
-    // Apply parser configuration (merge semantics - extend, not replace)
-    const parser = getGlobalParser();
-    if (config.units) {
-        // Merge with existing units
-        const currentUnits = parser.getUnits() ?? CUSTOM_UNITS;
-        parser.setUnits({ ...currentUnits, ...config.units });
-    }
-    if (config.funcs) {
-        // Merge with existing funcs
-        const currentFuncs = getGlobalFuncs();
-        const mergedFuncs = { ...currentFuncs, ...config.funcs };
-        parser.setFuncs(mergedFuncs);
-        // Also update the global registry so customFunc() continues to work
-        Object.assign(currentFuncs, config.funcs);
-    }
-    const cssWriter = new CSSWriter(outputPath, { devMode });
-    // Global registry for cross-file references (same build)
-    const globalRegistry = {};
-    return {
-        name: 'tasty-zero',
-        pre() {
-            // Initialize per-file registry
-            this.staticStyleRegistry = {};
-            // Extract source filename for devMode comments
-            if (devMode && this.filename) {
-                // Get relative path or just filename
-                this.sourceFile = this.filename.split('/').pop() || this.filename;
-            }
-        },
-        visitor: {
-            // Remove import statements for tasty/static
-            ImportDeclaration(path) {
-                const source = path.node.source.value;
-                if (source === '@cube-dev/ui-kit/tasty/static' ||
-                    source.endsWith('/tasty/static')) {
-                    path.remove();
-                }
-            },
-            // Transform tastyStatic() calls
-            CallExpression(path, state) {
-                const callee = path.node.callee;
-                // Match tastyStatic(...) calls
-                if (!t.isIdentifier(callee, { name: 'tastyStatic' })) {
-                    return;
-                }
-                const args = path.node.arguments;
-                if (args.length === 0) {
-                    throw path.buildCodeFrameError('tastyStatic() requires at least one argument');
-                }
-                const firstArg = args[0];
-                if (t.isStringLiteral(firstArg)) {
-                    // Selector mode: tastyStatic(selector, styles)
-                    handleSelectorMode(path, args, cssWriter, state.sourceFile);
-                }
-                else if (t.isObjectExpression(firstArg)) {
-                    // Styles mode: tastyStatic(styles)
-                    handleStylesMode(path, args, cssWriter, state, globalRegistry);
-                }
-                else if (t.isIdentifier(firstArg)) {
-                    // Extension mode: tastyStatic(base, styles)
-                    handleExtensionMode(path, args, cssWriter, state, globalRegistry);
-                }
-                else {
-                    throw path.buildCodeFrameError('tastyStatic() first argument must be an object (styles), ' +
-                        'identifier (base StaticStyle), or string (selector)');
-                }
-            },
-            // Track variable declarations to register StaticStyle objects
-            VariableDeclarator(path, state) {
-                const init = path.node.init;
-                const id = path.node.id;
-                // Check if this is a StaticStyle object (has className and styles properties)
-                if (t.isIdentifier(id) &&
-                    t.isObjectExpression(init) &&
-                    isStaticStyleObject(init)) {
-                    const variableName = id.name;
-                    const styles = extractStylesFromStaticStyleObject(init, path);
-                    const className = extractClassNameFromStaticStyleObject(init);
-                    if (styles && className) {
-                        state.staticStyleRegistry[variableName] = { styles, className };
-                        globalRegistry[variableName] = { styles, className };
-                    }
-                }
-            },
-        },
-        post() {
-            // Write all collected CSS at the end of the build
-            if (cssWriter.size > 0) {
-                cssWriter.write();
-            }
-        },
-    };
-});
-/**
- * Check if an object expression looks like a StaticStyle object
- */
-function isStaticStyleObject(node) {
-    const hasClassName = node.properties.some((p) => t.isObjectProperty(p) && t.isIdentifier(p.key, { name: 'className' }));
-    const hasStyles = node.properties.some((p) => t.isObjectProperty(p) && t.isIdentifier(p.key, { name: 'styles' }));
-    return hasClassName && hasStyles;
-}
-/**
- * Extract styles object from a StaticStyle object expression
- */
-function extractStylesFromStaticStyleObject(node, path) {
-    for (const prop of node.properties) {
-        if (t.isObjectProperty(prop) &&
-            t.isIdentifier(prop.key, { name: 'styles' }) &&
-            t.isObjectExpression(prop.value)) {
-            return evaluateObjectExpression(prop.value, path);
-        }
-    }
-    return null;
-}
-/**
- * Extract className from a StaticStyle object expression
- */
-function extractClassNameFromStaticStyleObject(node) {
-    for (const prop of node.properties) {
-        if (t.isObjectProperty(prop) &&
-            t.isIdentifier(prop.key, { name: 'className' }) &&
-            t.isStringLiteral(prop.value)) {
-            return prop.value.value;
-        }
-    }
-    return null;
-}
-/**
- * Handle tastyStatic(styles) - returns StaticStyle object
- */
-function handleStylesMode(path, args, cssWriter, state, globalRegistry) {
-    const stylesArg = args[0];
-    if (!t.isObjectExpression(stylesArg)) {
-        throw path.buildCodeFrameError('tastyStatic(styles) argument must be a static object literal');
-    }
-    // Evaluate styles object at build time
-    const styles = evaluateObjectExpression(stylesArg, path);
-    // Extract styles with chunking
-    const chunks = extractStylesWithChunks(styles);
-    // Add CSS to writer (with source for devMode)
-    for (const chunk of chunks) {
-        cssWriter.add(chunk.className, chunk.css, state.sourceFile);
-    }
-    // Generate className
-    const className = chunks.length > 0 ? chunks.map((c) => c.className).join(' ') : '';
-    // Replace call with StaticStyle object
-    const staticStyleObject = createStaticStyleAST(className, styles);
-    path.replaceWith(staticStyleObject);
-    // Register if this is being assigned to a variable
-    registerIfVariableDeclaration(path, className, styles, state, globalRegistry);
-}
-/**
- * Handle tastyStatic(base, styles) - extends base with additional styles
- */
-function handleExtensionMode(path, args, cssWriter, state, globalRegistry) {
-    if (args.length < 2) {
-        throw path.buildCodeFrameError('tastyStatic(base, styles) requires two arguments');
-    }
-    const baseArg = args[0];
-    const stylesArg = args[1];
-    if (!t.isIdentifier(baseArg)) {
-        throw path.buildCodeFrameError('tastyStatic(base, styles) first argument must be an identifier');
-    }
-    if (!t.isObjectExpression(stylesArg)) {
-        throw path.buildCodeFrameError('tastyStatic(base, styles) second argument must be a static object literal');
-    }
-    const baseName = baseArg.name;
-    // Look up base styles in registry
-    const baseEntry = state.staticStyleRegistry[baseName] || globalRegistry[baseName];
-    if (!baseEntry) {
-        throw path.buildCodeFrameError(`Cannot find base StaticStyle '${baseName}'. ` +
-            'Make sure it is defined before being extended.');
-    }
-    // Evaluate override styles
-    const overrideStyles = evaluateObjectExpression(stylesArg, path);
-    // Merge styles using mergeStyles
-    const mergedStyles = mergeStyles(baseEntry.styles, overrideStyles);
-    // Extract styles with chunking
-    const chunks = extractStylesWithChunks(mergedStyles);
-    // Add CSS to writer (with source for devMode)
-    for (const chunk of chunks) {
-        cssWriter.add(chunk.className, chunk.css, state.sourceFile);
-    }
-    // Generate className
-    const className = chunks.length > 0 ? chunks.map((c) => c.className).join(' ') : '';
-    // Replace call with StaticStyle object
-    const staticStyleObject = createStaticStyleAST(className, mergedStyles);
-    path.replaceWith(staticStyleObject);
-    // Register if this is being assigned to a variable
-    registerIfVariableDeclaration(path, className, mergedStyles, state, globalRegistry);
-}
-/**
- * Handle tastyStatic(selector, styles) - removes the call entirely
- */
-function handleSelectorMode(path, args, cssWriter, sourceFile) {
-    if (args.length < 2) {
-        throw path.buildCodeFrameError('tastyStatic(selector, styles) requires two arguments');
-    }
-    const selectorArg = args[0];
-    const stylesArg = args[1];
-    if (!t.isStringLiteral(selectorArg)) {
-        throw path.buildCodeFrameError('tastyStatic(selector, styles) first argument must be a string literal');
-    }
-    if (!t.isObjectExpression(stylesArg)) {
-        throw path.buildCodeFrameError('tastyStatic(selector, styles) second argument must be a static object literal');
-    }
-    const selector = selectorArg.value;
-    const styles = evaluateObjectExpression(stylesArg, path);
-    // Extract styles for selector
-    const result = extractStylesForSelector(selector, styles);
-    // Add CSS to writer (use selector as key for deduplication, with source for devMode)
-    cssWriter.add(selector, result.css, sourceFile);
-    // Remove the entire statement
-    const parent = path.parentPath;
-    if (parent && t.isExpressionStatement(parent.node)) {
-        parent.remove();
-    }
-    else {
-        // If used in an expression context (which would be incorrect usage),
-        // replace with undefined
-        path.replaceWith(t.identifier('undefined'));
-    }
-}
-/**
- * Create a StaticStyle object AST node
- */
-function createStaticStyleAST(className, styles) {
-    return t.objectExpression([
-        t.objectProperty(t.identifier('className'), t.stringLiteral(className)),
-        t.objectProperty(t.identifier('styles'), valueToAST(styles)),
-        t.objectMethod('method', t.identifier('toString'), [], t.blockStatement([
-            t.returnStatement(t.memberExpression(t.thisExpression(), t.identifier('className'))),
-        ])),
-    ]);
-}
-/**
- * Register a StaticStyle in the registry if it's being assigned to a variable
- */
-function registerIfVariableDeclaration(path, className, styles, state, globalRegistry) {
-    const parent = path.parentPath;
-    if (parent && t.isVariableDeclarator(parent.node)) {
-        const id = parent.node.id;
-        if (t.isIdentifier(id)) {
-            const variableName = id.name;
-            state.staticStyleRegistry[variableName] = { styles, className };
-            globalRegistry[variableName] = { styles, className };
-        }
-    }
-}
-/**
- * Convert a JavaScript value to an AST node
- */
-function valueToAST(value) {
-    if (value === null) {
-        return t.nullLiteral();
-    }
-    if (value === undefined) {
-        return t.identifier('undefined');
-    }
-    if (typeof value === 'string') {
-        return t.stringLiteral(value);
-    }
-    if (typeof value === 'number') {
-        return t.numericLiteral(value);
-    }
-    if (typeof value === 'boolean') {
-        return t.booleanLiteral(value);
-    }
-    if (Array.isArray(value)) {
-        return t.arrayExpression(value.map(valueToAST));
-    }
-    if (typeof value === 'object') {
-        const properties = Object.entries(value).map(([key, val]) => t.objectProperty(/^[a-zA-Z_$][a-zA-Z0-9_$]*$/.test(key)
-            ? t.identifier(key)
-            : t.stringLiteral(key), valueToAST(val)));
-        return t.objectExpression(properties);
-    }
-    // Fallback for unsupported types
-    return t.identifier('undefined');
-}
-/**
- * Evaluate an ObjectExpression to a plain JavaScript object.
- * Only supports static values that can be determined at build time.
- */
-function evaluateObjectExpression(node, path) {
-    const result = {};
-    for (const prop of node.properties) {
-        if (t.isSpreadElement(prop)) {
-            throw path.buildCodeFrameError('Spread elements are not supported in tastyStatic() - styles must be fully static');
-        }
-        if (!t.isObjectProperty(prop)) {
-            throw path.buildCodeFrameError('Only object properties are supported in tastyStatic()');
-        }
-        // Get key
-        let key;
-        if (t.isIdentifier(prop.key)) {
-            key = prop.key.name;
-        }
-        else if (t.isStringLiteral(prop.key)) {
-            key = prop.key.value;
-        }
-        else {
-            throw path.buildCodeFrameError('Dynamic property keys are not supported in tastyStatic()');
-        }
-        // Get value
-        const value = evaluateExpression(prop.value, path);
-        result[key] = value;
-    }
-    return result;
-}
-/**
- * Evaluate an expression to a JavaScript value.
- */
-function evaluateExpression(node, path) {
-    if (t.isStringLiteral(node)) {
-        return node.value;
-    }
-    if (t.isNumericLiteral(node)) {
-        return node.value;
-    }
-    if (t.isBooleanLiteral(node)) {
-        return node.value;
-    }
-    if (t.isNullLiteral(node)) {
-        return null;
-    }
-    if (t.isIdentifier(node, { name: 'undefined' })) {
-        return undefined;
-    }
-    if (t.isArrayExpression(node)) {
-        return node.elements.map((el) => {
-            if (el === null)
-                return null;
-            if (t.isSpreadElement(el)) {
-                throw path.buildCodeFrameError('Spread elements are not supported in tastyStatic()');
-            }
-            return evaluateExpression(el, path);
-        });
-    }
-    if (t.isObjectExpression(node)) {
-        return evaluateObjectExpression(node, path);
-    }
-    if (t.isTemplateLiteral(node)) {
-        // Only support template literals without expressions
-        if (node.expressions.length > 0) {
-            throw path.buildCodeFrameError('Template literals with expressions are not supported in tastyStatic()');
-        }
-        return node.quasis.map((q) => q.value.cooked).join('');
-    }
-    if (t.isUnaryExpression(node, { operator: '-' })) {
-        const arg = evaluateExpression(node.argument, path);
-        if (typeof arg === 'number') {
-            return -arg;
-        }
-    }
-    throw path.buildCodeFrameError(`Dynamic expressions are not supported in tastyStatic() - got ${node.type}. ` +
-        'All values must be static literals.');
-}
-
-        

package/es/tasty/zero/css-writer.js

@@ -1,94 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-76be278
- * Released under the MIT license.
- */
-
-import * as fs from 'fs';
-import * as path from 'path';
-export class CSSWriter {
-    cssBlocks = new Map();
-    outputPath;
-    devMode;
-    constructor(outputPath, options = {}) {
-        this.outputPath = outputPath;
-        this.devMode = options.devMode ?? false;
-    }
-    /**
-     * Add CSS block with deduplication key
-     * @param key - Unique key for deduplication
-     * @param css - CSS content
-     * @param source - Optional source file path (used in devMode)
-     */
-    add(key, css, source) {
-        if (!this.cssBlocks.has(key)) {
-            this.cssBlocks.set(key, { css, source });
-        }
-    }
-    /**
-     * Check if a key already exists
-     */
-    has(key) {
-        return this.cssBlocks.has(key);
-    }
-    /**
-     * Get the number of CSS blocks
-     */
-    get size() {
-        return this.cssBlocks.size;
-    }
-    /**
-     * Write all collected CSS to the output file
-     */
-    write() {
-        const outputDir = path.dirname(this.outputPath);
-        // Ensure directory exists
-        if (!fs.existsSync(outputDir)) {
-            fs.mkdirSync(outputDir, { recursive: true });
-        }
-        // Combine all CSS blocks with optional source comments
-        const cssBlocks = [];
-        for (const block of this.cssBlocks.values()) {
-            if (this.devMode && block.source) {
-                cssBlocks.push(`/* from: ${block.source} */\n${block.css}`);
-            }
-            else {
-                cssBlocks.push(block.css);
-            }
-        }
-        const css = cssBlocks.join('\n\n');
-        // Add header comment
-        const header = `/* Generated by @cube-dev/ui-kit/tasty/zero - DO NOT EDIT */\n\n`;
-        fs.writeFileSync(this.outputPath, header + css);
-    }
-    /**
-     * Get all CSS as string (for testing or in-memory use)
-     */
-    getCSS() {
-        const cssBlocks = [];
-        for (const block of this.cssBlocks.values()) {
-            if (this.devMode && block.source) {
-                cssBlocks.push(`/* from: ${block.source} */\n${block.css}`);
-            }
-            else {
-                cssBlocks.push(block.css);
-            }
-        }
-        return cssBlocks.join('\n\n');
-    }
-    /**
-     * Clear all collected CSS
-     */
-    clear() {
-        this.cssBlocks.clear();
-    }
-    /**
-     * Get the output path
-     */
-    getOutputPath() {
-        return this.outputPath;
-    }
-}
-
-        

package/es/tasty/zero/extractor.js

@@ -1,75 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-76be278
- * Released under the MIT license.
- */
-
-import { createHash } from 'crypto';
-import { categorizeStyleKeys, generateChunkCacheKey, renderStylesForChunk, } from '../chunks';
-import { renderStyles } from '../pipeline';
-/**
- * Generate a deterministic className from a cache key using content hash.
- * This ensures the same styles always produce the same className,
- * regardless of build order or incremental compilation.
- */
-function generateClassName(cacheKey) {
-    const hash = createHash('md5').update(cacheKey).digest('hex').slice(0, 6);
-    return `ts${hash}`; // 'ts' prefix for "tasty-static" to distinguish from runtime 't' classes
-}
-/**
- * Extract styles using chunking (for className mode).
- * Returns multiple classes, one per chunk.
- */
-export function extractStylesWithChunks(styles) {
-    const chunks = [];
-    // Categorize style keys into chunks
-    const chunkMap = categorizeStyleKeys(styles);
-    for (const [chunkName, chunkStyleKeys] of chunkMap) {
-        if (chunkStyleKeys.length === 0)
-            continue;
-        // Generate cache key for this chunk (used for className hash)
-        const cacheKey = generateChunkCacheKey(styles, chunkName, chunkStyleKeys);
-        // Render styles for this chunk
-        const renderResult = renderStylesForChunk(styles, chunkName, chunkStyleKeys);
-        if (renderResult.rules.length === 0)
-            continue;
-        // Generate deterministic className from content hash
-        const className = generateClassName(cacheKey);
-        const selector = `.${className}.${className}`;
-        // Format CSS
-        const css = formatRulesToCSS(renderResult.rules, selector);
-        chunks.push({ className, css });
-    }
-    return chunks;
-}
-/**
- * Extract styles for a specific selector (for global/selector mode).
- * Returns a single CSS block.
- */
-export function extractStylesForSelector(selector, styles) {
-    const rules = renderStyles(styles, selector);
-    const css = formatRulesToCSS(rules, selector);
-    return { selector, css };
-}
-/**
- * Format StyleResult[] to CSS string
- */
-function formatRulesToCSS(rules, _baseSelector) {
-    return rules
-        .map((rule) => {
-        let css = `${rule.selector} { ${rule.declarations} }`;
-        // Wrap in at-rules (in reverse order for proper nesting)
-        if (rule.atRules && rule.atRules.length > 0) {
-            for (const atRule of [...rule.atRules].reverse()) {
-                css = `${atRule} {\n  ${css}\n}`;
-            }
-        }
-        return css;
-    })
-        .join('\n\n');
-}
-// Note: With hash-based className generation, counter management functions
-// are no longer needed. ClassNames are deterministic based on content.
-
-        

package/es/tasty/zero/index.js

@@ -1,28 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-76be278
- * Released under the MIT license.
- */
-
-/**
- * Zero-runtime module for programmatic use.
- *
- * For the Babel plugin, import from '@cube-dev/ui-kit/tasty/zero/babel'
- *
- * @example
- * ```typescript
- * import { extractStylesWithChunks, CSSWriter } from '@cube-dev/ui-kit/tasty/zero';
- *
- * const chunks = extractStylesWithChunks({ fill: '#blue', padding: '2x' });
- * const writer = new CSSWriter('output.css');
- * chunks.forEach(chunk => writer.add(chunk.className, chunk.css));
- * writer.write();
- * ```
- */
-// Core extraction utilities
-export { extractStylesWithChunks, extractStylesForSelector } from './extractor';
-// CSS output utilities
-export { CSSWriter } from './css-writer';
-
-