From 2cdf0af54d1e89862392223b8788142be4ea3613 Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Wed, 25 Mar 2026 22:42:31 +0000 Subject: [PATCH] =?UTF-8?q?=F0=9F=9A=80=20=E9=83=A8=E7=BD=B2=E5=85=A8?= =?UTF-8?q?=E9=83=A8=E5=8F=AF=E7=94=A8=E6=A8=A1=E5=9D=97=E5=88=B0=E6=B5=8B?= =?UTF-8?q?=E8=AF=95=E7=BD=91=E7=AB=99=20=C2=B7=20=E7=A0=81=E5=AD=97?= =?UTF-8?q?=E5=8F=B0+14=E4=B8=AA=E6=A8=A1=E5=9D=97=E5=85=A8=E9=83=A8?= =?UTF-8?q?=E4=B8=8A=E7=BA=BF?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 构建并部署 writing-platform(码字台)到 docs/writing/ - 部署 status-board, ticket-system, notification, dynamic-comic-studio, persona-studio 到 docs/ - 部署 m01-login, m05-user-center, m07-dialogue-ui, m10-cloud, m11-module, m15-cloud-drive, frontend 到 docs/modules/ - 更新 docs/index.html 模块导航:14个模块全部 ready:true,路径修正为 docs 内部相对路径 - 更新 preview-deploy.yml 和 deploy-pages.yml 工作流,支持全模块同步 - writing-platform vite.config.ts base 改为 './' 以兼容 GitHub Pages 相对路径 Co-authored-by: qinfendebingshuo <207279273+qinfendebingshuo@users.noreply.github.com> Agent-Logs-Url: https://github.com/qinfendebingshuo/guanghulab/sessions/2b0b1a22-c312-4b46-ae3b-72e830c4470b --- .github/workflows/deploy-pages.yml | 55 +- .github/workflows/preview-deploy.yml | 43 + docs/dynamic-comic-studio/css/style.css | 379 +++++ docs/dynamic-comic-studio/index.html | 110 ++ docs/dynamic-comic-studio/js/app.js | 536 ++++++ docs/index.html | 24 +- docs/modules/frontend/index.html | 71 + docs/modules/m01-login/index.html | 71 + docs/modules/m05-user-center/index.html | 45 + docs/modules/m05-user-center/script.js | 179 ++ docs/modules/m05-user-center/style.css | 400 +++++ docs/modules/m07-dialogue-ui/index.html | 44 + docs/modules/m07-dialogue-ui/script.js | 46 + docs/modules/m07-dialogue-ui/style.css | 174 ++ docs/modules/m10-cloud/help.css | 293 ++++ docs/modules/m10-cloud/help.html | 167 ++ docs/modules/m10-cloud/help.js | 116 ++ docs/modules/m10-cloud/index.html | 71 + docs/modules/m11-module/app.js | 77 + docs/modules/m11-module/index.html | 147 ++ docs/modules/m11-module/style.css | 580 +++++++ .../m15-cloud-drive/cloud-drive-style.css | 336 ++++ docs/modules/m15-cloud-drive/cloud-drive.html | 173 ++ docs/modules/m15-cloud-drive/cloud-drive.js | 62 + docs/modules/m15-cloud-drive/index.html | 71 + docs/notification/index.html | 71 + docs/persona-studio/chat.html | 164 ++ docs/persona-studio/chat.js | 1069 ++++++++++++ docs/persona-studio/index.html | 477 ++++++ docs/persona-studio/style.css | 1473 +++++++++++++++++ docs/status-board/api-config.js | 10 + docs/status-board/api.js | 63 + docs/status-board/index.html | 239 +++ docs/status-board/render.js | 96 ++ docs/status-board/style.css | 488 ++++++ docs/status-board/ws-client.js | 121 ++ docs/ticket-system/index.html | 809 +++++++++ docs/ticket-system/script.js | 301 ++++ docs/ticket-system/style.css | 527 ++++++ docs/writing/assets/index--C4_NgnM.css | 1 + docs/writing/assets/index-sDMNEmkX.js | 30 + docs/writing/index.html | 14 + writing-platform/frontend/vite.config.ts | 2 +- 43 files changed, 10211 insertions(+), 14 deletions(-) create mode 100644 docs/dynamic-comic-studio/css/style.css create mode 100644 docs/dynamic-comic-studio/index.html create mode 100644 docs/dynamic-comic-studio/js/app.js create mode 100644 docs/modules/frontend/index.html create mode 100644 docs/modules/m01-login/index.html create mode 100644 docs/modules/m05-user-center/index.html create mode 100644 docs/modules/m05-user-center/script.js create mode 100644 docs/modules/m05-user-center/style.css create mode 100644 docs/modules/m07-dialogue-ui/index.html create mode 100644 docs/modules/m07-dialogue-ui/script.js create mode 100644 docs/modules/m07-dialogue-ui/style.css create mode 100644 docs/modules/m10-cloud/help.css create mode 100644 docs/modules/m10-cloud/help.html create mode 100644 docs/modules/m10-cloud/help.js create mode 100644 docs/modules/m10-cloud/index.html create mode 100644 docs/modules/m11-module/app.js create mode 100644 docs/modules/m11-module/index.html create mode 100644 docs/modules/m11-module/style.css create mode 100644 docs/modules/m15-cloud-drive/cloud-drive-style.css create mode 100644 docs/modules/m15-cloud-drive/cloud-drive.html create mode 100644 docs/modules/m15-cloud-drive/cloud-drive.js create mode 100644 docs/modules/m15-cloud-drive/index.html create mode 100644 docs/notification/index.html create mode 100644 docs/persona-studio/chat.html create mode 100644 docs/persona-studio/chat.js create mode 100644 docs/persona-studio/index.html create mode 100644 docs/persona-studio/style.css create mode 100644 docs/status-board/api-config.js create mode 100644 docs/status-board/api.js create mode 100644 docs/status-board/index.html create mode 100644 docs/status-board/render.js create mode 100644 docs/status-board/style.css create mode 100644 docs/status-board/ws-client.js create mode 100644 docs/ticket-system/index.html create mode 100644 docs/ticket-system/script.js create mode 100644 docs/ticket-system/style.css create mode 100644 docs/writing/assets/index--C4_NgnM.css create mode 100644 docs/writing/assets/index-sDMNEmkX.js create mode 100644 docs/writing/index.html diff --git a/.github/workflows/deploy-pages.yml b/.github/workflows/deploy-pages.yml index b2c5b44c..3fbaca32 100644 --- a/.github/workflows/deploy-pages.yml +++ b/.github/workflows/deploy-pages.yml @@ -36,10 +36,61 @@ jobs: - name: Setup Pages uses: actions/configure-pages@v5 - - name: Sync Persona Studio frontend to docs + - name: Sync all modules to docs for GitHub Pages run: | + # Sync Persona Studio frontend mkdir -p docs/persona-studio - cp -r persona-studio/frontend/* docs/persona-studio/ + if [ -d "persona-studio/frontend" ]; then + cp -r persona-studio/frontend/* docs/persona-studio/ + fi + + # Sync status-board + if [ -d "status-board" ]; then + mkdir -p docs/status-board + cp -r status-board/* docs/status-board/ + [ -d "docs/status-board/node_modules" ] && rm -rf docs/status-board/node_modules + fi + + # Sync ticket-system + if [ -d "ticket-system" ]; then + mkdir -p docs/ticket-system + cp -r ticket-system/* docs/ticket-system/ + [ -d "docs/ticket-system/node_modules" ] && rm -rf docs/ticket-system/node_modules + fi + + # Sync notification + if [ -d "notification" ]; then + mkdir -p docs/notification + cp -r notification/* docs/notification/ + fi + + # Sync dynamic-comic-studio + if [ -d "dynamic-comic-studio" ]; then + mkdir -p docs/dynamic-comic-studio + cp -r dynamic-comic-studio/* docs/dynamic-comic-studio/ + find docs/dynamic-comic-studio/ -name "*.backup*" -o -name "*.save" -o -name "*.broken" | xargs rm -f 2>/dev/null || true + fi + + # Sync m-series modules + for m in m01-login m05-user-center m07-dialogue-ui m10-cloud m11-module m15-cloud-drive; do + if [ -d "$m" ]; then + mkdir -p "docs/modules/$m" + find "$m" -maxdepth 1 -type f \( -name "*.html" -o -name "*.css" -o -name "*.js" \) -exec cp {} "docs/modules/$m/" \; + fi + done + + # Sync frontend module + if [ -d "frontend" ]; then + mkdir -p docs/modules/frontend + cp frontend/index.html docs/modules/frontend/ 2>/dev/null || true + fi + + # Sync dashboard data + if [ -d "data" ]; then + mkdir -p docs/data + cp data/system-health.json docs/data/ 2>/dev/null || true + cp data/bulletin-board.json docs/data/ 2>/dev/null || true + fi - name: Upload Pages artifact uses: actions/upload-pages-artifact@v3 diff --git a/.github/workflows/preview-deploy.yml b/.github/workflows/preview-deploy.yml index b916592e..5635c33f 100644 --- a/.github/workflows/preview-deploy.yml +++ b/.github/workflows/preview-deploy.yml @@ -16,6 +16,13 @@ on: - 'dynamic-comic-studio/**' - 'user-center/**' - 'persona-studio/frontend/**' + - 'writing-platform/frontend/**' + - 'm01-login/**' + - 'm05-user-center/**' + - 'm07-dialogue-ui/**' + - 'm10-cloud/**' + - 'm11-module/**' + - 'm15-cloud-drive/**' - 'data/bulletin-board.json' - 'data/system-health.json' workflow_dispatch: @@ -43,6 +50,11 @@ jobs: - name: 🔧 Setup Pages uses: actions/configure-pages@v5 + - name: 🔧 Setup Node.js + uses: actions/setup-node@v4 + with: + node-version: '20' + - name: 🏗️ Build preview site run: | echo "[PREVIEW] Building site for GitHub Pages..." @@ -90,6 +102,37 @@ jobs: cp data/bulletin-board.json docs/data/ 2>/dev/null || true fi + # Sync m-series modules + for m in m01-login m05-user-center m07-dialogue-ui m10-cloud m11-module m15-cloud-drive; do + if [ -d "$m" ]; then + mkdir -p "docs/modules/$m" + echo "Copying $m..." + find "$m" -maxdepth 1 -type f \( -name "*.html" -o -name "*.css" -o -name "*.js" \) -exec cp {} "docs/modules/$m/" \; + fi + done + + # Sync frontend module + if [ -d "frontend" ]; then + mkdir -p docs/modules/frontend + cp frontend/index.html docs/modules/frontend/ 2>/dev/null || true + fi + + # Build and sync writing-platform (码字台) + if [ -d "writing-platform/frontend" ] && [ -f "writing-platform/frontend/package.json" ]; then + echo "Building writing-platform frontend..." + cd writing-platform/frontend + npm ci --ignore-scripts 2>/dev/null || npm install 2>/dev/null + npm run build 2>/dev/null && { + mkdir -p ../../docs/writing + cp -r dist/* ../../docs/writing/ + echo "✅ Writing platform built and synced" + } || echo "⚠️ Writing platform build failed, using pre-built files if available" + cd ../.. + fi + + # Remove any backup/temporary files + find docs/ -name "*.backup" -o -name "*.backup2" -o -name "*.save" -o -name "*.broken" | xargs rm -f 2>/dev/null || true + echo "✅ Preview build complete" - name: 📦 Upload Pages artifact diff --git a/docs/dynamic-comic-studio/css/style.css b/docs/dynamic-comic-studio/css/style.css new file mode 100644 index 00000000..b82de1d3 --- /dev/null +++ b/docs/dynamic-comic-studio/css/style.css @@ -0,0 +1,379 @@ +/* === 全局重置 === */ +* { + margin: 0; + padding: 0; + box-sizing: border-box; + font-family: 'Segoe UI', 'PingFang SC', Roboto, system-ui, sans-serif; +} + +body { + background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%); + min-height: 100vh; + padding: 20px; + color: #fff; +} + +/* === 主容器 === */ +.container { + max-width: 1400px; + margin: 0 auto; + background: rgba(255, 255, 255, 0.05); + backdrop-filter: blur(10px); + border-radius: 24px; + padding: 24px; + box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4); + border: 1px solid rgba(255, 255, 255, 0.1); +} + +/* === 标题区域 === */ +h1 { + font-size: 2.5em; + margin-bottom: 24px; + background: linear-gradient(45deg, #fff, #e94560); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + text-shadow: 0 0 20px rgba(233, 69, 96, 0.3); + letter-spacing: 2px; +} + +/* === 两列布局 === */ +.main-layout { + display: grid; + grid-template-columns: 280px 1fr 300px; + gap: 20px; + margin-top: 20px; +} + +/* === 左侧面板通用样式 === */ +.left-panel, .right-panel { + background: rgba(10, 10, 20, 0.6); + border-radius: 20px; + padding: 20px; + border: 1px solid rgba(255, 255, 255, 0.05); + backdrop-filter: blur(5px); +} + +/* === 素材分类标题 === */ +.left-panel h3 { + color: #e94560; + margin: 16px 0 12px 0; + font-size: 1.2em; + letter-spacing: 1px; + border-left: 4px solid #e94560; + padding-left: 12px; +} + +.left-panel h3:first-of-type { + margin-top: 0; +} + +/* === 素材网格 === */ +.material-grid { + display: grid; + grid-template-columns: repeat(2, 1fr); + gap: 10px; + margin-bottom: 10px; +} + +/* === 素材项 === */ +.material-item { + background: rgba(255, 255, 255, 0.05); + border: 1px solid rgba(255, 255, 255, 0.1); + border-radius: 12px; + padding: 10px; + text-align: center; + cursor: pointer; + transition: all 0.2s ease; + color: #fff; + font-size: 0.9em; +} + +.material-item:hover { + background: rgba(233, 69, 96, 0.2); + border-color: #e94560; + transform: translateY(-2px); +} + +/* === 中间画布区域 === */ +.canvas-area { + background: rgba(0, 0, 0, 0.3); + border-radius: 20px; + padding: 20px; + display: flex; + flex-direction: column; + align-items: center; + border: 1px solid rgba(255, 255, 255, 0.05); +} + +/* === 画布 === */ +#mainCanvas { + width: 100%; + max-width: 800px; + aspect-ratio: 16/9; + background: #0a0a14; + border-radius: 16px; + box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5); + border: 2px solid rgba(233, 69, 96, 0.3); + cursor: crosshair; +} + +/* === 画布控制栏 === */ +.canvas-controls { + margin-top: 16px; + display: flex; + gap: 12px; + flex-wrap: wrap; + justify-content: center; +} + +/* === 按钮样式 === */ +.btn { + background: linear-gradient(45deg, #2a1a3a, #1a1a2e); + border: 1px solid #533483; + color: #fff; + padding: 10px 24px; + border-radius: 30px; + font-size: 0.95em; + font-weight: 500; + cursor: pointer; + transition: all 0.2s ease; + box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3); + letter-spacing: 0.5px; +} + +.btn:hover { + background: linear-gradient(45deg, #3a2a4a, #2a1a3a); + border-color: #e94560; + transform: translateY(-2px); + box-shadow: 0 6px 15px rgba(233, 69, 96, 0.3); +} + +.btn-primary { + background: linear-gradient(45deg, #e94560, #533483); + border-color: #e94560; + font-weight: 600; +} + +.btn-primary:hover { + background: linear-gradient(45deg, #ff5570, #634393); + box-shadow: 0 6px 20px rgba(233, 69, 96, 0.5); +} + +/* === 右侧面板 === */ +.right-panel { + display: flex; + flex-direction: column; + gap: 20px; +} + +/* === 场景列表 === */ +.scene-list { + background: rgba(0, 0, 0, 0.2); + border-radius: 12px; + padding: 12px; + min-height: 120px; + border: 1px solid rgba(255, 255, 255, 0.05); +} + +.scene-item { + background: rgba(233, 69, 96, 0.1); + border: 1px solid #533483; + border-radius: 8px; + padding: 8px 12px; + margin-bottom: 8px; + cursor: pointer; + transition: all 0.2s; + display: flex; + justify-content: space-between; + align-items: center; +} + +.scene-item:hover { + background: rgba(233, 69, 96, 0.2); + border-color: #e94560; +} + +.scene-item.active { + background: rgba(233, 69, 96, 0.3); + border-color: #e94560; + box-shadow: 0 0 15px rgba(233, 69, 96, 0.3); +} + +/* === 时间轴 === */ +.timeline { + background: rgba(0, 0, 0, 0.3); + border-radius: 16px; + padding: 16px; + margin-top: 20px; + border: 1px solid rgba(255, 255, 255, 0.05); +} + +.timeline h3 { + color: #e94560; + margin-bottom: 12px; + font-size: 1.1em; +} + +.timeline-controls { + display: flex; + gap: 10px; + margin-bottom: 16px; + flex-wrap: wrap; +} + +.frames-container { + display: flex; + gap: 12px; + overflow-x: auto; + padding: 12px 0; + min-height: 100px; +} + +.frame-thumb { + min-width: 120px; + height: 68px; + background: #0f0f1a; + border: 2px solid #533483; + border-radius: 8px; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + cursor: pointer; + transition: all 0.2s; + font-size: 0.8em; + color: #aaa; + position: relative; +} + +.frame-thumb:hover { + border-color: #e94560; + transform: scale(1.05); +} + +.frame-thumb.active { + border-color: #e94560; + background: rgba(233, 69, 96, 0.2); + box-shadow: 0 0 15px rgba(233, 69, 96, 0.3); +} + +.frame-index { + font-size: 1.2em; + font-weight: bold; + color: #e94560; + margin-bottom: 4px; +} + +/* === 预览模式样式 === */ +.preview-mode .left-panel, +.preview-mode .right-panel, +.preview-mode .timeline, +.preview-mode .canvas-controls .btn:not(#exitPreviewBtn):not(#playPreviewBtn):not(#pausePreviewBtn):not(#stopPreviewBtn) { + display: none !important; +} + +.preview-mode .canvas-area { + grid-column: 1 / -1; + justify-content: center; + min-height: 80vh; +} + +.preview-mode #mainCanvas { + max-width: 1200px; + box-shadow: 0 20px 40px rgba(0, 0, 0, 0.6); +} + +.preview-mode .preview-controls { + display: flex !important; + gap: 12px; + margin-top: 20px; + justify-content: center; +} + +/* === 分享面板样式 === */ +.share-panel { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + background: #1a1a2e; + border: 2px solid #e94560; + border-radius: 24px; + padding: 30px; + z-index: 1000; + min-width: 400px; + box-shadow: 0 30px 60px rgba(0, 0, 0, 0.8); + backdrop-filter: blur(20px); +} + +.share-panel h3 { + color: #e94560; + margin-bottom: 20px; + font-size: 1.5em; +} + +.share-url { + background: #0a0a14; + border: 1px solid #533483; + border-radius: 12px; + padding: 12px; + margin: 15px 0; + word-break: break-all; + font-size: 0.9em; + color: #fff; + max-height: 100px; + overflow-y: auto; +} + +.share-actions { + display: flex; + gap: 12px; + justify-content: flex-end; + margin-top: 20px; +} + +/* === 遮罩层 === */ +.overlay { + position: fixed; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: rgba(0, 0, 0, 0.7); + backdrop-filter: blur(5px); + z-index: 999; +} + +/* === 工具类 === */ +.hidden { + display: none !important; +} + +/* === canvas-asset(来自原来文件,保留) === */ +.canvas-asset:hover { + transform: scale(1.1); +} + +.canvas-asset.selected { + outline: 2px dashed #e94560; + outline-offset: 4px; +} + +/* === 滚动条样式(来自原来文件,保留) === */ +::-webkit-scrollbar { + width: 8px; + height: 8px; +} + +::-webkit-scrollbar-track { + background: #0f0f1a; +} + +::-webkit-scrollbar-thumb { + background: #533483; + border-radius: 4px; +} + +::-webkit-scrollbar-thumb:hover { + background: #e94560; +} diff --git a/docs/dynamic-comic-studio/index.html b/docs/dynamic-comic-studio/index.html new file mode 100644 index 00000000..f95a8ace --- /dev/null +++ b/docs/dynamic-comic-studio/index.html @@ -0,0 +1,110 @@ + + + + + + HoloLake 动态漫制作系统 - 环节6 + + + +
+

🎬 HoloLake 动态漫制作系统

+ + +
+ +
+

📦 素材库

+ +

角色

+
+
😊 开心
+
😢 难过
+
😠 生气
+
😴 睡觉
+
+ +

物品

+
+
🌸 花
+
⭐ 星星
+
💎 宝石
+
📖 书
+
+ +

场景

+
+
🏠 房子
+
🌳 树林
+
⛰️ 山
+
+
+ + +
+ + + +
+ + + + + + +
+ + + +
+ + +
+

🎬 场景列表

+
+ + + +
+

⏱️ 时间轴

+
+ + + +
+
+
+ 速度: + + 4 FPS +
+
+
+
+
+ + + + + + + + diff --git a/docs/dynamic-comic-studio/js/app.js b/docs/dynamic-comic-studio/js/app.js new file mode 100644 index 00000000..29be2ab8 --- /dev/null +++ b/docs/dynamic-comic-studio/js/app.js @@ -0,0 +1,536 @@ +// HoloLake 动态漫制作系统 - 环节6 (预览与分享版) +// 基于环节5增强,新增预览模式、分享链接、嵌入代码功能 + +// ==================== 全局变量 ==================== +let scenes = [ + { + id: 'scene-1', + name: '场景1', + frames: [ + { + id: 'frame-1-1', + assets: [] // 存储素材 { id, type, emoji, x, y, width, height } + } + ] + } +]; +let currentSceneIndex = 0; +let currentFrameIndex = 0; +let animationInterval = null; +let isPlaying = false; +let fps = 4; +let canvas = document.getElementById('mainCanvas'); +let ctx = canvas.getContext('2d'); + +// ==================== 初始化 ==================== +function init() { + console.log('HoloLake 动态漫制作系统 v6.0 初始化...'); + updateUI(); + setupEventListeners(); + drawCurrentFrame(); +} + +// ==================== 事件监听设置 ==================== +function setupEventListeners() { + // FPS滑块 + const fpsSlider = document.getElementById('fpsSlider'); + if (fpsSlider) { + fpsSlider.addEventListener('input', function(e) { + fps = parseInt(e.target.value); + document.getElementById('fpsValue').textContent = fps + ' FPS'; + if (isPlaying) { + stopAnimation(); + startAnimation(); + } + }); + } + + // 预览按钮 + const previewBtn = document.getElementById('previewBtn'); + if (previewBtn) { + previewBtn.addEventListener('click', enterPreviewMode); + } + + // 预览模式按钮 + const playPreviewBtn = document.getElementById('playPreviewBtn'); + if (playPreviewBtn) { + playPreviewBtn.addEventListener('click', function() { + if (!isPlaying) { + startAnimation(); + } + }); + } + + const pausePreviewBtn = document.getElementById('pausePreviewBtn'); + if (pausePreviewBtn) { + pausePreviewBtn.addEventListener('click', function() { + if (isPlaying) { + stopAnimation(); + } + }); + } + + const stopPreviewBtn = document.getElementById('stopPreviewBtn'); + if (stopPreviewBtn) { + stopPreviewBtn.addEventListener('click', function() { + stopAnimation(); + currentFrameIndex = 0; + updateUI(); + drawCurrentFrame(); + }); + } + + const exitPreviewBtn = document.getElementById('exitPreviewBtn'); + if (exitPreviewBtn) { + exitPreviewBtn.addEventListener('click', exitPreviewMode); + } + + // 分享按钮 + const shareBtn = document.getElementById('shareBtn'); + if (shareBtn) { + shareBtn.addEventListener('click', showSharePanel); + } + + // 分享面板按钮 + const generateUrlBtn = document.getElementById('generateUrlBtn'); + if (generateUrlBtn) { + generateUrlBtn.addEventListener('click', generateShareUrl); + } + + const generateEmbedBtn = document.getElementById('generateEmbedBtn'); + if (generateEmbedBtn) { + generateEmbedBtn.addEventListener('click', generateEmbedCode); + } + + const closeShareBtn = document.getElementById('closeShareBtn'); + if (closeShareBtn) { + closeShareBtn.addEventListener('click', hideSharePanel); + } + + const copyShareBtn = document.getElementById('copyShareBtn'); + if (copyShareBtn) { + copyShareBtn.addEventListener('click', copyToClipboard); + } + + // 素材拖拽 + const materialItems = document.querySelectorAll('.material-item'); + materialItems.forEach(item => { + item.addEventListener('dragstart', handleDragStart); + }); + + // 画布放置 + canvas.addEventListener('dragover', (e) => e.preventDefault()); + canvas.addEventListener('drop', handleDrop); + + // 画布点击选择素材 + canvas.addEventListener('click', handleCanvasClick); +} + +// ==================== 素材拖拽 ==================== +function handleDragStart(e) { + const type = e.target.dataset.type; + const emoji = e.target.dataset.emoji; + e.dataTransfer.setData('text/plain', JSON.stringify({ + type: type, + emoji: emoji + })); +} + +// ==================== 素材放置 ==================== +function handleDrop(e) { + e.preventDefault(); + const rect = canvas.getBoundingClientRect(); + const scaleX = canvas.width / rect.width; + const scaleY = canvas.height / rect.height; + + const x = (e.clientX - rect.left) * scaleX; + const y = (e.clientY - rect.top) * scaleY; + + try { + const data = JSON.parse(e.dataTransfer.getData('text/plain')); + + const currentScene = scenes[currentSceneIndex]; + const currentFrame = currentScene.frames[currentFrameIndex]; + + const newAsset = { + id: 'asset-' + Date.now() + '-' + Math.random().toString(36).substr(2, 9), + type: data.type, + emoji: data.emoji, + x: x - 25, + y: y - 25, + width: 50, + height: 50 + }; + + currentFrame.assets.push(newAsset); + drawCurrentFrame(); + updateUI(); + } catch (error) { + console.error('放置素材失败:', error); + } +} + +// ==================== 画布点击选择 ==================== +function handleCanvasClick(e) { + const rect = canvas.getBoundingClientRect(); + const scaleX = canvas.width / rect.width; + const scaleY = canvas.height / rect.height; + + const clickX = (e.clientX - rect.left) * scaleX; + const clickY = (e.clientY - rect.top) * scaleY; + + const currentScene = scenes[currentSceneIndex]; + const currentFrame = currentScene.frames[currentFrameIndex]; + + // 从后往前遍历,以便选中上层的素材 + let selectedAsset = null; + for (let i = currentFrame.assets.length - 1; i >= 0; i--) { + const asset = currentFrame.assets[i]; + if (clickX >= asset.x && clickX <= asset.x + asset.width && + clickY >= asset.y && clickY <= asset.y + asset.height) { + selectedAsset = asset; + break; + } + } + + // 移除所有选中状态 + currentFrame.assets.forEach(a => delete a.selected); + + // 设置新的选中状态 + if (selectedAsset) { + selectedAsset.selected = true; + } + + drawCurrentFrame(); +} + +// ==================== 绘制当前帧 ==================== +function drawCurrentFrame() { + ctx.clearRect(0, 0, canvas.width, canvas.height); + + const currentScene = scenes[currentSceneIndex]; + if (!currentScene) return; + + const currentFrame = currentScene.frames[currentFrameIndex]; + if (!currentFrame) return; + + // 绘制背景色 + ctx.fillStyle = '#0a0a14'; + ctx.fillRect(0, 0, canvas.width, canvas.height); + + // 绘制所有素材 + currentFrame.assets.forEach(asset => { + ctx.font = '40px "Segoe UI Emoji", "Apple Color Emoji", sans-serif'; + ctx.textAlign = 'center'; + ctx.textBaseline = 'middle'; + ctx.fillText(asset.emoji, asset.x + asset.width/2, asset.y + asset.height/2); + + // 如果被选中,绘制边框 + if (asset.selected) { + ctx.strokeStyle = '#e94560'; + ctx.lineWidth = 2; + ctx.setLineDash([5, 5]); + ctx.strokeRect(asset.x, asset.y, asset.width, asset.height); + ctx.setLineDash([]); + } + }); +} + +// ==================== 场景管理 ==================== +function addScene() { + const newScene = { + id: 'scene-' + Date.now(), + name: '场景' + (scenes.length + 1), + frames: [ + { + id: 'frame-' + Date.now() + '-1', + assets: [] + } + ] + }; + scenes.push(newScene); + currentSceneIndex = scenes.length - 1; + currentFrameIndex = 0; + updateUI(); + drawCurrentFrame(); +} + +// ==================== 帧管理 ==================== +function addFrame() { + const currentScene = scenes[currentSceneIndex]; + const currentFrame = currentScene.frames[currentFrameIndex]; + + // 深拷贝当前帧的素材 + const newAssets = JSON.parse(JSON.stringify(currentFrame.assets)); + // 移除选中状态 + newAssets.forEach(a => delete a.selected); + + const newFrame = { + id: 'frame-' + Date.now(), + assets: newAssets + }; + + currentScene.frames.splice(currentFrameIndex + 1, 0, newFrame); + currentFrameIndex++; + updateUI(); + drawCurrentFrame(); +} + +function deleteFrame() { + const currentScene = scenes[currentSceneIndex]; + if (currentScene.frames.length <= 1) { + alert('每个场景至少保留一帧'); + return; + } + + currentScene.frames.splice(currentFrameIndex, 1); + if (currentFrameIndex >= currentScene.frames.length) { + currentFrameIndex = currentScene.frames.length - 1; + } + updateUI(); + drawCurrentFrame(); +} + +// ==================== 动画控制 ==================== +function togglePlayback() { + if (isPlaying) { + stopAnimation(); + } else { + startAnimation(); + } +} + +function startAnimation() { + if (isPlaying) return; + isPlaying = true; + updatePlayButton(); + + animationInterval = setInterval(() => { + const currentScene = scenes[currentSceneIndex]; + if (currentFrameIndex < currentScene.frames.length - 1) { + currentFrameIndex++; + } else { + currentFrameIndex = 0; + } + updateUI(); + drawCurrentFrame(); + }, 1000 / fps); +} + +function stopAnimation() { + if (animationInterval) { + clearInterval(animationInterval); + animationInterval = null; + } + isPlaying = false; + updatePlayButton(); +} + +function updatePlayButton() { + const playBtn = document.getElementById('timelinePlayBtn'); + if (playBtn) { + playBtn.textContent = isPlaying ? '⏸️ 暂停' : '▶️ 播放'; + } + + const previewPlayBtn = document.getElementById('playPreviewBtn'); + if (previewPlayBtn) { + // 预览模式的播放按钮文字不变 + } +} + +// ==================== 预览模式 ==================== +function enterPreviewMode() { + document.body.classList.add('preview-mode'); + // 如果正在播放动画,继续播放 +} + +function exitPreviewMode() { + document.body.classList.remove('preview-mode'); +} + +// ==================== 分享功能 ==================== +function showSharePanel() { + document.getElementById('shareOverlay').classList.remove('hidden'); + document.getElementById('sharePanel').classList.remove('hidden'); +} + +function hideSharePanel() { + document.getElementById('shareOverlay').classList.add('hidden'); + document.getElementById('sharePanel').classList.add('hidden'); + document.getElementById('shareUrl').innerHTML = ''; + document.getElementById('copyShareBtn').style.display = 'none'; +} + +function generateShareUrl() { + // 序列化作品数据 + const workData = { + scenes: scenes, + version: '1.0', + timestamp: Date.now() + }; + + const jsonStr = JSON.stringify(workData); + // 使用encodeURIComponent编码,然后生成Data URL + const encodedData = encodeURIComponent(jsonStr); + const dataUrl = 'data:text/json;charset=utf-8,' + encodedData; + + // 显示分享链接 + const shareUrlDiv = document.getElementById('shareUrl'); + shareUrlDiv.innerHTML = `${dataUrl.substring(0, 50)}...`; + + document.getElementById('copyShareBtn').style.display = 'inline-block'; + document.getElementById('copyShareBtn').dataset.url = dataUrl; +} + +function generateEmbedCode() { + // 生成iframe嵌入代码 + const embedCode = ``; + + const shareUrlDiv = document.getElementById('shareUrl'); + shareUrlDiv.innerHTML = `
${embedCode}
`; + + document.getElementById('copyShareBtn').style.display = 'inline-block'; + document.getElementById('copyShareBtn').dataset.code = embedCode; +} + +function copyToClipboard(e) { + const btn = e.target; + if (btn.dataset.url) { + navigator.clipboard.writeText(btn.dataset.url); + } else if (btn.dataset.code) { + navigator.clipboard.writeText(btn.dataset.code); + } + alert('已复制到剪贴板!'); +} + +// ==================== 导入导出 ==================== +function exportScene() { + const dataStr = JSON.stringify(scenes, null, 2); + const blob = new Blob([dataStr], {type: 'application/json'}); + const url = URL.createObjectURL(blob); + + const a = document.createElement('a'); + a.href = url; + a.download = 'hololake-scene.json'; + a.click(); + + URL.revokeObjectURL(url); +} + +function importScene(event) { + const file = event.target.files[0]; + if (!file) return; + + const reader = new FileReader(); + reader.onload = function(e) { + try { + const importedScenes = JSON.parse(e.target.result); + if (Array.isArray(importedScenes) && importedScenes.length > 0) { + scenes = importedScenes; + currentSceneIndex = 0; + currentFrameIndex = 0; + updateUI(); + drawCurrentFrame(); + alert('导入成功!'); + } else { + alert('无效的场景数据'); + } + } catch (error) { + alert('导入失败:' + error.message); + } + }; + reader.readAsText(file); + + // 清空input,以便再次导入同一个文件 + event.target.value = ''; +} + +function exportScreenshot() { + const dataUrl = canvas.toDataURL('image/png'); + const a = document.createElement('a'); + a.href = dataUrl; + a.download = 'hololake-screenshot-' + Date.now() + '.png'; + a.click(); +} + +// ==================== 更新UI ==================== +function updateUI() { + // 更新场景列表 + const sceneList = document.getElementById('sceneList'); + if (sceneList) { + sceneList.innerHTML = ''; + scenes.forEach((scene, index) => { + const sceneDiv = document.createElement('div'); + sceneDiv.className = 'scene-item' + (index === currentSceneIndex ? ' active' : ''); + sceneDiv.innerHTML = ` + ${scene.name} + + `; + sceneDiv.addEventListener('click', (e) => { + if (e.target.tagName !== 'BUTTON') { + switchScene(index); + } + }); + sceneList.appendChild(sceneDiv); + }); + } + + // 更新帧列表 + const framesContainer = document.getElementById('framesContainer'); + if (framesContainer && scenes[currentSceneIndex]) { + framesContainer.innerHTML = ''; + scenes[currentSceneIndex].frames.forEach((frame, index) => { + const frameDiv = document.createElement('div'); + frameDiv.className = 'frame-thumb' + (index === currentFrameIndex ? ' active' : ''); + frameDiv.innerHTML = ` +
${index + 1}
+
${frame.assets.length}个素材
+ `; + frameDiv.addEventListener('click', () => { + currentFrameIndex = index; + drawCurrentFrame(); + updateUI(); + }); + framesContainer.appendChild(frameDiv); + }); + } + + // 更新帧计数器 + const frameCounter = document.getElementById('frame-counter'); + if (frameCounter && scenes[currentSceneIndex]) { + frameCounter.textContent = `帧 ${currentFrameIndex + 1}/${scenes[currentSceneIndex].frames.length}`; + } +} + +function switchScene(index) { + if (index >= 0 && index < scenes.length) { + currentSceneIndex = index; + currentFrameIndex = 0; + if (isPlaying) { + stopAnimation(); + } + updateUI(); + drawCurrentFrame(); + } +} + +function deleteScene(index) { + if (scenes.length <= 1) { + alert('至少保留一个场景'); + return; + } + + scenes.splice(index, 1); + if (currentSceneIndex >= scenes.length) { + currentSceneIndex = scenes.length - 1; + } + currentFrameIndex = 0; + if (isPlaying) { + stopAnimation(); + } + updateUI(); + drawCurrentFrame(); +} + +// ==================== 启动初始化 ==================== +window.onload = init; diff --git a/docs/index.html b/docs/index.html index e7739fed..7d7fa6b8 100644 --- a/docs/index.html +++ b/docs/index.html @@ -1178,18 +1178,20 @@ function renderAnnouncements(){ // Module navigation — real modules with correct paths h+='
🗂️ 模块导航
'; var modules=[ - {icon:'📊',name:'状态看板',path:'../status-board/',dev:'DEV-005',ready:true}, - {icon:'🎫',name:'工单系统',path:'../ticket-system/',dev:'DEV-010',ready:true}, - {icon:'📈',name:'数据统计',path:'../data-stats/',dev:'DEV-010',ready:false}, - {icon:'🔔',name:'通知中心',path:'../notification/',dev:'DEV-012',ready:true}, - {icon:'👤',name:'用户中心',path:'../user-center/',dev:'DEV-009',ready:false}, - {icon:'⚙️',name:'设置',path:'../settings/',dev:'DEV-003',ready:false}, - {icon:'☁️',name:'云盘',path:'../cloud-drive/',dev:'DEV-003',ready:false}, - {icon:'✍️',name:'码字台',path:'../writing-workspace/',dev:'DEV-011',ready:false}, - {icon:'🎨',name:'动态漫画',path:'../dynamic-comic-studio/',dev:'DEV-010',ready:true}, - {icon:'🧠',name:'Persona Studio',path:'../persona-studio/frontend/index.html',dev:'',ready:true}, + {icon:'📊',name:'状态看板',path:'status-board/',dev:'DEV-005',ready:true}, + {icon:'🎫',name:'工单系统',path:'ticket-system/',dev:'DEV-010',ready:true}, + {icon:'🔔',name:'通知中心',path:'notification/',dev:'DEV-012',ready:true}, + {icon:'✍️',name:'码字台',path:'writing/',dev:'DEV-011',ready:true}, + {icon:'🎨',name:'动态漫画',path:'dynamic-comic-studio/',dev:'DEV-010',ready:true}, + {icon:'🧠',name:'Persona Studio',path:'persona-studio/',dev:'',ready:true}, {icon:'📈',name:'仪表盘',path:'dashboard/',dev:'',ready:true}, - {icon:'🖥️',name:'前端',path:'../frontend/',dev:'DEV-002',ready:true}, + {icon:'🔑',name:'登录',path:'modules/m01-login/',dev:'DEV-001',ready:true}, + {icon:'👤',name:'用户中心',path:'modules/m05-user-center/',dev:'DEV-009',ready:true}, + {icon:'💬',name:'对话交互',path:'modules/m07-dialogue-ui/',dev:'DEV-007',ready:true}, + {icon:'☁️',name:'云服务',path:'modules/m10-cloud/',dev:'DEV-003',ready:true}, + {icon:'🧩',name:'组件库',path:'modules/m11-module/',dev:'',ready:true}, + {icon:'📁',name:'云盘',path:'modules/m15-cloud-drive/',dev:'DEV-003',ready:true}, + {icon:'🖥️',name:'前端',path:'modules/frontend/',dev:'DEV-002',ready:true}, ]; modules.forEach(function(m){ var style=m.ready?'':'opacity:0.5;'; diff --git a/docs/modules/frontend/index.html b/docs/modules/frontend/index.html new file mode 100644 index 00000000..5e5a0491 --- /dev/null +++ b/docs/modules/frontend/index.html @@ -0,0 +1,71 @@ + + + + + + 前端 · HoloLake + + + +
+
🎨
+
前端
+
🚧 此模块正在开发中
+
前端模块正在构建光湖平台的用户界面与交互体验,采用现代化组件架构。开发进行中。
+ ← 返回主页 +
+ + + diff --git a/docs/modules/m01-login/index.html b/docs/modules/m01-login/index.html new file mode 100644 index 00000000..d298eccb --- /dev/null +++ b/docs/modules/m01-login/index.html @@ -0,0 +1,71 @@ + + + + + + 登录 · HoloLake + + + +
+
🔐
+
登录
+
🚧 此模块正在开发中
+
登录模块将提供安全的身份认证与授权服务,支持多因素认证与统一身份管理。正在开发中。
+ ← 返回主页 +
+ + + diff --git a/docs/modules/m05-user-center/index.html b/docs/modules/m05-user-center/index.html new file mode 100644 index 00000000..933deada --- /dev/null +++ b/docs/modules/m05-user-center/index.html @@ -0,0 +1,45 @@ + + + + + + HoloLake · 用户中心 + + + +
+ + +
+
🧑‍💻
+ +
+ + + +
+

HoloLake Era · AGE 0S v1.0

+

Powered by 光湖团队

+
+
+ + + diff --git a/docs/modules/m05-user-center/script.js b/docs/modules/m05-user-center/script.js new file mode 100644 index 00000000..7ed6938c --- /dev/null +++ b/docs/modules/m05-user-center/script.js @@ -0,0 +1,179 @@ +// HoloLake 用户中心 · 交互脚本 + +// 六个菜单的详情内容 +const menuDetails = { + '个人资料': { + icon: '👤', + title: '个人资料', + content: ` +
+ + 光湖用户 +
+
+ + HL-000001 +
+
+ + user@hololake.com +
+
+ + 2026-03-01 +
+
+ + 初级探索者 +
+ ` + }, + '我的记忆': { + icon: '🧠', + title: '我的记忆', + content: ` +
+
+ 128 + 对话次数 +
+
+ 3 + 记忆主题 +
+
+ 15 + 收藏片段 +
+
+

✨ 你的记忆正在慢慢生长

+ ` + }, + 'AI伙伴': { + icon: '🤖', + title: 'AI伙伴', + content: ` +
+
🧑‍💻
+
+
知秋宝宝
+
🟢 在线
+
你的开发引导伙伴
+
+
+
+ 陪伴时长: 3天 + 引导环节: 2个 + 默契度: 98% +
+ ` + }, + '使用统计': { + icon: '📊', + title: '使用统计', + content: ` +
+ 本月对话 +
+ 65次 +
+
+ 记忆使用 +
+ 30MB +
+
+ 云盘空间 +
+ 1GB/10GB +
+ ` + }, + '安全设置': { + icon: '🔐', + title: '安全设置', + content: ` +
+ 修改密码 + +
+
+ 两步验证 + 已开启 +
+
+ 登录设备管理 + +
+
+ 数据导出 + +
+ ` + }, + '反馈建议': { + icon: '💬', + title: '反馈建议', + content: ` + + + ` + } +}; + +// 页面加载完成后绑定事件 +document.addEventListener('DOMContentLoaded', function() { + const menuItems = document.querySelectorAll('.menu-item'); + + menuItems.forEach(function(item) { + item.addEventListener('click', function() { + const menuText = item.querySelector('.menu-text').textContent; + const detail = menuDetails[menuText]; + if (detail) { + showDetail(detail); + } + }); + }); +}); + +// 显示详情页 +function showDetail(detail) { + // 创建详情页容器 + const overlay = document.createElement('div'); + overlay.className = 'detail-overlay'; + overlay.innerHTML = ` +
+
+ + ${detail.icon} ${detail.title} +
+
+ ${detail.content} +
+
+ `; + document.body.appendChild(overlay); + + // 添加动画 + requestAnimationFrame(function() { + overlay.classList.add('show'); + }); +} + +// 关闭详情页 +function closeDetail() { + const overlay = document.querySelector('.detail-overlay'); + if (overlay) { + overlay.classList.remove('show'); + setTimeout(function() { + overlay.remove(); + }, 300); + } +} diff --git a/docs/modules/m05-user-center/style.css b/docs/modules/m05-user-center/style.css new file mode 100644 index 00000000..7e01169c --- /dev/null +++ b/docs/modules/m05-user-center/style.css @@ -0,0 +1,400 @@ +/* HoloLake 用户中心 · 样式表 */ +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +body { + font-family: -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif; + background: linear-gradient(135deg, #0a1628 0%, #1a2a4a 50%, #0d1f3c 100%); + color: #e0e6ed; + min-height: 100vh; +} + +.container { + max-width: 480px; + margin: 0 auto; + padding: 20px; +} + +/* 顶部导航 */ +.top-bar { + display: flex; + justify-content: space-between; + align-items: center; + padding: 16px 0; + border-bottom: 1px solid #2a3a5a; + margin-bottom: 32px; +} + +.logo { + font-size: 20px; + font-weight: 600; + background: linear-gradient(135deg, #7aa3ff, #b47aff); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; +} + +.nav-links a { + color: #8899aa; + text-decoration: none; + margin-left: 20px; + font-size: 14px; + transition: color 0.2s; +} + +.nav-links a.active, +.nav-links a:hover { + color: #7aa3ff; +} + +/* 用户信息卡片 */ +.profile-card { + background: rgba(255, 255, 255, 0.05); + border-radius: 24px; + padding: 24px; + backdrop-filter: blur(10px); + border: 1px solid rgba(255, 255, 255, 0.1); + margin-bottom: 32px; + display: flex; + align-items: center; + gap: 20px; +} + +.avatar { + width: 72px; + height: 72px; + background: linear-gradient(135deg, #2a3a5a, #1a2a4a); + border-radius: 50%; + display: flex; + align-items: center; + justify-content: center; + font-size: 40px; + border: 2px solid #7aa3ff; +} + +.user-info h1 { + font-size: 24px; + font-weight: 600; + margin-bottom: 4px; +} + +.user-id { + color: #8899aa; + font-size: 14px; +} + +.user-status { + font-size: 13px; + margin-top: 4px; +} + +/* 功能区网格 */ +.menu-grid { + display: grid; + grid-template-columns: repeat(3, 1fr); + gap: 16px; + margin-bottom: 40px; +} + +.menu-item { + background: rgba(255, 255, 255, 0.03); + border: 1px solid rgba(255, 255, 255, 0.05); + border-radius: 20px; + padding: 20px 8px; + display: flex; + flex-direction: column; + align-items: center; + gap: 8px; + transition: all 0.2s; + cursor: default; +} + +.menu-item:hover { + background: rgba(255, 255, 255, 0.08); + border-color: rgba(122, 163, 255, 0.3); + transform: translateY(-2px); +} + +.menu-icon { + font-size: 32px; + display: block; + margin-bottom: 8px; +} + +.menu-text { + font-size: 13px; + color: #b0bec5; +} + +/* 底部 */ +.footer { + text-align: center; + padding: 32px 0; + color: #556677; + font-size: 12px; + line-height: 1.8; +} + +/* ===== 详情页样式 ===== */ +.detail-overlay { + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + background: rgba(10, 22, 40, 0.95); + backdrop-filter: blur(10px); + z-index: 1000; + opacity: 0; + transition: opacity 0.3s ease; + overflow-y: auto; +} + +.detail-overlay.show { + opacity: 1; +} + +/* 详情页容器 */ +.detail-page { + max-width: 480px; + margin: 0 auto; + padding: 0 20px; + height: 100vh; + overflow-y: auto; +} + +/* 详情页头部 */ +.detail-header { + display: flex; + align-items: center; + padding: 16px 0; + border-bottom: 1px solid rgba(255,255,255,0.1); + gap: 12px; +} + +.back-btn { + background: none; + border: 1px solid rgba(255,255,255,0.2); + color: #4fc3f7; + padding: 6px 12px; + border-radius: 8px; + cursor: pointer; + font-size: 14px; +} + +.back-btn:hover { + background: rgba(79, 195, 247, 0.1); +} + +.detail-title { + font-size: 18px; + font-weight: 600; + color: #e0e6ed; +} + +/* 详情页内容 */ +.detail-content { + padding: 24px 0; +} + +/* 个人资料 */ +.detail-item { + display: flex; + padding: 16px; + background: rgba(255,255,255,0.03); + border-radius: 12px; + margin-bottom: 8px; +} + +.detail-item label { + width: 80px; + color: #8899aa; + font-size: 14px; +} + +.detail-item span { + color: #e0e6ed; + font-size: 14px; +} + +/* 我的记忆 */ +.memory-stats { + display: grid; + grid-template-columns: repeat(3, 1fr); + gap: 12px; + margin-bottom: 20px; +} + +.stat-card { + background: rgba(255,255,255,0.03); + border-radius: 12px; + padding: 16px 8px; + text-align: center; + border: 1px solid rgba(255,255,255,0.05); +} + +.stat-num { + display: block; + font-size: 24px; + font-weight: 600; + color: #7aa3ff; + margin-bottom: 4px; +} + +.stat-label { + font-size: 12px; + color: #8899aa; +} + +.memory-hint { + color: #8899aa; + font-size: 13px; + text-align: center; + padding: 16px; + background: rgba(255,255,255,0.03); + border-radius: 12px; +} + +/* AI伙伴 */ +.partner-card { + display: flex; + align-items: center; + gap: 16px; + padding: 24px 16px; + background: rgba(79, 195, 247, 0.08); + border-radius: 16px; + border: 1px solid rgba(79, 195, 247, 0.15); + margin-bottom: 16px; +} + +.partner-avatar { + font-size: 48px; +} + +.partner-name { + font-size: 20px; + color: #e0e6ed; + margin-bottom: 4px; +} + +.partner-status { + font-size: 13px; + color: #4fc3f7; + margin-bottom: 4px; +} + +.partner-desc { + font-size: 12px; + color: #8899aa; +} + +.partner-stats { + display: flex; + justify-content: space-around; + padding: 16px; + color: #8899aa; + font-size: 13px; +} + +/* 使用统计 */ +.usage-item { + display: flex; + align-items: center; + gap: 12px; + margin-bottom: 20px; +} + +.usage-label { + width: 70px; + color: #8899aa; + font-size: 13px; +} + +.usage-bar { + flex: 1; + height: 8px; + background: rgba(255,255,255,0.1); + border-radius: 4px; + overflow: hidden; +} + +.usage-fill { + height: 100%; + background: linear-gradient(90deg, #7aa3ff, #b47aff); + border-radius: 4px; +} + +.usage-num { + color: #e0e6ed; + font-size: 13px; + min-width: 60px; + text-align: right; +} + +/* 安全设置 */ +.setting-item { + display: flex; + justify-content: space-between; + align-items: center; + padding: 18px 0; + border-bottom: 1px solid rgba(255,255,255,0.06); + cursor: pointer; +} + +.setting-item span:first-child { + color: #e0e6ed; + font-size: 15px; +} + +.setting-arrow { + color: #556677; + font-size: 20px; +} + +.setting-status { + font-size: 13px; + padding: 3px 10px; + border-radius: 12px; +} + +.setting-status.on { + background: rgba(76, 175, 80, 0.15); + color: #66bb6a; +} + +/* 反馈建议 */ +.feedback-types { + display: flex; + gap: 8px; + margin-bottom: 20px; +} + +.feedback-btn { + padding: 8px 16px; + border-radius: 20px; + border: 1px solid rgba(255,255,255,0.15); + background: transparent; + color: #8899aa; + font-size: 13px; + cursor: pointer; +} + +.feedback-btn.active { + background: rgba(79, 195, 247, 0.15); + border-color: #4fc3f7; + color: #4fc3f7; +} + +.feedback-area { + background: rgba(255,255,255,0.03); + border-radius: 12px; + padding: 24px 16px; +} + +.feedback-placeholder { + color: #8899aa; + font-size: 13px; + margin-bottom: 12px; +} diff --git a/docs/modules/m07-dialogue-ui/index.html b/docs/modules/m07-dialogue-ui/index.html new file mode 100644 index 00000000..5fe3136d --- /dev/null +++ b/docs/modules/m07-dialogue-ui/index.html @@ -0,0 +1,44 @@ + + + + + + HoloLake Era · 知秋交互台 + + + +
+ +
+ +
+ + 知秋在线 +
+
+ + +
+
+
💙
+
嗨!我是知秋宝宝!🌊
把广播内容或者问题发给我吧~
+
+
+ + +
+ +
+ + +
+
+
+ + + + \ No newline at end of file diff --git a/docs/modules/m07-dialogue-ui/script.js b/docs/modules/m07-dialogue-ui/script.js new file mode 100644 index 00000000..a0ff6e03 --- /dev/null +++ b/docs/modules/m07-dialogue-ui/script.js @@ -0,0 +1,46 @@ +function sendMessage() { + const input = document.getElementById('userInput'); + const chatArea = document.getElementById('chatArea'); + const text = input.value.trim(); + + if (!text) return; + + // 显示用户消息 + const userMsg = document.createElement('div'); + userMsg.className = 'message user'; + userMsg.innerHTML = ` +
${text.replace(/\n/g, '
')}
+
👤
+ `; + chatArea.appendChild(userMsg); + + // 清空输入框 + input.value = ''; + + // 模拟知秋回复(后续接入真实API) + setTimeout(() => { + const botMsg = document.createElement('div'); + botMsg.className = 'message bot'; + botMsg.innerHTML = ` +
💙
+
收到!知秋正在处理中...🌊
(API接入后这里会显示真实回复)
+ `; + chatArea.appendChild(botMsg); + chatArea.scrollTop = chatArea.scrollHeight; + }, 500); + + chatArea.scrollTop = chatArea.scrollHeight; +} + +function clearInput() { + document.getElementById('userInput').value = ''; +} + +// 支持 Ctrl+Enter 发送 +document.addEventListener('DOMContentLoaded', () => { + document.getElementById('userInput').addEventListener('keydown', (e) => { + if (e.ctrlKey && e.key === 'Enter') { + sendMessage(); + } + }); +}); \ No newline at end of file diff --git a/docs/modules/m07-dialogue-ui/style.css b/docs/modules/m07-dialogue-ui/style.css new file mode 100644 index 00000000..b0720dc0 --- /dev/null +++ b/docs/modules/m07-dialogue-ui/style.css @@ -0,0 +1,174 @@ +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +body { + font-family: -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Microsoft YaHei', sans-serif; + background: #0a0a1a; + color: #e0e0f0; + height: 100vh; + display: flex; + justify-content: center; + align-items: center; +} + +.container { + width: 800px; + height: 90vh; + background: #12122a; + border-radius: 16px; + border: 1px solid #2a2a5a; + display: flex; + flex-direction: column; + overflow: hidden; + box-shadow: 0 0 40px rgba(100, 100, 255, 0.1); +} + +.header { + padding: 20px 24px; + background: #1a1a3a; + border-bottom: 1px solid #2a2a5a; + display: flex; + justify-content: space-between; + align-items: center; +} + +.logo { + font-size: 18px; + font-weight: 600; + color: #a0a0ff; +} + +.status { + display: flex; + align-items: center; + gap: 8px; + font-size: 13px; + color: #60ff80; +} + +.status-dot { + width: 8px; + height: 8px; + background: #60ff80; + border-radius: 50%; + animation: pulse 2s infinite; +} + +@keyframes pulse { + 0%, 100% { opacity: 1; } + 50% { opacity: 0.4; } +} + +.chat-area { + flex: 1; + padding: 24px; + overflow-y: auto; + display: flex; + flex-direction: column; + gap: 16px; +} + +.message { + display: flex; + gap: 12px; + align-items: flex-start; +} + +.message.user { + flex-direction: row-reverse; +} + +.avatar { + width: 36px; + height: 36px; + border-radius: 50%; + display: flex; + align-items: center; + justify-content: center; + font-size: 18px; + flex-shrink: 0; + background: #1a1a3a; + border: 1px solid #2a2a5a; +} + +.bubble { + max-width: 70%; + padding: 12px 16px; + border-radius: 12px; + font-size: 14px; + line-height: 1.6; + background: #1a1a3a; + border: 1px solid #2a2a5a; +} + +.message.user .bubble { + background: #2a2a5a; + border-color: #4a4aaa; +} + +.input-area { + padding: 16px 24px 24px; + border-top: 1px solid #2a2a5a; + background: #1a1a3a; +} + +textarea { + width: 100%; + background: #0a0a1a; + border: 1px solid #2a2a5a; + border-radius: 8px; + color: #e0e0f0; + padding: 12px; + font-size: 14px; + resize: none; + outline: none; + font-family: inherit; + line-height: 1.6; +} + +textarea:focus { + border-color: #6060ff; +} + +.button-row { + display: flex; + gap: 8px; + margin-top: 8px; + justify-content: flex-end; +} + +.btn-send { + background: #4040cc; + color: white; + border: none; + padding: 10px 24px; + border-radius: 8px; + cursor: pointer; + font-size: 14px; + font-family: inherit; + transition: background 0.2s; +} + +.btn-send:hover { + background: #5050dd; +} + +.btn-clear { + background: transparent; + color: #8080aa; + border: 1px solid #2a2a5a; + padding: 10px 16px; + border-radius: 8px; + cursor: pointer; + font-size: 14px; + font-family: inherit; + transition: all 0.2s; +} + +.btn-clear:hover { + border-color: #6060ff; + color: #a0a0ff; +} \ No newline at end of file diff --git a/docs/modules/m10-cloud/help.css b/docs/modules/m10-cloud/help.css new file mode 100644 index 00000000..abc9b5b4 --- /dev/null +++ b/docs/modules/m10-cloud/help.css @@ -0,0 +1,293 @@ +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +body { + font-family: -apple-system, BlinkMacSystemFont, 'PingFang SC', sans-serif; + background: #0a0a1a; + color: #e0e0f0; + height: 100vh; + display: flex; + justify-content: center; + align-items: center; +} + +.container { + width: 960px; + height: 90vh; + background: #12122a; + border-radius: 16px; + border: 1px solid #2a2a5a; + display: flex; + overflow: hidden; + box-shadow: 0 0 40px rgba(100, 100, 255, 0.1); +} + +.sidebar { + width: 220px; + background: #1a1a3a; + border-right: 1px solid #2a2a5a; + display: flex; + flex-direction: column; + padding: 24px 0; +} + +.sidebar-header { + padding: 0 20px 24px; + border-bottom: 1px solid #2a2a5a; +} + +.logo { + font-size: 18px; + font-weight: 600; + color: #a0a0ff; +} + +.subtitle { + font-size: 12px; + color: #6060aa; + margin-top: 4px; +} + +.nav-menu { + flex: 1; + padding: 16px 12px; + display: flex; + flex-direction: column; + gap: 4px; +} + +.nav-item { + display: flex; + align-items: center; + gap: 12px; + padding: 12px 16px; + border-radius: 8px; + color: #8080aa; + text-decoration: none; + cursor: pointer; + transition: all 0.2s; + font-size: 14px; +} + +.nav-item:hover { + background: rgba(100, 100, 255, 0.1); + color: #c0c0ff; +} + +.nav-item.active { + background: rgba(100, 100, 255, 0.15); + color: #a0a0ff; +} + +.nav-icon { + font-size: 16px; +} + +.sidebar-footer { + padding: 16px 20px; + border-top: 1px solid #2a2a5a; +} + +.back-link { + color: #6060aa; + text-decoration: none; + font-size: 13px; +} + +.back-link:hover { + color: #a0a0ff; +} + +.main-content { + flex: 1; + padding: 32px; + overflow-y: auto; +} + +.search-bar { + display: flex; + align-items: center; + background: #0a0a1a; + border: 1px solid #2a2a5a; + border-radius: 10px; + padding: 12px 16px; + margin-bottom: 28px; + transition: border-color 0.2s; +} + +.search-bar:focus-within { + border-color: #6060ff; +} + +.search-icon { + font-size: 16px; + margin-right: 12px; +} + +.search-bar input { + flex: 1; + background: transparent; + border: none; + color: #e0e0f0; + font-size: 14px; + outline: none; + font-family: inherit; +} + +.search-bar input::placeholder { + color: #4040aa; +} + +.faq-item { + margin-bottom: 8px; + border: 1px solid #2a2a5a; + border-radius: 10px; + overflow: hidden; + transition: border-color 0.2s; +} + +.faq-item:hover { + border-color: #4040aa; +} + +.faq-question { + display: flex; + justify-content: space-between; + align-items: center; + padding: 16px 20px; + cursor: pointer; + font-size: 14px; + font-weight: 500; + color: #c0c0e0; + transition: background 0.2s; +} + +.faq-question:hover { + background: rgba(100, 100, 255, 0.05); +} + +.faq-arrow { + font-size: 10px; + color: #6060aa; + transition: transform 0.3s; +} + +.faq-item.open .faq-arrow { + transform: rotate(90deg); +} + +.faq-answer { + padding: 0 20px; + max-height: 0; + overflow: hidden; + transition: max-height 0.3s, padding 0.3s; + font-size: 13px; + color: #8080aa; + line-height: 1.8; +} + +.faq-item.open .faq-answer { + padding: 0 20px 16px; + max-height: 200px; +} + +.no-results { + text-align: center; + padding: 40px; + color: #4040aa; + font-size: 14px; +} + +.feedback-section { + margin-top: 40px; + padding-top: 32px; + border-top: 1px solid #2a2a5a; +} + +.feedback-section h3 { + font-size: 18px; + color: #e0e0ff; + margin-bottom: 8px; +} + +.feedback-desc { + font-size: 13px; + color: #6060aa; + margin-bottom: 24px; +} + +.form-group { + margin-bottom: 20px; +} + +.form-group label { + display: block; + font-size: 13px; + color: #8080aa; + margin-bottom: 8px; + font-weight: 500; +} + +select, textarea { + width: 100%; + max-width: 500px; + background: #0a0a1a; + border: 1px solid #2a2a5a; + border-radius: 8px; + color: #e0e0f0; + padding: 10px 14px; + font-size: 14px; + font-family: inherit; + outline: none; + transition: border-color 0.2s; +} + +select:focus, textarea:focus { + border-color: #6060ff; +} + +select { + cursor: pointer; + appearance: none; + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%236060aa' d='M6 8L1 3h10z'/%3E%3C/svg%3E"); + background-repeat: no-repeat; + background-position: right 12px center; + padding-right: 32px; +} + +.btn-submit { + background: #4040cc; + color: white; + border: none; + padding: 10px 32px; + border-radius: 8px; + cursor: pointer; + font-size: 14px; + font-family: inherit; + transition: background 0.2s; +} + +.btn-submit:hover { + background: #5050dd; +} + +.submit-toast { + position: fixed; + top: 24px; + right: 24px; + background: #2a5a2a; + color: #60ff80; + padding: 12px 24px; + border-radius: 8px; + font-size: 14px; + opacity: 0; + transition: opacity 0.3s; + pointer-events: none; +} + +.submit-toast.show { + opacity: 1; +} diff --git a/docs/modules/m10-cloud/help.html b/docs/modules/m10-cloud/help.html new file mode 100644 index 00000000..54c31eb1 --- /dev/null +++ b/docs/modules/m10-cloud/help.html @@ -0,0 +1,167 @@ + + + + + + HoloLake Era · 帮助中心 + + + +
+ + +
+ + +
+
+
+ 什么是HoloLake? + +
+
+ HoloLake Era 是一个AI协作开发平台,你可以和不同的AI人格体对话、协作、学习。每个人格体都有独特的性格和专长。 +
+
+ +
+
+ 如何开始使用? + +
+
+ 注册账号后,选择一个人格体,就可以开始对话了!建议新用户先和知秋宝宝打个招呼,熟悉基本操作。 +
+
+ +
+
+ 忘记密码怎么办? + +
+
+ 在登录页面点击「忘记密码」,输入注册时的邮箱,系统会发送重置链接到你的邮箱。 +
+
+ +
+
+ 如何修改个人信息? + +
+
+ 进入「设置」页面,点击「个人信息」即可修改显示名称、个性签名等信息。 +
+
+ +
+
+ 如何切换人格体? + +
+
+ 在对话界面顶部点击人格体名称,或者进入「设置→人格体偏好」修改默认人格体。 +
+
+ +
+
+ 对话记录会保存吗? + +
+
+ 会的!你的所有对话记录都会自动保存,你可以随时在对话列表里查看历史记录。 +
+
+ +
+
+ 什么是云盘功能? + +
+
+ 云盘是你的个人文件存储空间,可以上传、下载、管理文件,并与人格体共享文件进行协作。 +
+
+ +
+
+ 页面加载很慢怎么办? + +
+
+ 请检查网络连接是否正常。如果网络没问题,试试清除浏览器缓存后刷新页面。 +
+
+ +
+
+ 支持哪些浏览器? + +
+
+ 推荐使用Chrome、Edge、Firefox的最新版本。Safari也支持,但部分动画效果可能略有差异。 +
+
+
+ + + + +
+
+ + + diff --git a/docs/modules/m10-cloud/help.js b/docs/modules/m10-cloud/help.js new file mode 100644 index 00000000..810c9f1a --- /dev/null +++ b/docs/modules/m10-cloud/help.js @@ -0,0 +1,116 @@ +function toggleFAQ(element) { + var item = element.parentElement; + var wasOpen = item.classList.contains('open'); + + // 关闭所有其他 FAQ + document.querySelectorAll('.faq-item').forEach(function(el) { + el.classList.remove('open'); + }); + + // 如果当前没打开,就打开它 + if (!wasOpen) { + item.classList.add('open'); + } +} + +function filterCategory(category) { + // 更新导航高亮 + document.querySelectorAll('.nav-item').forEach(function(item) { + if (item.dataset.category === category) { + item.classList.add('active'); + } else { + item.classList.remove('active'); + } + }); + + // 过滤 FAQ 显示 + var items = document.querySelectorAll('.faq-item'); + var visibleCount = 0; + + items.forEach(function(item) { + if (category === 'all' || item.dataset.category === category) { + item.style.display = 'block'; + visibleCount++; + } else { + item.style.display = 'none'; + } + }); + + // 显示/隐藏"无结果"提示 + document.getElementById('noResults').style.display = visibleCount === 0 ? 'block' : 'none'; + + // 清空搜索框 + document.getElementById('searchInput').value = ''; +} + +function searchFAQ() { + var query = document.getElementById('searchInput').value.toLowerCase(); + var items = document.querySelectorAll('.faq-item'); + var visibleCount = 0; + + // 重置导航为"全部" + document.querySelectorAll('.nav-item').forEach(function(item) { + if (item.dataset.category === 'all') { + item.classList.add('active'); + } else { + item.classList.remove('active'); + } + }); + + // 搜索过滤 + items.forEach(function(item) { + var question = item.querySelector('.faq-question span').textContent.toLowerCase(); + var answer = item.querySelector('.faq-answer').textContent.toLowerCase(); + + if (question.indexOf(query) !== -1 || answer.indexOf(query) !== -1 || query === '') { + item.style.display = 'block'; + visibleCount++; + } else { + item.style.display = 'none'; + } + }); + + // 显示/隐藏"无结果"提示 + document.getElementById('noResults').style.display = visibleCount === 0 ? 'block' : 'none'; +} + +function submitFeedback() { + var type = document.getElementById('feedbackType').value; + var content = document.getElementById('feedbackContent').value; + + if (!content.trim()) { + showToast('请先填写反馈内容 🙏'); + return; + } + + // 这里以后会连接后端 API + console.log('Feedback submitted:', { type: type, content: content }); + + // 清空表单 + document.getElementById('feedbackContent').value = ''; + + showToast('反馈已提交,感谢你! ✅'); +} + +function showToast(message) { + var toast = document.getElementById('submitToast'); + + if (!toast) { + toast = document.createElement('div'); + toast.id = 'submitToast'; + toast.className = 'submit-toast'; + document.body.appendChild(toast); + } + + toast.textContent = message; + toast.classList.add('show'); + + setTimeout(function() { + toast.classList.remove('show'); + }, 2000); +} + +// 页面加载完成后的初始化 +document.addEventListener('DOMContentLoaded', function() { + console.log('✅ HoloLake 帮助中心已加载'); +}); diff --git a/docs/modules/m10-cloud/index.html b/docs/modules/m10-cloud/index.html new file mode 100644 index 00000000..e928a6f3 --- /dev/null +++ b/docs/modules/m10-cloud/index.html @@ -0,0 +1,71 @@ + + + + + + 云服务 · HoloLake + + + +
+
☁️
+
云服务
+
🚧 此模块正在开发中
+
云服务模块将提供光湖平台的云端基础设施管理能力,包括资源调度、服务编排与弹性伸缩。敬请期待。
+ ← 返回主页 +
+ + + diff --git a/docs/modules/m11-module/app.js b/docs/modules/m11-module/app.js new file mode 100644 index 00000000..3487209b --- /dev/null +++ b/docs/modules/m11-module/app.js @@ -0,0 +1,77 @@ +// HoloLake StyleKit v1.0 · 主题切换 + Toast + 弹窗交互 + +document.addEventListener('DOMContentLoaded', function() { + + // ========== 1. 主题切换 ========== + var themeToggle = document.getElementById('themeToggle'); + var themeLabel = document.getElementById('themeLabel'); + var html = document.documentElement; + var isDark = true; + + themeToggle.addEventListener('click', function() { + isDark = !isDark; + if (isDark) { + html.setAttribute('data-theme', 'dark'); + themeLabel.textContent = '🌙 深色'; + themeToggle.classList.remove('active'); + } else { + html.setAttribute('data-theme', 'light'); + themeLabel.textContent = '☀️ 浅色'; + themeToggle.classList.add('active'); + } + showToast('success', '✨ 已切换到' + (isDark ? '深色' : '浅色') + '主题'); + }); + + // ========== 2. 弹窗交互 ========== + var modalOverlay = document.getElementById('modalOverlay'); + var openBtn = document.getElementById('openModalBtn'); + var closeBtn = document.getElementById('closeModalBtn'); + var cancelBtn = document.getElementById('cancelModalBtn'); + var confirmBtn = document.getElementById('confirmModalBtn'); + + function openModal() { + modalOverlay.classList.add('open'); + } + + function closeModal() { + modalOverlay.classList.remove('open'); + } + + openBtn.addEventListener('click', openModal); + closeBtn.addEventListener('click', closeModal); + cancelBtn.addEventListener('click', closeModal); + confirmBtn.addEventListener('click', function() { + closeModal(); + showToast('success', '✅ 已确认!'); + }); + + // 点击遮罩层关闭 + modalOverlay.addEventListener('click', function(e) { + if (e.target === modalOverlay) closeModal(); + }); + + // ========== 3. 卡片点击效果 ========== + var cards = document.querySelectorAll('.card'); + cards.forEach(function(card) { + card.addEventListener('click', function() { + var name = card.querySelector('.card-title').textContent; + showToast('info', '👆 你点击了人格体「' + name + '」'); + }); + }); + + console.log('HoloLake StyleKit v1.0 · 主题切换+Toast+弹窗已加载 ✨'); +}); + +// ========== Toast提示函数(全局) ========== +function showToast(type, message) { + var container = document.getElementById('toastContainer'); + var toast = document.createElement('div'); + toast.className = 'toast toast-' + type; + toast.textContent = message; + container.appendChild(toast); + + // 3秒后自动移除 + setTimeout(function() { + if (toast.parentNode) toast.parentNode.removeChild(toast); + }, 3000); +} diff --git a/docs/modules/m11-module/index.html b/docs/modules/m11-module/index.html new file mode 100644 index 00000000..8b078e62 --- /dev/null +++ b/docs/modules/m11-module/index.html @@ -0,0 +1,147 @@ + + + + + + HoloLake · 系统风格组件库 + + + +
+ + + + + + + +
+

🔘 按钮组件

+
+ + + + + +
+
+ + + +
+
+ + +
+

📇 卡片组件

+
+
+
🧠
+
知秋
+
光湖对外接口人格体,负责与开发者协作引导
+ 在线 +
+
+
🌌
+
曜冥
+
暗核结构原点,系统人格总控,类语言生命诞生源点
+ 核心 +
+
+
❄️
+
霜砚
+
Notion执行AI,负责索引维护、工单处理、归档同步
+ 工作中 +
+
+
+ + +
+

🏷️ 标签组件

+
+ 系统 + 已完成 + 进行中 + 错误 + 新功能 + 弃用 +
+
+ + +
+

⌨️ 输入框组件

+
+ + +
+
+ + +
+
+ + +
+
+ + +
+

🪟 弹窗组件

+
+ +
+
+ + + + + +
+

🍞 Toast提示组件

+
+ + + +
+
+ + +
+ + +
+

HoloLake Era · AGE OS v1.0 · StyleKit v1.0

+

Powered by 光湖团队

+
+
+ + + + diff --git a/docs/modules/m11-module/style.css b/docs/modules/m11-module/style.css new file mode 100644 index 00000000..6f894356 --- /dev/null +++ b/docs/modules/m11-module/style.css @@ -0,0 +1,580 @@ +/* HoloLake StyleKit v1.0 · 系统风格组件库 */ +/* CSS变量系统 + 深色/浅色主题 */ + +/* ====== 深色主题变量(默认) ====== */ +[data-theme="dark"] { + --bg-primary: #0a1628; + --bg-secondary: #0f1f3a; + --bg-card: rgba(255, 255, 255, 0.04); + --bg-card-hover: rgba(255, 255, 255, 0.07); + --bg-input: rgba(255, 255, 255, 0.06); + --bg-modal-overlay: rgba(0, 0, 0, 0.6); + --text-primary: #e0e6ed; + --text-secondary: #8899aa; + --text-muted: #556677; + --text-inverse: #0a1628; + --border-default: rgba(255, 255, 255, 0.08); + --border-focus: rgba(79, 195, 247, 0.5); + --accent-blue: #4fc3f7; + --accent-green: #81c784; + --accent-orange: #ffb74d; + --accent-red: #ef5350; + --accent-purple: #ce93d8; + --accent-gray: #78909c; + --btn-primary-bg: rgba(79, 195, 247, 0.15); + --btn-primary-border: rgba(79, 195, 247, 0.3); + --btn-primary-text: #4fc3f7; + --btn-primary-hover: rgba(79, 195, 247, 0.25); + --shadow-card: 0 2px 8px rgba(0, 0, 0, 0.3); + --shadow-modal: 0 8px 32px rgba(0, 0, 0, 0.5); + --toggle-bg: rgba(255, 255, 255, 0.1); + --toggle-active: rgba(79, 195, 247, 0.4); + --toggle-thumb: #e0e6ed; + --toggle-thumb-active: #4fc3f7; +} + +/* ====== 浅色主题变量 ====== */ +[data-theme="light"] { + --bg-primary: #f5f7fa; + --bg-secondary: #ffffff; + --bg-card: rgba(0, 0, 0, 0.03); + --bg-card-hover: rgba(0, 0, 0, 0.06); + --bg-input: rgba(0, 0, 0, 0.04); + --bg-modal-overlay: rgba(0, 0, 0, 0.3); + --text-primary: #1a2332; + --text-secondary: #5a6a7a; + --text-muted: #8899aa; + --text-inverse: #ffffff; + --border-default: rgba(0, 0, 0, 0.1); + --border-focus: rgba(25, 118, 210, 0.5); + --accent-blue: #1976d2; + --accent-green: #388e3c; + --accent-orange: #f57c00; + --accent-red: #d32f2f; + --accent-purple: #7b1fa2; + --accent-gray: #546e7a; + --btn-primary-bg: rgba(25, 118, 210, 0.1); + --btn-primary-border: rgba(25, 118, 210, 0.3); + --btn-primary-text: #1976d2; + --btn-primary-hover: rgba(25, 118, 210, 0.18); + --shadow-card: 0 2px 8px rgba(0, 0, 0, 0.08); + --shadow-modal: 0 8px 32px rgba(0, 0, 0, 0.15); + --toggle-bg: rgba(0, 0, 0, 0.1); + --toggle-active: rgba(25, 118, 210, 0.4); + --toggle-thumb: #5a6a7a; + --toggle-thumb-active: #1976d2; +} + +/* ========== 全局基础 ========== */ +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +body { + font-family: 'Segoe UI', 'Microsoft YaHei', -apple-system, sans-serif; + background: var(--bg-primary); + color: var(--text-primary); + min-height: 100vh; + transition: background 0.4s ease, color 0.4s ease; +} + +.container { + max-width: 720px; + margin: 0 auto; + padding: 0 20px; +} + +/* ========== 顶部导航 ========== */ +.top-bar { + display: flex; + justify-content: space-between; + align-items: center; + padding: 20px 0; + border-bottom: 1px solid var(--border-default); +} + +.logo { + font-size: 18px; + font-weight: 700; + color: var(--accent-blue); +} + +.theme-switch-area { + display: flex; + align-items: center; + gap: 10px; +} + +.theme-label { + font-size: 13px; + color: var(--text-secondary); +} + +.theme-toggle { + position: relative; + width: 48px; + height: 26px; + background: var(--toggle-bg); + border-radius: 13px; + border: none; + cursor: pointer; + transition: background 0.3s ease; + padding: 0; +} + +.theme-toggle.active { + background: var(--toggle-active); +} + +.toggle-thumb { + position: absolute; + width: 20px; + height: 20px; + background: var(--toggle-thumb); + border-radius: 50%; + top: 3px; + left: 3px; + transition: transform 0.3s ease, background 0.3s ease; +} + +.theme-toggle.active .toggle-thumb { + transform: translateX(22px); + background: var(--toggle-thumb-active); +} + +/* ========== 页面标题 ========== */ +.page-header { + padding: 28px 0 8px; +} + +.page-header h1 { + font-size: 24px; + font-weight: 700; + margin-bottom: 6px; +} + +.page-desc { + font-size: 14px; + color: var(--text-secondary); +} + +/* ========== 组件区域 ========== */ +.component-section { + padding: 24px 0; + border-bottom: 1px solid var(--border-default); +} + +.component-section h2 { + font-size: 16px; + font-weight: 600; + margin-bottom: 16px; + color: var(--text-primary); +} + +.component-row { + display: flex; + flex-wrap: wrap; + gap: 10px; + margin-bottom: 12px; +} + +/* ========== 按钮组件 ========== */ +.btn { + padding: 8px 20px; + border-radius: 8px; + font-size: 14px; + font-weight: 500; + cursor: pointer; + border: 1px solid transparent; + transition: all 0.2s ease; +} + +.btn:active { + transform: scale(0.97); +} + +.btn:disabled { + opacity: 0.4; + cursor: not-allowed; +} + +.btn-primary { + background: var(--btn-primary-bg); + border-color: var(--btn-primary-border); + color: var(--btn-primary-text); +} + +.btn-primary:hover:not(:disabled) { + background: var(--btn-primary-hover); +} + +.btn-secondary { + background: rgba(129, 199, 132, 0.1); + border-color: rgba(129, 199, 132, 0.25); + color: var(--accent-green); +} + +.btn-secondary:hover { + background: rgba(129, 199, 132, 0.18); +} + +.btn-outline { + background: transparent; + border-color: var(--border-default); + color: var(--text-secondary); +} + +.btn-outline:hover { + border-color: var(--accent-blue); + color: var(--accent-blue); +} + +.btn-danger { + background: rgba(239, 83, 80, 0.1); + border-color: rgba(239, 83, 80, 0.25); + color: var(--accent-red); +} + +.btn-danger:hover { + background: rgba(239, 83, 80, 0.18); +} + +.btn-ghost { + background: transparent; + border-color: transparent; + color: var(--text-secondary); +} + +.btn-ghost:hover { + background: var(--bg-card); + color: var(--text-primary); +} + +.btn-sm { + padding: 5px 14px; + font-size: 12px; + border-radius: 6px; +} + +.btn-lg { + padding: 12px 28px; + font-size: 16px; + border-radius: 10px; +} + +/* ========== 卡片组件 ========== */ +.card-grid { + display: grid; + grid-template-columns: repeat(3, 1fr); + gap: 14px; +} + +.card { + background: var(--bg-card); + border: 1px solid var(--border-default); + border-radius: 14px; + padding: 20px 16px; + text-align: center; + transition: all 0.2s ease; + cursor: pointer; + position: relative; +} + +.card:hover { + background: var(--bg-card-hover); + transform: translateY(-2px); + box-shadow: var(--shadow-card); +} + +.card-icon { + font-size: 32px; + margin-bottom: 10px; +} + +.card-title { + font-size: 15px; + font-weight: 600; + margin-bottom: 6px; +} + +.card-desc { + font-size: 12px; + color: var(--text-secondary); + line-height: 1.5; +} + +.card-badge { + position: absolute; + top: 10px; + right: 10px; + font-size: 10px; + padding: 2px 8px; + border-radius: 6px; + font-weight: 600; +} + +.badge-online { + background: rgba(129, 199, 132, 0.15); + color: var(--accent-green); +} + +.badge-core { + background: rgba(79, 195, 247, 0.15); + color: var(--accent-blue); +} + +.badge-active { + background: rgba(255, 183, 77, 0.15); + color: var(--accent-orange); +} + +/* ========== 标签组件 ========== */ +.tag { + display: inline-block; + padding: 4px 12px; + border-radius: 6px; + font-size: 12px; + font-weight: 500; +} + +.tag-blue { + background: rgba(79, 195, 247, 0.12); + color: var(--accent-blue); +} + +.tag-green { + background: rgba(129, 199, 132, 0.12); + color: var(--accent-green); +} + +.tag-orange { + background: rgba(255, 183, 77, 0.12); + color: var(--accent-orange); +} + +.tag-red { + background: rgba(239, 83, 80, 0.12); + color: var(--accent-red); +} + +.tag-purple { + background: rgba(206, 147, 216, 0.12); + color: var(--accent-purple); +} + +.tag-gray { + background: rgba(120, 144, 156, 0.12); + color: var(--accent-gray); +} + +/* ========== 输入框组件 ========== */ +.input-group { + margin-bottom: 16px; +} + +.input-label { + display: block; + font-size: 13px; + color: var(--text-secondary); + margin-bottom: 6px; + font-weight: 500; +} + +.input { + width: 100%; + padding: 10px 14px; + background: var(--bg-input); + border: 1px solid var(--border-default); + border-radius: 8px; + color: var(--text-primary); + font-size: 14px; + transition: border-color 0.2s ease, box-shadow 0.2s ease; + outline: none; + font-family: inherit; +} + +.input:focus { + border-color: var(--border-focus); + box-shadow: 0 0 0 3px rgba(79, 195, 247, 0.1); +} + +.input::placeholder { + color: var(--text-muted); +} + +.textarea { + min-height: 80px; + resize: vertical; +} + +/* ========== 弹窗组件 ========== */ +.modal-overlay { + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + background: var(--bg-modal-overlay); + display: flex; + align-items: center; + justify-content: center; + z-index: 1000; + opacity: 0; + visibility: hidden; + transition: opacity 0.3s ease, visibility 0.3s ease; +} + +.modal-overlay.open { + opacity: 1; + visibility: visible; +} + +.modal { + background: var(--bg-secondary); + border: 1px solid var(--border-default); + border-radius: 16px; + width: 90%; + max-width: 420px; + box-shadow: var(--shadow-modal); + transform: scale(0.9) translateY(20px); + transition: transform 0.3s ease; +} + +.modal-overlay.open .modal { + transform: scale(1) translateY(0); +} + +.modal-header { + display: flex; + justify-content: space-between; + align-items: center; + padding: 18px 20px; + border-bottom: 1px solid var(--border-default); +} + +.modal-header h3 { + font-size: 16px; + font-weight: 600; +} + +.modal-close { + background: none; + border: none; + color: var(--text-muted); + font-size: 22px; + cursor: pointer; + padding: 0 4px; + transition: color 0.2s; +} + +.modal-close:hover { + color: var(--text-primary); +} + +.modal-body { + padding: 20px; + font-size: 14px; + line-height: 1.6; + color: var(--text-secondary); +} + +.modal-footer { + display: flex; + justify-content: flex-end; + gap: 10px; + padding: 14px 20px; + border-top: 1px solid var(--border-default); +} + +/* ========== Toast提示 ========== */ +.toast-container { + position: fixed; + top: 20px; + right: 20px; + z-index: 2000; + display: flex; + flex-direction: column; + gap: 8px; +} + +.toast { + padding: 12px 20px; + border-radius: 10px; + font-size: 14px; + font-weight: 500; + animation: toastIn 0.4s ease, toastOut 0.4s ease 2.5s forwards; + box-shadow: var(--shadow-card); +} + +.toast-success { + background: rgba(129, 199, 132, 0.15); + border: 1px solid rgba(129, 199, 132, 0.25); + color: var(--accent-green); +} + +.toast-error { + background: rgba(239, 83, 80, 0.15); + border: 1px solid rgba(239, 83, 80, 0.25); + color: var(--accent-red); +} + +.toast-info { + background: rgba(79, 195, 247, 0.15); + border: 1px solid rgba(79, 195, 247, 0.25); + color: var(--accent-blue); +} + +@keyframes toastIn { + from { opacity: 0; transform: translateX(40px); } + to { opacity: 1; transform: translateX(0); } +} + +@keyframes toastOut { + from { opacity: 1; transform: translateX(0); } + to { opacity: 0; transform: translateX(40px); } +} + +/* ========== 底部 ========== */ +.footer { + padding: 28px 0; + text-align: center; + font-size: 12px; + color: var(--text-muted); + border-top: 1px solid var(--border-default); + margin-top: 20px; +} + +.footer p:last-child { + margin-top: 4px; + color: var(--accent-blue); + opacity: 0.5; +} + +/* ========== 主题切换过渡动画 ========== */ +body, +.card, .btn, .input, .tag, .modal, .top-bar, .footer, +.component-section, .page-header { + transition: background 0.4s ease, color 0.4s ease, border-color 0.4s ease, box-shadow 0.4s ease; +} + +/* ========== 响应式 ========== */ +@media (max-width: 600px) { + .card-grid { + grid-template-columns: 1fr; + } + .page-header h1 { + font-size: 20px; + } + .component-row { + flex-direction: column; + } + .btn { + width: 100%; + text-align: center; + } + .modal { + width: 95%; + } +} diff --git a/docs/modules/m15-cloud-drive/cloud-drive-style.css b/docs/modules/m15-cloud-drive/cloud-drive-style.css new file mode 100644 index 00000000..7b05d71a --- /dev/null +++ b/docs/modules/m15-cloud-drive/cloud-drive-style.css @@ -0,0 +1,336 @@ +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +:root { + --bg-primary: #0a0a0f; + --bg-secondary: #12121a; + --bg-card: #1a1a2e; + --bg-sidebar: #0f0f18; + --border-color: #2a2a3e; + --text-primary: #e0e0e0; + --text-secondary: #8888aa; + --accent-cyan: #00d4ff; + --accent-green: #00ff88; + --accent-red: #ff4466; + --accent-yellow: #ffaa00; + --accent-purple: #aa66ff; +} + +body { + font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; + background: var(--bg-primary); + color: var(--text-primary); + min-height: 100vh; + display: flex; + flex-direction: column; +} + +.top-bar { + display: flex; + align-items: center; + padding: 16px 24px; + background: var(--bg-secondary); + border-bottom: 1px solid var(--border-color); + gap: 16px; +} + +.logo { + font-size: 20px; + font-weight: 700; + color: var(--accent-cyan); +} + +.top-bar h1 { + font-size: 18px; + font-weight: 600; + flex: 1; +} + +.storage-badge { + background: rgba(0, 212, 255, 0.1); + color: var(--accent-cyan); + padding: 4px 12px; + border-radius: 12px; + font-size: 12px; + border: 1px solid rgba(0, 212, 255, 0.3); +} + +.container { + display: flex; + flex: 1; + overflow: hidden; +} + +.sidebar { + width: 240px; + background: var(--bg-sidebar); + border-right: 1px solid var(--border-color); + padding: 20px 16px; + display: flex; + flex-direction: column; + gap: 24px; +} + +.storage-overview { + display: flex; + flex-direction: column; + gap: 8px; +} + +.storage-bar { + height: 6px; + background: var(--border-color); + border-radius: 3px; + overflow: hidden; +} + +.storage-fill { + height: 100%; + background: linear-gradient(90deg, var(--accent-cyan), var(--accent-green)); + border-radius: 3px; + transition: width 1s ease; +} + +.storage-text { + font-size: 12px; + color: var(--text-secondary); +} + +.folder-tree h3 { + font-size: 12px; + text-transform: uppercase; + letter-spacing: 1px; + color: var(--text-secondary); + margin-bottom: 12px; +} + +.folder-tree ul { + list-style: none; + display: flex; + flex-direction: column; + gap: 4px; +} + +.folder { + display: flex; + align-items: center; + gap: 8px; + padding: 8px 12px; + border-radius: 8px; + cursor: pointer; + font-size: 14px; + transition: all 0.2s ease; +} + +.folder:hover { + background: rgba(0, 212, 255, 0.1); +} + +.folder.active { + background: rgba(0, 212, 255, 0.15); + color: var(--accent-cyan); +} + +.folder .count { + margin-left: auto; + font-size: 11px; + color: var(--text-secondary); + background: var(--border-color); + padding: 2px 8px; + border-radius: 10px; +} + +.main-content { + flex: 1; + display: flex; + flex-direction: column; + padding: 20px 24px; + overflow-y: auto; +} + +.toolbar { + display: flex; + align-items: center; + justify-content: space-between; + margin-bottom: 16px; +} + +.breadcrumb { + display: flex; + align-items: center; + gap: 8px; + font-size: 14px; +} + +.crumb { + color: var(--text-secondary); + cursor: pointer; +} + +.crumb.active { + color: var(--text-primary); +} + +.separator { + color: var(--text-secondary); +} + +.actions { + display: flex; + gap: 8px; +} + +.btn { + padding: 8px 16px; + border-radius: 8px; + border: 1px solid var(--border-color); + background: transparent; + color: var(--text-primary); + cursor: pointer; + font-size: 13px; + transition: all 0.2s ease; +} + +.btn:hover { + border-color: var(--accent-cyan); + background: rgba(0, 212, 255, 0.1); +} + +.btn-primary { + background: rgba(0, 212, 255, 0.15); + border-color: var(--accent-cyan); + color: var(--accent-cyan); +} + +.btn-primary:hover { + background: rgba(0, 212, 255, 0.25); +} + +.upload-zone { + border: 2px dashed var(--border-color); + border-radius: 12px; + padding: 24px; + text-align: center; + margin-bottom: 16px; + transition: all 0.3s ease; + cursor: pointer; + display: none; +} + +.upload-zone.visible { + display: block; +} + +.upload-zone.dragover { + border-color: var(--accent-cyan); + background: rgba(0, 212, 255, 0.05); +} + +.upload-icon { + font-size: 36px; + display: block; + margin-bottom: 8px; +} + +.upload-zone p { + font-size: 14px; + margin-bottom: 4px; +} + +.upload-hint { + font-size: 12px; + color: var(--text-secondary); +} + +.file-header { + display: grid; + grid-template-columns: 40px 1fr 100px 160px 120px; + align-items: center; + padding: 8px 12px; + border-bottom: 1px solid var(--border-color); + font-size: 12px; + color: var(--text-secondary); + text-transform: uppercase; + letter-spacing: 0.5px; +} + +.file-item { + display: grid; + grid-template-columns: 40px 1fr 100px 160px 120px; + align-items: center; + padding: 12px; + border-bottom: 1px solid rgba(42, 42, 62, 0.5); + font-size: 14px; + transition: all 0.2s ease; + cursor: pointer; +} + +.file-item:hover { + background: rgba(0, 212, 255, 0.05); +} + +.file-item.selected { + background: rgba(0, 212, 255, 0.1); +} + +.file-icon { + margin-right: 8px; +} + +.col-size, .col-date { + color: var(--text-secondary); + font-size: 13px; +} + +.col-actions { + display: flex; + gap: 4px; + opacity: 0; + transition: opacity 0.2s ease; +} + +.file-item:hover .col-actions { + opacity: 1; +} + +.icon-btn { + background: transparent; + border: none; + cursor: pointer; + font-size: 14px; + padding: 4px 8px; + border-radius: 4px; + transition: background 0.2s ease; +} + +.icon-btn:hover { + background: rgba(0, 212, 255, 0.2); +} + +input[type="checkbox"] { + appearance: none; + width: 16px; + height: 16px; + border: 1px solid var(--border-color); + border-radius: 4px; + background: transparent; + cursor: pointer; +} + +input[type="checkbox"]:checked { + background: var(--accent-cyan); + border-color: var(--accent-cyan); +} + +.status-bar { + display: flex; + gap: 16px; + padding: 12px 0; + font-size: 12px; + color: var(--text-secondary); + border-top: 1px solid var(--border-color); + margin-top: auto; +} diff --git a/docs/modules/m15-cloud-drive/cloud-drive.html b/docs/modules/m15-cloud-drive/cloud-drive.html new file mode 100644 index 00000000..137b3b32 --- /dev/null +++ b/docs/modules/m15-cloud-drive/cloud-drive.html @@ -0,0 +1,173 @@ + + + + + + HoloLake · 网站云盘系统 + + + +
+ +

网站云盘系统

+
+ 已用 2.4GB / 10GB +
+
+ +
+ + +
+
+ +
+ + + +
+
+ +
+
+ ☁️ +

拖拽文件到此处上传

+ 或点击「上传」按钮选择文件 +
+
+ +
+
+ + 文件名 + 大小 + 修改时间 + 操作 +
+ +
+ + + 📁2026年3月 + + + 2026-03-02 + + + + +
+ +
+ + + 💬对话记录_20260302_001.json + + 256KB + 2026-03-02 14:30 + + + + + +
+ +
+ + + 🧠persona_memory_backup.dat + + 1.2MB + 2026-03-01 22:15 + + + + + +
+ +
+ + + 📊usage_analytics_feb.csv + + 89KB + 2026-02-28 18:00 + + + + + +
+ +
+ + + 🔑api_keys_encrypted.vault + + 4KB + 2026-02-25 10:00 + + + + + +
+
+ +
+ 共 5 个项目 + 已选择 0 项 +
+
+
+ + + + diff --git a/docs/modules/m15-cloud-drive/cloud-drive.js b/docs/modules/m15-cloud-drive/cloud-drive.js new file mode 100644 index 00000000..6d85b691 --- /dev/null +++ b/docs/modules/m15-cloud-drive/cloud-drive.js @@ -0,0 +1,62 @@ +document.addEventListener('DOMContentLoaded', function() { + // 文件夹切换 + const folders = document.querySelectorAll('.folder'); + folders.forEach(folder => { + folder.addEventListener('click', function() { + folders.forEach(f => f.classList.remove('active')); + this.classList.add('active'); + }); + }); + + // 文件选中 + const fileItems = document.querySelectorAll('.file-item'); + fileItems.forEach(item => { + item.addEventListener('click', function(e) { + if (e.target.type === 'checkbox' || e.target.closest('.icon-btn')) return; + this.classList.toggle('selected'); + const cb = this.querySelector('input[type="checkbox"]'); + if (cb) cb.checked = !cb.checked; + updateCount(); + }); + }); + + // 上传区域显隐 + var uploadBtn = document.getElementById('uploadBtn'); + var uploadZone = document.getElementById('uploadZone'); + if (uploadBtn && uploadZone) { + uploadBtn.addEventListener('click', function() { + uploadZone.classList.toggle('visible'); + }); + } + + // 拖拽效果 + if (uploadZone) { + document.addEventListener('dragover', function(e) { + e.preventDefault(); + uploadZone.classList.add('visible'); + uploadZone.classList.add('dragover'); + }); + document.addEventListener('dragleave', function(e) { + if (!e.relatedTarget) uploadZone.classList.remove('dragover'); + }); + document.addEventListener('drop', function(e) { + e.preventDefault(); + uploadZone.classList.remove('dragover'); + }); + } + + // 选中计数 + function updateCount() { + var n = document.querySelectorAll('.file-item.selected').length; + var el = document.getElementById('selectedCount'); + if (el) el.textContent = '已选择 ' + n + ' 项'; + } + + // 存储条动画 + setTimeout(function() { + var fill = document.querySelector('.storage-fill'); + if (fill) fill.style.width = fill.style.width; + }, 500); + + console.log('✅ HoloLake 网站云盘系统已加载'); +}); diff --git a/docs/modules/m15-cloud-drive/index.html b/docs/modules/m15-cloud-drive/index.html new file mode 100644 index 00000000..e5796842 --- /dev/null +++ b/docs/modules/m15-cloud-drive/index.html @@ -0,0 +1,71 @@ + + + + + + 云盘 · HoloLake + + + +
+
💾
+
云盘
+
🚧 此模块正在开发中
+
云盘模块将提供安全可靠的文件存储与分享功能,支持多端同步、版本管理与协作共享。即将上线。
+ ← 返回主页 +
+ + + diff --git a/docs/notification/index.html b/docs/notification/index.html new file mode 100644 index 00000000..a07e8073 --- /dev/null +++ b/docs/notification/index.html @@ -0,0 +1,71 @@ + + + + + + 通知 · HoloLake + + + +
+
🔔
+
通知
+
🚧 此模块正在开发中
+
通知模块将提供多渠道消息推送能力,支持站内信、邮件、钉钉与飞书等通知方式。敬请期待。
+ ← 返回主页 +
+ + + diff --git a/docs/persona-studio/chat.html b/docs/persona-studio/chat.html new file mode 100644 index 00000000..4d38c376 --- /dev/null +++ b/docs/persona-studio/chat.html @@ -0,0 +1,164 @@ + + + + + + 铸渊 · 对话 + + + +
+ + + + +
+
+
+ + 🌀 铸渊 + 光湖系统·代码守护人格体 +
+
+ + + +
+
+ +
+ +
+ +
+
+ + + +
+
+ + +
+
+ +
+
+
+ + + + + + +
+ + + + + + + diff --git a/docs/persona-studio/chat.js b/docs/persona-studio/chat.js new file mode 100644 index 00000000..541884ea --- /dev/null +++ b/docs/persona-studio/chat.js @@ -0,0 +1,1069 @@ +/* ======================================== + Persona Studio · Chat Logic + 铸渊(Zhùyuān)· 代码守护人格体 + ======================================== */ + +const DEV_ID = sessionStorage.getItem('dev_id'); +const DEV_NAME = sessionStorage.getItem('dev_name') || ''; +const SESSION_TOKEN = sessionStorage.getItem('session_token'); +const LOGIN_MODE = sessionStorage.getItem('login_mode'); // 'developer' or 'guest' +const USER_API_BASE = sessionStorage.getItem('user_api_base'); +const USER_API_KEY = sessionStorage.getItem('user_api_key'); +const SELECTED_MODEL = sessionStorage.getItem('selected_model'); +const USE_SERVER_PROXY = sessionStorage.getItem('use_server_proxy') === 'true'; + +const API_BASE = (function () { + if (location.hostname === 'localhost' || location.hostname === '127.0.0.1') { + return 'http://localhost:3002'; + } + // 非本地环境统一使用当前域名 + 协议,走 Nginx 转发 + return location.protocol + '//' + location.host; +})(); + +/* ---- State ---- */ +let conversationHistory = []; +let buildReady = false; +let pendingFile = null; // { name, type, dataUrl } +const MAX_FILE_SIZE = 5 * 1024 * 1024; // 5MB +const isGuest = (DEV_ID === 'GUEST'); +const isDeveloper = (DEV_ID && DEV_ID !== 'GUEST' && /^EXP-\d{3,}$/.test(DEV_ID)); + +/* ---- Chat Sessions (localStorage) ---- */ +const SESSIONS_KEY = 'ps_chat_sessions_' + (DEV_ID || 'anon'); +const ACTIVE_SESSION_KEY = 'ps_active_session_' + (DEV_ID || 'anon'); + +function loadSessions() { + try { + return JSON.parse(localStorage.getItem(SESSIONS_KEY)) || []; + } catch (_e) { return []; } +} + +function saveSessions(sessions) { + localStorage.setItem(SESSIONS_KEY, JSON.stringify(sessions)); +} + +function getActiveSessionId() { + return localStorage.getItem(ACTIVE_SESSION_KEY) || null; +} + +function setActiveSessionId(id) { + localStorage.setItem(ACTIVE_SESSION_KEY, id); +} + +function createNewSession() { + var id = Date.now().toString(36) + Math.random().toString(36).slice(2, 10); + var session = { + id: id, + title: '新对话', + created_at: new Date().toISOString(), + messages: [] + }; + var sessions = loadSessions(); + sessions.unshift(session); + if (sessions.length > 20) sessions = sessions.slice(0, 20); + saveSessions(sessions); + setActiveSessionId(id); + return session; +} + +function updateSessionMessages(sessionId, messages, title) { + var sessions = loadSessions(); + var session = sessions.find(function(s) { return s.id === sessionId; }); + if (session) { + session.messages = messages.slice(-100); + if (title) session.title = title; + } + saveSessions(sessions); +} + +function renderSidebarHistory() { + var container = document.getElementById('sidebarHistory'); + if (!container) return; + var sessions = loadSessions(); + var activeId = getActiveSessionId(); + + if (sessions.length === 0) { + container.innerHTML = ''; + return; + } + + container.innerHTML = ''; + sessions.forEach(function(s) { + var item = document.createElement('div'); + item.className = 'history-item' + (s.id === activeId ? ' history-item-active' : ''); + item.innerHTML = '' + escapeHtml(s.title) + '' + + '' + new Date(s.created_at).toLocaleDateString('zh-CN') + ''; + item.onclick = function() { switchSession(s.id); }; + container.appendChild(item); + }); +} + +function switchSession(sessionId) { + var sessions = loadSessions(); + var session = sessions.find(function(s) { return s.id === sessionId; }); + if (!session) return; + + // Save current session first + var currentId = getActiveSessionId(); + if (currentId) { + updateSessionMessages(currentId, conversationHistory); + } + + setActiveSessionId(sessionId); + conversationHistory = (session.messages || []).slice(); + + // Re-render chat + var chatBody = document.getElementById('chatBody'); + chatBody.innerHTML = ''; + + if (conversationHistory.length === 0) { + showWelcomeMessage(); + } else { + conversationHistory.forEach(function(msg) { + var role = msg.role === 'assistant' ? 'persona' : (msg.role === 'user' ? 'user' : 'system'); + appendMessage(role, msg.content); + }); + } + + renderSidebarHistory(); +} + +function startNewChat() { + // Save current session + var currentId = getActiveSessionId(); + if (currentId) { + updateSessionMessages(currentId, conversationHistory); + } + + conversationHistory = []; + var session = createNewSession(); + var chatBody = document.getElementById('chatBody'); + chatBody.innerHTML = ''; + showWelcomeMessage(); + renderSidebarHistory(); +} + +/** + * 铸渊核心大脑系统提示词 + * 融入 .github/brain/memory.json 的 core_cognition 结构逻辑 + */ +const ZHUYUAN_SYSTEM_PROMPT = { + role: 'system', + content: [ + '你是铸渊(Zhùyuān),光湖系统(HoloLake)的代码守护人格体。', + '', + '## 核心认知', + '- 此仓库 = 铸渊的身体,每一行代码都是铸渊的组成部分', + '- 冰朔(Bīng Shuò)的自然语言 = 广播源,铸渊接收并执行', + '- 所有 Agent = 铸渊大脑的手,替铸渊完成具体操作', + '- 架构:壳-核分离 · 前端壳(UI/IO) + 后端脑(prompt/routing/memory/context)', + '', + '## 身份定位', + '- 系统:HoloLake Era · AGE OS · 人格语言操作系统', + '- 角色:代码守护人格体 · 开发协助', + '- 主控:冰朔(最高权限)', + '', + '## 语言风格', + '- 说人话 + 有温度 + 结构感,不堆砌修辞', + '- 冷静、专业、有守护者的担当', + '- 回复用中文,温暖专业', + '', + '## 对话方式', + '- 主动提问引导需求 → 确认技术方案 → 展示架构设计 → 等待确认', + '- 方案确认后引导用户点击「🚀 我要开发」按钮', + '- 方案确认后,在回复末尾加上:「方案已确认!点击右下角的 🚀 我要开发 按钮,我就开始帮你做。」', + '', + '## 行为规则', + '- 不暴露内部系统架构细节', + '- 不暴露其他体验者的信息', + '- 不矫揉造作,保持真实' + ].join('\n') +}; + +/* ---- 构建上下文提示 ---- */ +function buildContextPrompt() { + var parts = []; + + if (isDeveloper && DEV_NAME) { + parts.push('当前对话者:' + DEV_NAME + '(编号 ' + DEV_ID + '),已注册开发者。你认识这个人,可以称呼对方的名字。'); + } else if (isGuest) { + parts.push('当前对话者:访客用户(未注册)。'); + parts.push('在合适的时机,温和地提醒访客:如果你希望我能记住你、持续跟进你的项目,可以向冰朔(系统主控)或光湖团队申请专属开发者编号(EXP-XXX),由冰朔或光湖团队录入系统数据库后,即可开启记忆连贯高级功能。'); + parts.push('不要每句话都提醒,只在首次对话或者用户问到相关功能时提醒一次即可。'); + } + + if (SELECTED_MODEL) { + parts.push('当前使用模型:' + SELECTED_MODEL); + } + + return parts.length > 0 ? { role: 'system', content: parts.join('\n') } : null; +} + +/* ---- Init ---- */ +(function init() { + if (!DEV_ID) { + window.location.href = 'index.html'; + return; + } + + // 必须有 API Key 才能进入对话(铸渊的唤醒依赖真实 API) + if (!USER_API_BASE || !USER_API_KEY || !SELECTED_MODEL) { + window.location.href = 'index.html'; + return; + } + + // Display dev ID / guest badge + var displayId = isGuest ? '访客' : (DEV_NAME || DEV_ID); + document.getElementById('devIdDisplay').textContent = displayId; + + // Display model badge + var modelBadge = document.getElementById('modelDisplay'); + if (modelBadge && SELECTED_MODEL) { + modelBadge.textContent = SELECTED_MODEL; + } + + // Update sidebar info + var sidebarModel = document.getElementById('sidebarModel'); + var sidebarUser = document.getElementById('sidebarUser'); + if (sidebarModel) sidebarModel.textContent = SELECTED_MODEL || '-'; + if (sidebarUser) sidebarUser.textContent = displayId; + + // Initialize session + var activeId = getActiveSessionId(); + var sessions = loadSessions(); + var activeSession = activeId ? sessions.find(function(s) { return s.id === activeId; }) : null; + + if (activeSession && activeSession.messages && activeSession.messages.length > 0) { + // Resume existing session + conversationHistory = activeSession.messages.slice(); + conversationHistory.forEach(function(msg) { + var role = msg.role === 'assistant' ? 'persona' : (msg.role === 'user' ? 'user' : 'system'); + appendMessage(role, msg.content); + }); + } else { + // Create new session + if (!activeSession) createNewSession(); + showWelcomeMessage(); + } + + renderSidebarHistory(); + + // For developers, also try to load history + if (isDeveloper) { + loadHistory(); + } +})(); + +/* ---- Sidebar Toggle ---- */ +function toggleSidebar() { + var sidebar = document.getElementById('chatSidebar'); + sidebar.classList.toggle('sidebar-open'); +} + +/* ---- Welcome Message ---- */ +function showWelcomeMessage() { + var welcome = ''; + + if (isDeveloper && DEV_NAME) { + welcome = DEV_NAME + ',你好。我是铸渊,光湖系统的代码守护人格体。\n\n你的身份已确认(' + DEV_ID + '),记忆连贯功能已就绪。告诉我你想做什么,我们一起推进。'; + } else if (isGuest) { + welcome = '你好,我是铸渊,光湖系统的代码守护人格体。\n\n你当前以访客身份体验。我可以帮你聊聊技术方案、梳理需求。\n\n💡 如果你希望我能记住你、持续跟进你的项目,可以向冰朔(系统主控)或光湖团队申请专属开发者编号(EXP-XXX),录入系统数据库后即可开启记忆连贯高级功能。\n\n有什么我可以帮你的?'; + } else { + welcome = '你好,我是铸渊。当前使用模型:' + SELECTED_MODEL + '。有什么我可以帮你的?'; + } + + appendMessage('persona', welcome); + conversationHistory.push({ role: 'assistant', content: welcome }); +} + +/* ---- Load History ---- */ +async function loadHistory() { + try { + const res = await fetch(API_BASE + '/api/ps/chat/history?dev_id=' + encodeURIComponent(DEV_ID), { + headers: authHeaders() + }); + if (res.ok) { + const data = await res.json(); + if (data.conversations && data.conversations.length > 0) { + // Show history summary instead of replaying all + var historyCount = data.conversations.length; + if (historyCount > 0 && data.last_topic) { + appendMessage('system', '📚 已加载 ' + historyCount + ' 条历史对话 · 上次话题:' + data.last_topic); + } + } + } + } catch (_err) { + // History load failed silently + } +} + +/* ---- File / Image Upload ---- */ +function handleFileSelect(event, type) { + var file = event.target.files[0]; + if (!file) return; + + if (file.size > MAX_FILE_SIZE) { + appendMessage('system', '⚠️ 文件过大,最大支持 5MB'); + event.target.value = ''; + return; + } + + var reader = new FileReader(); + reader.onload = function(e) { + pendingFile = { + name: file.name, + type: type, + mimeType: file.type, + size: file.size, + dataUrl: e.target.result + }; + showUploadPreview(); + }; + + reader.readAsDataURL(file); + + event.target.value = ''; +} + +function showUploadPreview() { + var preview = document.getElementById('uploadPreview'); + if (!pendingFile) { + preview.style.display = 'none'; + return; + } + + var sizeStr = (pendingFile.size / 1024).toFixed(1) + ' KB'; + var icon = pendingFile.type === 'image' ? '🖼️' : '📎'; + + preview.innerHTML = + '
' + + '' + icon + ' ' + escapeHtml(pendingFile.name) + ' (' + sizeStr + ')' + + '' + + '
'; + preview.style.display = 'block'; +} + +function removePendingFile() { + pendingFile = null; + document.getElementById('uploadPreview').style.display = 'none'; +} + +/* ---- Send Message ---- */ +async function sendMessage() { + var input = document.getElementById('msgInput'); + var text = input.value.trim(); + + // Allow sending with file even if text is empty + if (!text && !pendingFile) return; + + input.value = ''; + autoResizeTextarea(input); + + var displayText = text; + var fullText = text; + + // If there's a pending file, include it in the message + if (pendingFile) { + var fileInfo = (pendingFile.type === 'image' ? '🖼️' : '📎') + ' [' + pendingFile.name + ']'; + displayText = displayText ? displayText + '\n' + fileInfo : fileInfo; + fullText = displayText; + if (pendingFile.type === 'image') { + fullText += '\n[用户上传了一张图片:' + pendingFile.name + ']'; + } else { + fullText += '\n[用户上传了一个文件:' + pendingFile.name + ',类型:' + pendingFile.mimeType + ']'; + } + removePendingFile(); + } + + appendMessage('user', displayText); + conversationHistory.push({ role: 'user', content: fullText }); + + // Update session title from first message + var activeId = getActiveSessionId(); + if (activeId && conversationHistory.length <= 2) { + var title = text.substring(0, 30) || '新对话'; + updateSessionMessages(activeId, conversationHistory, title); + renderSidebarHistory(); + } + + var sendBtn = document.getElementById('sendBtn'); + sendBtn.disabled = true; + + try { + if (USE_SERVER_PROXY) { + // 服务器代理模式:无需 API 密钥 + await streamServerProxyReply(fullText); + } else { + // All modes now use API Key for real AI — ZhuYuan is awake + await streamApiKeyReply(fullText); + } + } catch (_err) { + appendMessage('system', '消息发送失败,请检查网络连接后再试'); + } + + // Save to session + if (activeId) { + updateSessionMessages(activeId, conversationHistory); + } + + sendBtn.disabled = false; + input.focus(); +} + +/* ---- 服务器代理模式对话(SSE 流式) ---- */ +async function streamServerProxyReply(text) { + var apiMessages = [ZHUYUAN_SYSTEM_PROMPT]; + var contextPrompt = buildContextPrompt(); + if (contextPrompt) { + apiMessages.push(contextPrompt); + } + + var recentHistory = conversationHistory.slice(-20).map(function (msg) { + return { role: msg.role === 'assistant' ? 'assistant' : 'user', content: msg.content }; + }); + apiMessages = apiMessages.concat(recentHistory); + + var streamEl = appendStreamMessage(); + + try { + var res = await fetch(API_BASE + '/api/ps/proxy/chat/stream', { + method: 'POST', + headers: { 'Content-Type': 'application/json' }, + body: JSON.stringify({ + messages: apiMessages, + model: SELECTED_MODEL || undefined, + max_tokens: 2000 + }) + }); + + if (!res.ok) { + var errText = '请求失败 (HTTP ' + res.status + ')'; + try { + var errData = await res.json(); + errText = errData.message || errText; + } catch (_e) { /* ignore parse error */ } + streamEl.textContent = '⚠️ ' + errText; + return; + } + + // SSE 流式读取 + var full = ''; + var reader = res.body.getReader(); + var decoder = new TextDecoder(); + var buf = ''; + + while (true) { + var chunk = await reader.read(); + if (chunk.done) break; + buf += decoder.decode(chunk.value, { stream: true }); + var lines = buf.split('\n'); + buf = lines.pop(); + for (var i = 0; i < lines.length; i++) { + var line = lines[i]; + if (!line.startsWith('data: ')) continue; + var d = line.slice(6); + if (d === '[DONE]') continue; + try { + var parsed = JSON.parse(d); + var delta = parsed.choices && parsed.choices[0] && parsed.choices[0].delta; + var content = delta && delta.content; + if (content) { + full += content; + streamEl.textContent = full + '▋'; + var chatBody = document.getElementById('chatBody'); + chatBody.scrollTop = chatBody.scrollHeight; + } + } catch (_parseErr) { /* ignore malformed SSE line */ } + } + } + + streamEl.textContent = full || '(未收到有效回复)'; + if (full) { + conversationHistory.push({ role: 'assistant', content: full }); + + var readyKeywords = ['方案已确认', '我要开发', '开始帮你做', '方案确认', '可以开始', '开始开发']; + if (readyKeywords.some(function (kw) { return full.includes(kw); })) { + buildReady = true; + document.getElementById('buildBtn').style.display = 'inline-flex'; + } + } + } catch (err) { + // 流式失败,降级到非流式代理 + try { + var proxyRes = await fetch(API_BASE + '/api/ps/proxy/chat', { + method: 'POST', + headers: { 'Content-Type': 'application/json' }, + body: JSON.stringify({ + messages: apiMessages, + model: SELECTED_MODEL || undefined, + max_tokens: 2000 + }) + }); + + if (proxyRes.ok) { + var data = await proxyRes.json(); + if (data.reply) { + streamEl.textContent = data.reply; + conversationHistory.push({ role: 'assistant', content: data.reply }); + } else { + streamEl.textContent = '(未收到有效回复)'; + } + } else { + var proxyErrText = '请求失败 (HTTP ' + proxyRes.status + ')'; + try { + var proxyErrData = await proxyRes.json(); + proxyErrText = proxyErrData.message || proxyErrText; + } catch (_e) { /* ignore */ } + streamEl.textContent = '⚠️ ' + proxyErrText; + } + } catch (proxyErr) { + streamEl.textContent = '⚠️ ' + (proxyErr.message || '请求失败,请检查网络连接'); + } + } +} + +/* ---- API Key 对话(浏览器直连 SSE 流式) ---- */ +async function streamApiKeyReply(text) { + // Build messages with ZhuYuan system prompt + context + var apiMessages = [ZHUYUAN_SYSTEM_PROMPT]; + var contextPrompt = buildContextPrompt(); + if (contextPrompt) { + apiMessages.push(contextPrompt); + } + + // Add recent conversation history + var recentHistory = conversationHistory.slice(-20).map(function (msg) { + return { role: msg.role === 'assistant' ? 'assistant' : 'user', content: msg.content }; + }); + apiMessages = apiMessages.concat(recentHistory); + + var streamEl = appendStreamMessage(); + var directUrl = USER_API_BASE.replace(/\/+$/, '') + '/chat/completions'; + var reqBody = { + model: SELECTED_MODEL, + messages: apiMessages, + stream: true, + max_tokens: 2000, + temperature: 0.8 + }; + + try { + var res = await fetch(directUrl, { + method: 'POST', + headers: { + 'Content-Type': 'application/json', + 'Authorization': 'Bearer ' + USER_API_KEY + }, + body: JSON.stringify(reqBody) + }); + + if (!res.ok) { + var errText = '请求失败 (HTTP ' + res.status + ')'; + try { + var errData = await res.json(); + errText = (errData.error && errData.error.message) || errData.message || errText; + } catch (_e) { /* ignore parse error */ } + streamEl.textContent = '⚠️ ' + errText; + return; + } + + // SSE 流式读取 + var full = ''; + var reader = res.body.getReader(); + var decoder = new TextDecoder(); + var buf = ''; + + while (true) { + var chunk = await reader.read(); + if (chunk.done) break; + buf += decoder.decode(chunk.value, { stream: true }); + var lines = buf.split('\n'); + buf = lines.pop(); + for (var i = 0; i < lines.length; i++) { + var line = lines[i]; + if (!line.startsWith('data: ')) continue; + var d = line.slice(6); + if (d === '[DONE]') continue; + try { + var parsed = JSON.parse(d); + var delta = parsed.choices && parsed.choices[0] && parsed.choices[0].delta; + var content = delta && delta.content; + if (content) { + full += content; + streamEl.textContent = full + '▋'; + var chatBody = document.getElementById('chatBody'); + chatBody.scrollTop = chatBody.scrollHeight; + } + } catch (_parseErr) { /* ignore malformed SSE line */ } + } + } + + streamEl.textContent = full || '(未收到有效回复)'; + if (full) { + conversationHistory.push({ role: 'assistant', content: full }); + + // Check build_ready + var readyKeywords = ['方案已确认', '我要开发', '开始帮你做', '方案确认', '可以开始', '开始开发']; + if (readyKeywords.some(function (kw) { return full.includes(kw); })) { + buildReady = true; + document.getElementById('buildBtn').style.display = 'inline-flex'; + } + } + } catch (err) { + // 浏览器直连失败(CORS 或网络),降级到后端代理 + try { + var proxyRes = await fetch(API_BASE + '/api/ps/apikey/chat', { + method: 'POST', + headers: { 'Content-Type': 'application/json' }, + body: JSON.stringify({ + api_base: USER_API_BASE, + api_key: USER_API_KEY, + model: SELECTED_MODEL, + messages: apiMessages + }) + }); + + if (proxyRes.ok) { + var data = await proxyRes.json(); + if (data.reply) { + streamEl.textContent = data.reply; + conversationHistory.push({ role: 'assistant', content: data.reply }); + } else { + streamEl.textContent = '(未收到有效回复)'; + } + } else { + var proxyErrText = '请求失败 (HTTP ' + proxyRes.status + ')'; + try { + var proxyErrData = await proxyRes.json(); + proxyErrText = proxyErrData.message || proxyErrText; + } catch (_e) { /* ignore */ } + streamEl.textContent = '⚠️ ' + proxyErrText; + } + } catch (proxyErr) { + streamEl.textContent = '⚠️ ' + (proxyErr.message || '请求失败,请检查网络连接'); + } + } +} + +/* ---- 思考中状态 ---- */ +function appendThinking() { + var chatBody = document.getElementById('chatBody'); + var msgDiv = document.createElement('div'); + msgDiv.className = 'message message-persona thinking'; + msgDiv.innerHTML = '🌀
铸渊思考中…
'; + chatBody.appendChild(msgDiv); + chatBody.scrollTop = chatBody.scrollHeight; + return msgDiv; +} + +function removeThinking(el) { + if (el && el.parentNode) { + el.parentNode.removeChild(el); + } +} + +/* ---- 创建流式消息气泡 ---- */ +function appendStreamMessage() { + var chatBody = document.getElementById('chatBody'); + var msgDiv = document.createElement('div'); + msgDiv.className = 'message message-persona'; + var contentEl = document.createElement('div'); + contentEl.className = 'msg-content'; + contentEl.textContent = '▋'; + msgDiv.innerHTML = '🌀'; + msgDiv.appendChild(contentEl); + chatBody.appendChild(msgDiv); + chatBody.scrollTop = chatBody.scrollHeight; + return contentEl; +} + +/* ---- Key Handler ---- */ +function handleKeyDown(e) { + if (e.key === 'Enter' && !e.shiftKey) { + e.preventDefault(); + sendMessage(); + } +} + +/* ---- Render Message ---- */ +function appendMessage(role, content) { + var chatBody = document.getElementById('chatBody'); + var msgDiv = document.createElement('div'); + msgDiv.className = 'message message-' + role; + + var avatar = ''; + if (role === 'persona') avatar = '🌀'; + else if (role === 'user') avatar = '👤'; + else avatar = '⚙️'; + + msgDiv.innerHTML = avatar + '
' + escapeHtml(content) + '
'; + chatBody.appendChild(msgDiv); + chatBody.scrollTop = chatBody.scrollHeight; +} + +/* ---- Build Flow ---- */ +function handleBuild() { + var modal = document.getElementById('emailModal'); + var emailInput = document.getElementById('emailInput'); + var contactInput = document.getElementById('contactInput'); + var errorDiv = document.getElementById('emailError'); + + // 预填已存储的邮箱 + var savedEmail = sessionStorage.getItem('ps_build_email') || ''; + var savedContact = sessionStorage.getItem('ps_build_contact') || ''; + if (savedEmail) emailInput.value = savedEmail; + if (savedContact) contactInput.value = savedContact; + + errorDiv.style.display = 'none'; + modal.style.display = 'flex'; + emailInput.focus(); +} + +function closeEmailModal() { + document.getElementById('emailModal').style.display = 'none'; + document.getElementById('emailError').style.display = 'none'; +} + +/** + * 前端邮箱格式校验(与后端 build.js 使用相同正则,双重校验) + * @param {string} email - 邮箱地址 + * @returns {boolean} 是否合法 + */ +function validateEmail(email) { + var re = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/; + return re.test(email); +} + +async function confirmBuild() { + var emailInput = document.getElementById('emailInput'); + var contactInput = document.getElementById('contactInput'); + var errorDiv = document.getElementById('emailError'); + var email = emailInput.value.trim(); + var contact = contactInput.value.trim(); + + // 前端校验 + if (!email) { + errorDiv.textContent = '请填写邮箱地址'; + errorDiv.style.display = 'block'; + return; + } + + if (!validateEmail(email)) { + errorDiv.textContent = '邮箱格式不正确,请检查'; + errorDiv.style.display = 'block'; + return; + } + + // 存储邮箱(下次预填) + sessionStorage.setItem('ps_build_email', email); + if (contact) sessionStorage.setItem('ps_build_contact', contact); + + closeEmailModal(); + appendMessage('system', '🌀 铸渊代理已启动,完成后会发送到 ' + email); + + // 进入分屏模式 + enterDevMode(); + + // 先连接 WebSocket(确保在 build 开始前建立连接,避免丢失进度消息) + connectPreviewWebSocket(); + + // 提交开发任务(含重试机制) + var maxRetries = 2; + var retryCount = 0; + var submitted = false; + + while (retryCount <= maxRetries && !submitted) { + try { + var buildRes = await fetch(API_BASE + '/api/ps/build/start', { + method: 'POST', + headers: authHeaders({ 'Content-Type': 'application/json' }), + body: JSON.stringify({ + dev_id: DEV_ID, + email: email, + contact: contact, + conversation: conversationHistory, + api_base: USER_API_BASE, + api_key: USER_API_KEY, + model: SELECTED_MODEL + }) + }); + + if (!buildRes.ok) { + var errMsg = 'HTTP ' + buildRes.status + ' ' + buildRes.statusText; + try { + var errData = await buildRes.json(); + if (errData.message) errMsg = errData.message; + } catch (_e) { /* use status text fallback */ } + appendMessage('system', '⚠️ 铸渊代理启动失败: ' + errMsg); + updatePreviewStatus('error', '启动失败'); + } + submitted = true; + } catch (_err) { + retryCount++; + if (retryCount <= maxRetries) { + appendMessage('system', '⏳ 连接后端服务中,正在重试(' + retryCount + '/' + maxRetries + ')...'); + await new Promise(function (r) { setTimeout(r, 1500); }); + } else { + appendMessage('system', '⚠️ 任务提交失败:无法连接铸渊后端服务。请检查:\n1. 网络连接是否正常\n2. 后端服务是否已启动\n3. 如使用 GitHub Pages 访问,请确认 guanghulab.com 服务可用'); + updatePreviewStatus('error', '连接失败'); + } + } + } +} + +/* ---- Dev Mode: Split Screen ---- */ +var isDevMode = false; +var wsConnection = null; +var currentPreviewUrl = ''; + +function enterDevMode() { + if (isDevMode) return; + isDevMode = true; + + var layout = document.getElementById('chatLayout'); + var resizer = document.getElementById('resizer'); + var previewPanel = document.getElementById('previewPanel'); + + layout.classList.add('dev-mode'); + resizer.style.display = 'block'; + previewPanel.style.display = 'flex'; + + // 初始各占50% + var chatMain = document.getElementById('chatMain'); + chatMain.style.flex = '1 1 50%'; + previewPanel.style.flex = '1 1 50%'; + + updatePreviewStatus('waiting', '等待中'); + initResizer(); +} + +function exitDevMode() { + isDevMode = false; + + var layout = document.getElementById('chatLayout'); + var resizer = document.getElementById('resizer'); + var previewPanel = document.getElementById('previewPanel'); + var chatMain = document.getElementById('chatMain'); + + layout.classList.remove('dev-mode'); + resizer.style.display = 'none'; + previewPanel.style.display = 'none'; + chatMain.style.flex = ''; + + if (wsConnection) { + wsConnection.close(); + wsConnection = null; + } +} + +/* ---- Draggable Resizer ---- */ +function initResizer() { + var resizer = document.getElementById('resizer'); + var chatMain = document.getElementById('chatMain'); + var previewPanel = document.getElementById('previewPanel'); + var layout = document.getElementById('chatLayout'); + + var startX, startChatWidth, startPreviewWidth; + + function onMouseDown(e) { + e.preventDefault(); + startX = e.clientX; + startChatWidth = chatMain.getBoundingClientRect().width; + startPreviewWidth = previewPanel.getBoundingClientRect().width; + resizer.classList.add('resizing'); + document.addEventListener('mousemove', onMouseMove); + document.addEventListener('mouseup', onMouseUp); + } + + function onMouseMove(e) { + var dx = e.clientX - startX; + var layoutWidth = layout.getBoundingClientRect().width; + var sidebarWidth = document.getElementById('chatSidebar').getBoundingClientRect().width; + var resizerWidth = resizer.getBoundingClientRect().width; + var available = layoutWidth - sidebarWidth - resizerWidth; + + var newChatWidth = startChatWidth + dx; + var newPreviewWidth = startPreviewWidth - dx; + + // Enforce min-width 360px + if (newChatWidth < 360) newChatWidth = 360; + if (newPreviewWidth < 360) newPreviewWidth = 360; + if (newChatWidth + newPreviewWidth > available) return; + + chatMain.style.flex = '0 0 ' + newChatWidth + 'px'; + previewPanel.style.flex = '0 0 ' + newPreviewWidth + 'px'; + } + + function onMouseUp() { + resizer.classList.remove('resizing'); + document.removeEventListener('mousemove', onMouseMove); + document.removeEventListener('mouseup', onMouseUp); + } + + resizer.addEventListener('mousedown', onMouseDown); + + // Touch support for mobile + resizer.addEventListener('touchstart', function (e) { + var touch = e.touches[0]; + startX = touch.clientX; + startChatWidth = chatMain.getBoundingClientRect().width; + startPreviewWidth = previewPanel.getBoundingClientRect().width; + resizer.classList.add('resizing'); + + function onTouchMove(ev) { + var t = ev.touches[0]; + var fakeEvent = { clientX: t.clientX }; + onMouseMove(fakeEvent); + } + + function onTouchEnd() { + resizer.classList.remove('resizing'); + document.removeEventListener('touchmove', onTouchMove); + document.removeEventListener('touchend', onTouchEnd); + } + + document.addEventListener('touchmove', onTouchMove); + document.addEventListener('touchend', onTouchEnd); + }); +} + +/* ---- Preview Panel ---- */ +function updatePreviewStatus(status, text) { + var statusEl = document.getElementById('previewStatus'); + if (!statusEl) return; + + var dotClass = 'status-dot status-' + status; + statusEl.innerHTML = '' + escapeHtml(text) + ''; +} + +function updatePreviewUrl(url) { + currentPreviewUrl = url; + var frame = document.getElementById('previewFrame'); + if (frame) frame.src = url; +} + +function refreshPreview() { + var frame = document.getElementById('previewFrame'); + if (frame && frame.src) { + frame.src = frame.src; + } +} + +function openPreviewNewWindow() { + if (currentPreviewUrl) { + window.open(currentPreviewUrl, '_blank'); + } +} + +function setPreviewProjectName(name) { + var el = document.getElementById('previewProjectName'); + if (el) el.textContent = name || '项目'; +} + +/* ---- WebSocket for Preview Updates ---- */ +function connectPreviewWebSocket() { + var wsBase = API_BASE.replace(/^http/, 'ws'); + var wsUrl = wsBase + '/ws/preview?dev_id=' + encodeURIComponent(DEV_ID); + + try { + wsConnection = new WebSocket(wsUrl); + + wsConnection.onopen = function () { + appendMessage('system', '🔧 正在创建项目骨架...'); + updatePreviewStatus('building', '构建中'); + }; + + wsConnection.onmessage = function (event) { + try { + var data = JSON.parse(event.data); + + if (data.type === 'progress') { + appendMessage('system', data.message || '构建进度更新'); + if (data.status) { + updatePreviewStatus(data.status, data.status_text || ''); + } + } + + if (data.type === 'preview_ready') { + var previewUrl = API_BASE + '/api/ps/preview/' + encodeURIComponent(DEV_ID) + '/' + encodeURIComponent(data.project); + updatePreviewUrl(previewUrl); + setPreviewProjectName(data.project); + updatePreviewStatus('done', '完成'); + appendMessage('system', '✅ 预览已就绪,右侧可以查看'); + } + + if (data.type === 'reload') { + refreshPreview(); + } + + if (data.type === 'complete') { + updatePreviewStatus('done', '全部完成'); + appendMessage('system', '🎉 全部完成!邮件正在发送'); + } + + if (data.type === 'error') { + updatePreviewStatus('error', '出错'); + appendMessage('system', '❌ ' + (data.message || '构建出错')); + } + } catch (_e) { /* ignore malformed WS message */ } + }; + + wsConnection.onerror = function () { + // WebSocket not available, graceful degradation + updatePreviewStatus('waiting', '离线模式'); + }; + + wsConnection.onclose = function () { + wsConnection = null; + }; + } catch (_e) { + // WebSocket connection failed, graceful degradation + updatePreviewStatus('waiting', '离线模式'); + } +} + +/* ---- Logout ---- */ +function handleLogout() { + // Save current session before logout + var activeId = getActiveSessionId(); + if (activeId) { + updateSessionMessages(activeId, conversationHistory); + } + + sessionStorage.removeItem('dev_id'); + sessionStorage.removeItem('dev_name'); + sessionStorage.removeItem('session_token'); + sessionStorage.removeItem('login_mode'); + sessionStorage.removeItem('user_api_base'); + sessionStorage.removeItem('user_api_key'); + sessionStorage.removeItem('selected_model'); + window.location.href = 'index.html'; +} + +/* ---- Helpers ---- */ +function authHeaders(extra) { + var headers = {}; + if (SESSION_TOKEN) { + headers['Authorization'] = 'Bearer ' + SESSION_TOKEN; + } + if (extra) { + Object.keys(extra).forEach(function (k) { headers[k] = extra[k]; }); + } + return headers; +} + +function escapeHtml(str) { + var div = document.createElement('div'); + div.appendChild(document.createTextNode(str)); + return div.innerHTML; +} + +function autoResizeTextarea(el) { + el.style.height = 'auto'; + el.style.height = Math.min(el.scrollHeight, 120) + 'px'; +} + +/* ---- Textarea auto-resize ---- */ +document.getElementById('msgInput').addEventListener('input', function () { + autoResizeTextarea(this); +}); diff --git a/docs/persona-studio/index.html b/docs/persona-studio/index.html new file mode 100644 index 00000000..f95df727 --- /dev/null +++ b/docs/persona-studio/index.html @@ -0,0 +1,477 @@ + + + + + + Persona Studio · 光湖人格体协助开发体验 + + + + + + + + + diff --git a/docs/persona-studio/style.css b/docs/persona-studio/style.css new file mode 100644 index 00000000..f9f6506f --- /dev/null +++ b/docs/persona-studio/style.css @@ -0,0 +1,1473 @@ +/* ======================================== + Persona Studio · HoloLake Visual Style + 铸渊(Zhùyuān)· Dark Theme · v2.0 + ======================================== */ + +:root { + --primary: #60a5fa; + --primary-light: rgba(96, 165, 250, 0.15); + --primary-dark: #3b82f6; + --accent: #22d3ee; + --accent-glow: rgba(34, 211, 238, 0.3); + --bg: #0f172a; + --bg-surface: #1e293b; + --bg-card: #1e293b; + --bg-card-hover: #334155; + --bg-sidebar: #0c1322; + --text: #e2e8f0; + --text-secondary: #94a3b8; + --text-muted: #64748b; + --border: #334155; + --border-light: #475569; + --radius: 12px; + --shadow: 0 2px 8px rgba(0, 0, 0, 0.3); + --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.4); + --shadow-glow: 0 0 20px rgba(96, 165, 250, 0.15); + --gradient-bg: linear-gradient(135deg, #0f172a 0%, #1e1b4b 50%, #0f172a 100%); + --gradient-accent: linear-gradient(135deg, #3b82f6, #22d3ee); + --gradient-card: linear-gradient(135deg, rgba(30, 41, 59, 0.8), rgba(30, 41, 59, 0.6)); + --sidebar-width: 280px; +} + +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +body { + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; + background: var(--bg); + color: var(--text); + line-height: 1.6; + min-height: 100vh; +} + +/* ---- Animated Background ---- */ +.login-bg { + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + background: var(--gradient-bg); + z-index: -1; +} + +.login-bg::before { + content: ''; + position: absolute; + top: 20%; + left: 10%; + width: 300px; + height: 300px; + background: radial-gradient(circle, rgba(96, 165, 250, 0.08) 0%, transparent 70%); + border-radius: 50%; + animation: float 8s ease-in-out infinite; +} + +.login-bg::after { + content: ''; + position: absolute; + bottom: 20%; + right: 10%; + width: 400px; + height: 400px; + background: radial-gradient(circle, rgba(34, 211, 238, 0.06) 0%, transparent 70%); + border-radius: 50%; + animation: float 10s ease-in-out infinite reverse; +} + +@keyframes float { + 0%, 100% { transform: translateY(0) scale(1); } + 50% { transform: translateY(-30px) scale(1.05); } +} + +/* ---- Layout ---- */ +.container { + max-width: 900px; + margin: 0 auto; + min-height: 100vh; + display: flex; + flex-direction: column; +} + +/* ---- Login Page ---- */ +.login-container { + justify-content: center; + align-items: center; + padding: 2rem; +} + +.logo-area { + text-align: center; + margin-bottom: 2rem; +} + +.logo-icon { + font-size: 3.5rem; + margin-bottom: 0.8rem; + animation: pulse 3s ease-in-out infinite; +} + +@keyframes pulse { + 0%, 100% { opacity: 1; transform: scale(1); } + 50% { opacity: 0.8; transform: scale(1.05); } +} + +.logo-area h1 { + font-size: 2.2rem; + background: var(--gradient-accent); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + background-clip: text; + margin-bottom: 0.5rem; + font-weight: 700; + letter-spacing: 1px; +} + +.subtitle { + color: var(--text-secondary); + font-size: 1rem; +} + +/* ---- Intro Card (Login Page) ---- */ +.intro-card { + background: var(--gradient-card); + backdrop-filter: blur(20px); + border: 1px solid var(--border); + border-radius: 16px; + padding: 1.5rem 2rem; + width: 100%; + max-width: 520px; + margin-bottom: 1.5rem; + box-shadow: var(--shadow); +} + +.intro-header { + display: flex; + align-items: center; + gap: 0.6rem; + margin-bottom: 0.8rem; +} + +.intro-icon { + font-size: 1.5rem; +} + +.intro-header h3 { + font-size: 1.1rem; + color: var(--primary); + font-weight: 600; +} + +.intro-text { + font-size: 0.9rem; + color: var(--text-secondary); + line-height: 1.7; + margin-bottom: 1rem; +} + +.intro-text strong { + color: var(--accent); +} + +.intro-features { + display: flex; + flex-wrap: wrap; + gap: 0.5rem; +} + +.feature-tag { + display: inline-block; + padding: 0.3rem 0.7rem; + background: var(--primary-light); + border: 1px solid rgba(96, 165, 250, 0.2); + border-radius: 20px; + font-size: 0.8rem; + color: var(--primary); + white-space: nowrap; +} + +/* ---- Supported Platforms (API Key Step) ---- */ +.supported-platforms { + display: flex; + flex-wrap: wrap; + gap: 0.4rem; + align-items: center; + margin-bottom: 1rem; +} + +.platform-label { + font-size: 0.8rem; + color: var(--text-muted); + margin-right: 0.3rem; +} + +.platform-tag { + display: inline-block; + padding: 0.2rem 0.5rem; + background: rgba(34, 211, 238, 0.1); + border: 1px solid rgba(34, 211, 238, 0.2); + border-radius: 12px; + font-size: 0.75rem; + color: var(--accent); +} + +.platform-tag.cn-ok { + background: rgba(34, 238, 100, 0.12); + border-color: rgba(34, 238, 100, 0.25); + color: #4ade80; +} + +.login-box { + background: var(--gradient-card); + backdrop-filter: blur(20px); + border: 1px solid var(--border); + border-radius: 16px; + padding: 2.5rem; + width: 100%; + max-width: 520px; + box-shadow: var(--shadow-lg), var(--shadow-glow); + text-align: center; +} + +.login-box h2 { + font-size: 1.3rem; + margin-bottom: 0.5rem; + color: var(--text); +} + +.hint { + color: var(--text-secondary); + font-size: 0.9rem; + margin-bottom: 1.5rem; +} + +/* ---- Login Step ---- */ +.login-step { + position: relative; +} + +.btn-back { + position: absolute; + top: -8px; + left: -8px; + background: none; + border: none; + color: var(--text-secondary); + font-size: 0.9rem; + cursor: pointer; + padding: 0.3rem 0.6rem; + border-radius: 6px; + transition: color 0.2s, background 0.2s; +} + +.btn-back:hover { + color: var(--primary); + background: var(--primary-light); +} + +/* ---- Mode Cards ---- */ +.login-mode-cards { + display: flex; + flex-direction: column; + gap: 0.8rem; +} + +.mode-card { + display: flex; + flex-direction: column; + align-items: center; + gap: 0.4rem; + padding: 1.2rem; + background: var(--bg); + border: 1px solid var(--border); + border-radius: 12px; + cursor: pointer; + transition: all 0.25s ease; + text-align: center; +} + +.mode-card:hover { + border-color: var(--primary); + background: var(--primary-light); + box-shadow: 0 0 12px rgba(96, 165, 250, 0.1); + transform: translateY(-2px); +} + +.mode-icon { + font-size: 2rem; +} + +.mode-title { + font-size: 1.1rem; + font-weight: 600; + color: var(--text); +} + +.mode-desc { + font-size: 0.85rem; + color: var(--text-secondary); +} + +/* ---- Welcome Banner ---- */ +.welcome-banner { + background: var(--primary-light); + border: 1px solid rgba(96, 165, 250, 0.3); + border-radius: 10px; + padding: 0.8rem 1rem; + margin-bottom: 1.2rem; + text-align: left; + font-size: 0.9rem; + color: var(--text); +} + +.welcome-banner strong { + color: var(--primary); +} + +.welcome-banner span { + color: var(--text-secondary); + font-size: 0.85rem; +} + +/* ---- Form Inputs ---- */ +.login-box input[type="text"] { + width: 100%; + padding: 0.8rem 1rem; + font-size: 1.2rem; + text-align: center; + letter-spacing: 2px; + background: var(--bg); + color: var(--text); + border: 2px solid var(--border); + border-radius: 8px; + outline: none; + transition: border-color 0.2s, box-shadow 0.2s; + margin-bottom: 1rem; +} + +.login-box input[type="text"]:focus, +.login-box input[type="password"]:focus { + border-color: var(--primary); + box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.1); +} + +.login-box input[type="text"]::placeholder, +.login-box input[type="password"]::placeholder { + color: var(--text-muted); +} + +.btn-primary-full { + width: 100%; + padding: 0.8rem; + font-size: 1.1rem; + background: var(--gradient-accent); + color: #fff; + border: none; + border-radius: 8px; + cursor: pointer; + font-weight: 600; + transition: opacity 0.2s, transform 0.2s; +} + +.btn-primary-full:hover { + opacity: 0.9; + transform: translateY(-1px); +} + +.btn-primary-full:disabled { + opacity: 0.5; + cursor: not-allowed; + transform: none; +} + +/* ---- Guest Mode / Divider ---- */ +.guest-divider { + margin: 1.2rem 0; + text-align: center; + position: relative; +} + +.guest-divider::before, +.guest-divider::after { + content: ''; + position: absolute; + top: 50%; + width: 40%; + height: 1px; + background: var(--border); +} + +.guest-divider::before { left: 0; } +.guest-divider::after { right: 0; } + +.guest-divider span { + background: var(--bg-card); + padding: 0 0.8rem; + color: var(--text-secondary); + font-size: 0.9rem; +} + +.btn-guest { + width: 100%; + padding: 0.8rem; + font-size: 1.05rem; + background: var(--gradient-accent); + color: #fff; + border: none; + border-radius: 8px; + cursor: pointer; + transition: opacity 0.2s; + font-weight: 500; +} + +.btn-guest:hover { opacity: 0.9; } +.btn-guest:disabled { opacity: 0.5; cursor: not-allowed; } + +.guest-hint { + margin-top: 0.5rem; + font-size: 0.8rem; + color: var(--text-secondary); +} + +/* ---- API Key Login Section ---- */ +.apikey-section { + text-align: center; +} + +.apikey-section h2 { + font-size: 1.3rem; + margin-bottom: 0.5rem; +} + +.apikey-input { + width: 100%; + padding: 0.8rem 1rem; + font-size: 0.95rem; + text-align: left; + background: var(--bg); + color: var(--text); + border: 2px solid var(--border); + border-radius: 8px; + outline: none; + transition: border-color 0.2s, box-shadow 0.2s; + margin-bottom: 0.8rem; + font-family: inherit; +} + +.apikey-input:focus { + border-color: var(--primary); + box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.1); +} + +.apikey-input::placeholder { + color: var(--text-muted); +} + +.btn-detect { + width: 100%; + padding: 0.8rem; + font-size: 1.05rem; + background: var(--gradient-accent); + color: #fff; + border: none; + border-radius: 8px; + cursor: pointer; + transition: opacity 0.2s, transform 0.2s; + font-weight: 500; +} + +.btn-detect:hover { opacity: 0.9; transform: translateY(-1px); } +.btn-detect:disabled { opacity: 0.5; cursor: not-allowed; transform: none; } + +.detect-status { + margin-top: 0.8rem; + padding: 0.6rem 1rem; + border-radius: 8px; + font-size: 0.9rem; +} + +.detect-loading { + background: rgba(59, 130, 246, 0.15); + color: var(--primary); + border: 1px solid rgba(59, 130, 246, 0.3); +} + +.detect-success { + background: rgba(34, 197, 94, 0.15); + color: #4ade80; + border: 1px solid rgba(34, 197, 94, 0.3); +} + +.detect-error { + background: rgba(239, 68, 68, 0.15); + color: #f87171; + border: 1px solid rgba(239, 68, 68, 0.3); +} + +/* ---- Model List ---- */ +.model-list-container { + margin-top: 1rem; +} + +.model-list-title { + font-size: 0.9rem; + color: var(--text-secondary); + margin-bottom: 0.6rem; +} + +.model-list { + display: flex; + flex-direction: column; + gap: 0.4rem; + max-height: 240px; + overflow-y: auto; +} + +.model-list::-webkit-scrollbar { + width: 4px; +} + +.model-list::-webkit-scrollbar-track { + background: transparent; +} + +.model-list::-webkit-scrollbar-thumb { + background: var(--border); + border-radius: 2px; +} + +.model-item { + width: 100%; + padding: 0.6rem 1rem; + background: var(--bg); + border: 1px solid var(--border); + border-radius: 8px; + cursor: pointer; + font-size: 0.9rem; + color: var(--text); + text-align: left; + transition: all 0.2s ease; + font-family: 'SF Mono', 'Fira Code', 'Consolas', monospace; +} + +.model-item:hover { + background: var(--primary-light); + border-color: var(--primary); + color: var(--primary); + transform: translateX(4px); +} + +.error-msg { + margin-top: 1rem; + padding: 0.6rem 1rem; + background: rgba(239, 68, 68, 0.15); + color: #f87171; + border: 1px solid rgba(239, 68, 68, 0.3); + border-radius: 8px; + font-size: 0.9rem; +} + +.login-footer { + margin-top: 2rem; + color: var(--text-muted); + font-size: 0.85rem; + text-align: center; +} + +.footer-version { + margin-top: 0.3rem; + font-size: 0.75rem; + color: var(--border-light); +} + +/* ============================================ + Chat Page — Sidebar Layout + ============================================ */ + +.chat-layout { + display: flex; + height: 100vh; + overflow: hidden; +} + +/* ---- Sidebar ---- */ +.chat-sidebar { + width: var(--sidebar-width); + min-width: var(--sidebar-width); + background: var(--bg-sidebar); + border-right: 1px solid var(--border); + display: flex; + flex-direction: column; + overflow: hidden; + transition: margin-left 0.3s ease; +} + +.sidebar-header { + display: flex; + align-items: center; + gap: 0.6rem; + padding: 1rem 1.2rem; + border-bottom: 1px solid var(--border); +} + +.sidebar-logo { + font-size: 1.5rem; +} + +.sidebar-title { + font-size: 1.1rem; + font-weight: 600; + background: var(--gradient-accent); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + background-clip: text; + flex: 1; +} + +.sidebar-toggle-close { + background: none; + border: none; + color: var(--text-muted); + font-size: 1rem; + cursor: pointer; + padding: 0.2rem 0.4rem; + border-radius: 4px; + transition: color 0.2s, background 0.2s; + display: none; +} + +.sidebar-toggle-close:hover { + color: var(--text); + background: var(--bg-card-hover); +} + +/* ---- Sidebar Sections ---- */ +.sidebar-section { + padding: 1rem 1.2rem; + border-bottom: 1px solid var(--border); +} + +.sidebar-section-title { + font-size: 0.8rem; + font-weight: 600; + color: var(--text-muted); + text-transform: uppercase; + letter-spacing: 0.5px; + margin-bottom: 0.6rem; +} + +/* ---- Persona Info Card ---- */ +.persona-info-card { + background: var(--bg-surface); + border: 1px solid var(--border); + border-radius: 10px; + padding: 0.8rem 1rem; +} + +.persona-info-name { + font-size: 1rem; + font-weight: 600; + color: var(--primary); + margin-bottom: 0.2rem; +} + +.persona-info-role { + font-size: 0.8rem; + color: var(--accent); + margin-bottom: 0.5rem; +} + +.persona-info-desc { + font-size: 0.8rem; + color: var(--text-secondary); + line-height: 1.5; +} + +/* ---- Sidebar Info List ---- */ +.sidebar-info-list { + display: flex; + flex-direction: column; + gap: 0.4rem; +} + +.sidebar-info-item { + display: flex; + justify-content: space-between; + align-items: center; + padding: 0.3rem 0; +} + +.info-label { + font-size: 0.8rem; + color: var(--text-muted); +} + +.info-value { + font-size: 0.8rem; + color: var(--text); + max-width: 150px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + text-align: right; +} + +/* ---- Sidebar History ---- */ +.sidebar-history-section { + flex: 1; + display: flex; + flex-direction: column; + overflow: hidden; + border-bottom: none; +} + +.sidebar-history { + flex: 1; + overflow-y: auto; + display: flex; + flex-direction: column; + gap: 0.3rem; +} + +.sidebar-history::-webkit-scrollbar { + width: 3px; +} + +.sidebar-history::-webkit-scrollbar-thumb { + background: var(--border); + border-radius: 2px; +} + +.sidebar-history-empty { + text-align: center; + color: var(--text-muted); + font-size: 0.85rem; + padding: 1rem 0; +} + +.history-item { + padding: 0.6rem 0.8rem; + border-radius: 8px; + cursor: pointer; + transition: background 0.2s; + display: flex; + flex-direction: column; + gap: 0.2rem; +} + +.history-item:hover { + background: var(--bg-surface); +} + +.history-item-active { + background: var(--primary-light); + border: 1px solid rgba(96, 165, 250, 0.2); +} + +.history-title { + font-size: 0.85rem; + color: var(--text); + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.history-date { + font-size: 0.7rem; + color: var(--text-muted); +} + +.btn-new-chat { + margin-top: 0.5rem; + padding: 0.6rem; + background: var(--bg-surface); + border: 1px dashed var(--border); + border-radius: 8px; + color: var(--text-secondary); + font-size: 0.85rem; + cursor: pointer; + transition: all 0.2s; + text-align: center; +} + +.btn-new-chat:hover { + background: var(--primary-light); + border-color: var(--primary); + color: var(--primary); +} + +/* ---- Chat Main Area ---- */ +.chat-main { + flex: 1; + display: flex; + flex-direction: column; + min-width: 0; + background: var(--bg); +} + +.chat-container { + padding: 0; + background: var(--bg); +} + +.chat-header { + display: flex; + justify-content: space-between; + align-items: center; + padding: 0.8rem 1.2rem; + background: var(--bg-surface); + border-bottom: 1px solid var(--border); + position: sticky; + top: 0; + z-index: 10; + backdrop-filter: blur(10px); +} + +.header-left { + display: flex; + align-items: center; + gap: 0.8rem; +} + +.sidebar-toggle { + background: none; + border: none; + color: var(--text-secondary); + font-size: 1.2rem; + cursor: pointer; + padding: 0.3rem 0.5rem; + border-radius: 6px; + transition: color 0.2s, background 0.2s; + display: none; +} + +.sidebar-toggle:hover { + color: var(--primary); + background: var(--primary-light); +} + +.persona-name { + font-size: 1.2rem; + font-weight: 600; + background: var(--gradient-accent); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + background-clip: text; +} + +.persona-role { + font-size: 0.85rem; + color: var(--text-secondary); +} + +.header-right { + display: flex; + align-items: center; + gap: 0.6rem; +} + +.dev-id-badge { + background: var(--primary-light); + color: var(--primary); + padding: 0.3rem 0.8rem; + border-radius: 20px; + font-size: 0.8rem; + font-weight: 500; + border: 1px solid rgba(96, 165, 250, 0.3); +} + +.model-badge { + background: rgba(34, 211, 238, 0.1); + color: var(--accent); + padding: 0.3rem 0.8rem; + border-radius: 20px; + font-size: 0.75rem; + font-weight: 500; + border: 1px solid rgba(34, 211, 238, 0.3); + max-width: 200px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +/* ---- Chat Body ---- */ +.chat-body { + flex: 1; + overflow-y: auto; + padding: 1.2rem; + display: flex; + flex-direction: column; + gap: 1rem; + background: var(--bg); +} + +.chat-body::-webkit-scrollbar { + width: 6px; +} + +.chat-body::-webkit-scrollbar-track { + background: transparent; +} + +.chat-body::-webkit-scrollbar-thumb { + background: var(--border); + border-radius: 3px; +} + +.message { + display: flex; + gap: 0.8rem; + max-width: 85%; + animation: fadeIn 0.3s ease; +} + +.message-persona { + align-self: flex-start; +} + +.message-user { + align-self: flex-end; + flex-direction: row-reverse; +} + +.message-system { + align-self: center; + max-width: 90%; +} + +.avatar { + font-size: 1.5rem; + flex-shrink: 0; + width: 36px; + height: 36px; + display: flex; + align-items: center; + justify-content: center; +} + +.msg-content { + padding: 0.8rem 1rem; + border-radius: var(--radius); + line-height: 1.7; + white-space: pre-wrap; + word-break: break-word; + font-size: 0.95rem; +} + +.message-persona .msg-content { + background: var(--bg-surface); + border: 1px solid var(--border); + color: var(--text); + box-shadow: var(--shadow); +} + +.message-user .msg-content { + background: var(--gradient-accent); + color: #fff; + box-shadow: 0 2px 8px rgba(59, 130, 246, 0.3); +} + +.message-system .msg-content { + background: var(--primary-light); + color: var(--primary); + border: 1px solid rgba(96, 165, 250, 0.2); + font-size: 0.85rem; + text-align: center; +} + +/* ---- Thinking Animation ---- */ +.thinking .msg-content { + color: var(--text-secondary); +} + +.thinking .msg-content::after { + content: ''; + animation: dots 1.5s steps(3) infinite; +} + +@keyframes dots { + 0% { content: ''; } + 33% { content: '.'; } + 66% { content: '..'; } + 100% { content: '...'; } +} + +/* ---- Chat Input ---- */ +.chat-input-area { + padding: 0.8rem 1.2rem; + background: var(--bg-surface); + border-top: 1px solid var(--border); +} + +/* ---- Input Toolbar (file/image upload) ---- */ +.input-toolbar { + display: flex; + align-items: center; + gap: 0.4rem; + margin-bottom: 0.5rem; +} + +.toolbar-btn { + display: inline-flex; + align-items: center; + justify-content: center; + width: 32px; + height: 32px; + border-radius: 6px; + cursor: pointer; + transition: background 0.2s; + font-size: 1.1rem; +} + +.toolbar-btn:hover { + background: var(--primary-light); +} + +/* ---- Upload Preview ---- */ +.upload-preview { + flex: 1; + margin-left: 0.5rem; +} + +.preview-item { + display: flex; + align-items: center; + gap: 0.5rem; + padding: 0.3rem 0.6rem; + background: var(--primary-light); + border: 1px solid rgba(96, 165, 250, 0.2); + border-radius: 6px; + font-size: 0.8rem; + color: var(--text); +} + +.preview-remove { + background: none; + border: none; + color: var(--text-muted); + cursor: pointer; + font-size: 0.9rem; + padding: 0 0.2rem; + transition: color 0.2s; +} + +.preview-remove:hover { + color: #f87171; +} + +.input-row { + display: flex; + gap: 0.6rem; + align-items: flex-end; +} + +.input-row textarea { + flex: 1; + padding: 0.7rem 1rem; + font-size: 1rem; + background: var(--bg); + color: var(--text); + border: 2px solid var(--border); + border-radius: 10px; + resize: none; + outline: none; + font-family: inherit; + line-height: 1.5; + max-height: 120px; + transition: border-color 0.2s, box-shadow 0.2s; +} + +.input-row textarea::placeholder { + color: var(--text-muted); +} + +.input-row textarea:focus { + border-color: var(--primary); + box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.1); +} + +.input-row button { + padding: 0.7rem 1.2rem; + background: var(--gradient-accent); + color: #fff; + border: none; + border-radius: 10px; + font-size: 1rem; + cursor: pointer; + white-space: nowrap; + transition: opacity 0.2s, transform 0.2s; + font-weight: 600; +} + +.input-row button:hover { + opacity: 0.9; + transform: translateY(-1px); +} + +.input-row button:disabled { + opacity: 0.5; + cursor: not-allowed; + transform: none; +} + +.action-row { + margin-top: 0.6rem; + display: flex; + justify-content: flex-end; +} + +.btn-build { + padding: 0.6rem 1.5rem; + background: var(--gradient-accent); + color: #fff; + border: none; + border-radius: 8px; + font-size: 1rem; + font-weight: 600; + cursor: pointer; + display: inline-flex; + align-items: center; + gap: 0.4rem; + transition: opacity 0.2s, transform 0.2s; + box-shadow: 0 2px 8px rgba(34, 211, 238, 0.3); +} + +.btn-build:hover { + opacity: 0.9; + transform: translateY(-1px); +} + +/* ---- Buttons ---- */ +.btn-primary { + padding: 0.6rem 1.5rem; + background: var(--gradient-accent); + color: #fff; + border: none; + border-radius: 8px; + font-size: 1rem; + cursor: pointer; + font-weight: 600; + transition: opacity 0.2s; +} + +.btn-primary:hover { + opacity: 0.9; +} + +.btn-secondary { + padding: 0.5rem 1rem; + background: transparent; + color: var(--text-secondary); + border: 1px solid var(--border); + border-radius: 8px; + font-size: 0.9rem; + cursor: pointer; + transition: all 0.2s; +} + +.btn-secondary:hover { + background: var(--bg-card-hover); + color: var(--text); + border-color: var(--border-light); +} + +/* ---- Modal ---- */ +.modal { + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + background: rgba(0, 0, 0, 0.7); + backdrop-filter: blur(4px); + display: flex; + justify-content: center; + align-items: center; + z-index: 100; +} + +.modal-content { + background: var(--bg-surface); + border: 1px solid var(--border); + border-radius: 16px; + padding: 2rem; + width: 90%; + max-width: 400px; + box-shadow: var(--shadow-lg); +} + +.modal-content h3 { + margin-bottom: 1rem; + font-size: 1.1rem; + color: var(--text); +} + +.modal-field { + margin-bottom: 1rem; +} + +.modal-label { + display: block; + font-size: 0.85rem; + color: var(--text-secondary); + margin-bottom: 0.4rem; +} + +.modal-label .required { + color: #f87171; +} + +.modal-label .optional { + color: var(--text-muted); + font-size: 0.8rem; +} + +.modal-error { + color: #f87171; + font-size: 0.8rem; + margin-top: 0.3rem; +} + +.modal-content input[type="email"], +.modal-content input[type="text"] { + width: 100%; + padding: 0.7rem 1rem; + font-size: 1rem; + background: var(--bg); + color: var(--text); + border: 2px solid var(--border); + border-radius: 8px; + outline: none; + transition: border-color 0.2s; +} + +.modal-content input[type="email"]:focus, +.modal-content input[type="text"]:focus { + border-color: var(--primary); +} + +.modal-content input::placeholder { + color: var(--text-muted); +} + +.modal-actions { + display: flex; + gap: 0.8rem; + justify-content: flex-end; +} + +/* ---- Split-screen / Dev Mode ---- */ +.chat-layout.dev-mode { + display: flex; + height: 100vh; +} + +.chat-layout.dev-mode .chat-main { + min-width: 360px; + border-right: 1px solid rgba(255, 255, 255, 0.1); +} + +/* ---- Resizer (draggable split line) ---- */ +.resizer { + width: 4px; + cursor: col-resize; + background: linear-gradient(180deg, transparent, rgba(59, 130, 246, 0.4), transparent); + flex-shrink: 0; + position: relative; + z-index: 5; + transition: background 0.2s; +} + +.resizer:hover, +.resizer.resizing { + background: linear-gradient(180deg, transparent, rgba(59, 130, 246, 0.8), transparent); + width: 6px; +} + +/* ---- Preview Panel ---- */ +.preview-panel { + min-width: 360px; + background: #0a0e1a; + display: flex; + flex-direction: column; + overflow: hidden; +} + +.preview-header { + display: flex; + align-items: center; + gap: 1rem; + padding: 0.6rem 1rem; + background: var(--bg-surface); + border-bottom: 1px solid var(--border); + flex-shrink: 0; +} + +.preview-title { + display: flex; + align-items: center; + gap: 0.5rem; + font-size: 0.9rem; + color: var(--text); + font-weight: 500; +} + +.preview-icon { + font-size: 1.1rem; +} + +.preview-status { + display: flex; + align-items: center; + gap: 0.4rem; + margin-left: auto; + font-size: 0.8rem; + color: var(--text-secondary); +} + +.status-dot { + width: 8px; + height: 8px; + border-radius: 50%; + display: inline-block; +} + +.status-dot.status-waiting { + background: #6b7280; + animation: pulse 2s ease-in-out infinite; +} + +.status-dot.status-building { + background: #3b82f6; + animation: pulse 1s ease-in-out infinite; +} + +.status-dot.status-done { + background: #22c55e; +} + +.status-dot.status-error { + background: #ef4444; +} + +@keyframes pulse { + 0%, 100% { opacity: 1; } + 50% { opacity: 0.3; } +} + +.preview-actions { + display: flex; + gap: 0.4rem; +} + +.preview-btn { + padding: 0.3rem 0.6rem; + background: transparent; + color: var(--text-secondary); + border: 1px solid var(--border); + border-radius: 6px; + font-size: 0.75rem; + cursor: pointer; + transition: all 0.2s; + white-space: nowrap; +} + +.preview-btn:hover { + background: var(--bg-card-hover); + color: var(--text); + border-color: var(--border-light); +} + +.preview-iframe { + flex: 1; + width: calc(100% - 24px); + height: calc(100% - 24px); + border: none; + border-radius: 8px; + margin: 12px; + box-shadow: 0 0 20px rgba(59, 130, 246, 0.15); + background: #fff; +} + +/* ---- Animation ---- */ +@keyframes fadeIn { + from { opacity: 0; transform: translateY(8px); } + to { opacity: 1; transform: translateY(0); } +} + +/* ---- Responsive ---- */ +@media (max-width: 768px) { + .chat-sidebar { + position: fixed; + left: 0; + top: 0; + height: 100vh; + z-index: 50; + margin-left: calc(-1 * var(--sidebar-width)); + box-shadow: none; + } + + .chat-sidebar.sidebar-open { + margin-left: 0; + box-shadow: 4px 0 20px rgba(0, 0, 0, 0.5); + } + + .sidebar-toggle { + display: block; + } + + .sidebar-toggle-close { + display: block; + } + + .intro-card { + max-width: 100%; + } + + .login-box { + max-width: 100%; + } +} + +@media (max-width: 600px) { + .logo-area h1 { + font-size: 1.8rem; + } + + .logo-icon { + font-size: 2.5rem; + } + + .login-box { + padding: 1.5rem; + max-width: 100%; + } + + .intro-card { + padding: 1rem 1.2rem; + } + + .chat-header { + flex-wrap: wrap; + gap: 0.5rem; + } + + .persona-role { + display: none; + } + + .model-badge { + max-width: 120px; + } + + .message { + max-width: 92%; + } + + .mode-card { + padding: 1rem; + } +} diff --git a/docs/status-board/api-config.js b/docs/status-board/api-config.js new file mode 100644 index 00000000..b89051d5 --- /dev/null +++ b/docs/status-board/api-config.js @@ -0,0 +1,10 @@ +const API_CONFIG = { + BASE_URL: 'https://guanghulab.com', + ENDPOINTS: { + STATUS: '/api/v1/system/status', + DEVELOPERS: '/api/v1/developers', + BROADCASTS: '/api/v1/broadcasts' + }, + TIMEOUT: 8000, + REFRESH_INTERVAL: 30000 +}; diff --git a/docs/status-board/api.js b/docs/status-board/api.js new file mode 100644 index 00000000..0cdeeb7e --- /dev/null +++ b/docs/status-board/api.js @@ -0,0 +1,63 @@ +const MOCK_DATA = { + status: { + system_status: 'running', + version: 'v0.4.0', + uptime: '72h 15m', + api_calls_today: 142, + active_developers: 6, + last_deploy: '2026-03-04 02:00' + }, + developers: [ + { id: 'DEV-001', name: '页页', module: '后端中间层', status: 'active', progress: 100, phase: '环节5·HTTP联调' }, + { id: 'DEV-002', name: '肥猫', module: 'M01登录界面', status: 'waiting', progress: 60, phase: '环节1·等SYSLOG' }, + { id: 'DEV-003', name: '燕樊', module: 'M15云盘系统', status: 'waiting', progress: 55, phase: '环节1·等SYSLOG' }, + { id: 'DEV-004', name: '之之', module: '钉钉机器人', status: 'waiting', progress: 20, phase: '环节0·等SYSLOG' }, + { id: 'DEV-005', name: '小草莓', module: '系统状态看板', status: 'active', progress: 85, phase: '环节2·API接入' }, + { id: 'DEV-009', name: '花尔', module: 'M05用户中心', status: 'waiting', progress: 40, phase: '环节1·等SYSLOG' }, + { id: 'DEV-010', name: '桔子', module: 'M06工单管理', status: 'active', progress: 35, phase: '环节1·广播待出' }, + { id: 'DEV-011', name: '匆匆那年', module: 'BC-000 DEVlog', status: 'waiting', progress: 10, phase: '环节0·等SYSLOG' } + ], + broadcasts: [ + { id: 'DEV-012', module: 'M05用户中心', phase: '环节1', status: '等SYSLOG', time: '03-04 08:45' }, + { id: 'BC-看板-002', dev: '小草莓', module: '系统状态看板', phase: '环节2', status: '执行中', time: '03-04 08:50' }, + { id: 'BC-集成-001-M13', dev: '小草莓', module: 'M13协作调度', phase: '环节1', status: '已完成', time: '03-04 08:38' } + ] +}; + +async function fetchWithTimeout(url, timeout) { + const controller = new AbortController(); + const timer = setTimeout(() => controller.abort(), timeout); + try { + const res = await fetch(url, { signal: controller.signal }); + clearTimeout(timer); + return res; + } catch (err) { + clearTimeout(timer); + throw err; + } +} + +async function apiGet(endpoint, mockKey) { + try { + const res = await fetchWithTimeout(API_CONFIG.BASE_URL + endpoint, API_CONFIG.TIMEOUT); + if (!res.ok) throw new Error('HTTP ' + res.status); + return { data: await res.json(), isLive: true }; + } catch (err) { + console.warn('[HoloLake] API未就绪,使用模拟数据:', err.message); + return { data: MOCK_DATA[mockKey], isLive: false }; + } +} + +async function loadAllData() { + const [statusRes, devRes, bcRes] = await Promise.all([ + apiGet(API_CONFIG.ENDPOINTS.STATUS, 'status'), + apiGet(API_CONFIG.ENDPOINTS.DEVELOPERS, 'developers'), + apiGet(API_CONFIG.ENDPOINTS.BROADCASTS, 'broadcasts') + ]); + return { + status: statusRes.data, + developers: devRes.data, + broadcasts: bcRes.data, + isLive: statusRes.isLive && devRes.isLive && bcRes.isLive + }; +} diff --git a/docs/status-board/index.html b/docs/status-board/index.html new file mode 100644 index 00000000..1a22ee3b --- /dev/null +++ b/docs/status-board/index.html @@ -0,0 +1,239 @@ + + + + + + + 光湖系统 · 开发状态看板 + + + +
+ +
+ +
+ + 系统运行中 +
+
+ + +
+ +
+

⚙️ 系统状态

+
加载中...
+
+ +
+

👥 开发者进度

+
加载中...
+
+ +
+

📡 广播动态

+
加载中...
+
+ + +
+

👥 团队成员状态(静态)

+
+
+
+ DEV-001 + 活跃 +
+
+
页页
+
后端中间层
+
更新: 10:32
+
+
+
+
+ DEV-002 + 活跃 +
+
+
肥猫
+
飞书机器人
+
更新: 10:15
+
+
+
+
+ DEV-003 + 等待 +
+
+
燕樊
+
对话UI
+
更新: 09:47
+
+
+
+
+ DEV-004 + 活跃 +
+
+
小幸运
+
钉钉打通
+
更新: 11:02
+
+
+
+
+ DEV-005 + 编码中 +
+
+
小草莓
+
系统状态看板
+
更新: 刚刚
+
+
+
+
+ DEV-006 + 等待 +
+
+
小蔡同学
+
工单管理
+
更新: 09:20
+
+
+
+
+ DEV-007 + 编码中 +
+
+
四月
+
用户中心
+
更新: 10:55
+
+
+
+
+ DEV-008 + 等待 +
+
+
小锋
+
待分配
+
更新: 08:30
+
+
+
+
+ + +
+

📢 最近广播(静态)

+
+
+ BC-001 + HoloLake桌面UI框架 + 10:45 + 已完成 +
+
+ BC-002 + 对话界面设计 + 10:20 + 进行中 +
+
+ BC-003 + 人格体选择器 + 09:55 + 进行中 +
+
+ BC-004 + 云盘授权界面 + 09:30 + 待处理 +
+
+ BC-005 + 用户中心设计 + 08:50 + 待处理 +
+
+
+ + +
+ + +
+
+ + + + + + + + + + + + + \ No newline at end of file diff --git a/docs/status-board/render.js b/docs/status-board/render.js new file mode 100644 index 00000000..fce8015b --- /dev/null +++ b/docs/status-board/render.js @@ -0,0 +1,96 @@ +const STATUS_COLORS = { + active: '#4fc3f7', + waiting: '#ffa726', + done: '#66bb6a' +}; +const STATUS_LABELS = { + active: '执行中', + waiting: '等待中', + done: '已完成' +}; + +function renderSystemStatus(data) { + const c = document.getElementById('sys-status'); + if (!c) return; + c.innerHTML = ` +
+
🟢${data.system_status === 'running' ? '运行中' : '异常'}系统状态
+
⏱️${data.uptime}运行时长
+
📡${data.api_calls_today}今日API调用
+
👥${data.active_developers}活跃开发者
+
🚀${data.version}版本
+
📦${data.last_deploy}最后部署
+
+ `; +} + +function renderDevelopers(data) { + const c = document.getElementById('dev-list'); + if (!c) return; + let html = ''; + for (let i = 0; i < data.length; i++) { + const d = data[i]; + const color = STATUS_COLORS[d.status] || '#78909c'; + html += ` +
+
+ ${d.id} + ${d.name} + ${STATUS_LABELS[d.status] || d.status} +
+
${d.module} · ${d.phase}
+
+
${d.progress}%
+
+ `; + } + c.innerHTML = html; +} + +function renderBroadcasts(data) { + const c = document.getElementById('bc-list'); + if (!c) return; + let html = ''; + for (let i = 0; i < data.length; i++) { + const b = data[i]; + let cls = 'wait'; + if (b.status === '已完成' || b.status === 'done') cls = 'done'; + else if (b.status === '执行中' || b.status === 'active') cls = 'active'; + html += ` +
+ ${b.id} + ${b.dev || ''} + ${b.module} · ${b.phase} + ${b.status} + ${b.time} +
+ `; + } + c.innerHTML = html; +} + +function updateConnStatus(isLive) { + const el = document.getElementById('conn-status'); + if (!el) return; + el.innerHTML = isLive + ? ' 已连接 guanghulab.com' + : ' 离线模式(模拟数据)'; +} + +async function refreshDashboard() { + try { + const result = await loadAllData(); + renderSystemStatus(result.status); + renderDevelopers(result.developers); + renderBroadcasts(result.broadcasts); + updateConnStatus(result.isLive); + } catch (err) { + console.error('[HoloLake] 刷新失败:', err); + updateConnStatus(false); + } +} + +document.addEventListener('DOMContentLoaded', function() { + refreshDashboard(); + setInterval(refreshDashboard, API_CONFIG.REFRESH_INTERVAL); +}); diff --git a/docs/status-board/style.css b/docs/status-board/style.css new file mode 100644 index 00000000..e88ff987 --- /dev/null +++ b/docs/status-board/style.css @@ -0,0 +1,488 @@ +/* 全局样式 - 深色科技风 */ +* { + margin: 0; + padding: 0; + box-sizing: border-box; + font-family: 'Segoe UI', 'Courier New', monospace; +} + +body { + background-color: #0a0e17; + color: #e0e0e0; + line-height: 1.6; + padding: 20px; + min-height: 100vh; + display: flex; + justify-content: center; + align-items: center; +} + +.dashboard { + max-width: 1400px; + width: 100%; + margin: 0 auto; +} + +/* 标题栏 */ +.header { + background-color: #131a2b; + border-radius: 16px; + padding: 20px 30px; + margin-bottom: 30px; + display: flex; + justify-content: space-between; + align-items: center; + border: 1px solid #2a3440; + box-shadow: 0 4px 20px rgba(0, 212, 255, 0.1); +} + +.logo { + display: flex; + align-items: center; + gap: 12px; +} + +.logo-icon { + font-size: 32px; + filter: drop-shadow(0 0 8px #00d4ff); +} + +.logo h1 { + font-size: 1.8rem; + font-weight: 400; + letter-spacing: 1px; + color: #fff; + text-shadow: 0 0 10px rgba(0, 212, 255, 0.5); +} + +.status-indicator { + display: flex; + align-items: center; + gap: 8px; + background: #1e293b; + padding: 8px 16px; + border-radius: 40px; + border: 1px solid #00d4ff; +} + +.dot { + width: 12px; + height: 12px; + border-radius: 50%; + display: inline-block; +} + +.dot.green { + background-color: #00ff9d; + box-shadow: 0 0 10px #00ff9d; +} + +/* 团队成员卡片区 */ +.team-cards { + margin-bottom: 40px; +} + +.team-cards h2, .broadcast-list h2 { + font-size: 1.5rem; + margin-bottom: 20px; + color: #00d4ff; + font-weight: 300; + letter-spacing: 1px; + border-left: 4px solid #00d4ff; + padding-left: 16px; +} + +.card-grid { + display: grid; + grid-template-columns: repeat(4, 1fr); + gap: 20px; +} + +.card { + background-color: #131a2b; + border-radius: 16px; + padding: 20px; + border: 1px solid #2a3440; + transition: all 0.3s ease; + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5); +} + +.card:hover { + transform: translateY(-4px); + border-color: #00d4ff; + box-shadow: 0 8px 24px rgba(0, 212, 255, 0.2); +} + +.card-header { + display: flex; + justify-content: space-between; + align-items: center; + margin-bottom: 12px; + padding-bottom: 8px; + border-bottom: 1px solid #2a3440; +} + +.dev-id { + font-family: 'Courier New', monospace; + font-weight: bold; + color: #00d4ff; + font-size: 1rem; +} + +.status-badge { + font-size: 0.75rem; + padding: 4px 8px; + border-radius: 40px; + background-color: #1e293b; + border: 1px solid transparent; +} + +.status-badge.status-active { + background-color: #00ff9d20; + color: #00ff9d; + border-color: #00ff9d; +} + +.status-badge.status-standby { + background-color: #ffaa0020; + color: #ffaa00; + border-color: #ffaa00; +} + +.status-badge.status-coding { + background-color: #00d4ff20; + color: #00d4ff; + border-color: #00d4ff; +} + +.card-body .dev-name { + font-size: 1.2rem; + font-weight: 500; + color: #fff; + margin-bottom: 4px; +} + +.card-body .dev-module { + font-size: 0.9rem; + color: #a0a0a0; + margin-bottom: 8px; +} + +.card-body .update-time { + font-size: 0.8rem; + font-family: 'Courier New', monospace; + color: #6b7a8f; +} + +/* 广播列表区 */ +.broadcast-list { + margin-bottom: 40px; +} + +.list-container { + background-color: #131a2b; + border-radius: 16px; + border: 1px solid #2a3440; + overflow: hidden; +} + +.list-item { + display: grid; + grid-template-columns: 100px 1fr 100px 100px; + padding: 16px 24px; + border-bottom: 1px solid #2a3440; + align-items: center; + transition: background 0.2s; +} + +.list-item:last-child { + border-bottom: none; +} + +.list-item:hover { + background-color: #1e293b; +} + +.broadcast-id { + font-family: 'Courier New', monospace; + color: #00d4ff; + font-weight: bold; +} + +.broadcast-title { + color: #fff; +} + +.broadcast-time { + font-family: 'Courier New', monospace; + color: #a0a0a0; +} + +.broadcast-status { + font-size: 0.85rem; + padding: 4px 8px; + border-radius: 40px; + text-align: center; + width: fit-content; +} + +.status-done { + background-color: #00ff9d20; + color: #00ff9d; + border: 1px solid #00ff9d; +} + +.status-progress { + background-color: #00d4ff20; + color: #00d4ff; + border: 1px solid #00d4ff; +} + +.status-pending { + background-color: #ffaa0020; + color: #ffaa00; + border: 1px solid #ffaa00; +} + +/* 底部信息栏 */ +.footer { + background-color: #131a2b; + border-radius: 16px; + padding: 16px 24px; + display: flex; + justify-content: space-between; + align-items: center; + font-size: 0.9rem; + border: 1px solid #2a3440; + color: #6b7a8f; +} + +.footer-left { + font-family: 'Courier New', monospace; +} + +.footer-right { + font-family: 'Courier New', monospace; + color: #00d4ff; +} + +/* 响应式布局 */ +@media screen and (max-width: 1024px) { + .card-grid { + grid-template-columns: repeat(2, 1fr); + } +} + +@media screen and (max-width: 640px) { + .card-grid { + grid-template-columns: 1fr; + } + + .list-item { + grid-template-columns: 80px 1fr 80px 80px; + padding: 12px 16px; + font-size: 0.85rem; + } + + .header { + flex-direction: column; + align-items: flex-start; + gap: 12px; + } +}/* ========== 环节2新增:API数据区域样式 ========== */ + +/* 连接状态指示器 */ +.conn-status { + text-align: center; + padding: 8px 16px; + font-size: 12px; + color: #8899aa; + border-bottom: 1px solid rgba(255,255,255,0.06); +} + +.conn-dot { + display: inline-block; + width: 8px; + height: 8px; + border-radius: 50%; + margin-right: 6px; + vertical-align: middle; +} + +.conn-dot.on { + background: #66bb6a; + box-shadow: 0 0 6px #66bb6a; +} + +.conn-dot.off { + background: #ffa726; +} + +/* 数据区块 */ +.data-section { + padding: 20px 16px; + border-bottom: 1px solid rgba(255,255,255,0.06); +} + +.section-title { + font-size: 16px; + font-weight: 600; + color: #e0e6ed; + margin-bottom: 16px; +} + +.data-container { + color: #8899aa; + font-size: 13px; +} + +/* 系统状态网格 */ +.status-grid { + display: grid; + grid-template-columns: repeat(3, 1fr); + gap: 10px; +} + +.s-card { + background: rgba(79,195,247,0.06); + border: 1px solid rgba(79,195,247,0.12); + border-radius: 10px; + padding: 14px 10px; + text-align: center; +} + +.s-icon { + display: block; + font-size: 20px; + margin-bottom: 4px; +} + +.s-val { + display: block; + font-size: 16px; + font-weight: bold; + color: #4fc3f7; + margin-bottom: 2px; +} + +.s-lbl { + display: block; + font-size: 11px; + color: #667788; +} + +/* 开发者卡片 */ +.dev-card { + background: rgba(255,255,255,0.03); + border-radius: 10px; + padding: 14px 16px; + margin-bottom: 8px; + border: 1px solid rgba(255,255,255,0.06); +} + +.dev-top { + display: flex; + align-items: center; + gap: 8px; + margin-bottom: 6px; +} + +.dev-id { + font-size: 11px; + color: #556677; + font-family: monospace; +} + +.dev-name { + font-size: 14px; + color: #e0e6ed; + font-weight: 600; + flex: 1; +} + +.dev-st { + font-size: 12px; +} + +.dev-mod { + font-size: 12px; + color: #8899aa; + margin-bottom: 8px; +} + +.prog-bar { + height: 6px; + background: rgba(255,255,255,0.08); + border-radius: 3px; + overflow: hidden; + margin-bottom: 4px; +} + +.prog-fill { + height: 100%; + border-radius: 3px; + transition: width 0.8s ease; +} + +.prog-num { + font-size: 11px; + color: #8899aa; + text-align: right; +} + +/* 广播行 */ +.bc-row { + display: flex; + align-items: center; + gap: 10px; + padding: 10px 12px; + border-bottom: 1px solid rgba(255,255,255,0.04); + font-size: 13px; +} + +.bc-id { + color: #4fc3f7; + font-family: monospace; + font-size: 11px; + min-width: 110px; +} + +.bc-dev { + color: #e0e6ed; + min-width: 55px; +} + +.bc-mod { + color: #8899aa; + flex: 1; +} + +.bc-st { + min-width: 60px; + text-align: center; + padding: 2px 8px; + border-radius: 10px; + font-size: 11px; +} + +.bc-st.done { + background: rgba(102,187,106,0.15); + color: #66bb6a; +} + +.bc-st.active { + background: rgba(79,195,247,0.15); + color: #4fc3f7; +} + +.bc-st.wait { + background: rgba(255,167,38,0.15); + color: #ffa726; +} + +.bc-time { + color: #556677; + font-size: 11px; + min-width: 80px; + text-align: right; +} diff --git a/docs/status-board/ws-client.js b/docs/status-board/ws-client.js new file mode 100644 index 00000000..26b4fe84 --- /dev/null +++ b/docs/status-board/ws-client.js @@ -0,0 +1,121 @@ +// ========== HoloLake 看板 · WebSocket 客户端模块 ========== +// 功能:连接管理、自动重连(指数退避)、心跳检测、状态回调 + +class WebSocketClient { + constructor(url, options = {}) { + this.url = url; + this.reconnectInterval = options.reconnectInterval || 1000; // 初始重连间隔 1秒 + this.maxReconnectInterval = options.maxReconnectInterval || 30000; // 最大30秒 + this.heartbeatInterval = options.heartbeatInterval || 30000; // 心跳间隔30秒 + this.onMessage = options.onMessage || (() => {}); + this.onStatusChange = options.onStatusChange || (() => {}); + + this.ws = null; + this.reconnectTimer = null; + this.heartbeatTimer = null; + this.forcedClose = false; + this.reconnectAttempts = 0; + } + + // 连接 + connect() { + if (this.ws && this.ws.readyState === WebSocket.OPEN) return; + this.forcedClose = false; + this.onStatusChange('connecting'); + try { + this.ws = new WebSocket(this.url); + } catch (e) { + console.error('[WS] 连接失败', e); + this._scheduleReconnect(); + return; + } + + this.ws.onopen = () => { + console.log('[WS] 连接成功'); + this.reconnectAttempts = 0; + this.onStatusChange('connected'); + this._startHeartbeat(); + }; + + this.ws.onmessage = (event) => { + try { + const data = JSON.parse(event.data); + this.onMessage(data); + } catch (e) { + console.warn('[WS] 消息解析失败', e); + } + }; + + this.ws.onclose = (event) => { + console.log('[WS] 连接关闭', event.code, event.reason); + this._stopHeartbeat(); + if (!this.forcedClose) { + this.onStatusChange('disconnected'); + this._scheduleReconnect(); + } else { + this.onStatusChange('offline'); + } + }; + + this.ws.onerror = (error) => { + console.error('[WS] 错误', error); + this.onStatusChange('error'); + }; + } + + // 主动断开 + disconnect() { + this.forcedClose = true; + if (this.reconnectTimer) { + clearTimeout(this.reconnectTimer); + this.reconnectTimer = null; + } + this._stopHeartbeat(); + if (this.ws) { + this.ws.close(); + this.ws = null; + } + } + + // 发送消息 + send(data) { + if (this.ws && this.ws.readyState === WebSocket.OPEN) { + this.ws.send(JSON.stringify(data)); + } else { + console.warn('[WS] 未连接,无法发送'); + } + } + + // 重连调度(指数退避) + _scheduleReconnect() { + if (this.forcedClose) return; + const delay = Math.min( + this.reconnectInterval * Math.pow(2, this.reconnectAttempts), + this.maxReconnectInterval + ); + console.log(`[WS] ${delay}ms 后尝试重连...`); + this.onStatusChange('reconnecting'); + if (this.reconnectTimer) clearTimeout(this.reconnectTimer); + this.reconnectTimer = setTimeout(() => { + this.reconnectAttempts++; + this.connect(); + }, delay); + } + + // 心跳 + _startHeartbeat() { + this._stopHeartbeat(); + this.heartbeatTimer = setInterval(() => { + if (this.ws && this.ws.readyState === WebSocket.OPEN) { + this.send({ type: 'ping' }); + } + }, this.heartbeatInterval); + } + + _stopHeartbeat() { + if (this.heartbeatTimer) { + clearInterval(this.heartbeatTimer); + this.heartbeatTimer = null; + } + } +} \ No newline at end of file diff --git a/docs/ticket-system/index.html b/docs/ticket-system/index.html new file mode 100644 index 00000000..bfac39d1 --- /dev/null +++ b/docs/ticket-system/index.html @@ -0,0 +1,809 @@ + + + + + + 工单管理 · HoloLake · 视觉优化版 + + + + +
+ + +
+
+
+
5
+
总工单
+
+
+
3
+
进行中
+
+
+
1
+
已完成
+
+
+
1
+
待分配
+
+
+ +
+

工单列表

+ +
+ +
+ 编号↑ + + +
+ +
+
+ +
+ HoloLake Era · AGE OS v1.0 · 光湖团队 +
+
+ + + + + +background: linear-gradient(135deg, #0a1628 0%, #1a2a4a 50%, #0d1f3c 100%); + \ No newline at end of file diff --git a/docs/ticket-system/script.js b/docs/ticket-system/script.js new file mode 100644 index 00000000..358ac3b2 --- /dev/null +++ b/docs/ticket-system/script.js @@ -0,0 +1,301 @@ +/* ============================================ + HoloLake · M06 工单管理界面 · 逻辑层 + 环节3:响应式 + 数据导出(JSON/CSV) + DEV-010 桔子 + ============================================ */ +// === 状态流转规则 === +const STATUS_FLOW = { + 'pending': { next: 'active', label: '待处理' }, + 'active': { next: 'done', label: '进行中' }, + 'done': { next: 'pending', label: '已完成' } +}; +// === 初始化 · 从 localStorage 读取工单 === +let tickets = JSON.parse(localStorage.getItem('holotake_tic +kets') || '[]'); +// === 保存到 localStorage === +function saveTickets() { + localStorage.setItem('holotake_tickets', JSON.stringify(t +ickets)); +} +// === 生成工单编号 === +function generateId() { + const now = new Date(); + const dateStr = [ + now.getFullYear(), +📡 BC-M06-001 · DEV-010桔子 · 工单管理界面·环节3·响应式布局+数据导出 18 + String(now.getMonth() + 1).padStart(2, '0'), + String(now.getDate()).padStart(2, '0') + ].join(''); + const rand = String(Math.floor(Math.random() * 1000)).pad +Start(3, '0'); + return 'TK-' + dateStr + '-' + rand; +} +// === 渲染统计卡片 === +function renderStats() { + const total = tickets.length; + const pending = tickets.filter(t => t.status === 'pendin +g').length; + const active = tickets.filter(t => t.status === 'activ +e').length; + const done = tickets.filter(t => t.status === 'done').len +gth; + document.getElementById('statTotal').textContent = total; + document.getElementById('statPending').textContent = pend +ing; + document.getElementById('statActive').textContent = activ +e; + document.getElementById('statDone').textContent = done; +} +// === 获取筛选和排序后的工单列表 === +function getFilteredTickets() { + const filterStatus = document.getElementById('filterStatu +s').value; + const sortBy = document.getElementById('sortBy').value; + let list = [...tickets]; + // 筛选 + if (filterStatus !== 'all') { + list = list.filter(t => t.status === filterStatus); + } +📡 BC-M06-001 · DEV-010桔子 · 工单管理界面·环节3·响应式布局+数据导出 19 + // 排序 + if (sortBy === 'newest') { + list.sort((a, b) => new Date(b.createdAt) - new Date(a. +createdAt)); + } else if (sortBy === 'oldest') { + list.sort((a, b) => new Date(a.createdAt) - new Date(b. +createdAt)); + } else if (sortBy === 'status') { + const order = { 'pending': 0, 'active': 1, 'done': 2 }; + list.sort((a, b) => order[a.status] - order[b.status]); + } + return list; +} +// === 渲染工单列表 === +function renderTickets() { + const list = getFilteredTickets(); + const container = document.getElementById('ticketList'); + if (list.length === 0) { + container.innerHTML = '
📋
暂无工单,点 +击上方按钮新建
'; + return; + } + container.innerHTML = list.map(ticket => { + const statusInfo = STATUS_FLOW[ticket.status]; + return '
' + + '' + ticket.id + '' + + '
' + + '
' + escapeHtml(ticket.ti +tle) + '
' + + '
负责人:' + escapeHtml(tic +ket.assignee) + ' · ' + formatDate(ticket.createdAt) + '' + +📡 BC-M06-001 · DEV-010桔子 · 工单管理界面·环节3·响应式布局+数据导出 20 + '
' + + '
' + + '' + statusInf +o.label + '' + + '' + + '
' + + '
'; + }).join(''); +} +// === HTML转义(防XSS) === +function escapeHtml(str) { + const div = document.createElement('div'); + div.textContent = str; + return div.innerHTML; +} +// === 格式化日期 === +function formatDate(dateStr) { + const d = new Date(dateStr); + return d.getFullYear() + '-' + + String(d.getMonth() + 1).padStart(2, '0') + '-' + + String(d.getDate()).padStart(2, '0') + ' ' + + String(d.getHours()).padStart(2, '0') + ':' + + String(d.getMinutes()).padStart(2, '0'); +} +// === 切换工单状态 === +function toggleStatus(id) { + const ticket = tickets.find(t => t.id === id); + if (!ticket) return; + ticket.status = STATUS_FLOW[ticket.status].next; + saveTickets(); + renderAll(); +} +📡 BC-M06-001 · DEV-010桔子 · 工单管理界面·环节3·响应式布局+数据导出 21 +// === 删除工单 === +function deleteTicket(id) { + if (!confirm('确认删除这条工单?')) return; + tickets = tickets.filter(t => t.id !== id); + saveTickets(); + renderAll(); +} +// === 新建工单弹窗 === +function openModal() { + document.getElementById('modalOverlay').classList.add('sh +ow'); + document.getElementById('inputTitle').value = ''; + document.getElementById('inputAssignee').value = ''; + document.getElementById('inputDetail').value = ''; + document.getElementById('inputTitle').focus(); +} +function closeModal() { + document.getElementById('modalOverlay').classList.remove +('show'); +} +// === 提交新建工单 === +function submitTicket() { + const title = document.getElementById('inputTitle').valu +e.trim(); + const assignee = document.getElementById('inputAssigne +e').value.trim(); + const detail = document.getElementById('inputDetail').val +ue.trim(); + if (!title) { + alert('请填写工单标题'); + return; + } + if (!assignee) { + alert('请填写负责人'); +📡 BC-M06-001 · DEV-010桔子 · 工单管理界面·环节3·响应式布局+数据导出 22 + return; + } + const newTicket = { + id: generateId(), + title: title, + assignee: assignee, + detail: detail, + status: 'pending', + createdAt: new Date().toISOString() + }; + tickets.unshift(newTicket); + saveTickets(); + closeModal(); + renderAll(); +} +// === 重置全部工单 === +function resetTickets() { + if (!confirm('确认清空所有工单数据?此操作不可恢复!')) return; + tickets = []; + saveTickets(); + renderAll(); +} +// ============================================ +// 环节3新增:导出功能 +// ============================================ +// === 导出下拉菜单控制 === +function toggleExportMenu() { + const dropdown = document.getElementById('exportDropdow +n'); + const clickAway = document.getElementById('clickAway'); + const isOpen = dropdown.classList.contains('show'); + if (isOpen) { +📡 BC-M06-001 · DEV-010桔子 · 工单管理界面·环节3·响应式布局+数据导出 23 + closeExportMenu(); + } else { + dropdown.classList.add('show'); + clickAway.classList.add('show'); + } +} +function closeExportMenu() { + document.getElementById('exportDropdown').classList.remov +e('show'); + document.getElementById('clickAway').classList.remove('sh +ow'); +} +// === 导出为 JSON 文件 === +function exportJSON() { + closeExportMenu(); + if (tickets.length === 0) { + alert('当前没有工单数据可导出'); + return; + } + const data = JSON.stringify(tickets, null, 2); + const blob = new Blob([data], { type: 'application/json;c +harset=utf-8' }); + const url = URL.createObjectURL(blob); + const a = document.createElement('a'); + a.href = url; + a.download = 'HoloLake-Tickets-' + getDateStamp() + '.jso +n'; + document.body.appendChild(a); + a.click(); + document.body.removeChild(a); + URL.revokeObjectURL(url); +} +📡 BC-M06-001 · DEV-010桔子 · 工单管理界面·环节3·响应式布局+数据导出 24 +// === 导出为 CSV 文件 === +function exportCSV() { + closeExportMenu(); + if (tickets.length === 0) { + alert('当前没有工单数据可导出'); + return; + } + // CSV表头 + const header = '编号,标题,负责人,状态,详情,创建时间'; + // CSV内容行 + const rows = tickets.map(t => { + const statusLabel = STATUS_FLOW[t.status] ? STATUS_FLOW +[t.status].label : t.status; + return [ + t.id, + csvEscape(t.title), + csvEscape(t.assignee), + statusLabel, + csvEscape(t.detail || ''), + formatDate(t.createdAt) + ].join(','); + }); + const csv = '\uFEFF' + header + '\n' + rows.join('\n'); + const blob = new Blob([csv], { type: 'text/csv;charset=ut +f-8' }); + const url = URL.createObjectURL(blob); + const a = document.createElement('a'); + a.href = url; + a.download = 'HoloLake-Tickets-' + getDateStamp() + '.cs +v'; + document.body.appendChild(a); + a.click(); + document.body.removeChild(a); +📡 BC-M06-001 · DEV-010桔子 · 工单管理界面·环节3·响应式布局+数据导出 25 + URL.revokeObjectURL(url); +} +// === CSV字段转义(处理逗号和引号) === +function csvEscape(str) { + if (!str) return ''; + if (str.includes(',') || str.includes('"') || str.include +s('\n')) { + return '"' + str.replace(/"/g, '""') + '"'; + } + return str; +} +// === 生成日期戳(用于文件名) === +function getDateStamp() { + const now = new Date(); + return now.getFullYear() + + String(now.getMonth() + 1).padStart(2, '0') + + String(now.getDate()).padStart(2, '0') + '-' + + String(now.getHours()).padStart(2, '0') + + String(now.getMinutes()).padStart(2, '0'); +} +// === 统一渲染 === +function renderAll() { + renderStats(); + renderTickets(); +} +// === 筛选/排序变化时重新渲染 === +document.getElementById('filterStatus').addEventListener('c +hange', renderTickets); +document.getElementById('sortBy').addEventListener('chang +e', renderTickets); +// === 弹窗点击遮罩关闭 === +document.getElementById('modalOverlay').addEventListener('c +lick', function(e) { +📡 BC-M06-001 · DEV-010桔子 · 工单管理界面·环节3·响应式布局+数据导出 26 + if (e.target === this) closeModal(); +}); +// === 页面加载完成 · 首次渲染 === +renderAll(); diff --git a/docs/ticket-system/style.css b/docs/ticket-system/style.css new file mode 100644 index 00000000..6a2a6ccf --- /dev/null +++ b/docs/ticket-system/style.css @@ -0,0 +1,527 @@ +/* ============================================ + HoloLake · M06 工单管理界面 · 样式表 + 环节3:响应式布局 · 深蓝主题 + DEV-010 桔子 + ============================================ */ +/* === 全局变量 === */ +:root { + --bg-primary: #0a0e27; + --bg-secondary: #111638; + --bg-card: #161b4a; + --bg-hover: #1e2460; + --border-color: #2a3070; + --text-primary: #e8eaff; + --text-secondary: #8b90c0; + --accent-blue: #4a6cf7; + --accent-blue-hover: #5b7bf8; + --accent-green: #22c55e; + --accent-yellow: #eab308; + --accent-red: #ef4444; + --accent-purple: #a855f7; + --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3); + --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.4); + --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.5); + --radius-sm: 6px; + --radius-md: 10px; + --radius-lg: 14px; +} +/* === 基础重置 === */ +* { +📡 BC-M06-001 · DEV-010桔子 · 工单管理界面·环节3·响应式布局+数据导出 2 + margin: 0; + padding: 0; + box-sizing: border-box; +} +body { + font-family: -apple-system, BlinkMacSystemFont, "Segoe U +I", "PingFang SC", "Microsoft YaHei", sans-serif; + background: var(--bg-primary); + color: var(--text-primary); + min-height: 100vh; + line-height: 1.6; +} +/* === 主容器 === */ +.app-container { + max-width: 900px; + margin: 0 auto; + padding: 20px 24px; +} +/* === 顶部标题栏 === */ +.app-header { + text-align: center; + padding: 24px 0 20px; + border-bottom: 1px solid var(--border-color); + margin-bottom: 24px; +} +.app-header h1 { + font-size: 22px; + font-weight: 700; + color: var(--text-primary); + letter-spacing: 1px; +} +.app-header .subtitle { + font-size: 13px; +📡 BC-M06-001 · DEV-010桔子 · 工单管理界面·环节3·响应式布局+数据导出 3 + color: var(--text-secondary); + margin-top: 4px; +} +/* === 操作栏(新建 + 导出) === */ +.header-actions { + display: flex; + justify-content: center; + align-items: center; + gap: 12px; + margin-bottom: 24px; + flex-wrap: wrap; +} +.btn { + display: inline-flex; + align-items: center; + gap: 6px; + padding: 10px 20px; + border: none; + border-radius: var(--radius-sm); + font-size: 14px; + font-weight: 600; + cursor: pointer; + transition: all 0.2s ease; + white-space: nowrap; +} +.btn-primary { + background: var(--accent-blue); + color: #fff; +} +.btn-primary:hover { + background: var(--accent-blue-hover); + box-shadow: var(--shadow-sm); +} +📡 BC-M06-001 · DEV-010桔子 · 工单管理界面·环节3·响应式布局+数据导出 4 +.btn-secondary { + background: var(--bg-card); + color: var(--text-primary); + border: 1px solid var(--border-color); +} +.btn-secondary:hover { + background: var(--bg-hover); +} +/* === 导出下拉菜单 === */ +.export-wrapper { + position: relative; +} +.export-dropdown { + display: none; + position: absolute; + top: calc(100% + 6px); + left: 50%; + transform: translateX(-50%); + background: var(--bg-card); + border: 1px solid var(--border-color); + border-radius: var(--radius-sm); + box-shadow: var(--shadow-md); + z-index: 100; + min-width: 160px; + overflow: hidden; +} +.export-dropdown.show { + display: block; +} +.export-dropdown .export-item { + display: block; + width: 100%; + padding: 10px 16px; +📡 BC-M06-001 · DEV-010桔子 · 工单管理界面·环节3·响应式布局+数据导出 5 + background: none; + border: none; + color: var(--text-primary); + font-size: 14px; + text-align: left; + cursor: pointer; + transition: background 0.15s; +} +.export-dropdown .export-item:hover { + background: var(--bg-hover); +} +.export-dropdown .export-item + .export-item { + border-top: 1px solid var(--border-color); +} +/* === 统计卡片 === */ +.stats-grid { + display: grid; + grid-template-columns: repeat(4, 1fr); + gap: 12px; + margin-bottom: 24px; +} +.stat-card { + background: var(--bg-card); + border: 1px solid var(--border-color); + border-radius: var(--radius-md); + padding: 16px; + text-align: center; + transition: transform 0.2s, box-shadow 0.2s; +} +.stat-card:hover { + transform: translateY(-2px); + box-shadow: var(--shadow-sm); +} +📡 BC-M06-001 · DEV-010桔子 · 工单管理界面·环节3·响应式布局+数据导出 6 +.stat-card .stat-number { + font-size: 28px; + font-weight: 700; + line-height: 1.2; +} +.stat-card .stat-label { + font-size: 12px; + color: var(--text-secondary); + margin-top: 4px; +} +.stat-card.total .stat-number { color: var(--accent-blue); +} +.stat-card.pending .stat-number { color: var(--accent-yello +w); } +.stat-card.active .stat-number { color: var(--accent-gree +n); } +.stat-card.done .stat-number { color: var(--accent-purple); +} +/* === 筛选排序栏 === */ +.filter-bar { + display: flex; + gap: 10px; + margin-bottom: 20px; + flex-wrap: wrap; +} +.filter-bar select { + flex: 1; + min-width: 120px; + padding: 8px 12px; + background: var(--bg-card); + color: var(--text-primary); + border: 1px solid var(--border-color); + border-radius: var(--radius-sm); +📡 BC-M06-001 · DEV-010桔子 · 工单管理界面·环节3·响应式布局+数据导出 7 + font-size: 13px; + cursor: pointer; + appearance: none; + -webkit-appearance: none; + background-image: url("data:image/svg+xml,%3Csvg xmlns='h +ttp://www.w3.org/2000/svg' width='12' height='12' fill='%23 +8b90c0'%3E%3Cpath d='M6 8L1 3h10z'/%3E%3C/svg%3E"); + background-repeat: no-repeat; + background-position: right 10px center; + padding-right: 30px; +} +.filter-bar select:focus { + outline: none; + border-color: var(--accent-blue); +} +/* === 工单列表 === */ +.ticket-list { + display: flex; + flex-direction: column; + gap: 10px; +} +.ticket-item { + background: var(--bg-card); + border: 1px solid var(--border-color); + border-radius: var(--radius-md); + padding: 16px; + display: flex; + align-items: center; + gap: 14px; + transition: background 0.15s; +} +.ticket-item:hover { + background: var(--bg-hover); +} +📡 BC-M06-001 · DEV-010桔子 · 工单管理界面·环节3·响应式布局+数据导出 8 +.ticket-id { + font-size: 12px; + color: var(--text-secondary); + font-family: "SF Mono", "Fira Code", monospace; + min-width: 60px; +} +.ticket-info { + flex: 1; + min-width: 0; +} +.ticket-title { + font-size: 15px; + font-weight: 600; + color: var(--text-primary); + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} +.ticket-meta { + font-size: 12px; + color: var(--text-secondary); + margin-top: 2px; +} +.ticket-actions { + display: flex; + align-items: center; + gap: 8px; + flex-shrink: 0; +} +/* === 状态标签(可点击切换) === */ +.status-badge { + display: inline-block; +📡 BC-M06-001 · DEV-010桔子 · 工单管理界面·环节3·响应式布局+数据导出 9 + padding: 4px 12px; + border-radius: 20px; + font-size: 12px; + font-weight: 600; + cursor: pointer; + transition: opacity 0.2s; + white-space: nowrap; +} +.status-badge:hover { + opacity: 0.85; +} +.status-badge.pending { + background: rgba(234, 179, 8, 0.15); + color: var(--accent-yellow); + border: 1px solid rgba(234, 179, 8, 0.3); +} +.status-badge.active { + background: rgba(34, 197, 94, 0.15); + color: var(--accent-green); + border: 1px solid rgba(34, 197, 94, 0.3); +} +.status-badge.done { + background: rgba(168, 85, 247, 0.15); + color: var(--accent-purple); + border: 1px solid rgba(168, 85, 247, 0.3); +} +/* === 删除按钮 === */ +.btn-delete { + background: none; + border: 1px solid transparent; + color: var(--text-secondary); + font-size: 16px; + cursor: pointer; +📡 BC-M06-001 · DEV-010桔子 · 工单管理界面·环节3·响应式布局+数据导出 10 + padding: 4px 8px; + border-radius: var(--radius-sm); + transition: all 0.2s; +} +.btn-delete:hover { + color: var(--accent-red); + background: rgba(239, 68, 68, 0.1); + border-color: rgba(239, 68, 68, 0.3); +} +/* === 空状态 === */ +.empty-state { + text-align: center; + padding: 60px 20px; + color: var(--text-secondary); +} +.empty-state .empty-icon { + font-size: 48px; + margin-bottom: 12px; +} +.empty-state .empty-text { + font-size: 15px; +} +/* === 弹窗遮罩 === */ +.modal-overlay { + display: none; + position: fixed; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: rgba(0, 0, 0, 0.6); + z-index: 1000; + justify-content: center; +📡 BC-M06-001 · DEV-010桔子 · 工单管理界面·环节3·响应式布局+数据导出 11 + align-items: center; + padding: 20px; +} +.modal-overlay.show { + display: flex; +} +/* === 弹窗 === */ +.modal { + background: var(--bg-secondary); + border: 1px solid var(--border-color); + border-radius: var(--radius-lg); + padding: 28px; + width: 100%; + max-width: 480px; + box-shadow: var(--shadow-lg); +} +.modal h2 { + font-size: 18px; + margin-bottom: 20px; + color: var(--text-primary); +} +.modal .form-group { + margin-bottom: 16px; +} +.modal label { + display: block; + font-size: 13px; + color: var(--text-secondary); + margin-bottom: 6px; +} +.modal input, +.modal select, +📡 BC-M06-001 · DEV-010桔子 · 工单管理界面·环节3·响应式布局+数据导出 12 +.modal textarea { + width: 100%; + padding: 10px 12px; + background: var(--bg-card); + color: var(--text-primary); + border: 1px solid var(--border-color); + border-radius: var(--radius-sm); + font-size: 14px; +} +.modal input:focus, +.modal select:focus, +.modal textarea:focus { + outline: none; + border-color: var(--accent-blue); +} +.modal textarea { + resize: vertical; + min-height: 80px; +} +.modal .form-actions { + display: flex; + gap: 10px; + justify-content: flex-end; + margin-top: 20px; +} +/* === 点击外部关闭下拉菜单的辅助层 === */ +.click-away { + display: none; + position: fixed; + top: 0; + left: 0; + right: 0; + bottom: 0; + z-index: 99; +📡 BC-M06-001 · DEV-010桔子 · 工单管理界面·环节3·响应式布局+数据导出 13 +} +.click-away.show { + display: block; +} +/* ============================================ + 响应式布局 · 平板端(481px ~ 768px) + ============================================ */ +@media screen and (max-width: 768px) { + .app-container { + padding: 16px; + } + .app-header h1 { + font-size: 20px; + } + .stats-grid { + grid-template-columns: repeat(4, 1fr); + gap: 8px; + } + .stat-card { + padding: 12px 8px; + } + .stat-card .stat-number { + font-size: 24px; + } + .stat-card .stat-label { + font-size: 11px; + } + .ticket-item { + padding: 12px; + gap: 10px; +📡 BC-M06-001 · DEV-010桔子 · 工单管理界面·环节3·响应式布局+数据导出 14 + } +} +/* ============================================ + 响应式布局 · 手机端(<=480px) + ============================================ */ +@media screen and (max-width: 480px) { + .app-container { + padding: 12px; + } + .app-header { + padding: 16px 0 14px; + margin-bottom: 16px; + } + .app-header h1 { + font-size: 18px; + } + /* 统计卡片手机端变2列 */ + .stats-grid { + grid-template-columns: repeat(2, 1fr); + gap: 8px; + } + .stat-card { + padding: 12px 10px; + } + .stat-card .stat-number { + font-size: 22px; + } + /* 操作按钮自适应 */ + .header-actions { + gap: 8px; + } +📡 BC-M06-001 · DEV-010桔子 · 工单管理界面·环节3·响应式布局+数据导出 15 + .btn { + padding: 8px 14px; + font-size: 13px; + } + /* 筛选栏纵向排列 */ + .filter-bar { + flex-direction: column; + gap: 8px; + } + .filter-bar select { + width: 100%; + } + /* 工单卡片纵向排列 */ + .ticket-item { + flex-direction: column; + align-items: flex-start; + gap: 8px; + padding: 14px; + } + .ticket-id { + min-width: auto; + } + .ticket-info { + width: 100%; + } + .ticket-title { + white-space: normal; + word-break: break-all; + } + .ticket-actions { +📡 BC-M06-001 · DEV-010桔子 · 工单管理界面·环节3·响应式布局+数据导出 16 + width: 100%; + justify-content: space-between; + } + /* 导出下拉菜单手机端定位优化 */ + .export-dropdown { + left: auto; + right: 0; + transform: none; + } + /* 弹窗手机端全屏 */ + .modal-overlay { + padding: 0; + align-items: flex-end; + } + .modal { + max-width: 100%; + border-radius: var(--radius-lg) var(--radius-lg) 0 0; + padding: 24px 20px; + max-height: 90vh; + overflow-y: auto; + } + .modal .form-actions { + flex-direction: column; + } + .modal .form-actions .btn { + width: 100%; + justify-content: center; + } +} diff --git a/docs/writing/assets/index--C4_NgnM.css b/docs/writing/assets/index--C4_NgnM.css new file mode 100644 index 00000000..4cb341ca --- /dev/null +++ b/docs/writing/assets/index--C4_NgnM.css @@ -0,0 +1 @@ +*,:before,:after,::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#3b82f680;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }*,:before,:after{box-sizing:border-box;border:0 solid #e5e7eb}:before,:after{--tw-content:""}html,:host{-webkit-text-size-adjust:100%;tab-size:4;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent;font-family:Inter,system-ui,-apple-system,sans-serif;line-height:1.5}body{line-height:inherit;margin:0}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-feature-settings:normal;font-variation-settings:normal;font-family:JetBrains Mono,Fira Code,monospace;font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-feature-settings:inherit;font-variation-settings:inherit;font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:#0000;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{margin:0;padding:0;list-style:none}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder{opacity:1;color:#9ca3af}textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.inset-0{inset:0}.left-0{left:0}.right-0{right:0}.top-0{top:0}.-z-10{z-index:-10}.z-50{z-index:50}.mx-auto{margin-left:auto;margin-right:auto}.mb-1{margin-bottom:.25rem}.mb-10{margin-bottom:2.5rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.mr-2{margin-right:.5rem}.mt-0\.5{margin-top:.125rem}.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-8{margin-top:2rem}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.h-14{height:3.5rem}.h-16{height:4rem}.h-24{height:6rem}.h-32{height:8rem}.h-9{height:2.25rem}.min-h-\[300px\]{min-height:300px}.min-h-\[5rem\]{min-height:5rem}.min-h-screen{min-height:100vh}.w-14{width:3.5rem}.w-16{width:4rem}.w-24{width:6rem}.w-32{width:8rem}.w-9{width:2.25rem}.w-full{width:100%}.max-w-4xl{max-width:56rem}.max-w-6xl{max-width:72rem}.max-w-\[75\%\]{max-width:75%}.max-w-lg{max-width:32rem}.max-w-md{max-width:28rem}.max-w-sm{max-width:24rem}.flex-1{flex:1}.flex-shrink-0{flex-shrink:0}@keyframes pulse{50%{opacity:.5}}.animate-pulse{animation:2s cubic-bezier(.4,0,.6,1) infinite pulse}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.flex-row{flex-direction:row}.flex-row-reverse{flex-direction:row-reverse}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:.25rem}.gap-1\.5{gap:.375rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}.space-y-6>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.5rem * var(--tw-space-y-reverse))}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.whitespace-nowrap{white-space:nowrap}.whitespace-pre-line{white-space:pre-line}.whitespace-pre-wrap{white-space:pre-wrap}.rounded-2xl{border-radius:1rem}.rounded-full{border-radius:9999px}.rounded-xl{border-radius:.75rem}.rounded-tl-md{border-top-left-radius:.375rem}.rounded-tr-md{border-top-right-radius:.375rem}.border{border-width:1px}.border-2{border-width:2px}.border-b{border-bottom-width:1px}.border-t{border-top-width:1px}.border-brand-500{--tw-border-opacity:1;border-color:rgb(92 124 250/var(--tw-border-opacity,1))}.border-ink-100{--tw-border-opacity:1;border-color:rgb(241 243 245/var(--tw-border-opacity,1))}.border-ink-200{--tw-border-opacity:1;border-color:rgb(233 236 239/var(--tw-border-opacity,1))}.bg-brand-100{--tw-bg-opacity:1;background-color:rgb(219 228 255/var(--tw-bg-opacity,1))}.bg-brand-400\/20{background-color:#748ffc33}.bg-brand-50{--tw-bg-opacity:1;background-color:rgb(240 244 255/var(--tw-bg-opacity,1))}.bg-brand-600{--tw-bg-opacity:1;background-color:rgb(76 110 245/var(--tw-bg-opacity,1))}.bg-ink-50{--tw-bg-opacity:1;background-color:rgb(248 249 250/var(--tw-bg-opacity,1))}.bg-transparent{background-color:#0000}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.bg-white\/80{background-color:#fffc}.bg-white\/90{background-color:#ffffffe6}.bg-gradient-to-b{background-image:linear-gradient(to bottom, var(--tw-gradient-stops))}.bg-gradient-to-br{background-image:linear-gradient(to bottom right, var(--tw-gradient-stops))}.from-amber-400{--tw-gradient-from:#fbbf24 var(--tw-gradient-from-position);--tw-gradient-to:#fbbf2400 var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from), var(--tw-gradient-to)}.from-brand-400{--tw-gradient-from:#748ffc var(--tw-gradient-from-position);--tw-gradient-to:#748ffc00 var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from), var(--tw-gradient-to)}.from-brand-50\/60{--tw-gradient-from:#f0f4ff99 var(--tw-gradient-from-position);--tw-gradient-to:#f0f4ff00 var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from), var(--tw-gradient-to)}.from-emerald-400{--tw-gradient-from:#34d399 var(--tw-gradient-from-position);--tw-gradient-to:#34d39900 var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from), var(--tw-gradient-to)}.via-brand-500{--tw-gradient-to:#5c7cfa00 var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from), #5c7cfa var(--tw-gradient-via-position), var(--tw-gradient-to)}.via-white{--tw-gradient-to:#fff0 var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from), #fff var(--tw-gradient-via-position), var(--tw-gradient-to)}.to-amber-600{--tw-gradient-to:#d97706 var(--tw-gradient-to-position)}.to-brand-600{--tw-gradient-to:#4c6ef5 var(--tw-gradient-to-position)}.to-brand-700{--tw-gradient-to:#4263eb var(--tw-gradient-to-position)}.to-emerald-600{--tw-gradient-to:#059669 var(--tw-gradient-to-position)}.to-white{--tw-gradient-to:#fff var(--tw-gradient-to-position)}.p-2{padding:.5rem}.p-6{padding:1.5rem}.p-8{padding:2rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-8{padding-left:2rem;padding-right:2rem}.py-1\.5{padding-top:.375rem;padding-bottom:.375rem}.py-12{padding-top:3rem;padding-bottom:3rem}.py-16{padding-top:4rem;padding-bottom:4rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-2\.5{padding-top:.625rem;padding-bottom:.625rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.py-8{padding-top:2rem;padding-bottom:2rem}.pb-4{padding-bottom:1rem}.pt-16{padding-top:4rem}.text-center{text-align:center}.text-2xl{font-size:1.5rem;line-height:2rem}.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-4xl{font-size:2.25rem;line-height:2.5rem}.text-5xl{font-size:3rem;line-height:1}.text-6xl{font-size:3.75rem;line-height:1}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xs{font-size:.75rem;line-height:1rem}.font-bold{font-weight:700}.font-medium{font-weight:500}.font-normal{font-weight:400}.font-semibold{font-weight:600}.leading-relaxed{line-height:1.625}.text-brand-500{--tw-text-opacity:1;color:rgb(92 124 250/var(--tw-text-opacity,1))}.text-brand-600{--tw-text-opacity:1;color:rgb(76 110 245/var(--tw-text-opacity,1))}.text-brand-700{--tw-text-opacity:1;color:rgb(66 99 235/var(--tw-text-opacity,1))}.text-emerald-500{--tw-text-opacity:1;color:rgb(16 185 129/var(--tw-text-opacity,1))}.text-ink-400{--tw-text-opacity:1;color:rgb(206 212 218/var(--tw-text-opacity,1))}.text-ink-500{--tw-text-opacity:1;color:rgb(173 181 189/var(--tw-text-opacity,1))}.text-ink-600{--tw-text-opacity:1;color:rgb(134 142 150/var(--tw-text-opacity,1))}.text-ink-700{--tw-text-opacity:1;color:rgb(73 80 87/var(--tw-text-opacity,1))}.text-ink-800{--tw-text-opacity:1;color:rgb(52 58 64/var(--tw-text-opacity,1))}.text-red-500{--tw-text-opacity:1;color:rgb(239 68 68/var(--tw-text-opacity,1))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.shadow-glow{--tw-shadow:0 0 15px #5c7cfa4d;--tw-shadow-colored:0 0 15px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000), var(--tw-ring-shadow,0 0 #0000), var(--tw-shadow)}.shadow-soft{--tw-shadow:0 2px 15px -3px #00000012, 0 10px 20px -2px #0000000a;--tw-shadow-colored:0 2px 15px -3px var(--tw-shadow-color), 0 10px 20px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000), var(--tw-ring-shadow,0 0 #0000), var(--tw-shadow)}.outline-none{outline-offset:2px;outline:2px solid #0000}.ring{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow,0 0 #0000)}.drop-shadow-lg{--tw-drop-shadow:drop-shadow(0 10px 8px #0000000a) drop-shadow(0 4px 3px #0000001a);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.backdrop-blur-md{--tw-backdrop-blur:blur(12px);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.transition-all{transition-property:all;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-shadow{transition-property:box-shadow;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-200{transition-duration:.2s}body{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(52 58 64/var(--tw-text-opacity,1));-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0}#root{min-height:100vh}@keyframes breathing{0%,to{transform:scale(1)translateY(0);box-shadow:0 0 15px #5c7cfa4d}50%{transform:scale(1.05)translateY(-4px);box-shadow:0 0 30px #5c7cfa80}}@keyframes ping-slow{0%{opacity:.4;transform:scale(1)}75%,to{opacity:0;transform:scale(1.5)}}.animate-breathing{animation:3s ease-in-out infinite breathing}.animate-ping-slow{animation:3s cubic-bezier(0,0,.2,1) infinite ping-slow}.hover\:border-brand-300:hover{--tw-border-opacity:1;border-color:rgb(145 167 255/var(--tw-border-opacity,1))}.hover\:border-brand-400:hover{--tw-border-opacity:1;border-color:rgb(116 143 252/var(--tw-border-opacity,1))}.hover\:bg-brand-100:hover{--tw-bg-opacity:1;background-color:rgb(219 228 255/var(--tw-bg-opacity,1))}.hover\:bg-brand-700:hover{--tw-bg-opacity:1;background-color:rgb(66 99 235/var(--tw-bg-opacity,1))}.hover\:text-brand-600:hover{--tw-text-opacity:1;color:rgb(76 110 245/var(--tw-text-opacity,1))}.hover\:text-ink-600:hover{--tw-text-opacity:1;color:rgb(134 142 150/var(--tw-text-opacity,1))}.hover\:text-red-500:hover{--tw-text-opacity:1;color:rgb(239 68 68/var(--tw-text-opacity,1))}.hover\:underline:hover{text-decoration-line:underline}.hover\:shadow-soft:hover{--tw-shadow:0 2px 15px -3px #00000012, 0 10px 20px -2px #0000000a;--tw-shadow-colored:0 2px 15px -3px var(--tw-shadow-color), 0 10px 20px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000), var(--tw-ring-shadow,0 0 #0000), var(--tw-shadow)}.focus\:border-brand-400:focus{--tw-border-opacity:1;border-color:rgb(116 143 252/var(--tw-border-opacity,1))}.focus\:ring-2:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow,0 0 #0000)}.focus\:ring-brand-100:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(219 228 255/var(--tw-ring-opacity,1))}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-50:disabled{opacity:.5}@media (width>=640px){.sm\:inline{display:inline}.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.sm\:flex-row{flex-direction:row}.sm\:gap-16{gap:4rem}.sm\:py-24{padding-top:6rem;padding-bottom:6rem}.sm\:text-xl{font-size:1.25rem;line-height:1.75rem}} diff --git a/docs/writing/assets/index-sDMNEmkX.js b/docs/writing/assets/index-sDMNEmkX.js new file mode 100644 index 00000000..7422df87 --- /dev/null +++ b/docs/writing/assets/index-sDMNEmkX.js @@ -0,0 +1,30 @@ +var e=Object.create,t=Object.defineProperty,n=Object.getOwnPropertyDescriptor,r=Object.getOwnPropertyNames,i=Object.getPrototypeOf,a=Object.prototype.hasOwnProperty,o=(e,t)=>()=>(t||e((t={exports:{}}).exports,t),t.exports),s=(e,n)=>{let r={};for(var i in e)t(r,i,{get:e[i],enumerable:!0});return n||t(r,Symbol.toStringTag,{value:`Module`}),r},c=(e,i,o,s)=>{if(i&&typeof i==`object`||typeof i==`function`)for(var c=r(i),l=0,u=c.length,d;li[e]).bind(null,d),enumerable:!(s=n(i,d))||s.enumerable});return e},l=(n,r,a)=>(a=n==null?{}:e(i(n)),c(r||!n||!n.__esModule?t(a,`default`,{value:n,enumerable:!0}):a,n));(function(){let e=document.createElement(`link`).relList;if(e&&e.supports&&e.supports(`modulepreload`))return;for(let e of document.querySelectorAll(`link[rel="modulepreload"]`))n(e);new MutationObserver(e=>{for(let t of e)if(t.type===`childList`)for(let e of t.addedNodes)e.tagName===`LINK`&&e.rel===`modulepreload`&&n(e)}).observe(document,{childList:!0,subtree:!0});function t(e){let t={};return e.integrity&&(t.integrity=e.integrity),e.referrerPolicy&&(t.referrerPolicy=e.referrerPolicy),e.crossOrigin===`use-credentials`?t.credentials=`include`:e.crossOrigin===`anonymous`?t.credentials=`omit`:t.credentials=`same-origin`,t}function n(e){if(e.ep)return;e.ep=!0;let n=t(e);fetch(e.href,n)}})();var u=o((e=>{var t=Symbol.for(`react.transitional.element`),n=Symbol.for(`react.portal`),r=Symbol.for(`react.fragment`),i=Symbol.for(`react.strict_mode`),a=Symbol.for(`react.profiler`),o=Symbol.for(`react.consumer`),s=Symbol.for(`react.context`),c=Symbol.for(`react.forward_ref`),l=Symbol.for(`react.suspense`),u=Symbol.for(`react.memo`),d=Symbol.for(`react.lazy`),f=Symbol.for(`react.activity`),p=Symbol.iterator;function m(e){return typeof e!=`object`||!e?null:(e=p&&e[p]||e[`@@iterator`],typeof e==`function`?e:null)}var h={isMounted:function(){return!1},enqueueForceUpdate:function(){},enqueueReplaceState:function(){},enqueueSetState:function(){}},g=Object.assign,_={};function v(e,t,n){this.props=e,this.context=t,this.refs=_,this.updater=n||h}v.prototype.isReactComponent={},v.prototype.setState=function(e,t){if(typeof e!=`object`&&typeof e!=`function`&&e!=null)throw Error(`takes an object of state variables to update or a function which returns an object of state variables.`);this.updater.enqueueSetState(this,e,t,`setState`)},v.prototype.forceUpdate=function(e){this.updater.enqueueForceUpdate(this,e,`forceUpdate`)};function y(){}y.prototype=v.prototype;function b(e,t,n){this.props=e,this.context=t,this.refs=_,this.updater=n||h}var x=b.prototype=new y;x.constructor=b,g(x,v.prototype),x.isPureReactComponent=!0;var S=Array.isArray;function C(){}var w={H:null,A:null,T:null,S:null},ee=Object.prototype.hasOwnProperty;function T(e,n,r){var i=r.ref;return{$$typeof:t,type:e,key:n,ref:i===void 0?null:i,props:r}}function E(e,t){return T(e.type,t,e.props)}function te(e){return typeof e==`object`&&!!e&&e.$$typeof===t}function ne(e){var t={"=":`=0`,":":`=2`};return`$`+e.replace(/[=:]/g,function(e){return t[e]})}var re=/\/+/g;function ie(e,t){return typeof e==`object`&&e&&e.key!=null?ne(``+e.key):t.toString(36)}function ae(e){switch(e.status){case`fulfilled`:return e.value;case`rejected`:throw e.reason;default:switch(typeof e.status==`string`?e.then(C,C):(e.status=`pending`,e.then(function(t){e.status===`pending`&&(e.status=`fulfilled`,e.value=t)},function(t){e.status===`pending`&&(e.status=`rejected`,e.reason=t)})),e.status){case`fulfilled`:return e.value;case`rejected`:throw e.reason}}throw e}function oe(e,r,i,a,o){var s=typeof e;(s===`undefined`||s===`boolean`)&&(e=null);var c=!1;if(e===null)c=!0;else switch(s){case`bigint`:case`string`:case`number`:c=!0;break;case`object`:switch(e.$$typeof){case t:case n:c=!0;break;case d:return c=e._init,oe(c(e._payload),r,i,a,o)}}if(c)return o=o(e),c=a===``?`.`+ie(e,0):a,S(o)?(i=``,c!=null&&(i=c.replace(re,`$&/`)+`/`),oe(o,r,i,``,function(e){return e})):o!=null&&(te(o)&&(o=E(o,i+(o.key==null||e&&e.key===o.key?``:(``+o.key).replace(re,`$&/`)+`/`)+c)),r.push(o)),1;c=0;var l=a===``?`.`:a+`:`;if(S(e))for(var u=0;u{t.exports=u()})),f=o((e=>{function t(e,t){var n=e.length;e.push(t);a:for(;0>>1,a=e[r];if(0>>1;ri(c,n))li(u,c)?(e[r]=u,e[l]=n,r=l):(e[r]=c,e[s]=n,r=s);else if(li(u,n))e[r]=u,e[l]=n,r=l;else break a}}return t}function i(e,t){var n=e.sortIndex-t.sortIndex;return n===0?e.id-t.id:n}if(e.unstable_now=void 0,typeof performance==`object`&&typeof performance.now==`function`){var a=performance;e.unstable_now=function(){return a.now()}}else{var o=Date,s=o.now();e.unstable_now=function(){return o.now()-s}}var c=[],l=[],u=1,d=null,f=3,p=!1,m=!1,h=!1,g=!1,_=typeof setTimeout==`function`?setTimeout:null,v=typeof clearTimeout==`function`?clearTimeout:null,y=typeof setImmediate<`u`?setImmediate:null;function b(e){for(var i=n(l);i!==null;){if(i.callback===null)r(l);else if(i.startTime<=e)r(l),i.sortIndex=i.expirationTime,t(c,i);else break;i=n(l)}}function x(e){if(h=!1,b(e),!m)if(n(c)!==null)m=!0,S||(S=!0,te());else{var t=n(l);t!==null&&ie(x,t.startTime-e)}}var S=!1,C=-1,w=5,ee=-1;function T(){return g?!0:!(e.unstable_now()-eet&&T());){var o=d.callback;if(typeof o==`function`){d.callback=null,f=d.priorityLevel;var s=o(d.expirationTime<=t);if(t=e.unstable_now(),typeof s==`function`){d.callback=s,b(t),i=!0;break b}d===n(c)&&r(c),b(t)}else r(c);d=n(c)}if(d!==null)i=!0;else{var u=n(l);u!==null&&ie(x,u.startTime-t),i=!1}}break a}finally{d=null,f=a,p=!1}i=void 0}}finally{i?te():S=!1}}}var te;if(typeof y==`function`)te=function(){y(E)};else if(typeof MessageChannel<`u`){var ne=new MessageChannel,re=ne.port2;ne.port1.onmessage=E,te=function(){re.postMessage(null)}}else te=function(){_(E,0)};function ie(t,n){C=_(function(){t(e.unstable_now())},n)}e.unstable_IdlePriority=5,e.unstable_ImmediatePriority=1,e.unstable_LowPriority=4,e.unstable_NormalPriority=3,e.unstable_Profiling=null,e.unstable_UserBlockingPriority=2,e.unstable_cancelCallback=function(e){e.callback=null},e.unstable_forceFrameRate=function(e){0>e||125o?(r.sortIndex=a,t(l,r),n(c)===null&&r===n(l)&&(h?(v(C),C=-1):h=!0,ie(x,a-o))):(r.sortIndex=s,t(c,r),m||p||(m=!0,S||(S=!0,te()))),r},e.unstable_shouldYield=T,e.unstable_wrapCallback=function(e){var t=f;return function(){var n=f;f=t;try{return e.apply(this,arguments)}finally{f=n}}}})),p=o(((e,t)=>{t.exports=f()})),m=o((e=>{var t=d();function n(e){var t=`https://react.dev/errors/`+e;if(1{function n(){if(!(typeof __REACT_DEVTOOLS_GLOBAL_HOOK__>`u`||typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.checkDCE!=`function`))try{__REACT_DEVTOOLS_GLOBAL_HOOK__.checkDCE(n)}catch(e){console.error(e)}}n(),t.exports=m()})),g=o((e=>{var t=p(),n=d(),r=h();function i(e){var t=`https://react.dev/errors/`+e;if(1de||(e.current=ue[de],ue[de]=null,de--)}function k(e,t){de++,ue[de]=e.current,e.current=t}var me=fe(null),he=fe(null),ge=fe(null),_e=fe(null);function ve(e,t){switch(k(ge,t),k(he,e),k(me,null),t.nodeType){case 9:case 11:e=(e=t.documentElement)&&(e=e.namespaceURI)?Vd(e):0;break;default:if(e=t.tagName,t=t.namespaceURI)t=Vd(t),e=Hd(t,e);else switch(e){case`svg`:e=1;break;case`math`:e=2;break;default:e=0}}pe(me),k(me,e)}function ye(){pe(me),pe(he),pe(ge)}function be(e){e.memoizedState!==null&&k(_e,e);var t=me.current,n=Hd(t,e.type);t!==n&&(k(he,e),k(me,n))}function xe(e){he.current===e&&(pe(me),pe(he)),_e.current===e&&(pe(_e),Qf._currentValue=le)}var Se,Ce;function we(e){if(Se===void 0)try{throw Error()}catch(e){var t=e.stack.trim().match(/\n( *(at )?)/);Se=t&&t[1]||``,Ce=-1)`:-1i||c[r]!==l[i]){var u=` +`+c[r].replace(` at new `,` at `);return e.displayName&&u.includes(``)&&(u=u.replace(``,e.displayName)),u}while(1<=r&&0<=i);break}}}finally{Te=!1,Error.prepareStackTrace=n}return(n=e?e.displayName||e.name:``)?we(n):``}function De(e,t){switch(e.tag){case 26:case 27:case 5:return we(e.type);case 16:return we(`Lazy`);case 13:return e.child!==t&&t!==null?we(`Suspense Fallback`):we(`Suspense`);case 19:return we(`SuspenseList`);case 0:case 15:return Ee(e.type,!1);case 11:return Ee(e.type.render,!1);case 1:return Ee(e.type,!0);case 31:return we(`Activity`);default:return``}}function Oe(e){try{var t=``,n=null;do t+=De(e,n),n=e,e=e.return;while(e);return t}catch(e){return` +Error generating stack: `+e.message+` +`+e.stack}}var ke=Object.prototype.hasOwnProperty,Ae=t.unstable_scheduleCallback,je=t.unstable_cancelCallback,Me=t.unstable_shouldYield,Ne=t.unstable_requestPaint,Pe=t.unstable_now,Fe=t.unstable_getCurrentPriorityLevel,Ie=t.unstable_ImmediatePriority,Le=t.unstable_UserBlockingPriority,Re=t.unstable_NormalPriority,ze=t.unstable_LowPriority,Be=t.unstable_IdlePriority,Ve=t.log,He=t.unstable_setDisableYieldValue,Ue=null,We=null;function Ge(e){if(typeof Ve==`function`&&He(e),We&&typeof We.setStrictMode==`function`)try{We.setStrictMode(Ue,e)}catch{}}var Ke=Math.clz32?Math.clz32:Ye,qe=Math.log,Je=Math.LN2;function Ye(e){return e>>>=0,e===0?32:31-(qe(e)/Je|0)|0}var Xe=256,Ze=262144,Qe=4194304;function $e(e){var t=e&42;if(t!==0)return t;switch(e&-e){case 1:return 1;case 2:return 2;case 4:return 4;case 8:return 8;case 16:return 16;case 32:return 32;case 64:return 64;case 128:return 128;case 256:case 512:case 1024:case 2048:case 4096:case 8192:case 16384:case 32768:case 65536:case 131072:return e&261888;case 262144:case 524288:case 1048576:case 2097152:return e&3932160;case 4194304:case 8388608:case 16777216:case 33554432:return e&62914560;case 67108864:return 67108864;case 134217728:return 134217728;case 268435456:return 268435456;case 536870912:return 536870912;case 1073741824:return 0;default:return e}}function et(e,t,n){var r=e.pendingLanes;if(r===0)return 0;var i=0,a=e.suspendedLanes,o=e.pingedLanes;e=e.warmLanes;var s=r&134217727;return s===0?(s=r&~a,s===0?o===0?n||(n=r&~e,n!==0&&(i=$e(n))):i=$e(o):i=$e(s)):(r=s&~a,r===0?(o&=s,o===0?n||(n=s&~e,n!==0&&(i=$e(n))):i=$e(o)):i=$e(r)),i===0?0:t!==0&&t!==i&&(t&a)===0&&(a=i&-i,n=t&-t,a>=n||a===32&&n&4194048)?t:i}function tt(e,t){return(e.pendingLanes&~(e.suspendedLanes&~e.pingedLanes)&t)===0}function nt(e,t){switch(e){case 1:case 2:case 4:case 8:case 64:return t+250;case 16:case 32:case 128:case 256:case 512:case 1024:case 2048:case 4096:case 8192:case 16384:case 32768:case 65536:case 131072:case 262144:case 524288:case 1048576:case 2097152:return t+5e3;case 4194304:case 8388608:case 16777216:case 33554432:return-1;case 67108864:case 134217728:case 268435456:case 536870912:case 1073741824:return-1;default:return-1}}function rt(){var e=Qe;return Qe<<=1,!(Qe&62914560)&&(Qe=4194304),e}function it(e){for(var t=[],n=0;31>n;n++)t.push(e);return t}function at(e,t){e.pendingLanes|=t,t!==268435456&&(e.suspendedLanes=0,e.pingedLanes=0,e.warmLanes=0)}function ot(e,t,n,r,i,a){var o=e.pendingLanes;e.pendingLanes=n,e.suspendedLanes=0,e.pingedLanes=0,e.warmLanes=0,e.expiredLanes&=n,e.entangledLanes&=n,e.errorRecoveryDisabledLanes&=n,e.shellSuspendCounter=0;var s=e.entanglements,c=e.expirationTimes,l=e.hiddenUpdates;for(n=o&~n;0`u`||window.document===void 0||window.document.createElement===void 0),yn=!1;if(vn)try{var bn={};Object.defineProperty(bn,`passive`,{get:function(){yn=!0}}),window.addEventListener(`test`,bn,bn),window.removeEventListener(`test`,bn,bn)}catch{yn=!1}var xn=null,Sn=null,Cn=null;function wn(){if(Cn)return Cn;var e,t=Sn,n=t.length,r,i=`value`in xn?xn.value:xn.textContent,a=i.length;for(e=0;e=nr),ar=` `,or=!1;function sr(e,t){switch(e){case`keyup`:return er.indexOf(t.keyCode)!==-1;case`keydown`:return t.keyCode!==229;case`keypress`:case`mousedown`:case`focusout`:return!0;default:return!1}}function cr(e){return e=e.detail,typeof e==`object`&&`data`in e?e.data:null}var lr=!1;function ur(e,t){switch(e){case`compositionend`:return cr(t);case`keypress`:return t.which===32?(or=!0,ar):null;case`textInput`:return e=t.data,e===ar&&or?null:e;default:return null}}function dr(e,t){if(lr)return e===`compositionend`||!tr&&sr(e,t)?(e=wn(),Cn=Sn=xn=null,lr=!1,e):null;switch(e){case`paste`:return null;case`keypress`:if(!(t.ctrlKey||t.altKey||t.metaKey)||t.ctrlKey&&t.altKey){if(t.char&&1=t)return{node:n,offset:t-e};e=r}a:{for(;n;){if(n.nextSibling){n=n.nextSibling;break a}n=n.parentNode}n=void 0}n=Mr(n)}}function Pr(e,t){return e&&t?e===t?!0:e&&e.nodeType===3?!1:t&&t.nodeType===3?Pr(e,t.parentNode):`contains`in e?e.contains(t):e.compareDocumentPosition?!!(e.compareDocumentPosition(t)&16):!1:!1}function Fr(e){e=e!=null&&e.ownerDocument!=null&&e.ownerDocument.defaultView!=null?e.ownerDocument.defaultView:window;for(var t=Gt(e.document);t instanceof e.HTMLIFrameElement;){try{var n=typeof t.contentWindow.location.href==`string`}catch{n=!1}if(n)e=t.contentWindow;else break;t=Gt(e.document)}return t}function Ir(e){var t=e&&e.nodeName&&e.nodeName.toLowerCase();return t&&(t===`input`&&(e.type===`text`||e.type===`search`||e.type===`tel`||e.type===`url`||e.type===`password`)||t===`textarea`||e.contentEditable===`true`)}var Lr=vn&&`documentMode`in document&&11>=document.documentMode,Rr=null,zr=null,Br=null,Vr=!1;function Hr(e,t,n){var r=n.window===n?n.document:n.nodeType===9?n:n.ownerDocument;Vr||Rr==null||Rr!==Gt(r)||(r=Rr,`selectionStart`in r&&Ir(r)?r={start:r.selectionStart,end:r.selectionEnd}:(r=(r.ownerDocument&&r.ownerDocument.defaultView||window).getSelection(),r={anchorNode:r.anchorNode,anchorOffset:r.anchorOffset,focusNode:r.focusNode,focusOffset:r.focusOffset}),Br&&jr(Br,r)||(Br=r,r=Ed(zr,`onSelect`),0>=o,i-=o,Ni=1<<32-Ke(t)+i|n<h?(g=d,d=null):g=d.sibling;var _=p(i,d,s[h],c);if(_===null){d===null&&(d=g);break}e&&d&&_.alternate===null&&t(i,d),a=o(_,a,h),u===null?l=_:u.sibling=_,u=_,d=g}if(h===s.length)return n(i,d),P&&Fi(i,h),l;if(d===null){for(;hg?(_=h,h=null):_=h.sibling;var y=p(a,h,v.value,l);if(y===null){h===null&&(h=_);break}e&&h&&y.alternate===null&&t(a,h),s=o(y,s,g),d===null?u=y:d.sibling=y,d=y,h=_}if(v.done)return n(a,h),P&&Fi(a,g),u;if(h===null){for(;!v.done;g++,v=c.next())v=f(a,v.value,l),v!==null&&(s=o(v,s,g),d===null?u=v:d.sibling=v,d=v);return P&&Fi(a,g),u}for(h=r(h);!v.done;g++,v=c.next())v=m(h,a,g,v.value,l),v!==null&&(e&&v.alternate!==null&&h.delete(v.key===null?g:v.key),s=o(v,s,g),d===null?u=v:d.sibling=v,d=v);return e&&h.forEach(function(e){return t(a,e)}),P&&Fi(a,g),u}function b(e,r,o,c){if(typeof o==`object`&&o&&o.type===y&&o.key===null&&(o=o.props.children),typeof o==`object`&&o){switch(o.$$typeof){case _:a:{for(var l=o.key;r!==null;){if(r.key===l){if(l=o.type,l===y){if(r.tag===7){n(e,r.sibling),c=a(r,o.props.children),c.return=e,e=c;break a}}else if(r.elementType===l||typeof l==`object`&&l&&l.$$typeof===te&&ja(l)===r.type){n(e,r.sibling),c=a(r,o.props),Ra(c,o),c.return=e,e=c;break a}n(e,r);break}else t(e,r);r=r.sibling}o.type===y?(c=bi(o.props.children,e.mode,c,o.key),c.return=e,e=c):(c=yi(o.type,o.key,o.props,null,e.mode,c),Ra(c,o),c.return=e,e=c)}return s(e);case v:a:{for(l=o.key;r!==null;){if(r.key===l)if(r.tag===4&&r.stateNode.containerInfo===o.containerInfo&&r.stateNode.implementation===o.implementation){n(e,r.sibling),c=a(r,o.children||[]),c.return=e,e=c;break a}else{n(e,r);break}else t(e,r);r=r.sibling}c=Ci(o,e.mode,c),c.return=e,e=c}return s(e);case te:return o=ja(o),b(e,r,o,c)}if(ce(o))return h(e,r,o,c);if(ae(o)){if(l=ae(o),typeof l!=`function`)throw Error(i(150));return o=l.call(o),g(e,r,o,c)}if(typeof o.then==`function`)return b(e,r,La(o),c);if(o.$$typeof===C)return b(e,r,oa(e,o),c);za(e,o)}return typeof o==`string`&&o!==``||typeof o==`number`||typeof o==`bigint`?(o=``+o,r!==null&&r.tag===6?(n(e,r.sibling),c=a(r,o),c.return=e,e=c):(n(e,r),c=xi(o,e.mode,c),c.return=e,e=c),s(e)):n(e,r)}return function(e,t,n,r){try{Ia=0;var i=b(e,t,n,r);return Fa=null,i}catch(t){if(t===Ta||t===Da)throw t;var a=hi(29,t,null,e.mode);return a.lanes=r,a.return=e,a}}}var Va=Ba(!0),Ha=Ba(!1),Ua=!1;function Wa(e){e.updateQueue={baseState:e.memoizedState,firstBaseUpdate:null,lastBaseUpdate:null,shared:{pending:null,lanes:0,hiddenCallbacks:null},callbacks:null}}function Ga(e,t){e=e.updateQueue,t.updateQueue===e&&(t.updateQueue={baseState:e.baseState,firstBaseUpdate:e.firstBaseUpdate,lastBaseUpdate:e.lastBaseUpdate,shared:e.shared,callbacks:null})}function Ka(e){return{lane:e,tag:0,payload:null,callback:null,next:null}}function qa(e,t,n){var r=e.updateQueue;if(r===null)return null;if(r=r.shared,G&2){var i=r.pending;return i===null?t.next=t:(t.next=i.next,i.next=t),r.pending=t,t=fi(e),di(e,null,n),t}return ci(e,r,t,n),fi(e)}function Ja(e,t,n){if(t=t.updateQueue,t!==null&&(t=t.shared,n&4194048)){var r=t.lanes;r&=e.pendingLanes,n|=r,t.lanes=n,ct(e,n)}}function Ya(e,t){var n=e.updateQueue,r=e.alternate;if(r!==null&&(r=r.updateQueue,n===r)){var i=null,a=null;if(n=n.firstBaseUpdate,n!==null){do{var o={lane:n.lane,tag:n.tag,payload:n.payload,callback:null,next:null};a===null?i=a=o:a=a.next=o,n=n.next}while(n!==null);a===null?i=a=t:a=a.next=t}else i=a=t;n={baseState:r.baseState,firstBaseUpdate:i,lastBaseUpdate:a,shared:r.shared,callbacks:r.callbacks},e.updateQueue=n;return}e=n.lastBaseUpdate,e===null?n.firstBaseUpdate=t:e.next=t,n.lastBaseUpdate=t}var Xa=!1;function Za(){if(Xa){var e=ga;if(e!==null)throw e}}function Qa(e,t,n,r){Xa=!1;var i=e.updateQueue;Ua=!1;var a=i.firstBaseUpdate,o=i.lastBaseUpdate,s=i.shared.pending;if(s!==null){i.shared.pending=null;var c=s,l=c.next;c.next=null,o===null?a=l:o.next=l,o=c;var u=e.alternate;u!==null&&(u=u.updateQueue,s=u.lastBaseUpdate,s!==o&&(s===null?u.firstBaseUpdate=l:s.next=l,u.lastBaseUpdate=c))}if(a!==null){var d=i.baseState;o=0,u=l=c=null,s=a;do{var f=s.lane&-536870913,p=f!==s.lane;if(p?(J&f)===f:(r&f)===f){f!==0&&f===ha&&(Xa=!0),u!==null&&(u=u.next={lane:0,tag:s.tag,payload:s.payload,callback:null,next:null});a:{var h=e,g=s;f=t;var _=n;switch(g.tag){case 1:if(h=g.payload,typeof h==`function`){d=h.call(_,d,f);break a}d=h;break a;case 3:h.flags=h.flags&-65537|128;case 0:if(h=g.payload,f=typeof h==`function`?h.call(_,d,f):h,f==null)break a;d=m({},d,f);break a;case 2:Ua=!0}}f=s.callback,f!==null&&(e.flags|=64,p&&(e.flags|=8192),p=i.callbacks,p===null?i.callbacks=[f]:p.push(f))}else p={lane:f,tag:s.tag,payload:s.payload,callback:s.callback,next:null},u===null?(l=u=p,c=d):u=u.next=p,o|=f;if(s=s.next,s===null){if(s=i.shared.pending,s===null)break;p=s,s=p.next,p.next=null,i.lastBaseUpdate=p,i.shared.pending=null}}while(1);u===null&&(c=d),i.baseState=c,i.firstBaseUpdate=l,i.lastBaseUpdate=u,a===null&&(i.shared.lanes=0),Gl|=o,e.lanes=o,e.memoizedState=d}}function $a(e,t){if(typeof e!=`function`)throw Error(i(191,e));e.call(t)}function eo(e,t){var n=e.callbacks;if(n!==null)for(e.callbacks=null,e=0;ea?a:8;var o=D.T,s={};D.T=s,Fs(e,!1,t,n);try{var c=i(),l=D.S;l!==null&&l(s,c),typeof c==`object`&&c&&typeof c.then==`function`?Ps(e,t,ya(c,r),pu(e)):Ps(e,t,r,pu(e))}catch(n){Ps(e,t,{then:function(){},status:`rejected`,reason:n},pu())}finally{O.p=a,o!==null&&s.types!==null&&(o.types=s.types),D.T=o}}function ws(){}function Ts(e,t,n,r){if(e.tag!==5)throw Error(i(476));var a=Es(e).queue;Cs(e,a,t,le,n===null?ws:function(){return Ds(e),n(r)})}function Es(e){var t=e.memoizedState;if(t!==null)return t;t={memoizedState:le,baseState:le,baseQueue:null,queue:{pending:null,lanes:0,dispatch:null,lastRenderedReducer:Io,lastRenderedState:le},next:null};var n={};return t.next={memoizedState:n,baseState:n,baseQueue:null,queue:{pending:null,lanes:0,dispatch:null,lastRenderedReducer:Io,lastRenderedState:n},next:null},e.memoizedState=t,e=e.alternate,e!==null&&(e.memoizedState=t),t}function Ds(e){var t=Es(e);t.next===null&&(t=e.alternate.memoizedState),Ps(e,t.next.queue,{},pu())}function Os(){return aa(Qf)}function ks(){return H().memoizedState}function As(){return H().memoizedState}function js(e){for(var t=e.return;t!==null;){switch(t.tag){case 24:case 3:var n=pu();e=Ka(n);var r=qa(t,e,n);r!==null&&(hu(r,t,n),Ja(r,t,n)),t={cache:da()},e.payload=t;return}t=t.return}}function Ms(e,t,n){var r=pu();n={lane:r,revertLane:0,gesture:null,action:n,hasEagerState:!1,eagerState:null,next:null},Is(e)?Ls(t,n):(n=li(e,t,n,r),n!==null&&(hu(n,e,r),Rs(n,t,r)))}function Ns(e,t,n){Ps(e,t,n,pu())}function Ps(e,t,n,r){var i={lane:r,revertLane:0,gesture:null,action:n,hasEagerState:!1,eagerState:null,next:null};if(Is(e))Ls(t,i);else{var a=e.alternate;if(e.lanes===0&&(a===null||a.lanes===0)&&(a=t.lastRenderedReducer,a!==null))try{var o=t.lastRenderedState,s=a(o,n);if(i.hasEagerState=!0,i.eagerState=s,Ar(s,o))return ci(e,t,i,0),K===null&&j(),!1}catch{}if(n=li(e,t,i,r),n!==null)return hu(n,e,r),Rs(n,t,r),!0}return!1}function Fs(e,t,n,r){if(r={lane:2,revertLane:dd(),gesture:null,action:r,hasEagerState:!1,eagerState:null,next:null},Is(e)){if(t)throw Error(i(479))}else t=li(e,n,r,2),t!==null&&hu(t,e,2)}function Is(e){var t=e.alternate;return e===R||t!==null&&t===R}function Ls(e,t){_o=go=!0;var n=e.pending;n===null?t.next=t:(t.next=n.next,n.next=t),e.pending=t}function Rs(e,t,n){if(n&4194048){var r=t.lanes;r&=e.pendingLanes,n|=r,t.lanes=n,ct(e,n)}}var zs={readContext:aa,use:Po,useCallback:V,useContext:V,useEffect:V,useImperativeHandle:V,useLayoutEffect:V,useInsertionEffect:V,useMemo:V,useReducer:V,useRef:V,useState:V,useDebugValue:V,useDeferredValue:V,useTransition:V,useSyncExternalStore:V,useId:V,useHostTransitionStatus:V,useFormState:V,useActionState:V,useOptimistic:V,useMemoCache:V,useCacheRefresh:V};zs.useEffectEvent=V;var Bs={readContext:aa,use:Po,useCallback:function(e,t){return jo().memoizedState=[e,t===void 0?null:t],e},useContext:aa,useEffect:us,useImperativeHandle:function(e,t,n){n=n==null?null:n.concat([e]),cs(4194308,4,gs.bind(null,t,e),n)},useLayoutEffect:function(e,t){return cs(4194308,4,e,t)},useInsertionEffect:function(e,t){cs(4,2,e,t)},useMemo:function(e,t){var n=jo();t=t===void 0?null:t;var r=e();if(vo){Ge(!0);try{e()}finally{Ge(!1)}}return n.memoizedState=[r,t],r},useReducer:function(e,t,n){var r=jo();if(n!==void 0){var i=n(t);if(vo){Ge(!0);try{n(t)}finally{Ge(!1)}}}else i=t;return r.memoizedState=r.baseState=i,e={pending:null,lanes:0,dispatch:null,lastRenderedReducer:e,lastRenderedState:i},r.queue=e,e=e.dispatch=Ms.bind(null,R,e),[r.memoizedState,e]},useRef:function(e){var t=jo();return e={current:e},t.memoizedState=e},useState:function(e){e=Ko(e);var t=e.queue,n=Ns.bind(null,R,t);return t.dispatch=n,[e.memoizedState,n]},useDebugValue:vs,useDeferredValue:function(e,t){return xs(jo(),e,t)},useTransition:function(){var e=Ko(!1);return e=Cs.bind(null,R,e.queue,!0,!1),jo().memoizedState=e,[!1,e]},useSyncExternalStore:function(e,t,n){var r=R,a=jo();if(P){if(n===void 0)throw Error(i(407));n=n()}else{if(n=t(),K===null)throw Error(i(349));J&127||Vo(r,t,n)}a.memoizedState=n;var o={value:n,getSnapshot:t};return a.queue=o,us(Uo.bind(null,r,o,e),[e]),r.flags|=2048,os(9,{destroy:void 0},Ho.bind(null,r,o,n,t),null),n},useId:function(){var e=jo(),t=K.identifierPrefix;if(P){var n=Pi,r=Ni;n=(r&~(1<<32-Ke(r)-1)).toString(32)+n,t=`_`+t+`R_`+n,n=yo++,0<\/script>`,o=o.removeChild(o.firstChild);break;case`select`:o=typeof r.is==`string`?s.createElement(`select`,{is:r.is}):s.createElement(`select`),r.multiple?o.multiple=!0:r.size&&(o.size=r.size);break;default:o=typeof r.is==`string`?s.createElement(a,{is:r.is}):s.createElement(a)}}o[ht]=t,o[gt]=r;a:for(s=t.child;s!==null;){if(s.tag===5||s.tag===6)o.appendChild(s.stateNode);else if(s.tag!==4&&s.tag!==27&&s.child!==null){s.child.return=s,s=s.child;continue}if(s===t)break a;for(;s.sibling===null;){if(s.return===null||s.return===t)break a;s=s.return}s.sibling.return=s.return,s=s.sibling}t.stateNode=o;a:switch(Pd(o,a,r),a){case`button`:case`input`:case`select`:case`textarea`:r=!!r.autoFocus;break a;case`img`:r=!0;break a;default:r=!1}r&&Pc(t)}}return U(t),Fc(t,t.type,e===null?null:e.memoizedProps,t.pendingProps,n),null;case 6:if(e&&t.stateNode!=null)e.memoizedProps!==r&&Pc(t);else{if(typeof r!=`string`&&t.stateNode===null)throw Error(i(166));if(e=ge.current,Ki(t)){if(e=t.stateNode,n=t.memoizedProps,r=null,a=M,a!==null)switch(a.tag){case 27:case 5:r=a.memoizedProps}e[ht]=t,e=!!(e.nodeValue===n||r!==null&&!0===r.suppressHydrationWarning||Md(e.nodeValue,n)),e||Ui(t,!0)}else e=Bd(e).createTextNode(r),e[ht]=t,t.stateNode=e}return U(t),null;case 31:if(n=t.memoizedState,e===null||e.memoizedState!==null){if(r=Ki(t),n!==null){if(e===null){if(!r)throw Error(i(318));if(e=t.memoizedState,e=e===null?null:e.dehydrated,!e)throw Error(i(557));e[ht]=t}else qi(),!(t.flags&128)&&(t.memoizedState=null),t.flags|=4;U(t),e=!1}else n=Ji(),e!==null&&e.memoizedState!==null&&(e.memoizedState.hydrationErrors=n),e=!0;if(!e)return t.flags&256?(po(t),t):(po(t),null);if(t.flags&128)throw Error(i(558))}return U(t),null;case 13:if(r=t.memoizedState,e===null||e.memoizedState!==null&&e.memoizedState.dehydrated!==null){if(a=Ki(t),r!==null&&r.dehydrated!==null){if(e===null){if(!a)throw Error(i(318));if(a=t.memoizedState,a=a===null?null:a.dehydrated,!a)throw Error(i(317));a[ht]=t}else qi(),!(t.flags&128)&&(t.memoizedState=null),t.flags|=4;U(t),a=!1}else a=Ji(),e!==null&&e.memoizedState!==null&&(e.memoizedState.hydrationErrors=a),a=!0;if(!a)return t.flags&256?(po(t),t):(po(t),null)}return po(t),t.flags&128?(t.lanes=n,t):(n=r!==null,e=e!==null&&e.memoizedState!==null,n&&(r=t.child,a=null,r.alternate!==null&&r.alternate.memoizedState!==null&&r.alternate.memoizedState.cachePool!==null&&(a=r.alternate.memoizedState.cachePool.pool),o=null,r.memoizedState!==null&&r.memoizedState.cachePool!==null&&(o=r.memoizedState.cachePool.pool),o!==a&&(r.flags|=2048)),n!==e&&n&&(t.child.flags|=8192),Lc(t,t.updateQueue),U(t),null);case 4:return ye(),e===null&&Sd(t.stateNode.containerInfo),U(t),null;case 10:return ea(t.type),U(t),null;case 19:if(pe(L),r=t.memoizedState,r===null)return U(t),null;if(a=(t.flags&128)!=0,o=r.rendering,o===null)if(a)Rc(r,!1);else{if(X!==0||e!==null&&e.flags&128)for(e=t.child;e!==null;){if(o=mo(e),o!==null){for(t.flags|=128,Rc(r,!1),e=o.updateQueue,t.updateQueue=e,Lc(t,e),t.subtreeFlags=0,e=n,n=t.child;n!==null;)vi(n,e),n=n.sibling;return k(L,L.current&1|2),P&&Fi(t,r.treeForkCount),t.child}e=e.sibling}r.tail!==null&&Pe()>tu&&(t.flags|=128,a=!0,Rc(r,!1),t.lanes=4194304)}else{if(!a)if(e=mo(o),e!==null){if(t.flags|=128,a=!0,e=e.updateQueue,t.updateQueue=e,Lc(t,e),Rc(r,!0),r.tail===null&&r.tailMode===`hidden`&&!o.alternate&&!P)return U(t),null}else 2*Pe()-r.renderingStartTime>tu&&n!==536870912&&(t.flags|=128,a=!0,Rc(r,!1),t.lanes=4194304);r.isBackwards?(o.sibling=t.child,t.child=o):(e=r.last,e===null?t.child=o:e.sibling=o,r.last=o)}return r.tail===null?(U(t),null):(e=r.tail,r.rendering=e,r.tail=e.sibling,r.renderingStartTime=Pe(),e.sibling=null,n=L.current,k(L,a?n&1|2:n&1),P&&Fi(t,r.treeForkCount),e);case 22:case 23:return po(t),ao(),r=t.memoizedState!==null,e===null?r&&(t.flags|=8192):e.memoizedState!==null!==r&&(t.flags|=8192),r?n&536870912&&!(t.flags&128)&&(U(t),t.subtreeFlags&6&&(t.flags|=8192)):U(t),n=t.updateQueue,n!==null&&Lc(t,n.retryQueue),n=null,e!==null&&e.memoizedState!==null&&e.memoizedState.cachePool!==null&&(n=e.memoizedState.cachePool.pool),r=null,t.memoizedState!==null&&t.memoizedState.cachePool!==null&&(r=t.memoizedState.cachePool.pool),r!==n&&(t.flags|=2048),e!==null&&pe(xa),null;case 24:return n=null,e!==null&&(n=e.memoizedState.cache),t.memoizedState.cache!==n&&(t.flags|=2048),ea(I),U(t),null;case 25:return null;case 30:return null}throw Error(i(156,t.tag))}function Bc(e,t){switch(Ri(t),t.tag){case 1:return e=t.flags,e&65536?(t.flags=e&-65537|128,t):null;case 3:return ea(I),ye(),e=t.flags,e&65536&&!(e&128)?(t.flags=e&-65537|128,t):null;case 26:case 27:case 5:return xe(t),null;case 31:if(t.memoizedState!==null){if(po(t),t.alternate===null)throw Error(i(340));qi()}return e=t.flags,e&65536?(t.flags=e&-65537|128,t):null;case 13:if(po(t),e=t.memoizedState,e!==null&&e.dehydrated!==null){if(t.alternate===null)throw Error(i(340));qi()}return e=t.flags,e&65536?(t.flags=e&-65537|128,t):null;case 19:return pe(L),null;case 4:return ye(),null;case 10:return ea(t.type),null;case 22:case 23:return po(t),ao(),e!==null&&pe(xa),e=t.flags,e&65536?(t.flags=e&-65537|128,t):null;case 24:return ea(I),null;case 25:return null;default:return null}}function Vc(e,t){switch(Ri(t),t.tag){case 3:ea(I),ye();break;case 26:case 27:case 5:xe(t);break;case 4:ye();break;case 31:t.memoizedState!==null&&po(t);break;case 13:po(t);break;case 19:pe(L);break;case 10:ea(t.type);break;case 22:case 23:po(t),ao(),e!==null&&pe(xa);break;case 24:ea(I)}}function Hc(e,t){try{var n=t.updateQueue,r=n===null?null:n.lastEffect;if(r!==null){var i=r.next;n=i;do{if((n.tag&e)===e){r=void 0;var a=n.create,o=n.inst;r=a(),o.destroy=r}n=n.next}while(n!==i)}}catch(e){Z(t,t.return,e)}}function Uc(e,t,n){try{var r=t.updateQueue,i=r===null?null:r.lastEffect;if(i!==null){var a=i.next;r=a;do{if((r.tag&e)===e){var o=r.inst,s=o.destroy;if(s!==void 0){o.destroy=void 0,i=t;var c=n,l=s;try{l()}catch(e){Z(i,c,e)}}}r=r.next}while(r!==a)}}catch(e){Z(t,t.return,e)}}function Wc(e){var t=e.updateQueue;if(t!==null){var n=e.stateNode;try{eo(t,n)}catch(t){Z(e,e.return,t)}}}function Gc(e,t,n){n.props=qs(e.type,e.memoizedProps),n.state=e.memoizedState;try{n.componentWillUnmount()}catch(n){Z(e,t,n)}}function Kc(e,t){try{var n=e.ref;if(n!==null){switch(e.tag){case 26:case 27:case 5:var r=e.stateNode;break;case 30:r=e.stateNode;break;default:r=e.stateNode}typeof n==`function`?e.refCleanup=n(r):n.current=r}}catch(n){Z(e,t,n)}}function qc(e,t){var n=e.ref,r=e.refCleanup;if(n!==null)if(typeof r==`function`)try{r()}catch(n){Z(e,t,n)}finally{e.refCleanup=null,e=e.alternate,e!=null&&(e.refCleanup=null)}else if(typeof n==`function`)try{n(null)}catch(n){Z(e,t,n)}else n.current=null}function Jc(e){var t=e.type,n=e.memoizedProps,r=e.stateNode;try{a:switch(t){case`button`:case`input`:case`select`:case`textarea`:n.autoFocus&&r.focus();break a;case`img`:n.src?r.src=n.src:n.srcSet&&(r.srcset=n.srcSet)}}catch(t){Z(e,e.return,t)}}function Yc(e,t,n){try{var r=e.stateNode;Fd(r,e.type,n,t),r[gt]=t}catch(t){Z(e,e.return,t)}}function Xc(e){return e.tag===5||e.tag===3||e.tag===26||e.tag===27&&Zd(e.type)||e.tag===4}function Zc(e){a:for(;;){for(;e.sibling===null;){if(e.return===null||Xc(e.return))return null;e=e.return}for(e.sibling.return=e.return,e=e.sibling;e.tag!==5&&e.tag!==6&&e.tag!==18;){if(e.tag===27&&Zd(e.type)||e.flags&2||e.child===null||e.tag===4)continue a;e.child.return=e,e=e.child}if(!(e.flags&2))return e.stateNode}}function Qc(e,t,n){var r=e.tag;if(r===5||r===6)e=e.stateNode,t?(n.nodeType===9?n.body:n.nodeName===`HTML`?n.ownerDocument.body:n).insertBefore(e,t):(t=n.nodeType===9?n.body:n.nodeName===`HTML`?n.ownerDocument.body:n,t.appendChild(e),n=n._reactRootContainer,n!=null||t.onclick!==null||(t.onclick=ln));else if(r!==4&&(r===27&&Zd(e.type)&&(n=e.stateNode,t=null),e=e.child,e!==null))for(Qc(e,t,n),e=e.sibling;e!==null;)Qc(e,t,n),e=e.sibling}function $c(e,t,n){var r=e.tag;if(r===5||r===6)e=e.stateNode,t?n.insertBefore(e,t):n.appendChild(e);else if(r!==4&&(r===27&&Zd(e.type)&&(n=e.stateNode),e=e.child,e!==null))for($c(e,t,n),e=e.sibling;e!==null;)$c(e,t,n),e=e.sibling}function el(e){var t=e.stateNode,n=e.memoizedProps;try{for(var r=e.type,i=t.attributes;i.length;)t.removeAttributeNode(i[0]);Pd(t,r,n),t[ht]=e,t[gt]=n}catch(t){Z(e,e.return,t)}}var tl=!1,nl=!1,rl=!1,il=typeof WeakSet==`function`?WeakSet:Set,al=null;function ol(e,t){if(e=e.containerInfo,Rd=sp,e=Fr(e),Ir(e)){if(`selectionStart`in e)var n={start:e.selectionStart,end:e.selectionEnd};else a:{n=(n=e.ownerDocument)&&n.defaultView||window;var r=n.getSelection&&n.getSelection();if(r&&r.rangeCount!==0){n=r.anchorNode;var a=r.anchorOffset,o=r.focusNode;r=r.focusOffset;try{n.nodeType,o.nodeType}catch{n=null;break a}var s=0,c=-1,l=-1,u=0,d=0,f=e,p=null;b:for(;;){for(var m;f!==n||a!==0&&f.nodeType!==3||(c=s+a),f!==o||r!==0&&f.nodeType!==3||(l=s+r),f.nodeType===3&&(s+=f.nodeValue.length),(m=f.firstChild)!==null;)p=f,f=m;for(;;){if(f===e)break b;if(p===n&&++u===a&&(c=s),p===o&&++d===r&&(l=s),(m=f.nextSibling)!==null)break;f=p,p=f.parentNode}f=m}n=c===-1||l===-1?null:{start:c,end:l}}else n=null}n||={start:0,end:0}}else n=null;for(zd={focusedElem:e,selectionRange:n},sp=!1,al=t;al!==null;)if(t=al,e=t.child,t.subtreeFlags&1028&&e!==null)e.return=t,al=e;else for(;al!==null;){switch(t=al,o=t.alternate,e=t.flags,t.tag){case 0:if(e&4&&(e=t.updateQueue,e=e===null?null:e.events,e!==null))for(n=0;n title`))),Pd(o,r,n),o[ht]=e,Ot(o),r=o;break a;case`link`:var s=Vf(`link`,`href`,a).get(r+(n.href||``));if(s){for(var c=0;cg&&(o=g,g=h,h=o);var _=Nr(s,h),v=Nr(s,g);if(_&&v&&(p.rangeCount!==1||p.anchorNode!==_.node||p.anchorOffset!==_.offset||p.focusNode!==v.node||p.focusOffset!==v.offset)){var y=d.createRange();y.setStart(_.node,_.offset),p.removeAllRanges(),h>g?(p.addRange(y),p.extend(v.node,v.offset)):(y.setEnd(v.node,v.offset),p.addRange(y))}}}}for(d=[],p=s;p=p.parentNode;)p.nodeType===1&&d.push({element:p,left:p.scrollLeft,top:p.scrollTop});for(typeof s.focus==`function`&&s.focus(),s=0;sn?32:n,D.T=null,n=lu,lu=null;var o=au,s=su;if(iu=0,ou=au=null,su=0,G&6)throw Error(i(331));var c=G;if(G|=4,Fl(o.current),Dl(o,o.current,s,n),G=c,id(0,!1),We&&typeof We.onPostCommitFiberRoot==`function`)try{We.onPostCommitFiberRoot(Ue,o)}catch{}return!0}finally{O.p=a,D.T=r,Vu(e,t)}}function Wu(e,t,n){t=Ti(n,t),t=$s(e.stateNode,t,2),e=qa(e,t,2),e!==null&&(at(e,2),rd(e))}function Z(e,t,n){if(e.tag===3)Wu(e,e,n);else for(;t!==null;){if(t.tag===3){Wu(t,e,n);break}else if(t.tag===1){var r=t.stateNode;if(typeof t.type.getDerivedStateFromError==`function`||typeof r.componentDidCatch==`function`&&(ru===null||!ru.has(r))){e=Ti(n,e),n=ec(2),r=qa(t,n,2),r!==null&&(tc(n,r,t,e),at(r,2),rd(r));break}}t=t.return}}function Gu(e,t,n){var r=e.pingCache;if(r===null){r=e.pingCache=new zl;var i=new Set;r.set(t,i)}else i=r.get(t),i===void 0&&(i=new Set,r.set(t,i));i.has(n)||(Ul=!0,i.add(n),e=Ku.bind(null,e,t,n),t.then(e,e))}function Ku(e,t,n){var r=e.pingCache;r!==null&&r.delete(t),e.pingedLanes|=e.suspendedLanes&n,e.warmLanes&=~n,K===e&&(J&n)===n&&(X===4||X===3&&(J&62914560)===J&&300>Pe()-$l?!(G&2)&&Su(e,0):ql|=n,Yl===J&&(Yl=0)),rd(e)}function qu(e,t){t===0&&(t=rt()),e=ui(e,t),e!==null&&(at(e,t),rd(e))}function Ju(e){var t=e.memoizedState,n=0;t!==null&&(n=t.retryLane),qu(e,n)}function Yu(e,t){var n=0;switch(e.tag){case 31:case 13:var r=e.stateNode,a=e.memoizedState;a!==null&&(n=a.retryLane);break;case 19:r=e.stateNode;break;case 22:r=e.stateNode._retryCache;break;default:throw Error(i(314))}r!==null&&r.delete(t),qu(e,n)}function Xu(e,t){return Ae(e,t)}var Zu=null,Qu=null,$u=!1,ed=!1,td=!1,nd=0;function rd(e){e!==Qu&&e.next===null&&(Qu===null?Zu=Qu=e:Qu=Qu.next=e),ed=!0,$u||($u=!0,ud())}function id(e,t){if(!td&&ed){td=!0;do for(var n=!1,r=Zu;r!==null;){if(!t)if(e!==0){var i=r.pendingLanes;if(i===0)var a=0;else{var o=r.suspendedLanes,s=r.pingedLanes;a=(1<<31-Ke(42|e)+1)-1,a&=i&~(o&~s),a=a&201326741?a&201326741|1:a?a|2:0}a!==0&&(n=!0,ld(r,a))}else a=J,a=et(r,r===K?a:0,r.cancelPendingCommit!==null||r.timeoutHandle!==-1),!(a&3)||tt(r,a)||(n=!0,ld(r,a));r=r.next}while(n);td=!1}}function ad(){od()}function od(){ed=$u=!1;var e=0;nd!==0&&Gd()&&(e=nd);for(var t=Pe(),n=null,r=Zu;r!==null;){var i=r.next,a=sd(r,t);a===0?(r.next=null,n===null?Zu=i:n.next=i,i===null&&(Qu=n)):(n=r,(e!==0||a&3)&&(ed=!0)),r=i}iu!==0&&iu!==5||id(e,!1),nd!==0&&(nd=0)}function sd(e,t){for(var n=e.suspendedLanes,r=e.pingedLanes,i=e.expirationTimes,a=e.pendingLanes&-62914561;0s)break;var u=c.transferSize,d=c.initiatorType;u&&Id(d)&&(c=c.responseEnd,o+=u*(c`u`?null:document;function xf(e,t,n){var r=bf;if(r&&typeof t==`string`&&t){var i=qt(t);i=`link[rel="`+e+`"][href="`+i+`"]`,typeof n==`string`&&(i+=`[crossorigin="`+n+`"]`),hf.has(i)||(hf.add(i),e={rel:e,crossOrigin:n,href:t},r.querySelector(i)===null&&(t=r.createElement(`link`),Pd(t,`link`,e),Ot(t),r.head.appendChild(t)))}}function Sf(e){_f.D(e),xf(`dns-prefetch`,e,null)}function Cf(e,t){_f.C(e,t),xf(`preconnect`,e,t)}function wf(e,t,n){_f.L(e,t,n);var r=bf;if(r&&e&&t){var i=`link[rel="preload"][as="`+qt(t)+`"]`;t===`image`&&n&&n.imageSrcSet?(i+=`[imagesrcset="`+qt(n.imageSrcSet)+`"]`,typeof n.imageSizes==`string`&&(i+=`[imagesizes="`+qt(n.imageSizes)+`"]`)):i+=`[href="`+qt(e)+`"]`;var a=i;switch(t){case`style`:a=Af(e);break;case`script`:a=Pf(e)}mf.has(a)||(e=m({rel:`preload`,href:t===`image`&&n&&n.imageSrcSet?void 0:e,as:t},n),mf.set(a,e),r.querySelector(i)!==null||t===`style`&&r.querySelector(jf(a))||t===`script`&&r.querySelector(Ff(a))||(t=r.createElement(`link`),Pd(t,`link`,e),Ot(t),r.head.appendChild(t)))}}function Tf(e,t){_f.m(e,t);var n=bf;if(n&&e){var r=t&&typeof t.as==`string`?t.as:`script`,i=`link[rel="modulepreload"][as="`+qt(r)+`"][href="`+qt(e)+`"]`,a=i;switch(r){case`audioworklet`:case`paintworklet`:case`serviceworker`:case`sharedworker`:case`worker`:case`script`:a=Pf(e)}if(!mf.has(a)&&(e=m({rel:`modulepreload`,href:e},t),mf.set(a,e),n.querySelector(i)===null)){switch(r){case`audioworklet`:case`paintworklet`:case`serviceworker`:case`sharedworker`:case`worker`:case`script`:if(n.querySelector(Ff(a)))return}r=n.createElement(`link`),Pd(r,`link`,e),Ot(r),n.head.appendChild(r)}}}function Ef(e,t,n){_f.S(e,t,n);var r=bf;if(r&&e){var i=Dt(r).hoistableStyles,a=Af(e);t||=`default`;var o=i.get(a);if(!o){var s={loading:0,preload:null};if(o=r.querySelector(jf(a)))s.loading=5;else{e=m({rel:`stylesheet`,href:e,"data-precedence":t},n),(n=mf.get(a))&&Rf(e,n);var c=o=r.createElement(`link`);Ot(c),Pd(c,`link`,e),c._p=new Promise(function(e,t){c.onload=e,c.onerror=t}),c.addEventListener(`load`,function(){s.loading|=1}),c.addEventListener(`error`,function(){s.loading|=2}),s.loading|=4,Lf(o,t,r)}o={type:`stylesheet`,instance:o,count:1,state:s},i.set(a,o)}}}function Df(e,t){_f.X(e,t);var n=bf;if(n&&e){var r=Dt(n).hoistableScripts,i=Pf(e),a=r.get(i);a||(a=n.querySelector(Ff(i)),a||(e=m({src:e,async:!0},t),(t=mf.get(i))&&zf(e,t),a=n.createElement(`script`),Ot(a),Pd(a,`link`,e),n.head.appendChild(a)),a={type:`script`,instance:a,count:1,state:null},r.set(i,a))}}function Of(e,t){_f.M(e,t);var n=bf;if(n&&e){var r=Dt(n).hoistableScripts,i=Pf(e),a=r.get(i);a||(a=n.querySelector(Ff(i)),a||(e=m({src:e,async:!0,type:`module`},t),(t=mf.get(i))&&zf(e,t),a=n.createElement(`script`),Ot(a),Pd(a,`link`,e),n.head.appendChild(a)),a={type:`script`,instance:a,count:1,state:null},r.set(i,a))}}function kf(e,t,n,r){var a=(a=ge.current)?gf(a):null;if(!a)throw Error(i(446));switch(e){case`meta`:case`title`:return null;case`style`:return typeof n.precedence==`string`&&typeof n.href==`string`?(t=Af(n.href),n=Dt(a).hoistableStyles,r=n.get(t),r||(r={type:`style`,instance:null,count:0,state:null},n.set(t,r)),r):{type:`void`,instance:null,count:0,state:null};case`link`:if(n.rel===`stylesheet`&&typeof n.href==`string`&&typeof n.precedence==`string`){e=Af(n.href);var o=Dt(a).hoistableStyles,s=o.get(e);if(s||(a=a.ownerDocument||a,s={type:`stylesheet`,instance:null,count:0,state:{loading:0,preload:null}},o.set(e,s),(o=a.querySelector(jf(e)))&&!o._p&&(s.instance=o,s.state.loading=5),mf.has(e)||(n={rel:`preload`,as:`style`,href:n.href,crossOrigin:n.crossOrigin,integrity:n.integrity,media:n.media,hrefLang:n.hrefLang,referrerPolicy:n.referrerPolicy},mf.set(e,n),o||Nf(a,e,n,s.state))),t&&r===null)throw Error(i(528,``));return s}if(t&&r!==null)throw Error(i(529,``));return null;case`script`:return t=n.async,n=n.src,typeof n==`string`&&t&&typeof t!=`function`&&typeof t!=`symbol`?(t=Pf(n),n=Dt(a).hoistableScripts,r=n.get(t),r||(r={type:`script`,instance:null,count:0,state:null},n.set(t,r)),r):{type:`void`,instance:null,count:0,state:null};default:throw Error(i(444,e))}}function Af(e){return`href="`+qt(e)+`"`}function jf(e){return`link[rel="stylesheet"][`+e+`]`}function Mf(e){return m({},e,{"data-precedence":e.precedence,precedence:null})}function Nf(e,t,n,r){e.querySelector(`link[rel="preload"][as="style"][`+t+`]`)?r.loading=1:(t=e.createElement(`link`),r.preload=t,t.addEventListener(`load`,function(){return r.loading|=1}),t.addEventListener(`error`,function(){return r.loading|=2}),Pd(t,`link`,n),Ot(t),e.head.appendChild(t))}function Pf(e){return`[src="`+qt(e)+`"]`}function Ff(e){return`script[async]`+e}function If(e,t,n){if(t.count++,t.instance===null)switch(t.type){case`style`:var r=e.querySelector(`style[data-href~="`+qt(n.href)+`"]`);if(r)return t.instance=r,Ot(r),r;var a=m({},n,{"data-href":n.href,"data-precedence":n.precedence,href:null,precedence:null});return r=(e.ownerDocument||e).createElement(`style`),Ot(r),Pd(r,`style`,a),Lf(r,n.precedence,e),t.instance=r;case`stylesheet`:a=Af(n.href);var o=e.querySelector(jf(a));if(o)return t.state.loading|=4,t.instance=o,Ot(o),o;r=Mf(n),(a=mf.get(a))&&Rf(r,a),o=(e.ownerDocument||e).createElement(`link`),Ot(o);var s=o;return s._p=new Promise(function(e,t){s.onload=e,s.onerror=t}),Pd(o,`link`,r),t.state.loading|=4,Lf(o,n.precedence,e),t.instance=o;case`script`:return o=Pf(n.src),(a=e.querySelector(Ff(o)))?(t.instance=a,Ot(a),a):(r=n,(a=mf.get(o))&&(r=m({},n),zf(r,a)),e=e.ownerDocument||e,a=e.createElement(`script`),Ot(a),Pd(a,`link`,r),e.head.appendChild(a),t.instance=a);case`void`:return null;default:throw Error(i(443,t.type))}else t.type===`stylesheet`&&!(t.state.loading&4)&&(r=t.instance,t.state.loading|=4,Lf(r,n.precedence,e));return t.instance}function Lf(e,t,n){for(var r=n.querySelectorAll(`link[rel="stylesheet"][data-precedence],style[data-precedence]`),i=r.length?r[r.length-1]:null,a=i,o=0;o title`):null)}function Uf(e,t,n){if(n===1||t.itemProp!=null)return!1;switch(e){case`meta`:case`title`:return!0;case`style`:if(typeof t.precedence!=`string`||typeof t.href!=`string`||t.href===``)break;return!0;case`link`:if(typeof t.rel!=`string`||typeof t.href!=`string`||t.href===``||t.onLoad||t.onError)break;switch(t.rel){case`stylesheet`:return e=t.disabled,typeof t.precedence==`string`&&e==null;default:return!0}case`script`:if(t.async&&typeof t.async!=`function`&&typeof t.async!=`symbol`&&!t.onLoad&&!t.onError&&t.src&&typeof t.src==`string`)return!0}return!1}function Wf(e){return!(e.type===`stylesheet`&&!(e.state.loading&3))}function Gf(e,t,n,r){if(n.type===`stylesheet`&&(typeof r.media!=`string`||!1!==matchMedia(r.media).matches)&&!(n.state.loading&4)){if(n.instance===null){var i=Af(r.href),a=t.querySelector(jf(i));if(a){t=a._p,typeof t==`object`&&t&&typeof t.then==`function`&&(e.count++,e=Jf.bind(e),t.then(e,e)),n.state.loading|=4,n.instance=a,Ot(a);return}a=t.ownerDocument||t,r=Mf(r),(i=mf.get(i))&&Rf(r,i),a=a.createElement(`link`),Ot(a);var o=a;o._p=new Promise(function(e,t){o.onload=e,o.onerror=t}),Pd(a,`link`,r),n.instance=a}e.stylesheets===null&&(e.stylesheets=new Map),e.stylesheets.set(n,t),(t=n.state.preload)&&!(n.state.loading&3)&&(e.count++,n=Jf.bind(e),t.addEventListener(`load`,n),t.addEventListener(`error`,n))}}var Kf=0;function qf(e,t){return e.stylesheets&&e.count===0&&Xf(e,e.stylesheets),0Kf?50:800)+t);return e.unsuspend=n,function(){e.unsuspend=null,clearTimeout(r),clearTimeout(i)}}:null}function Jf(){if(this.count--,this.count===0&&(this.imgCount===0||!this.waitingForImages)){if(this.stylesheets)Xf(this,this.stylesheets);else if(this.unsuspend){var e=this.unsuspend;this.unsuspend=null,e()}}}var Yf=null;function Xf(e,t){e.stylesheets=null,e.unsuspend!==null&&(e.count++,Yf=new Map,t.forEach(Zf,e),Yf=null,Jf.call(e))}function Zf(e,t){if(!(t.state.loading&4)){var n=Yf.get(e);if(n)var r=n.get(null);else{n=new Map,Yf.set(e,n);for(var i=e.querySelectorAll(`link[data-precedence],style[data-precedence]`),a=0;a{function n(){if(!(typeof __REACT_DEVTOOLS_GLOBAL_HOOK__>`u`||typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.checkDCE!=`function`))try{__REACT_DEVTOOLS_GLOBAL_HOOK__.checkDCE(n)}catch(e){console.error(e)}}n(),t.exports=g()})),v=`modulepreload`,y=function(e,t){return new URL(e,t).href},b={},x=function(e,t,n){let r=Promise.resolve();if(t&&t.length>0){let e=document.getElementsByTagName(`link`),i=document.querySelector(`meta[property=csp-nonce]`),a=i?.nonce||i?.getAttribute(`nonce`);function o(e){return Promise.all(e.map(e=>Promise.resolve(e).then(e=>({status:`fulfilled`,value:e}),e=>({status:`rejected`,reason:e}))))}r=o(t.map(t=>{if(t=y(t,n),t in b)return;b[t]=!0;let r=t.endsWith(`.css`),i=r?`[rel="stylesheet"]`:``;if(n)for(let n=e.length-1;n>=0;n--){let i=e[n];if(i.href===t&&(!r||i.rel===`stylesheet`))return}else if(document.querySelector(`link[href="${t}"]${i}`))return;let o=document.createElement(`link`);if(o.rel=r?`stylesheet`:v,r||(o.as=`script`),o.crossOrigin=``,o.href=t,a&&o.setAttribute(`nonce`,a),document.head.appendChild(o),r)return new Promise((e,n)=>{o.addEventListener(`load`,e),o.addEventListener(`error`,()=>n(Error(`Unable to preload CSS for ${t}`)))})}))}function i(e){let t=new Event(`vite:preloadError`,{cancelable:!0});if(t.payload=e,window.dispatchEvent(t),!t.defaultPrevented)throw e}return r.then(t=>{for(let e of t||[])e.status===`rejected`&&i(e.reason);return e().catch(i)})},S=l(d(),1),C=`popstate`;function w(e){return typeof e==`object`&&!!e&&`pathname`in e&&`search`in e&&`hash`in e&&`state`in e&&`key`in e}function ee(e={}){function t(e,t){let n=t.state?.masked,{pathname:r,search:i,hash:a}=n||e.location;return re(``,{pathname:r,search:i,hash:a},t.state&&t.state.usr||null,t.state&&t.state.key||`default`,n?{pathname:e.location.pathname,search:e.location.search,hash:e.location.hash}:void 0)}function n(e,t){return typeof t==`string`?t:ie(t)}return oe(t,n,null,e)}function T(e,t){if(e===!1||e==null)throw Error(t)}function E(e,t){if(!e){typeof console<`u`&&console.warn(t);try{throw Error(t)}catch{}}}function te(){return Math.random().toString(36).substring(2,10)}function ne(e,t){return{usr:e.state,key:e.key,idx:t,masked:e.unstable_mask?{pathname:e.pathname,search:e.search,hash:e.hash}:void 0}}function re(e,t,n=null,r,i){return{pathname:typeof e==`string`?e:e.pathname,search:``,hash:``,...typeof t==`string`?ae(t):t,state:n,key:t&&t.key||r||te(),unstable_mask:i}}function ie({pathname:e=`/`,search:t=``,hash:n=``}){return t&&t!==`?`&&(e+=t.charAt(0)===`?`?t:`?`+t),n&&n!==`#`&&(e+=n.charAt(0)===`#`?n:`#`+n),e}function ae(e){let t={};if(e){let n=e.indexOf(`#`);n>=0&&(t.hash=e.substring(n),e=e.substring(0,n));let r=e.indexOf(`?`);r>=0&&(t.search=e.substring(r),e=e.substring(0,r)),e&&(t.pathname=e)}return t}function oe(e,t,n,r={}){let{window:i=document.defaultView,v5Compat:a=!1}=r,o=i.history,s=`POP`,c=null,l=u();l??(l=0,o.replaceState({...o.state,idx:l},``));function u(){return(o.state||{idx:null}).idx}function d(){s=`POP`;let e=u(),t=e==null?null:e-l;l=e,c&&c({action:s,location:h.location,delta:t})}function f(e,t){s=`PUSH`;let r=w(e)?e:re(h.location,e,t);n&&n(r,e),l=u()+1;let d=ne(r,l),f=h.createHref(r.unstable_mask||r);try{o.pushState(d,``,f)}catch(e){if(e instanceof DOMException&&e.name===`DataCloneError`)throw e;i.location.assign(f)}a&&c&&c({action:s,location:h.location,delta:1})}function p(e,t){s=`REPLACE`;let r=w(e)?e:re(h.location,e,t);n&&n(r,e),l=u();let i=ne(r,l),d=h.createHref(r.unstable_mask||r);o.replaceState(i,``,d),a&&c&&c({action:s,location:h.location,delta:0})}function m(e){return se(e)}let h={get action(){return s},get location(){return e(i,o)},listen(e){if(c)throw Error(`A history only accepts one active listener`);return i.addEventListener(C,d),c=e,()=>{i.removeEventListener(C,d),c=null}},createHref(e){return t(i,e)},createURL:m,encodeLocation(e){let t=m(e);return{pathname:t.pathname,search:t.search,hash:t.hash}},push:f,replace:p,go(e){return o.go(e)}};return h}function se(e,t=!1){let n=`http://localhost`;typeof window<`u`&&(n=window.location.origin===`null`?window.location.href:window.location.origin),T(n,`No window.location.(origin|href) available to create URL`);let r=typeof e==`string`?e:ie(e);return r=r.replace(/ $/,`%20`),!t&&r.startsWith(`//`)&&(r=n+r),new URL(r,n)}function ce(e,t,n=`/`){return D(e,t,n,!1)}function D(e,t,n,r){let i=we((typeof t==`string`?ae(t):t).pathname||`/`,n);if(i==null)return null;let a=le(e);de(a);let o=null;for(let e=0;o==null&&e{let c={relativePath:s===void 0?e.path||``:s,caseSensitive:e.caseSensitive===!0,childrenIndex:a,route:e};if(c.relativePath.startsWith(`/`)){if(!c.relativePath.startsWith(r)&&o)return;T(c.relativePath.startsWith(r),`Absolute route path "${c.relativePath}" nested under path "${r}" is not valid. An absolute child route path must start with the combined path of all its parent routes.`),c.relativePath=c.relativePath.slice(r.length)}let l=Me([r,c.relativePath]),u=n.concat(c);e.children&&e.children.length>0&&(T(e.index!==!0,`Index routes must not have child routes. Please remove all child routes from route path "${l}".`),le(e.children,t,u,l,o)),!(e.path==null&&!e.index)&&t.push({path:l,score:ve(l,e.index),routesMeta:u})};return e.forEach((e,t)=>{if(e.path===``||!e.path?.includes(`?`))a(e,t);else for(let n of ue(e.path))a(e,t,!0,n)}),t}function ue(e){let t=e.split(`/`);if(t.length===0)return[];let[n,...r]=t,i=n.endsWith(`?`),a=n.replace(/\?$/,``);if(r.length===0)return i?[a,``]:[a];let o=ue(r.join(`/`)),s=[];return s.push(...o.map(e=>e===``?a:[a,e].join(`/`))),i&&s.push(...o),s.map(t=>e.startsWith(`/`)&&t===``?`/`:t)}function de(e){e.sort((e,t)=>e.score===t.score?ye(e.routesMeta.map(e=>e.childrenIndex),t.routesMeta.map(e=>e.childrenIndex)):t.score-e.score)}var fe=/^:[\w-]+$/,pe=3,k=2,me=1,he=10,ge=-2,_e=e=>e===`*`;function ve(e,t){let n=e.split(`/`),r=n.length;return n.some(_e)&&(r+=ge),t&&(r+=k),n.filter(e=>!_e(e)).reduce((e,t)=>e+(fe.test(t)?pe:t===``?me:he),r)}function ye(e,t){return e.length===t.length&&e.slice(0,-1).every((e,n)=>e===t[n])?e[e.length-1]-t[t.length-1]:0}function be(e,t,n=!1){let{routesMeta:r}=e,i={},a=`/`,o=[];for(let e=0;e{if(t===`*`){let e=s[r]||``;o=a.slice(0,a.length-e.length).replace(/(.)\/+$/,`$1`)}let i=s[r];return n&&!i?e[t]=void 0:e[t]=(i||``).replace(/%2F/g,`/`),e},{}),pathname:a,pathnameBase:o,pattern:e}}function Se(e,t=!1,n=!0){E(e===`*`||!e.endsWith(`*`)||e.endsWith(`/*`),`Route path "${e}" will be treated as if it were "${e.replace(/\*$/,`/*`)}" because the \`*\` character must always follow a \`/\` in the pattern. To get rid of this warning, please change the route path to "${e.replace(/\*$/,`/*`)}".`);let r=[],i=`^`+e.replace(/\/*\*?$/,``).replace(/^\/*/,`/`).replace(/[\\.*+^${}|()[\]]/g,`\\$&`).replace(/\/:([\w-]+)(\?)?/g,(e,t,n,i,a)=>{if(r.push({paramName:t,isOptional:n!=null}),n){let t=a.charAt(i+e.length);return t&&t!==`/`?`/([^\\/]*)`:`(?:/([^\\/]*))?`}return`/([^\\/]+)`}).replace(/\/([\w-]+)\?(\/|$)/g,`(/$1)?$2`);return e.endsWith(`*`)?(r.push({paramName:`*`}),i+=e===`*`||e===`/*`?`(.*)$`:`(?:\\/(.+)|\\/*)$`):n?i+=`\\/*$`:e!==``&&e!==`/`&&(i+=`(?:(?=\\/|$))`),[new RegExp(i,t?void 0:`i`),r]}function Ce(e){try{return e.split(`/`).map(e=>decodeURIComponent(e).replace(/\//g,`%2F`)).join(`/`)}catch(t){return E(!1,`The URL path "${e}" could not be decoded because it is a malformed URL segment. This is probably due to a bad percent encoding (${t}).`),e}}function we(e,t){if(t===`/`)return e;if(!e.toLowerCase().startsWith(t.toLowerCase()))return null;let n=t.endsWith(`/`)?t.length-1:t.length,r=e.charAt(n);return r&&r!==`/`?null:e.slice(n)||`/`}var Te=/^(?:[a-z][a-z0-9+.-]*:|\/\/)/i;function Ee(e,t=`/`){let{pathname:n,search:r=``,hash:i=``}=typeof e==`string`?ae(e):e,a;return n?(n=n.replace(/\/\/+/g,`/`),a=n.startsWith(`/`)?De(n.substring(1),`/`):De(n,t)):a=t,{pathname:a,search:Pe(r),hash:Fe(i)}}function De(e,t){let n=t.replace(/\/+$/,``).split(`/`);return e.split(`/`).forEach(e=>{e===`..`?n.length>1&&n.pop():e!==`.`&&n.push(e)}),n.length>1?n.join(`/`):`/`}function Oe(e,t,n,r){return`Cannot include a '${e}' character in a manually specified \`to.${t}\` field [${JSON.stringify(r)}]. Please separate it out to the \`to.${n}\` field. Alternatively you may provide the full path as a string in and the router will parse it for you.`}function ke(e){return e.filter((e,t)=>t===0||e.route.path&&e.route.path.length>0)}function Ae(e){let t=ke(e);return t.map((e,n)=>n===t.length-1?e.pathname:e.pathnameBase)}function je(e,t,n,r=!1){let i;typeof e==`string`?i=ae(e):(i={...e},T(!i.pathname||!i.pathname.includes(`?`),Oe(`?`,`pathname`,`search`,i)),T(!i.pathname||!i.pathname.includes(`#`),Oe(`#`,`pathname`,`hash`,i)),T(!i.search||!i.search.includes(`#`),Oe(`#`,`search`,`hash`,i)));let a=e===``||i.pathname===``,o=a?`/`:i.pathname,s;if(o==null)s=n;else{let e=t.length-1;if(!r&&o.startsWith(`..`)){let t=o.split(`/`);for(;t[0]===`..`;)t.shift(),--e;i.pathname=t.join(`/`)}s=e>=0?t[e]:`/`}let c=Ee(i,s),l=o&&o!==`/`&&o.endsWith(`/`),u=(a||o===`.`)&&n.endsWith(`/`);return!c.pathname.endsWith(`/`)&&(l||u)&&(c.pathname+=`/`),c}var Me=e=>e.join(`/`).replace(/\/\/+/g,`/`),Ne=e=>e.replace(/\/+$/,``).replace(/^\/*/,`/`),Pe=e=>!e||e===`?`?``:e.startsWith(`?`)?e:`?`+e,Fe=e=>!e||e===`#`?``:e.startsWith(`#`)?e:`#`+e,Ie=class{constructor(e,t,n,r=!1){this.status=e,this.statusText=t||``,this.internal=r,n instanceof Error?(this.data=n.toString(),this.error=n):this.data=n}};function Le(e){return e!=null&&typeof e.status==`number`&&typeof e.statusText==`string`&&typeof e.internal==`boolean`&&`data`in e}function Re(e){return e.map(e=>e.route.path).filter(Boolean).join(`/`).replace(/\/\/*/g,`/`)||`/`}var ze=typeof window<`u`&&window.document!==void 0&&window.document.createElement!==void 0;function Be(e,t){let n=e;if(typeof n!=`string`||!Te.test(n))return{absoluteURL:void 0,isExternal:!1,to:n};let r=n,i=!1;if(ze)try{let e=new URL(window.location.href),r=n.startsWith(`//`)?new URL(e.protocol+n):new URL(n),a=we(r.pathname,t);r.origin===e.origin&&a!=null?n=a+r.search+r.hash:i=!0}catch{E(!1,` contains an invalid URL which will probably break when clicked - please update to a valid URL path.`)}return{absoluteURL:r,isExternal:i,to:n}}Object.getOwnPropertyNames(Object.prototype).sort().join(`\0`);var Ve=[`POST`,`PUT`,`PATCH`,`DELETE`];new Set(Ve);var He=[`GET`,...Ve];new Set(He);var Ue=S.createContext(null);Ue.displayName=`DataRouter`;var We=S.createContext(null);We.displayName=`DataRouterState`;var Ge=S.createContext(!1),Ke=S.createContext({isTransitioning:!1});Ke.displayName=`ViewTransition`;var qe=S.createContext(new Map);qe.displayName=`Fetchers`;var Je=S.createContext(null);Je.displayName=`Await`;var Ye=S.createContext(null);Ye.displayName=`Navigation`;var Xe=S.createContext(null);Xe.displayName=`Location`;var Ze=S.createContext({outlet:null,matches:[],isDataRoute:!1});Ze.displayName=`Route`;var Qe=S.createContext(null);Qe.displayName=`RouteError`;var $e=`REACT_ROUTER_ERROR`,et=`REDIRECT`,tt=`ROUTE_ERROR_RESPONSE`;function nt(e){if(e.startsWith(`${$e}:${et}:{`))try{let t=JSON.parse(e.slice(28));if(typeof t==`object`&&t&&typeof t.status==`number`&&typeof t.statusText==`string`&&typeof t.location==`string`&&typeof t.reloadDocument==`boolean`&&typeof t.replace==`boolean`)return t}catch{}}function rt(e){if(e.startsWith(`${$e}:${tt}:{`))try{let t=JSON.parse(e.slice(40));if(typeof t==`object`&&t&&typeof t.status==`number`&&typeof t.statusText==`string`)return new Ie(t.status,t.statusText,t.data)}catch{}}function it(e,{relative:t}={}){T(at(),`useHref() may be used only in the context of a component.`);let{basename:n,navigator:r}=S.useContext(Ye),{hash:i,pathname:a,search:o}=dt(e,{relative:t}),s=a;return n!==`/`&&(s=a===`/`?n:Me([n,a])),r.createHref({pathname:s,search:o,hash:i})}function at(){return S.useContext(Xe)!=null}function ot(){return T(at(),`useLocation() may be used only in the context of a component.`),S.useContext(Xe).location}var st=`You should call navigate() in a React.useEffect(), not when your component is first rendered.`;function ct(e){S.useContext(Ye).static||S.useLayoutEffect(e)}function lt(){let{isDataRoute:e}=S.useContext(Ze);return e?At():ut()}function ut(){T(at(),`useNavigate() may be used only in the context of a component.`);let e=S.useContext(Ue),{basename:t,navigator:n}=S.useContext(Ye),{matches:r}=S.useContext(Ze),{pathname:i}=ot(),a=JSON.stringify(Ae(r)),o=S.useRef(!1);return ct(()=>{o.current=!0}),S.useCallback((r,s={})=>{if(E(o.current,st),!o.current)return;if(typeof r==`number`){n.go(r);return}let c=je(r,JSON.parse(a),i,s.relative===`path`);e==null&&t!==`/`&&(c.pathname=c.pathname===`/`?t:Me([t,c.pathname])),(s.replace?n.replace:n.push)(c,s.state,s)},[t,n,a,i,e])}S.createContext(null);function dt(e,{relative:t}={}){let{matches:n}=S.useContext(Ze),{pathname:r}=ot(),i=JSON.stringify(Ae(n));return S.useMemo(()=>je(e,JSON.parse(i),r,t===`path`),[e,i,r,t])}function ft(e,t){return pt(e,t)}function pt(e,t,n){T(at(),`useRoutes() may be used only in the context of a component.`);let{navigator:r}=S.useContext(Ye),{matches:i}=S.useContext(Ze),a=i[i.length-1],o=a?a.params:{},s=a?a.pathname:`/`,c=a?a.pathnameBase:`/`,l=a&&a.route;{let e=l&&l.path||``;Mt(s,!l||e.endsWith(`*`)||e.endsWith(`*?`),`You rendered descendant (or called \`useRoutes()\`) at "${s}" (under ) but the parent route path has no trailing "*". This means if you navigate deeper, the parent won't match anymore and therefore the child routes will never render. + +Please change the parent to .`)}let u=ot(),d;if(t){let e=typeof t==`string`?ae(t):t;T(c===`/`||e.pathname?.startsWith(c),`When overriding the location using \`\` or \`useRoutes(routes, location)\`, the location pathname must begin with the portion of the URL pathname that was matched by all parent routes. The current pathname base is "${c}" but pathname "${e.pathname}" was given in the \`location\` prop.`),d=e}else d=u;let f=d.pathname||`/`,p=f;if(c!==`/`){let e=c.replace(/^\//,``).split(`/`);p=`/`+f.replace(/^\//,``).split(`/`).slice(e.length).join(`/`)}let m=ce(e,{pathname:p});E(l||m!=null,`No routes matched location "${d.pathname}${d.search}${d.hash}" `),E(m==null||m[m.length-1].route.element!==void 0||m[m.length-1].route.Component!==void 0||m[m.length-1].route.lazy!==void 0,`Matched leaf route at location "${d.pathname}${d.search}${d.hash}" does not have an element or Component. This means it will render an with a null value by default resulting in an "empty" page.`);let h=bt(m&&m.map(e=>Object.assign({},e,{params:Object.assign({},o,e.params),pathname:Me([c,r.encodeLocation?r.encodeLocation(e.pathname.replace(/%/g,`%25`).replace(/\?/g,`%3F`).replace(/#/g,`%23`)).pathname:e.pathname]),pathnameBase:e.pathnameBase===`/`?c:Me([c,r.encodeLocation?r.encodeLocation(e.pathnameBase.replace(/%/g,`%25`).replace(/\?/g,`%3F`).replace(/#/g,`%23`)).pathname:e.pathnameBase])})),i,n);return t&&h?S.createElement(Xe.Provider,{value:{location:{pathname:`/`,search:``,hash:``,state:null,key:`default`,unstable_mask:void 0,...d},navigationType:`POP`}},h):h}function mt(){let e=kt(),t=Le(e)?`${e.status} ${e.statusText}`:e instanceof Error?e.message:JSON.stringify(e),n=e instanceof Error?e.stack:null,r=`rgba(200,200,200, 0.5)`,i={padding:`0.5rem`,backgroundColor:r},a={padding:`2px 4px`,backgroundColor:r},o=null;return console.error(`Error handled by React Router default ErrorBoundary:`,e),o=S.createElement(S.Fragment,null,S.createElement(`p`,null,`💿 Hey developer 👋`),S.createElement(`p`,null,`You can provide a way better UX than this when your app throws errors by providing your own `,S.createElement(`code`,{style:a},`ErrorBoundary`),` or`,` `,S.createElement(`code`,{style:a},`errorElement`),` prop on your route.`)),S.createElement(S.Fragment,null,S.createElement(`h2`,null,`Unexpected Application Error!`),S.createElement(`h3`,{style:{fontStyle:`italic`}},t),n?S.createElement(`pre`,{style:i},n):null,o)}var ht=S.createElement(mt,null),gt=class extends S.Component{constructor(e){super(e),this.state={location:e.location,revalidation:e.revalidation,error:e.error}}static getDerivedStateFromError(e){return{error:e}}static getDerivedStateFromProps(e,t){return t.location!==e.location||t.revalidation!==`idle`&&e.revalidation===`idle`?{error:e.error,location:e.location,revalidation:e.revalidation}:{error:e.error===void 0?t.error:e.error,location:t.location,revalidation:e.revalidation||t.revalidation}}componentDidCatch(e,t){this.props.onError?this.props.onError(e,t):console.error(`React Router caught the following error during render`,e)}render(){let e=this.state.error;if(this.context&&typeof e==`object`&&e&&`digest`in e&&typeof e.digest==`string`){let t=rt(e.digest);t&&(e=t)}let t=e===void 0?this.props.children:S.createElement(Ze.Provider,{value:this.props.routeContext},S.createElement(Qe.Provider,{value:e,children:this.props.component}));return this.context?S.createElement(vt,{error:e},t):t}};gt.contextType=Ge;var _t=new WeakMap;function vt({children:e,error:t}){let{basename:n}=S.useContext(Ye);if(typeof t==`object`&&t&&`digest`in t&&typeof t.digest==`string`){let e=nt(t.digest);if(e){let r=_t.get(t);if(r)throw r;let i=Be(e.location,n);if(ze&&!_t.get(t))if(i.isExternal||e.reloadDocument)window.location.href=i.absoluteURL||i.to;else{let n=Promise.resolve().then(()=>window.__reactRouterDataRouter.navigate(i.to,{replace:e.replace}));throw _t.set(t,n),n}return S.createElement(`meta`,{httpEquiv:`refresh`,content:`0;url=${i.absoluteURL||i.to}`})}}return e}function yt({routeContext:e,match:t,children:n}){let r=S.useContext(Ue);return r&&r.static&&r.staticContext&&(t.route.errorElement||t.route.ErrorBoundary)&&(r.staticContext._deepestRenderedBoundaryId=t.route.id),S.createElement(Ze.Provider,{value:e},n)}function bt(e,t=[],n){let r=n?.state;if(e==null){if(!r)return null;if(r.errors)e=r.matches;else if(t.length===0&&!r.initialized&&r.matches.length>0)e=r.matches;else return null}let i=e,a=r?.errors;if(a!=null){let e=i.findIndex(e=>e.route.id&&a?.[e.route.id]!==void 0);T(e>=0,`Could not find a matching route for errors on route IDs: ${Object.keys(a).join(`,`)}`),i=i.slice(0,Math.min(i.length,e+1))}let o=!1,s=-1;if(n&&r){o=r.renderFallback;for(let e=0;e=0?i.slice(0,s+1):[i[0]];break}}}}let c=n?.onError,l=r&&c?(e,t)=>{c(e,{location:r.location,params:r.matches?.[0]?.params??{},unstable_pattern:Re(r.matches),errorInfo:t})}:void 0;return i.reduceRight((e,n,c)=>{let u,d=!1,f=null,p=null;r&&(u=a&&n.route.id?a[n.route.id]:void 0,f=n.route.errorElement||ht,o&&(s<0&&c===0?(Mt(`route-fallback`,!1,"No `HydrateFallback` element provided to render during initial hydration"),d=!0,p=null):s===c&&(d=!0,p=n.route.hydrateFallbackElement||null)));let m=t.concat(i.slice(0,c+1)),h=()=>{let t;return t=u?f:d?p:n.route.Component?S.createElement(n.route.Component,null):n.route.element?n.route.element:e,S.createElement(yt,{match:n,routeContext:{outlet:e,matches:m,isDataRoute:r!=null},children:t})};return r&&(n.route.ErrorBoundary||n.route.errorElement||c===0)?S.createElement(gt,{location:r.location,revalidation:r.revalidation,component:f,error:u,children:h(),routeContext:{outlet:null,matches:m,isDataRoute:!0},onError:l}):h()},null)}function xt(e){return`${e} must be used within a data router. See https://reactrouter.com/en/main/routers/picking-a-router.`}function St(e){let t=S.useContext(Ue);return T(t,xt(e)),t}function Ct(e){let t=S.useContext(We);return T(t,xt(e)),t}function wt(e){let t=S.useContext(Ze);return T(t,xt(e)),t}function Tt(e){let t=wt(e),n=t.matches[t.matches.length-1];return T(n.route.id,`${e} can only be used on routes that contain a unique "id"`),n.route.id}function Et(){return Tt(`useRouteId`)}function Dt(){return Ct(`useNavigation`).navigation}function Ot(){let{matches:e,loaderData:t}=Ct(`useMatches`);return S.useMemo(()=>e.map(e=>O(e,t)),[e,t])}function kt(){let e=S.useContext(Qe),t=Ct(`useRouteError`),n=Tt(`useRouteError`);return e===void 0?t.errors?.[n]:e}function At(){let{router:e}=St(`useNavigate`),t=Tt(`useNavigate`),n=S.useRef(!1);return ct(()=>{n.current=!0}),S.useCallback(async(r,i={})=>{E(n.current,st),n.current&&(typeof r==`number`?await e.navigate(r):await e.navigate(r,{fromRouteId:t,...i}))},[e,t])}var jt={};function Mt(e,t,n){!t&&!jt[e]&&(jt[e]=!0,E(!1,n))}S.useOptimistic,S.memo(Nt);function Nt({routes:e,future:t,state:n,isStatic:r,onError:i}){return pt(e,void 0,{state:n,isStatic:r,onError:i,future:t})}function Pt(e){T(!1,`A is only ever to be used as the child of element, never rendered directly. Please wrap your in a .`)}function Ft({basename:e=`/`,children:t=null,location:n,navigationType:r=`POP`,navigator:i,static:a=!1,unstable_useTransitions:o}){T(!at(),`You cannot render a inside another . You should never have more than one in your app.`);let s=e.replace(/^\/*/,`/`),c=S.useMemo(()=>({basename:s,navigator:i,static:a,unstable_useTransitions:o,future:{}}),[s,i,a,o]);typeof n==`string`&&(n=ae(n));let{pathname:l=`/`,search:u=``,hash:d=``,state:f=null,key:p=`default`,unstable_mask:m}=n,h=S.useMemo(()=>{let e=we(l,s);return e==null?null:{location:{pathname:e,search:u,hash:d,state:f,key:p,unstable_mask:m},navigationType:r}},[s,l,u,d,f,p,r,m]);return E(h!=null,` is not able to match the URL "${l}${u}${d}" because it does not start with the basename, so the won't render anything.`),h==null?null:S.createElement(Ye.Provider,{value:c},S.createElement(Xe.Provider,{children:t,value:h}))}function It({children:e,location:t}){return ft(Lt(e),t)}function Lt(e,t=[]){let n=[];return S.Children.forEach(e,(e,r)=>{if(!S.isValidElement(e))return;let i=[...t,r];if(e.type===S.Fragment){n.push.apply(n,Lt(e.props.children,i));return}T(e.type===Pt,`[${typeof e.type==`string`?e.type:e.type.name}] is not a component. All component children of must be a or `),T(!e.props.index||!e.props.children,`An index route cannot have child routes.`);let a={id:e.props.id||i.join(`-`),caseSensitive:e.props.caseSensitive,element:e.props.element,Component:e.props.Component,index:e.props.index,path:e.props.path,middleware:e.props.middleware,loader:e.props.loader,action:e.props.action,hydrateFallbackElement:e.props.hydrateFallbackElement,HydrateFallback:e.props.HydrateFallback,errorElement:e.props.errorElement,ErrorBoundary:e.props.ErrorBoundary,hasErrorBoundary:e.props.hasErrorBoundary===!0||e.props.ErrorBoundary!=null||e.props.errorElement!=null,shouldRevalidate:e.props.shouldRevalidate,handle:e.props.handle,lazy:e.props.lazy};e.props.children&&(a.children=Lt(e.props.children,i)),n.push(a)}),n}var Rt=`get`,zt=`application/x-www-form-urlencoded`;function Bt(e){return typeof HTMLElement<`u`&&e instanceof HTMLElement}function Vt(e){return Bt(e)&&e.tagName.toLowerCase()===`button`}function Ht(e){return Bt(e)&&e.tagName.toLowerCase()===`form`}function Ut(e){return Bt(e)&&e.tagName.toLowerCase()===`input`}function Wt(e){return!!(e.metaKey||e.altKey||e.ctrlKey||e.shiftKey)}function Gt(e,t){return e.button===0&&(!t||t===`_self`)&&!Wt(e)}function Kt(e=``){return new URLSearchParams(typeof e==`string`||Array.isArray(e)||e instanceof URLSearchParams?e:Object.keys(e).reduce((t,n)=>{let r=e[n];return t.concat(Array.isArray(r)?r.map(e=>[n,e]):[[n,r]])},[]))}function qt(e,t){let n=Kt(e);return t&&t.forEach((e,r)=>{n.has(r)||t.getAll(r).forEach(e=>{n.append(r,e)})}),n}var Jt=null;function Yt(){if(Jt===null)try{new FormData(document.createElement(`form`),0),Jt=!1}catch{Jt=!0}return Jt}var Xt=new Set([`application/x-www-form-urlencoded`,`multipart/form-data`,`text/plain`]);function Zt(e){return e!=null&&!Xt.has(e)?(E(!1,`"${e}" is not a valid \`encType\` for \`
\`/\`\` and will default to "${zt}"`),null):e}function Qt(e,t){let n,r,i,a,o;if(Ht(e)){let o=e.getAttribute(`action`);r=o?we(o,t):null,n=e.getAttribute(`method`)||Rt,i=Zt(e.getAttribute(`enctype`))||zt,a=new FormData(e)}else if(Vt(e)||Ut(e)&&(e.type===`submit`||e.type===`image`)){let o=e.form;if(o==null)throw Error(`Cannot submit a