{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "superscript-docs",
  "title": "Superscript",
  "description": "Format inline text above the baseline.",
  "files": [
    {
      "path": "../../content/docs/(plugins)/(marks)/superscript.mdx",
      "content": "---\ntitle: Superscript\ndescription: Format inline text above the baseline.\ndocs:\n  - route: /docs/basic-marks\n    title: Basic Marks\n  - route: /docs/subscript\n    title: Subscript\n  - route: /docs/components/more-toolbar-button\n    title: More Toolbar Button\n  - route: /docs/plugin-shortcuts\n    title: Plugin Shortcuts\n---\n\nSuperscript applies the `superscript` leaf mark to selected text. Its toggle transform removes `subscript`, so the same text cannot keep both vertical-position marks through the plugin API.\n\n<ComponentPreview name=\"basic-marks-demo\" />\n\n<PackageInfo>\n\n## Features\n\n- `KEYS.sup` leaf mark.\n- Directional selection affinity.\n- HTML deserialization from `sup` and `vertical-align: super`.\n- `<sup>` rendering by default.\n- Optional Markdown-style input rule through `SuperscriptRules`.\n- Mutual exclusion with `KEYS.sub`.\n\n</PackageInfo>\n\n## Kit Usage\n\n<Steps>\n\n### Add Basic Marks\n\n`BasicMarksKit` includes `SuperscriptPlugin`, the `^` input rule, and a `mod+period` shortcut.\n\n<ComponentSource name=\"basic-marks-kit\" />\n\n```tsx\nimport { createPlateEditor } from 'platejs/react';\n\nimport { BasicMarksKit } from '@/components/editor/plugins/basic-marks-kit';\n\nexport const editor = createPlateEditor({\n  plugins: [...BasicMarksKit],\n});\n```\n\n### Add a Toolbar Control\n\nThe registry `MoreToolbarButton` toggles superscript from the More menu and removes subscript.\n\n```tsx\nimport { MoreToolbarButton } from '@/components/ui/more-toolbar-button';\n\nexport function FormattingMoreMenu() {\n  return <MoreToolbarButton />;\n}\n```\n\n</Steps>\n\n## Manual Usage\n\nInstall the mark package.\n\n```bash\nnpm install @platejs/basic-nodes\n```\n\nAdd `SuperscriptPlugin` directly when you want the default `<sup>` render.\n\n```tsx\nimport { SuperscriptPlugin } from '@platejs/basic-nodes/react';\nimport { createPlateEditor } from 'platejs/react';\n\nexport const editor = createPlateEditor({\n  plugins: [SuperscriptPlugin],\n});\n```\n\nConfigure the input rule and shortcut when you want the same behavior as the kit.\n\n```tsx\nimport { SuperscriptRules } from '@platejs/basic-nodes';\nimport { SuperscriptPlugin } from '@platejs/basic-nodes/react';\n\nexport const superscriptPlugin = SuperscriptPlugin.configure({\n  inputRules: [SuperscriptRules.markdown()],\n  shortcuts: { toggle: { keys: 'mod+period' } },\n});\n```\n\n## Ownership\n\n| Surface | Owner | What It Does |\n|---------|-------|--------------|\n| `BaseSuperscriptPlugin` | `@platejs/basic-nodes` | Headless superscript mark, HTML parser, render tag, selection rule, and `toggle` transform. |\n| `SuperscriptPlugin` | `@platejs/basic-nodes/react` | React wrapper for the headless superscript mark. |\n| `SuperscriptRules.markdown` | `@platejs/basic-nodes` | Optional `^` mark input rule factory. |\n| `BasicMarksKit` | Registry | Adds `SuperscriptPlugin`, the input rule, and `mod+period`. |\n| `MoreToolbarButton` | Registry UI | Calls `editor.tf.toggleMark(KEYS.sup, { remove: KEYS.sub })`. |\n\nThe package owns superscript semantics. The registry owns shortcut configuration and toolbar placement.\n\n## Behavior\n\n| Behavior | Source |\n|----------|--------|\n| Mark key | `KEYS.sup` (`superscript`) |\n| Leaf behavior | `node.isLeaf: true` |\n| Toggle transform | `editor.tf.superscript.toggle()` calls `editor.tf.toggleMark(type, { remove: editor.getType(KEYS.sub) })`. |\n| Selection affinity | `directional` |\n| HTML tags | `sup` |\n| HTML styles | `vertical-align: super` |\n| Render output | `sup` |\n| Kit input rule | `SuperscriptRules.markdown()` |\n| Kit shortcut | `mod+period` |\n\n## API Reference\n\n| API | Package | Use |\n|-----|---------|-----|\n| `BaseSuperscriptPlugin` | `@platejs/basic-nodes` | Headless superscript plugin. |\n| `SuperscriptPlugin` | `@platejs/basic-nodes/react` | React superscript plugin. |\n| `SuperscriptRules.markdown()` | `@platejs/basic-nodes` | Creates the `^` mark input rule. |\n| `tf.superscript.toggle()` | `@platejs/basic-nodes` | Toggles superscript and removes subscript. |\n",
      "type": "registry:file",
      "target": "content/docs/plate/(plugins)/(marks)/superscript.mdx"
    }
  ],
  "type": "registry:file"
}