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

package/src/components/domain/desktop/DesktopSkillsPageView/DesktopSkillsPageView.stories.tsx

@@ -1,230 +0,0 @@
-import type { Meta, StoryObj } from "@storybook/react"
-import { DesktopSkillsPageView } from "./index"
-import type { DesktopSkillsCategory } from "./index"
-
-const meta = {
-  title: "Desktop/DesktopSkillsPageView",
-  component: DesktopSkillsPageView,
-  parameters: {
-    layout: "fullscreen",
-  },
-} satisfies Meta<typeof DesktopSkillsPageView>
-
-export default meta
-type Story = StoryObj<typeof meta>
-
-const mockCategories: DesktopSkillsCategory[] = [
-  { id: null, label: "全部" },
-  { id: "productivity", label: "生产力" },
-  { id: "development", label: "开发" },
-  { id: "data", label: "数据分析" },
-  { id: "design", label: "设计" },
-]
-
-export const AgentsSection: Story = {
-  args: {
-    section: "agents",
-    onSectionChange: (section) => console.log("Section:", section),
-    query: "",
-    onQueryChange: (query) => console.log("Query:", query),
-    searchPlaceholder: "搜索智能体",
-    actionLabel: "创建智能体",
-    onAction: () => console.log("Create agent"),
-    categories: mockCategories,
-    activeCategoryId: null,
-    onCategoryChange: (id) => console.log("Category:", id),
-    currentPage: 1,
-    totalItems: 48,
-    pageSize: 24,
-    onPageChange: (page) => console.log("Page:", page),
-    children: (
-      <div style={{ padding: 40, minHeight: 400 }}>
-        <h2>智能体列表</h2>
-        <p>24 个智能体</p>
-      </div>
-    ),
-  },
-}
-
-export const MarketSection: Story = {
-  args: {
-    section: "market",
-    onSectionChange: (section) => console.log("Section:", section),
-    query: "",
-    onQueryChange: (query) => console.log("Query:", query),
-    searchPlaceholder: "搜索技能",
-    categories: mockCategories,
-    activeCategoryId: "productivity",
-    onCategoryChange: (id) => console.log("Category:", id),
-    currentPage: 1,
-    totalItems: 120,
-    pageSize: 24,
-    onPageChange: (page) => console.log("Page:", page),
-    children: (
-      <div style={{ padding: 40, minHeight: 400 }}>
-        <h2>技能市场</h2>
-        <p>生产力分类</p>
-      </div>
-    ),
-  },
-}
-
-export const ConnectorsSection: Story = {
-  args: {
-    section: "connectors",
-    onSectionChange: (section) => console.log("Section:", section),
-    query: "",
-    onQueryChange: (query) => console.log("Query:", query),
-    searchPlaceholder: "搜索连接器",
-    actionLabel: "添加连接器",
-    onAction: () => console.log("Add connector"),
-    categories: mockCategories,
-    activeCategoryId: null,
-    onCategoryChange: (id) => console.log("Category:", id),
-    installedOnly: false,
-    onInstalledOnlyChange: (value) => console.log("Installed only:", value),
-    currentPage: 1,
-    totalItems: 36,
-    pageSize: 24,
-    onPageChange: (page) => console.log("Page:", page),
-    children: (
-      <div style={{ padding: 40, minHeight: 400 }}>
-        <h2>连接器列表</h2>
-        <p>36 个连接器</p>
-      </div>
-    ),
-  },
-}
-
-export const WithSearch: Story = {
-  args: {
-    section: "market",
-    onSectionChange: (section) => console.log("Section:", section),
-    query: "database",
-    onQueryChange: (query) => console.log("Query:", query),
-    searchPlaceholder: "搜索技能",
-    categories: mockCategories,
-    activeCategoryId: null,
-    onCategoryChange: (id) => console.log("Category:", id),
-    currentPage: 1,
-    totalItems: 8,
-    pageSize: 24,
-    onPageChange: (page) => console.log("Page:", page),
-    children: (
-      <div style={{ padding: 40, minHeight: 400 }}>
-        <h2>搜索结果</h2>
-        <p>找到 8 个与 "database" 相关的技能</p>
-      </div>
-    ),
-  },
-}
-
-export const InstalledOnly: Story = {
-  args: {
-    section: "connectors",
-    onSectionChange: (section) => console.log("Section:", section),
-    query: "",
-    onQueryChange: (query) => console.log("Query:", query),
-    searchPlaceholder: "搜索连接器",
-    categories: mockCategories,
-    activeCategoryId: null,
-    onCategoryChange: (id) => console.log("Category:", id),
-    installedOnly: true,
-    onInstalledOnlyChange: (value) => console.log("Installed only:", value),
-    currentPage: 1,
-    totalItems: 12,
-    pageSize: 24,
-    onPageChange: (page) => console.log("Page:", page),
-    children: (
-      <div style={{ padding: 40, minHeight: 400 }}>
-        <h2>已安装的连接器</h2>
-        <p>12 个已安装</p>
-      </div>
-    ),
-  },
-}
-
-export const WithNotice: Story = {
-  args: {
-    section: "market",
-    onSectionChange: (section) => console.log("Section:", section),
-    query: "",
-    onQueryChange: (query) => console.log("Query:", query),
-    searchPlaceholder: "搜索技能",
-    categories: mockCategories,
-    activeCategoryId: null,
-    onCategoryChange: (id) => console.log("Category:", id),
-    currentPage: 1,
-    totalItems: 48,
-    pageSize: 24,
-    onPageChange: (page) => console.log("Page:", page),
-    // notice 只给人话一句：立面（warning tint ＋ 1px 边 ＋ 0 影 ＋ 语义图标）由 Banner 承担；
-    // 旧写法是 story 自己手搓 div ＋ emoji ＋ 已失效的 --bg-info，与 §6 告知条语法冲突。
-    notice: "刷新失败，正在显示上次加载的目录：network timeout",
-    children: (
-      <div style={{ padding: 40, minHeight: 400 }}>
-        <h2>技能市场</h2>
-      </div>
-    ),
-  },
-}
-
-export const MultiPage: Story = {
-  args: {
-    section: "market",
-    onSectionChange: (section) => console.log("Section:", section),
-    query: "",
-    onQueryChange: (query) => console.log("Query:", query),
-    searchPlaceholder: "搜索技能",
-    categories: mockCategories,
-    activeCategoryId: null,
-    onCategoryChange: (id) => console.log("Category:", id),
-    currentPage: 2,
-    totalItems: 240,
-    pageSize: 24,
-    onPageChange: (page) => console.log("Page:", page),
-    children: (
-      <div style={{ padding: 40, minHeight: 400 }}>
-        <h2>技能市场 - 第 2 页</h2>
-        <p>共 240 个技能，每页 24 个</p>
-      </div>
-    ),
-  },
-}
-
-/**
- * 载入态（L3-3-7）：`loading` 槽出目录卡骨架网格，`children` 不渲染。
- * 这一张替掉的是 B3 之后就成了死 story 的 `SpaceLoading`——那张只是 `spaceLoading: true`
- * ＋ 一句手写的「加载中...」，而「个人空间」下拉整件已在 A3-B4 撤走，件里零消费方，
- * 渲出来与 MarketSection 一模一样，演的是一个不存在的加载态。
- */
-export const Loading: Story = {
-  args: {
-    section: "market",
-    onSectionChange: (section) => console.log("Section:", section),
-    query: "",
-    onQueryChange: (query) => console.log("Query:", query),
-    searchPlaceholder: "搜索技能",
-    actionLabel: "添加技能",
-    onAction: () => console.log("Add skill"),
-    categories: mockCategories,
-    activeCategoryId: null,
-    onCategoryChange: (id) => console.log("Category:", id),
-    currentPage: 1,
-    totalItems: 0,
-    pageSize: 24,
-    onPageChange: (page) => console.log("Page:", page),
-    loading: true,
-  },
-}
-
-/** 错误态：件内 `InlineMessage error` ＋「重试」，与载入态同一张网格。 */
-export const LoadFailed: Story = {
-  args: {
-    ...Loading.args,
-    loading: false,
-    error: "目录没能取回来，检查一下网络再试。",
-    errorDetail: "GET /api/skills → 503 Service Unavailable",
-    onRetry: () => console.log("retry"),
-  },
-}

package/src/components/domain/desktop/DesktopSkillsPageView/DesktopSkillsPageViewSource.test.mjs

@@ -1,149 +0,0 @@
-import assert from "node:assert/strict"
-import { readFileSync } from "node:fs"
-import { readFile } from "node:fs/promises"
-import test from "node:test"
-
-const source = await readFile(new URL("./index.tsx", import.meta.url), "utf8")
-const styles = await readFile(new URL("../../../../../styles/desktop-surfaces.css", import.meta.url), "utf8")
-/** 只剩声明的样式表（注释剥掉）：退役类名在注释里仍会被提到（那是变更记录），
-    「这条规则还在不在」只能对着声明问。 */
-const decls = styles.replace(/\/\*[\s\S]*?\*\//g, "")
-
-// ── A3-B3 页头接入（原型 template.dc.html L1617–1660） ──────────────────────
-// 页首整块从「Tabs 直接当页头」换成 composite/PageHead 的三行页头；本文件里
-// W2 那批钉 .plaza__head / .plaza__sections / .plaza__search-* 的断言随之改口径：
-// 那些规则已整族退役，断言从「存在且长这样」翻成「不复存在，且改由 PageHead 承担」。
-
-test("catalog header is composite/PageHead: eyebrow / display title / description", () => {
-  assert.match(source, /import \{ PageHead \} from ["']\.\.\/\.\.\/\.\.\/composite\/PageHead["']/)
-  assert.match(source, /<PageHead\s+eyebrow="工具"\s+title="插件"/)
-  assert.match(source, /description="专家、技能与连接器都在这里安装与管理；也可以添加自己的。"/)
-  // 页首不再自绘任何头带类名
-  assert.doesNotMatch(source, /className="plaza__head"/)
-  assert.doesNotMatch(source, /className="plaza__sections"/)
-})
-
-test("catalog header places its primary action after search", () => {
-  assert.match(source, /actionLabel\?: ReactNode/)
-  assert.match(source, /onAction\?: \(\) => void/)
-  // search 槽在 actions 槽之前——PageHead 右上按传入顺序排（搜索 → 主按钮）
-  assert.match(source, /search=\{<SearchInput[\s\S]*?actions=\{[\s\S]*?<Button variant="primary"/)
-  assert.match(source, /icon=\{<Plus \/>\}/)
-})
-
-test("A3-B4：归属维度是一枚 SegmentedControl 线框档，「已安装」Switch 与手搓分段器都退役", () => {
-  assert.match(source, /installedOnly\?: boolean/)
-  assert.match(source, /onInstalledOnlyChange\?: \(installedOnly: boolean\) => void/)
-  // Switch 整件退场（原型 L1654–1658 那个位置是分段器）
-  assert.doesNotMatch(source, /import \{ Switch \} from/)
-  assert.doesNotMatch(source, /plaza__installed-switch/)
-  assert.doesNotMatch(decls, /\.plaza__installed-switch/)
-  // 分段器归原语：radiogroup 语义 ＋ ←→ 换选由 SegmentedControl 给，页面层零 CSS。
-  assert.match(source, /import \{ SegmentedControl \} from ["']\.\.\/\.\.\/\.\.\/primitives\/SegmentedControl["']/)
-  assert.match(source, /className="plaza__cats-scope"/)
-  assert.match(source, /<SegmentedControl\s+variant="outline"\s+size="sm"/)
-  assert.match(
-    source,
-    /const SCOPE_ITEMS[\s\S]*\{ value: "all", label: "市场" \}[\s\S]*\{ value: "mine", label: "我的" \}/,
-  )
-  assert.match(source, /const scope: "all" \| "mine" = installedOnly \? "mine" : "all"/)
-  assert.match(source, /onChange=\{\(value\) => onInstalledOnlyChange\(value === "mine"\)\}/)
-  assert.doesNotMatch(source, /installedCount/)
-  assert.doesNotMatch(source, /plaza__current-count/)
-  assert.match(styles, /\.plaza__cats-main \{[^}]*flex: 1;/s)
-  assert.match(styles, /\.plaza__cats-scope \{[^}]*margin-left: auto;/s)
-  assert.doesNotMatch(styles, /\.plaza__current-count/)
-  // B3 那版页面层手搓的分段器三条 CSS 整族退役（形已在原语里）
-  assert.doesNotMatch(decls, /\.plaza__scope/)
-})
-
-test("catalog categories keep the standard page gutter", () => {
-  // A3-B3：分类行落在页头之下（原型 L1649 `padding:14px 0 0`），横向沟槽仍是 28，
-  // 下内距归零——首行卡的呼吸由 .plaza__grid 的 padding-top:20 给，不再叠两份。
-  assert.match(styles, /\.plaza__filters \{[^}]*padding: 14px 28px 0;[^}]*\}/s)
-  assert.match(styles, /\.plaza__cats \{[^}]*padding:\s*0\s+28px\s+0;[^}]*\}/s)
-})
-
-test("category and installation scope are independent filter dimensions", () => {
-  // 合并记：origin/main 把分类行迁成 `Tabs`，本分支迁成 `primitives/Chip` 的筛选档
-  // （同屏页签带已归 PageHead，分类是筛选不是内容分段 —— 见 index.tsx 该处注释）。
-  // 断言回到与两种形态都无关的那一句：分类只调 onCategoryChange，不顺手重置归属维度。
-  assert.match(source, /onClick=\{\(\) => onCategoryChange\(category\.id\)\}/)
-  assert.doesNotMatch(source, /onClick=\{\(\) => \{ onInstalledOnlyChange\?\.\(false\)/)
-})
-
-test("A3-B4：「个人空间」下拉整件撤走，兼容属性留成 @deprecated 槽", () => {
-  // 裁决：筛选行右端只留「全部 / 我的」一枚分段器 —— 下拉与分段器都留这一行太挤。
-  assert.doesNotMatch(source, /<Select/)
-  assert.doesNotMatch(source, /className="plaza__space-select"/)
-  assert.doesNotMatch(decls, /\.plaza__space-select/)
-  // apps/desktop 仍在传这四件，属性保留但不再渲染（空间切换要换个落点由研发定）
-  assert.match(source, /@deprecated A3-B4[\s\S]*spaces\?: SelectOption\[\]/)
-  assert.match(source, /activeSpaceId\?: string/)
-  assert.match(source, /onSpaceChange\?: \(spaceId: string\) => void/)
-})
-
-test("catalog owns the refresh notice and client pagination", () => {
-  assert.match(source, /<Banner className="plaza__notice" variant="warning">/)
-  assert.match(source, /<Pagination\s+className="plaza__pagination"/)
-  assert.match(styles, /\.plaza__filters \{[^}]*display: flex;/s)
-})
-
-// ── W2 页首重铸（DS2 屏级判断表） ───────────────────────────────────────────
-
-test("A3-B3：.plaza__head 头带整族退役，页首归 PageHead 的 24 上留白", () => {
-  // 上留白 48 → 24（窗口带是内容区之外的独立一行，原型 L657/L1618），由 PageHead 的 pt-6 给。
-  assert.doesNotMatch(decls, /\.plaza__head/)
-  assert.doesNotMatch(decls, /\.plaza__sections/)
-  assert.doesNotMatch(decls, /\.plaza__search-group/)
-  assert.doesNotMatch(decls, /\.plaza__search-right/)
-  // 窗口拖拽带下的 no-drag 保护改按 data-slot="page-head" 认（三屏页头共用）。
-  assert.match(styles, /\[data-slot="page-head"\] button,/)
-})
-
-test("分区页签下沉进 PageHead 的页签带，文案「智能体 → 专家」", () => {
-  // 页签不再由本件直接渲染 Tabs：tabs/activeTabKey/onTabChange 三个槽交给 PageHead，
-  // 36 高专档与通栏 1px 基线在那件里。窄幅逐字竖排的旧补丁随 .plaza__sections 一起退役
-  // ——页签带现在独占一行，不再与搜索组抢同一排。
-  assert.doesNotMatch(source, /import \{ Tabs \}/)
-  assert.match(source, /tabs=\{SECTION_ITEMS\}\s+activeTabKey=\{section\}/)
-  assert.match(source, /\{ key: "agents", label: "专家" \}/)
-  assert.doesNotMatch(source, /label: "智能体"/)
-})
-
-test("catalog search rides the Field contract — the hand-rolled V1 search shell is gone", () => {
-  assert.match(source, /import \{ SearchInput \} from ["']\.\.\/\.\.\/\.\.\/composite\/SearchInput["']/)
-  assert.doesNotMatch(styles, /\.plaza__search \{/)
-  assert.doesNotMatch(styles, /\.plaza__search:focus-within/)
-  assert.doesNotMatch(styles, /\.plaza__search input \{/)
-  // 宽度归 PageHead（三屏同一个 216），页面层不再给搜索定宽
-  assert.match(
-    source,
-    /search=\{<SearchInput value=\{query\} onChange=\{onQueryChange\} placeholder=\{searchPlaceholder\} \/>\}/,
-  )
-})
-
-test("A3-B4：分类 chip 走 primitives/Chip 筛选档 —— 未选中也带 1px 边，选中＝current-bg ＋ 500", () => {
-  assert.match(source, /import \{ Button, Chip \} from ["']\.\.\/\.\.\/\.\.\/primitives["']/)
-  assert.match(source, /<Chip[\s\S]{0,220}shape="square"[\s\S]{0,120}selected=\{activeCategoryId === category\.id\}/)
-  assert.match(source, /onClick=\{\(\) => onCategoryChange\(category\.id\)\}/)
-  // 形/高/字号/内距全归原语，页面层最后一条 .plaza__cat 内距覆盖退役
-  assert.doesNotMatch(source, /className="plaza__cat"/)
-  assert.doesNotMatch(decls, /\.plaza__cat \{/)
-  assert.doesNotMatch(source, /variant=\{activeCategoryId === category\.id \? "secondary" : "ghost"\}/)
-  // 筛选档口径在 Chip 本体里：未选透明面 ＋ --ow-border，选中 --ow-current-bg ＋ 500
-  const chipSource = readFileSync(new URL("../../../primitives/Chip/index.tsx", import.meta.url), "utf8")
-  assert.match(chipSource, /selected\?: boolean/)
-  assert.match(chipSource, /bg-\[var\(--ow-current-bg\)\] border-\[color:var\(--ow-border\)\] text-ow-text font-medium/)
-  assert.match(chipSource, /bg-transparent border-\[color:var\(--ow-border\)\] text-ow-text font-normal/)
-})
-
-test("catalog notice is a Banner surface, not a hand-mixed warning strip", () => {
-  assert.match(source, /import \{ Banner \} from ["']\.\.\/\.\.\/\.\.\/composite\/Banner["']/)
-  // 页面层只留定位与沟槽；tint 三件套 ＋ 1px 边 ＋ 0 影由 Banner 承担。
-  assert.match(
-    styles,
-    /\.plaza__notice \{\s*flex-shrink: 0;\s*width: auto;\s*margin: 0 28px var\(--ow-space-3, 12px\);\s*\}/,
-  )
-  assert.doesNotMatch(styles, /\.plaza__notice \{[^}]*(?:background|box-shadow|border-radius)/s)
-})

package/src/components/domain/desktop/DesktopSkillsPageView/index.tsx

@@ -1,235 +0,0 @@
-import type { ReactNode } from "react"
-import { Banner } from "../../../composite/Banner"
-import { Plus } from "../../../composite/Icons"
-import { PageHead } from "../../../composite/PageHead"
-import { SearchInput } from "../../../composite/SearchInput"
-import { Button, Chip } from "../../../primitives"
-import { Pagination } from "../../../primitives/Pagination"
-import { SegmentedControl } from "../../../primitives/SegmentedControl"
-import type { SelectOption } from "../../../primitives/Select"
-import { DesktopCatalogGridView } from "../DesktopCatalogView"
-
-export type DesktopSkillsSection = "agents" | "market" | "connectors"
-
-export interface DesktopSkillsCategory {
-  id: string | null
-  label: string
-}
-
-export interface DesktopSkillsPageViewProps {
-  section: DesktopSkillsSection
-  onSectionChange: (section: DesktopSkillsSection) => void
-  query: string
-  onQueryChange: (query: string) => void
-  searchPlaceholder: string
-  /** @deprecated A3-B3：搜索归 PageHead 右上槽统一锁 216 宽，页面层不再传类名。 */
-  searchClassName?: string
-  /** @deprecated A3-B3：页头搜索组已由 PageHead 承担，属性保留兼容调用方。 */
-  searchGroupClassName?: string
-  actionLabel?: ReactNode
-  onAction?: () => void
-  categories: DesktopSkillsCategory[]
-  activeCategoryId: string | null
-  onCategoryChange: (categoryId: string | null) => void
-  installedOnly?: boolean
-  onInstalledOnlyChange?: (installedOnly: boolean) => void
-  /** @deprecated A3-B4：筛选行右端只留「市场 / 我的」一枚分段器，「个人空间」下拉退役（裁决：两件都留这一行太挤）。宿主仍可传，本件不再渲染；空间切换要换个落点由研发定。 */
-  spaces?: SelectOption[]
-  /** @deprecated A3-B4：同上，空间下拉已从筛选行撤走。 */
-  activeSpaceId?: string
-  /** @deprecated A3-B4：同上。 */
-  onSpaceChange?: (spaceId: string) => void
-  /** @deprecated A3-B4：同上。 */
-  spaceLoading?: boolean
-  currentPage: number
-  totalItems: number
-  pageSize?: number
-  onPageChange: (page: number) => void
-  notice?: ReactNode
-  /**
-   * 载入态（L3-3-7）：出目录卡骨架网格，`children` 不渲染。
-   * 三页签的骨架/空态/错误原来在宿主两条路上各拼一套（`SkillsCenter` 一套、`ConnectorModal`
-   * 一套），「同形」于是只统一了满态。三槽收进件里之后，三页签连状态态也是同一张网格。
-   */
-  loading?: boolean
-  loadingCount?: number
-  /** 错误态：人话一句（优先级高于 loading）。 */
-  error?: ReactNode
-  /** 错误技术详情：mono ≤2 行。 */
-  errorDetail?: string
-  onRetry?: () => void
-  /** 空态节点（通常是 `CatalogEmptyState grid`）；给了就在网格里跨列渲染。 */
-  emptyState?: ReactNode
-  /** 满态内容（通常是 `.plaza__grid` ＋ 一排卡）；三态槽任一成立时不渲染。 */
-  children?: ReactNode
-  overlay?: ReactNode
-}
-
-/**
- * A3-B3：分区页签文案「智能体 → 专家」（原型 P_TABS L3524）。key 仍是 `agents`，
- * 路由 id 与埋点键不动，只改可见字。
- */
-const SECTION_ITEMS = [
-  { key: "agents", label: "专家" },
-  { key: "market", label: "技能" },
-  { key: "connectors", label: "连接器" },
-]
-
-/** 筛选行右端的归属分段器（原型 L1654–1658）：只有两格，选中＝--ow-current-bg ＋ 500。 */
-const SCOPE_ITEMS = [
-  { value: "all", label: "市场" },
-  { value: "mine", label: "我的" },
-]
-
-/**
- * Stable Desktop catalog layout shared by the real app and documentation mocks.
- *
- * DS2 A3-B3 页头接入（原型 template.dc.html L1617–1660）：
- * - 页首整块换 `composite/PageHead`：眉标「工具」／32px 大标题「插件」／说明句 L1623，
- *   右上是 216 宽搜索 ＋ 主按钮；上留白由 `--ow-titlebar-h`(48) 收到 24（窗口带是内容区
- *   之外的独立一行，页头不再替它让位）。原来的 `.plaza__head`（Tabs 直接当页头）整块退役。
- * - 分区页签下沉进 PageHead 的页签带（`Tabs size="lg"` 36 高 ＋ 通栏 1px 基线），
- *   页签文案「智能体 → 专家」。
- * - `.plaza__filters` 分类行留在页头之下（原型 L1649 的 `padding:14px 0 0`，本件写成
- *   `14px 28px 0`，28 沟槽与页头对齐）。
- *
- * A3-B4 筛选行三件（原型 L1649–1659）：
- * - 分类 chip 走 `primitives/Chip` 筛选档（`shape="square"` ＋ `selected`）：未选中也带
- *   常驻 1px `--ow-border`、选中＝`--ow-current-bg` ＋ 500；原来的 `Button ghost/secondary`
- *   未选没有边、选中借按钮面，一排分类看着像一排随时会触发动作的钮。
- * - 右端归属分段器走 `primitives/SegmentedControl variant="outline"`（B3 手搓的
- *   `.plaza__scope` 退役）：「我的」一期接在 `installedOnly` 上（＝我装了的），owner 维度
- *   要目录接口支持，接口到位后只换取值、形不用再动。
- * - 「个人空间」Select **整件撤走**（裁决：右端只留分段器一枚，两件都留这一行太挤）。
- *   `spaces` / `activeSpaceId` / `onSpaceChange` / `spaceLoading` 四个属性保留成
- *   `@deprecated` 兼容槽（apps/desktop 仍在传），本件不再渲染；空间切换要换个落点由研发定。
- * - 底部 `Pagination` 一期保留（原型是滚动到底即止，撤分页牵动研发取数）。
- * - 目录刷新告知条仍是 `Banner variant="warning"`。
- *
- * L3-3-7 三态归位：`loading` / `error` / `emptyState` 三个可选槽把骨架、错误横幅与空态
- * 收进件里（内部复用 `DesktopCatalogGridView` 的三态网格）。原来三页签的状态态在宿主
- * 两条路上各拼一套（`SkillsCenter` 一套给专家/技能、`ConnectorModal` 另一套给连接器），
- * 「三页签同形」于是只统一了满态；现在连载入与空都是同一张网格。三槽都不给＝老口径。
- */
-export function DesktopSkillsPageView({
-  section,
-  onSectionChange,
-  query,
-  onQueryChange,
-  searchPlaceholder,
-  actionLabel,
-  onAction,
-  categories,
-  activeCategoryId,
-  onCategoryChange,
-  installedOnly = false,
-  onInstalledOnlyChange,
-  currentPage,
-  totalItems,
-  pageSize = 24,
-  onPageChange,
-  notice,
-  loading = false,
-  loadingCount = 6,
-  error,
-  errorDetail,
-  onRetry,
-  emptyState,
-  children,
-  overlay,
-}: DesktopSkillsPageViewProps) {
-  const scope: "all" | "mine" = installedOnly ? "mine" : "all"
-  // L3-3-7 三态：错 > 载 > 空 > 满。三档都落在同一张 `.plaza__grid` 上（错/载走
-  // `DesktopCatalogGridView` 的既有三态，空态由调用方给节点），所以三页签切换时网格
-  // 的列宽、沟槽与滚动槽一格都不跳。三槽都不给＝老口径，`children` 原样渲染。
-  const stateSlot = error ? "error" : loading ? "loading" : emptyState ? "empty" : null
-
-  return (
-    <div className="page">
-      <PageHead
-        eyebrow="工具"
-        title="插件"
-        description="专家、技能与连接器都在这里安装与管理；也可以添加自己的。"
-        search={<SearchInput value={query} onChange={onQueryChange} placeholder={searchPlaceholder} />}
-        actions={
-          actionLabel && onAction ? (
-            <Button variant="primary" icon={<Plus />} onClick={onAction}>
-              {actionLabel}
-            </Button>
-          ) : undefined
-        }
-        tabs={SECTION_ITEMS}
-        activeTabKey={section}
-        onTabChange={(key) => onSectionChange(key as DesktopSkillsSection)}
-      />
-      <div className="plaza__filters">
-        <div className="plaza__cats">
-          {/* 分类 chip（原型 L1651 ＋ 逻辑 L4620–4625）：改走 `primitives/Chip` 的筛选档
-              （`shape="square"` ＋ `selected`）。原来是 `Button ghost/secondary`——未选中**没有边**，
-              一排分类在页底上只剩几团浮字，选中态又借了 secondary 的按钮面，看着像一排随时会
-              触发动作的钮。Chip 筛选档：未选＝透明面 ＋ 常驻 1px --ow-border ＋ 400，
-              选中＝--ow-current-bg ＋ 500（位置极，不占状态/行动极）。 */}
-          <div className="plaza__cats-main">
-            {categories.map((category) => (
-              <Chip
-                key={category.id ?? "__all__"}
-                shape="square"
-                label={category.label}
-                selected={activeCategoryId === category.id}
-                aria-pressed={activeCategoryId === category.id}
-                onClick={() => onCategoryChange(category.id)}
-              />
-            ))}
-          </div>
-          <div className="plaza__cats-scope">
-            {/* 归属分段器（原型 L1654–1658）：改走 `primitives/SegmentedControl` 的线框档
-                （外壳 2px 内距 ＋ 1px --ow-border ＋ radius-sm，内钮 24 高 · radius-2xs ·
-                caption，选中＝--ow-current-bg ＋ 500）。B3 那版是页面层手搓的
-                `.plaza__scope` 三条 CSS ＋ `Button variant="unstyled"`：形对了，但键盘只能
-                Tab 逐枚过、语义是一堆 aria-pressed 的钮而不是一组单选，全仓第二套分段器。
-                收归原语后 ←→/Home/End 换选与 radiogroup 语义一并拿回。
-                「我的」一期仍接在 `installedOnly` 上（＝我装了的）；owner 维度要目录接口
-                支持，接口到位后只换取值，形不用再动。 */}
-            {onInstalledOnlyChange && (
-              <SegmentedControl
-                variant="outline"
-                size="sm"
-                aria-label="按归属筛选"
-                options={SCOPE_ITEMS}
-                value={scope}
-                onChange={(value) => onInstalledOnlyChange(value === "mine")}
-              />
-            )}
-          </div>
-        </div>
-      </div>
-      {notice && (
-        <Banner className="plaza__notice" variant="warning">
-          {notice}
-        </Banner>
-      )}
-      {stateSlot === "empty" ? (
-        <div className="plaza__grid">{emptyState}</div>
-      ) : stateSlot ? (
-        <DesktopCatalogGridView
-          loading={loading}
-          loadingCount={loadingCount}
-          error={error}
-          errorDetail={errorDetail}
-          onRetry={onRetry}
-          empty={false}
-        />
-      ) : (
-        children
-      )}
-      <Pagination
-        className="plaza__pagination"
-        current={currentPage}
-        total={totalItems}
-        pageSize={pageSize}
-        onChange={onPageChange}
-      />
-      {overlay}
-    </div>
-  )
-}