@tiptap/extension-audio 3.16.0

package/LICENSE.md

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025, Tiptap GmbH
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,11 @@
+# @tiptap/extension-audio
+
+A native HTML5 audio node for [tiptap](https://tiptap.dev).
+
+```js
+import Audio from '@tiptap/extension-audio'
+
+editor = new Editor({
+  extensions: [Audio],
+})
+```

package/dist/index.cjs

@@ -0,0 +1,208 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  AUDIO_URL_REGEX: () => AUDIO_URL_REGEX,
+  AUDIO_URL_REGEX_GLOBAL: () => AUDIO_URL_REGEX_GLOBAL,
+  Audio: () => Audio,
+  default: () => index_default,
+  isValidAudioUrl: () => isValidAudioUrl,
+  sanitizeAudioSrc: () => sanitizeAudioSrc
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/audio.ts
+var import_core = require("@tiptap/core");
+
+// src/utils.ts
+var AUDIO_URL_REGEX = /https?:\/\/[^\s]+?\.(?:mp3|wav|ogg|oga|flac|m4a|aac|opus|weba|webm)(?:\?[^\s]*)?/i;
+var AUDIO_URL_REGEX_GLOBAL = /https?:\/\/[^\s]+?\.(?:mp3|wav|ogg|oga|flac|m4a|aac|opus|weba|webm)(?:\?[^\s]*)?/gi;
+var AUDIO_DATA_URL_REGEX = /^data:audio\/[a-zA-Z0-9.+-]+;base64,/i;
+var isValidAudioUrl = (url, allowBase64 = false) => {
+  if (!url) {
+    return false;
+  }
+  if (allowBase64 && AUDIO_DATA_URL_REGEX.test(url)) {
+    return true;
+  }
+  if (url.startsWith("//")) {
+    return true;
+  }
+  if (url.startsWith("/") || url.startsWith("./") || url.startsWith("../")) {
+    return true;
+  }
+  try {
+    const parsedUrl = new URL(url);
+    return parsedUrl.protocol === "http:" || parsedUrl.protocol === "https:";
+  } catch {
+    return false;
+  }
+};
+var sanitizeAudioSrc = (url, allowBase64 = false) => {
+  if (!url) {
+    return null;
+  }
+  return isValidAudioUrl(url, allowBase64) ? url : null;
+};
+
+// src/audio.ts
+var Audio = import_core.Node.create({
+  name: "audio",
+  addOptions() {
+    return {
+      addPasteHandler: true,
+      allowBase64: false,
+      autoplay: false,
+      controls: true,
+      loop: false,
+      muted: false,
+      preload: "metadata",
+      controlslist: void 0,
+      crossorigin: void 0,
+      disableRemotePlayback: false,
+      HTMLAttributes: {},
+      inline: false
+    };
+  },
+  inline() {
+    return this.options.inline;
+  },
+  group() {
+    return this.options.inline ? "inline" : "block";
+  },
+  atom: true,
+  draggable: true,
+  addAttributes() {
+    return {
+      src: {
+        default: null
+      },
+      controls: {
+        default: this.options.controls
+      },
+      autoplay: {
+        default: this.options.autoplay
+      },
+      loop: {
+        default: this.options.loop
+      },
+      muted: {
+        default: this.options.muted
+      },
+      preload: {
+        default: this.options.preload
+      },
+      controlslist: {
+        default: this.options.controlslist
+      },
+      crossorigin: {
+        default: this.options.crossorigin
+      },
+      disableremoteplayback: {
+        default: this.options.disableRemotePlayback
+      }
+    };
+  },
+  parseHTML() {
+    return [
+      {
+        tag: this.options.allowBase64 ? "audio[src]" : 'audio[src]:not([src^="data:"])'
+      }
+    ];
+  },
+  addCommands() {
+    return {
+      setAudio: (options) => ({ commands }) => {
+        if (!isValidAudioUrl(options.src, this.options.allowBase64)) {
+          return false;
+        }
+        return commands.insertContent({
+          type: this.name,
+          attrs: options
+        });
+      }
+    };
+  },
+  addPasteRules() {
+    if (!this.options.addPasteHandler) {
+      return [];
+    }
+    return [
+      (0, import_core.nodePasteRule)({
+        find: AUDIO_URL_REGEX_GLOBAL,
+        type: this.type,
+        getAttributes: (match) => {
+          return { src: match[0] };
+        }
+      })
+    ];
+  },
+  renderHTML({ HTMLAttributes }) {
+    const sanitizedSrc = sanitizeAudioSrc(HTMLAttributes.src, this.options.allowBase64);
+    const mergedAttributes = (0, import_core.mergeAttributes)(
+      this.options.HTMLAttributes,
+      {
+        controls: this.options.controls,
+        autoplay: this.options.autoplay,
+        loop: this.options.loop,
+        muted: this.options.muted,
+        preload: this.options.preload,
+        controlslist: this.options.controlslist,
+        crossorigin: this.options.crossorigin,
+        disableremoteplayback: this.options.disableRemotePlayback
+      },
+      {
+        ...HTMLAttributes,
+        src: sanitizedSrc
+      }
+    );
+    const cleanedAttributes = Object.fromEntries(
+      Object.entries(mergedAttributes).filter(([, value]) => value !== null && value !== void 0 && value !== false)
+    );
+    return ["audio", cleanedAttributes];
+  },
+  ...(0, import_core.createAtomBlockMarkdownSpec)({
+    nodeName: "audio",
+    allowedAttributes: [
+      "src",
+      "controls",
+      "autoplay",
+      "loop",
+      "muted",
+      "preload",
+      "controlslist",
+      "crossorigin",
+      "disableremoteplayback"
+    ]
+  })
+});
+
+// src/index.ts
+var index_default = Audio;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  AUDIO_URL_REGEX,
+  AUDIO_URL_REGEX_GLOBAL,
+  Audio,
+  isValidAudioUrl,
+  sanitizeAudioSrc
+});
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.ts","../src/audio.ts","../src/utils.ts"],"sourcesContent":["import { Audio } from './audio.js'\n\nexport * from './audio.js'\nexport * from './utils.js'\n\nexport default Audio\n","import { createAtomBlockMarkdownSpec, mergeAttributes, Node, nodePasteRule } from '@tiptap/core'\n\nimport { AUDIO_URL_REGEX_GLOBAL, isValidAudioUrl, sanitizeAudioSrc } from './utils.js'\n\nexport interface AudioOptions {\n  /**\n   * Controls if the paste handler for audio sources should be added.\n   * @default true\n   * @example false\n   */\n  addPasteHandler: boolean\n\n  /**\n   * Controls if the audio should autoplay.\n   * @default false\n   * @example true\n   */\n  autoplay: boolean\n\n  /**\n   * Controls if the audio element should render the native controls.\n   * @default true\n   * @example false\n   */\n  controls: boolean\n\n  /**\n   * Controls if the audio should loop.\n   * @default false\n   * @example true\n   */\n  loop: boolean\n\n  /**\n   * Controls if the audio should be muted.\n   * @default false\n   * @example true\n   */\n  muted: boolean\n\n  /**\n   * The preload behavior for the audio element.\n   * @default 'metadata'\n   * @example 'none'\n   */\n  preload: 'auto' | 'metadata' | 'none' | null\n\n  /**\n   * Provides the controlslist attribute for the audio element.\n   * @default undefined\n   * @example 'nodownload'\n   */\n  controlslist?: string\n\n  /**\n   * Sets the crossorigin attribute for the audio element.\n   * @default undefined\n   * @example 'anonymous'\n   */\n  crossorigin?: '' | 'anonymous' | 'use-credentials'\n\n  /**\n   * Controls if remote playback should be disabled on the audio element.\n   * @default false\n   * @example true\n   */\n  disableRemotePlayback: boolean\n\n  /**\n   * Allows data: URLs for audio sources.\n   * @default false\n   * @example true\n   */\n  allowBase64: boolean\n\n  /**\n   * The HTML attributes for an audio node.\n   * @default {}\n   * @example { class: 'foo' }\n   */\n  HTMLAttributes: Record<string, any>\n\n  /**\n   * Controls if the audio node should be inline or not.\n   * @default false\n   * @example true\n   */\n  inline: boolean\n}\n\n/**\n * The options for setting an audio element.\n */\ntype SetAudioOptions = {\n  src: string\n  controls?: boolean\n  autoplay?: boolean\n  loop?: boolean\n  muted?: boolean\n  preload?: 'auto' | 'metadata' | 'none' | null\n  controlslist?: string\n  crossorigin?: '' | 'anonymous' | 'use-credentials'\n  disableremoteplayback?: boolean\n  HTMLAttributes?: Record<string, any>\n}\n\ndeclare module '@tiptap/core' {\n  interface Commands<ReturnType> {\n    audio: {\n      /**\n       * Insert an audio element\n       * @param options The audio attributes\n       * @example editor.commands.setAudio({ src: 'https://assets.tiptap.dev/sounds/loop.mp3' })\n       */\n      setAudio: (options: SetAudioOptions) => ReturnType\n    }\n  }\n}\n\n/**\n * This extension adds support for native audio elements.\n */\nexport const Audio = Node.create<AudioOptions>({\n  name: 'audio',\n\n  addOptions() {\n    return {\n      addPasteHandler: true,\n      allowBase64: false,\n      autoplay: false,\n      controls: true,\n      loop: false,\n      muted: false,\n      preload: 'metadata',\n      controlslist: undefined,\n      crossorigin: undefined,\n      disableRemotePlayback: false,\n      HTMLAttributes: {},\n      inline: false,\n    }\n  },\n\n  inline() {\n    return this.options.inline\n  },\n\n  group() {\n    return this.options.inline ? 'inline' : 'block'\n  },\n\n  atom: true,\n\n  draggable: true,\n\n  addAttributes() {\n    return {\n      src: {\n        default: null,\n      },\n      controls: {\n        default: this.options.controls,\n      },\n      autoplay: {\n        default: this.options.autoplay,\n      },\n      loop: {\n        default: this.options.loop,\n      },\n      muted: {\n        default: this.options.muted,\n      },\n      preload: {\n        default: this.options.preload,\n      },\n      controlslist: {\n        default: this.options.controlslist,\n      },\n      crossorigin: {\n        default: this.options.crossorigin,\n      },\n      disableremoteplayback: {\n        default: this.options.disableRemotePlayback,\n      },\n    }\n  },\n\n  parseHTML() {\n    return [\n      {\n        tag: this.options.allowBase64 ? 'audio[src]' : 'audio[src]:not([src^=\"data:\"])',\n      },\n    ]\n  },\n\n  addCommands() {\n    return {\n      setAudio:\n        options =>\n        ({ commands }) => {\n          if (!isValidAudioUrl(options.src, this.options.allowBase64)) {\n            return false\n          }\n\n          return commands.insertContent({\n            type: this.name,\n            attrs: options,\n          })\n        },\n    }\n  },\n\n  addPasteRules() {\n    if (!this.options.addPasteHandler) {\n      return []\n    }\n\n    return [\n      nodePasteRule({\n        find: AUDIO_URL_REGEX_GLOBAL,\n        type: this.type,\n        getAttributes: match => {\n          return { src: match[0] }\n        },\n      }),\n    ]\n  },\n\n  renderHTML({ HTMLAttributes }) {\n    const sanitizedSrc = sanitizeAudioSrc(HTMLAttributes.src, this.options.allowBase64)\n\n    const mergedAttributes = mergeAttributes(\n      this.options.HTMLAttributes,\n      {\n        controls: this.options.controls,\n        autoplay: this.options.autoplay,\n        loop: this.options.loop,\n        muted: this.options.muted,\n        preload: this.options.preload,\n        controlslist: this.options.controlslist,\n        crossorigin: this.options.crossorigin,\n        disableremoteplayback: this.options.disableRemotePlayback,\n      },\n      {\n        ...HTMLAttributes,\n        src: sanitizedSrc,\n      },\n    )\n\n    const cleanedAttributes = Object.fromEntries(\n      Object.entries(mergedAttributes).filter(([, value]) => value !== null && value !== undefined && value !== false),\n    )\n\n    return ['audio', cleanedAttributes]\n  },\n\n  ...createAtomBlockMarkdownSpec({\n    nodeName: 'audio',\n    allowedAttributes: [\n      'src',\n      'controls',\n      'autoplay',\n      'loop',\n      'muted',\n      'preload',\n      'controlslist',\n      'crossorigin',\n      'disableremoteplayback',\n    ],\n  }),\n})\n","/**\n * Regular expression to match URLs pointing to common audio file formats.\n * Matches http/https URLs ending in: mp3, wav, ogg, oga, flac, m4a, aac, opus, weba, webm.\n * Supports optional query strings. Case-insensitive, single match.\n */\nexport const AUDIO_URL_REGEX = /https?:\\/\\/[^\\s]+?\\.(?:mp3|wav|ogg|oga|flac|m4a|aac|opus|weba|webm)(?:\\?[^\\s]*)?/i\n\n/**\n * Global variant of AUDIO_URL_REGEX for matching multiple audio URLs in a string.\n * Use this when you need to find all audio URLs in a block of text.\n */\nexport const AUDIO_URL_REGEX_GLOBAL =\n  /https?:\\/\\/[^\\s]+?\\.(?:mp3|wav|ogg|oga|flac|m4a|aac|opus|weba|webm)(?:\\?[^\\s]*)?/gi\n\n/**\n * Regular expression to match base64-encoded audio data URLs.\n */\nconst AUDIO_DATA_URL_REGEX = /^data:audio\\/[a-zA-Z0-9.+-]+;base64,/i\n\n/**\n * Validates whether a URL is safe for use in an audio element.\n * Allows http, https, protocol-relative, and relative paths by default.\n * Data URLs can be enabled via the allowBase64 flag.\n *\n * @param url - The URL string to validate\n * @param allowBase64 - Whether to allow base64 data URLs (default: false)\n * @returns True if the URL is valid and safe, false otherwise\n */\nexport const isValidAudioUrl = (url: string, allowBase64 = false) => {\n  if (!url) {\n    return false\n  }\n\n  if (allowBase64 && AUDIO_DATA_URL_REGEX.test(url)) {\n    return true\n  }\n\n  if (url.startsWith('//')) {\n    return true\n  }\n\n  if (url.startsWith('/') || url.startsWith('./') || url.startsWith('../')) {\n    return true\n  }\n\n  try {\n    const parsedUrl = new URL(url)\n\n    return parsedUrl.protocol === 'http:' || parsedUrl.protocol === 'https:'\n  } catch {\n    return false\n  }\n}\n\n/**\n * Sanitizes an audio source URL by validating it against allowed protocols.\n * Returns null for invalid or potentially unsafe URLs.\n *\n * @param url - The URL string to sanitize (can be null or undefined)\n * @param allowBase64 - Whether to allow base64 data URLs (default: false)\n * @returns The original URL if valid, or null if invalid/unsafe\n */\nexport const sanitizeAudioSrc = (url: string | null | undefined, allowBase64 = false) => {\n  if (!url) {\n    return null\n  }\n\n  return isValidAudioUrl(url, allowBase64) ? url : null\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,kBAAkF;;;ACK3E,IAAM,kBAAkB;AAMxB,IAAM,yBACX;AAKF,IAAM,uBAAuB;AAWtB,IAAM,kBAAkB,CAAC,KAAa,cAAc,UAAU;AACnE,MAAI,CAAC,KAAK;AACR,WAAO;AAAA,EACT;AAEA,MAAI,eAAe,qBAAqB,KAAK,GAAG,GAAG;AACjD,WAAO;AAAA,EACT;AAEA,MAAI,IAAI,WAAW,IAAI,GAAG;AACxB,WAAO;AAAA,EACT;AAEA,MAAI,IAAI,WAAW,GAAG,KAAK,IAAI,WAAW,IAAI,KAAK,IAAI,WAAW,KAAK,GAAG;AACxE,WAAO;AAAA,EACT;AAEA,MAAI;AACF,UAAM,YAAY,IAAI,IAAI,GAAG;AAE7B,WAAO,UAAU,aAAa,WAAW,UAAU,aAAa;AAAA,EAClE,QAAQ;AACN,WAAO;AAAA,EACT;AACF;AAUO,IAAM,mBAAmB,CAAC,KAAgC,cAAc,UAAU;AACvF,MAAI,CAAC,KAAK;AACR,WAAO;AAAA,EACT;AAEA,SAAO,gBAAgB,KAAK,WAAW,IAAI,MAAM;AACnD;;;ADsDO,IAAM,QAAQ,iBAAK,OAAqB;AAAA,EAC7C,MAAM;AAAA,EAEN,aAAa;AACX,WAAO;AAAA,MACL,iBAAiB;AAAA,MACjB,aAAa;AAAA,MACb,UAAU;AAAA,MACV,UAAU;AAAA,MACV,MAAM;AAAA,MACN,OAAO;AAAA,MACP,SAAS;AAAA,MACT,cAAc;AAAA,MACd,aAAa;AAAA,MACb,uBAAuB;AAAA,MACvB,gBAAgB,CAAC;AAAA,MACjB,QAAQ;AAAA,IACV;AAAA,EACF;AAAA,EAEA,SAAS;AACP,WAAO,KAAK,QAAQ;AAAA,EACtB;AAAA,EAEA,QAAQ;AACN,WAAO,KAAK,QAAQ,SAAS,WAAW;AAAA,EAC1C;AAAA,EAEA,MAAM;AAAA,EAEN,WAAW;AAAA,EAEX,gBAAgB;AACd,WAAO;AAAA,MACL,KAAK;AAAA,QACH,SAAS;AAAA,MACX;AAAA,MACA,UAAU;AAAA,QACR,SAAS,KAAK,QAAQ;AAAA,MACxB;AAAA,MACA,UAAU;AAAA,QACR,SAAS,KAAK,QAAQ;AAAA,MACxB;AAAA,MACA,MAAM;AAAA,QACJ,SAAS,KAAK,QAAQ;AAAA,MACxB;AAAA,MACA,OAAO;AAAA,QACL,SAAS,KAAK,QAAQ;AAAA,MACxB;AAAA,MACA,SAAS;AAAA,QACP,SAAS,KAAK,QAAQ;AAAA,MACxB;AAAA,MACA,cAAc;AAAA,QACZ,SAAS,KAAK,QAAQ;AAAA,MACxB;AAAA,MACA,aAAa;AAAA,QACX,SAAS,KAAK,QAAQ;AAAA,MACxB;AAAA,MACA,uBAAuB;AAAA,QACrB,SAAS,KAAK,QAAQ;AAAA,MACxB;AAAA,IACF;AAAA,EACF;AAAA,EAEA,YAAY;AACV,WAAO;AAAA,MACL;AAAA,QACE,KAAK,KAAK,QAAQ,cAAc,eAAe;AAAA,MACjD;AAAA,IACF;AAAA,EACF;AAAA,EAEA,cAAc;AACZ,WAAO;AAAA,MACL,UACE,aACA,CAAC,EAAE,SAAS,MAAM;AAChB,YAAI,CAAC,gBAAgB,QAAQ,KAAK,KAAK,QAAQ,WAAW,GAAG;AAC3D,iBAAO;AAAA,QACT;AAEA,eAAO,SAAS,cAAc;AAAA,UAC5B,MAAM,KAAK;AAAA,UACX,OAAO;AAAA,QACT,CAAC;AAAA,MACH;AAAA,IACJ;AAAA,EACF;AAAA,EAEA,gBAAgB;AACd,QAAI,CAAC,KAAK,QAAQ,iBAAiB;AACjC,aAAO,CAAC;AAAA,IACV;AAEA,WAAO;AAAA,UACL,2BAAc;AAAA,QACZ,MAAM;AAAA,QACN,MAAM,KAAK;AAAA,QACX,eAAe,WAAS;AACtB,iBAAO,EAAE,KAAK,MAAM,CAAC,EAAE;AAAA,QACzB;AAAA,MACF,CAAC;AAAA,IACH;AAAA,EACF;AAAA,EAEA,WAAW,EAAE,eAAe,GAAG;AAC7B,UAAM,eAAe,iBAAiB,eAAe,KAAK,KAAK,QAAQ,WAAW;AAElF,UAAM,uBAAmB;AAAA,MACvB,KAAK,QAAQ;AAAA,MACb;AAAA,QACE,UAAU,KAAK,QAAQ;AAAA,QACvB,UAAU,KAAK,QAAQ;AAAA,QACvB,MAAM,KAAK,QAAQ;AAAA,QACnB,OAAO,KAAK,QAAQ;AAAA,QACpB,SAAS,KAAK,QAAQ;AAAA,QACtB,cAAc,KAAK,QAAQ;AAAA,QAC3B,aAAa,KAAK,QAAQ;AAAA,QAC1B,uBAAuB,KAAK,QAAQ;AAAA,MACtC;AAAA,MACA;AAAA,QACE,GAAG;AAAA,QACH,KAAK;AAAA,MACP;AAAA,IACF;AAEA,UAAM,oBAAoB,OAAO;AAAA,MAC/B,OAAO,QAAQ,gBAAgB,EAAE,OAAO,CAAC,CAAC,EAAE,KAAK,MAAM,UAAU,QAAQ,UAAU,UAAa,UAAU,KAAK;AAAA,IACjH;AAEA,WAAO,CAAC,SAAS,iBAAiB;AAAA,EACpC;AAAA,EAEA,OAAG,yCAA4B;AAAA,IAC7B,UAAU;AAAA,IACV,mBAAmB;AAAA,MACjB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF,CAAC;AACH,CAAC;;;ADxQD,IAAO,gBAAQ;","names":[]}

package/dist/index.d.cts

@@ -0,0 +1,140 @@
+import { Node } from '@tiptap/core';
+
+interface AudioOptions {
+    /**
+     * Controls if the paste handler for audio sources should be added.
+     * @default true
+     * @example false
+     */
+    addPasteHandler: boolean;
+    /**
+     * Controls if the audio should autoplay.
+     * @default false
+     * @example true
+     */
+    autoplay: boolean;
+    /**
+     * Controls if the audio element should render the native controls.
+     * @default true
+     * @example false
+     */
+    controls: boolean;
+    /**
+     * Controls if the audio should loop.
+     * @default false
+     * @example true
+     */
+    loop: boolean;
+    /**
+     * Controls if the audio should be muted.
+     * @default false
+     * @example true
+     */
+    muted: boolean;
+    /**
+     * The preload behavior for the audio element.
+     * @default 'metadata'
+     * @example 'none'
+     */
+    preload: 'auto' | 'metadata' | 'none' | null;
+    /**
+     * Provides the controlslist attribute for the audio element.
+     * @default undefined
+     * @example 'nodownload'
+     */
+    controlslist?: string;
+    /**
+     * Sets the crossorigin attribute for the audio element.
+     * @default undefined
+     * @example 'anonymous'
+     */
+    crossorigin?: '' | 'anonymous' | 'use-credentials';
+    /**
+     * Controls if remote playback should be disabled on the audio element.
+     * @default false
+     * @example true
+     */
+    disableRemotePlayback: boolean;
+    /**
+     * Allows data: URLs for audio sources.
+     * @default false
+     * @example true
+     */
+    allowBase64: boolean;
+    /**
+     * The HTML attributes for an audio node.
+     * @default {}
+     * @example { class: 'foo' }
+     */
+    HTMLAttributes: Record<string, any>;
+    /**
+     * Controls if the audio node should be inline or not.
+     * @default false
+     * @example true
+     */
+    inline: boolean;
+}
+/**
+ * The options for setting an audio element.
+ */
+type SetAudioOptions = {
+    src: string;
+    controls?: boolean;
+    autoplay?: boolean;
+    loop?: boolean;
+    muted?: boolean;
+    preload?: 'auto' | 'metadata' | 'none' | null;
+    controlslist?: string;
+    crossorigin?: '' | 'anonymous' | 'use-credentials';
+    disableremoteplayback?: boolean;
+    HTMLAttributes?: Record<string, any>;
+};
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        audio: {
+            /**
+             * Insert an audio element
+             * @param options The audio attributes
+             * @example editor.commands.setAudio({ src: 'https://assets.tiptap.dev/sounds/loop.mp3' })
+             */
+            setAudio: (options: SetAudioOptions) => ReturnType;
+        };
+    }
+}
+/**
+ * This extension adds support for native audio elements.
+ */
+declare const Audio: Node<AudioOptions, any>;
+
+/**
+ * Regular expression to match URLs pointing to common audio file formats.
+ * Matches http/https URLs ending in: mp3, wav, ogg, oga, flac, m4a, aac, opus, weba, webm.
+ * Supports optional query strings. Case-insensitive, single match.
+ */
+declare const AUDIO_URL_REGEX: RegExp;
+/**
+ * Global variant of AUDIO_URL_REGEX for matching multiple audio URLs in a string.
+ * Use this when you need to find all audio URLs in a block of text.
+ */
+declare const AUDIO_URL_REGEX_GLOBAL: RegExp;
+/**
+ * Validates whether a URL is safe for use in an audio element.
+ * Allows http, https, protocol-relative, and relative paths by default.
+ * Data URLs can be enabled via the allowBase64 flag.
+ *
+ * @param url - The URL string to validate
+ * @param allowBase64 - Whether to allow base64 data URLs (default: false)
+ * @returns True if the URL is valid and safe, false otherwise
+ */
+declare const isValidAudioUrl: (url: string, allowBase64?: boolean) => boolean;
+/**
+ * Sanitizes an audio source URL by validating it against allowed protocols.
+ * Returns null for invalid or potentially unsafe URLs.
+ *
+ * @param url - The URL string to sanitize (can be null or undefined)
+ * @param allowBase64 - Whether to allow base64 data URLs (default: false)
+ * @returns The original URL if valid, or null if invalid/unsafe
+ */
+declare const sanitizeAudioSrc: (url: string | null | undefined, allowBase64?: boolean) => string | null;
+
+export { AUDIO_URL_REGEX, AUDIO_URL_REGEX_GLOBAL, Audio, type AudioOptions, Audio as default, isValidAudioUrl, sanitizeAudioSrc };

package/dist/index.d.ts

@@ -0,0 +1,140 @@
+import { Node } from '@tiptap/core';
+
+interface AudioOptions {
+    /**
+     * Controls if the paste handler for audio sources should be added.
+     * @default true
+     * @example false
+     */
+    addPasteHandler: boolean;
+    /**
+     * Controls if the audio should autoplay.
+     * @default false
+     * @example true
+     */
+    autoplay: boolean;
+    /**
+     * Controls if the audio element should render the native controls.
+     * @default true
+     * @example false
+     */
+    controls: boolean;
+    /**
+     * Controls if the audio should loop.
+     * @default false
+     * @example true
+     */
+    loop: boolean;
+    /**
+     * Controls if the audio should be muted.
+     * @default false
+     * @example true
+     */
+    muted: boolean;
+    /**
+     * The preload behavior for the audio element.
+     * @default 'metadata'
+     * @example 'none'
+     */
+    preload: 'auto' | 'metadata' | 'none' | null;
+    /**
+     * Provides the controlslist attribute for the audio element.
+     * @default undefined
+     * @example 'nodownload'
+     */
+    controlslist?: string;
+    /**
+     * Sets the crossorigin attribute for the audio element.
+     * @default undefined
+     * @example 'anonymous'
+     */
+    crossorigin?: '' | 'anonymous' | 'use-credentials';
+    /**
+     * Controls if remote playback should be disabled on the audio element.
+     * @default false
+     * @example true
+     */
+    disableRemotePlayback: boolean;
+    /**
+     * Allows data: URLs for audio sources.
+     * @default false
+     * @example true
+     */
+    allowBase64: boolean;
+    /**
+     * The HTML attributes for an audio node.
+     * @default {}
+     * @example { class: 'foo' }
+     */
+    HTMLAttributes: Record<string, any>;
+    /**
+     * Controls if the audio node should be inline or not.
+     * @default false
+     * @example true
+     */
+    inline: boolean;
+}
+/**
+ * The options for setting an audio element.
+ */
+type SetAudioOptions = {
+    src: string;
+    controls?: boolean;
+    autoplay?: boolean;
+    loop?: boolean;
+    muted?: boolean;
+    preload?: 'auto' | 'metadata' | 'none' | null;
+    controlslist?: string;
+    crossorigin?: '' | 'anonymous' | 'use-credentials';
+    disableremoteplayback?: boolean;
+    HTMLAttributes?: Record<string, any>;
+};
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        audio: {
+            /**
+             * Insert an audio element
+             * @param options The audio attributes
+             * @example editor.commands.setAudio({ src: 'https://assets.tiptap.dev/sounds/loop.mp3' })
+             */
+            setAudio: (options: SetAudioOptions) => ReturnType;
+        };
+    }
+}
+/**
+ * This extension adds support for native audio elements.
+ */
+declare const Audio: Node<AudioOptions, any>;
+
+/**
+ * Regular expression to match URLs pointing to common audio file formats.
+ * Matches http/https URLs ending in: mp3, wav, ogg, oga, flac, m4a, aac, opus, weba, webm.
+ * Supports optional query strings. Case-insensitive, single match.
+ */
+declare const AUDIO_URL_REGEX: RegExp;
+/**
+ * Global variant of AUDIO_URL_REGEX for matching multiple audio URLs in a string.
+ * Use this when you need to find all audio URLs in a block of text.
+ */
+declare const AUDIO_URL_REGEX_GLOBAL: RegExp;
+/**
+ * Validates whether a URL is safe for use in an audio element.
+ * Allows http, https, protocol-relative, and relative paths by default.
+ * Data URLs can be enabled via the allowBase64 flag.
+ *
+ * @param url - The URL string to validate
+ * @param allowBase64 - Whether to allow base64 data URLs (default: false)
+ * @returns True if the URL is valid and safe, false otherwise
+ */
+declare const isValidAudioUrl: (url: string, allowBase64?: boolean) => boolean;
+/**
+ * Sanitizes an audio source URL by validating it against allowed protocols.
+ * Returns null for invalid or potentially unsafe URLs.
+ *
+ * @param url - The URL string to sanitize (can be null or undefined)
+ * @param allowBase64 - Whether to allow base64 data URLs (default: false)
+ * @returns The original URL if valid, or null if invalid/unsafe
+ */
+declare const sanitizeAudioSrc: (url: string | null | undefined, allowBase64?: boolean) => string | null;
+
+export { AUDIO_URL_REGEX, AUDIO_URL_REGEX_GLOBAL, Audio, type AudioOptions, Audio as default, isValidAudioUrl, sanitizeAudioSrc };

package/dist/index.js

@@ -0,0 +1,177 @@
+// src/audio.ts
+import { createAtomBlockMarkdownSpec, mergeAttributes, Node, nodePasteRule } from "@tiptap/core";
+
+// src/utils.ts
+var AUDIO_URL_REGEX = /https?:\/\/[^\s]+?\.(?:mp3|wav|ogg|oga|flac|m4a|aac|opus|weba|webm)(?:\?[^\s]*)?/i;
+var AUDIO_URL_REGEX_GLOBAL = /https?:\/\/[^\s]+?\.(?:mp3|wav|ogg|oga|flac|m4a|aac|opus|weba|webm)(?:\?[^\s]*)?/gi;
+var AUDIO_DATA_URL_REGEX = /^data:audio\/[a-zA-Z0-9.+-]+;base64,/i;
+var isValidAudioUrl = (url, allowBase64 = false) => {
+  if (!url) {
+    return false;
+  }
+  if (allowBase64 && AUDIO_DATA_URL_REGEX.test(url)) {
+    return true;
+  }
+  if (url.startsWith("//")) {
+    return true;
+  }
+  if (url.startsWith("/") || url.startsWith("./") || url.startsWith("../")) {
+    return true;
+  }
+  try {
+    const parsedUrl = new URL(url);
+    return parsedUrl.protocol === "http:" || parsedUrl.protocol === "https:";
+  } catch {
+    return false;
+  }
+};
+var sanitizeAudioSrc = (url, allowBase64 = false) => {
+  if (!url) {
+    return null;
+  }
+  return isValidAudioUrl(url, allowBase64) ? url : null;
+};
+
+// src/audio.ts
+var Audio = Node.create({
+  name: "audio",
+  addOptions() {
+    return {
+      addPasteHandler: true,
+      allowBase64: false,
+      autoplay: false,
+      controls: true,
+      loop: false,
+      muted: false,
+      preload: "metadata",
+      controlslist: void 0,
+      crossorigin: void 0,
+      disableRemotePlayback: false,
+      HTMLAttributes: {},
+      inline: false
+    };
+  },
+  inline() {
+    return this.options.inline;
+  },
+  group() {
+    return this.options.inline ? "inline" : "block";
+  },
+  atom: true,
+  draggable: true,
+  addAttributes() {
+    return {
+      src: {
+        default: null
+      },
+      controls: {
+        default: this.options.controls
+      },
+      autoplay: {
+        default: this.options.autoplay
+      },
+      loop: {
+        default: this.options.loop
+      },
+      muted: {
+        default: this.options.muted
+      },
+      preload: {
+        default: this.options.preload
+      },
+      controlslist: {
+        default: this.options.controlslist
+      },
+      crossorigin: {
+        default: this.options.crossorigin
+      },
+      disableremoteplayback: {
+        default: this.options.disableRemotePlayback
+      }
+    };
+  },
+  parseHTML() {
+    return [
+      {
+        tag: this.options.allowBase64 ? "audio[src]" : 'audio[src]:not([src^="data:"])'
+      }
+    ];
+  },
+  addCommands() {
+    return {
+      setAudio: (options) => ({ commands }) => {
+        if (!isValidAudioUrl(options.src, this.options.allowBase64)) {
+          return false;
+        }
+        return commands.insertContent({
+          type: this.name,
+          attrs: options
+        });
+      }
+    };
+  },
+  addPasteRules() {
+    if (!this.options.addPasteHandler) {
+      return [];
+    }
+    return [
+      nodePasteRule({
+        find: AUDIO_URL_REGEX_GLOBAL,
+        type: this.type,
+        getAttributes: (match) => {
+          return { src: match[0] };
+        }
+      })
+    ];
+  },
+  renderHTML({ HTMLAttributes }) {
+    const sanitizedSrc = sanitizeAudioSrc(HTMLAttributes.src, this.options.allowBase64);
+    const mergedAttributes = mergeAttributes(
+      this.options.HTMLAttributes,
+      {
+        controls: this.options.controls,
+        autoplay: this.options.autoplay,
+        loop: this.options.loop,
+        muted: this.options.muted,
+        preload: this.options.preload,
+        controlslist: this.options.controlslist,
+        crossorigin: this.options.crossorigin,
+        disableremoteplayback: this.options.disableRemotePlayback
+      },
+      {
+        ...HTMLAttributes,
+        src: sanitizedSrc
+      }
+    );
+    const cleanedAttributes = Object.fromEntries(
+      Object.entries(mergedAttributes).filter(([, value]) => value !== null && value !== void 0 && value !== false)
+    );
+    return ["audio", cleanedAttributes];
+  },
+  ...createAtomBlockMarkdownSpec({
+    nodeName: "audio",
+    allowedAttributes: [
+      "src",
+      "controls",
+      "autoplay",
+      "loop",
+      "muted",
+      "preload",
+      "controlslist",
+      "crossorigin",
+      "disableremoteplayback"
+    ]
+  })
+});
+
+// src/index.ts
+var index_default = Audio;
+export {
+  AUDIO_URL_REGEX,
+  AUDIO_URL_REGEX_GLOBAL,
+  Audio,
+  index_default as default,
+  isValidAudioUrl,
+  sanitizeAudioSrc
+};
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/audio.ts","../src/utils.ts","../src/index.ts"],"sourcesContent":["import { createAtomBlockMarkdownSpec, mergeAttributes, Node, nodePasteRule } from '@tiptap/core'\n\nimport { AUDIO_URL_REGEX_GLOBAL, isValidAudioUrl, sanitizeAudioSrc } from './utils.js'\n\nexport interface AudioOptions {\n  /**\n   * Controls if the paste handler for audio sources should be added.\n   * @default true\n   * @example false\n   */\n  addPasteHandler: boolean\n\n  /**\n   * Controls if the audio should autoplay.\n   * @default false\n   * @example true\n   */\n  autoplay: boolean\n\n  /**\n   * Controls if the audio element should render the native controls.\n   * @default true\n   * @example false\n   */\n  controls: boolean\n\n  /**\n   * Controls if the audio should loop.\n   * @default false\n   * @example true\n   */\n  loop: boolean\n\n  /**\n   * Controls if the audio should be muted.\n   * @default false\n   * @example true\n   */\n  muted: boolean\n\n  /**\n   * The preload behavior for the audio element.\n   * @default 'metadata'\n   * @example 'none'\n   */\n  preload: 'auto' | 'metadata' | 'none' | null\n\n  /**\n   * Provides the controlslist attribute for the audio element.\n   * @default undefined\n   * @example 'nodownload'\n   */\n  controlslist?: string\n\n  /**\n   * Sets the crossorigin attribute for the audio element.\n   * @default undefined\n   * @example 'anonymous'\n   */\n  crossorigin?: '' | 'anonymous' | 'use-credentials'\n\n  /**\n   * Controls if remote playback should be disabled on the audio element.\n   * @default false\n   * @example true\n   */\n  disableRemotePlayback: boolean\n\n  /**\n   * Allows data: URLs for audio sources.\n   * @default false\n   * @example true\n   */\n  allowBase64: boolean\n\n  /**\n   * The HTML attributes for an audio node.\n   * @default {}\n   * @example { class: 'foo' }\n   */\n  HTMLAttributes: Record<string, any>\n\n  /**\n   * Controls if the audio node should be inline or not.\n   * @default false\n   * @example true\n   */\n  inline: boolean\n}\n\n/**\n * The options for setting an audio element.\n */\ntype SetAudioOptions = {\n  src: string\n  controls?: boolean\n  autoplay?: boolean\n  loop?: boolean\n  muted?: boolean\n  preload?: 'auto' | 'metadata' | 'none' | null\n  controlslist?: string\n  crossorigin?: '' | 'anonymous' | 'use-credentials'\n  disableremoteplayback?: boolean\n  HTMLAttributes?: Record<string, any>\n}\n\ndeclare module '@tiptap/core' {\n  interface Commands<ReturnType> {\n    audio: {\n      /**\n       * Insert an audio element\n       * @param options The audio attributes\n       * @example editor.commands.setAudio({ src: 'https://assets.tiptap.dev/sounds/loop.mp3' })\n       */\n      setAudio: (options: SetAudioOptions) => ReturnType\n    }\n  }\n}\n\n/**\n * This extension adds support for native audio elements.\n */\nexport const Audio = Node.create<AudioOptions>({\n  name: 'audio',\n\n  addOptions() {\n    return {\n      addPasteHandler: true,\n      allowBase64: false,\n      autoplay: false,\n      controls: true,\n      loop: false,\n      muted: false,\n      preload: 'metadata',\n      controlslist: undefined,\n      crossorigin: undefined,\n      disableRemotePlayback: false,\n      HTMLAttributes: {},\n      inline: false,\n    }\n  },\n\n  inline() {\n    return this.options.inline\n  },\n\n  group() {\n    return this.options.inline ? 'inline' : 'block'\n  },\n\n  atom: true,\n\n  draggable: true,\n\n  addAttributes() {\n    return {\n      src: {\n        default: null,\n      },\n      controls: {\n        default: this.options.controls,\n      },\n      autoplay: {\n        default: this.options.autoplay,\n      },\n      loop: {\n        default: this.options.loop,\n      },\n      muted: {\n        default: this.options.muted,\n      },\n      preload: {\n        default: this.options.preload,\n      },\n      controlslist: {\n        default: this.options.controlslist,\n      },\n      crossorigin: {\n        default: this.options.crossorigin,\n      },\n      disableremoteplayback: {\n        default: this.options.disableRemotePlayback,\n      },\n    }\n  },\n\n  parseHTML() {\n    return [\n      {\n        tag: this.options.allowBase64 ? 'audio[src]' : 'audio[src]:not([src^=\"data:\"])',\n      },\n    ]\n  },\n\n  addCommands() {\n    return {\n      setAudio:\n        options =>\n        ({ commands }) => {\n          if (!isValidAudioUrl(options.src, this.options.allowBase64)) {\n            return false\n          }\n\n          return commands.insertContent({\n            type: this.name,\n            attrs: options,\n          })\n        },\n    }\n  },\n\n  addPasteRules() {\n    if (!this.options.addPasteHandler) {\n      return []\n    }\n\n    return [\n      nodePasteRule({\n        find: AUDIO_URL_REGEX_GLOBAL,\n        type: this.type,\n        getAttributes: match => {\n          return { src: match[0] }\n        },\n      }),\n    ]\n  },\n\n  renderHTML({ HTMLAttributes }) {\n    const sanitizedSrc = sanitizeAudioSrc(HTMLAttributes.src, this.options.allowBase64)\n\n    const mergedAttributes = mergeAttributes(\n      this.options.HTMLAttributes,\n      {\n        controls: this.options.controls,\n        autoplay: this.options.autoplay,\n        loop: this.options.loop,\n        muted: this.options.muted,\n        preload: this.options.preload,\n        controlslist: this.options.controlslist,\n        crossorigin: this.options.crossorigin,\n        disableremoteplayback: this.options.disableRemotePlayback,\n      },\n      {\n        ...HTMLAttributes,\n        src: sanitizedSrc,\n      },\n    )\n\n    const cleanedAttributes = Object.fromEntries(\n      Object.entries(mergedAttributes).filter(([, value]) => value !== null && value !== undefined && value !== false),\n    )\n\n    return ['audio', cleanedAttributes]\n  },\n\n  ...createAtomBlockMarkdownSpec({\n    nodeName: 'audio',\n    allowedAttributes: [\n      'src',\n      'controls',\n      'autoplay',\n      'loop',\n      'muted',\n      'preload',\n      'controlslist',\n      'crossorigin',\n      'disableremoteplayback',\n    ],\n  }),\n})\n","/**\n * Regular expression to match URLs pointing to common audio file formats.\n * Matches http/https URLs ending in: mp3, wav, ogg, oga, flac, m4a, aac, opus, weba, webm.\n * Supports optional query strings. Case-insensitive, single match.\n */\nexport const AUDIO_URL_REGEX = /https?:\\/\\/[^\\s]+?\\.(?:mp3|wav|ogg|oga|flac|m4a|aac|opus|weba|webm)(?:\\?[^\\s]*)?/i\n\n/**\n * Global variant of AUDIO_URL_REGEX for matching multiple audio URLs in a string.\n * Use this when you need to find all audio URLs in a block of text.\n */\nexport const AUDIO_URL_REGEX_GLOBAL =\n  /https?:\\/\\/[^\\s]+?\\.(?:mp3|wav|ogg|oga|flac|m4a|aac|opus|weba|webm)(?:\\?[^\\s]*)?/gi\n\n/**\n * Regular expression to match base64-encoded audio data URLs.\n */\nconst AUDIO_DATA_URL_REGEX = /^data:audio\\/[a-zA-Z0-9.+-]+;base64,/i\n\n/**\n * Validates whether a URL is safe for use in an audio element.\n * Allows http, https, protocol-relative, and relative paths by default.\n * Data URLs can be enabled via the allowBase64 flag.\n *\n * @param url - The URL string to validate\n * @param allowBase64 - Whether to allow base64 data URLs (default: false)\n * @returns True if the URL is valid and safe, false otherwise\n */\nexport const isValidAudioUrl = (url: string, allowBase64 = false) => {\n  if (!url) {\n    return false\n  }\n\n  if (allowBase64 && AUDIO_DATA_URL_REGEX.test(url)) {\n    return true\n  }\n\n  if (url.startsWith('//')) {\n    return true\n  }\n\n  if (url.startsWith('/') || url.startsWith('./') || url.startsWith('../')) {\n    return true\n  }\n\n  try {\n    const parsedUrl = new URL(url)\n\n    return parsedUrl.protocol === 'http:' || parsedUrl.protocol === 'https:'\n  } catch {\n    return false\n  }\n}\n\n/**\n * Sanitizes an audio source URL by validating it against allowed protocols.\n * Returns null for invalid or potentially unsafe URLs.\n *\n * @param url - The URL string to sanitize (can be null or undefined)\n * @param allowBase64 - Whether to allow base64 data URLs (default: false)\n * @returns The original URL if valid, or null if invalid/unsafe\n */\nexport const sanitizeAudioSrc = (url: string | null | undefined, allowBase64 = false) => {\n  if (!url) {\n    return null\n  }\n\n  return isValidAudioUrl(url, allowBase64) ? url : null\n}\n","import { Audio } from './audio.js'\n\nexport * from './audio.js'\nexport * from './utils.js'\n\nexport default Audio\n"],"mappings":";AAAA,SAAS,6BAA6B,iBAAiB,MAAM,qBAAqB;;;ACK3E,IAAM,kBAAkB;AAMxB,IAAM,yBACX;AAKF,IAAM,uBAAuB;AAWtB,IAAM,kBAAkB,CAAC,KAAa,cAAc,UAAU;AACnE,MAAI,CAAC,KAAK;AACR,WAAO;AAAA,EACT;AAEA,MAAI,eAAe,qBAAqB,KAAK,GAAG,GAAG;AACjD,WAAO;AAAA,EACT;AAEA,MAAI,IAAI,WAAW,IAAI,GAAG;AACxB,WAAO;AAAA,EACT;AAEA,MAAI,IAAI,WAAW,GAAG,KAAK,IAAI,WAAW,IAAI,KAAK,IAAI,WAAW,KAAK,GAAG;AACxE,WAAO;AAAA,EACT;AAEA,MAAI;AACF,UAAM,YAAY,IAAI,IAAI,GAAG;AAE7B,WAAO,UAAU,aAAa,WAAW,UAAU,aAAa;AAAA,EAClE,QAAQ;AACN,WAAO;AAAA,EACT;AACF;AAUO,IAAM,mBAAmB,CAAC,KAAgC,cAAc,UAAU;AACvF,MAAI,CAAC,KAAK;AACR,WAAO;AAAA,EACT;AAEA,SAAO,gBAAgB,KAAK,WAAW,IAAI,MAAM;AACnD;;;ADsDO,IAAM,QAAQ,KAAK,OAAqB;AAAA,EAC7C,MAAM;AAAA,EAEN,aAAa;AACX,WAAO;AAAA,MACL,iBAAiB;AAAA,MACjB,aAAa;AAAA,MACb,UAAU;AAAA,MACV,UAAU;AAAA,MACV,MAAM;AAAA,MACN,OAAO;AAAA,MACP,SAAS;AAAA,MACT,cAAc;AAAA,MACd,aAAa;AAAA,MACb,uBAAuB;AAAA,MACvB,gBAAgB,CAAC;AAAA,MACjB,QAAQ;AAAA,IACV;AAAA,EACF;AAAA,EAEA,SAAS;AACP,WAAO,KAAK,QAAQ;AAAA,EACtB;AAAA,EAEA,QAAQ;AACN,WAAO,KAAK,QAAQ,SAAS,WAAW;AAAA,EAC1C;AAAA,EAEA,MAAM;AAAA,EAEN,WAAW;AAAA,EAEX,gBAAgB;AACd,WAAO;AAAA,MACL,KAAK;AAAA,QACH,SAAS;AAAA,MACX;AAAA,MACA,UAAU;AAAA,QACR,SAAS,KAAK,QAAQ;AAAA,MACxB;AAAA,MACA,UAAU;AAAA,QACR,SAAS,KAAK,QAAQ;AAAA,MACxB;AAAA,MACA,MAAM;AAAA,QACJ,SAAS,KAAK,QAAQ;AAAA,MACxB;AAAA,MACA,OAAO;AAAA,QACL,SAAS,KAAK,QAAQ;AAAA,MACxB;AAAA,MACA,SAAS;AAAA,QACP,SAAS,KAAK,QAAQ;AAAA,MACxB;AAAA,MACA,cAAc;AAAA,QACZ,SAAS,KAAK,QAAQ;AAAA,MACxB;AAAA,MACA,aAAa;AAAA,QACX,SAAS,KAAK,QAAQ;AAAA,MACxB;AAAA,MACA,uBAAuB;AAAA,QACrB,SAAS,KAAK,QAAQ;AAAA,MACxB;AAAA,IACF;AAAA,EACF;AAAA,EAEA,YAAY;AACV,WAAO;AAAA,MACL;AAAA,QACE,KAAK,KAAK,QAAQ,cAAc,eAAe;AAAA,MACjD;AAAA,IACF;AAAA,EACF;AAAA,EAEA,cAAc;AACZ,WAAO;AAAA,MACL,UACE,aACA,CAAC,EAAE,SAAS,MAAM;AAChB,YAAI,CAAC,gBAAgB,QAAQ,KAAK,KAAK,QAAQ,WAAW,GAAG;AAC3D,iBAAO;AAAA,QACT;AAEA,eAAO,SAAS,cAAc;AAAA,UAC5B,MAAM,KAAK;AAAA,UACX,OAAO;AAAA,QACT,CAAC;AAAA,MACH;AAAA,IACJ;AAAA,EACF;AAAA,EAEA,gBAAgB;AACd,QAAI,CAAC,KAAK,QAAQ,iBAAiB;AACjC,aAAO,CAAC;AAAA,IACV;AAEA,WAAO;AAAA,MACL,cAAc;AAAA,QACZ,MAAM;AAAA,QACN,MAAM,KAAK;AAAA,QACX,eAAe,WAAS;AACtB,iBAAO,EAAE,KAAK,MAAM,CAAC,EAAE;AAAA,QACzB;AAAA,MACF,CAAC;AAAA,IACH;AAAA,EACF;AAAA,EAEA,WAAW,EAAE,eAAe,GAAG;AAC7B,UAAM,eAAe,iBAAiB,eAAe,KAAK,KAAK,QAAQ,WAAW;AAElF,UAAM,mBAAmB;AAAA,MACvB,KAAK,QAAQ;AAAA,MACb;AAAA,QACE,UAAU,KAAK,QAAQ;AAAA,QACvB,UAAU,KAAK,QAAQ;AAAA,QACvB,MAAM,KAAK,QAAQ;AAAA,QACnB,OAAO,KAAK,QAAQ;AAAA,QACpB,SAAS,KAAK,QAAQ;AAAA,QACtB,cAAc,KAAK,QAAQ;AAAA,QAC3B,aAAa,KAAK,QAAQ;AAAA,QAC1B,uBAAuB,KAAK,QAAQ;AAAA,MACtC;AAAA,MACA;AAAA,QACE,GAAG;AAAA,QACH,KAAK;AAAA,MACP;AAAA,IACF;AAEA,UAAM,oBAAoB,OAAO;AAAA,MAC/B,OAAO,QAAQ,gBAAgB,EAAE,OAAO,CAAC,CAAC,EAAE,KAAK,MAAM,UAAU,QAAQ,UAAU,UAAa,UAAU,KAAK;AAAA,IACjH;AAEA,WAAO,CAAC,SAAS,iBAAiB;AAAA,EACpC;AAAA,EAEA,GAAG,4BAA4B;AAAA,IAC7B,UAAU;AAAA,IACV,mBAAmB;AAAA,MACjB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF,CAAC;AACH,CAAC;;;AExQD,IAAO,gBAAQ;","names":[]}

package/package.json

@@ -0,0 +1,48 @@
+{
+  "name": "@tiptap/extension-audio",
+  "description": "audio extension for tiptap",
+  "version": "3.16.0",
+  "homepage": "https://tiptap.dev",
+  "keywords": [
+    "tiptap",
+    "tiptap extension"
+  ],
+  "license": "MIT",
+  "funding": {
+    "type": "github",
+    "url": "https://github.com/sponsors/ueberdosis"
+  },
+  "type": "module",
+  "exports": {
+    ".": {
+      "types": {
+        "import": "./dist/index.d.ts",
+        "require": "./dist/index.d.cts"
+      },
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    }
+  },
+  "main": "dist/index.cjs",
+  "module": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "files": [
+    "src",
+    "dist"
+  ],
+  "devDependencies": {
+    "@tiptap/core": "^3.16.0"
+  },
+  "peerDependencies": {
+    "@tiptap/core": "^3.16.0"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/ueberdosis/tiptap",
+    "directory": "packages/extension-audio"
+  },
+  "scripts": {
+    "build": "tsup",
+    "lint": "prettier ./src/ --check && eslint --cache --quiet --no-error-on-unmatched-pattern ./src/"
+  }
+}

package/src/audio.ts

@@ -0,0 +1,270 @@
+import { createAtomBlockMarkdownSpec, mergeAttributes, Node, nodePasteRule } from '@tiptap/core'
+
+import { AUDIO_URL_REGEX_GLOBAL, isValidAudioUrl, sanitizeAudioSrc } from './utils.js'
+
+export interface AudioOptions {
+  /**
+   * Controls if the paste handler for audio sources should be added.
+   * @default true
+   * @example false
+   */
+  addPasteHandler: boolean
+
+  /**
+   * Controls if the audio should autoplay.
+   * @default false
+   * @example true
+   */
+  autoplay: boolean
+
+  /**
+   * Controls if the audio element should render the native controls.
+   * @default true
+   * @example false
+   */
+  controls: boolean
+
+  /**
+   * Controls if the audio should loop.
+   * @default false
+   * @example true
+   */
+  loop: boolean
+
+  /**
+   * Controls if the audio should be muted.
+   * @default false
+   * @example true
+   */
+  muted: boolean
+
+  /**
+   * The preload behavior for the audio element.
+   * @default 'metadata'
+   * @example 'none'
+   */
+  preload: 'auto' | 'metadata' | 'none' | null
+
+  /**
+   * Provides the controlslist attribute for the audio element.
+   * @default undefined
+   * @example 'nodownload'
+   */
+  controlslist?: string
+
+  /**
+   * Sets the crossorigin attribute for the audio element.
+   * @default undefined
+   * @example 'anonymous'
+   */
+  crossorigin?: '' | 'anonymous' | 'use-credentials'
+
+  /**
+   * Controls if remote playback should be disabled on the audio element.
+   * @default false
+   * @example true
+   */
+  disableRemotePlayback: boolean
+
+  /**
+   * Allows data: URLs for audio sources.
+   * @default false
+   * @example true
+   */
+  allowBase64: boolean
+
+  /**
+   * The HTML attributes for an audio node.
+   * @default {}
+   * @example { class: 'foo' }
+   */
+  HTMLAttributes: Record<string, any>
+
+  /**
+   * Controls if the audio node should be inline or not.
+   * @default false
+   * @example true
+   */
+  inline: boolean
+}
+
+/**
+ * The options for setting an audio element.
+ */
+type SetAudioOptions = {
+  src: string
+  controls?: boolean
+  autoplay?: boolean
+  loop?: boolean
+  muted?: boolean
+  preload?: 'auto' | 'metadata' | 'none' | null
+  controlslist?: string
+  crossorigin?: '' | 'anonymous' | 'use-credentials'
+  disableremoteplayback?: boolean
+  HTMLAttributes?: Record<string, any>
+}
+
+declare module '@tiptap/core' {
+  interface Commands<ReturnType> {
+    audio: {
+      /**
+       * Insert an audio element
+       * @param options The audio attributes
+       * @example editor.commands.setAudio({ src: 'https://assets.tiptap.dev/sounds/loop.mp3' })
+       */
+      setAudio: (options: SetAudioOptions) => ReturnType
+    }
+  }
+}
+
+/**
+ * This extension adds support for native audio elements.
+ */
+export const Audio = Node.create<AudioOptions>({
+  name: 'audio',
+
+  addOptions() {
+    return {
+      addPasteHandler: true,
+      allowBase64: false,
+      autoplay: false,
+      controls: true,
+      loop: false,
+      muted: false,
+      preload: 'metadata',
+      controlslist: undefined,
+      crossorigin: undefined,
+      disableRemotePlayback: false,
+      HTMLAttributes: {},
+      inline: false,
+    }
+  },
+
+  inline() {
+    return this.options.inline
+  },
+
+  group() {
+    return this.options.inline ? 'inline' : 'block'
+  },
+
+  atom: true,
+
+  draggable: true,
+
+  addAttributes() {
+    return {
+      src: {
+        default: null,
+      },
+      controls: {
+        default: this.options.controls,
+      },
+      autoplay: {
+        default: this.options.autoplay,
+      },
+      loop: {
+        default: this.options.loop,
+      },
+      muted: {
+        default: this.options.muted,
+      },
+      preload: {
+        default: this.options.preload,
+      },
+      controlslist: {
+        default: this.options.controlslist,
+      },
+      crossorigin: {
+        default: this.options.crossorigin,
+      },
+      disableremoteplayback: {
+        default: this.options.disableRemotePlayback,
+      },
+    }
+  },
+
+  parseHTML() {
+    return [
+      {
+        tag: this.options.allowBase64 ? 'audio[src]' : 'audio[src]:not([src^="data:"])',
+      },
+    ]
+  },
+
+  addCommands() {
+    return {
+      setAudio:
+        options =>
+        ({ commands }) => {
+          if (!isValidAudioUrl(options.src, this.options.allowBase64)) {
+            return false
+          }
+
+          return commands.insertContent({
+            type: this.name,
+            attrs: options,
+          })
+        },
+    }
+  },
+
+  addPasteRules() {
+    if (!this.options.addPasteHandler) {
+      return []
+    }
+
+    return [
+      nodePasteRule({
+        find: AUDIO_URL_REGEX_GLOBAL,
+        type: this.type,
+        getAttributes: match => {
+          return { src: match[0] }
+        },
+      }),
+    ]
+  },
+
+  renderHTML({ HTMLAttributes }) {
+    const sanitizedSrc = sanitizeAudioSrc(HTMLAttributes.src, this.options.allowBase64)
+
+    const mergedAttributes = mergeAttributes(
+      this.options.HTMLAttributes,
+      {
+        controls: this.options.controls,
+        autoplay: this.options.autoplay,
+        loop: this.options.loop,
+        muted: this.options.muted,
+        preload: this.options.preload,
+        controlslist: this.options.controlslist,
+        crossorigin: this.options.crossorigin,
+        disableremoteplayback: this.options.disableRemotePlayback,
+      },
+      {
+        ...HTMLAttributes,
+        src: sanitizedSrc,
+      },
+    )
+
+    const cleanedAttributes = Object.fromEntries(
+      Object.entries(mergedAttributes).filter(([, value]) => value !== null && value !== undefined && value !== false),
+    )
+
+    return ['audio', cleanedAttributes]
+  },
+
+  ...createAtomBlockMarkdownSpec({
+    nodeName: 'audio',
+    allowedAttributes: [
+      'src',
+      'controls',
+      'autoplay',
+      'loop',
+      'muted',
+      'preload',
+      'controlslist',
+      'crossorigin',
+      'disableremoteplayback',
+    ],
+  }),
+})

package/src/index.ts

@@ -0,0 +1,6 @@
+import { Audio } from './audio.js'
+
+export * from './audio.js'
+export * from './utils.js'
+
+export default Audio

package/src/utils.ts

@@ -0,0 +1,69 @@
+/**
+ * Regular expression to match URLs pointing to common audio file formats.
+ * Matches http/https URLs ending in: mp3, wav, ogg, oga, flac, m4a, aac, opus, weba, webm.
+ * Supports optional query strings. Case-insensitive, single match.
+ */
+export const AUDIO_URL_REGEX = /https?:\/\/[^\s]+?\.(?:mp3|wav|ogg|oga|flac|m4a|aac|opus|weba|webm)(?:\?[^\s]*)?/i
+
+/**
+ * Global variant of AUDIO_URL_REGEX for matching multiple audio URLs in a string.
+ * Use this when you need to find all audio URLs in a block of text.
+ */
+export const AUDIO_URL_REGEX_GLOBAL =
+  /https?:\/\/[^\s]+?\.(?:mp3|wav|ogg|oga|flac|m4a|aac|opus|weba|webm)(?:\?[^\s]*)?/gi
+
+/**
+ * Regular expression to match base64-encoded audio data URLs.
+ */
+const AUDIO_DATA_URL_REGEX = /^data:audio\/[a-zA-Z0-9.+-]+;base64,/i
+
+/**
+ * Validates whether a URL is safe for use in an audio element.
+ * Allows http, https, protocol-relative, and relative paths by default.
+ * Data URLs can be enabled via the allowBase64 flag.
+ *
+ * @param url - The URL string to validate
+ * @param allowBase64 - Whether to allow base64 data URLs (default: false)
+ * @returns True if the URL is valid and safe, false otherwise
+ */
+export const isValidAudioUrl = (url: string, allowBase64 = false) => {
+  if (!url) {
+    return false
+  }
+
+  if (allowBase64 && AUDIO_DATA_URL_REGEX.test(url)) {
+    return true
+  }
+
+  if (url.startsWith('//')) {
+    return true
+  }
+
+  if (url.startsWith('/') || url.startsWith('./') || url.startsWith('../')) {
+    return true
+  }
+
+  try {
+    const parsedUrl = new URL(url)
+
+    return parsedUrl.protocol === 'http:' || parsedUrl.protocol === 'https:'
+  } catch {
+    return false
+  }
+}
+
+/**
+ * Sanitizes an audio source URL by validating it against allowed protocols.
+ * Returns null for invalid or potentially unsafe URLs.
+ *
+ * @param url - The URL string to sanitize (can be null or undefined)
+ * @param allowBase64 - Whether to allow base64 data URLs (default: false)
+ * @returns The original URL if valid, or null if invalid/unsafe
+ */
+export const sanitizeAudioSrc = (url: string | null | undefined, allowBase64 = false) => {
+  if (!url) {
+    return null
+  }
+
+  return isValidAudioUrl(url, allowBase64) ? url : null
+}