@givolt/i3-composer-agent 2.3.1 → 2.3.2

package/skills/i3-ui-prototype/assets/frameworks/vue-antdv-next/starter/package.json

@@ -0,0 +1,22 @@
+{
+  "name": "business-antdv-prototype",
+  "version": "1.0.0",
+  "private": true,
+  "type": "module",
+  "packageManager": "npm@11.12.1",
+  "engines": { "node": ">=22.18.0", "npm": ">=10" },
+  "scripts": {
+    "dev": "vite --host 127.0.0.1",
+    "typecheck": "vue-tsc --noEmit",
+    "test": "node --experimental-strip-types --test tests/*.test.ts",
+    "build": "vue-tsc --noEmit && vite build",
+    "preview": "vite preview --host 127.0.0.1"
+  },
+  "dependencies": { "antdv-next": "1.5.3", "vue": "3.5.42" },
+  "devDependencies": {
+    "@vitejs/plugin-vue": "6.0.4",
+    "typescript": "5.9.3",
+    "vite": "7.3.1",
+    "vue-tsc": "3.3.13"
+  }
+}

package/skills/i3-ui-prototype/assets/frameworks/vue-antdv-next/starter/public/prototype-config.json

@@ -0,0 +1,21 @@
+{
+  "instanceId": "business-preview",
+  "storageNamespace": "prototype:business-preview",
+  "mockVersion": "business-v1",
+  "title": "业务原型",
+  "pages": [
+    {
+      "id": "business",
+      "title": "业务页面"
+    }
+  ],
+  "theme": {
+    "defaultTheme": "light",
+    "presets": [
+      "light",
+      "dark",
+      "fresh",
+      "tech"
+    ]
+  }
+}

package/skills/i3-ui-prototype/assets/frameworks/vue-antdv-next/starter/src/App.vue

@@ -0,0 +1,51 @@
+<script setup lang="ts">
+import { computed, onBeforeUnmount, ref, watch } from 'vue'
+import { Alert, ConfigProvider, Select, Tabs, TabPane, theme as antdTheme } from 'antdv-next'
+import zhCN from 'antdv-next/locale/zh_CN'
+import type { PrototypeConfig } from './config'
+import { THEME_IDS, THEME_PRESETS, loadThemePreference, safeThemeStorage, saveThemePreference, themeStorageKey } from './domain/theme'
+import type { ThemeId } from './domain/theme'
+const props = defineProps<{ config: PrototypeConfig }>()
+const storage = safeThemeStorage(() => window.localStorage)
+const key = themeStorageKey(props.config.storageNamespace)
+const selected = ref<ThemeId>(loadThemePreference(storage, key))
+const activePage = ref(props.config.pages[0]?.id)
+const warning = ref('')
+const options = THEME_IDS.map(value => ({ value, label: THEME_PRESETS[value].label }))
+const media = matchMedia('(prefers-reduced-motion: reduce)')
+const reduced = ref(media.matches)
+const motionChanged = (event: MediaQueryListEvent) => { reduced.value = event.matches }
+media.addEventListener('change', motionChanged)
+onBeforeUnmount(() => media.removeEventListener('change', motionChanged))
+const preset = computed(() => THEME_PRESETS[selected.value])
+const tokens = computed(() => ({
+  algorithm: preset.value.mode === 'dark' ? antdTheme.darkAlgorithm : antdTheme.defaultAlgorithm,
+  token: { colorPrimary: preset.value.primary, colorBgBase: preset.value.bg, colorBgContainer: preset.value.surface,
+    colorBgElevated: preset.value.surface, colorText: preset.value.text, colorTextSecondary: preset.value.muted,
+    colorBorder: preset.value.border, colorTextLightSolid: preset.value.onPrimary, motion: !reduced.value },
+}))
+function choose(value: unknown) {
+  if (typeof value !== 'string' || !THEME_IDS.includes(value as ThemeId)) return
+  selected.value = value as ThemeId
+  warning.value = saveThemePreference(storage, key, selected.value) ? '' : '主题偏好无法保存，本页仍可切换。'
+}
+watch(preset, value => {
+  document.documentElement.dataset.prototypeTheme = selected.value
+  document.documentElement.style.colorScheme = value.mode
+}, { immediate: true })
+</script>
+<template>
+  <ConfigProvider :locale="zhCN" :theme="tokens">
+    <div class="prototype-shell" :style="{ background: preset.bg, color: preset.text }">
+      <header><h1>{{ config.title }}</h1><div class="theme-picker"><label for="prototype-theme">主题</label><Select id="prototype-theme" aria-label="主题" :value="selected" :options="options" @change="choose" /></div></header>
+      <main :style="{ background: preset.surface, borderColor: preset.border }">
+        <Alert v-if="warning" type="warning" :title="warning" show-icon />
+        <Tabs v-model:active-key="activePage">
+          <TabPane v-for="page in config.pages" :key="page.id" :tab="page.title">
+            <section :aria-label="page.title"><h2>{{ page.title }}</h2><Alert type="warning" title="业务页面待实现" description="按固定需求、完整内容模板和通用能力清单实现此页，再进行交互验收。" show-icon /></section>
+          </TabPane>
+        </Tabs>
+      </main>
+    </div>
+  </ConfigProvider>
+</template>

package/skills/i3-ui-prototype/assets/frameworks/vue-antdv-next/starter/src/config.ts

@@ -0,0 +1,18 @@
+import { resolveThemeConfig } from './domain/theme'
+import type { ThemeBinding } from './domain/theme'
+export interface PrototypeConfig { instanceId: string; storageNamespace: string; mockVersion: string; title?: string; pages: { id: string; title: string }[]; theme?: ThemeBinding }
+export interface PrototypeMeta extends PrototypeConfig { candidateId: string }
+declare global { interface Window { __PROTOTYPE_META__: PrototypeMeta } }
+
+export async function loadConfig(): Promise<PrototypeConfig> {
+  const response = await fetch(`${import.meta.env.BASE_URL}prototype-config.json`, { cache: 'no-store' })
+  if (!response.ok) throw new Error('无法读取原型配置，请检查当前预览构建。')
+  const config: unknown = await response.json()
+  if (!config || typeof config !== 'object') throw new Error('原型配置无效。')
+  const value = config as Record<string, unknown>
+  for (const key of ['instanceId', 'storageNamespace', 'mockVersion']) {
+    if (typeof value[key] !== 'string' || !(value[key] as string).trim()) throw new Error(`原型配置缺少 ${key}。`)
+  }
+  resolveThemeConfig(value.theme)
+  return value as unknown as PrototypeConfig
+}

package/skills/i3-ui-prototype/assets/frameworks/vue-antdv-next/starter/src/domain/theme.ts

@@ -0,0 +1,25 @@
+export type ThemeId = 'light' | 'dark' | 'fresh' | 'tech'
+export interface ThemeBinding { defaultTheme: 'light'; presets: ThemeId[] }
+export interface ThemeStorage { getItem(key: string): string | null; setItem(key: string, value: string): void }
+export const THEME_IDS: ThemeId[] = ['light', 'dark', 'fresh', 'tech']
+export const THEME_PRESETS = {
+  light: { label: '明亮', mode: 'light', primary: '#155bc2', bg: '#f4f7fc', surface: '#ffffff', subtle: '#f8faff', text: '#172b45', muted: '#506174', border: '#b9c8da', accent: '#155bc2', onPrimary: '#ffffff', error: '#b4232c', success: '#166534' },
+  dark: { label: '暗黑', mode: 'dark', primary: '#8fb8ff', bg: '#15181d', surface: '#20242b', subtle: '#1b2028', text: '#edf1f7', muted: '#b2bece', border: '#667387', accent: '#a6c7ff', onPrimary: '#101c2c', error: '#ffb4ab', success: '#9bddad' },
+  fresh: { label: '清新', mode: 'light', primary: '#0c6a55', bg: '#edf8f4', surface: '#fbfffd', subtle: '#e6f4ed', text: '#173b31', muted: '#4c665c', border: '#a4c4b5', accent: '#0c6a55', onPrimary: '#ffffff', error: '#b4232c', success: '#166534' },
+  tech: { label: '科技', mode: 'dark', primary: '#55ddc6', bg: '#07131f', surface: '#102536', subtle: '#0b1c2b', text: '#e1f4f7', muted: '#a0bdca', border: '#5b8294', accent: '#55ddc6', onPrimary: '#071b20', error: '#ffb4ab', success: '#9bddad' },
+} as const
+export function resolveThemeConfig(value: unknown): ThemeBinding | null {
+  if (value === undefined) return null
+  const config=value as Partial<ThemeBinding> | null
+  if (!config || config.defaultTheme !== 'light' || !Array.isArray(config.presets) || config.presets.length !== 4 || new Set(config.presets).size !== 4 || !THEME_IDS.every(id => config.presets!.includes(id))) throw new Error('主题配置必须包含明亮、暗黑、清新、科技且默认明亮。')
+  return { defaultTheme: 'light', presets: [...THEME_IDS] }
+}
+export const themeStorageKey = (namespace: string) => `${namespace}:ui-theme:v1`
+export function safeThemeStorage(access: () => ThemeStorage): ThemeStorage | null { try { return access() } catch { return null } }
+export function loadThemePreference(storage: ThemeStorage | null, key: string): ThemeId {
+  try { const value=JSON.parse(storage?.getItem(key) ?? 'null'); if (value?.version===1 && THEME_IDS.includes(value.themeId)) return value.themeId } catch { /* Damaged or denied storage uses the explicit default. */ }
+  return 'light'
+}
+export function saveThemePreference(storage: ThemeStorage | null, key: string, themeId: ThemeId): boolean {
+  try { if (!storage) return false; storage.setItem(key,JSON.stringify({version:1,themeId})); return true } catch { return false }
+}

package/skills/i3-ui-prototype/assets/frameworks/vue-antdv-next/starter/src/main.ts

@@ -0,0 +1,18 @@
+import { createApp } from 'vue'
+import 'antdv-next/dist/reset.css'
+import App from './App.vue'
+import { loadConfig } from './config'
+import './style.css'
+
+loadConfig().then(config => {
+  window.__PROTOTYPE_META__ = { ...config, candidateId: import.meta.env.VITE_CANDIDATE_ID || 'unverified-development' }
+  createApp(App, { config }).mount('#app')
+}).catch(error => {
+  const container = document.querySelector('#app')!
+  const heading = document.createElement('h1')
+  heading.textContent = '原型无法启动'
+  const message = document.createElement('p')
+  message.textContent = error instanceof Error ? error.message : '配置读取失败。'
+  container.setAttribute('role', 'alert')
+  container.append(heading, message)
+})

package/skills/i3-ui-prototype/assets/frameworks/vue-antdv-next/starter/src/style.css

@@ -0,0 +1,13 @@
+* { box-sizing: border-box; }
+body { margin: 0; font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif; }
+.prototype-shell { min-height: 100dvh; padding: 24px; }
+header { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin: 0 auto 20px; max-width: 1440px; }
+h1 { margin: 0; font-size: 24px; }
+h2 { margin-top: 0; font-size: 20px; }
+.theme-picker { display: flex; align-items: center; gap: 8px; }
+.theme-picker .ant-select { min-width: 100px; }
+main { max-width: 1440px; margin: auto; padding: 20px; border: 1px solid; border-radius: 10px; }
+section { min-height: 240px; }
+:focus-visible { outline: 3px solid currentColor; outline-offset: 3px; }
+@media (max-width: 600px) { .prototype-shell { padding: 12px; } main { padding: 12px; } h1 { font-size: 20px; } }
+@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; } }

package/skills/i3-ui-prototype/assets/frameworks/vue-antdv-next/starter/tests/theme.test.ts

@@ -0,0 +1,26 @@
+import assert from 'node:assert/strict'
+import test from 'node:test'
+import { THEME_PRESETS, resolveThemeConfig, themeStorageKey, loadThemePreference, saveThemePreference, safeThemeStorage } from '../src/domain/theme.ts'
+
+const binding = { defaultTheme: 'light', presets: ['light', 'dark', 'fresh', 'tech'] }
+test('four named presets are explicit while an unbound instance stays legacy', () => {
+  assert.equal(resolveThemeConfig(undefined), null)
+  assert.deepEqual(resolveThemeConfig(binding), binding)
+  assert.deepEqual(Object.values(THEME_PRESETS).map(theme => theme.label), ['明亮', '暗黑', '清新', '科技'])
+  assert.deepEqual(Object.values(THEME_PRESETS).map(theme => theme.mode), ['light', 'dark', 'light', 'dark'])
+  for (const config of [{ ...binding, defaultTheme: 'dark' }, { ...binding, presets: [1,2,3,4] }, { ...binding, presets: ['light','dark','fresh','fresh'] }]) assert.throws(() => resolveThemeConfig(config))
+})
+test('theme preference is namespaced independently and damaged cache falls back', () => {
+  const values=new Map<string,string>(), storage={ getItem:(key:string)=>values.get(key)??null,setItem:(key:string,value:string)=>{values.set(key,value)} }
+  const a=themeStorageKey('instance-a'),b=themeStorageKey('instance-b')
+  assert.notEqual(a,b);assert.match(a,/:ui-theme:v1$/)
+  assert.equal(saveThemePreference(storage,a,'tech'),true)
+  assert.equal(loadThemePreference(storage,a),'tech');assert.equal(loadThemePreference(storage,b),'light')
+  for (const broken of ['{','null','{"version":1,"themeId":2}','{"version":2,"themeId":"tech"}','{"version":1,"themeId":"unknown"}']) { values.set(a,broken);assert.equal(loadThemePreference(storage,a),'light') }
+})
+test('denied storage never prevents local theme changes or returns a fake saved preference', () => {
+  const denied={getItem(){throw Error('denied')},setItem(){throw Error('denied')}}
+  assert.equal(safeThemeStorage(()=>{throw Error('getter denied')}),null)
+  assert.equal(loadThemePreference(denied,'key'),'light');assert.equal(loadThemePreference(null,'key'),'light')
+  assert.equal(saveThemePreference(denied,'key','dark'),false);assert.equal(saveThemePreference(null,'key','dark'),false)
+})

package/skills/i3-ui-prototype/assets/frameworks/vue-antdv-next/starter/tsconfig.json

@@ -0,0 +1,15 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "module": "ESNext",
+    "moduleResolution": "Bundler",
+    "strict": true,
+    "noEmit": true,
+    "skipLibCheck": true,
+    "lib": ["ES2022", "DOM", "DOM.Iterable"],
+    "types": ["vite/client"],
+    "allowImportingTsExtensions": true,
+    "verbatimModuleSyntax": true
+  },
+  "include": ["src/**/*.ts", "src/**/*.vue", "vite.config.ts"]
+}

package/skills/i3-ui-prototype/assets/frameworks/vue-antdv-next/starter/vite.config.ts

@@ -0,0 +1,4 @@
+import { defineConfig } from 'vite'
+import vue from '@vitejs/plugin-vue'
+
+export default defineConfig({ plugins: [vue()], base: './', build: { manifest: true } })