@riebeckite/plugin-recent-posts 0.0.19 → 0.0.21

package/README.md

@@ -7,11 +7,13 @@ frontmatter date.
 
 ## Overview
 
-`recentPosts()` provides a `RecentPosts` component that renders an ordered list
-of recently posted articles. `getRecentPosts()` filters unpublished notes,
-derives a date from the frontmatter (`date` falling back to `created`), sorts
-newest first, and truncates to `limit` items. Notes without a parseable date
-are dropped.
+`RecentPosts` renders an ordered list of recently posted articles.
+`getRecentPosts()` reads
+`manifest.discoverableEntries`, so `unlisted`, `draft`, and scheduled notes are
+excluded. It derives a date from the frontmatter (`date` falling back to
+`created`), sorts newest first, and truncates to `limit` items. Notes without a
+parseable date are dropped. Official `starter` and `showcase` sites place the
+list explicitly in their homepage route after the page content.
 
 With no posts, the component renders nothing.
 
@@ -28,35 +30,30 @@ export default defineConfig({
 ```
 
 `recentPostsPlugin()` registers the plugin in the plugin list and bundles
-`style.css` into the app stylesheet.
+`style.css` into the app stylesheet; it never renders UI itself. The generated
+`starter` and `showcase` demonstrate the recommended homepage placement.
 
-### Render the component
+### Custom placement
 
 ```tsx
-import RecentPosts, { getRecentPosts } from "@riebeckite/plugin-recent-posts";
-import { config } from "../config";
-import { content } from "../content";
-import { getArticleTitle } from "../lib/article-title";
-
-const posts = await content.getAllPosts();
-const recentPosts = await getRecentPosts({
-  posts,
-  config,
-  getProcessedContent: (slug) => content.getProcessedContent(slug),
-  resolveTitle: getArticleTitle,
-  limit: 5,
-});
+import { RecentPosts, getRecentPosts } from "@riebeckite/plugin-recent-posts";
+import { content } from "virtual:riebeckite/content";
+
+const recentPosts = getRecentPosts({ manifest: await content.getManifest() });
 
-// ...in your route
-return <Article afterContent={<RecentPosts posts={recentPosts} />} />;
+// ...in a homepage route or site-owned layout
+return <RecentPosts posts={recentPosts} />;
 ```
 
 `getRecentPosts()` filters out the `index` note before collecting posts.
+To disable the generated homepage list, remove its `RecentPosts` import and
+`afterContent` prop. To reposition it, move that same element to the desired
+existing route or layout slot.
 
 ## Component
 
 `RecentPosts({ posts })` renders a
-`<section class="recent-posts rr-recent-posts">` with a heading and an ordered
+`<section class="rr-recent-posts">` with a heading and an ordered
 list. Each item links to the post and shows its date formatted for the
 `en-US` locale. The `rr-recent-posts` root hook is the stable class themes may
 target.
@@ -65,16 +62,17 @@ target.
 
 | Option | Type | Default | Description |
 | ------ | ---- | ------- | ----------- |
+| `manifest` | `Pick<ContentManifest, "discoverableEntries">` | — | Source of candidate posts |
 | `limit` | `number` | `5` | Maximum number of posts to return |
 
 ## Exports
 
 - `recentPostsPlugin()` — plugin factory
 - `RecentPosts` — list component (default export of `components/recent-posts.tsx`)
-- `getRecentPosts({ posts, config, getProcessedContent, resolveTitle, limit? })`
-  — collects the latest published posts
+- `getRecentPosts({ manifest, limit? })` — collects the latest discoverable
+  posts
 - Type: `RecentPost` (`{ slug, permalink, title, postedAt }`)
 
 ## See also
 
-- [Plugin guide](../../../docs/docs/reference/plugin-api.en.md)
+- [Plugin guide](../../../docs/docs/reference/plugin-api.md)

package/README_ja.md

@@ -6,7 +6,7 @@
 
 ## できること
 
-`getRecentPosts()` は非公開ノートと `index` ノートを除き、`frontmatter.date`、なければ `created` を基準に新しい順へ並べます。日付を解釈できないノートは一覧から外れます。`RecentPosts` は結果が空なら何も描画しません。
+`getRecentPosts()` は `manifest.discoverableEntries` を読み、unlisted・draft・予約公開のノートと `index` ノートを除き、`frontmatter.date`、なければ `created` を基準に新しい順へ並べます。日付を解釈できないノートは一覧から外れます。`RecentPosts` は結果が空なら何も描画しません。公式の `starter` と `showcase` は、ホームページ route で一覧を本文の後に明示的に配置します。
 
 ## 設定と配置
 
@@ -17,27 +17,30 @@ import { recentPostsPlugin } from "@riebeckite/plugin-recent-posts";
 export default defineConfig({ plugins: [recentPostsPlugin()] });
 ```
 
-一覧を置く場所はアプリ側で決めます。
+`recentPostsPlugin()` は UI を自動描画しません。生成された `starter` と `showcase` は推奨するホームページ配置を実装しています。独自の配置では、アプリ側で表示位置を決めます。
 
 ```tsx
-import RecentPosts, { getRecentPosts } from "@riebeckite/plugin-recent-posts";
+import { RecentPosts, getRecentPosts } from "@riebeckite/plugin-recent-posts";
+import { content } from "virtual:riebeckite/content";
 
-const posts = await getRecentPosts({ posts: await content.getAllPosts(), config, getProcessedContent: content.getProcessedContent, resolveTitle, limit: 5 });
-return <Article afterContent={<RecentPosts posts={posts} />} />;
+const posts = getRecentPosts({ manifest: await content.getManifest() });
+return <RecentPosts posts={posts} />;
 ```
 
+生成されたホームページの一覧を無効にするには、`RecentPosts` の import と `afterContent` prop を削除します。位置を変える場合は、同じ要素を既存の route または layout の目的の slot へ移動します。
+
 | オプション | 既定値 | 内容 |
 | --- | --- | --- |
+| `manifest` | 必須 | 候補ノートの取得元（`discoverableEntries`） |
 | `limit` | `5` | 返す記事数の上限 |
 
 ## 公開 API
 
 - `recentPostsPlugin()` — プラグインファクトリ
 - `RecentPosts` — 最新記事一覧コンポーネント
-- `getRecentPosts({ posts, config, getProcessedContent, resolveTitle, limit? })`
+- `getRecentPosts({ manifest, limit? })`
 - `RecentPost` — `{ slug, permalink, title, postedAt }` の型
 
 ## 関連資料
 
-- [プラグインシステム](../../../docs/docs/reference/plugin-api.md)
-
+- [プラグインシステム](../../../docs/docs/reference/plugin-api.ja.md)

package/dist/components/recent-posts.d.ts

@@ -1,6 +1,6 @@
 import type { RecentPost } from "../src/recent-posts.js";
 type Props = {
-    posts: RecentPost[];
+    posts?: RecentPost[];
 };
 export default function RecentPosts(props: Props): import("hono/jsx/jsx-dev-runtime").JSX.Element;
 export {};

package/dist/components/recent-posts.js

@@ -1,32 +1,26 @@
 // components/recent-posts.tsx
 import { jsx, jsxs } from "hono/jsx/jsx-runtime";
 function RecentPosts(props) {
-  if (props.posts.length === 0) return null;
-  return /* @__PURE__ */ jsxs(
-    "section",
-    {
-      class: "recent-posts rr-recent-posts",
-      "aria-labelledby": "recent-posts-title",
-      children: [
-        /* @__PURE__ */ jsx("div", { class: "recent-posts__header", children: /* @__PURE__ */ jsx("h2", { class: "recent-posts__title", id: "recent-posts-title", children: "Recent Posts" }) }),
-        /* @__PURE__ */ jsx("ol", { class: "recent-posts__list", children: props.posts.map((post) => {
-          const formattedDate = formatPostedDate(post.postedAt);
-          return /* @__PURE__ */ jsx("li", { class: "recent-posts__item", children: /* @__PURE__ */ jsxs("a", { class: "recent-posts__link", href: post.permalink, children: [
-            /* @__PURE__ */ jsx(
-              "time",
-              {
-                class: "recent-posts__date",
-                dateTime: formattedDate.isoDate,
-                title: formattedDate.fullDate,
-                children: formattedDate.displayDate
-              }
-            ),
-            /* @__PURE__ */ jsx("span", { class: "recent-posts__post-title", children: post.title })
-          ] }) }, post.slug);
-        }) })
-      ]
-    }
-  );
+  const posts = props.posts ?? [];
+  if (posts.length === 0) return null;
+  return /* @__PURE__ */ jsxs("section", { class: "rr-recent-posts", "aria-labelledby": "recent-posts-title", children: [
+    /* @__PURE__ */ jsx("div", { class: "rr-recent-posts__header", children: /* @__PURE__ */ jsx("h2", { class: "rr-recent-posts__title", id: "recent-posts-title", children: "Recent Posts" }) }),
+    /* @__PURE__ */ jsx("ol", { class: "rr-recent-posts__list", children: posts.map((post) => {
+      const formattedDate = formatPostedDate(post.postedAt);
+      return /* @__PURE__ */ jsx("li", { class: "rr-recent-posts__item", children: /* @__PURE__ */ jsxs("a", { class: "rr-recent-posts__link", href: post.permalink, children: [
+        /* @__PURE__ */ jsx(
+          "time",
+          {
+            class: "rr-recent-posts__date",
+            dateTime: formattedDate.isoDate,
+            title: formattedDate.fullDate,
+            children: formattedDate.displayDate
+          }
+        ),
+        /* @__PURE__ */ jsx("span", { class: "rr-recent-posts__post-title", children: post.title })
+      ] }) }, post.slug);
+    }) })
+  ] });
 }
 function formatPostedDate(date) {
   const isoDate = date.toISOString();

package/dist/index.js

@@ -4,32 +4,26 @@ import { definePlugin } from "@riebeckite/core";
 // components/recent-posts.tsx
 import { jsx, jsxs } from "hono/jsx/jsx-runtime";
 function RecentPosts(props) {
-  if (props.posts.length === 0) return null;
-  return /* @__PURE__ */ jsxs(
-    "section",
-    {
-      class: "recent-posts rr-recent-posts",
-      "aria-labelledby": "recent-posts-title",
-      children: [
-        /* @__PURE__ */ jsx("div", { class: "recent-posts__header", children: /* @__PURE__ */ jsx("h2", { class: "recent-posts__title", id: "recent-posts-title", children: "Recent Posts" }) }),
-        /* @__PURE__ */ jsx("ol", { class: "recent-posts__list", children: props.posts.map((post) => {
-          const formattedDate = formatPostedDate(post.postedAt);
-          return /* @__PURE__ */ jsx("li", { class: "recent-posts__item", children: /* @__PURE__ */ jsxs("a", { class: "recent-posts__link", href: post.permalink, children: [
-            /* @__PURE__ */ jsx(
-              "time",
-              {
-                class: "recent-posts__date",
-                dateTime: formattedDate.isoDate,
-                title: formattedDate.fullDate,
-                children: formattedDate.displayDate
-              }
-            ),
-            /* @__PURE__ */ jsx("span", { class: "recent-posts__post-title", children: post.title })
-          ] }) }, post.slug);
-        }) })
-      ]
-    }
-  );
+  const posts = props.posts ?? [];
+  if (posts.length === 0) return null;
+  return /* @__PURE__ */ jsxs("section", { class: "rr-recent-posts", "aria-labelledby": "recent-posts-title", children: [
+    /* @__PURE__ */ jsx("div", { class: "rr-recent-posts__header", children: /* @__PURE__ */ jsx("h2", { class: "rr-recent-posts__title", id: "recent-posts-title", children: "Recent Posts" }) }),
+    /* @__PURE__ */ jsx("ol", { class: "rr-recent-posts__list", children: posts.map((post) => {
+      const formattedDate = formatPostedDate(post.postedAt);
+      return /* @__PURE__ */ jsx("li", { class: "rr-recent-posts__item", children: /* @__PURE__ */ jsxs("a", { class: "rr-recent-posts__link", href: post.permalink, children: [
+        /* @__PURE__ */ jsx(
+          "time",
+          {
+            class: "rr-recent-posts__date",
+            dateTime: formattedDate.isoDate,
+            title: formattedDate.fullDate,
+            children: formattedDate.displayDate
+          }
+        ),
+        /* @__PURE__ */ jsx("span", { class: "rr-recent-posts__post-title", children: post.title })
+      ] }) }, post.slug);
+    }) })
+  ] });
 }
 function formatPostedDate(date) {
   const isoDate = date.toISOString();
@@ -46,24 +40,23 @@ function formatPostedDate(date) {
 }
 
 // src/recent-posts.server.ts
-async function getRecentPosts(args) {
-  const limit = args.limit ?? 5;
-  const recentPosts = await Promise.all(
-    args.posts.filter((post) => post.slug !== "index").map(async (post) => {
-      const processed = await args.getProcessedContent(post.slug);
-      const postedAt = parseFrontmatterDate(
-        processed.frontmatter.date ?? processed.frontmatter.created
-      );
-      if (!postedAt) return null;
-      return {
-        slug: post.slug,
-        permalink: post.permalink,
-        title: args.resolveTitle(post.slug, processed.frontmatter.title),
+var DEFAULT_RECENT_POSTS_LIMIT = 5;
+function getRecentPosts(args) {
+  const limit = Math.max(0, args.limit ?? DEFAULT_RECENT_POSTS_LIMIT);
+  return args.manifest.discoverableEntries.filter((entry) => entry.slug !== "index").flatMap((entry) => {
+    const postedAt = parseFrontmatterDate(
+      entry.frontmatter.date ?? entry.frontmatter.created
+    );
+    if (!postedAt) return [];
+    return [
+      {
+        slug: entry.slug,
+        permalink: entry.permalink,
+        title: entry.title,
         postedAt
-      };
-    })
-  );
-  return recentPosts.filter((post) => post !== null).toSorted((a, b) => b.postedAt.getTime() - a.postedAt.getTime()).slice(0, limit);
+      }
+    ];
+  }).toSorted((a, b) => b.postedAt.getTime() - a.postedAt.getTime()).slice(0, limit);
 }
 function parseFrontmatterDate(value) {
   if (value instanceof Date) return value;

package/dist/src/recent-posts.server.d.ts

@@ -1,18 +1,16 @@
-import type { ResolvedRiebeckiteConfig } from "@riebeckite/core";
+import type { ContentManifest } from "@riebeckite/core";
 import type { RecentPost } from "./recent-posts.js";
-type PostRef = {
-    slug: string;
-    permalink: string;
-};
-type ProcessedPost = {
-    frontmatter: Record<string, unknown>;
-};
-type TitleResolver = (slug: string, title: unknown) => string;
+export declare const DEFAULT_RECENT_POSTS_LIMIT = 5;
+/**
+ * Builds the recent-posts list from the manifest.
+ *
+ * Reads `manifest.discoverableEntries` on purpose: discovery UI must never
+ * surface `unlisted`, `draft`, or future-`publishAt` notes that are not
+ * discoverable, even though some of them are routable. The plugin owns the
+ * entry selection, the frontmatter date extraction, the sort, and the default
+ * title so a Site only decides whether and where to render the list.
+ */
 export declare function getRecentPosts(args: {
-    posts: PostRef[];
-    config: ResolvedRiebeckiteConfig;
-    getProcessedContent: (slug: string) => Promise<ProcessedPost>;
-    resolveTitle: TitleResolver;
+    manifest: Pick<ContentManifest, "discoverableEntries">;
     limit?: number;
-}): Promise<RecentPost[]>;
-export {};
+}): RecentPost[];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@riebeckite/plugin-recent-posts",
-  "version": "0.0.19",
+  "version": "0.0.21",
   "license": "Apache-2.0",
   "type": "module",
   "main": "./dist/index.js",
@@ -22,7 +22,7 @@
   },
   "dependencies": {
     "hono": "^4.12.25",
-    "@riebeckite/core": "0.0.19"
+    "@riebeckite/core": "0.0.21"
   },
   "devDependencies": {
     "tsx": "^4.22.4"

package/style.css

@@ -1,35 +1,37 @@
 @layer components {
-  .recent-posts {
-    margin-top: 4rem;
+  .rr-recent-posts {
+    margin-top: var(--rb-space-6, 3rem);
     padding-top: 1.5rem;
-    border-top: 1px solid color-mix(in srgb, currentColor 18%, transparent);
+    border-top: 1px solid
+      var(--rb-color-border, color-mix(in srgb, currentColor 18%, transparent));
   }
 
-  .recent-posts__header {
+  .rr-recent-posts__header {
     margin-bottom: 1.25rem;
   }
 
-  .recent-posts__title {
+  .rr-recent-posts__title {
     margin: 0;
-    font-size: clamp(1.5rem, 4vw, 2rem);
+    font-size: 1.125rem;
+    font-weight: 700;
     line-height: 1.2;
     letter-spacing: -0.02em;
   }
 
-  .recent-posts__list {
+  .rr-recent-posts__list {
     display: grid;
     margin: 0;
     padding: 0;
     list-style: none;
   }
 
-  .recent-posts__item {
+  .rr-recent-posts__item {
     margin: 0;
     padding: 0;
     border-bottom: 1px solid color-mix(in srgb, currentColor 14%, transparent);
   }
 
-  .recent-posts__link {
+  .rr-recent-posts__link {
     display: grid;
     gap: 0.375rem;
     padding: 1rem 0;
@@ -40,30 +42,30 @@
       padding-inline 160ms ease;
   }
 
-  .recent-posts__link:hover,
-  .recent-posts__link:focus-visible {
+  .rr-recent-posts__link:hover,
+  .rr-recent-posts__link:focus-visible {
     color: var(--rb-color-accent);
   }
 
-  .recent-posts__link:focus-visible {
+  .rr-recent-posts__link:focus-visible {
     outline: 2px solid var(--rb-color-accent);
     outline-offset: 4px;
   }
 
-  .recent-posts__date {
+  .rr-recent-posts__date {
     font-size: 0.75rem;
     font-weight: 700;
     letter-spacing: 0.08em;
     color: color-mix(in srgb, currentColor 62%, transparent);
   }
 
-  .recent-posts__post-title {
+  .rr-recent-posts__post-title {
     font-size: 1rem;
     line-height: 1.5;
   }
 
   @media (min-width: 40rem) {
-    .recent-posts__link {
+    .rr-recent-posts__link {
       grid-template-columns: 8rem minmax(0, 1fr);
       align-items: baseline;
       gap: 1.5rem;