"use client";
'use strict';

const jsxRuntime = require('react/jsx-runtime');
const context = require('@btst/stack/context');
const button = require('../../../../../../../ui/src/components/button.cjs');
const LucideIcons = require('lucide-react');
const defaults = require('./defaults.cjs');

function PostNavigation({
  previousPost,
  nextPost,
  ref
}) {
  const { Link } = context.usePluginOverrides("blog", {
    Link: defaults.DefaultLink
  });
  const basePath = context.useBasePath();
  const blogPath = `${basePath}/blog`;
  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
    ref && /* @__PURE__ */ jsxRuntime.jsx("div", { ref }),
    (previousPost || nextPost) && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-t mt-4 pt-4 w-full" }),
      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col sm:flex-row gap-4 w-full justify-between", children: [
        previousPost ? /* @__PURE__ */ jsxRuntime.jsx(
          Link,
          {
            "data-testid": "previous-post-link",
            href: `${blogPath}/${previousPost.slug}`,
            className: "flex-1 sm:max-w-1/3",
            children: /* @__PURE__ */ jsxRuntime.jsx(
              button.Button,
              {
                variant: "outline",
                className: "w-full justify-start py-4 px-4 whitespace-normal! h-full hover:cursor-pointer",
                children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 w-full min-w-0", children: [
                  /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.ChevronLeft, { className: "h-4 w-4 shrink-0" }),
                  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-start min-w-0 flex-1", children: [
                    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground", children: "Previous" }),
                    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-semibold line-clamp-2 text-sm leading-tight transition-colors text-start", children: previousPost.title })
                  ] })
                ] })
              }
            )
          }
        ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1" }),
        nextPost ? /* @__PURE__ */ jsxRuntime.jsx(
          Link,
          {
            "data-testid": "next-post-link",
            href: `${blogPath}/${nextPost.slug}`,
            className: "flex-1 sm:max-w-1/3",
            children: /* @__PURE__ */ jsxRuntime.jsx(
              button.Button,
              {
                variant: "outline",
                className: "w-full justify-end py-4 px-4 whitespace-normal! h-full hover:cursor-pointer",
                children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 w-full min-w-0", children: [
                  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-end min-w-0 flex-1", children: [
                    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground", children: "Next" }),
                    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-semibold line-clamp-2 text-sm leading-tight transition-colors text-start", children: nextPost.title })
                  ] }),
                  /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.ChevronRight, { className: "h-4 w-4 shrink-0" })
                ] })
              }
            )
          }
        ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1" })
      ] })
    ] })
  ] });
}

exports.PostNavigation = PostNavigation;
