@riebeckite/plugin-text-fragment 0.0.1

package/LICENSE

@@ -0,0 +1,201 @@
+                                 Apache License
+                           Version 2.0, January 2004
+                        http://www.apache.org/licenses/
+
+   TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+
+   1. Definitions.
+
+      "License" shall mean the terms and conditions for use, reproduction,
+      and distribution as defined by Sections 1 through 9 of this document.
+
+      "Licensor" shall mean the copyright owner or entity authorized by
+      the copyright owner that is granting the License.
+
+      "Legal Entity" shall mean the union of the acting entity and all
+      other entities that control, are controlled by, or are under common
+      control with that entity. For the purposes of this definition,
+      "control" means (i) the power, direct or indirect, to cause the
+      direction or management of such entity, whether by contract or
+      otherwise, or (ii) ownership of fifty percent (50%) or more of the
+      outstanding shares, or (iii) beneficial ownership of such entity.
+
+      "You" (or "Your") shall mean an individual or Legal Entity
+      exercising permissions granted by this License.
+
+      "Source" form shall mean the preferred form for making modifications,
+      including but not limited to software source code, documentation
+      source, and configuration files.
+
+      "Object" form shall mean any form resulting from mechanical
+      transformation or translation of a Source form, including but
+      not limited to compiled object code, generated documentation,
+      and conversions to other media types.
+
+      "Work" shall mean the work of authorship, whether in Source or
+      Object form, made available under the License, as indicated by a
+      copyright notice that is included in or attached to the work
+      (an example is provided in the Appendix below).
+
+      "Derivative Works" shall mean any work, whether in Source or Object
+      form, that is based on (or derived from) the Work and for which the
+      editorial revisions, annotations, elaborations, or other modifications
+      represent, as a whole, an original work of authorship. For the purposes
+      of this License, Derivative Works shall not include works that remain
+      separable from, or merely link (or bind by name) to the interfaces of,
+      the Work and Derivative Works thereof.
+
+      "Contribution" shall mean any work of authorship, including
+      the original version of the Work and any modifications or additions
+      to that Work or Derivative Works thereof, that is intentionally
+      submitted to Licensor for inclusion in the Work by the copyright owner
+      or by an individual or Legal Entity authorized to submit on behalf of
+      the copyright owner. For the purposes of this definition, "submitted"
+      means any form of electronic, verbal, or written communication sent
+      to the Licensor or its representatives, including but not limited to
+      communication on electronic mailing lists, source code control systems,
+      and issue tracking systems that are managed by, or on behalf of, the
+      Licensor for the purpose of discussing and improving the Work, but
+      excluding communication that is conspicuously marked or otherwise
+      designated in writing by the copyright owner as "Not a Contribution."
+
+      "Contributor" shall mean Licensor and any individual or Legal Entity
+      on behalf of whom a Contribution has been received by Licensor and
+      subsequently incorporated within the Work.
+
+   2. Grant of Copyright License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      copyright license to reproduce, prepare Derivative Works of,
+      publicly display, publicly perform, sublicense, and distribute the
+      Work and such Derivative Works in Source or Object form.
+
+   3. Grant of Patent License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      (except as stated in this section) patent license to make, have made,
+      use, offer to sell, sell, import, and otherwise transfer the Work,
+      where such license applies only to those patent claims licensable
+      by such Contributor that are necessarily infringed by their
+      Contribution(s) alone or by combination of their Contribution(s)
+      with the Work to which such Contribution(s) was submitted. If You
+      institute patent litigation against any entity (including a
+      cross-claim or counterclaim in a lawsuit) alleging that the Work
+      or a Contribution incorporated within the Work constitutes direct
+      or contributory patent infringement, then any patent licenses
+      granted to You under this License for that Work shall terminate
+      as of the date such litigation is filed.
+
+   4. Redistribution. You may reproduce and distribute copies of the
+      Work or Derivative Works thereof in any medium, with or without
+      modifications, and in Source or Object form, provided that You
+      meet the following conditions:
+
+      (a) You must give any other recipients of the Work or
+          Derivative Works a copy of this License; and
+
+      (b) You must cause any modified files to carry prominent notices
+          stating that You changed the files; and
+
+      (c) You must retain, in the Source form of any Derivative Works
+          that You distribute, all copyright, patent, trademark, and
+          attribution notices from the Source form of the Work,
+          excluding those notices that do not pertain to any part of
+          the Derivative Works; and
+
+      (d) If the Work includes a "NOTICE" text file as part of its
+          distribution, then any Derivative Works that You distribute must
+          include a readable copy of the attribution notices contained
+          within such NOTICE file, excluding those notices that do not
+          pertain to any part of the Derivative Works, in at least one
+          of the following places: within a NOTICE text file distributed
+          as part of the Derivative Works; within the Source form or
+          documentation, if provided along with the Derivative Works; or,
+          within a display generated by the Derivative Works, if and
+          wherever such third-party notices normally appear. The contents
+          of the NOTICE file are for informational purposes only and
+          do not modify the License. You may add Your own attribution
+          notices within Derivative Works that You distribute, alongside
+          or as an addendum to the NOTICE text from the Work, provided
+          that such additional attribution notices cannot be construed
+          as modifying the License.
+
+      You may add Your own copyright statement to Your modifications and
+      may provide additional or different license terms and conditions
+      for use, reproduction, or distribution of Your modifications, or
+      for any such Derivative Works as a whole, provided Your use,
+      reproduction, and distribution of the Work otherwise complies with
+      the conditions stated in this License.
+
+   5. Submission of Contributions. Unless You explicitly state otherwise,
+      any Contribution intentionally submitted for inclusion in the Work
+      by You to the Licensor shall be under the terms and conditions of
+      this License, without any additional terms or conditions.
+      Notwithstanding the above, nothing herein shall supersede or modify
+      the terms of any separate license agreement you may have executed
+      with Licensor regarding such Contributions.
+
+   6. Trademarks. This License does not grant permission to use the trade
+      names, trademarks, service marks, or product names of the Licensor,
+      except as required for reasonable and customary use in describing the
+      origin of the Work and reproducing the content of the NOTICE file.
+
+   7. Disclaimer of Warranty. Unless required by applicable law or
+      agreed to in writing, Licensor provides the Work (and each
+      Contributor provides its Contributions) on an "AS IS" BASIS,
+      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+      implied, including, without limitation, any warranties or conditions
+      of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
+      PARTICULAR PURPOSE. You are solely responsible for determining the
+      appropriateness of using or redistributing the Work and assume any
+      risks associated with Your exercise of permissions under this License.
+
+   8. Limitation of Liability. In no event and under no legal theory,
+      whether in tort (including negligence), contract, or otherwise,
+      unless required by applicable law (such as deliberate and grossly
+      negligent acts) or agreed to in writing, shall any Contributor be
+      liable to You for damages, including any direct, indirect, special,
+      incidental, or consequential damages of any character arising as a
+      result of this License or out of the use or inability to use the
+      Work (including but not limited to damages for loss of goodwill,
+      work stoppage, computer failure or malfunction, or any and all
+      other commercial damages or losses), even if such Contributor
+      has been advised of the possibility of such damages.
+
+   9. Accepting Warranty or Additional Liability. While redistributing
+      the Work or Derivative Works thereof, You may choose to offer,
+      and charge a fee for, acceptance of support, warranty, indemnity,
+      or other liability obligations and/or rights consistent with this
+      License. However, in accepting such obligations, You may act only
+      on Your own behalf and on Your sole responsibility, not on behalf
+      of any other Contributor, and only if You agree to indemnify,
+      defend, and hold each Contributor harmless for any liability
+      incurred by, or claims asserted against, such Contributor by reason
+      of your accepting any such warranty or additional liability.
+
+   END OF TERMS AND CONDITIONS
+
+   APPENDIX: How to apply the Apache License to your work.
+
+      To apply the Apache License to your work, attach the following
+      boilerplate notice, with the fields enclosed by brackets "[]"
+      replaced with your own identifying information. (Don't include
+      the brackets!)  The text should be enclosed in the appropriate
+      comment syntax for the file format. We also recommend that a
+      file or class name and description of purpose be included on the
+      same "printed page" as the copyright notice for easier
+      identification within third-party archives.
+
+   Copyright Rerurate_514
+
+   Licensed under the Apache License, Version 2.0 (the "License");
+   you may not use this file except in compliance with the License.
+   You may obtain a copy of the License at
+
+       http://www.apache.org/licenses/LICENSE-2.0
+
+   Unless required by applicable law or agreed to in writing, software
+   distributed under the License is distributed on an "AS IS" BASIS,
+   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+   See the License for the specific language governing permissions and
+   limitations under the License.

package/README.md

@@ -0,0 +1,70 @@
+# @riebeckite/plugin-text-fragment
+
+Copy a Text Fragment deep link (`#:~:text=`) or a Markdown quote for the text
+you select in an article.
+
+[日本語](./README_ja.md)
+
+## Overview
+
+Client-only plugin. On page load it installs one selection popover with two
+actions:
+
+- **リンクをコピー** — builds a URL with a
+  [Text Fragment directive](https://wicg.github.io/scroll-to-text-fragment/)
+  that highlights the selected text.
+- **引用をコピー** — builds a Markdown block quote with a link back to the page.
+
+## Usage
+
+```ts
+import { defineConfig } from "@riebeckite/core";
+import { textFragmentPlugin } from "@riebeckite/plugin-text-fragment";
+
+export default defineConfig({
+  // ...
+  plugins: [textFragmentPlugin()],
+});
+```
+
+`textFragmentPlugin()` registers `style.css` and the `initTextFragmentShare`
+client entry, which the app calls during page initialization.
+
+## Behavior
+
+- A non-empty selection inside the article body shows the popover near the
+  selection. Selections inside `pre`, `code`, `a[href]`, or `[data-no-share]`
+  are ignored.
+- Both actions write to the clipboard through `navigator.clipboard.writeText`
+  and fall back to a hidden textarea with `document.execCommand("copy")`.
+- Failures are announced in a visible `aria-live="polite"` status region.
+- `Escape` or a click outside closes the popover. The buttons are real
+  `<button>` elements, so they are reachable with the keyboard.
+- The popover is installed once per page and does nothing when there is no
+  `document` (SSR-safe).
+
+### URL rules
+
+The fragment follows `#:~:text=[prefix-,]start[,end][,-suffix]`:
+
+- `,`, `-` and `&` are percent-encoded (`%2C`, `%2D`, `%26`).
+- Other characters are encoded per UTF-8 (newlines become `%0A`).
+- An existing hash on the page URL is dropped before the directive is appended.
+- Selections longer than ~200 characters or containing a newline are reduced to
+  a `start,end` range built from the first and last token.
+- An empty or whitespace-only selection produces `""`.
+
+## API
+
+- `textFragmentPlugin()` — plugin factory
+- `initTextFragmentShare()` — client initializer (also via
+  `@riebeckite/plugin-text-fragment/client`)
+- `encodeTextFragment(text)` — percent-encodes one text fragment term
+- `buildTextFragmentUrl(pageUrl, selection, options?)` — builds the deep link;
+  `options` is `{ prefix?, suffix? }`
+- `buildQuoteMarkdown({ url, title, selection })` — builds the Markdown quote
+- Type: `TextFragmentOptions`
+
+## See also
+
+- [Plugin guide](../../docs/plugins_en.md)

package/README_ja.md

@@ -0,0 +1,57 @@
+# @riebeckite/plugin-text-fragment
+
+記事内で選択したテキストから、Text Fragment のディープリンク（`#:~:text=`）と Markdown の引用を作るプラグインです。
+
+[English](./README_en.md)
+
+## できること
+
+クライアント専用のプラグインです。ページ表示時に、選択範囲のそばへ小さなポップオーバーを出し、次の二つをコピーできます。
+
+- **リンクをコピー**: 選択したテキストをハイライトする [Text Fragment](https://wicg.github.io/scroll-to-text-fragment/) 付き URL を作ります。
+- **引用をコピー**: ページへのリンク付きで Markdown の引用ブロックを作ります。
+
+## 設定する
+
+```ts
+import { defineConfig } from "@riebeckite/core";
+import { textFragmentPlugin } from "@riebeckite/plugin-text-fragment";
+
+export default defineConfig({
+  // ...
+  plugins: [textFragmentPlugin()],
+});
+```
+
+`textFragmentPlugin()` はスタイルと `initTextFragmentShare` を登録します。初期化処理はアプリのページ初期化時に呼ばれます。
+
+## 挙動
+
+- 記事本文内でテキストを選択すると、そのそばにポップオーバーが出ます。`pre`、`code`、`a[href]`、`[data-no-share]` の中の選択は対象外です。
+- コピーは `navigator.clipboard.writeText` を使い、失敗時は隠し textarea と `document.execCommand("copy")` に切り替えます。
+- コピーに失敗したときは `aria-live="polite"` の領域にメッセージを表示します。
+- `Escape` またはポップオーバーの外側をクリックすると閉じます。ボタンは実体の `<button>` なのでキーボードでも操作できます。
+- 初期化はページごとに一度だけで、`document` が無い環境では何もしません。
+
+### URL の規則
+
+フラグメントは `#:~:text=[prefix-,]start[,end][,-suffix]` に従います。
+
+- `,`、`-`、`&` はパーセントエンコードします（`%2C`、`%2D`、`%26`）。
+- それ以外は UTF-8 単位でエンコードします（改行は `%0A`）。
+- ページ URL に既存のハッシュがあるときは、それを外してからディレクティブを付けます。
+- 200 文字前後より長い選択、または改行を含む選択は、先頭と末尾のトークンによる `start,end` に短縮します。
+- 空または空白だけの選択は `""` を返します。
+
+## 公開 API
+
+- `textFragmentPlugin()` — プラグインファクトリ
+- `initTextFragmentShare()` — ブラウザ初期化関数（`@riebeckite/plugin-text-fragment/client` からも読み込める）
+- `encodeTextFragment(text)` — テキスト片をパーセントエンコードする
+- `buildTextFragmentUrl(pageUrl, selection, options?)` — ディープリンクを作る。`options` は `{ prefix?, suffix? }`
+- `buildQuoteMarkdown({ url, title, selection })` — 引用ブロックを作る
+- `TextFragmentOptions` — オプションの型
+
+## 関連資料
+
+- [プラグインシステム](../../../docs/ja/plugin-system.md)

package/dist/client.d.ts

@@ -0,0 +1 @@
+export { initTextFragmentShare } from "./src/text-fragment.client.js";

package/dist/client.js

@@ -0,0 +1,234 @@
+// src/text-fragment.ts
+var TEXT_FRAGMENT_PREFIX = "#:~:text=";
+var MAX_TEXT_FRAGMENT_LENGTH = 200;
+var NEWLINE_PATTERN = /\r\n|\r|\n/g;
+var NEWLINE_TEST = /[\r\n]/;
+function encodeTextFragment(text) {
+  let encoded;
+  try {
+    encoded = encodeURIComponent(text);
+  } catch {
+    encoded = encodeURIComponent(text.replace(/[\uD800-\uDFFF]/g, "�"));
+  }
+  return encoded.replace(/&/g, "%26").replace(/,/g, "%2C").replace(/-/g, "%2D");
+}
+function buildTextFragmentUrl(pageUrl, selection, options = {}) {
+  const directive = buildTextDirective(selection, options);
+  if (directive.length === 0) return "";
+  return `${stripUrlFragment(pageUrl)}${TEXT_FRAGMENT_PREFIX}${directive}`;
+}
+function buildQuoteMarkdown(args) {
+  const quoted = normalizeNewlines(args.selection).split("\n").map((line) => line.length > 0 ? `> ${line}` : ">").join("\n");
+  return `${quoted}
+> — [${args.title}](${args.url})`;
+}
+function buildTextDirective(selection, options) {
+  const normalized = normalizeNewlines(selection).trim();
+  if (normalized.length === 0) return "";
+  const prefix = normalizeNewlines(options.prefix ?? "").trim();
+  const suffix = normalizeNewlines(options.suffix ?? "").trim();
+  const useRange = normalized.length > MAX_TEXT_FRAGMENT_LENGTH || NEWLINE_TEST.test(selection);
+  let match;
+  if (useRange) {
+    const tokens = normalized.split(/\s+/).filter(Boolean);
+    const start = tokens[0] ?? normalized;
+    const end = tokens.length > 1 ? tokens[tokens.length - 1] : "";
+    match = end.length > 0 ? `${encodeTextFragment(start)},${encodeTextFragment(end)}` : encodeTextFragment(start);
+  } else {
+    match = encodeTextFragment(normalized);
+  }
+  const prefixPart = prefix.length > 0 ? `${encodeTextFragment(prefix)}-,` : "";
+  const suffixPart = suffix.length > 0 ? `,-${encodeTextFragment(suffix)}` : "";
+  return `${prefixPart}${match}${suffixPart}`;
+}
+function normalizeNewlines(value) {
+  return value.replace(NEWLINE_PATTERN, "\n");
+}
+function stripUrlFragment(url) {
+  const index = url.indexOf("#");
+  return index === -1 ? url : url.slice(0, index);
+}
+
+// src/text-fragment.client.ts
+var ARTICLE_SELECTOR = "[data-slot='article-body'], .rb-article-body, .prose, article";
+var EXCLUDED_SELECTOR = "pre, code, a[href], [data-no-share]";
+var POPOVER_GAP = 8;
+var initialized = false;
+function initTextFragmentShare() {
+  if (typeof document === "undefined") return;
+  if (initialized) return;
+  initialized = true;
+  const popover = document.createElement("div");
+  popover.className = "rr-text-fragment";
+  popover.hidden = true;
+  popover.setAttribute("role", "group");
+  popover.setAttribute("aria-label", "選択したテキストを共有");
+  const actions = document.createElement("div");
+  actions.className = "rr-text-fragment__actions";
+  const linkButton = createButton("リンクをコピー");
+  const quoteButton = createButton("引用をコピー");
+  const status = document.createElement("p");
+  status.className = "rr-text-fragment__status";
+  status.setAttribute("role", "status");
+  status.setAttribute("aria-live", "polite");
+  actions.append(linkButton, quoteButton);
+  popover.append(actions, status);
+  document.body.appendChild(popover);
+  let active = null;
+  let isCopying = false;
+  const hide = () => {
+    active = null;
+    popover.hidden = true;
+    status.textContent = "";
+  };
+  const show = (selection, resetStatus) => {
+    active = selection;
+    if (resetStatus) status.textContent = "";
+    popover.hidden = false;
+    positionPopover(popover, selection.rect);
+  };
+  const refresh = () => {
+    if (isCopying) return;
+    const selection = readShareableSelection();
+    if (!selection) {
+      hide();
+      return;
+    }
+    show(selection, active?.text !== selection.text);
+  };
+  const copy = async (buildValue, successMessage) => {
+    const selection = active;
+    if (!selection) return;
+    isCopying = true;
+    try {
+      const copied = await copyToClipboard(buildValue(selection.text));
+      status.textContent = copied ? successMessage : "コピーできませんでした。テキストを選び直してください。";
+      active = selection;
+      popover.hidden = false;
+      positionPopover(popover, selection.rect);
+    } finally {
+      window.setTimeout(() => {
+        isCopying = false;
+      }, 0);
+    }
+  };
+  linkButton.addEventListener("click", () => {
+    void copy(
+      (selection) => buildTextFragmentUrl(resolvePageUrl(), selection),
+      "リンクをコピーしました"
+    );
+  });
+  quoteButton.addEventListener("click", () => {
+    void copy(
+      (selection) => buildQuoteMarkdown({
+        url: resolvePageUrl(),
+        title: document.title,
+        selection
+      }),
+      "引用をコピーしました"
+    );
+  });
+  popover.addEventListener("mousedown", (event) => event.preventDefault());
+  document.addEventListener("selectionchange", refresh);
+  document.addEventListener("mouseup", refresh);
+  document.addEventListener("keyup", refresh);
+  document.addEventListener("keydown", (event) => {
+    if (event.key === "Escape" && !popover.hidden) {
+      event.preventDefault();
+      hide();
+    }
+  });
+  document.addEventListener("mousedown", (event) => {
+    if (popover.hidden) return;
+    if (event.target instanceof Node && popover.contains(event.target)) return;
+    hide();
+  });
+  window.addEventListener("scroll", hide, { passive: true });
+}
+function createButton(label) {
+  const button = document.createElement("button");
+  button.type = "button";
+  button.className = "rr-text-fragment__button";
+  button.textContent = label;
+  return button;
+}
+function readShareableSelection() {
+  const selection = window.getSelection();
+  if (!selection || selection.isCollapsed || selection.rangeCount === 0) {
+    return null;
+  }
+  const text = selection.toString().trim();
+  if (text.length === 0) return null;
+  const range = selection.getRangeAt(0);
+  if (!isShareableNode(range.startContainer) || !isShareableNode(range.endContainer)) {
+    return null;
+  }
+  const rect = range.getBoundingClientRect();
+  if (rect.width === 0 && rect.height === 0) return null;
+  return { text, rect };
+}
+function isShareableNode(node) {
+  const element = node.nodeType === Node.ELEMENT_NODE ? node : node.parentElement;
+  if (!element) return false;
+  if (element.closest(EXCLUDED_SELECTOR)) return false;
+  return element.closest(ARTICLE_SELECTOR) !== null;
+}
+function positionPopover(popover, rect) {
+  const width = popover.offsetWidth;
+  const height = popover.offsetHeight;
+  let left = rect.left + rect.width / 2 - width / 2;
+  let top = rect.top - height - POPOVER_GAP;
+  if (top < POPOVER_GAP) top = rect.bottom + POPOVER_GAP;
+  left = Math.max(
+    POPOVER_GAP,
+    Math.min(left, window.innerWidth - width - POPOVER_GAP)
+  );
+  popover.style.left = `${Math.round(left)}px`;
+  popover.style.top = `${Math.round(top)}px`;
+}
+function resolvePageUrl() {
+  return window.location.href.split("#")[0] ?? window.location.href;
+}
+async function copyToClipboard(value) {
+  try {
+    if (window.isSecureContext && navigator.clipboard) {
+      await navigator.clipboard.writeText(value);
+      return true;
+    }
+  } catch {
+  }
+  return copyWithExecCommand(value);
+}
+function copyWithExecCommand(value) {
+  const selection = window.getSelection();
+  const savedRanges = [];
+  if (selection) {
+    for (let index = 0; index < selection.rangeCount; index += 1) {
+      savedRanges.push(selection.getRangeAt(index).cloneRange());
+    }
+  }
+  const textarea = document.createElement("textarea");
+  textarea.value = value;
+  textarea.setAttribute("readonly", "");
+  textarea.style.position = "fixed";
+  textarea.style.top = "-1000px";
+  textarea.style.opacity = "0";
+  document.body.appendChild(textarea);
+  textarea.select();
+  let copied = false;
+  try {
+    copied = document.execCommand("copy");
+  } catch {
+    copied = false;
+  } finally {
+    textarea.remove();
+    if (selection && savedRanges.length > 0) {
+      selection.removeAllRanges();
+      for (const range of savedRanges) selection.addRange(range);
+    }
+  }
+  return copied;
+}
+export {
+  initTextFragmentShare
+};

package/dist/index.d.ts

@@ -0,0 +1,8 @@
+import { type RiebeckitePlugin } from "@riebeckite/core";
+export { buildQuoteMarkdown, buildTextFragmentUrl, encodeTextFragment, type TextFragmentOptions, } from "./src/text-fragment.js";
+export { initTextFragmentShare } from "./src/text-fragment.client.js";
+/**
+ * Registers the client-only text fragment share plugin: a selection popover
+ * that copies a `#:~:text=` deep link or a Markdown quote.
+ */
+export declare function textFragmentPlugin(): RiebeckitePlugin;

package/dist/index.js

@@ -0,0 +1,256 @@
+// index.ts
+import {
+  createClientEntry,
+  createStyleAsset,
+  definePlugin
+} from "@riebeckite/core";
+
+// src/text-fragment.ts
+var TEXT_FRAGMENT_PREFIX = "#:~:text=";
+var MAX_TEXT_FRAGMENT_LENGTH = 200;
+var NEWLINE_PATTERN = /\r\n|\r|\n/g;
+var NEWLINE_TEST = /[\r\n]/;
+function encodeTextFragment(text) {
+  let encoded;
+  try {
+    encoded = encodeURIComponent(text);
+  } catch {
+    encoded = encodeURIComponent(text.replace(/[\uD800-\uDFFF]/g, "�"));
+  }
+  return encoded.replace(/&/g, "%26").replace(/,/g, "%2C").replace(/-/g, "%2D");
+}
+function buildTextFragmentUrl(pageUrl, selection, options = {}) {
+  const directive = buildTextDirective(selection, options);
+  if (directive.length === 0) return "";
+  return `${stripUrlFragment(pageUrl)}${TEXT_FRAGMENT_PREFIX}${directive}`;
+}
+function buildQuoteMarkdown(args) {
+  const quoted = normalizeNewlines(args.selection).split("\n").map((line) => line.length > 0 ? `> ${line}` : ">").join("\n");
+  return `${quoted}
+> — [${args.title}](${args.url})`;
+}
+function buildTextDirective(selection, options) {
+  const normalized = normalizeNewlines(selection).trim();
+  if (normalized.length === 0) return "";
+  const prefix = normalizeNewlines(options.prefix ?? "").trim();
+  const suffix = normalizeNewlines(options.suffix ?? "").trim();
+  const useRange = normalized.length > MAX_TEXT_FRAGMENT_LENGTH || NEWLINE_TEST.test(selection);
+  let match;
+  if (useRange) {
+    const tokens = normalized.split(/\s+/).filter(Boolean);
+    const start = tokens[0] ?? normalized;
+    const end = tokens.length > 1 ? tokens[tokens.length - 1] : "";
+    match = end.length > 0 ? `${encodeTextFragment(start)},${encodeTextFragment(end)}` : encodeTextFragment(start);
+  } else {
+    match = encodeTextFragment(normalized);
+  }
+  const prefixPart = prefix.length > 0 ? `${encodeTextFragment(prefix)}-,` : "";
+  const suffixPart = suffix.length > 0 ? `,-${encodeTextFragment(suffix)}` : "";
+  return `${prefixPart}${match}${suffixPart}`;
+}
+function normalizeNewlines(value) {
+  return value.replace(NEWLINE_PATTERN, "\n");
+}
+function stripUrlFragment(url) {
+  const index = url.indexOf("#");
+  return index === -1 ? url : url.slice(0, index);
+}
+
+// src/text-fragment.client.ts
+var ARTICLE_SELECTOR = "[data-slot='article-body'], .rb-article-body, .prose, article";
+var EXCLUDED_SELECTOR = "pre, code, a[href], [data-no-share]";
+var POPOVER_GAP = 8;
+var initialized = false;
+function initTextFragmentShare() {
+  if (typeof document === "undefined") return;
+  if (initialized) return;
+  initialized = true;
+  const popover = document.createElement("div");
+  popover.className = "rr-text-fragment";
+  popover.hidden = true;
+  popover.setAttribute("role", "group");
+  popover.setAttribute("aria-label", "選択したテキストを共有");
+  const actions = document.createElement("div");
+  actions.className = "rr-text-fragment__actions";
+  const linkButton = createButton("リンクをコピー");
+  const quoteButton = createButton("引用をコピー");
+  const status = document.createElement("p");
+  status.className = "rr-text-fragment__status";
+  status.setAttribute("role", "status");
+  status.setAttribute("aria-live", "polite");
+  actions.append(linkButton, quoteButton);
+  popover.append(actions, status);
+  document.body.appendChild(popover);
+  let active = null;
+  let isCopying = false;
+  const hide = () => {
+    active = null;
+    popover.hidden = true;
+    status.textContent = "";
+  };
+  const show = (selection, resetStatus) => {
+    active = selection;
+    if (resetStatus) status.textContent = "";
+    popover.hidden = false;
+    positionPopover(popover, selection.rect);
+  };
+  const refresh = () => {
+    if (isCopying) return;
+    const selection = readShareableSelection();
+    if (!selection) {
+      hide();
+      return;
+    }
+    show(selection, active?.text !== selection.text);
+  };
+  const copy = async (buildValue, successMessage) => {
+    const selection = active;
+    if (!selection) return;
+    isCopying = true;
+    try {
+      const copied = await copyToClipboard(buildValue(selection.text));
+      status.textContent = copied ? successMessage : "コピーできませんでした。テキストを選び直してください。";
+      active = selection;
+      popover.hidden = false;
+      positionPopover(popover, selection.rect);
+    } finally {
+      window.setTimeout(() => {
+        isCopying = false;
+      }, 0);
+    }
+  };
+  linkButton.addEventListener("click", () => {
+    void copy(
+      (selection) => buildTextFragmentUrl(resolvePageUrl(), selection),
+      "リンクをコピーしました"
+    );
+  });
+  quoteButton.addEventListener("click", () => {
+    void copy(
+      (selection) => buildQuoteMarkdown({
+        url: resolvePageUrl(),
+        title: document.title,
+        selection
+      }),
+      "引用をコピーしました"
+    );
+  });
+  popover.addEventListener("mousedown", (event) => event.preventDefault());
+  document.addEventListener("selectionchange", refresh);
+  document.addEventListener("mouseup", refresh);
+  document.addEventListener("keyup", refresh);
+  document.addEventListener("keydown", (event) => {
+    if (event.key === "Escape" && !popover.hidden) {
+      event.preventDefault();
+      hide();
+    }
+  });
+  document.addEventListener("mousedown", (event) => {
+    if (popover.hidden) return;
+    if (event.target instanceof Node && popover.contains(event.target)) return;
+    hide();
+  });
+  window.addEventListener("scroll", hide, { passive: true });
+}
+function createButton(label) {
+  const button = document.createElement("button");
+  button.type = "button";
+  button.className = "rr-text-fragment__button";
+  button.textContent = label;
+  return button;
+}
+function readShareableSelection() {
+  const selection = window.getSelection();
+  if (!selection || selection.isCollapsed || selection.rangeCount === 0) {
+    return null;
+  }
+  const text = selection.toString().trim();
+  if (text.length === 0) return null;
+  const range = selection.getRangeAt(0);
+  if (!isShareableNode(range.startContainer) || !isShareableNode(range.endContainer)) {
+    return null;
+  }
+  const rect = range.getBoundingClientRect();
+  if (rect.width === 0 && rect.height === 0) return null;
+  return { text, rect };
+}
+function isShareableNode(node) {
+  const element = node.nodeType === Node.ELEMENT_NODE ? node : node.parentElement;
+  if (!element) return false;
+  if (element.closest(EXCLUDED_SELECTOR)) return false;
+  return element.closest(ARTICLE_SELECTOR) !== null;
+}
+function positionPopover(popover, rect) {
+  const width = popover.offsetWidth;
+  const height = popover.offsetHeight;
+  let left = rect.left + rect.width / 2 - width / 2;
+  let top = rect.top - height - POPOVER_GAP;
+  if (top < POPOVER_GAP) top = rect.bottom + POPOVER_GAP;
+  left = Math.max(
+    POPOVER_GAP,
+    Math.min(left, window.innerWidth - width - POPOVER_GAP)
+  );
+  popover.style.left = `${Math.round(left)}px`;
+  popover.style.top = `${Math.round(top)}px`;
+}
+function resolvePageUrl() {
+  return window.location.href.split("#")[0] ?? window.location.href;
+}
+async function copyToClipboard(value) {
+  try {
+    if (window.isSecureContext && navigator.clipboard) {
+      await navigator.clipboard.writeText(value);
+      return true;
+    }
+  } catch {
+  }
+  return copyWithExecCommand(value);
+}
+function copyWithExecCommand(value) {
+  const selection = window.getSelection();
+  const savedRanges = [];
+  if (selection) {
+    for (let index = 0; index < selection.rangeCount; index += 1) {
+      savedRanges.push(selection.getRangeAt(index).cloneRange());
+    }
+  }
+  const textarea = document.createElement("textarea");
+  textarea.value = value;
+  textarea.setAttribute("readonly", "");
+  textarea.style.position = "fixed";
+  textarea.style.top = "-1000px";
+  textarea.style.opacity = "0";
+  document.body.appendChild(textarea);
+  textarea.select();
+  let copied = false;
+  try {
+    copied = document.execCommand("copy");
+  } catch {
+    copied = false;
+  } finally {
+    textarea.remove();
+    if (selection && savedRanges.length > 0) {
+      selection.removeAllRanges();
+      for (const range of savedRanges) selection.addRange(range);
+    }
+  }
+  return copied;
+}
+
+// index.ts
+function textFragmentPlugin() {
+  return definePlugin({
+    name: "text-fragment",
+    assets: [createStyleAsset("text-fragment")],
+    clientEntries: [
+      createClientEntry("text-fragment", "initTextFragmentShare")
+    ]
+  });
+}
+export {
+  buildQuoteMarkdown,
+  buildTextFragmentUrl,
+  encodeTextFragment,
+  initTextFragmentShare,
+  textFragmentPlugin
+};

package/dist/src/text-fragment.client.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Enables a popover with "リンクをコピー" (text fragment deep link) and
+ * "引用をコピー" (Markdown quote) actions for the current text selection.
+ *
+ * Client-only: returns immediately when there is no `document`, and only wires
+ * its listeners once per page.
+ */
+export declare function initTextFragmentShare(): void;

package/dist/src/text-fragment.d.ts

@@ -0,0 +1,39 @@
+/**
+ * Pure helpers for URL Fragment Text Directives.
+ *
+ * Syntax (WICG scroll-to-text-fragment):
+ * `#:~:text=[prefix-,]start[,end][,-suffix]`
+ */
+export type TextFragmentOptions = {
+    /** Text immediately before the selection, used to disambiguate it. */
+    prefix?: string;
+    /** Text immediately after the selection, used to disambiguate it. */
+    suffix?: string;
+};
+/**
+ * Percent-encodes a text fragment term.
+ *
+ * `,` `-` and `&` are reserved by the text directive grammar and are always
+ * encoded (`%2C`, `%2D`, `%26`). Everything else is encoded per UTF-8, so
+ * multibyte characters (Japanese, emoji) survive the round trip and newlines
+ * become `%0A`.
+ */
+export declare function encodeTextFragment(text: string): string;
+/**
+ * Builds a deep link that highlights `selection` on `pageUrl`.
+ *
+ * Returns `""` for an empty or whitespace-only selection. Any existing hash on
+ * `pageUrl` is dropped before the fragment directive is appended. When the
+ * selection is longer than ~200 characters or contains a newline, it is reduced
+ * to a `start,end` range built from its first and last token.
+ */
+export declare function buildTextFragmentUrl(pageUrl: string, selection: string, options?: TextFragmentOptions): string;
+/**
+ * Builds a Markdown block quote for `selection` followed by a credit line that
+ * links to `url`. Every line of the selection is prefixed with `> `.
+ */
+export declare function buildQuoteMarkdown(args: {
+    url: string;
+    title: string;
+    selection: string;
+}): string;

package/package.json

@@ -0,0 +1,65 @@
+{
+  "name": "@riebeckite/plugin-text-fragment",
+  "version": "0.0.1",
+  "license": "Apache-2.0",
+  "type": "module",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "source": "./index.ts",
+      "default": "./dist/index.js"
+    },
+    "./client": {
+      "types": "./dist/client.d.ts",
+      "import": "./dist/client.js",
+      "source": "./client.ts",
+      "default": "./dist/client.js"
+    },
+    "./style.css": "./style.css"
+  },
+  "dependencies": {
+    "@riebeckite/core": "0.0.1"
+  },
+  "devDependencies": {
+    "tsx": "^4.22.4"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "files": [
+    "LICENSE",
+    "README.md",
+    "README_ja.md",
+    "dist",
+    "style.css"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/Rerurate514/riebeckite.git",
+    "directory": "packages/plugins/text-fragment"
+  },
+  "homepage": "https://github.com/Rerurate514/riebeckite#readme",
+  "bugs": {
+    "url": "https://github.com/Rerurate514/riebeckite/issues"
+  },
+  "description": "Text Fragment links and quotes for Riebeckite articles.",
+  "keywords": [
+    "riebeckite",
+    "plugin",
+    "text-fragment",
+    "sharing"
+  ],
+  "engines": {
+    "node": "^20.19.0 || >=22.12.0"
+  },
+  "sideEffects": [
+    "./style.css"
+  ],
+  "scripts": {
+    "build": "node ../../../scripts/build_package.mjs",
+    "test": "node --import tsx --test \"test/*.test.ts\""
+  }
+}

package/style.css

@@ -0,0 +1,53 @@
+.rr-text-fragment {
+  position: fixed;
+  z-index: 900;
+  display: grid;
+  gap: 4px;
+  padding: 6px;
+  border: 1px solid var(--rb-color-border-strong, #9a9a9a);
+  background: var(--rb-color-surface, #ffffff);
+  color: var(--rb-color-ink, #1a1a1a);
+}
+
+.rr-text-fragment[hidden] {
+  display: none;
+}
+
+.rr-text-fragment__actions {
+  display: flex;
+  gap: 4px;
+}
+
+.rr-text-fragment__button {
+  border: 1px solid var(--rb-color-border, #d0d0d0);
+  background: transparent;
+  color: inherit;
+  padding: 4px 10px;
+  font: inherit;
+  font-size: 0.8rem;
+  line-height: 1.4;
+  white-space: nowrap;
+  cursor: pointer;
+}
+
+.rr-text-fragment__button:hover {
+  border-color: var(--rb-color-accent, #686868);
+  color: var(--rb-color-accent, #686868);
+}
+
+.rr-text-fragment__button:focus-visible {
+  outline: 2px solid var(--rb-color-accent, #686868);
+  outline-offset: 1px;
+}
+
+.rr-text-fragment__status {
+  margin: 0;
+  max-width: 16rem;
+  font-size: 0.72rem;
+  line-height: 1.4;
+  color: var(--rb-color-muted, #5a5a5a);
+}
+
+.rr-text-fragment__status:empty {
+  display: none;
+}