@clean-jsdoc-them/ 响起

Preact 组件库 + MDX 元素映射 + 为 v5 主题的岛屿注册. dwar 直接导入到服务器的页面, 并捆绑每个岛屿作为它的 拥有无害环境管理块。 Rang拥有页面壳 HTML 的每个字节.

里面的东西

• 颜色 —— 说 Layout, (中文(简体) ), Header, (中文(简体) ), Footer, (中文(简体) ), Brand只有SSR,没有客户JS自己的.
• 群岛 —— 说 Sidebar, (中文(简体) ), MobileNav, (中文(简体) ), TOC, (中文(简体) ), TocPopover, (中文(简体) ), CtrlK, (中文(简体) ), CodeTabs, (中文(简体) ), CopyBtn, (中文(简体) ), CopyPageButton, (中文(简体) ), ThemeToggle, (中文(简体) ), Settings, (中文(简体) ), LanguageSwitcher, (中文(简体) ), CodeViewer, (中文(简体) ), Embed, (中文(简体) ), PlaygroundMenu, (中文(简体) ), Tabs。每个都使初始的 HTML 具有意义,并在水分化后逐步增强(键盘处理、焦点陷阱、卷轴平滑、抽屉状态、剪贴板、主题/设置持久性、地方导航、一个沙盒式iframe、一个CDN装入的摩纳哥源查看器、一个“打开代码”CodePen/JSFiddle/CodeSandbox倒放).
• 仅提供 SSR 帮助 —— 说 Steps编号 :Step (编号为阶梯), PageNav (预/下个呼机), Playground (无标记的上下文承运人,其 filename编号 :highlight编号 :providers 页:1 CodeBlock 页:1 他们没有自己的岛屿.
• 初级 - 阴影风格 Button (单位:千美元)buttonVariants, (中文(简体) ), ButtonGroup (分出/分出按钮), DropdownMenu (将根/起子/内容/项/.), Dialog (+ 数) DialogHeader编号 :DialogTitle编号 :DialogBody编号 :DialogFooter, (中文(简体) ), CodeBlock (代码-块头-) CODE/文件名标签,副本,和游乐场的倒下), SimpleIcon (Simple-Icons CSS-mask glyph), 和 互联网档案馆的存檔,存档日期2013-12-02 cn 班级合并助教.
• defaultMdxComponents - 元素图 @mdx-js/mdx: 有悬停锚链接、 外部链接的标题 rel编号 :target 急躁, <CopyBtn>- 被包装的代码块、表格/列表/引用原始人和 <Callout> 编号 : <Steps> 编号 : <Tabs> 编号 : <Embed> 编号 : <Playground> 要素.
• ISLAND_REGISTRY —— 说 Record<IslandName, ComponentType> 键入 IslandName 来自工会 @clean-jsdoc-theme/utils十五把钥匙: sidebar, (中文(简体) ), mobile-nav, (中文(简体) ), toc, (中文(简体) ), toc-mobile, (中文(简体) ), cmdk, (中文(简体) ), code-tabs, (中文(简体) ), code-viewer, (中文(简体) ), embed, (中文(简体) ), playground, (中文(简体) ), copy-btn, (中文(简体) ), copy-page, (中文(简体) ), theme-toggle, (中文(简体) ), settings, (中文(简体) ), language-switcher, (中文(简体) ), tabs。 。 。 .
• i18n 接缝 - 铃声再出口bhasha's LanguageProvider 编号 : useTranslation 编号 : createI18n 所以德瓦可以包起每个水合根 从本地有效载荷中播种,而不单独导入bhasha. 每个染色体/岛屿弦都经过 t(key)· ; LanguageSwitcher 使一个地方没有.

toc 和 toc-mobile (单位:千美元)TocPopover,则 < lg 进展栏)是两个相同标题的演示; mobile-nav 编曲 切换主题,设置和侧边栏 < md 抽屉. embed 财务报告和审定财务报表 tabs 岛内岛屿(embed a. 将一个沙箱式框架水合; tabs 实值 SSR投降,只有DOM增强.

公共 API

import {
  // chrome
  Layout,
  Header,
  Footer,
  Brand,
  // islands
  Sidebar,
  MobileNav,
  TOC,
  TocPopover,
  CtrlK,
  CodeTabs,
  CopyBtn,
  CopyPageButton,
  ThemeToggle,
  useThemeMode,
  Settings,
  SettingsDialog,
  LanguageSwitcher,
  CodeViewer,
  // SSR render helpers + MDX containers
  Steps,
  Step,
  Tabs,
  Tab,
  PageNav,
  CodeBlock,
  // primitives
  Button,
  buttonVariants,
  ButtonGroup,
  DropdownMenu,
  Dialog,
  cn,
  // MDX map + registry
  defaultMdxComponents,
  ISLAND_REGISTRY,
  // i18n seam (re-exported from bhasha)
  LanguageProvider,
  useTranslation,
  createI18n,
} from '@clean-jsdoc-theme/rang';

每个部件都输出自己的道具类型(SidebarProps, (中文(简体) ), TOCProps岛屿 道具形状匹配 IslandPropsMap[K] 从 @clean-jsdoc-theme/utils 没错.

定型合同

组件以 Tailwind 工具类为样式, 参考 CSS 自定义 属性。 消费者(默认输油管中的战争;任何其他人) 直接)必须界定这些定义 :root数字 :

--clean-bg          --clean-bg-muted
--clean-fg          --clean-fg-muted
--clean-accent      --clean-accent-fg
--clean-border
--clean-font-heading   --clean-font-body   --clean-font-mono

阴影语义化名( C)background, (中文(简体) ), foreground, (中文(简体) ), primary, (中文(简体) ), muted, (中文(简体) ), accent, (中文(简体) ), border, (中文(简体) ), ring)被映射在这些 --clean-* 瓦尔斯通过 @theme, (中文(简体) ), (单位:千美元) @custom-variant dark 将 dark: 用于 [data-theme="dark"] (主题切换的信号)而不是OS prefers-color-scheme. 矮人 CSS 软件 管线羽流 ThemeTokens 自动输入这些变量; 独立 消费者必须界定它们.

FOUC + 主题

useThemeMode (使用时间: ThemeToggle读取存储 localStorage 偏好在效果内,所以需要设置预水合内线脚本 data-theme 打开 <html> 在第一幅画之前 dwar 插入此脚本 自动;独立消费者应运送同等物品.

贡献者

感谢所有帮助建立干净的jsdoc主题的人.

许可证

麻省理工学院.