@orbit-work/ui 0.1.2-preview.0 → 0.1.2

package/src/components/domain/tasks/ScheduledTasksSpaceView/index.tsx

@@ -1,118 +0,0 @@
-import type { ReactNode } from "react"
-import { BeaconSpinner } from "../../../composite/BeaconSpinner"
-import { Plus } from "../../../composite/Icons"
-import { PageHead } from "../../../composite/PageHead"
-import { Button } from "../../../primitives"
-import { EmptyState } from "../../../primitives/EmptyState"
-import { InlineMessage } from "../../../primitives/InlineMessage"
-
-export interface ScheduledTasksSpaceViewProps {
-  /**
-   * 进行中的任务数。A3-B3 起不再进页头（原型只在说明句尾挂一段「N 个任务」总数），
-   * 属性保留兼容既有调用方；运行态由任务卡自己出。
-   */
-  activeCount?: number
-  totalCount: number
-  loading: boolean
-  error?: string | null
-  hasTasks: boolean
-  taskCards?: ReactNode
-  dialogs?: ReactNode
-  onCreate: () => void
-  onRetry: () => void
-}
-
-export function ScheduledTasksSpaceView({
-  totalCount,
-  loading,
-  error,
-  hasTasks,
-  taskCards,
-  dialogs,
-  onCreate,
-  onRetry,
-}: ScheduledTasksSpaceViewProps): React.ReactElement {
-  return (
-    <div className="page cron-space">
-      {/* A3-B3：页首换 composite/PageHead —— 眉标「自动化」／32px 大标题「定时任务」／说明句，
-          与插件、工作台两屏同一套三行页头（原型 template.dc.html L1731–1740）。
-          三处随之退役：
-          ① 40×40 的 `.desktop-page-head__icon` info-tint 彩色图标章（§4「彩色只作第二编码」，
-             页头标识不是状态，不该吃一枚 tint 面）；
-          ② 13px/600 的 `.ch-t` 小标题 —— 屏级标题归 --ow-font-display + 32px；
-          ③ 「· N 个进行中 · 共 N 个」的并列多段读数 —— 原型只在句尾挂一段 mono caption。
-          `activeCount` 不再进页头：进行中是卡上的运行态，不是屏级读数。 */}
-      <PageHead
-        eyebrow="自动化"
-        title="定时任务"
-        description="按计划自己跑起来的任务；每次运行都会开一段新会话。"
-        meta={`${totalCount} 个任务`}
-        actions={
-          <Button variant="primary" icon={<Plus />} onClick={onCreate}>
-            新建任务
-          </Button>
-        }
-      />
-
-      <div className="cron-scroll">
-        {/* §6 错误态一律 InlineMessage：人话一句 ＋ 折叠 mono 详情（技术原文归详情，
-            不再用 sans 直接把 {error} 摊在正文里）＋ 重试动作。 */}
-        {error && hasTasks && (
-          <div data-ow-part="error">
-            <InlineMessage
-              variant="error"
-              detail={error}
-              action={
-                <Button variant="secondary" size="sm" onClick={onRetry}>
-                  重试
-                </Button>
-              }
-            >
-              定时任务列表没刷新成功。
-            </InlineMessage>
-          </div>
-        )}
-        {loading && !hasTasks ? (
-          /* §6 载态：BeaconSpinner（<20px 小转子）＋ 一句 text-2 文字编码（§4 R1）。
-             原来是 .cron-empty > .ce-t 的「600 字重标题」老三件——W3 要退役的写法。 */
-          <div data-ow-part="loading" role="status" aria-live="polite" className="cron-loading">
-            <BeaconSpinner size={16} />
-            <span>正在加载定时任务…</span>
-          </div>
-        ) : error && !hasTasks ? (
-          <div data-ow-part="error" className="cron-error">
-            <InlineMessage
-              variant="error"
-              detail={error}
-              action={
-                <Button variant="secondary" onClick={onRetry}>
-                  重试
-                </Button>
-              }
-            >
-              定时任务没加载出来。
-            </InlineMessage>
-          </div>
-        ) : !hasTasks ? (
-          /* A5-B3：这是整栏空态，落 `size="page"` 一级形制——母题 52×32 ＋ 16/500 标题
-             ＋ 14/1.75 副句 ＋ 一枚 32 高的钮，版心 `56px auto 0 / max-width:440`
-             （原型 template.dc.html L1771–1780）。此前是 md 档单句，三件信息塌成一行。
-             §4：空态第二入口与页头「新建任务」是同一动作同一形制——primary 实底主钮，
-             与页头钮成对出现；CTA 不带图标，图标只留给页头钮（原型空态钮即无图标）。 */
-          <EmptyState
-            className="cron-empty"
-            size="page"
-            title="还没有定时任务"
-            message="把每天都要做的事交出去：到点它自己开一段会话，跑完通知你。"
-            actionLabel="新建任务"
-            actionVariant="primary"
-            onAction={onCreate}
-          />
-        ) : (
-          <div className="cron-grid">{taskCards}</div>
-        )}
-      </div>
-      {dialogs}
-    </div>
-  )
-}

package/src/components/domain/tasks/index.ts

@@ -1,4 +0,0 @@
-export * from "./ScheduledTaskCardView"
-export * from "./ScheduledTaskDeleteDialog"
-export * from "./ScheduledTaskDetailView"
-export * from "./ScheduledTasksSpaceView"

package/src/components/domain/theme/SkinManager.stories.tsx

@@ -1,43 +0,0 @@
-import type { Meta, StoryObj } from "@storybook/react"
-import { ThemeProvider } from "../../../theme/providers/ThemeProvider"
-import { SkinManager } from "./SkinManagerUI"
-
-const meta: Meta<typeof SkinManager> = {
-  title: "Theme/SkinManager",
-  component: SkinManager,
-  parameters: {
-    layout: "fullscreen",
-    docs: {
-      description: {
-        component: `
-皮肤管理器组件。提供完整的皮肤管理功能：
-
-**功能：**
-- 导入皮肤（从文件、URL、分享链接）
-- 试穿预览（在应用前查看效果）
-- 导出皮肤（下载为 .ow-skin.json 文件）
-- 分享皮肤（生成分享链接）
-- 管理自定义皮肤（删除、应用）
-- 主题切换（浅色/深色/跟随系统）
-
-**皮肤格式：**
-皮肤文件为 JSON 格式，包含颜色、字体、圆角等配置。支持 light/dark 两种模式。
-        `,
-      },
-    },
-  },
-  decorators: [
-    (Story) => (
-      <ThemeProvider>
-        <Story />
-      </ThemeProvider>
-    ),
-  ],
-}
-
-export default meta
-type Story = StoryObj<typeof SkinManager>
-
-export const Default: Story = {
-  name: "皮肤管理器",
-}

package/src/components/domain/theme/SkinManagerUI.tsx

@@ -1,382 +0,0 @@
-import { useCallback, useRef, useState } from "react"
-import type { OrbitworkSkin } from "../../../theme/core/skin"
-import { useTheme } from "../../../theme/providers/ThemeProvider"
-import {
-  exportSkin,
-  importSkin,
-  importSkinFromShareUrl,
-  importSkinFromUrl,
-  saveCustomSkins,
-  shareSkin,
-} from "../../../theme/utils/skinManager"
-import { Badge, Button, Card, Field, InlineMessage, SegmentedControl } from "../../primitives"
-
-/**
- * Skin Manager Component
- * Provides UI for importing, exporting, trying on, and managing skins
- */
-export function SkinManager() {
-  const {
-    theme,
-    setTheme,
-    skin,
-    setSkin,
-    builtinSkins,
-    customSkins,
-    setCustomSkins,
-    skins,
-    tryOnSkin,
-    tryOn,
-    applySkin,
-    cancelTryOn,
-    isTryingOn,
-  } = useTheme()
-
-  const [importUrl, setImportUrl] = useState("")
-  const [shareUrl, setShareUrl] = useState<string | null>(null)
-  const [error, setError] = useState<string | null>(null)
-  const [fileName, setFileName] = useState<string | null>(null)
-  const fileInputRef = useRef<HTMLInputElement>(null)
-
-  // Handle file import
-  const handleFileImport = useCallback(
-    async (event: React.ChangeEvent<HTMLInputElement>) => {
-      const file = event.target.files?.[0]
-      if (!file) return
-
-      setFileName(file.name)
-      setError(null)
-      const result = await importSkin(file)
-
-      if (result.error) {
-        setError(result.error)
-      } else if (result.skin) {
-        // Check for duplicate ID
-        const isDuplicate = skins.some((s) => s.id === result.skin!.id)
-        if (isDuplicate) {
-          setError(`皮肤 ID "${result.skin.id}" 已存在，请修改皮肤 ID 后重新导入`)
-          return
-        }
-
-        // Add to custom skins
-        const newCustomSkins = [...customSkins, result.skin]
-        setCustomSkins(newCustomSkins)
-        saveCustomSkins(newCustomSkins)
-
-        // Try on the imported skin
-        tryOn(result.skin)
-      }
-
-      // Reset file input
-      if (fileInputRef.current) {
-        fileInputRef.current.value = ""
-      }
-    },
-    [customSkins, setCustomSkins, skins, tryOn],
-  )
-
-  // Handle URL import (auto-detect http:// or orbitwork:// protocol)
-  const handleUrlImport = useCallback(async () => {
-    if (!importUrl.trim()) {
-      setError("请输入皮肤 URL")
-      return
-    }
-
-    setError(null)
-
-    // Auto-detect protocol and use appropriate import method
-    if (importUrl.startsWith("orbitwork://")) {
-      // Share URL (orbitwork:// protocol)
-      const result = importSkinFromShareUrl(importUrl)
-
-      if (result.error) {
-        setError(result.error)
-      } else if (result.skin) {
-        const isDuplicate = skins.some((s) => s.id === result.skin!.id)
-        if (isDuplicate) {
-          setError(`皮肤 ID "${result.skin.id}" 已存在`)
-          return
-        }
-
-        const newCustomSkins = [...customSkins, result.skin]
-        setCustomSkins(newCustomSkins)
-        saveCustomSkins(newCustomSkins)
-        tryOn(result.skin)
-        setImportUrl("")
-      }
-    } else {
-      // Regular URL (http:// or https://)
-      const result = await importSkinFromUrl(importUrl)
-
-      if (result.error) {
-        setError(result.error)
-      } else if (result.skin) {
-        const isDuplicate = skins.some((s) => s.id === result.skin!.id)
-        if (isDuplicate) {
-          setError(`皮肤 ID "${result.skin.id}" 已存在`)
-          return
-        }
-
-        const newCustomSkins = [...customSkins, result.skin]
-        setCustomSkins(newCustomSkins)
-        saveCustomSkins(newCustomSkins)
-        tryOn(result.skin)
-        setImportUrl("")
-      }
-    }
-  }, [importUrl, customSkins, setCustomSkins, skins, tryOn])
-
-  // Handle skin export
-  const handleExport = useCallback((skinToExport: OrbitworkSkin) => {
-    exportSkin(skinToExport)
-  }, [])
-
-  // Handle skin share
-  const handleShare = useCallback((skinToShare: OrbitworkSkin) => {
-    const url = shareSkin(skinToShare)
-    setShareUrl(url)
-  }, [])
-
-  // Handle skin deletion
-  const handleDelete = useCallback(
-    (skinToDelete: OrbitworkSkin) => {
-      if (!window.confirm(`确定删除皮肤 "${skinToDelete.name}" 吗？`)) return
-
-      const newCustomSkins = customSkins.filter((s) => s.id !== skinToDelete.id)
-      setCustomSkins(newCustomSkins)
-      saveCustomSkins(newCustomSkins)
-
-      // If the deleted skin is active, reset to default
-      if (skin?.id === skinToDelete.id) {
-        setSkin(null)
-      }
-    },
-    [customSkins, setCustomSkins, skin, setSkin],
-  )
-
-  const activeSkin = tryOnSkin ?? skin
-
-  return (
-    <div className="min-h-screen bg-ow-surface p-8">
-      <div className="max-w-6xl mx-auto">
-        {/* Header */}
-        <div className="mb-8">
-          <h1 className="text-ow-fs-title font-semibold text-ow-text mb-2">皮肤管理</h1>
-          <p className="text-ow-fs-body text-ow-text-3">导入、试穿、导出和分享自定义皮肤</p>
-        </div>
-
-        {/* Theme Toggle */}
-        <Card title="主题模式" className="mb-6">
-          {/* 选中态走 SegmentedControl（surface 提亮＋500 字重），不用 primary 实底染色 —— §4 无彩选中 */}
-          <SegmentedControl
-            aria-label="主题模式"
-            size="sm"
-            value={theme}
-            onChange={(v) => setTheme(v as typeof theme)}
-            options={[
-              { value: "light", label: "浅色" },
-              { value: "dark", label: "深色" },
-              { value: "system", label: "跟随系统" },
-            ]}
-          />
-        </Card>
-
-        {/* Try-On Actions */}
-        {isTryingOn && (
-          /* §4 R2：试穿中的强调框原来是 --ow-primary 边（暗档＝荧黄），换中性描边 ——
-             「正在试穿谁」由卡标题与下面那行文字承担，不靠极色喊。 */
-          <Card title="试穿预览" className="mb-6 border border-ow-border-strong">
-            <div className="space-y-3">
-              <p className="text-ow-fs-body text-ow-text-2">
-                正在试穿: <strong>{tryOnSkin?.name}</strong>
-              </p>
-              {/* §4 单极：全屏唯一 primary（浅=藏蓝／暗=荧黄）就是这一处「应用此皮肤」，
-                  卡内试穿/应用/导入一律降为 secondary·ghost。 */}
-              <div className="flex gap-2">
-                <Button variant="primary" size="md" onClick={applySkin}>
-                  应用此皮肤
-                </Button>
-                <Button variant="secondary" size="md" onClick={cancelTryOn}>
-                  取消试穿
-                </Button>
-              </div>
-            </div>
-          </Card>
-        )}
-
-        {/* Import */}
-        <Card title="导入皮肤" className="mb-6">
-          <div className="space-y-4">
-            {/* File Import */}
-            <div>
-              <label className="text-ow-fs-body font-medium text-ow-text mb-2 block">从文件导入</label>
-              {/* 浏览器原生的 file 控件（「Choose File / No file chosen」）高度与配色都不受
-                  DS 管，与同页 Button 原语不齐平；`file:` 伪类只能刷按钮那一半。改成
-                  「隐藏 input ＋ Button 原语触发」，控件语法与全页一致。 */}
-              <input
-                ref={fileInputRef}
-                type="file"
-                accept=".ow-skin.json"
-                onChange={handleFileImport}
-                className="hidden"
-              />
-              <div className="flex items-center gap-2">
-                <Button variant="secondary" size="md" onClick={() => fileInputRef.current?.click()}>
-                  选择文件
-                </Button>
-                <span className="text-ow-fs-caption text-ow-text-3">{fileName ?? "尚未选择文件"}</span>
-              </div>
-            </div>
-
-            {/* URL Import */}
-            <div>
-              <label className="text-ow-fs-body font-medium text-ow-text mb-2 block">从 URL 导入</label>
-              <p className="text-ow-fs-caption text-ow-text-3 mb-2">支持 HTTP/HTTPS URL 或 orbitwork:// 分享链接</p>
-              <div className="flex gap-2">
-                <Field
-                  value={importUrl}
-                  onChange={setImportUrl}
-                  placeholder="https://example.com/skin.json 或 orbitwork://skin/..."
-                  className="flex-1"
-                />
-                <Button variant="secondary" size="md" onClick={handleUrlImport}>
-                  导入
-                </Button>
-              </div>
-            </div>
-
-            {/* §6 错误态归 primitives/InlineMessage（error tint 三件套：tint 底 ＋ tint 边 ＋
-                on-tint 字）。原来是 --ow-error-bg ＋ --ow-error 的手搓面——那组是 V1 的
-                alpha 叠色族，去痕轮已点名要退役。 */}
-            {error && <InlineMessage variant="error">{error}</InlineMessage>}
-          </div>
-        </Card>
-
-        {/* Share URL */}
-        {shareUrl && (
-          <Card title="分享链接" className="mb-6">
-            <div className="space-y-3">
-              <p className="text-ow-fs-caption text-ow-text-3">
-                将此链接分享给其他用户，他们可以通过"导入分享链接"按钮导入皮肤
-              </p>
-              <div className="p-3 bg-ow-surface-2 [border-radius:var(--ow-radius-control)] break-all font-mono text-ow-fs-caption text-ow-text-2">
-                {shareUrl}
-              </div>
-              <div className="flex gap-2">
-                <Button
-                  variant="secondary"
-                  size="sm"
-                  onClick={() => {
-                    navigator.clipboard.writeText(shareUrl)
-                  }}
-                >
-                  复制链接
-                </Button>
-                <Button variant="ghost" size="sm" onClick={() => setShareUrl(null)}>
-                  关闭
-                </Button>
-              </div>
-            </div>
-          </Card>
-        )}
-
-        {/* Built-in Skins */}
-        <Card title="内置皮肤" className="mb-6">
-          <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
-            {builtinSkins.map((s) => (
-              <SkinCard
-                key={s.id}
-                skin={s}
-                isActive={activeSkin?.id === s.id}
-                onTryOn={() => tryOn(s)}
-                onApply={() => setSkin(s)}
-                onExport={() => handleExport(s)}
-                onShare={() => handleShare(s)}
-              />
-            ))}
-          </div>
-        </Card>
-
-        {/* Custom Skins */}
-        {customSkins.length > 0 && (
-          <Card title="自定义皮肤" className="mb-6">
-            <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
-              {customSkins.map((s) => (
-                <SkinCard
-                  key={s.id}
-                  skin={s}
-                  isActive={activeSkin?.id === s.id}
-                  onTryOn={() => tryOn(s)}
-                  onApply={() => setSkin(s)}
-                  onExport={() => handleExport(s)}
-                  onShare={() => handleShare(s)}
-                  onDelete={() => handleDelete(s)}
-                />
-              ))}
-            </div>
-          </Card>
-        )}
-      </div>
-    </div>
-  )
-}
-
-type SkinCardProps = {
-  skin: OrbitworkSkin
-  isActive: boolean
-  onTryOn: () => void
-  onApply: () => void
-  onExport: () => void
-  onShare: () => void
-  onDelete?: () => void
-}
-
-function SkinCard({ skin, isActive, onTryOn, onApply, onExport, onShare, onDelete }: SkinCardProps) {
-  return (
-    <div
-      /* §6 无彩选中：选中态走 --ow-current-bg 填充 ＋ 常规 1px --ow-border-strong 描边，
-         不用 --ow-primary 边（暗档 primary 就是荧黄，一张卡选中就白占一处行动极），
-         也不用 border-2 加粗（描边配重不是选中语法）。R1 双编码：填充之外还有右上角
-         「当前」Badge 的文字编码。 */
-      /* 卡骨架收口口径：容器 14（p-3.5，原 p-4＝16）· 1px --ow-border（原 border-strong）·
-         r12（--ow-radius-card）· 零影。 */
-      className={`p-3.5 border border-ow-border [border-radius:var(--ow-radius-card)] ${isActive ? "bg-[var(--ow-current-bg)]" : "bg-ow-bg"}`}
-    >
-      <div className="mb-3">
-        <div className="flex items-center justify-between mb-1">
-          <h3 className="text-ow-fs-body font-semibold text-ow-text">{skin.name}</h3>
-          {isActive && (
-            <Badge variant="success" dot>
-              当前
-            </Badge>
-          )}
-        </div>
-        {skin.description && <p className="text-ow-fs-caption text-ow-text-3 line-clamp-2">{skin.description}</p>}
-      </div>
-
-      <div className="flex flex-wrap gap-2">
-        {!isActive && (
-          <Button variant="secondary" size="sm" onClick={onTryOn}>
-            试穿
-          </Button>
-        )}
-        {!isActive && (
-          <Button variant="ghost" size="sm" onClick={onApply}>
-            应用
-          </Button>
-        )}
-        <Button variant="ghost" size="sm" onClick={onExport}>
-          导出
-        </Button>
-        <Button variant="ghost" size="sm" onClick={onShare}>
-          分享
-        </Button>
-        {onDelete && (
-          <Button variant="danger" size="sm" onClick={onDelete}>
-            删除
-          </Button>
-        )}
-      </div>
-    </div>
-  )
-}

package/src/components/domain/theme/ThemeDemo.stories.tsx

@@ -1,12 +0,0 @@
-import type { Meta, StoryObj } from "@storybook/react"
-import { ThemeDemo } from "./ThemeDemo"
-
-const meta: Meta<typeof ThemeDemo> = {
-  title: "Theme/ThemeDemo",
-  component: ThemeDemo,
-}
-
-export default meta
-type Story = StoryObj<typeof ThemeDemo>
-
-export const Default: Story = {}