@haklex/rich-ext-embed 0.0.1

package/LICENSE

@@ -0,0 +1,28 @@
+MIT License
+
+Copyright (c) 2024 Innei
+
+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.
+
+
+Additional Terms and Conditions
+
+----------------
+
+Use of this software is governed by the terms of MIT and, in addition, by the terms and conditions described in the additional file (ADDITIONAL_TERMS.md). By using this software, you agree to abide by these additional terms and conditions.

package/README.md

@@ -0,0 +1,60 @@
+# @haklex/rich-ext-embed
+
+嵌入内容扩展（Twitter、YouTube、Bilibili 等）。
+
+## 安装
+
+```bash
+pnpm add @haklex/rich-ext-embed @haklex/rich-editor
+```
+
+## 导出
+
+```ts
+// 节点
+export { EmbedNode } from './nodes/EmbedNode'
+export { $createEmbedNode, $isEmbedNode } from './nodes/EmbedNode'
+export type { SerializedEmbedNode } from './nodes/EmbedNode'
+
+export { EmbedEditNode } from './nodes/EmbedEditNode'
+export { $createEmbedEditNode, $isEmbedEditNode } from './nodes/EmbedEditNode'
+
+export { embedNodes, embedEditNodes } from './nodes'
+
+// 插件
+export { EmbedPlugin, INSERT_EMBED_COMMAND } from './EmbedPlugin'
+export type { EmbedPluginProps } from './EmbedPlugin'
+
+// 渲染器
+export { EmbedStaticRenderer } from './renderers/EmbedStaticRenderer'
+export type { EmbedStaticRendererProps } from './renderers/EmbedStaticRenderer'
+export { EmbedLinkRenderer } from './renderers/EmbedLinkRenderer'
+export type { EmbedLinkRendererProps } from './renderers/EmbedLinkRenderer'
+
+// 上下文
+export { EmbedRendererProvider, useEmbedRenderers } from './context/EmbedRendererContext'
+export type { EmbedRendererComponent, EmbedRendererMap } from './context/EmbedRendererContext'
+
+// URL 匹配器
+export type { EmbedType } from './url-matchers'
+export { 
+  matchEmbedUrl, isTweetUrl, isYoutubeUrl, 
+  isBilibiliVideoUrl, isGistUrl, isCodesandboxUrl,
+  isGithubFilePreviewUrl, createSelfThinkingMatcher 
+} from './url-matchers'
+```
+
+## 使用
+
+```tsx
+import { EmbedPlugin, embedEditNodes } from '@haklex/rich-ext-embed'
+import { RichEditor } from '@haklex/rich-editor'
+
+<RichEditor extraNodes={[...embedEditNodes]}>
+  <EmbedPlugin />
+</RichEditor>
+```
+
+## License
+
+MIT

package/dist/EmbedPlugin.d.ts

@@ -0,0 +1,6 @@
+export declare const INSERT_EMBED_COMMAND: import('lexical').LexicalCommand<string>;
+export interface EmbedPluginProps {
+    selfHostnames?: string[];
+}
+export declare function EmbedPlugin({ selfHostnames }: EmbedPluginProps): null;
+//# sourceMappingURL=EmbedPlugin.d.ts.map

package/dist/EmbedPlugin.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmbedPlugin.d.ts","sourceRoot":"","sources":["../src/EmbedPlugin.tsx"],"names":[],"mappings":"AAYA,eAAO,MAAM,oBAAoB,0CAAwC,CAAA;AAEzE,MAAM,WAAW,gBAAgB;IAC/B,aAAa,CAAC,EAAE,MAAM,EAAE,CAAA;CACzB;AAED,wBAAgB,WAAW,CAAC,EAAE,aAAa,EAAE,EAAE,gBAAgB,QA6D9D"}

package/dist/context/EmbedRendererContext.d.ts

@@ -0,0 +1,9 @@
+import { ComponentType } from 'react';
+export type EmbedRendererComponent = ComponentType<{
+    url: string;
+    type: string | null;
+}>;
+export type EmbedRendererMap = Partial<Record<string, EmbedRendererComponent>>;
+export declare const EmbedRendererProvider: import('react').Provider<Partial<Record<string, EmbedRendererComponent>>>;
+export declare function useEmbedRenderers(): EmbedRendererMap;
+//# sourceMappingURL=EmbedRendererContext.d.ts.map

package/dist/context/EmbedRendererContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmbedRendererContext.d.ts","sourceRoot":"","sources":["../../src/context/EmbedRendererContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAG1C,MAAM,MAAM,sBAAsB,GAAG,aAAa,CAAC;IACjD,GAAG,EAAE,MAAM,CAAA;IACX,IAAI,EAAE,MAAM,GAAG,IAAI,CAAA;CACpB,CAAC,CAAA;AAEF,MAAM,MAAM,gBAAgB,GAAG,OAAO,CAAC,MAAM,CAAC,MAAM,EAAE,sBAAsB,CAAC,CAAC,CAAA;AAI9E,eAAO,MAAM,qBAAqB,2EAA4B,CAAA;AAE9D,wBAAgB,iBAAiB,IAAI,gBAAgB,CAEpD"}

package/dist/index.d.ts

@@ -0,0 +1,15 @@
+export type { SerializedEmbedNode } from './nodes/EmbedNode';
+export { $createEmbedNode, $isEmbedNode, EmbedNode } from './nodes/EmbedNode';
+export { $createEmbedEditNode, $isEmbedEditNode, EmbedEditNode, } from './nodes/EmbedEditNode';
+export { embedEditNodes, embedNodes } from './nodes';
+export type { EmbedPluginProps } from './EmbedPlugin';
+export { EmbedPlugin, INSERT_EMBED_COMMAND } from './EmbedPlugin';
+export type { EmbedLinkRendererProps } from './renderers/EmbedLinkRenderer';
+export { EmbedLinkRenderer } from './renderers/EmbedLinkRenderer';
+export type { EmbedStaticRendererProps } from './renderers/EmbedStaticRenderer';
+export { EmbedStaticRenderer } from './renderers/EmbedStaticRenderer';
+export type { EmbedRendererComponent, EmbedRendererMap, } from './context/EmbedRendererContext';
+export { EmbedRendererProvider, useEmbedRenderers, } from './context/EmbedRendererContext';
+export type { EmbedType } from './url-matchers';
+export { createSelfThinkingMatcher, isBilibiliVideoUrl, isCodesandboxUrl, isGistUrl, isGithubFilePreviewUrl, isTweetUrl, isYoutubeUrl, matchEmbedUrl, } from './url-matchers';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,YAAY,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAA;AAC5D,OAAO,EAAE,gBAAgB,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAA;AAG7E,OAAO,EACL,oBAAoB,EACpB,gBAAgB,EAChB,aAAa,GACd,MAAM,uBAAuB,CAAA;AAG9B,OAAO,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AAGpD,YAAY,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAA;AACrD,OAAO,EAAE,WAAW,EAAE,oBAAoB,EAAE,MAAM,eAAe,CAAA;AAGjE,YAAY,EAAE,sBAAsB,EAAE,MAAM,+BAA+B,CAAA;AAC3E,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAA;AACjE,YAAY,EAAE,wBAAwB,EAAE,MAAM,iCAAiC,CAAA;AAC/E,OAAO,EAAE,mBAAmB,EAAE,MAAM,iCAAiC,CAAA;AAGrE,YAAY,EACV,sBAAsB,EACtB,gBAAgB,GACjB,MAAM,gCAAgC,CAAA;AACvC,OAAO,EACL,qBAAqB,EACrB,iBAAiB,GAClB,MAAM,gCAAgC,CAAA;AAGvC,YAAY,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAA;AAC/C,OAAO,EACL,yBAAyB,EACzB,kBAAkB,EAClB,gBAAgB,EAChB,SAAS,EACT,sBAAsB,EACtB,UAAU,EACV,YAAY,EACZ,aAAa,GACd,MAAM,gBAAgB,CAAA"}

package/dist/index.mjs

@@ -0,0 +1,663 @@
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+import { DecoratorNode, $getNodeByKey, $insertNodes, createCommand, PASTE_COMMAND, COMMAND_PRIORITY_LOW } from "lexical";
+import { createContext, use, lazy, useState, useMemo, useEffect, Suspense, Component, createElement, useRef, useCallback } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useColorScheme } from "@haklex/rich-editor";
+import { Github, ExternalLink, Trash2, Code } from "lucide-react";
+import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext";
+const EmbedRendererCtx = createContext({});
+const EmbedRendererProvider = EmbedRendererCtx.Provider;
+function useEmbedRenderers() {
+  return use(EmbedRendererCtx);
+}
+const extToLang = {
+  ".js": "javascript",
+  ".ts": "typescript",
+  ".mjs": "javascript",
+  ".cjs": "javascript",
+  ".mts": "typescript",
+  ".cts": "typescript",
+  ".jsx": "jsx",
+  ".tsx": "tsx",
+  ".md": "markdown",
+  ".css": "css",
+  ".scss": "scss",
+  ".html": "html",
+  ".json": "json",
+  ".yml": "yaml",
+  ".yaml": "yaml",
+  ".toml": "toml",
+  ".xml": "xml",
+  ".sh": "bash",
+  ".bash": "bash",
+  ".zsh": "bash",
+  ".go": "go",
+  ".py": "python",
+  ".rb": "ruby",
+  ".java": "java",
+  ".c": "c",
+  ".cpp": "cpp",
+  ".cs": "csharp",
+  ".rs": "rust",
+  ".swift": "swift",
+  ".kt": "kotlin",
+  ".lua": "lua",
+  ".sql": "sql",
+  ".graphql": "graphql",
+  ".scala": "scala",
+  ".dart": "dart",
+  ".vue": "vue",
+  ".h": "c",
+  ".hpp": "cpp",
+  ".m": "objectivec",
+  ".ex": "elixir",
+  ".r": "r"
+};
+function getLangFromPath(path) {
+  const dot = path.lastIndexOf(".");
+  if (dot === -1) return "text";
+  return extToLang[path.slice(dot).toLowerCase()] || "text";
+}
+const shikiPromise = import("shiki/bundle/web").catch(() => null);
+const typeLabels$1 = {
+  tweet: "X / Twitter",
+  youtube: "YouTube",
+  codesandbox: "CodeSandbox",
+  bilibili: "Bilibili",
+  "github-file": "GitHub File",
+  "github-gist": "GitHub Gist",
+  thinking: "Thinking"
+};
+const LazyTweet = lazy(
+  () => import("react-tweet").then((mod) => ({ default: mod.Tweet }))
+);
+class EmbedErrorBoundary extends Component {
+  constructor() {
+    super(...arguments);
+    __publicField(this, "state", { hasError: false });
+  }
+  static getDerivedStateFromError() {
+    return { hasError: true };
+  }
+  render() {
+    return this.state.hasError ? this.props.fallback : this.props.children;
+  }
+}
+function GitHubSvg() {
+  return /* @__PURE__ */ jsx(Github, { size: 16 });
+}
+function FixedRatioContainer({
+  children,
+  ratio = 58
+}) {
+  return /* @__PURE__ */ jsx("div", { className: "embed-static-ratio-container", children: /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: "embed-static-ratio-inner",
+      style: { paddingBottom: `${ratio}%` },
+      children
+    }
+  ) });
+}
+function FallbackLink({ url, type }) {
+  const label = type ? typeLabels$1[type] : "Embed";
+  const cssModifier = type || "generic";
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: `embed-static-fallback embed-static-fallback--${cssModifier}`,
+      children: [
+        /* @__PURE__ */ jsxs("span", { className: "embed-static-fallback__badge", children: [
+          /* @__PURE__ */ jsx("span", { className: "embed-static-fallback__dot" }),
+          label
+        ] }),
+        /* @__PURE__ */ jsx(
+          "a",
+          {
+            className: "embed-static-fallback__link",
+            href: url,
+            target: "_blank",
+            rel: "noreferrer",
+            children: url
+          }
+        )
+      ]
+    }
+  );
+}
+function TweetRenderer({ url }) {
+  let parsedUrl = null;
+  try {
+    parsedUrl = new URL(url);
+  } catch {
+    return /* @__PURE__ */ jsx(FallbackLink, { url, type: "tweet" });
+  }
+  const id = parsedUrl.pathname.split("/").pop();
+  if (!id) return /* @__PURE__ */ jsx(FallbackLink, { url, type: "tweet" });
+  const fallback = /* @__PURE__ */ jsx(FallbackLink, { url, type: "tweet" });
+  return /* @__PURE__ */ jsx(EmbedErrorBoundary, { fallback, children: /* @__PURE__ */ jsx("div", { className: "embed-static-tweet", children: /* @__PURE__ */ jsx(
+    Suspense,
+    {
+      fallback: /* @__PURE__ */ jsx("div", { className: "embed-static-loading", children: "Loading tweet..." }),
+      children: /* @__PURE__ */ jsx(LazyTweet, { id })
+    }
+  ) }) });
+}
+function GithubFileEmbed({ url, href }) {
+  const colorScheme = useColorScheme();
+  const shikiTheme = colorScheme === "dark" ? "github-dark" : "github-light";
+  const split = url.pathname.split("/");
+  const [, owner, repo, , ...rest] = split;
+  const ref = rest[0];
+  const path = ref ? rest.slice(1).join("/") : rest.join("/");
+  const matchResult = url.hash.match(/L\d+/g);
+  let startLine = 0;
+  let endLine;
+  if (matchResult) {
+    if (matchResult.length === 1) {
+      startLine = Number.parseInt(matchResult[0].slice(1)) - 1;
+      endLine = startLine + 1;
+    } else {
+      startLine = Number.parseInt(matchResult[0].slice(1)) - 1;
+      endLine = Number.parseInt(matchResult[1].slice(1));
+    }
+  }
+  const [content, setContent] = useState(null);
+  const [highlightedHtml, setHighlightedHtml] = useState(null);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState(false);
+  const lang = useMemo(() => getLangFromPath(path), [path]);
+  useEffect(() => {
+    let cancelled = false;
+    setContent(null);
+    setHighlightedHtml(null);
+    setLoading(true);
+    setError(false);
+    const fetchPromise = fetch(
+      `https://cdn.jsdelivr.net/gh/${owner}/${repo}${ref ? `@${ref}` : ""}/${path}`
+    ).then((res) => {
+      if (!res.ok) throw new Error(`HTTP ${res.status}`);
+      return res.text();
+    });
+    Promise.all([fetchPromise, shikiPromise]).then(([text, shikiMod]) => {
+      if (cancelled) return;
+      setContent(text);
+      const lines2 = text.split("\n");
+      const end2 = endLine ?? lines2.length;
+      const displayCode = lines2.slice(startLine, end2).join("\n");
+      if (!shikiMod) {
+        setLoading(false);
+        return;
+      }
+      shikiMod.codeToHtml(displayCode, {
+        lang,
+        theme: shikiTheme
+      }).then((html) => {
+        if (!cancelled) {
+          setHighlightedHtml(html);
+          setLoading(false);
+        }
+      }).catch(() => {
+        if (!cancelled) setLoading(false);
+      });
+    }).catch(() => {
+      if (!cancelled) {
+        setError(true);
+        setLoading(false);
+      }
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [owner, repo, ref, path, lang, startLine, endLine, shikiTheme]);
+  if (loading) {
+    return /* @__PURE__ */ jsx("div", { className: "embed-static-loading", children: "Loading GitHub File Preview..." });
+  }
+  if (error || content === null) {
+    return /* @__PURE__ */ jsx(FallbackLink, { url: href, type: "github-file" });
+  }
+  const lines = content.split("\n");
+  const end = endLine ?? lines.length;
+  const isLong = end - startLine > 20;
+  return /* @__PURE__ */ jsxs("div", { className: "embed-static-github-file", children: [
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: `embed-static-github-file__code${isLong ? " embed-static-github-file__code--long" : ""}`,
+        children: highlightedHtml ? /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: "embed-static-shiki",
+            style: { "--start-line": startLine },
+            dangerouslySetInnerHTML: { __html: highlightedHtml }
+          }
+        ) : /* @__PURE__ */ jsx("pre", { children: /* @__PURE__ */ jsx("code", { children: lines.slice(startLine, end).map((line, i) => /* @__PURE__ */ jsxs("span", { className: "embed-static-github-file__line", children: [
+          /* @__PURE__ */ jsx("span", { className: "embed-static-github-file__line-num", children: startLine + i + 1 }),
+          line,
+          "\n"
+        ] }, i)) }) })
+      }
+    ),
+    /* @__PURE__ */ jsxs(
+      "a",
+      {
+        className: "embed-static-source-link",
+        href,
+        target: "_blank",
+        rel: "noreferrer",
+        children: [
+          /* @__PURE__ */ jsx(GitHubSvg, {}),
+          /* @__PURE__ */ jsx("span", { children: href })
+        ]
+      }
+    )
+  ] });
+}
+function EmbedStaticRenderer({ type, url }) {
+  const customRenderers = useEmbedRenderers();
+  if (!url) return null;
+  if (type && customRenderers[type]) {
+    const Custom = customRenderers[type];
+    return /* @__PURE__ */ jsx(Custom, { url, type });
+  }
+  let parsedUrl = null;
+  try {
+    parsedUrl = new URL(url);
+  } catch {
+    return /* @__PURE__ */ jsx(FallbackLink, { url, type });
+  }
+  switch (type) {
+    case "tweet": {
+      return /* @__PURE__ */ jsx(TweetRenderer, { url });
+    }
+    case "youtube": {
+      const id = parsedUrl.searchParams.get("v");
+      if (!id) return /* @__PURE__ */ jsx(FallbackLink, { url, type });
+      return /* @__PURE__ */ jsx(FixedRatioContainer, { children: /* @__PURE__ */ jsx(
+        "iframe",
+        {
+          src: `https://www.youtube.com/embed/${id}`,
+          className: "embed-static-iframe",
+          allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",
+          allowFullScreen: true,
+          title: "YouTube video player"
+        }
+      ) });
+    }
+    case "bilibili": {
+      const id = parsedUrl.pathname.split("/")[2];
+      if (!id) return /* @__PURE__ */ jsx(FallbackLink, { url, type });
+      return /* @__PURE__ */ jsx(FixedRatioContainer, { children: /* @__PURE__ */ jsx(
+        "iframe",
+        {
+          src: `//player.bilibili.com/player.html?bvid=${id}&autoplay=0`,
+          scrolling: "no",
+          className: "embed-static-iframe",
+          allowFullScreen: true
+        }
+      ) });
+    }
+    case "codesandbox": {
+      const path = parsedUrl.pathname.slice(2);
+      return /* @__PURE__ */ jsx(FixedRatioContainer, { children: /* @__PURE__ */ jsx(
+        "iframe",
+        {
+          className: "embed-static-iframe",
+          src: `https://codesandbox.io/embed/${path}?fontsize=14&hidenavigation=1&theme=dark${parsedUrl.search}`
+        }
+      ) });
+    }
+    case "github-gist": {
+      const [, owner, id] = parsedUrl.pathname.split("/");
+      if (!owner || !id) return /* @__PURE__ */ jsx(FallbackLink, { url, type });
+      return /* @__PURE__ */ jsxs("div", { className: "embed-static-gist", children: [
+        /* @__PURE__ */ jsx(
+          "iframe",
+          {
+            src: `https://gist.github.com/${owner}/${id}.pibb`,
+            className: "embed-static-gist__iframe"
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          "a",
+          {
+            className: "embed-static-source-link",
+            href: url,
+            target: "_blank",
+            rel: "noreferrer",
+            children: [
+              /* @__PURE__ */ jsx(GitHubSvg, {}),
+              /* @__PURE__ */ jsx("span", { children: url })
+            ]
+          }
+        )
+      ] });
+    }
+    case "github-file": {
+      return /* @__PURE__ */ jsx(GithubFileEmbed, { url: parsedUrl, href: url });
+    }
+    default:
+      return /* @__PURE__ */ jsx(FallbackLink, { url, type });
+  }
+}
+class EmbedNode extends DecoratorNode {
+  constructor(url, source, key) {
+    super(key);
+    __publicField(this, "__url");
+    __publicField(this, "__source");
+    this.__url = url;
+    this.__source = source;
+  }
+  static getType() {
+    return "embed";
+  }
+  static clone(node) {
+    return new EmbedNode(node.__url, node.__source, node.__key);
+  }
+  createDOM(_config) {
+    const div = document.createElement("div");
+    div.className = "rich-embed-link-wrapper";
+    return div;
+  }
+  updateDOM() {
+    return false;
+  }
+  isInline() {
+    return false;
+  }
+  static importJSON(serializedNode) {
+    return $createEmbedNode(serializedNode.url, serializedNode.source);
+  }
+  exportJSON() {
+    return {
+      ...super.exportJSON(),
+      type: "embed",
+      url: this.__url,
+      source: this.__source,
+      version: 1
+    };
+  }
+  getUrl() {
+    return this.getLatest().__url;
+  }
+  setUrl(url) {
+    const writable = this.getWritable();
+    writable.__url = url;
+  }
+  getSource() {
+    return this.getLatest().__source;
+  }
+  setSource(source) {
+    const writable = this.getWritable();
+    writable.__source = source;
+  }
+  decorate(_editor, _config) {
+    return createElement(EmbedStaticRenderer, {
+      type: this.__source,
+      url: this.__url
+    });
+  }
+}
+function $createEmbedNode(url, source) {
+  return new EmbedNode(url, source);
+}
+function $isEmbedNode(node) {
+  return node instanceof EmbedNode;
+}
+const isTweetUrl = (url) => (url.hostname === "twitter.com" || url.hostname === "x.com") && url.pathname.startsWith("/");
+const isYoutubeUrl = (url) => url.hostname === "www.youtube.com" && url.pathname.startsWith("/watch");
+const isCodesandboxUrl = (url) => url.hostname === "codesandbox.io" && url.pathname.split("/").length === 3;
+const isBilibiliVideoUrl = (url) => url.hostname.includes("bilibili.com") && url.pathname.startsWith("/video/BV");
+const isGithubFilePreviewUrl = (url) => {
+  const [, , , type] = url.pathname.split("/");
+  return url.hostname === "github.com" && type === "blob";
+};
+const isGistUrl = (url) => url.hostname === "gist.github.com";
+function createSelfThinkingMatcher(hostnames) {
+  return (url) => hostnames.includes(url.hostname) && url.pathname.startsWith("/thinking/");
+}
+function matchEmbedUrl(url, selfThinkingMatcher) {
+  if (isTweetUrl(url)) return "tweet";
+  if (isYoutubeUrl(url)) return "youtube";
+  if (isCodesandboxUrl(url)) return "codesandbox";
+  if (isBilibiliVideoUrl(url)) return "bilibili";
+  if (isGithubFilePreviewUrl(url)) return "github-file";
+  if (isGistUrl(url)) return "github-gist";
+  if (selfThinkingMatcher?.(url)) return "thinking";
+  return null;
+}
+const typeLabels = {
+  tweet: "X / Twitter",
+  youtube: "YouTube",
+  codesandbox: "CodeSandbox",
+  bilibili: "Bilibili",
+  "github-file": "GitHub File",
+  "github-gist": "GitHub Gist",
+  thinking: "Thinking"
+};
+function EmbedLinkRenderer({
+  type,
+  url,
+  nodeKey
+}) {
+  const [editor] = useLexicalComposerContext();
+  const [editUrl, setEditUrl] = useState(url);
+  const inputRef = useRef(null);
+  useEffect(() => {
+    setEditUrl(url);
+  }, [url]);
+  useEffect(() => {
+    if (!url) {
+      inputRef.current?.focus();
+    }
+  }, [url]);
+  const commitUrl = useCallback(() => {
+    const trimmed = editUrl.trim();
+    if (!trimmed) return;
+    editor.update(() => {
+      const node = $getNodeByKey(nodeKey);
+      if (!node || !("setUrl" in node)) return;
+      const n = node;
+      const currentUrl = n.getUrl?.();
+      if (currentUrl !== trimmed) {
+        n.setUrl(trimmed);
+      }
+      if (n.setSource) {
+        try {
+          n.setSource(matchEmbedUrl(new URL(trimmed)));
+        } catch {
+        }
+      }
+    });
+  }, [editor, nodeKey, editUrl]);
+  const handleKeyDown = useCallback(
+    (e) => {
+      if (e.key === "Enter") {
+        e.preventDefault();
+        commitUrl();
+        inputRef.current?.blur();
+      } else if (e.key === "Escape") {
+        e.preventDefault();
+        setEditUrl(url);
+        inputRef.current?.blur();
+      }
+    },
+    [commitUrl, url]
+  );
+  const handleDelete = useCallback(() => {
+    editor.update(() => {
+      const node = $getNodeByKey(nodeKey);
+      if (node) node.remove();
+    });
+  }, [editor, nodeKey]);
+  const handleOpen = useCallback(() => {
+    if (url) window.open(url, "_blank", "noopener,noreferrer");
+  }, [url]);
+  const label = type ? typeLabels[type] : "Embed";
+  const cssModifier = type || "generic";
+  return /* @__PURE__ */ jsxs("div", { className: `rich-embed rich-embed--${cssModifier}`, children: [
+    /* @__PURE__ */ jsxs("span", { className: "rich-embed__badge", children: [
+      /* @__PURE__ */ jsx("span", { className: `rich-embed__dot rich-embed__dot--${cssModifier}` }),
+      label
+    ] }),
+    /* @__PURE__ */ jsx("span", { className: "rich-embed__divider" }),
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        ref: inputRef,
+        className: "rich-embed__input",
+        type: "url",
+        value: editUrl,
+        onChange: (e) => setEditUrl(e.target.value),
+        onBlur: commitUrl,
+        onKeyDown: handleKeyDown,
+        placeholder: "https://..."
+      }
+    ),
+    /* @__PURE__ */ jsxs("span", { className: "rich-embed__actions", children: [
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: "rich-embed__action-btn",
+          onClick: handleOpen,
+          title: "Open in new tab",
+          disabled: !url,
+          children: /* @__PURE__ */ jsx(ExternalLink, {})
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: "rich-embed__action-btn rich-embed__action-btn--danger",
+          onClick: handleDelete,
+          title: "Delete",
+          children: /* @__PURE__ */ jsx(Trash2, {})
+        }
+      )
+    ] })
+  ] });
+}
+const _EmbedEditNode = class _EmbedEditNode extends EmbedNode {
+  static clone(node) {
+    return new _EmbedEditNode(node.__url, node.__source, node.__key);
+  }
+  static importJSON(serializedNode) {
+    return new _EmbedEditNode(serializedNode.url, serializedNode.source);
+  }
+  decorate(_editor, _config) {
+    return createElement(EmbedLinkRenderer, {
+      type: this.__source,
+      url: this.__url,
+      nodeKey: this.__key
+    });
+  }
+};
+__publicField(_EmbedEditNode, "slashMenuItems", [
+  {
+    title: "Embed",
+    icon: createElement(Code, { size: 20 }),
+    description: "Embed external content (Tweet, YouTube, Bilibili, etc.)",
+    keywords: [
+      "embed",
+      "tweet",
+      "youtube",
+      "bilibili",
+      "codesandbox",
+      "thinking"
+    ],
+    section: "EMBED",
+    onSelect: (editor) => {
+      editor.update(() => {
+        $insertNodes([$createEmbedEditNode("", null)]);
+      });
+    }
+  }
+]);
+let EmbedEditNode = _EmbedEditNode;
+function $createEmbedEditNode(url, source) {
+  return new EmbedEditNode(url, source);
+}
+function $isEmbedEditNode(node) {
+  return node instanceof EmbedEditNode;
+}
+const embedNodes = [EmbedNode];
+const embedEditNodes = [EmbedEditNode];
+const INSERT_EMBED_COMMAND = createCommand("INSERT_EMBED");
+function EmbedPlugin({ selfHostnames }) {
+  const [editor] = useLexicalComposerContext();
+  const thinkingMatcher = useMemo(
+    () => selfHostnames?.length ? createSelfThinkingMatcher(selfHostnames) : void 0,
+    [selfHostnames]
+  );
+  useEffect(() => {
+    const removePaste = editor.registerCommand(
+      PASTE_COMMAND,
+      (event) => {
+        const text = event.clipboardData?.getData("text/plain")?.trim();
+        if (!text) return false;
+        let url;
+        try {
+          url = new URL(text);
+        } catch {
+          return false;
+        }
+        const source = matchEmbedUrl(url, thinkingMatcher);
+        if (!source) return false;
+        event.preventDefault();
+        editor.update(() => {
+          $insertNodes([$createEmbedEditNode(text, source)]);
+        });
+        return true;
+      },
+      COMMAND_PRIORITY_LOW
+    );
+    const removeInsert = editor.registerCommand(
+      INSERT_EMBED_COMMAND,
+      (url) => {
+        let source = null;
+        try {
+          source = matchEmbedUrl(new URL(url));
+        } catch {
+        }
+        editor.update(() => {
+          $insertNodes([$createEmbedEditNode(url, source)]);
+        });
+        return true;
+      },
+      COMMAND_PRIORITY_LOW
+    );
+    return () => {
+      removePaste();
+      removeInsert();
+    };
+  }, [editor, thinkingMatcher]);
+  return null;
+}
+export {
+  $createEmbedEditNode,
+  $createEmbedNode,
+  $isEmbedEditNode,
+  $isEmbedNode,
+  EmbedEditNode,
+  EmbedLinkRenderer,
+  EmbedNode,
+  EmbedPlugin,
+  EmbedRendererProvider,
+  EmbedStaticRenderer,
+  INSERT_EMBED_COMMAND,
+  createSelfThinkingMatcher,
+  embedEditNodes,
+  embedNodes,
+  isBilibiliVideoUrl,
+  isCodesandboxUrl,
+  isGistUrl,
+  isGithubFilePreviewUrl,
+  isTweetUrl,
+  isYoutubeUrl,
+  matchEmbedUrl,
+  useEmbedRenderers
+};

package/dist/nodes/EmbedEditNode.d.ts

@@ -0,0 +1,14 @@
+import { SlashMenuItemConfig } from '@haklex/rich-editor';
+import { EditorConfig, LexicalEditor, LexicalNode } from 'lexical';
+import { ReactElement } from 'react';
+import { EmbedType } from '../url-matchers';
+import { EmbedNode, SerializedEmbedNode } from './EmbedNode';
+export declare class EmbedEditNode extends EmbedNode {
+    static slashMenuItems: SlashMenuItemConfig[];
+    static clone(node: EmbedEditNode): EmbedEditNode;
+    static importJSON(serializedNode: SerializedEmbedNode): EmbedEditNode;
+    decorate(_editor: LexicalEditor, _config: EditorConfig): ReactElement;
+}
+export declare function $createEmbedEditNode(url: string, source: EmbedType | null): EmbedEditNode;
+export declare function $isEmbedEditNode(node: LexicalNode | null | undefined): node is EmbedEditNode;
+//# sourceMappingURL=EmbedEditNode.d.ts.map

package/dist/nodes/EmbedEditNode.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmbedEditNode.d.ts","sourceRoot":"","sources":["../../src/nodes/EmbedEditNode.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAA;AAC9D,OAAO,KAAK,EAAE,YAAY,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAGvE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAA;AAIzC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAA;AAChD,OAAO,EAAE,SAAS,EAAE,KAAK,mBAAmB,EAAE,MAAM,aAAa,CAAA;AAEjE,qBAAa,aAAc,SAAQ,SAAS;IAC1C,MAAM,CAAC,cAAc,EAAE,mBAAmB,EAAE,CAoB3C;IAED,MAAM,CAAC,KAAK,CAAC,IAAI,EAAE,aAAa,GAAG,aAAa;IAIhD,MAAM,CAAC,UAAU,CAAC,cAAc,EAAE,mBAAmB,GAAG,aAAa;IAIrE,QAAQ,CAAC,OAAO,EAAE,aAAa,EAAE,OAAO,EAAE,YAAY,GAAG,YAAY;CAOtE;AAED,wBAAgB,oBAAoB,CAClC,GAAG,EAAE,MAAM,EACX,MAAM,EAAE,SAAS,GAAG,IAAI,GACvB,aAAa,CAEf;AAED,wBAAgB,gBAAgB,CAC9B,IAAI,EAAE,WAAW,GAAG,IAAI,GAAG,SAAS,GACnC,IAAI,IAAI,aAAa,CAEvB"}

package/dist/nodes/EmbedNode.d.ts

@@ -0,0 +1,27 @@
+import { EditorConfig, LexicalEditor, LexicalNode, NodeKey, SerializedLexicalNode, Spread, DecoratorNode } from 'lexical';
+import { ReactElement } from 'react';
+import { EmbedType } from '../url-matchers';
+export type SerializedEmbedNode = Spread<{
+    url: string;
+    source: EmbedType | null;
+}, SerializedLexicalNode>;
+export declare class EmbedNode extends DecoratorNode<ReactElement> {
+    __url: string;
+    __source: EmbedType | null;
+    static getType(): string;
+    static clone(node: EmbedNode): EmbedNode;
+    constructor(url: string, source: EmbedType | null, key?: NodeKey);
+    createDOM(_config: EditorConfig): HTMLElement;
+    updateDOM(): boolean;
+    isInline(): boolean;
+    static importJSON(serializedNode: SerializedEmbedNode): EmbedNode;
+    exportJSON(): SerializedEmbedNode;
+    getUrl(): string;
+    setUrl(url: string): void;
+    getSource(): EmbedType | null;
+    setSource(source: EmbedType | null): void;
+    decorate(_editor: LexicalEditor, _config: EditorConfig): ReactElement;
+}
+export declare function $createEmbedNode(url: string, source: EmbedType | null): EmbedNode;
+export declare function $isEmbedNode(node: LexicalNode | null | undefined): node is EmbedNode;
+//# sourceMappingURL=EmbedNode.d.ts.map

package/dist/nodes/EmbedNode.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmbedNode.d.ts","sourceRoot":"","sources":["../../src/nodes/EmbedNode.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,YAAY,EACZ,aAAa,EACb,WAAW,EACX,OAAO,EACP,qBAAqB,EACrB,MAAM,EACP,MAAM,SAAS,CAAA;AAChB,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AACvC,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAA;AAIzC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAA;AAEhD,MAAM,MAAM,mBAAmB,GAAG,MAAM,CACtC;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,SAAS,GAAG,IAAI,CAAA;CAAE,EACzC,qBAAqB,CACtB,CAAA;AAED,qBAAa,SAAU,SAAQ,aAAa,CAAC,YAAY,CAAC;IACxD,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,SAAS,GAAG,IAAI,CAAA;IAE1B,MAAM,CAAC,OAAO,IAAI,MAAM;IAIxB,MAAM,CAAC,KAAK,CAAC,IAAI,EAAE,SAAS,GAAG,SAAS;gBAI5B,GAAG,EAAE,MAAM,EAAE,MAAM,EAAE,SAAS,GAAG,IAAI,EAAE,GAAG,CAAC,EAAE,OAAO;IAMhE,SAAS,CAAC,OAAO,EAAE,YAAY,GAAG,WAAW;IAM7C,SAAS,IAAI,OAAO;IAIpB,QAAQ,IAAI,OAAO;IAInB,MAAM,CAAC,UAAU,CAAC,cAAc,EAAE,mBAAmB,GAAG,SAAS;IAIjE,UAAU,IAAI,mBAAmB;IAUjC,MAAM,IAAI,MAAM;IAIhB,MAAM,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI;IAKzB,SAAS,IAAI,SAAS,GAAG,IAAI;IAI7B,SAAS,CAAC,MAAM,EAAE,SAAS,GAAG,IAAI,GAAG,IAAI;IAKzC,QAAQ,CAAC,OAAO,EAAE,aAAa,EAAE,OAAO,EAAE,YAAY,GAAG,YAAY;CAMtE;AAED,wBAAgB,gBAAgB,CAC9B,GAAG,EAAE,MAAM,EACX,MAAM,EAAE,SAAS,GAAG,IAAI,GACvB,SAAS,CAEX;AAED,wBAAgB,YAAY,CAC1B,IAAI,EAAE,WAAW,GAAG,IAAI,GAAG,SAAS,GACnC,IAAI,IAAI,SAAS,CAEnB"}

package/dist/nodes/index.d.ts

@@ -0,0 +1,4 @@
+import { Klass, LexicalNode } from 'lexical';
+export declare const embedNodes: Array<Klass<LexicalNode>>;
+export declare const embedEditNodes: Array<Klass<LexicalNode>>;
+//# sourceMappingURL=index.d.ts.map

package/dist/nodes/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/nodes/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAKjD,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,KAAK,CAAC,WAAW,CAAC,CAAe,CAAA;AAChE,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,KAAK,CAAC,WAAW,CAAC,CAAmB,CAAA"}

package/dist/renderers/EmbedLinkRenderer.d.ts

@@ -0,0 +1,8 @@
+import { EmbedType } from '../url-matchers';
+export interface EmbedLinkRendererProps {
+    type: EmbedType | null;
+    url: string;
+    nodeKey: string;
+}
+export declare function EmbedLinkRenderer({ type, url, nodeKey, }: EmbedLinkRendererProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=EmbedLinkRenderer.d.ts.map

package/dist/renderers/EmbedLinkRenderer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmbedLinkRenderer.d.ts","sourceRoot":"","sources":["../../src/renderers/EmbedLinkRenderer.tsx"],"names":[],"mappings":"AAAA,OAAO,kBAAkB,CAAA;AAOzB,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAA;AAShD,MAAM,WAAW,sBAAsB;IACrC,IAAI,EAAE,SAAS,GAAG,IAAI,CAAA;IACtB,GAAG,EAAE,MAAM,CAAA;IACX,OAAO,EAAE,MAAM,CAAA;CAChB;AAYD,wBAAgB,iBAAiB,CAAC,EAChC,IAAI,EACJ,GAAG,EACH,OAAO,GACR,EAAE,sBAAsB,2CAuGxB"}

package/dist/renderers/EmbedStaticRenderer.d.ts

@@ -0,0 +1,7 @@
+import { EmbedType } from '../url-matchers';
+export interface EmbedStaticRendererProps {
+    type: EmbedType | null;
+    url: string;
+}
+export declare function EmbedStaticRenderer({ type, url }: EmbedStaticRendererProps): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=EmbedStaticRenderer.d.ts.map

package/dist/renderers/EmbedStaticRenderer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmbedStaticRenderer.d.ts","sourceRoot":"","sources":["../../src/renderers/EmbedStaticRenderer.tsx"],"names":[],"mappings":"AAAA,OAAO,yBAAyB,CAAA;AAQhC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAA;AAuDhD,MAAM,WAAW,wBAAwB;IACvC,IAAI,EAAE,SAAS,GAAG,IAAI,CAAA;IACtB,GAAG,EAAE,MAAM,CAAA;CACZ;AA0PD,wBAAgB,mBAAmB,CAAC,EAAE,IAAI,EAAE,GAAG,EAAE,EAAE,wBAAwB,kDA+F1E"}

package/dist/rich-ext-embed.css

@@ -0,0 +1,316 @@
+.rich-embed-link-wrapper {
+  margin: 8px 0;
+}
+.embed-static-ratio-container {
+  margin: 8px 0;
+  display: flex;
+  justify-content: center;
+}
+.embed-static-ratio-inner {
+  position: relative;
+  height: 0;
+  width: 100%;
+}
+.embed-static-iframe {
+  position: absolute;
+  inset: 0;
+  width: 100%;
+  height: 100%;
+  border: none;
+  border-radius: 8px;
+}
+.embed-static-gist {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+.embed-static-gist__iframe {
+  width: 100%;
+  height: 300px;
+  border: none;
+  overflow: auto;
+}
+.embed-static-source-link {
+  display: inline-flex;
+  align-items: flex-start;
+  gap: 8px;
+  margin-top: 8px;
+  color: var(--rc-text-secondary);
+  font-size: 14px;
+  line-height: 1.4;
+  text-decoration: none;
+  word-break: break-all;
+}
+.embed-static-source-link svg {
+  flex-shrink: 0;
+  margin-top: 2px;
+}
+.embed-static-source-link:hover {
+  color: var(--rc-text);
+}
+.embed-static-github-file {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  width: 100%;
+}
+.embed-static-github-file__code {
+  width: 100%;
+  overflow: auto;
+}
+.embed-static-github-file__code--long {
+  max-height: 50vh;
+}
+.embed-static-github-file__code pre {
+  margin: 0;
+  padding: 16px;
+  background: var(--rc-code-bg);
+  border-radius: 8px;
+  font-size: 13px;
+  line-height: 1.5;
+  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
+  color: var(--rc-text);
+}
+.embed-static-github-file__line {
+  display: block;
+}
+.embed-static-github-file__line-num {
+  display: inline-block;
+  width: 4ch;
+  text-align: right;
+  margin-right: 16px;
+  color: color-mix(in srgb, var(--rc-text-secondary) 60%, transparent);
+  user-select: none;
+}
+.embed-static-shiki {
+  counter-reset: shiki-line var(--start-line, 0);
+}
+.embed-static-shiki pre {
+  margin: 0;
+  padding: 16px;
+  border-radius: 8px;
+  font-size: 13px;
+  line-height: 1.5;
+  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
+  overflow-x: auto;
+}
+.embed-static-shiki code {
+  font-family: inherit;
+  display: flex;
+  flex-direction: column;
+}
+.embed-static-shiki .line {
+  display: flex;
+  line-height: 1.5;
+}
+.embed-static-shiki .line::before {
+  content: counter(shiki-line);
+  counter-increment: shiki-line;
+  flex-shrink: 0;
+  width: 4ch;
+  text-align: right;
+  margin-right: 16px;
+  color: color-mix(in srgb, var(--rc-text-secondary) 60%, transparent);
+  user-select: none;
+}
+.embed-static-fallback {
+  --embed-accent: 115, 115, 115;
+  display: flex;
+  align-items: center;
+  gap: 0;
+  padding: 0 14px;
+  height: 48px;
+  border: 1px solid rgba(var(--embed-accent), 0.25);
+  border-radius: 12px;
+  background-color: rgba(var(--embed-accent), 0.08);
+  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+  font-size: 14px;
+  margin: 8px 0;
+}
+.embed-static-fallback--tweet {
+  --embed-accent: 29, 155, 240;
+}
+.embed-static-fallback--youtube {
+  --embed-accent: 255, 0, 0;
+}
+.embed-static-fallback--codesandbox {
+  --embed-accent: 163, 163, 163;
+}
+.embed-static-fallback--bilibili {
+  --embed-accent: 0, 161, 214;
+}
+.embed-static-fallback--github-file {
+  --embed-accent: 110, 84, 148;
+}
+.embed-static-fallback--github-gist {
+  --embed-accent: 110, 84, 148;
+}
+.embed-static-fallback--thinking {
+  --embed-accent: 139, 92, 246;
+}
+.embed-static-fallback__badge {
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  flex-shrink: 0;
+  font-weight: 500;
+  font-size: 14px;
+  color: var(--rc-text-secondary);
+  white-space: nowrap;
+  user-select: none;
+  padding-right: 14px;
+}
+.embed-static-fallback__dot {
+  width: 8px;
+  height: 8px;
+  border-radius: 50%;
+  flex-shrink: 0;
+  background-color: rgb(var(--embed-accent));
+}
+.embed-static-fallback__link {
+  flex: 1;
+  min-width: 0;
+  font-size: 14px;
+  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
+  color: var(--rc-text-secondary);
+  text-decoration: none;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.embed-static-fallback__link:hover {
+  color: var(--rc-text);
+  text-decoration: underline;
+}
+.embed-static-tweet {
+  display: flex;
+  justify-content: center;
+  margin: 8px 0;
+}
+.embed-static-loading {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 200px;
+  color: var(--rc-text-secondary);
+  font-size: 14px;
+}.rich-embed-link-wrapper {
+  margin: 8px 0;
+}
+.rich-embed {
+  --embed-accent: 115, 115, 115;
+  display: flex;
+  align-items: center;
+  gap: 0;
+  padding: 0 14px;
+  height: 48px;
+  border: 1px solid rgba(var(--embed-accent), 0.25);
+  border-radius: 12px;
+  background-color: rgba(var(--embed-accent), 0.12);
+  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+  font-size: 14px;
+  transition: border-color 0.15s ease, background-color 0.15s ease;
+}
+.rich-embed:focus-within {
+  border-color: rgba(var(--embed-accent), 0.5);
+}
+.rich-embed--tweet {
+  --embed-accent: 29, 155, 240;
+}
+.rich-embed--youtube {
+  --embed-accent: 255, 0, 0;
+}
+.rich-embed--codesandbox {
+  --embed-accent: 163, 163, 163;
+}
+.rich-embed--bilibili {
+  --embed-accent: 0, 161, 214;
+}
+.rich-embed--github-file {
+  --embed-accent: 110, 84, 148;
+}
+.rich-embed--github-gist {
+  --embed-accent: 110, 84, 148;
+}
+.rich-embed--thinking {
+  --embed-accent: 139, 92, 246;
+}
+.rich-embed__badge {
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  flex-shrink: 0;
+  font-weight: 500;
+  font-size: 14px;
+  color: var(--rc-text-secondary);
+  white-space: nowrap;
+  user-select: none;
+  padding-right: 14px;
+}
+.rich-embed__dot {
+  width: 8px;
+  height: 8px;
+  border-radius: 50%;
+  flex-shrink: 0;
+  background-color: rgb(var(--embed-accent));
+}
+.rich-embed__divider {
+  width: 1px;
+  height: 20px;
+  background-color: var(--rc-border);
+  flex-shrink: 0;
+}
+.rich-embed__input {
+  flex: 1;
+  min-width: 0;
+  height: 100%;
+  font-size: 14px;
+  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
+  color: var(--rc-text);
+  background: transparent;
+  border: none;
+  padding: 0 14px;
+  outline: none;
+}
+.rich-embed__input::placeholder {
+  color: color-mix(in srgb, var(--rc-text-secondary) 60%, transparent);
+}
+.rich-embed__actions {
+  display: flex;
+  align-items: center;
+  gap: 2px;
+  flex-shrink: 0;
+}
+.rich-embed__action-btn {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  appearance: none;
+  border: none;
+  background: none;
+  color: var(--rc-text-secondary);
+  cursor: pointer;
+  padding: 6px;
+  border-radius: 6px;
+  transition: color 0.15s ease, background-color 0.15s ease;
+}
+.rich-embed__action-btn:hover {
+  color: var(--rc-text);
+  background-color: color-mix(in srgb, var(--rc-text) 8%, transparent);
+}
+.rich-embed__action-btn:disabled {
+  opacity: 0.3;
+  cursor: default;
+}
+.rich-embed__action-btn:disabled:hover {
+  background: none;
+  color: var(--rc-text-secondary);
+}
+.rich-embed__action-btn--danger:hover {
+  color: var(--rc-alert-caution);
+  background-color: color-mix(in srgb, var(--rc-alert-caution) 10%, transparent);
+}
+.rich-embed__action-btn svg {
+  width: 16px;
+  height: 16px;
+}

package/dist/styles-static.css.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=styles-static.css.d.ts.map

package/dist/styles-static.css.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles-static.css.d.ts","sourceRoot":"","sources":["../src/styles-static.css.ts"],"names":[],"mappings":""}

package/dist/styles.css.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=styles.css.d.ts.map

package/dist/styles.css.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.css.d.ts","sourceRoot":"","sources":["../src/styles.css.ts"],"names":[],"mappings":""}

package/dist/url-matchers.d.ts

@@ -0,0 +1,10 @@
+export type EmbedType = 'tweet' | 'youtube' | 'codesandbox' | 'bilibili' | 'github-file' | 'github-gist' | 'thinking';
+export declare const isTweetUrl: (url: URL) => boolean;
+export declare const isYoutubeUrl: (url: URL) => boolean;
+export declare const isCodesandboxUrl: (url: URL) => boolean;
+export declare const isBilibiliVideoUrl: (url: URL) => boolean;
+export declare const isGithubFilePreviewUrl: (url: URL) => boolean;
+export declare const isGistUrl: (url: URL) => boolean;
+export declare function createSelfThinkingMatcher(hostnames: string[]): (url: URL) => boolean;
+export declare function matchEmbedUrl(url: URL, selfThinkingMatcher?: (url: URL) => boolean): EmbedType | null;
+//# sourceMappingURL=url-matchers.d.ts.map

package/dist/url-matchers.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"url-matchers.d.ts","sourceRoot":"","sources":["../src/url-matchers.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,SAAS,GACjB,OAAO,GACP,SAAS,GACT,aAAa,GACb,UAAU,GACV,aAAa,GACb,aAAa,GACb,UAAU,CAAA;AAEd,eAAO,MAAM,UAAU,GAAI,KAAK,GAAG,YAEL,CAAA;AAE9B,eAAO,MAAM,YAAY,GAAI,KAAK,GAAG,YACoC,CAAA;AAEzE,eAAO,MAAM,gBAAgB,GAAI,KAAK,GAAG,YACkC,CAAA;AAE3E,eAAO,MAAM,kBAAkB,GAAI,KAAK,GAAG,YACoC,CAAA;AAE/E,eAAO,MAAM,sBAAsB,GAAI,KAAK,GAAG,YAG9C,CAAA;AAED,eAAO,MAAM,SAAS,GAAI,KAAK,GAAG,YAAuC,CAAA;AAEzE,wBAAgB,yBAAyB,CAAC,SAAS,EAAE,MAAM,EAAE,IACnD,KAAK,GAAG,aAEjB;AAED,wBAAgB,aAAa,CAC3B,GAAG,EAAE,GAAG,EACR,mBAAmB,CAAC,EAAE,CAAC,GAAG,EAAE,GAAG,KAAK,OAAO,GAC1C,SAAS,GAAG,IAAI,CASlB"}

package/package.json

@@ -0,0 +1,59 @@
+{
+  "name": "@haklex/rich-ext-embed",
+  "version": "0.0.1",
+  "description": "Embed extension for Twitter, YouTube, etc.",
+  "license": "MIT",
+  "type": "module",
+  "exports": {
+    ".": {
+      "import": "./dist/index.mjs",
+      "types": "./dist/index.d.ts"
+    },
+    "./style.css": "./dist/rich-ext-embed.css"
+  },
+  "main": "./dist/index.mjs",
+  "files": [
+    "dist"
+  ],
+  "dependencies": {
+    "lucide-react": "^0.574.0",
+    "@haklex/rich-style-token": "0.0.1"
+  },
+  "devDependencies": {
+    "@lexical/react": "^0.39.0",
+    "@types/react": "^19.0.0",
+    "@types/react-dom": "^19.0.0",
+    "@vanilla-extract/css": "^1.17.1",
+    "@vanilla-extract/vite-plugin": "^4.0.20",
+    "lexical": "^0.39.0",
+    "react": "19.2.4",
+    "react-dom": "19.2.4",
+    "react-tweet": "npm:@innei/react-tweet@3.4.2",
+    "shiki": "^3.21.0",
+    "typescript": "^5.9.0",
+    "vite": "^7.3.1",
+    "vite-plugin-dts": "^4.5.0",
+    "@haklex/rich-editor": "0.0.1"
+  },
+  "peerDependencies": {
+    "@lexical/react": "^0.39.0",
+    "lexical": "^0.39.0",
+    "react": ">=19",
+    "react-dom": ">=19",
+    "shiki": ">=3",
+    "@haklex/rich-editor": "0.0.1"
+  },
+  "peerDependenciesMeta": {
+    "shiki": {
+      "optional": true
+    }
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "build": "vite build",
+    "dev:build": "vite build --watch"
+  },
+  "types": "./dist/index.d.ts"
+}