@allternit/ix 0.1.0 → 0.1.1

package/dist/pipeline/llm-to-ix.js.bak

@@ -1,992 +0,0 @@
-/**
- * LLM-to-IX Pipeline
- *
- * Converts LLM-generated UI descriptions to A2R-IX format.
- *
- * Supports multiple input formats:
- * - Natural language descriptions
- * - Vercel Labs json-render
- * - JSX-like pseudo-code
- * - Raw component trees
- * - Markdown UI descriptions
- *
- * @example
- * ```typescript
- * import { llmToIxPipeline } from '@allternit/ix/pipeline';
- *
- * const result = llmToIxPipeline({
- *   input: llmOutput,
- *   options: {
- *     applyStyling: true,
- *     theme: 'default',
- *     generateIds: true,
- *   }
- * });
- *
- * console.log(result.tree); // IxRenderTree
- * ```
- */
-import { jsonRenderAdapter } from '../adapters/json-render';
-/**
- * Convert LLM output to A2R-IX
- */
-export function convertLLMToIX(input, options = {}) {
-    const warnings = [];
-    const inferredState = [];
-    // Detect input format
-    const format = detectInputFormat(input);
-    switch (format) {
-        case 'json-render':
-            return convertFromJsonRender(input, options);
-        case 'jsx-like':
-            return convertFromJSXLike(input, options);
-        case 'component-tree':
-            return convertFromComponentTree(input, options);
-        case 'natural-language':
-            return convertFromNaturalLanguage(input, options);
-        default:
-            warnings.push('Unknown input format, attempting generic conversion');
-            return convertGeneric(input, options);
-    }
-}
-/**
- * Detect input format
- */
-function detectInputFormat(input) {
-    if (!input)
-        return 'unknown';
-    // Check for json-render
-    if (jsonRenderAdapter.isValidSchema(input)) {
-        return 'json-render';
-    }
-    // Check for JSX-like (string with JSX syntax)
-    if (typeof input === 'string') {
-        const trimmed = input.trim();
-        if (trimmed.startsWith('<') && trimmed.endsWith('>')) {
-            return 'jsx-like';
-        }
-        if (trimmed.length >= 40 && !trimmed.startsWith('{')) {
-            return 'natural-language';
-        }
-    }
-    // Check for component tree object (including empty object)
-    if (typeof input === 'object' && input !== null && !Array.isArray(input)) {
-        const obj = input;
-        if (obj.components || obj.type || obj.root || Object.keys(obj).length === 0) {
-            return 'component-tree';
-        }
-    }
-    return 'unknown';
-}
-/**
- * Convert from json-render format
- */
-function convertFromJsonRender(schema, options) {
-    const warnings = [];
-    const inferredState = [];
-    const ui = jsonRenderAdapter.fromJsonRender(schema);
-    // Add IDs if needed
-    if (options.generateIds) {
-        addComponentIds(ui.components);
-    }
-    // Infer state from bindings
-    if (options.inferState) {
-        inferStateFromBindings(ui, inferredState);
-    }
-    return {
-        ui,
-        warnings,
-        inferredState,
-        confidence: 0.95,
-    };
-}
-/**
- * Convert from JSX-like string
- */
-function convertFromJSXLike(jsxString, options) {
-    const warnings = [];
-    const inferredState = [];
-    try {
-        const parsed = parseJSXLike(jsxString);
-        // Check if parsing produced any components
-        if (parsed.length === 0) {
-            warnings.push('No valid JSX components found');
-            return {
-                ui: createEmptyUI(options.version),
-                warnings,
-                inferredState,
-                confidence: 0.3,
-            };
-        }
-        const components = parsed.map((node) => jsxNodeToComponent(node));
-        const ui = {
-            version: options.version || '1.0.0',
-            components,
-            state: { variables: [] },
-            actions: [],
-        };
-        // Infer state
-        if (options.inferState) {
-            inferStateFromBindings(ui, inferredState);
-        }
-        return {
-            ui,
-            warnings,
-            inferredState,
-            confidence: 0.85,
-        };
-    }
-    catch (error) {
-        warnings.push(`Failed to parse JSX: ${error}`);
-        return {
-            ui: createEmptyUI(options.version),
-            warnings,
-            inferredState,
-            confidence: 0.3,
-        };
-    }
-}
-/**
- * Parse JSX-like string to AST
- */
-function parseJSXLike(jsx) {
-    // Simple JSX parser - in production, use a proper parser
-    const nodes = [];
-    const tagRegex = /<(\w+)([^>]*)>([\s\S]*?)<\/\1>|<(\w+)([^>]*)\/>/g;
-    let match;
-    while ((match = tagRegex.exec(jsx)) !== null) {
-        const type = (match[1] || match[4]) ?? 'div';
-        const propsString = match[2] || match[5] || '';
-        const children = match[3]?.trim();
-        const props = parseProps(propsString);
-        const childNodes = children ? parseJSXLike(children) : [];
-        nodes.push({
-            type,
-            props,
-            children: childNodes,
-            text: childNodes.length === 0 ? children : undefined,
-        });
-    }
-    return nodes;
-}
-/**
- * Parse props string
- */
-function parseProps(propsString) {
-    const props = {};
-    // Support $ prefix for bindings: $value={path}
-    const propRegex = /(\$?\w+)={([^}]*)}|(\$?\w+)="([^"]*)"|(\$?\w+)='([^']*)'|(\$?\w+)/g;
-    let match;
-    while ((match = propRegex.exec(propsString)) !== null) {
-        const key = (match[1] || match[3] || match[5] || match[7]) ?? '';
-        if (!key)
-            continue;
-        let value = true; // Boolean prop
-        if (match[2]) {
-            // Expression: prop={value}
-            try {
-                value = JSON.parse(match[2]);
-            }
-            catch {
-                value = match[2]; // Raw string for expressions like user.name
-            }
-        }
-        else if (match[4]) {
-            // Double quoted: prop="value"
-            value = match[4];
-        }
-        else if (match[6]) {
-            // Single quoted: prop='value'
-            value = match[6];
-        }
-        props[key] = value;
-    }
-    return props;
-}
-/**
- * Convert JSX node to UIComponent
- */
-function jsxNodeToComponent(node, parentId = 'root') {
-    const id = generateId();
-    const component = {
-        id,
-        type: node.type,
-        props: {},
-    };
-    // Process props
-    const bindings = [];
-    const events = [];
-    for (const [key, value] of Object.entries(node.props)) {
-        // Check for binding (starts with $)
-        if (key.startsWith('$')) {
-            const propName = key.slice(1);
-            // Handle both string values and object expressions
-            const statePath = typeof value === 'string'
-                ? value
-                : value?.$expr || String(value);
-            bindings.push({
-                prop: propName,
-                statePath,
-                direction: 'one-way',
-            });
-        }
-        // Check for event handler
-        else if (key.startsWith('on')) {
-            events.push({
-                event: key,
-                action: value,
-            });
-        }
-        // Regular prop
-        else {
-            component.props[key] = value;
-        }
-    }
-    if (bindings.length > 0) {
-        component.bindings = bindings;
-    }
-    if (events.length > 0) {
-        component.events = events;
-    }
-    // Process children
-    if (node.children.length > 0) {
-        component.children = node.children.map((child) => jsxNodeToComponent(child, id));
-    }
-    else if (node.text) {
-        component.props.children = node.text;
-    }
-    return component;
-}
-/**
- * Convert from component tree object
- */
-function convertFromComponentTree(tree, options) {
-    const warnings = [];
-    const inferredState = [];
-    try {
-        // Handle empty object
-        if (Object.keys(tree).length === 0) {
-            return {
-                ui: createEmptyUI(options.version),
-                warnings: ['Empty input provided'],
-                inferredState,
-                confidence: 0.1,
-            };
-        }
-        const components = tree.components
-            ? tree.components.map((c) => convertTreeNode(c))
-            : tree.type
-                ? [convertTreeNode(tree)]
-                : [];
-        const ui = {
-            version: options.version || '1.0.0',
-            components,
-            state: { variables: [] },
-            actions: [],
-        };
-        return {
-            ui,
-            warnings,
-            inferredState,
-            confidence: 0.8,
-        };
-    }
-    catch (error) {
-        warnings.push(`Failed to convert tree: ${error}`);
-        return {
-            ui: createEmptyUI(options.version),
-            warnings,
-            inferredState,
-            confidence: 0.4,
-        };
-    }
-}
-/**
- * Convert tree node to component
- */
-function convertTreeNode(node) {
-    const component = {
-        id: generateId(),
-        type: node.type || 'Box',
-        props: node.props || {},
-    };
-    if (node.children) {
-        component.children = node.children.map((c) => convertTreeNode(c));
-    }
-    if (node.bindings) {
-        component.bindings = node.bindings;
-    }
-    if (node.events) {
-        component.events = node.events;
-    }
-    return component;
-}
-/**
- * Convert from natural language
- */
-function convertFromNaturalLanguage(description, options) {
-    const warnings = [];
-    const inferredState = [];
-    warnings.push('Natural language conversion requires LLM assistance');
-    // This would typically call an LLM to generate the UI
-    // For now, return a placeholder
-    const ui = {
-        version: options.version || '1.0.0',
-        components: [
-            {
-                id: generateId(),
-                type: 'Text',
-                props: { children: 'Natural language conversion not yet implemented' },
-            },
-        ],
-        state: { variables: [] },
-        actions: [],
-    };
-    return {
-        ui,
-        warnings,
-        inferredState,
-        confidence: 0.1,
-    };
-}
-/**
- * Generic conversion fallback
- */
-function convertGeneric(input, options) {
-    const warnings = ['Using generic conversion'];
-    const inferredState = [];
-    // Try to coerce to component structure
-    let components = [];
-    if (Array.isArray(input)) {
-        components = input.map((item, i) => ({
-            id: `comp-${i}`,
-            type: item?.type || 'Box',
-            props: item?.props || {},
-        }));
-    }
-    else if (typeof input === 'object' && input !== null) {
-        components = [{
-                id: generateId(),
-                type: input.type || 'Box',
-                props: input.props || {},
-            }];
-    }
-    const ui = {
-        version: options.version || '1.0.0',
-        components,
-        state: { variables: [] },
-        actions: [],
-    };
-    return {
-        ui,
-        warnings,
-        inferredState,
-        confidence: 0.5,
-    };
-}
-/**
- * Add component IDs
- */
-function addComponentIds(components, prefix = 'comp') {
-    components.forEach((comp, i) => {
-        if (!comp.id) {
-            comp.id = `${prefix}-${i}`;
-        }
-        if (comp.children) {
-            addComponentIds(comp.children, comp.id);
-        }
-    });
-}
-/**
- * Infer state from bindings
- */
-function inferStateFromBindings(ui, inferredState) {
-    const statePaths = new Set();
-    function scanComponent(comp) {
-        comp.bindings?.forEach((binding) => {
-            statePaths.add(binding.statePath);
-        });
-        comp.children?.forEach(scanComponent);
-    }
-    ui.components.forEach(scanComponent);
-    statePaths.forEach((path) => {
-        const existing = ui.state.variables.find((v) => v.path === path);
-        if (!existing) {
-            inferredState.push({
-                path,
-                type: 'any',
-            });
-        }
-    });
-}
-/**
- * Generate unique ID
- */
-function generateId() {
-    return `comp_${Math.random().toString(36).substr(2, 9)}`;
-}
-/**
- * Create empty UI
- */
-function createEmptyUI(version) {
-    return {
-        version: version || '1.0.0',
-        components: [],
-        state: { variables: [] },
-        actions: [],
-    };
-}
-/**
- * A2R-IX Built-in Themes
- */
-const IX_THEMES = {
-    default: {
-        name: 'default',
-        colors: {
-            primary: '#3B82F6',
-            secondary: '#6B7280',
-            success: '#10B981',
-            warning: '#F59E0B',
-            error: '#EF4444',
-            background: '#FFFFFF',
-            surface: '#F9FAFB',
-            text: '#111827',
-            textMuted: '#6B7280',
-            border: '#E5E7EB',
-        },
-        spacing: {
-            xs: 4,
-            sm: 8,
-            md: 16,
-            lg: 24,
-            xl: 32,
-        },
-        typography: {
-            fontFamily: 'system-ui, -apple-system, sans-serif',
-            fontSize: {
-                xs: '12px',
-                sm: '14px',
-                md: '16px',
-                lg: '18px',
-                xl: '24px',
-            },
-            fontWeight: {
-                normal: 400,
-                medium: 500,
-                semibold: 600,
-                bold: 700,
-            },
-        },
-        borderRadius: {
-            sm: 4,
-            md: 8,
-            lg: 12,
-            full: 9999,
-        },
-        shadows: {
-            sm: '0 1px 2px rgba(0, 0, 0, 0.05)',
-            md: '0 4px 6px rgba(0, 0, 0, 0.1)',
-            lg: '0 10px 15px rgba(0, 0, 0, 0.1)',
-        },
-    },
-    minimal: {
-        name: 'minimal',
-        colors: {
-            primary: '#000000',
-            secondary: '#666666',
-            success: '#00AA00',
-            warning: '#FFAA00',
-            error: '#FF0000',
-            background: '#FFFFFF',
-            surface: '#FFFFFF',
-            text: '#000000',
-            textMuted: '#666666',
-            border: '#DDDDDD',
-        },
-        spacing: {
-            xs: 4,
-            sm: 8,
-            md: 12,
-            lg: 16,
-            xl: 24,
-        },
-        typography: {
-            fontFamily: 'system-ui, -apple-system, sans-serif',
-            fontSize: {
-                xs: '11px',
-                sm: '13px',
-                md: '15px',
-                lg: '17px',
-                xl: '22px',
-            },
-            fontWeight: {
-                normal: 400,
-                medium: 500,
-                semibold: 600,
-                bold: 700,
-            },
-        },
-        borderRadius: {
-            sm: 0,
-            md: 0,
-            lg: 0,
-            full: 9999,
-        },
-        shadows: {
-            sm: 'none',
-            md: 'none',
-            lg: 'none',
-        },
-    },
-    compact: {
-        name: 'compact',
-        colors: {
-            primary: '#2563EB',
-            secondary: '#475569',
-            success: '#059669',
-            warning: '#D97706',
-            error: '#DC2626',
-            background: '#FAFAFA',
-            surface: '#FFFFFF',
-            text: '#18181B',
-            textMuted: '#71717A',
-            border: '#E4E4E7',
-        },
-        spacing: {
-            xs: 2,
-            sm: 4,
-            md: 8,
-            lg: 12,
-            xl: 16,
-        },
-        typography: {
-            fontFamily: 'system-ui, -apple-system, sans-serif',
-            fontSize: {
-                xs: '10px',
-                sm: '12px',
-                md: '14px',
-                lg: '16px',
-                xl: '20px',
-            },
-            fontWeight: {
-                normal: 400,
-                medium: 500,
-                semibold: 600,
-                bold: 700,
-            },
-        },
-        borderRadius: {
-            sm: 2,
-            md: 4,
-            lg: 6,
-            full: 9999,
-        },
-        shadows: {
-            sm: '0 1px 1px rgba(0, 0, 0, 0.03)',
-            md: '0 2px 4px rgba(0, 0, 0, 0.06)',
-            lg: '0 4px 8px rgba(0, 0, 0, 0.08)',
-        },
-    },
-};
-/**
- * Get theme by name or return custom theme
- */
-function getTheme(theme) {
-    if (typeof theme === 'string') {
-        return IX_THEMES[theme] || IX_THEMES.default;
-    }
-    return theme;
-}
-/**
- * Apply A2R-IX styling to component tree
- */
-function applyStylingToTree(components, theme) {
-    return components.map((comp) => applyStylingToNode(comp, theme));
-}
-/**
- * Apply A2R-IX styling to a single node
- */
-function applyStylingToNode(comp, theme) {
-    const baseStyle = {};
-    let className = '';
-    // Apply component-specific default styles based on type
-    const componentType = comp.type.toLowerCase();
-    // Layout components
-    if (componentType === 'box' || componentType === 'stack' || componentType === 'flex') {
-        baseStyle.display = 'flex';
-        baseStyle.flexDirection = comp.props.flexDirection || 'column';
-        baseStyle.gap = theme.spacing.sm;
-        baseStyle.padding = theme.spacing.md;
-    }
-    if (componentType === 'stack') {
-        const direction = comp.props.direction;
-        baseStyle.flexDirection = direction === 'horizontal' ? 'row' : 'column';
-        baseStyle.alignItems = comp.props.align || 'stretch';
-        baseStyle.justifyContent = comp.props.justify || 'flex-start';
-        baseStyle.gap = comp.props.spacing || theme.spacing.sm;
-    }
-    // Typography components
-    if (componentType === 'text') {
-        baseStyle.fontSize = getFontSize(comp.props.variant, theme);
-        baseStyle.color = theme.colors.text;
-        baseStyle.fontFamily = theme.typography.fontFamily;
-        baseStyle.lineHeight = 1.5;
-    }
-    if (componentType === 'heading') {
-        const level = comp.props.level || 1;
-        baseStyle.fontSize = level === 1 ? theme.typography.fontSize.xl :
-            level === 2 ? theme.typography.fontSize.lg :
-                theme.typography.fontSize.md;
-        baseStyle.fontWeight = theme.typography.fontWeight.semibold;
-        baseStyle.color = theme.colors.text;
-        baseStyle.marginBottom = theme.spacing.md;
-    }
-    if (componentType === 'paragraph') {
-        baseStyle.fontSize = theme.typography.fontSize.md;
-        baseStyle.color = theme.colors.text;
-        baseStyle.lineHeight = 1.6;
-        baseStyle.marginBottom = theme.spacing.md;
-    }
-    // Input components
-    if (componentType === 'button') {
-        const variant = comp.props.variant || 'primary';
-        baseStyle.padding = `${theme.spacing.sm} ${theme.spacing.md}`;
-        baseStyle.borderRadius = theme.borderRadius.md;
-        baseStyle.fontSize = theme.typography.fontSize.sm;
-        baseStyle.fontWeight = theme.typography.fontWeight.medium;
-        baseStyle.cursor = 'pointer';
-        baseStyle.border = 'none';
-        baseStyle.transition = 'all 0.2s ease';
-        if (variant === 'primary') {
-            baseStyle.backgroundColor = theme.colors.primary;
-            baseStyle.color = '#FFFFFF';
-        }
-        else if (variant === 'secondary') {
-            baseStyle.backgroundColor = theme.colors.surface;
-            baseStyle.color = theme.colors.text;
-            baseStyle.border = `1px solid ${theme.colors.border}`;
-        }
-        else if (variant === 'ghost') {
-            baseStyle.backgroundColor = 'transparent';
-            baseStyle.color = theme.colors.primary;
-        }
-        else if (variant === 'danger') {
-            baseStyle.backgroundColor = theme.colors.error;
-            baseStyle.color = '#FFFFFF';
-        }
-    }
-    if (componentType === 'input' || componentType === 'textarea') {
-        baseStyle.padding = `${theme.spacing.sm} ${theme.spacing.md}`;
-        baseStyle.borderRadius = theme.borderRadius.md;
-        baseStyle.border = `1px solid ${theme.colors.border}`;
-        baseStyle.fontSize = theme.typography.fontSize.sm;
-        baseStyle.fontFamily = theme.typography.fontFamily;
-        baseStyle.outline = 'none';
-        baseStyle.transition = 'border-color 0.2s ease';
-        baseStyle.width = '100%';
-        baseStyle.boxSizing = 'border-box';
-    }
-    // Display components
-    if (componentType === 'card') {
-        baseStyle.backgroundColor = theme.colors.surface;
-        baseStyle.borderRadius = comp.props.borderRadius !== undefined
-            ? `${comp.props.borderRadius}px`
-            : `${theme.borderRadius.lg}px`;
-        baseStyle.padding = comp.props.padding !== undefined
-            ? `${comp.props.padding}px`
-            : `${theme.spacing.lg}px`;
-        const elevation = comp.props.elevation || 1;
-        baseStyle.boxShadow = elevation === 0 ? 'none' :
-            elevation === 1 ? theme.shadows.sm :
-                elevation === 2 ? theme.shadows.md :
-                    theme.shadows.lg;
-    }
-    if (componentType === 'badge') {
-        const variant = comp.props.variant || 'default';
-        baseStyle.display = 'inline-flex';
-        baseStyle.alignItems = 'center';
-        baseStyle.padding = `${theme.spacing.xs} ${theme.spacing.sm}`;
-        baseStyle.borderRadius = theme.borderRadius.full;
-        baseStyle.fontSize = theme.typography.fontSize.xs;
-        baseStyle.fontWeight = theme.typography.fontWeight.medium;
-        const variantColors = {
-            default: { bg: theme.colors.surface, color: theme.colors.text },
-            success: { bg: '#D1FAE5', color: '#065F46' },
-            warning: { bg: '#FEF3C7', color: '#92400E' },
-            error: { bg: '#FEE2E2', color: '#991B1B' },
-            info: { bg: '#DBEAFE', color: '#1E40AF' },
-        };
-        const colors = variantColors[variant] || variantColors.default;
-        baseStyle.backgroundColor = colors.bg;
-        baseStyle.color = colors.color;
-    }
-    if (componentType === 'image') {
-        baseStyle.maxWidth = '100%';
-        baseStyle.height = 'auto';
-        baseStyle.objectFit = comp.props.objectFit || 'cover';
-        baseStyle.borderRadius = theme.borderRadius.md;
-    }
-    // Merge with component-specific styles
-    const mergedStyle = { ...baseStyle, ...(comp.style || {}) };
-    // Handle style props
-    if (comp.props.backgroundColor) {
-        mergedStyle.backgroundColor = comp.props.backgroundColor;
-    }
-    if (comp.props.borderRadius) {
-        mergedStyle.borderRadius = `${comp.props.borderRadius}px`;
-    }
-    if (comp.props.padding) {
-        mergedStyle.padding = `${comp.props.padding}px`;
-    }
-    if (comp.props.margin) {
-        mergedStyle.margin = `${comp.props.margin}px`;
-    }
-    if (comp.props.width) {
-        mergedStyle.width = comp.props.width;
-    }
-    if (comp.props.height) {
-        mergedStyle.height = comp.props.height;
-    }
-    // Build className from props
-    const classNameParts = [];
-    if (comp.props.className) {
-        classNameParts.push(comp.props.className);
-    }
-    className = classNameParts.join(' ') || undefined;
-    // Process children
-    const children = comp.children
-        ? comp.children.map((child) => applyStylingToNode(child, theme))
-        : undefined;
-    return {
-        id: comp.id,
-        type: comp.type,
-        props: comp.props,
-        style: mergedStyle,
-        className,
-        children,
-        bindings: comp.bindings,
-        events: comp.events,
-        condition: comp.condition,
-        repeat: comp.repeat,
-    };
-}
-/**
- * Get font size based on variant
- */
-function getFontSize(variant, theme) {
-    if (!variant)
-        return theme.typography.fontSize.md;
-    const sizeMap = {
-        heading: theme.typography.fontSize.lg,
-        body: theme.typography.fontSize.md,
-        caption: theme.typography.fontSize.xs,
-        label: theme.typography.fontSize.sm,
-    };
-    return sizeMap[variant] || theme.typography.fontSize.md;
-}
-/**
- * Parse markdown UI description to component tree
- */
-function parseMarkdownToComponents(markdown) {
-    const components = [];
-    const lines = markdown.split('\n').filter((line) => line.trim());
-    const currentList = null;
-    const listItems = [];
-    for (const line of lines) {
-        const trimmed = line.trim();
-        // Heading
-        if (trimmed.startsWith('#')) {
-            const level = trimmed.match(/^#+/)?.[0].length || 1;
-            const text = trimmed.replace(/^#+\s*/, '');
-            components.push({
-                id: generateId(),
-                type: 'Heading',
-                props: { level, children: text },
-            });
-        }
-        // Paragraph
-        else if (!trimmed.startsWith('-') && !trimmed.startsWith('*') && !trimmed.startsWith('>')) {
-            components.push({
-                id: generateId(),
-                type: 'Text',
-                props: { children: trimmed, variant: 'body' },
-            });
-        }
-        // List item
-        else if (trimmed.startsWith('-') || trimmed.startsWith('*')) {
-            const text = trimmed.replace(/^[-*]\s*/, '');
-            listItems.push({
-                id: generateId(),
-                type: 'Text',
-                props: { children: text },
-            });
-        }
-        // Blockquote
-        else if (trimmed.startsWith('>')) {
-            const text = trimmed.replace(/^>\s*/, '');
-            components.push({
-                id: generateId(),
-                type: 'Text',
-                props: { children: text, variant: 'caption', style: { fontStyle: 'italic', borderLeft: '3px solid #E5E7EB', paddingLeft: '12px' } },
-            });
-        }
-    }
-    // If we have list items, wrap them in a Stack
-    if (listItems.length > 0) {
-        components.push({
-            id: generateId(),
-            type: 'Stack',
-            props: { direction: 'vertical', spacing: 4 },
-            children: listItems,
-        });
-    }
-    return components;
-}
-/**
- * LLM-to-IX Pipeline
- *
- * Main pipeline function that:
- * 1. Parses LLM output (JSON or markdown)
- * 2. Transforms to IX component tree
- * 3. Applies A2R-IX styling
- * 4. Returns IxRenderTree
- */
-export function llmToIxPipeline(options) {
-    const startTime = Date.now();
-    const pipelineOptions = options.options || {};
-    // Parse input
-    const parseStart = Date.now();
-    const format = detectInputFormat(options.input);
-    let convertResult;
-    // Handle markdown input
-    if (format === 'natural-language' && typeof options.input === 'string') {
-        // Check if it looks like markdown
-        if (options.input.includes('#') || options.input.includes('- ') || options.input.includes('> ')) {
-            const components = parseMarkdownToComponents(options.input);
-            const ui = {
-                version: pipelineOptions.version || '1.0.0',
-                components,
-                state: { variables: [] },
-                actions: [],
-            };
-            convertResult = {
-                ui,
-                warnings: ['Parsed from markdown'],
-                inferredState: [],
-                confidence: 0.7,
-            };
-        }
-        else {
-            convertResult = convertFromNaturalLanguage(options.input, {
-                version: pipelineOptions.version,
-                generateIds: pipelineOptions.generateIds,
-                validate: pipelineOptions.validate,
-                inferState: pipelineOptions.inferState,
-            });
-        }
-    }
-    else {
-        convertResult = convertLLMToIX(options.input, {
-            version: pipelineOptions.version,
-            generateIds: pipelineOptions.generateIds,
-            validate: pipelineOptions.validate,
-            inferState: pipelineOptions.inferState,
-        });
-    }
-    const parseTime = Date.now() - parseStart;
-    // Transform to render tree
-    const transformStart = Date.now();
-    const theme = pipelineOptions.theme ? getTheme(pipelineOptions.theme) : IX_THEMES.default;
-    const styledComponents = pipelineOptions.applyStyling !== false
-        ? applyStylingToTree(convertResult.ui.components, theme)
-        : convertResult.ui.components.map((comp) => ({
-            id: comp.id,
-            type: comp.type,
-            props: comp.props,
-            style: comp.style || {},
-            className: comp.className,
-            children: comp.children?.map((child) => ({
-                id: child.id,
-                type: child.type,
-                props: child.props,
-                style: child.style || {},
-                className: child.className,
-                children: child.children?.map((c) => ({
-                    id: c.id,
-                    type: c.type,
-                    props: c.props,
-                    style: c.style || {},
-                    className: c.className,
-                })),
-                bindings: child.bindings,
-                events: child.events,
-            })),
-            bindings: comp.bindings,
-            events: comp.events,
-            condition: comp.condition,
-            repeat: comp.repeat,
-        }));
-    const transformTime = Date.now() - transformStart;
-    // Apply styling
-    const styleStart = Date.now();
-    const styles = {};
-    if (pipelineOptions.applyStyling !== false) {
-        // Generate CSS classes for components
-        styledComponents.forEach((comp) => {
-            styles[comp.id] = comp.style;
-        });
-    }
-    const styleTime = Date.now() - styleStart;
-    const totalTime = Date.now() - startTime;
-    // Build render tree
-    const tree = {
-        version: convertResult.ui.version,
-        components: styledComponents,
-        state: convertResult.ui.state,
-        actions: convertResult.ui.actions,
-        theme: pipelineOptions.applyStyling !== false ? theme : undefined,
-        styles: pipelineOptions.applyStyling !== false ? styles : undefined,
-        metadata: {
-            generatedAt: new Date().toISOString(),
-        },
-    };
-    return {
-        tree,
-        uiRoot: convertResult.ui,
-        warnings: convertResult.warnings,
-        inferredState: convertResult.inferredState,
-        confidence: convertResult.confidence,
-        metrics: {
-            parseTime,
-            transformTime,
-            styleTime,
-            totalTime,
-        },
-    };
-}
-/**
- * LLM-to-IX Pipeline API
- */
-export const llmToIX = {
-    /**
-     * Convert LLM output to IX format
-     */
-    convert: convertLLMToIX,
-    /**
-     * Detect input format
-     */
-    detectFormat: detectInputFormat,
-    /**
-     * Check if input is valid json-render
-     */
-    isJsonRender: (input) => jsonRenderAdapter.isValidSchema(input),
-    /**
-     * Quick convert from json-render
-     */
-    fromJsonRender: (schema, options) => convertFromJsonRender(schema, options || {}),
-    /**
-     * Quick convert from JSX-like
-     */
-    fromJSX: (jsx, options) => convertFromJSXLike(jsx, options || {}),
-};
-//# sourceMappingURL=llm-to-ix.js.map