@riebeckite/plugin-hover-preview 0.0.31 → 0.0.33
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +11 -7
- package/README_ja.md +13 -9
- package/dist/index.d.ts +1 -2
- package/dist/index.js +2 -3
- package/dist/src/preview-index.d.ts +2 -1
- package/dist/src/runtime.d.ts +2 -1
- package/package.json +4 -3
package/README.md
CHANGED
|
@@ -8,9 +8,13 @@ page.
|
|
|
8
8
|
|
|
9
9
|
[日本語](./README_ja.md)
|
|
10
10
|
|
|
11
|
+
## Live example
|
|
12
|
+
|
|
13
|
+
Hover over this link to [Plugin API](https://github.com/Rerurate514/riebeckite/blob/main/docs/docs/reference/plugin-api.md). The preview card is fetched and rendered by this plugin; keyboard focus opens it as well.
|
|
14
|
+
|
|
11
15
|
## Overview
|
|
12
16
|
|
|
13
|
-
At build time `
|
|
17
|
+
At build time `hoverPreview()` builds a preview index from the content
|
|
14
18
|
manifest (`permalink` → `{ title, excerpt, slug }`) and injects it once into
|
|
15
19
|
every page that contains internal links as an inert
|
|
16
20
|
`<script type="application/json" data-rb-hover-preview>` block. The client
|
|
@@ -26,15 +30,15 @@ bounded by `maxEntries` when set.
|
|
|
26
30
|
|
|
27
31
|
```ts
|
|
28
32
|
import { defineConfig } from "@riebeckite/core";
|
|
29
|
-
import {
|
|
33
|
+
import { hoverPreview } from "@riebeckite/plugin-hover-preview";
|
|
30
34
|
|
|
31
35
|
export default defineConfig({
|
|
32
36
|
// ...
|
|
33
|
-
plugins: [
|
|
37
|
+
plugins: [hoverPreview()],
|
|
34
38
|
});
|
|
35
39
|
```
|
|
36
40
|
|
|
37
|
-
`
|
|
41
|
+
`hoverPreview()` registers the style asset, the client entry, and the
|
|
38
42
|
build-time payload injection. `hoverPreview` is an alias of the same factory.
|
|
39
43
|
|
|
40
44
|
The client entry takes no arguments. Behavior is carried by data attributes on
|
|
@@ -53,7 +57,7 @@ called without options.
|
|
|
53
57
|
| `includeTitles` | `true` | Whether the popover shows the target entry title. |
|
|
54
58
|
|
|
55
59
|
```ts
|
|
56
|
-
|
|
60
|
+
hoverPreview({
|
|
57
61
|
delay: 200,
|
|
58
62
|
excerptLength: 120,
|
|
59
63
|
maxEntries: 200,
|
|
@@ -63,8 +67,8 @@ hoverPreviewPlugin({
|
|
|
63
67
|
|
|
64
68
|
## API
|
|
65
69
|
|
|
66
|
-
- `
|
|
67
|
-
- `hoverPreview` — alias of `
|
|
70
|
+
- `hoverPreview(options?)` — plugin factory
|
|
71
|
+
- `hoverPreview` — alias of `hoverPreview`
|
|
68
72
|
- `resolveHoverPreviewOptions(options?)` — applies defaults and returns a
|
|
69
73
|
`ResolvedHoverPreviewOptions`
|
|
70
74
|
- `buildPreviewIndex(entries, options)` — builds a `HoverPreviewIndex`
|
package/README_ja.md
CHANGED
|
@@ -6,27 +6,31 @@
|
|
|
6
6
|
|
|
7
7
|
[English](./README.md)
|
|
8
8
|
|
|
9
|
+
## 実行例
|
|
10
|
+
|
|
11
|
+
[Plugin API](https://github.com/Rerurate514/riebeckite/blob/main/docs/docs/reference/plugin-api.ja.md) へのリンクにカーソルを合わせてください。プレビューカードを取得して表示するのがこのプラグインです。キーボードフォーカスでも開きます。
|
|
12
|
+
|
|
9
13
|
## 概要
|
|
10
14
|
|
|
11
|
-
ビルド時に `
|
|
15
|
+
ビルド時に `hoverPreview()` がコンテンツマニフェストからプレビュー索引(`permalink` → `{ title, excerpt, slug }`)を作り、内部リンクを含むページへ一度だけ `<script type="application/json" data-rb-hover-preview>` として埋め込みます。クライアント側の `initHoverPreview` がこのデータを読み、対象リンクにホバー・フォーカス・タップの処理を付けます。
|
|
12
16
|
|
|
13
17
|
抜粋は描画済み HTML からタグを除いたプレーンテキストで、空白をまとめたうえで `excerptLength` 文字に切り詰めます。内部リンクのないページには何も挿入しません。`maxEntries` を指定するとページごとのデータ量を抑えられます。
|
|
14
18
|
|
|
15
|
-
##
|
|
19
|
+
## 使い方
|
|
16
20
|
|
|
17
21
|
```ts
|
|
18
22
|
import { defineConfig } from "@riebeckite/core";
|
|
19
|
-
import {
|
|
23
|
+
import { hoverPreview } from "@riebeckite/plugin-hover-preview";
|
|
20
24
|
|
|
21
25
|
export default defineConfig({
|
|
22
26
|
// ...
|
|
23
|
-
plugins: [
|
|
27
|
+
plugins: [hoverPreview()],
|
|
24
28
|
});
|
|
25
29
|
```
|
|
26
30
|
|
|
27
|
-
`
|
|
31
|
+
`hoverPreview()` がスタイル、クライアントエントリ、ビルド時のデータ注入をまとめて登録します。`hoverPreview` は同じファクトリの別名です。
|
|
28
32
|
|
|
29
|
-
クライアントエントリは引数を取りません。表示に関する設定はデータ用スクリプトの data
|
|
33
|
+
クライアントエントリは引数を取りません。表示に関する設定はデータ用スクリプトの data 属性に格納されるため、初期化処理をオプションなしで呼んでも動作します。
|
|
30
34
|
|
|
31
35
|
## オプション
|
|
32
36
|
|
|
@@ -40,7 +44,7 @@ export default defineConfig({
|
|
|
40
44
|
| `includeTitles` | `true` | ポップオーバーにタイトルを表示するか |
|
|
41
45
|
|
|
42
46
|
```ts
|
|
43
|
-
|
|
47
|
+
hoverPreview({
|
|
44
48
|
delay: 200,
|
|
45
49
|
excerptLength: 120,
|
|
46
50
|
maxEntries: 200,
|
|
@@ -50,8 +54,8 @@ hoverPreviewPlugin({
|
|
|
50
54
|
|
|
51
55
|
## 主なエクスポート
|
|
52
56
|
|
|
53
|
-
- `
|
|
54
|
-
- `hoverPreview`: `
|
|
57
|
+
- `hoverPreview(options?)`: プラグインを作成する
|
|
58
|
+
- `hoverPreview`: `hoverPreview` の別名
|
|
55
59
|
- `resolveHoverPreviewOptions(options?)`: 既定値を適用して `ResolvedHoverPreviewOptions` を返す
|
|
56
60
|
- `buildPreviewIndex(entries, options)`: `HoverPreviewIndex`(`permalink` → `{ title, excerpt, slug }`)を作る
|
|
57
61
|
- `htmlToPlainText(html)` / `createExcerpt(html, length)`: 抜粋を作る補助関数
|
package/dist/index.d.ts
CHANGED
|
@@ -4,5 +4,4 @@ export { DEFAULT_HOVER_PREVIEW_CLASS, DEFAULT_HOVER_PREVIEW_DELAY, DEFAULT_HOVER
|
|
|
4
4
|
export { buildPreviewIndex, createExcerpt, htmlToPlainText, } from "./src/preview-index.js";
|
|
5
5
|
export { HOVER_PREVIEW_ATTRIBUTE, HOVER_PREVIEW_SCRIPT_ID, hasInternalLink, renderHoverPreviewPayload, } from "./src/render.js";
|
|
6
6
|
export type { HoverPreviewEntry, HoverPreviewIndex, HoverPreviewOptions, ResolvedHoverPreviewOptions, } from "./src/types.js";
|
|
7
|
-
export declare function
|
|
8
|
-
export declare const hoverPreview: typeof hoverPreviewPlugin;
|
|
7
|
+
export declare function hoverPreview(options?: HoverPreviewOptions): import("@riebeckite/core").RiebeckitePlugin<HoverPreviewOptions>;
|
package/dist/index.js
CHANGED
|
@@ -305,7 +305,7 @@ function normalizeIndexSrc(value) {
|
|
|
305
305
|
}
|
|
306
306
|
|
|
307
307
|
// index.ts
|
|
308
|
-
function
|
|
308
|
+
function hoverPreview(options = {}) {
|
|
309
309
|
const resolved = resolveHoverPreviewOptions(options);
|
|
310
310
|
const runtime = createHoverPreviewRuntime(resolved);
|
|
311
311
|
return definePlugin({
|
|
@@ -316,6 +316,7 @@ function hoverPreviewPlugin(options = {}) {
|
|
|
316
316
|
},
|
|
317
317
|
options,
|
|
318
318
|
validateOptions: validateHoverPreviewOptions,
|
|
319
|
+
manifestHookCache: { version: "hover-preview-v1" },
|
|
319
320
|
onManifestCreated: (context) => {
|
|
320
321
|
const publicEntries = new Set(context.manifest.publicEntries);
|
|
321
322
|
runtime.inject(context.manifest, (entry) => publicEntries.has(entry));
|
|
@@ -336,7 +337,6 @@ function hoverPreviewPlugin(options = {}) {
|
|
|
336
337
|
]
|
|
337
338
|
});
|
|
338
339
|
}
|
|
339
|
-
var hoverPreview = hoverPreviewPlugin;
|
|
340
340
|
function validateHoverPreviewOptions(options) {
|
|
341
341
|
if (!options) return [];
|
|
342
342
|
const issues = [];
|
|
@@ -389,7 +389,6 @@ export {
|
|
|
389
389
|
createExcerpt,
|
|
390
390
|
hasInternalLink,
|
|
391
391
|
hoverPreview,
|
|
392
|
-
hoverPreviewPlugin,
|
|
393
392
|
htmlToPlainText,
|
|
394
393
|
initHoverPreview,
|
|
395
394
|
renderHoverPreviewPayload,
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import type { ContentManifestEntry } from "@riebeckite/core";
|
|
2
2
|
import type { HoverPreviewIndex } from "./types.js";
|
|
3
|
-
|
|
3
|
+
type PreviewIndexSource = {
|
|
4
4
|
permalink: string;
|
|
5
5
|
slug: string;
|
|
6
6
|
title: string;
|
|
@@ -12,3 +12,4 @@ export declare function buildPreviewIndex(entries: readonly (ContentManifestEntr
|
|
|
12
12
|
}): HoverPreviewIndex;
|
|
13
13
|
export declare function createExcerpt(html: string, length: number): string;
|
|
14
14
|
export declare function htmlToPlainText(html: string): string;
|
|
15
|
+
export {};
|
package/dist/src/runtime.d.ts
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import type { ContentManifest, ContentManifestEntry, PlannedGeneratedOutput } from "@riebeckite/core";
|
|
2
2
|
import type { ResolvedHoverPreviewOptions } from "./types.js";
|
|
3
|
-
|
|
3
|
+
type HoverPreviewRuntime = {
|
|
4
4
|
plan(entries: readonly ContentManifestEntry[]): readonly PlannedGeneratedOutput[];
|
|
5
5
|
inject(manifest: ContentManifest, shouldInclude?: (entry: ContentManifestEntry) => boolean): void;
|
|
6
6
|
};
|
|
7
7
|
export declare function createHoverPreviewRuntime(options: ResolvedHoverPreviewOptions): HoverPreviewRuntime;
|
|
8
|
+
export {};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@riebeckite/plugin-hover-preview",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.33",
|
|
4
4
|
"license": "Apache-2.0",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/index.js",
|
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
"./style.css": "./style.css"
|
|
22
22
|
},
|
|
23
23
|
"dependencies": {
|
|
24
|
-
"@riebeckite/core": "0.0.
|
|
24
|
+
"@riebeckite/core": "0.0.33"
|
|
25
25
|
},
|
|
26
26
|
"publishConfig": {
|
|
27
27
|
"access": "public"
|
|
@@ -56,6 +56,7 @@
|
|
|
56
56
|
"./style.css"
|
|
57
57
|
],
|
|
58
58
|
"scripts": {
|
|
59
|
-
"build": "node ../../../scripts/build_package.mjs"
|
|
59
|
+
"build": "node ../../../scripts/build_package.mjs",
|
|
60
|
+
"test": "node --import tsx --test \"test/*.test.ts\""
|
|
60
61
|
}
|
|
61
62
|
}
|