snapshot of https://github.com/ueberdosis/tiptap.git (main, 2026-09-15; blobs > 131072B omitted)

packages/extension-subscript/README.md

@@ -0,0 +1,18 @@
+# @tiptap/extension-subscript
+
+[![Version](https://img.shields.io/npm/v/@tiptap/extension-subscript.svg?label=version)](https://www.npmjs.com/package/@tiptap/extension-subscript)
+[![Downloads](https://img.shields.io/npm/dm/@tiptap/extension-subscript.svg)](https://npmcharts.com/compare/tiptap?minimal=true)
+[![License](https://img.shields.io/npm/l/@tiptap/extension-subscript.svg)](https://www.npmjs.com/package/@tiptap/extension-subscript)
+[![Sponsor](https://img.shields.io/static/v1?label=Sponsor&message=%E2%9D%A4&logo=GitHub)](https://github.com/sponsors/ueberdosis)
+
+## Introduction
+
+Tiptap is a headless wrapper around [ProseMirror](https://ProseMirror.net) – a toolkit for building rich text WYSIWYG editors, which is already in use at many well-known companies such as _New York Times_, _The Guardian_ or _Atlassian_.
+
+## Official Documentation
+
+Documentation can be found on the [Tiptap website](https://tiptap.dev).
+
+## License
+
+Tiptap is open sourced software licensed under the [MIT license](https://github.com/ueberdosis/tiptap/blob/main/LICENSE.md).

packages/extension-subscript/package.json

@@ -0,0 +1,52 @@
+{
+  "name": "@tiptap/extension-subscript",
+  "version": "3.30.3",
+  "description": "subscript extension for tiptap",
+  "keywords": [
+    "tiptap",
+    "tiptap extension"
+  ],
+  "homepage": "https://tiptap.dev",
+  "bugs": {
+    "url": "https://github.com/ueberdosis/tiptap/issues"
+  },
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/ueberdosis/tiptap",
+    "directory": "packages/extension-subscript"
+  },
+  "funding": {
+    "type": "github",
+    "url": "https://github.com/sponsors/ueberdosis"
+  },
+  "files": [
+    "src",
+    "dist"
+  ],
+  "type": "module",
+  "main": "dist/index.cjs",
+  "module": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": {
+        "import": "./dist/index.d.ts",
+        "require": "./dist/index.d.cts"
+      },
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    }
+  },
+  "scripts": {
+    "build": "vp pack"
+  },
+  "devDependencies": {
+    "@tiptap/core": "workspace:^",
+    "@tiptap/pm": "workspace:^"
+  },
+  "peerDependencies": {
+    "@tiptap/core": "workspace:*",
+    "@tiptap/pm": "workspace:*"
+  }
+}

packages/extension-subscript/src/index.ts

@@ -0,0 +1,5 @@
+import { Subscript } from './subscript.js'
+
+export * from './subscript.js'
+
+export default Subscript

packages/extension-subscript/src/subscript.test.ts

@@ -0,0 +1,48 @@
+import { Editor } from '@tiptap/core'
+import Document from '@tiptap/extension-document'
+import Paragraph from '@tiptap/extension-paragraph'
+import Text from '@tiptap/extension-text'
+import { afterEach, beforeEach, describe, expect, it } from 'vite-plus/test'
+
+import { Subscript } from './subscript.js'
+
+describe('Subscript', () => {
+  let editor: Editor
+
+  beforeEach(() => {
+    const element = document.createElement('div')
+    document.body.appendChild(element)
+    editor = new Editor({
+      element,
+      extensions: [Document, Paragraph, Text, Subscript],
+      content: '<p>Example Text</p>',
+    })
+    editor.commands.selectAll()
+  })
+
+  afterEach(() => {
+    editor.destroy()
+  })
+
+  it('transforms inline style vertical-align: sub to sub tags', () => {
+    editor.commands.setContent('<p><span style="vertical-align: sub">Example Text</span></p>')
+    expect(editor.getHTML()).toBe('<p><sub>Example Text</sub></p>')
+  })
+
+  it('omits inline style with a different vertical-align', () => {
+    editor.commands.setContent('<p><b style="vertical-align: middle">Example Text</b></p>')
+    expect(editor.getHTML()).toBe('<p>Example Text</p>')
+  })
+
+  it('toggleSubscript wraps the selection in a sub tag', () => {
+    editor.commands.toggleSubscript()
+    expect(editor.getHTML()).toBe('<p><sub>Example Text</sub></p>')
+  })
+
+  it('toggleSubscript twice removes the sub tag', () => {
+    editor.commands.toggleSubscript()
+    editor.commands.selectAll()
+    editor.commands.toggleSubscript()
+    expect(editor.getHTML()).toBe('<p>Example Text</p>')
+  })
+})

packages/extension-subscript/src/subscript.ts

@@ -0,0 +1,97 @@
+import { Mark, mergeAttributes } from '@tiptap/core'
+import type { StyleParseRule } from '@tiptap/pm/model'
+
+export interface SubscriptExtensionOptions {
+  /**
+   * HTML attributes to add to the subscript element.
+   * @default {}
+   * @example { class: 'foo' }
+   */
+  HTMLAttributes: Record<string, any>
+}
+
+declare module '@tiptap/core' {
+  interface Commands<ReturnType> {
+    subscript: {
+      /**
+       * Set a subscript mark
+       * @example editor.commands.setSubscript()
+       */
+      setSubscript: () => ReturnType
+      /**
+       * Toggle a subscript mark
+       * @example editor.commands.toggleSubscript()
+       */
+      toggleSubscript: () => ReturnType
+      /**
+       * Unset a subscript mark
+       * @example editor.commands.unsetSubscript()
+       */
+      unsetSubscript: () => ReturnType
+    }
+  }
+}
+
+/**
+ * This extension allows you to create subscript text.
+ * @see https://www.tiptap.dev/api/marks/subscript
+ */
+export const Subscript = Mark.create<SubscriptExtensionOptions>({
+  name: 'subscript',
+
+  addOptions() {
+    return {
+      HTMLAttributes: {},
+    }
+  },
+
+  parseHTML() {
+    return [
+      {
+        tag: 'sub',
+      },
+      {
+        style: 'vertical-align',
+        getAttrs(value) {
+          // Don’t match this rule if the vertical align isn’t sub.
+          if (value !== 'sub') {
+            return false
+          }
+
+          // If it falls through we’ll match, and this mark will be applied.
+          return null
+        },
+      } as StyleParseRule,
+    ]
+  },
+
+  renderHTML({ HTMLAttributes }) {
+    return ['sub', mergeAttributes(this.options.HTMLAttributes, HTMLAttributes), 0]
+  },
+
+  addCommands() {
+    return {
+      setSubscript:
+        () =>
+        ({ commands }) => {
+          return commands.setMark(this.name)
+        },
+      toggleSubscript:
+        () =>
+        ({ commands }) => {
+          return commands.toggleMark(this.name)
+        },
+      unsetSubscript:
+        () =>
+        ({ commands }) => {
+          return commands.unsetMark(this.name)
+        },
+    }
+  },
+
+  addKeyboardShortcuts() {
+    return {
+      'Mod-,': () => this.editor.commands.toggleSubscript(),
+    }
+  },
+})

packages/extension-subscript/vite.config.ts

@@ -0,0 +1,9 @@
+import { defineConfig } from 'vite-plus'
+import { basePackConfig } from '../../pack.config.mjs'
+
+export default defineConfig({
+  pack: {
+    entry: ['src/index.ts'],
+    ...basePackConfig(),
+  },
+})