@riebeckite/plugin-breadcrumbs 0.0.22 → 0.0.24
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/dist/components/breadcrumbs.d.ts +9 -0
- package/dist/components/breadcrumbs.js +18 -0
- package/dist/index.d.ts +3 -1
- package/dist/index.js +47 -16
- package/dist/src/breadcrumbs.d.ts +6 -1
- package/package.json +10 -3
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import type { BreadcrumbItem } from "../src/types.js";
|
|
2
|
+
export type BreadcrumbsProps = {
|
|
3
|
+
items: readonly BreadcrumbItem[];
|
|
4
|
+
ariaLabel?: string;
|
|
5
|
+
className?: string;
|
|
6
|
+
separator?: string;
|
|
7
|
+
};
|
|
8
|
+
declare const Breadcrumbs: ({ items, ariaLabel, className, separator, }: Readonly<BreadcrumbsProps>) => import("hono/jsx/jsx-dev-runtime").JSX.Element;
|
|
9
|
+
export default Breadcrumbs;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
// components/breadcrumbs.tsx
|
|
2
|
+
import { jsx, jsxs } from "hono/jsx/jsx-runtime";
|
|
3
|
+
var Breadcrumbs = (({
|
|
4
|
+
items,
|
|
5
|
+
ariaLabel = "Breadcrumb",
|
|
6
|
+
className = "rb-breadcrumbs",
|
|
7
|
+
separator = "/"
|
|
8
|
+
}) => {
|
|
9
|
+
if (items.length === 0) return null;
|
|
10
|
+
return /* @__PURE__ */ jsx("nav", { class: className, "data-breadcrumbs": true, "aria-label": ariaLabel, children: /* @__PURE__ */ jsx("ol", { children: items.map((item, index) => /* @__PURE__ */ jsxs("li", { class: `${className}__item`, children: [
|
|
11
|
+
index === items.length - 1 ? /* @__PURE__ */ jsx("span", { class: `${className}__current`, "aria-current": "page", children: item.name }) : item.url ? /* @__PURE__ */ jsx("a", { class: `${className}__link`, href: item.url, children: item.name }) : /* @__PURE__ */ jsx("span", { class: `${className}__text`, children: item.name }),
|
|
12
|
+
index < items.length - 1 ? /* @__PURE__ */ jsx("span", { class: `${className}__separator`, "aria-hidden": "true", children: separator }) : null
|
|
13
|
+
] }, `${item.name}-${index}`)) }) });
|
|
14
|
+
});
|
|
15
|
+
var breadcrumbs_default = Breadcrumbs;
|
|
16
|
+
export {
|
|
17
|
+
breadcrumbs_default as default
|
|
18
|
+
};
|
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
import type { BreadcrumbsOptions } from "./src/types.js";
|
|
2
|
-
export {
|
|
2
|
+
export type { BreadcrumbsProps } from "./components/breadcrumbs.js";
|
|
3
|
+
export { default as Breadcrumbs } from "./components/breadcrumbs.js";
|
|
4
|
+
export { buildBreadcrumbItems, getBreadcrumbs, } from "./src/breadcrumbs.js";
|
|
3
5
|
export { resolveBreadcrumbsOptions } from "./src/options.js";
|
|
4
6
|
export { BREADCRUMBS_ATTRIBUTE, buildBreadcrumbHeadTag, buildBreadcrumbJsonLd, hasBreadcrumbHeadTag, renderBreadcrumbNav, } from "./src/render.js";
|
|
5
7
|
export type { BreadcrumbItem, BreadcrumbsOptions, ResolvedBreadcrumbsOptions, } from "./src/types.js";
|
package/dist/index.js
CHANGED
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
// index.ts
|
|
2
2
|
import {
|
|
3
|
-
appendContentBodySlot,
|
|
4
3
|
createStyleAsset,
|
|
5
4
|
definePlugin
|
|
6
5
|
} from "@riebeckite/core";
|
|
@@ -29,6 +28,24 @@ function buildBreadcrumbItems(args) {
|
|
|
29
28
|
});
|
|
30
29
|
return items;
|
|
31
30
|
}
|
|
31
|
+
var getBreadcrumbs = ({ view, entry, homeLabel = "" }) => {
|
|
32
|
+
if (!view.findRoutableBySlug(entry.slug)) return [];
|
|
33
|
+
const segments = publicPathSegments(entry.permalink);
|
|
34
|
+
const items = [];
|
|
35
|
+
if (homeLabel) pushBreadcrumbItem(items, { name: homeLabel, url: "/" });
|
|
36
|
+
for (let index = 0; index < segments.length - 1; index += 1) {
|
|
37
|
+
const pathname = `/${segments.slice(0, index + 1).join("/")}`;
|
|
38
|
+
const target = view.discoverableEntries.find(
|
|
39
|
+
(candidate) => candidate.permalink === pathname
|
|
40
|
+
);
|
|
41
|
+
pushBreadcrumbItem(items, {
|
|
42
|
+
name: target?.title || titleCaseSegment(segments[index]),
|
|
43
|
+
...target ? { url: target.permalink } : {}
|
|
44
|
+
});
|
|
45
|
+
}
|
|
46
|
+
pushBreadcrumbItem(items, { name: entry.title, url: entry.permalink });
|
|
47
|
+
return items;
|
|
48
|
+
};
|
|
32
49
|
function pushBreadcrumbItem(items, item) {
|
|
33
50
|
const previous = items.at(-1);
|
|
34
51
|
if (previous?.name === item.name) {
|
|
@@ -130,6 +147,22 @@ function hasBreadcrumbListType(value) {
|
|
|
130
147
|
return hasBreadcrumbListType(record["@graph"]);
|
|
131
148
|
}
|
|
132
149
|
|
|
150
|
+
// components/breadcrumbs.tsx
|
|
151
|
+
import { jsx, jsxs } from "hono/jsx/jsx-runtime";
|
|
152
|
+
var Breadcrumbs = (({
|
|
153
|
+
items,
|
|
154
|
+
ariaLabel = "Breadcrumb",
|
|
155
|
+
className = "rb-breadcrumbs",
|
|
156
|
+
separator = "/"
|
|
157
|
+
}) => {
|
|
158
|
+
if (items.length === 0) return null;
|
|
159
|
+
return /* @__PURE__ */ jsx("nav", { class: className, "data-breadcrumbs": true, "aria-label": ariaLabel, children: /* @__PURE__ */ jsx("ol", { children: items.map((item, index) => /* @__PURE__ */ jsxs("li", { class: `${className}__item`, children: [
|
|
160
|
+
index === items.length - 1 ? /* @__PURE__ */ jsx("span", { class: `${className}__current`, "aria-current": "page", children: item.name }) : item.url ? /* @__PURE__ */ jsx("a", { class: `${className}__link`, href: item.url, children: item.name }) : /* @__PURE__ */ jsx("span", { class: `${className}__text`, children: item.name }),
|
|
161
|
+
index < items.length - 1 ? /* @__PURE__ */ jsx("span", { class: `${className}__separator`, "aria-hidden": "true", children: separator }) : null
|
|
162
|
+
] }, `${item.name}-${index}`)) }) });
|
|
163
|
+
});
|
|
164
|
+
var breadcrumbs_default = Breadcrumbs;
|
|
165
|
+
|
|
133
166
|
// index.ts
|
|
134
167
|
var BREADCRUMBS_PLUGIN_NAME = "breadcrumbs";
|
|
135
168
|
function breadcrumbs(options = {}) {
|
|
@@ -141,7 +174,7 @@ function breadcrumbs(options = {}) {
|
|
|
141
174
|
version: "breadcrumbs-v1",
|
|
142
175
|
dependencyMode: "none"
|
|
143
176
|
},
|
|
144
|
-
|
|
177
|
+
contentOutputDependencies: [{ type: "global" }],
|
|
145
178
|
options,
|
|
146
179
|
validateOptions: validateBreadcrumbsOptions,
|
|
147
180
|
onManifestCreated: (context) => {
|
|
@@ -155,10 +188,6 @@ function breadcrumbs(options = {}) {
|
|
|
155
188
|
homeLabel: resolved.homeLabel
|
|
156
189
|
});
|
|
157
190
|
if (items.length === 0) continue;
|
|
158
|
-
const nav = renderBreadcrumbNav(items, resolved);
|
|
159
|
-
if (!hasSlotFragment(entry.bodySlots?.["article.header"], nav)) {
|
|
160
|
-
appendContentBodySlot(entry, "article.header", nav);
|
|
161
|
-
}
|
|
162
191
|
if (resolved.jsonLd) {
|
|
163
192
|
const schema = buildBreadcrumbJsonLd(config, items);
|
|
164
193
|
if (!hasBreadcrumbHeadTag(entry.headTags)) {
|
|
@@ -170,17 +199,15 @@ function breadcrumbs(options = {}) {
|
|
|
170
199
|
}
|
|
171
200
|
}
|
|
172
201
|
},
|
|
173
|
-
assets: [
|
|
202
|
+
assets: [
|
|
203
|
+
createStyleAsset(
|
|
204
|
+
BREADCRUMBS_PLUGIN_NAME,
|
|
205
|
+
"@riebeckite/plugin-breadcrumbs/style.css"
|
|
206
|
+
)
|
|
207
|
+
]
|
|
174
208
|
});
|
|
175
209
|
}
|
|
176
210
|
var breadcrumbsPlugin = breadcrumbs;
|
|
177
|
-
function hasSlotFragment(slot, fragment) {
|
|
178
|
-
return slot === fragment || slot?.startsWith(`${fragment}
|
|
179
|
-
`) || slot?.endsWith(`
|
|
180
|
-
${fragment}`) || slot?.includes(`
|
|
181
|
-
${fragment}
|
|
182
|
-
`) || false;
|
|
183
|
-
}
|
|
184
211
|
function validateBreadcrumbsOptions(options) {
|
|
185
212
|
if (!options) return [];
|
|
186
213
|
const issues = [];
|
|
@@ -194,19 +221,23 @@ function validateBreadcrumbsOptions(options) {
|
|
|
194
221
|
assertNonEmptyString("className");
|
|
195
222
|
assertNonEmptyString("ariaLabel");
|
|
196
223
|
assertNonEmptyString("separator");
|
|
197
|
-
|
|
198
|
-
|
|
224
|
+
for (const key of ["jsonLd"]) {
|
|
225
|
+
if (options[key] !== void 0 && typeof options[key] !== "boolean") {
|
|
226
|
+
issues.push({ path: key, message: "Expected a boolean." });
|
|
227
|
+
}
|
|
199
228
|
}
|
|
200
229
|
return issues;
|
|
201
230
|
}
|
|
202
231
|
export {
|
|
203
232
|
BREADCRUMBS_ATTRIBUTE,
|
|
204
233
|
BREADCRUMBS_PLUGIN_NAME,
|
|
234
|
+
breadcrumbs_default as Breadcrumbs,
|
|
205
235
|
breadcrumbs,
|
|
206
236
|
breadcrumbsPlugin,
|
|
207
237
|
buildBreadcrumbHeadTag,
|
|
208
238
|
buildBreadcrumbItems,
|
|
209
239
|
buildBreadcrumbJsonLd,
|
|
240
|
+
getBreadcrumbs,
|
|
210
241
|
hasBreadcrumbHeadTag,
|
|
211
242
|
renderBreadcrumbNav,
|
|
212
243
|
resolveBreadcrumbsOptions
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { ContentManifest, ContentManifestEntry, ResolvedRiebeckiteConfig } from "@riebeckite/core";
|
|
1
|
+
import type { ContentManifest, ContentManifestEntry, PluginDataHelper, PublicContentEntry, PublicContentView, ResolvedRiebeckiteConfig } from "@riebeckite/core";
|
|
2
2
|
import type { BreadcrumbItem } from "./types.js";
|
|
3
3
|
export type BuildBreadcrumbItemsArgs = {
|
|
4
4
|
manifest: ContentManifest;
|
|
@@ -7,3 +7,8 @@ export type BuildBreadcrumbItemsArgs = {
|
|
|
7
7
|
homeLabel: string;
|
|
8
8
|
};
|
|
9
9
|
export declare function buildBreadcrumbItems(args: BuildBreadcrumbItemsArgs): BreadcrumbItem[];
|
|
10
|
+
export declare const getBreadcrumbs: PluginDataHelper<{
|
|
11
|
+
view: PublicContentView;
|
|
12
|
+
entry: PublicContentEntry;
|
|
13
|
+
homeLabel?: string;
|
|
14
|
+
}, readonly BreadcrumbItem[]>;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@riebeckite/plugin-breadcrumbs",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.24",
|
|
4
4
|
"license": "Apache-2.0",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/index.js",
|
|
@@ -12,14 +12,21 @@
|
|
|
12
12
|
"source": "./index.ts",
|
|
13
13
|
"default": "./dist/index.js"
|
|
14
14
|
},
|
|
15
|
+
"./components": {
|
|
16
|
+
"types": "./dist/components/breadcrumbs.d.ts",
|
|
17
|
+
"import": "./dist/components/breadcrumbs.js",
|
|
18
|
+
"source": "./components/breadcrumbs.tsx",
|
|
19
|
+
"default": "./dist/components/breadcrumbs.js"
|
|
20
|
+
},
|
|
15
21
|
"./style.css": "./style.css"
|
|
16
22
|
},
|
|
17
23
|
"dependencies": {
|
|
18
|
-
"
|
|
24
|
+
"hono": "^4.12.25",
|
|
25
|
+
"@riebeckite/core": "0.0.24"
|
|
19
26
|
},
|
|
20
27
|
"devDependencies": {
|
|
21
28
|
"tsx": "^4.22.4",
|
|
22
|
-
"@riebeckite/test": "0.0.
|
|
29
|
+
"@riebeckite/test": "0.0.24"
|
|
23
30
|
},
|
|
24
31
|
"publishConfig": {
|
|
25
32
|
"access": "public"
|