@weekend-studio/easyblog-next 0.0.1

package/README.md

@@ -0,0 +1,16 @@
+## Easyblog
+
+- `npm install @weekend-studio/easyblog` 
+- Publish: `npm publish --access public` 
+
+## NextJS with App Router
+
+
+## NextJS with Page Router
+
+## Release
+
+- Create a release branch from main: `git checkout -b release/v1.0.0`
+- Update version in package.json: `npm version patch/minor/major`
+- Push release branch: `git push -u origin release/v1.0.0`
+- Create a Pull Request to merge into main

package/dist/app-index.d.ts

@@ -0,0 +1,39 @@
+import { EasyBlogConfig, IQueryParams } from './models.js';
+import { Metadata } from 'next';
+import React from 'react';
+
+declare function getBlogPosts(config: EasyBlogConfig, params?: IQueryParams): Promise<any>;
+declare function getBlogPost(config: EasyBlogConfig, slug: string): Promise<any>;
+declare function getBlogPaths(config: EasyBlogConfig): Promise<any>;
+declare function generateMetadata(config: EasyBlogConfig, slug?: string): Promise<Metadata>;
+
+interface NextBlogPageProps {
+    config: EasyBlogConfig;
+    slug: string;
+    style?: React.CSSProperties;
+}
+declare function NextBlogPage(props: NextBlogPageProps): Promise<React.JSX.Element>;
+
+interface NextBlogListPageProps {
+    config: EasyBlogConfig;
+    type: 'grid' | 'list';
+    searchParams?: {
+        page?: string;
+        category?: string;
+        tags?: string;
+    };
+    displayOptions?: {
+        showThumbnail?: boolean;
+        showReadingTime?: boolean;
+        showExcerpt?: boolean;
+        showTags?: boolean;
+        showDate?: boolean;
+        showAuthor?: boolean;
+        showCategory?: boolean;
+        isNextPage?: boolean;
+        blogPerPage?: number;
+    };
+}
+declare function NextBlogListPage(props: NextBlogListPageProps): Promise<React.JSX.Element>;
+
+export { NextBlogListPage, NextBlogPage, generateMetadata, getBlogPaths, getBlogPost, getBlogPosts };

package/dist/app-index.mjs

@@ -0,0 +1,585 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+
+// src/app/NextAppRouterUtils.ts
+import { cache } from "react";
+import { notFound } from "next/navigation";
+
+// src/app/BaseUtils.ts
+async function exchangeToken(config) {
+  try {
+    const response = await fetch(`${config.apiUrl}/exchange-token`, {
+      method: "POST",
+      headers: {
+        "Authorization": `Bearer ${config.apiKey}`,
+        "x-project-id": config.projectId
+      }
+    });
+    if (!response.ok) {
+      console.error("Failed to exchange token:", response);
+      throw new Error("Failed to authenticate");
+    }
+    const data = await response.json();
+    return data.token;
+  } catch (error) {
+    console.error("Failed to exchange token:", error);
+    return null;
+  }
+}
+
+// src/app/lib/utils.ts
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+var getFormattedDate = (date) => {
+  if (!date) return "";
+  return new Date(date).toISOString().split("T")[0];
+};
+var getVisiblePages = (current, total) => {
+  if (total <= 7) return Array.from({ length: total }, (_, i) => i + 1);
+  if (current <= 3) return [1, 2, 3, 4, 5, null, total];
+  if (current >= total - 2) return [1, null, total - 4, total - 3, total - 2, total - 1, total];
+  return [1, null, current - 1, current, current + 1, null, total];
+};
+
+// src/app/NextAppRouterUtils.ts
+var getAuthToken = cache(async (config) => {
+  return exchangeToken(config);
+});
+async function getBlogPosts(config, params = {}) {
+  const token = await getAuthToken(config);
+  const queryString = new URLSearchParams(
+    Object.entries(params).map(([key, value]) => [key, String(value)])
+  ).toString();
+  const url = `${config.apiUrl}/sdk/blogs${queryString ? `?${queryString}` : ""}`;
+  const response = await fetch(url, {
+    headers: {
+      "Authorization": `Bearer ${token}`,
+      "x-project-id": config.projectId
+    },
+    next: { revalidate: 3600 }
+  });
+  if (!response.ok) {
+    console.error("Failed to fetch blog posts:", response);
+    throw new Error(`Failed to fetch blog posts: ${response.status} ${response.statusText}`);
+  }
+  const data = await response.json();
+  return data;
+}
+async function getBlogPost(config, slug) {
+  const token = await getAuthToken(config);
+  const response = await fetch(`${config.apiUrl}/sdk/blogs/${slug}`, {
+    headers: {
+      "Authorization": `Bearer ${token}`,
+      "x-project-id": config.projectId
+    },
+    next: { revalidate: 3600 }
+  });
+  if (!response.ok) {
+    throw new Error(`Failed to fetch blog post: ${response.status} ${response.statusText}`);
+  }
+  return response.json();
+}
+async function getBlogPaths(config) {
+  const { blogs } = await getBlogPosts(config, { index: 0, limit: 1e4 });
+  return blogs.map((blog) => ({ slug: blog.slug }));
+}
+async function generateMetadata(config, slug) {
+  var _a, _b;
+  if (slug) {
+    const post = await getBlogPost(config, slug);
+    if (!post) return notFound();
+    return {
+      title: post.title,
+      description: (_a = post.excerpt) == null ? void 0 : _a.substring(0, 160),
+      openGraph: {
+        title: post.title,
+        description: (_b = post.excerpt) == null ? void 0 : _b.substring(0, 160),
+        type: "article",
+        publishedTime: getFormattedDate(post.created_at),
+        tags: post.tags
+      }
+    };
+  }
+  return {
+    title: "Blog",
+    description: "Read our latest blog posts",
+    openGraph: {
+      title: "Blog",
+      description: "Read our latest blog posts",
+      type: "website"
+    }
+  };
+}
+
+// src/app/components/NextBlogPage.tsx
+import React4 from "react";
+import { notFound as notFound2 } from "next/navigation";
+
+// src/app/components/Article.tsx
+import React3 from "react";
+import { lowlight as low } from "lowlight/lib/core";
+
+// src/app/components/ui/linkBadge.tsx
+import Link from "next/link";
+
+// src/app/components/ui/badge.tsx
+import * as React from "react";
+import { cva } from "class-variance-authority";
+var badgeVariants = cva(
+  "inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
+  {
+    variants: {
+      variant: {
+        default: "border-transparent bg-primary text-primary-foreground shadow hover:bg-primary/80",
+        secondary: "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80",
+        destructive: "border-transparent bg-destructive text-destructive-foreground shadow hover:bg-destructive/80",
+        outline: "text-foreground"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+function Badge(_a) {
+  var _b = _a, { className, variant } = _b, props = __objRest(_b, ["className", "variant"]);
+  return /* @__PURE__ */ React.createElement("div", __spreadValues({ className: cn(badgeVariants({ variant }), className) }, props));
+}
+
+// src/app/components/ui/linkBadge.tsx
+import React2 from "react";
+var LinkBadge = ({ children, href }) => {
+  return /* @__PURE__ */ React2.createElement(Link, { href }, /* @__PURE__ */ React2.createElement(Badge, { variant: "outline", className: "text-xs hover:cursor-pointer hover:bg-primary hover:text-primary-foreground" }, children));
+};
+
+// src/app/components/Article.tsx
+import javascript from "highlight.js/lib/languages/javascript";
+import typescript from "highlight.js/lib/languages/typescript";
+import css from "highlight.js/lib/languages/css";
+import html from "highlight.js/lib/languages/xml";
+var Article = ({ post, content, style }) => {
+  low.registerLanguage("css", css);
+  low.registerLanguage("js", javascript);
+  low.registerLanguage("ts", typescript);
+  low.registerLanguage("html", html);
+  const contentHtml = {
+    __html: content
+  };
+  return post && /* @__PURE__ */ React3.createElement("article", { style, className: "easyblog" }, post.thumbnail && /* @__PURE__ */ React3.createElement("img", { src: post.thumbnail, alt: post.title, className: "w-full h-64 object-cover mb-8 rounded-lg" }), /* @__PURE__ */ React3.createElement("header", null, /* @__PURE__ */ React3.createElement("h1", { className: "title" }, post.title), /* @__PURE__ */ React3.createElement("div", { className: "info" }, /* @__PURE__ */ React3.createElement("div", { className: "author" }, "Created by ", /* @__PURE__ */ React3.createElement("span", { className: "font-semibold" }, post.author)), /* @__PURE__ */ React3.createElement("div", { className: "date" }, "Published at ", /* @__PURE__ */ React3.createElement("span", { className: "font-semibold" }, getFormattedDate(post.created_at))))), /* @__PURE__ */ React3.createElement("div", { className: "content", dangerouslySetInnerHTML: contentHtml }), /* @__PURE__ */ React3.createElement("footer", { className: "mt-8 pt-4 border-t border-gray-200" }, post.tags && post.tags.length > 0 && /* @__PURE__ */ React3.createElement("div", { className: "flex flex-wrap gap-2 my-4" }, /* @__PURE__ */ React3.createElement("span", { className: "text-sm font-semibold " }, "Tags"), /* @__PURE__ */ React3.createElement("div", { className: "flex flex-wrap gap-2" }, post.tags.map((tag, index) => /* @__PURE__ */ React3.createElement(LinkBadge, { href: `/blogs?tags=${tag}`, key: index }, tag)))), post.category && /* @__PURE__ */ React3.createElement("div", { className: "flex flex-wrap gap-2 my-4" }, /* @__PURE__ */ React3.createElement("span", { className: "text-sm font-semibold" }, "Category"), /* @__PURE__ */ React3.createElement(LinkBadge, { href: `/blogs?category=${post.category}` }, post.category))));
+};
+
+// src/app/components/NextBlogPage.tsx
+async function NextBlogPage(props) {
+  try {
+    const response = await getBlogPost({
+      apiKey: props.config.apiKey,
+      projectId: props.config.projectId,
+      apiUrl: props.config.apiUrl
+    }, props.slug);
+    if (!response.blog) return notFound2();
+    const post = response.blog;
+    const htmlContent = response.html_content;
+    return /* @__PURE__ */ React4.createElement(
+      Article,
+      {
+        post,
+        content: htmlContent,
+        style: props.style
+      }
+    );
+  } catch (error) {
+    console.error("Error fetching blog post:", error);
+    return notFound2();
+  }
+}
+
+// src/app/components/NextBlogListPage.tsx
+import React10 from "react";
+
+// src/app/components/ArticleGroup.tsx
+import React7 from "react";
+
+// src/app/components/ArticleCard.tsx
+import React6 from "react";
+
+// src/app/components/ui/card.tsx
+import * as React5 from "react";
+var Card = React5.forwardRef((_a, ref) => {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ React5.createElement(
+    "div",
+    __spreadValues({
+      ref,
+      className: cn(
+        "rounded-xl border bg-card text-card-foreground shadow",
+        className
+      )
+    }, props)
+  );
+});
+Card.displayName = "Card";
+var CardHeader = React5.forwardRef((_a, ref) => {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ React5.createElement(
+    "div",
+    __spreadValues({
+      ref,
+      className: cn("flex flex-col space-y-1.5 p-6", className)
+    }, props)
+  );
+});
+CardHeader.displayName = "CardHeader";
+var CardTitle = React5.forwardRef((_a, ref) => {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ React5.createElement(
+    "div",
+    __spreadValues({
+      ref,
+      className: cn("font-semibold leading-none tracking-tight", className)
+    }, props)
+  );
+});
+CardTitle.displayName = "CardTitle";
+var CardDescription = React5.forwardRef((_a, ref) => {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ React5.createElement(
+    "div",
+    __spreadValues({
+      ref,
+      className: cn("text-sm text-muted-foreground", className)
+    }, props)
+  );
+});
+CardDescription.displayName = "CardDescription";
+var CardContent = React5.forwardRef((_a, ref) => {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ React5.createElement("div", __spreadValues({ ref, className: cn("p-6 pt-0", className) }, props));
+});
+CardContent.displayName = "CardContent";
+var CardFooter = React5.forwardRef((_a, ref) => {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ React5.createElement(
+    "div",
+    __spreadValues({
+      ref,
+      className: cn("flex items-center p-6 pt-0", className)
+    }, props)
+  );
+});
+CardFooter.displayName = "CardFooter";
+
+// src/app/components/ArticleCard.tsx
+import Link2 from "next/link.js";
+var ArticleCard = ({
+  blog,
+  showThumbnail = true,
+  showReadingTime = true,
+  showExcerpt = true,
+  showTags = true,
+  showDate = true,
+  horizontal = false,
+  showAuthor = true,
+  showCategory = true,
+  isNextPage = false
+}) => {
+  const renderTags = (tags) => {
+    return tags.map((tag, index) => {
+      return isNextPage ? /* @__PURE__ */ React6.createElement(LinkBadge, { key: index, href: `/blogs/?tags=${tag}` }, tag) : /* @__PURE__ */ React6.createElement(Badge, { key: index, variant: "outline", className: "text-xs rounded-full hover:cursor-pointer hover:bg-primary hover:text-primary-foreground" }, tag);
+    });
+  };
+  const renderCategory = () => {
+    return isNextPage ? /* @__PURE__ */ React6.createElement(Link2, { href: `/blogs/?category=${blog.category}`, className: "hover:underline" }, " | ", blog.category) : /* @__PURE__ */ React6.createElement("span", null, " | ", blog.category);
+  };
+  const renderThumbnail = () => {
+    return isNextPage ? /* @__PURE__ */ React6.createElement(Link2, { href: `/blogs/${blog.slug}` }, /* @__PURE__ */ React6.createElement("img", { className: `${horizontal ? "w-48 h-full" : "w-full h-48"} object-cover`, src: blog.thumbnail, alt: blog.title })) : /* @__PURE__ */ React6.createElement("img", { className: `${horizontal ? "w-48 h-full" : "w-full h-48"} object-cover`, src: blog.thumbnail, alt: blog.title });
+  };
+  const renderTitle = () => {
+    return isNextPage ? /* @__PURE__ */ React6.createElement(Link2, { href: `/blogs/${blog.slug}`, className: "hover:underline text-primary" }, blog.title) : /* @__PURE__ */ React6.createElement("h3", { className: "font-bold text-xl mb-2 text-wrap" }, blog.title);
+  };
+  return /* @__PURE__ */ React6.createElement(Card, { className: `max-w-full overflow-hidden ${horizontal ? "flex flex-row" : ""}` }, blog.thumbnail && showThumbnail && /* @__PURE__ */ React6.createElement(CardHeader, { className: "p-0" }, renderThumbnail()), /* @__PURE__ */ React6.createElement(CardContent, { className: "p-6" }, renderTitle(), (showAuthor || showDate || showCategory) && /* @__PURE__ */ React6.createElement("p", { className: "text-muted-foreground" }, showAuthor && /* @__PURE__ */ React6.createElement("span", null, blog.author), " ", showDate && /* @__PURE__ */ React6.createElement("span", null, "| ", getFormattedDate(blog.created_at)), " ", blog.category && showCategory && renderCategory()), blog.reading_time && showReadingTime && /* @__PURE__ */ React6.createElement("p", { className: "text-muted-foreground text-sm mt-2" }, blog.reading_time, " minutes to read"), showExcerpt && /* @__PURE__ */ React6.createElement("p", { className: "text-muted-foreground text-sm mt-2" }, blog.excerpt), horizontal && /* @__PURE__ */ React6.createElement("div", { className: "mt-4 flex flex-wrap gap-2 items-start" }, showTags && blog.tags.map((tag, index) => /* @__PURE__ */ React6.createElement(LinkBadge, { key: index, href: `/blogs?tags=${tag}` }, tag)))), !horizontal && /* @__PURE__ */ React6.createElement(CardFooter, { className: "flex flex-wrap gap-2 items-start" }, showTags && renderTags(blog.tags)));
+};
+
+// src/app/components/ArticleGroup.tsx
+var ArticleGroup = ({
+  type,
+  blogs,
+  showThumbnail = true,
+  showReadingTime = true,
+  showExcerpt = true,
+  showTags = true,
+  showDate = true,
+  showAuthor = true,
+  showCategory = true,
+  isNextPage = false
+}) => {
+  if (!blogs || blogs.length === 0) {
+    return /* @__PURE__ */ React7.createElement("div", null, "No blogs found. Please refresh the page.");
+  }
+  const renderGridView = () => {
+    return /* @__PURE__ */ React7.createElement("div", { className: "grid grid-cols-1 md:grid-cols-3 lg:grid-cols-3 gap-6" }, blogs.map((blog) => /* @__PURE__ */ React7.createElement(
+      ArticleCard,
+      {
+        key: blog._id,
+        blog,
+        showThumbnail,
+        showReadingTime,
+        showExcerpt,
+        showTags,
+        showDate,
+        showAuthor,
+        showCategory,
+        isNextPage
+      }
+    )));
+  };
+  const renderListView = () => {
+    return /* @__PURE__ */ React7.createElement("div", { className: "flex flex-col gap-4 min-w-[800px]" }, blogs.map((blog) => /* @__PURE__ */ React7.createElement(
+      ArticleCard,
+      {
+        key: blog._id,
+        blog,
+        showThumbnail,
+        showReadingTime,
+        showExcerpt,
+        showTags,
+        showDate,
+        showAuthor,
+        showCategory,
+        horizontal: true,
+        isNextPage
+      }
+    )));
+  };
+  return /* @__PURE__ */ React7.createElement("div", null, type === "grid" ? renderGridView() : renderListView());
+};
+
+// src/app/components/ui/pagination.tsx
+import * as React9 from "react";
+import { ChevronLeft, ChevronRight, MoreHorizontal } from "lucide-react";
+
+// src/app/components/ui/button.tsx
+import * as React8 from "react";
+import { Slot } from "@radix-ui/react-slot";
+import { cva as cva2 } from "class-variance-authority";
+var buttonVariants = cva2(
+  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground shadow hover:bg-primary/90",
+        destructive: "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
+        outline: "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
+        secondary: "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
+        ghost: "hover:bg-accent hover:text-accent-foreground",
+        link: "text-primary underline-offset-4 hover:underline"
+      },
+      size: {
+        default: "h-9 px-4 py-2",
+        sm: "h-8 rounded-md px-3 text-xs",
+        lg: "h-10 rounded-md px-8",
+        icon: "h-9 w-9"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+var Button = React8.forwardRef(
+  (_a, ref) => {
+    var _b = _a, { className, variant, size, asChild = false } = _b, props = __objRest(_b, ["className", "variant", "size", "asChild"]);
+    const Comp = asChild ? Slot : "button";
+    return /* @__PURE__ */ React8.createElement(
+      Comp,
+      __spreadValues({
+        className: cn(buttonVariants({ variant, size, className })),
+        ref
+      }, props)
+    );
+  }
+);
+Button.displayName = "Button";
+
+// src/app/components/ui/pagination.tsx
+import Link3 from "next/link";
+var Pagination = (_a) => {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ React9.createElement(
+    "nav",
+    __spreadValues({
+      role: "navigation",
+      "aria-label": "pagination",
+      className: cn("mx-auto flex w-full justify-center", className)
+    }, props)
+  );
+};
+Pagination.displayName = "Pagination";
+var PaginationContent = React9.forwardRef((_a, ref) => {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ React9.createElement(
+    "ul",
+    __spreadValues({
+      ref,
+      className: cn("flex flex-row items-center gap-1", className)
+    }, props)
+  );
+});
+PaginationContent.displayName = "PaginationContent";
+var PaginationItem = React9.forwardRef((_a, ref) => {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ React9.createElement("li", __spreadValues({ ref, className: cn("", className) }, props));
+});
+PaginationItem.displayName = "PaginationItem";
+var PaginationLink = (_a) => {
+  var _b = _a, {
+    className,
+    isActive,
+    size = "icon"
+  } = _b, props = __objRest(_b, [
+    "className",
+    "isActive",
+    "size"
+  ]);
+  return /* @__PURE__ */ React9.createElement(
+    Link3,
+    __spreadValues({
+      "aria-current": isActive ? "page" : void 0,
+      className: cn(
+        buttonVariants({
+          variant: isActive ? "outline" : "ghost",
+          size
+        }),
+        className
+      )
+    }, props)
+  );
+};
+PaginationLink.displayName = "PaginationLink";
+var PaginationPrevious = (_a) => {
+  var _b = _a, {
+    className
+  } = _b, props = __objRest(_b, [
+    "className"
+  ]);
+  return /* @__PURE__ */ React9.createElement(
+    PaginationLink,
+    __spreadValues({
+      "aria-label": "Go to previous page",
+      size: "default",
+      className: cn("gap-1 pl-2.5", className)
+    }, props),
+    /* @__PURE__ */ React9.createElement(ChevronLeft, { className: "h-4 w-4" }),
+    /* @__PURE__ */ React9.createElement("span", null, "Previous")
+  );
+};
+PaginationPrevious.displayName = "PaginationPrevious";
+var PaginationNext = (_a) => {
+  var _b = _a, {
+    className
+  } = _b, props = __objRest(_b, [
+    "className"
+  ]);
+  return /* @__PURE__ */ React9.createElement(
+    PaginationLink,
+    __spreadValues({
+      "aria-label": "Go to next page",
+      size: "default",
+      className: cn("gap-1 pr-2.5", className)
+    }, props),
+    /* @__PURE__ */ React9.createElement("span", null, "Next"),
+    /* @__PURE__ */ React9.createElement(ChevronRight, { className: "h-4 w-4" })
+  );
+};
+PaginationNext.displayName = "PaginationNext";
+var PaginationEllipsis = (_a) => {
+  var _b = _a, {
+    className
+  } = _b, props = __objRest(_b, [
+    "className"
+  ]);
+  return /* @__PURE__ */ React9.createElement(
+    "span",
+    __spreadValues({
+      "aria-hidden": true,
+      className: cn("flex h-9 w-9 items-center justify-center", className)
+    }, props),
+    /* @__PURE__ */ React9.createElement(MoreHorizontal, { className: "h-4 w-4" }),
+    /* @__PURE__ */ React9.createElement("span", { className: "sr-only" }, "More pages")
+  );
+};
+PaginationEllipsis.displayName = "PaginationEllipsis";
+
+// src/app/components/NextBlogListPage.tsx
+var DEFAULT_BLOG_PER_PAGE = 9;
+async function NextBlogListPage(props) {
+  var _a, _b;
+  const postsPerPage = ((_a = props.displayOptions) == null ? void 0 : _a.blogPerPage) || DEFAULT_BLOG_PER_PAGE;
+  const searchParams = props.searchParams || {};
+  const currentPage = Number(searchParams.page) || 1;
+  const queryParams = {
+    index: (currentPage - 1) * postsPerPage,
+    limit: postsPerPage,
+    category: searchParams.category || "",
+    tags: ((_b = searchParams.tags) == null ? void 0 : _b.split(",")) || []
+  };
+  const res = await getBlogPosts(
+    props.config,
+    queryParams
+  );
+  const { blogs, total } = res;
+  const totalPages = Math.ceil(total / queryParams.limit);
+  const visiblePages = getVisiblePages(currentPage, totalPages);
+  return /* @__PURE__ */ React10.createElement("div", null, /* @__PURE__ */ React10.createElement(
+    ArticleGroup,
+    __spreadValues({
+      blogs,
+      type: props.type
+    }, props.displayOptions)
+  ), totalPages > 1 && /* @__PURE__ */ React10.createElement(Pagination, { className: "mt-8" }, /* @__PURE__ */ React10.createElement(PaginationContent, null, currentPage > 1 && /* @__PURE__ */ React10.createElement(PaginationItem, null, /* @__PURE__ */ React10.createElement(PaginationPrevious, { href: `/blogs?page=${currentPage - 1}` })), visiblePages.map((pageNum, idx) => pageNum === null ? /* @__PURE__ */ React10.createElement(PaginationItem, { key: `ellipsis-${idx}` }, /* @__PURE__ */ React10.createElement(PaginationEllipsis, null)) : /* @__PURE__ */ React10.createElement(PaginationItem, { key: pageNum }, /* @__PURE__ */ React10.createElement(
+    PaginationLink,
+    {
+      href: `/blogs?page=${pageNum}`,
+      isActive: pageNum === currentPage
+    },
+    pageNum
+  ))), currentPage < totalPages && /* @__PURE__ */ React10.createElement(PaginationItem, null, /* @__PURE__ */ React10.createElement(PaginationNext, { href: `/blogs?page=${currentPage + 1}` })))));
+}
+export {
+  NextBlogListPage,
+  NextBlogPage,
+  generateMetadata,
+  getBlogPaths,
+  getBlogPost,
+  getBlogPosts
+};
+//# sourceMappingURL=app-index.mjs.map