codexmate 0.0.19 → 0.0.21

package/web-ui/source-bundle.cjs

@@ -0,0 +1,233 @@
+const fs = require('fs');
+const path = require('path');
+
+const HTML_INCLUDE_RE = /^[ \t]*<!--\s*@include\s+(.+?)\s*-->\s*$/gm;
+const CSS_IMPORT_RE = /^[ \t]*@import\s+(?:url\(\s*)?(['"]?)([^'")]+)\1\s*\)?\s*;/gm;
+const JS_IMPORT_RE = /(?:^|\n)\s*import\s+(?:[\s\S]*?\s+from\s+)?['"](\.[^'"]+)['"]\s*;?/g;
+const JS_EXPORT_FROM_RE = /(?:^|\n)\s*export\s+\*\s+from\s+['"](\.[^'"]+)['"]\s*;?/g;
+const JS_RELATIVE_IMPORT_STATEMENT_RE = /(^|\n)([ \t]*)import\s+([\s\S]*?)\s+from\s+['"](\.[^'"]+)['"]\s*;?[ \t]*/g;
+const IDENTIFIER_RE = /^[A-Za-z_$][\w$]*$/;
+
+function stripBom(content) {
+    return content.replace(/^\uFEFF/, '');
+}
+
+function readUtf8Text(filePath) {
+    return stripBom(fs.readFileSync(filePath, 'utf8').replace(/\r\n?/g, '\n'));
+}
+
+function normalizeIncludeTarget(rawTarget) {
+    const trimmed = String(rawTarget || '').trim();
+    if (!trimmed) return '';
+    return trimmed.replace(/^['"]|['"]$/g, '');
+}
+
+function assertNoCircularDependency(filePath, stack) {
+    if (!stack.includes(filePath)) {
+        return;
+    }
+    const cycle = [...stack, filePath]
+        .map(item => path.relative(path.join(__dirname, '..'), item))
+        .join(' -> ');
+    throw new Error(`Detected circular source include: ${cycle}`);
+}
+
+function bundleHtmlFile(filePath, stack = []) {
+    assertNoCircularDependency(filePath, stack);
+    const source = readUtf8Text(filePath);
+    return source.replace(HTML_INCLUDE_RE, (_match, rawTarget) => {
+        const target = normalizeIncludeTarget(rawTarget);
+        if (!target) {
+            return '';
+        }
+        const targetPath = path.resolve(path.dirname(filePath), target);
+        return bundleHtmlFile(targetPath, [...stack, filePath]);
+    });
+}
+
+function bundleCssFile(filePath, stack = []) {
+    assertNoCircularDependency(filePath, stack);
+    const source = readUtf8Text(filePath);
+    return source.replace(CSS_IMPORT_RE, (match, _quote, rawTarget) => {
+        const target = normalizeIncludeTarget(rawTarget);
+        if (!target || !target.startsWith('.')) {
+            return match;
+        }
+        const targetPath = path.resolve(path.dirname(filePath), target);
+        return bundleCssFile(targetPath, [...stack, filePath]);
+    });
+}
+
+function resolveJavaScriptDependencies(filePath) {
+    const source = readUtf8Text(filePath);
+    const dependencies = [];
+    for (const pattern of [JS_IMPORT_RE, JS_EXPORT_FROM_RE]) {
+        let match = pattern.exec(source);
+        while (match) {
+            const target = normalizeIncludeTarget(match[1]);
+            if (target.startsWith('.')) {
+                dependencies.push(path.resolve(path.dirname(filePath), target));
+            }
+            match = pattern.exec(source);
+        }
+        pattern.lastIndex = 0;
+    }
+    return dependencies;
+}
+
+function bundleJavaScriptFile(filePath, visited = new Set()) {
+    if (visited.has(filePath)) {
+        return '';
+    }
+    visited.add(filePath);
+
+    const relativePath = path.relative(path.join(__dirname, '..'), filePath).replace(/\\/g, '/');
+    const source = readUtf8Text(filePath);
+    const chunks = [
+        `// ===== FILE: ${relativePath} =====`,
+        source.trimEnd(),
+        ''
+    ];
+
+    for (const dependencyPath of resolveJavaScriptDependencies(filePath)) {
+        chunks.push(bundleJavaScriptFile(dependencyPath, visited).trimEnd());
+        chunks.push('');
+    }
+
+    return chunks.join('\n').trimEnd() + '\n';
+}
+
+function collectJavaScriptFiles(filePath, ordered = [], visited = new Set(), stack = []) {
+    assertNoCircularDependency(filePath, stack);
+    if (visited.has(filePath)) {
+        return ordered;
+    }
+    visited.add(filePath);
+    for (const dependencyPath of resolveJavaScriptDependencies(filePath)) {
+        collectJavaScriptFiles(dependencyPath, ordered, visited, [...stack, filePath]);
+    }
+    ordered.push(filePath);
+    return ordered;
+}
+
+function splitCommaSeparatedSpecifiers(source) {
+    const items = [];
+    let current = '';
+    let depth = 0;
+    for (let i = 0; i < source.length; i += 1) {
+        const ch = source[i];
+        if (ch === '{' || ch === '[' || ch === '(') {
+            depth += 1;
+        } else if (ch === '}' || ch === ']' || ch === ')') {
+            depth = Math.max(0, depth - 1);
+        }
+        if (ch === ',' && depth === 0) {
+            items.push(current);
+            current = '';
+            continue;
+        }
+        current += ch;
+    }
+    if (current) {
+        items.push(current);
+    }
+    return items.map(item => item.trim()).filter(Boolean);
+}
+
+function buildRelativeImportAliasStatements(importClause, filePath) {
+    const clause = String(importClause || '').trim();
+    if (!clause) {
+        return '';
+    }
+    if (!clause.startsWith('{') || !clause.endsWith('}')) {
+        throw new Error(`Unsupported executable bundle import in ${filePath}: ${clause}`);
+    }
+
+    const innerClause = clause.slice(1, -1).trim();
+    if (!innerClause) {
+        return '';
+    }
+
+    const statements = [];
+    for (const specifier of splitCommaSeparatedSpecifiers(innerClause)) {
+        const parts = specifier.split(/\s+as\s+/);
+        const imported = String(parts[0] || '').trim();
+        const local = String(parts[1] || imported).trim();
+        if (!IDENTIFIER_RE.test(imported) || !IDENTIFIER_RE.test(local)) {
+            throw new Error(`Unsupported executable bundle import specifier in ${filePath}: ${specifier}`);
+        }
+        if (local !== imported) {
+            statements.push(`const ${local} = ${imported};`);
+        }
+    }
+    return statements.join('\n');
+}
+
+function transformJavaScriptModuleSource(source, options = {}) {
+    const preserveExports = !!options.preserveExports;
+    const sourcePath = typeof source === 'string' ? source : String(source || '');
+    let transformed = readUtf8Text(sourcePath);
+    transformed = transformed.replace(JS_RELATIVE_IMPORT_STATEMENT_RE, (_match, prefix, indent, importClause) => {
+        const aliases = buildRelativeImportAliasStatements(importClause, sourcePath);
+        if (!aliases) {
+            return prefix || '';
+        }
+        const indentedAliases = aliases
+            .split('\n')
+            .map(line => `${indent || ''}${line}`)
+            .join('\n');
+        return `${prefix || ''}${indentedAliases}\n`;
+    });
+    transformed = transformed.replace(/^[ \t]*export\s+\*\s+from\s+['"]\.[^'"]+['"]\s*;?\s*$/gm, '');
+    if (!preserveExports) {
+        transformed = transformed.replace(/(^|\n)([ \t]*)export\s+(?=(?:async\s+function|const|let|class|function)\b)/g, '$1$2');
+    }
+    return transformed.trimEnd();
+}
+
+function bundleExecutableJavaScriptFile(entryPath, options = {}) {
+    const orderedFiles = collectJavaScriptFiles(entryPath);
+    const preserveExports = !!options.preserveExports;
+    const chunks = [];
+    for (const filePath of orderedFiles) {
+        const transformed = transformJavaScriptModuleSource(filePath, { preserveExports });
+        if (!transformed) {
+            continue;
+        }
+        chunks.push(transformed);
+    }
+    return chunks.join('\n\n').trimEnd() + '\n';
+}
+
+function readBundledWebUiHtml(entryPath = path.join(__dirname, 'index.html')) {
+    return bundleHtmlFile(entryPath).trimEnd() + '\n';
+}
+
+function readBundledWebUiCss(entryPath = path.join(__dirname, 'styles.css')) {
+    return bundleCssFile(entryPath).trimEnd() + '\n';
+}
+
+function readBundledWebUiScript(entryPath = path.join(__dirname, 'app.js')) {
+    return bundleJavaScriptFile(entryPath);
+}
+
+function readExecutableBundledWebUiScript(entryPath = path.join(__dirname, 'app.js')) {
+    return bundleExecutableJavaScriptFile(entryPath, { preserveExports: false });
+}
+
+function readExecutableBundledJavaScriptModule(entryPath) {
+    const resolvedEntryPath = path.isAbsolute(entryPath)
+        ? entryPath
+        : path.resolve(__dirname, '..', entryPath);
+    return bundleExecutableJavaScriptFile(resolvedEntryPath, { preserveExports: true });
+}
+
+module.exports = {
+    collectJavaScriptFiles,
+    readUtf8Text,
+    readBundledWebUiHtml,
+    readBundledWebUiCss,
+    readBundledWebUiScript,
+    readExecutableBundledWebUiScript,
+    readExecutableBundledJavaScriptModule
+};

package/web-ui/styles/base-theme.css

@@ -0,0 +1,271 @@
+/* Use local font stacks only; avoid third-party font fetches. */
+
+/* ============================================
+   设计系统 - Design Tokens
+   ============================================ */
+:root {
+    /* 色彩系统：温和中性暖灰 + 柔粉强调 */
+    --color-brand: #C77462;
+    --color-brand-dark: #B45E4E;
+    --color-brand-light: rgba(199, 116, 98, 0.14);
+    --color-brand-subtle: rgba(199, 116, 98, 0.2);
+
+    --color-bg: #F7F3EF;
+    --color-surface: #FFFDFC;
+    --color-surface-alt: #F8F3EE;
+    --color-surface-elevated: #FFFFFF;
+    --color-surface-tint: rgba(255, 253, 252, 0.9);
+    --color-text-primary: #241F1C;
+    --color-text-secondary: #5A514B;
+    --color-text-tertiary: #7A6E66;
+    --color-text-muted: #A39286;
+    --color-border: #E7DDD4;
+    --color-border-soft: rgba(163, 146, 134, 0.22);
+    --color-border-strong: rgba(163, 146, 134, 0.4);
+
+    --color-success: #4B8B6A;
+    --color-error: #C44536;
+
+    --bg-warm-gradient:
+        linear-gradient(180deg, #F7F3EF 0%, #F7F3EF 100%);
+
+    /* 字体系统 */
+    --font-family-body: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans SC', 'PingFang SC', 'Microsoft YaHei', sans-serif;
+    --font-family-display: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans SC', 'PingFang SC', 'Microsoft YaHei', sans-serif;
+    --font-family-mono: 'JetBrainsMono Nerd Font Mono', 'JetBrains Mono', 'Fira Code', 'SFMono-Regular', Consolas, 'Liberation Mono', monospace;
+    --font-family: var(--font-family-body);
+
+    --font-size-display: 52px;
+    --font-size-title: 18px;
+    --font-size-large: 20px;
+    --font-size-body: 15px;
+    --font-size-secondary: 13px;
+    --font-size-caption: 11px;
+
+    --font-weight-display: 600;
+    --font-weight-primary: 600;
+    --font-weight-title: 600;
+    --font-weight-body: 400;
+    --font-weight-secondary: 500;
+    --font-weight-caption: 500;
+
+    --line-height-tight: 1.12;
+    --line-height-normal: 1.5;
+
+    /* 间距系统 */
+    --spacing-xs: 8px;
+    --spacing-sm: 16px;
+    --spacing-md: 24px;
+    --spacing-lg: 40px;
+    --spacing-xl: 64px;
+
+    /* 圆角系统 */
+    --radius-sm: 8px;
+    --radius-md: 10px;
+    --radius-lg: 12px;
+    --radius-xl: 18px;
+    --radius-full: 50px;
+
+    /* 阴影系统 - 温和、轻量 */
+    --shadow-subtle: 0 1px 2px rgba(36, 31, 28, 0.03);
+    --shadow-card: 0 4px 12px rgba(36, 31, 28, 0.045);
+    --shadow-card-hover: 0 8px 22px rgba(36, 31, 28, 0.07);
+    --shadow-float: 0 12px 28px rgba(36, 31, 28, 0.1);
+    --shadow-raised: 0 8px 18px rgba(36, 31, 28, 0.08);
+    --shadow-modal:
+        0 8px 24px rgba(36, 31, 28, 0.08),
+        0 24px 64px rgba(36, 31, 28, 0.05);
+    --shadow-input-focus:
+        0 0 0 3px var(--color-brand-light),
+        0 1px 3px rgba(31, 26, 23, 0.04);
+
+    /* 动画 - 更细腻的曲线 */
+    --transition-instant: 100ms;
+    --transition-fast: 120ms;
+    --transition-normal: 200ms;
+    --transition-slow: 300ms;
+    --ease-spring: cubic-bezier(0.16, 1, 0.3, 1);
+    --ease-spring-soft: cubic-bezier(0.25, 1, 0.5, 1);
+    --ease-smooth: cubic-bezier(0.4, 0, 0.2, 1);
+    --ease-out-expo: cubic-bezier(0.19, 1, 0.22, 1);
+}
+
+/* ============================================
+   手机桌面 UA 兜底：触控设备强制紧凑排版
+   ============================================ */
+body.force-compact {
+    --font-size-title: 20px;
+    --font-size-body: 16px;
+    --font-size-secondary: 14px;
+    --font-size-caption: 12px;
+}
+
+body.force-compact .container {
+    max-width: none;
+    padding: 0;
+}
+
+body.force-compact .provider-fast-switch {
+    position: sticky;
+    top: 8px;
+    z-index: 16;
+}
+
+body.force-compact .provider-fast-switch-select {
+    min-height: 44px;
+    font-size: 16px;
+}
+
+body.force-compact .app-shell {
+    grid-template-columns: 1fr;
+    gap: 12px;
+    height: auto;
+    min-height: auto;
+    overflow: visible;
+}
+
+body.force-compact .main-panel {
+    position: relative;
+    top: auto;
+    align-self: stretch;
+    width: 100%;
+    height: auto;
+    overflow-y: visible;
+}
+
+body.force-compact .side-rail,
+body.force-compact .status-inspector {
+    display: none;
+}
+
+body.force-compact .top-tabs {
+    display: flex !important;
+    flex-wrap: nowrap;
+    overflow-x: auto;
+    overflow-y: hidden;
+    -webkit-overflow-scrolling: touch;
+    scrollbar-width: none;
+}
+
+body.force-compact .top-tabs::-webkit-scrollbar {
+    display: none;
+}
+
+body.force-compact .main-panel {
+    padding: 14px 12px;
+}
+
+body.force-compact .main-panel-topbar {
+    position: static;
+    margin: 0 0 10px;
+    padding: 0;
+    background: transparent;
+    backdrop-filter: none;
+}
+
+body.force-compact .card {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    justify-content: flex-start;
+    padding: 12px;
+    gap: 8px;
+}
+
+body.force-compact .card-leading {
+    align-items: flex-start;
+    width: 100%;
+}
+
+body.force-compact .card-content {
+    width: 100%;
+}
+
+body.force-compact .card-title,
+body.force-compact .card-title > span:first-child {
+    white-space: normal;
+    overflow: visible;
+    text-overflow: clip;
+    overflow-wrap: anywhere;
+}
+
+body.force-compact .card-subtitle {
+    white-space: normal;
+    overflow: hidden;
+    text-overflow: clip;
+    overflow-wrap: anywhere;
+    display: -webkit-box;
+    -webkit-line-clamp: 2;
+    -webkit-box-orient: vertical;
+}
+
+body.force-compact .card-trailing {
+    width: 100%;
+    margin-top: 0;
+    grid-auto-flow: row;
+    grid-auto-columns: 1fr;
+    justify-content: stretch;
+    justify-items: end;
+}
+
+body.force-compact .card-trailing .card-actions {
+    width: 100%;
+    justify-content: flex-end;
+    justify-self: stretch;
+    flex-wrap: wrap;
+}
+
+body.force-compact .card-actions {
+    opacity: 1;
+    transform: none;
+}
+
+body.force-compact .card-trailing .pill,
+body.force-compact .card-trailing .latency {
+    justify-self: end;
+}
+
+body.force-compact .btn-add,
+body.force-compact .btn-tool,
+body.force-compact .card-action-btn {
+    min-height: 44px;
+}
+
+/* ============================================
+   基础重置
+   ============================================ */
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+
+/* 仅屏幕阅读器可见 */
+.sr-only {
+    position: absolute;
+    width: 1px;
+    height: 1px;
+    padding: 0;
+    margin: -1px;
+    overflow: hidden;
+    clip: rect(0, 0, 0, 0);
+    white-space: nowrap;
+    border: 0;
+}
+
+body {
+    font-family: var(--font-family-body);
+    background-color: var(--color-bg);
+    background: var(--bg-warm-gradient);
+    color: var(--color-text-primary);
+    display: flex;
+    justify-content: stretch;
+    align-items: stretch;
+    min-height: 100vh;
+    padding: 0;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+    position: relative;
+    overflow-x: hidden;
+}
+