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

package/src/components/composite/OrbitworkLogo/OrbitworkLogo.stories.tsx

@@ -1,192 +0,0 @@
-import type { Meta, StoryObj } from "@storybook/react"
-import type { CSSProperties, ReactNode } from "react"
-import { OrbitworkLockup, OrbitworkLogo, OrbitworkMark } from "./index"
-
-/**
- * 品牌锁定件（§12）。dark / mono-white 变体只在暗面出现，light / mono-navy
- * 只在浅面出现，故矩阵里的底板用锁定的 navy / paper 面（与 brand.card.html 一致）；
- * auto 档与兼容导出 OrbitworkLogo 用主题面（--ow-bg/--ow-surface），
- * 随 storybook 工具栏 data-theme 切换验证双主题可读。
- */
-const meta = {
-  title: "Composite/OrbitworkLogo",
-  component: OrbitworkLogo,
-  parameters: {
-    layout: "centered",
-  },
-  tags: ["autodocs"],
-} satisfies Meta<typeof OrbitworkLogo>
-
-export default meta
-type Story = StoryObj<typeof meta>
-
-const navyPanel: CSSProperties = {
-  background: "var(--ow-navy)",
-  borderRadius: 12,
-  display: "flex",
-  alignItems: "center",
-  justifyContent: "center",
-  gap: 24,
-  padding: "20px 28px",
-}
-
-const paperPanel: CSSProperties = {
-  background: "var(--ow-surface)",
-  border: "1px solid var(--ow-border)",
-  borderRadius: 12,
-  display: "flex",
-  alignItems: "center",
-  justifyContent: "center",
-  gap: 24,
-  padding: "20px 28px",
-}
-
-const themePanel: CSSProperties = {
-  background: "var(--ow-bg)",
-  border: "1px solid var(--ow-border)",
-  borderRadius: 12,
-  display: "flex",
-  alignItems: "center",
-  justifyContent: "center",
-  gap: 24,
-  padding: "20px 28px",
-}
-
-function Column({ children }: { children: ReactNode }) {
-  return <div style={{ display: "flex", flexDirection: "column", gap: 12 }}>{children}</div>
-}
-
-/** 四色制矩阵：dark/mono-white 于暗面、light/mono-navy 于浅面（配色规格锁定）。 */
-export const MarkVariants: Story = {
-  render: () => (
-    <Column>
-      <div style={navyPanel}>
-        <OrbitworkMark variant="dark" size={60} />
-        <OrbitworkMark variant="mono-white" size={42} />
-      </div>
-      <div style={paperPanel}>
-        <OrbitworkMark variant="light" size={60} />
-        <OrbitworkMark variant="mono-navy" size={42} />
-      </div>
-    </Column>
-  ),
-}
-
-/** optical=内容光学框（排版居中）；construction=96 构造框（旋转/图标制图）。 */
-export const MarkFrames: Story = {
-  render: () => (
-    <div style={paperPanel}>
-      <span style={{ outline: "1px dashed var(--ow-border)", lineHeight: 0 }}>
-        <OrbitworkMark variant="light" frame="optical" size={64} />
-      </span>
-      <span style={{ outline: "1px dashed var(--ow-border)", lineHeight: 0 }}>
-        <OrbitworkMark variant="light" frame="construction" size={64} />
-      </span>
-    </div>
-  ),
-}
-
-/** 尺寸阶梯（品牌最小 16px；再小请勿使用标志）。 */
-export const MarkSizes: Story = {
-  render: () => (
-    <div style={{ ...paperPanel, alignItems: "flex-end" }}>
-      {[16, 24, 32, 48, 64].map((s) => (
-        <OrbitworkMark key={s} variant="light" size={s} />
-      ))}
-    </div>
-  ),
-}
-
-/** auto 档：随 data-theme 在 light/dark 两档官方配色间切换（工具栏切主题验证）。 */
-export const MarkAuto: Story = {
-  render: () => (
-    <div style={themePanel}>
-      <OrbitworkMark variant="auto" size={48} />
-      <OrbitworkMark variant="auto" size={32} />
-      <OrbitworkMark variant="auto" size={16} />
-    </div>
-  ),
-}
-
-/** 锁排：标=1.17×字号、间距=0.4×字号、光学基线补偿=0.12×字号，字标全小写 Space Grotesk 500。 */
-export const LockupLight: Story = {
-  render: () => (
-    <div style={paperPanel}>
-      <OrbitworkLockup size={21} />
-    </div>
-  ),
-}
-
-export const LockupDark: Story = {
-  render: () => (
-    <div style={navyPanel}>
-      <OrbitworkLockup theme="dark" size={21} />
-    </div>
-  ),
-}
-
-/** 双语段「泛舟星轨」：仅国内正式场合追加。 */
-export const LockupBilingual: Story = {
-  render: () => (
-    <Column>
-      <div style={paperPanel}>
-        <OrbitworkLockup size={20} bilingual />
-      </div>
-      <div style={navyPanel}>
-        <OrbitworkLockup theme="dark" size={20} bilingual />
-      </div>
-    </Column>
-  ),
-}
-
-/** auto 锁排（工具栏切主题验证双主题可读）。 */
-export const LockupAuto: Story = {
-  render: () => (
-    <div style={themePanel}>
-      <OrbitworkLockup theme="auto" size={22} />
-      <OrbitworkLockup theme="auto" size={22} bilingual />
-    </div>
-  ),
-}
-
-/** 锁排尺寸阶梯（最小锁排高 20px；更小场景改用 OrbitworkMark）。 */
-export const LockupSizes: Story = {
-  render: () => (
-    <div style={{ ...themePanel, alignItems: "flex-end" }}>
-      {[18, 22, 28, 36].map((s) => (
-        <OrbitworkLockup key={s} theme="auto" size={s} />
-      ))}
-    </div>
-  ),
-}
-
-/** 兼容导出 OrbitworkLogo（= 锁排 auto 档）：titlebar 28 / 分享卡 20 两个真实档位。 */
-export const CompatLogo: Story = {
-  render: () => (
-    <div style={themePanel}>
-      <OrbitworkLogo size={28} label="Orbitwork" />
-      <OrbitworkLogo size={20} />
-    </div>
-  ),
-}
-
-/** 品牌总览（对照 ow/components/brand/brand.card.html）。 */
-export const BrandBoard: Story = {
-  render: () => (
-    <Column>
-      <div style={navyPanel}>
-        <OrbitworkMark variant="dark" size={60} />
-        <OrbitworkMark variant="mono-white" size={42} />
-        <OrbitworkLockup theme="dark" size={21} />
-      </div>
-      <div style={paperPanel}>
-        <OrbitworkMark variant="light" size={60} />
-        <OrbitworkMark variant="mono-navy" size={42} />
-        <OrbitworkLockup size={21} />
-      </div>
-      <div style={paperPanel}>
-        <OrbitworkLockup size={20} bilingual />
-      </div>
-    </Column>
-  ),
-}

package/src/components/composite/OrbitworkLogo/index.tsx

@@ -1,207 +0,0 @@
-import type { HTMLAttributes, SVGProps } from "react"
-
-/**
- * Orbitwork 品牌锁定件（DS 2.0 §12）——照卡逐像素移植自
- * design/ow/components/brand/{OrbitworkMark,OrbitworkLockup}.jsx。
- * 几何、时序、配色、三极归属均为规格锁定值，不得自行改动。
- */
-
-/** 信标轨迹五点（cx, cy, r, opacity）——规格锁定几何，勿改 */
-const TRAIL: ReadonlyArray<readonly [number, number, number, number]> = [
-  [48, 48, 8.2, 1],
-  [60.2, 20.6, 6.7, 0.6],
-  [41.76, 18.66, 5.5, 0.45],
-  [25.71, 27.93, 4.3, 0.3],
-  [18.16, 44.86, 3.3, 0.2],
-]
-
-/**
- * 四色制锁定配色 [trail 墨色, satellite 卫星色]。
- * 品牌墨色是锁定 hex（#0F1B3D / #F7F6F1），不得改经 --ow-text 间接取色
- * （--ow-text 落 #333B50/#ECEBE5，非品牌墨）。荧黄 #FFD23E 只出现在暗面。
- */
-const VARIANT_COLORS = {
-  dark: ["#F7F6F1", "#FFD23E"],
-  light: ["#0F1B3D", "#D8A300"],
-  "mono-white": ["#F7F6F1", "#F7F6F1"],
-  "mono-navy": ["#0F1B3D", "#0F1B3D"],
-} satisfies Record<string, readonly [string, string]>
-
-/**
- * auto 档（包内适配层，非规格四色制成员）：随祖先 data-theme 在 light/dark
- * 两档官方配色之间切换，终值仍是上表锁定 hex——变量由 styles/utilities.css
- * 的 .ow-brand-auto 块按主题赋值，fallback 为浅色档。
- */
-const AUTO_TRAIL = "var(--ow-brand-ink, #0F1B3D)"
-const AUTO_SATELLITE = "var(--ow-brand-satellite, #D8A300)"
-
-const OPTICAL_VIEWBOX = "13 11.7 73.4 45.3"
-const CONSTRUCTION_VIEWBOX = "0 0 96 96"
-
-/** 品牌最小渲染尺寸（guidelines/brand-mark）。 */
-const MIN_MARK_PX = 16
-
-const warned = new Set<string>()
-
-function warnBelowMinSize(component: string, px: number) {
-  if (typeof process !== "undefined" && process.env.NODE_ENV !== "production") {
-    if (Number.isFinite(px) && px < MIN_MARK_PX && !warned.has(`${component}:${px}`)) {
-      warned.add(`${component}:${px}`)
-      // eslint-disable-next-line no-console
-      console.warn(
-        `[Orbitwork DS2] ${component}: 渲染尺寸 ${px}px 低于品牌最小 ${MIN_MARK_PX}px（见 ow/guidelines/brand-mark），请增大 size 或改用其他呈现。`,
-      )
-    }
-  }
-}
-
-function joinClassNames(...names: Array<string | undefined>) {
-  const joined = names.filter(Boolean).join(" ")
-  return joined === "" ? undefined : joined
-}
-
-/** dark=暗面彩色（默认）· light=浅面彩色（卫星深黄）· mono-white / mono-navy=单色 · auto=随 data-theme（包内适配档） */
-export type OrbitworkMarkVariant = "dark" | "light" | "mono-white" | "mono-navy" | "auto"
-
-export type OrbitworkMarkProps = Omit<SVGProps<SVGSVGElement>, "viewBox"> & {
-  /** 四色制变体；auto 为包内主题适配档（终值仍是 light/dark 两档锁定 hex） */
-  variant?: OrbitworkMarkVariant
-  /** 宽度 px；optical 框时高度自动 ≈ size×0.617。数字场景最小 16 */
-  size?: number
-  /** optical=内容光学框（默认，排版居中用）；construction=96 构造框（旋转/图标制图用） */
-  frame?: "optical" | "construction"
-  /** 无障碍名称；传 undefined 且配合 aria-hidden 可作纯装饰 */
-  label?: string
-}
-
-/** 信标标志（The Beacon）。中心是你，尾迹是积累的工作，荧黄卫星是当下。 */
-export function OrbitworkMark({
-  variant = "dark",
-  size = 32,
-  frame = "optical",
-  label = "Orbitwork",
-  className,
-  style,
-  ...rest
-}: OrbitworkMarkProps) {
-  const auto = variant === "auto"
-  const [trailColor, satelliteColor] = auto
-    ? ([AUTO_TRAIL, AUTO_SATELLITE] as const)
-    : (VARIANT_COLORS[variant] ?? VARIANT_COLORS.dark)
-  const optical = frame !== "construction"
-  const height = optical ? Math.round(((size * 45.3) / 73.4) * 10) / 10 : size
-  warnBelowMinSize("OrbitworkMark", size)
-  return (
-    <svg
-      width={size}
-      height={height}
-      viewBox={optical ? OPTICAL_VIEWBOX : CONSTRUCTION_VIEWBOX}
-      role="img"
-      aria-label={label}
-      className={auto ? joinClassNames("ow-brand-auto", className) : className}
-      style={style}
-      {...rest}
-    >
-      {TRAIL.map(([cx, cy, r, o], i) => (
-        <circle key={i} cx={cx} cy={cy} r={r} fill={trailColor} opacity={o} />
-      ))}
-      <circle cx="75.4" cy="35.8" r="10.4" fill={satelliteColor} />
-    </svg>
-  )
-}
-
-/** light=浅底（默认）· dark=暗底 · auto=随 data-theme（包内适配档） */
-export type OrbitworkLockupTheme = "light" | "dark" | "auto"
-
-export type OrbitworkLockupProps = Omit<HTMLAttributes<HTMLSpanElement>, "children"> & {
-  theme?: OrbitworkLockupTheme
-  /** 字标字号 px；锁排最小高 20px，更小场景用 OrbitworkMark */
-  size?: number
-  /** 追加「泛舟星轨」双语段（仅国内正式场合） */
-  bilingual?: boolean
-  /** 无障碍名称 */
-  label?: string
-}
-
-/**
- * 横排锁排：信标 + 全小写字标（Space Grotesk 500），标字间距=中心点直径。
- * 比例锁定：标=1.17×字号，间距=0.4×字号，光学基线补偿=0.12×字号。
- */
-export function OrbitworkLockup({
-  theme = "light",
-  size = 22,
-  bilingual = false,
-  label = "Orbitwork",
-  className,
-  style,
-  ...rest
-}: OrbitworkLockupProps) {
-  const auto = theme === "auto"
-  const dark = theme === "dark"
-  const inkColor = auto ? "var(--ow-brand-ink, #0F1B3D)" : dark ? "#F7F6F1" : "#0F1B3D"
-  const dividerColor = auto ? "var(--ow-brand-divider, #D8D5CC)" : dark ? "#333B50" : "#D8D5CC"
-  const cnColor = auto ? "var(--ow-brand-cn, #3A3E46)" : dark ? "#C9CBD1" : "#3A3E46"
-  warnBelowMinSize("OrbitworkLockup", Math.round(size * 1.17))
-  return (
-    <span
-      role="img"
-      aria-label={label}
-      className={auto ? joinClassNames("ow-brand-auto", className) : className}
-      style={{ display: "inline-flex", alignItems: "center", gap: Math.round(size * 0.4), ...style }}
-      {...rest}
-    >
-      <OrbitworkMark
-        variant={auto ? "auto" : dark ? "dark" : "light"}
-        size={Math.round(size * 1.17)}
-        style={{ marginBottom: Math.round(size * 0.12) }}
-        aria-hidden="true"
-        role={undefined}
-        aria-label={undefined}
-      />
-      <span
-        style={{
-          fontFamily: "var(--ow-font-display, 'Space Grotesk', sans-serif)",
-          fontWeight: 500,
-          fontSize: size,
-          letterSpacing: "-0.01em",
-          color: inkColor,
-          lineHeight: 1,
-          whiteSpace: "nowrap",
-        }}
-      >
-        orbitwork
-      </span>
-      {bilingual && <span aria-hidden="true" style={{ width: 1, alignSelf: "stretch", background: dividerColor }} />}
-      {bilingual && (
-        <span
-          style={{
-            fontFamily: "var(--ow-font-body, sans-serif)",
-            fontWeight: 500,
-            fontSize: Math.round(size * 0.68),
-            letterSpacing: "0.1em",
-            color: cnColor,
-            whiteSpace: "nowrap",
-          }}
-        >
-          泛舟星轨
-        </span>
-      )}
-    </span>
-  )
-}
-
-export type OrbitworkLogoProps = HTMLAttributes<HTMLSpanElement> & {
-  /** 字标字号 px（与 OrbitworkLockup 的 size 同义）。 */
-  size?: number | string
-  label?: string
-}
-
-/**
- * 兼容导出：等价于 `<OrbitworkLockup theme="auto">`——随 data-theme 自适应的锁排，
- * 供 titlebar / 分享卡等主题跟随语境使用。新代码请直接用 OrbitworkLockup / OrbitworkMark。
- */
-export function OrbitworkLogo({ size = 24, label, ...rest }: OrbitworkLogoProps) {
-  const numeric = typeof size === "number" ? size : Number.parseFloat(size)
-  const px = Number.isNaN(numeric) ? 22 : numeric
-  return <OrbitworkLockup theme="auto" size={px} label={label} data-component="orbitwork-logo" {...rest} />
-}

package/src/components/composite/OrbitworkModal/OrbitworkModal.stories.tsx

@@ -1,58 +0,0 @@
-import type { Meta, StoryObj } from "@storybook/react"
-import { Button } from "../../primitives"
-import { OrbitworkModal } from "./index"
-
-/**
- * @deprecated 已合并进 `Dialog`（蓝图 02 patterns）。本页只留兼容验证，
- * 新用法请看 Composite/Dialog —— 自带 chrome 的内容传 `bare`。
- */
-const meta = {
-  title: "Composite/OrbitworkModal (deprecated)",
-  component: OrbitworkModal,
-  parameters: {
-    layout: "fullscreen",
-  },
-  tags: ["autodocs"],
-} satisfies Meta<typeof OrbitworkModal>
-
-export default meta
-type Story = StoryObj<typeof meta>
-
-/** 兼容路径：等价于 `<Dialog bare>`，立面由基座给（16 圆角＋1px 边＋modal 影）。 */
-export const Open: Story = {
-  args: {
-    open: true,
-    onClose: () => {},
-    children: (
-      <div style={{ padding: 24, width: 460, maxWidth: "86vw" }}>
-        <div
-          style={{
-            marginBottom: 8,
-            color: "var(--ow-text)",
-            font: "600 var(--ow-fs-subtitle)/1.3 var(--ow-font-sans)",
-          }}
-        >
-          分享这个会话
-        </div>
-        <p
-          style={{ margin: "0 0 20px", color: "var(--ow-text-2)", font: "400 var(--ow-fs-ui)/1.5 var(--ow-font-sans)" }}
-        >
-          内容自带 chrome：裸壳只提供遮罩、立面、Escape 与焦点闭环。
-        </p>
-        <div style={{ display: "flex", gap: 12, justifyContent: "flex-end" }}>
-          <Button variant="secondary">取消</Button>
-          <Button variant="primary">生成链接</Button>
-        </div>
-      </div>
-    ),
-  },
-}
-
-/** 关闭态：不渲染任何节点（不留空遮罩）。 */
-export const Closed: Story = {
-  args: {
-    open: false,
-    onClose: () => {},
-    children: <div>关闭时不应出现</div>,
-  },
-}

package/src/components/composite/OrbitworkModal/index.tsx

@@ -1,31 +0,0 @@
-"use client"
-
-import type { ReactNode } from "react"
-import { Dialog } from "../Dialog"
-
-export interface OrbitworkModalProps {
-  open: boolean
-  onClose: () => void
-  children: ReactNode
-  className?: string
-  overlayClassName?: string
-}
-
-/**
- * @deprecated DS 2.0 已把模态基座统一到 `Dialog`（蓝图 02 patterns：Dialog 合并 OrbitworkModal）。
- * 本件仅作薄兼容导出：等价于 `<Dialog bare>`（只出遮罩＋立面，内容自带 chrome）。
- * 新代码直接用 `Dialog`；需要自带 chrome 的预览壳传 `bare`。
- */
-export function OrbitworkModal({
-  open,
-  onClose,
-  children,
-  className = "",
-  overlayClassName = "",
-}: OrbitworkModalProps) {
-  return (
-    <Dialog bare open={open} onClose={onClose} className={className} overlayClassName={overlayClassName}>
-      {children}
-    </Dialog>
-  )
-}