@lynn123411/dsh-maple-theme 0.1.0 → 0.3.0

package/src/client/tokens.ts

@@ -1,78 +0,0 @@
-/**
- * Maple 两套调色板的令牌表：`--dsw-*` 名字 → 浅色 / 深色各一个值。
- *
- * 值里允许出现 `var(--maple-hue-light, 35)` 这类引用：宿主把这份表写到 `body` 的
- * 行内样式上，色相变量写在 `<html>` 上，行内样式按继承链解析得到，所以整套色板
- * 仍然由一个数字转动，而令牌本身走宿主的主题通道（不是另立一份全局主题）。
- *
- * 与 Maple 原版的偏差都在 `DETAILS.md`「与 Maple 原版的偏差」里写明；
- * 对比度由 scripts/test-tokens.mjs 读这份表自己算。
- */
-/** 一条令牌在浅色与深色下各一个值；与宿主 `ThemeTokenOverrides` 的结构一致。 */
-export type ThemeTokenOverrides = Record<string, { light: string; dark: string }>;
-
-/** 本插件在主题通道里的来源名，与包名一致，便于在宿主里认出是谁改的。 */
-export const THEME_SOURCE = '@lynn123411/dsh-maple-theme';
-
-/**
- * 两套色板。浅色取 Maple 的暖白（基础色相 35°）、深色取冷灰（207°）。
- * 令牌名与宿主 `design-platform.css` 一致，换的是值，不是名字。
- */
-export const MAPLE_TOKENS = {
-  '--dsw-alias-bg-base': { light: 'hsl(var(--maple-hue-light, 35) 12% 97%)', dark: 'hsl(var(--maple-hue-dark, 207) 6% 11%)' },
-  '--dsw-alias-bg-layer-1': { light: 'hsl(var(--maple-hue-light, 35) 10% 95%)', dark: 'hsl(var(--maple-hue-dark, 207) 10% 13%)' },
-  '--dsw-alias-bg-layer-2': { light: 'hsl(calc(var(--maple-hue-light, 35) - 18) 8% 93%)', dark: 'hsl(calc(var(--maple-hue-dark, 207) - 8) 6% 12%)' },
-  '--dsw-alias-bg-overlay': { light: 'hsl(var(--maple-hue-light, 35) 10% 94%)', dark: 'hsl(var(--maple-hue-dark, 207) 8% 14%)' },
-  '--dsw-alias-bg-module-platform': { light: 'hsl(var(--maple-hue-light, 35) 13.2% 90.6%)', dark: 'hsl(var(--maple-hue-dark, 207) 12% 12.4%)' },
-  '--dsw-alias-label-primary': { light: 'hsl(var(--maple-hue-light, 35) 10% 18%)', dark: 'hsl(var(--maple-hue-dark, 207) 24% 88%)' },
-  '--dsw-alias-label-secondary': { light: 'hsl(var(--maple-hue-light, 35) 8% 35%)', dark: 'hsl(var(--maple-hue-dark, 207) 16% 72%)' },
-  '--dsw-alias-label-tertiary': { light: 'hsl(var(--maple-hue-light, 35) 7% 42%)', dark: 'hsl(var(--maple-hue-dark, 207) 12% 58%)' },
-  '--dsw-alias-label-caption': { light: 'hsl(var(--maple-hue-light, 35) 6% 50%)', dark: 'hsl(var(--maple-hue-dark, 207) 10% 46%)' },
-  '--dsw-alias-label-dimmed': { light: 'hsl(var(--maple-hue-light, 35) 8% 82%)', dark: 'hsl(var(--maple-hue-dark, 207) 8% 26%)' },
-  '--dsw-alias-label-primary-dimmed': { light: 'hsl(var(--maple-hue-light, 35) 9% 27%)', dark: 'hsl(var(--maple-hue-dark, 207) 18% 80%)' },
-  '--dsw-alias-label-primary-bluish': { light: 'hsl(var(--maple-hue-light, 35) 26% 38%)', dark: 'hsl(var(--maple-hue-dark, 207) 26% 72%)' },
-  '--dsw-alias-label-primary-foreground': { light: 'hsl(var(--maple-hue-light, 35) 40% 96%)', dark: 'hsl(var(--maple-hue-dark, 207) 10% 9%)' },
-  '--dsw-alias-label-primary-inverted': { light: 'hsl(var(--maple-hue-light, 35) 40% 96%)', dark: 'hsl(var(--maple-hue-dark, 207) 10% 13%)' },
-  '--dsw-alias-label-shimmer': { light: 'hsl(var(--maple-hue-light, 35) 10% 18% / 30%)', dark: 'hsl(0 0% 100% / 45%)' },
-  '--dsw-alias-link': { light: 'hsl(162 76% 29%)', dark: 'hsl(178 30% 62%)' },
-  '--dsw-alias-brand-primary': { light: 'hsl(var(--maple-hue-light, 35) 26% 38%)', dark: 'hsl(var(--maple-hue-dark, 207) 26% 72%)' },
-  '--dsw-alias-brand-text': { light: 'hsl(var(--maple-hue-light, 35) 10% 18%)', dark: 'hsl(var(--maple-hue-dark, 207) 24% 88%)' },
-  '--dsw-alias-state-business-primary': { light: 'hsl(var(--maple-hue-light, 35) 26% 38%)', dark: 'hsl(var(--maple-hue-dark, 207) 26% 72%)' },
-  '--dsw-alias-state-business-tertiary': { light: 'hsl(var(--maple-hue-light, 35) 40% 88%)', dark: 'hsl(var(--maple-hue-dark, 207) 18% 22%)' },
-  '--dsw-alias-state-error-primary': { light: 'hsl(0 45% 48%)', dark: 'hsl(0 44% 68%)' },
-  '--dsw-alias-state-warn-primary': { light: 'hsl(32 70% 37%)', dark: 'hsl(20 40% 68%)' },
-  '--dsw-alias-state-success-primary': { light: 'hsl(95 75% 29%)', dark: 'hsl(130 32% 68%)' },
-  '--dsw-alias-border-l1': { light: 'hsl(var(--maple-hue-light, 35) 26% 38% / 10%)', dark: 'hsl(var(--maple-hue-dark, 207) 24% 88% / 7%)' },
-  '--dsw-alias-border-l2': { light: 'hsl(var(--maple-hue-light, 35) 26% 38% / 16%)', dark: 'hsl(var(--maple-hue-dark, 207) 24% 88% / 13%)' },
-  '--dsw-alias-border-l3': { light: 'hsl(var(--maple-hue-light, 35) 26% 38% / 20%)', dark: 'hsl(var(--maple-hue-dark, 207) 24% 88% / 17%)' },
-  '--dsw-alias-border-l4': { light: 'hsl(var(--maple-hue-light, 35) 26% 38% / 26%)', dark: 'hsl(var(--maple-hue-dark, 207) 24% 88% / 22%)' },
-  '--dsw-alias-separator-primary': { light: 'hsl(var(--maple-hue-light, 35) 26% 38% / 16%)', dark: 'hsl(var(--maple-hue-dark, 207) 24% 88% / 13%)' },
-  '--dsw-alias-interactive-bg-hover': { light: 'hsl(var(--maple-hue-light, 35) 26% 38% / 7%)', dark: 'hsl(var(--maple-hue-dark, 207) 24% 88% / 8%)' },
-  '--dsw-alias-interactive-bg-active': { light: 'hsl(var(--maple-hue-light, 35) 26% 38% / 12%)', dark: 'hsl(var(--maple-hue-dark, 207) 24% 88% / 14%)' },
-  '--dsw-alias-interactive-bg-hover-solid': { light: 'hsl(var(--maple-hue-light, 35) 12% 93%)', dark: 'hsl(var(--maple-hue-dark, 207) 14% 16%)' },
-  '--dsw-alias-button-info-fill': { light: 'hsl(162 62% 30%)', dark: 'hsl(178 34% 34%)' },
-  '--dsw-alias-button-info-hover': { light: 'hsl(162 62% 24%)', dark: 'hsl(178 34% 42%)' },
-  '--dsw-alias-brand-primary-new-colorprimary-new-color': { light: 'hsl(var(--maple-hue-light, 35) 30% 42%)', dark: 'hsl(var(--maple-hue-dark, 207) 30% 66%)' },
-  '--dsw-alias-button-primary-fill': { light: 'hsl(var(--maple-hue-light, 35) 30% 42%)', dark: 'hsl(var(--maple-hue-dark, 207) 30% 66%)' },
-  '--dsw-alias-button-primary-hover': { light: 'hsl(var(--maple-hue-light, 35) 32% 34%)', dark: 'hsl(var(--maple-hue-dark, 207) 32% 76%)' },
-  '--dsw-alias-button-floating-fill': { light: 'hsl(var(--maple-hue-light, 35) 14% 98.5%)', dark: 'hsl(var(--maple-hue-dark, 207) 8% 15%)' },
-  '--dsw-alias-button-floating-hover': { light: 'hsl(var(--maple-hue-light, 35) 10% 95%)', dark: 'hsl(var(--maple-hue-dark, 207) 14% 19%)' },
-  '--dsw-alias-markdown-code-block': { light: 'hsl(var(--maple-hue-light, 35) 10% 95%)', dark: 'hsl(var(--maple-hue-dark, 207) 10% 13%)' },
-  '--dsw-alias-markdown-code-block-banner': { light: 'hsl(var(--maple-hue-light, 35) 13.2% 90.6%)', dark: 'hsl(var(--maple-hue-dark, 207) 8% 15%)' },
-  '--dsw-alias-markdown-inline-code': { light: 'hsl(var(--maple-hue-light, 35) 14% 94%)', dark: 'hsl(var(--maple-hue-dark, 207) 8% 15%)' },
-  '--dsw-alias-markdown-tag': { light: 'hsl(var(--maple-hue-light, 35) 40% 88%)', dark: 'hsl(var(--maple-hue-dark, 207) 14% 20%)' },
-  '--dsw-alias-markdown-citation': { light: 'hsl(var(--maple-hue-light, 35) 10% 94%)', dark: 'hsl(var(--maple-hue-dark, 207) 8% 14%)' },
-  '--dsw-alias-scrollbar-bg-l1': { light: 'hsl(var(--maple-hue-light, 35) 14% 84%)', dark: 'hsl(var(--maple-hue-dark, 207) 10% 25%)' },
-  '--dsw-alias-scrollbar-bg-l2': { light: 'hsl(var(--maple-hue-light, 35) 20% 78%)', dark: 'hsl(var(--maple-hue-dark, 207) 12% 32%)' },
-  '--dsw-alias-scrollbar-hover-l2': { light: 'hsl(var(--maple-hue-light, 35) 18% 71%)', dark: 'hsl(var(--maple-hue-dark, 207) 10% 39%)' },
-  '--dsw-alias-menu-icon': { light: 'hsl(var(--maple-hue-light, 35) 8% 35%)', dark: 'hsl(var(--maple-hue-dark, 207) 18% 80%)' },
-  '--dsw-specific-sidebar-fill': { light: 'hsl(calc(var(--maple-hue-light, 35) - 18) 8% 93%)', dark: 'hsl(calc(var(--maple-hue-dark, 207) - 8) 6% 12%)' },
-  '--dsw-specific-sidebar-nav-item-active': { light: 'hsl(var(--maple-hue-light, 35) 26% 88%)', dark: 'hsl(var(--maple-hue-dark, 207) 14% 19%)' },
-  '--dsw-specific-sidebar-nav-item-hover': { light: 'hsl(var(--maple-hue-light, 35) 26% 38% / 8%)', dark: 'hsl(var(--maple-hue-dark, 207) 24% 88% / 8%)' },
-  '--dsw-specific-sidebar-nav-item-active-accent': { light: 'hsl(var(--maple-hue-light, 35) 40% 84%)', dark: 'hsl(var(--maple-hue-dark, 207) 18% 24%)' },
-  '--dsw-specific-tip': { light: 'hsl(var(--maple-hue-light, 35) 18% 90%)', dark: 'hsl(var(--maple-hue-dark, 207) 12% 18%)' },
-  '--dsw-specific-bubble': { light: 'hsl(var(--maple-hue-light, 35) 24% 93%)', dark: 'hsl(var(--maple-hue-dark, 207) 14% 19%)' },
-  '--dsw-specific-bubble-highlight': { light: 'hsl(var(--maple-hue-light, 35) 30% 87%)', dark: 'hsl(var(--maple-hue-dark, 207) 16% 24%)' },
-  '--dsw-specific-input-major': { light: 'hsl(var(--maple-hue-light, 35) 14% 98.5%)', dark: 'hsl(var(--maple-hue-dark, 207) 8% 15%)' },
-  '--dsw-specific-selector': { light: 'hsl(var(--maple-hue-light, 35) 14% 94%)', dark: 'hsl(var(--maple-hue-dark, 207) 14% 19%)' },
-} satisfies ThemeTokenOverrides;

package/src/index.ts

@@ -1,69 +0,0 @@
-import z from '@deepseek-ai/schemastery';
-
-/**
- * `@lynn123411/dsh-maple-theme` —— 把 Maple 的配色与聊天正文排版带进 DSH。
- *
- * 宿主半边只声明这份配置的形状：界面全部由浏览器半边画（注入样式表 + 插件页上的配置卡片），
- * 这里不碰任何界面，也不注册工具。配置项落进本插件那一行的 config，浏览器半边经
- * `ctx.configForms.get('dsh-maple-theme')` 读写同一份值。
- *
- * 每个字段都标 `volatile()`：改一个开关不该重挂整条 loader entry，浏览器半边收到通知后
- * 自己改 <html> 上的属性与变量，样式表不重建。
- */
-export const name = 'dsh-maple-theme';
-
-/** 只需要 settings 服务：它承载这一行的配置，也是「不自动生成设置页」那条策略的入口。 */
-export const inject = ['settings'];
-
-/** 标题配色的三种取材方式。 */
-export const HEADING_MODES = ['colorful', 'accent', 'text'] as const;
-
-/** 标题配色：六色依次换 / 全用强调色 / 全用正文色。 */
-export type HeadingMode = typeof HEADING_MODES[number];
-
-/** 本插件在 profile 里的 loader 行 id，同时是设置的命名空间。 */
-export const SETTINGS_NAMESPACE = name;
-
-/**
- * 配置的形状与默认值。色相取 Maple 自己的出厂值（浅色 35、深色 207）。
- * 行高与段落间距比 Maple 的 1.8 / 8px 松一档：对话正文的行宽比笔记窄，
- * 按笔记的行距排会显得稀，所以这里收紧行距、放大段距。
- */
-export const Config = z.object({
-  /** 浅色基础色相（度）：整套浅色从它推导。 */
-  hueLight: z.number().step(1).min(0).max(360).default(35).volatile(),
-  /** 深色基础色相（度）。 */
-  hueDark: z.number().step(1).min(0).max(360).default(207).volatile(),
-  /** 正文行高倍数（Maple 的出厂值是 1.8，对话正文取 1.75）。 */
-  lineHeight: z.number().step(0.05).min(1.4).max(2).default(1.75).volatile(),
-  /** 段落间距（px；Maple 的出厂值是 8，对话正文取 10）。 */
-  paragraphGap: z.number().step(1).min(4).max(24).default(10).volatile(),
-  /** 标题配色方式。 */
-  headingColor: z.union([...HEADING_MODES]).default('colorful').volatile(),
-  /** 悬停时在标题左侧显示 H1…H6 等级标记。 */
-  headingIndicator: z.boolean().default(true).volatile(),
-  /** 代码块使用 Maple 的语法配色。 */
-  codePalette: z.boolean().default(true).volatile(),
-  /** 外壳装饰：侧栏与标签条的圆角、输入卡填充、去掉会话头部那条分隔线。 */
-  shellSkin: z.boolean().default(true).volatile(),
-});
-
-/** 宿主上下文里本插件用到的那两个成员。 */
-interface HostContext {
-  fiber: unknown;
-  settings: {
-    /** 登记这一行在设置页上的自动生成策略；`auto: false` 表示不生成。 */
-    configure(presentation: { auto?: boolean }, owner?: unknown): () => void;
-  };
-}
-
-/**
- * 插件本体：声明本行的设置页策略。
- *
- * 配置界面在宿主「插件」页上（浏览器半边注册 `plugins.bundle.config`），
- * 所以这里要显式关掉内核按 Config schema 自动生成的设置页，否则同一批字段会出现两次。
- * @param ctx - 宿主插件上下文。
- */
-export function apply(ctx: HostContext): void {
-  ctx.settings.configure({ auto: false }, ctx.fiber);
-}