@publish.os/nextjs 0.0.1-alpha.2 → 0.0.1-alpha.4

package/dist/kernel/components/blocks/AgentActions.js

@@ -0,0 +1,429 @@
+"use client";
+
+// src/kernel/components/blocks/AgentActions.tsx
+import { AnimatedIconSwap } from "./animated-icon-swap.js";
+import {
+  Button,
+  buttonVariants
+} from "../ui/button.js";
+import { ButtonGroup, ButtonGroupSeparator } from "../ui/button-group.js";
+import {
+  Menu,
+  MenuGroup,
+  MenuGroupLabel,
+  MenuItem,
+  MenuLinkItem,
+  MenuPopup,
+  MenuPortal,
+  MenuPositioner,
+  MenuTrigger
+} from "../ui/menu.js";
+
+// src/utils/cn.ts
+import { clsx } from "clsx";
+import { extendTailwindMerge } from "tailwind-merge";
+var twMerge = extendTailwindMerge({
+  extend: {
+    classGroups: {
+      z: [
+        "z-content",
+        "z-nav",
+        "z-overlay",
+        "z-modal",
+        "z-search",
+        "z-toast",
+        "z-progress"
+      ]
+    }
+  }
+});
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+
+// src/kernel/components/blocks/AgentActions.tsx
+import {
+  Bot,
+  Check,
+  ChevronDown,
+  Clipboard,
+  ExternalLink,
+  Eye,
+  Github,
+  LinkIcon,
+  MessageCircle
+} from "lucide-react";
+import {
+  useCallback,
+  useEffect,
+  useRef,
+  useState
+} from "react";
+import { flushSync } from "react-dom";
+import { jsx, jsxs } from "react/jsx-runtime";
+var DEFAULT_PROMPT_SUFFIX = "I want to ask questions about it.";
+var COPY_FEEDBACK_MS = 1600;
+function normalizePath(path) {
+  const [pathname = "/"] = path.split(/[?#]/);
+  const prefixed = pathname.startsWith("/") ? pathname : `/${pathname}`;
+  if (prefixed === "/") return prefixed;
+  return prefixed.replace(/\/+$/, "");
+}
+function markdownPathForPagePath(path) {
+  const normalized = normalizePath(path);
+  if (normalized === "/") return "/index.md";
+  return normalized.endsWith(".md") ? normalized : `${normalized}.md`;
+}
+function isAbsoluteUrl(url) {
+  return /^[a-z][a-z\d+\-.]*:/i.test(url);
+}
+function absoluteUrl(url, siteUrl) {
+  if (isAbsoluteUrl(url) || !siteUrl) return url;
+  try {
+    return new URL(url, siteUrl).toString();
+  } catch {
+    return url;
+  }
+}
+function mergeRel(rel) {
+  const values = new Set((rel ?? "").split(/\s+/).filter(Boolean));
+  values.add("noreferrer");
+  return Array.from(values).join(" ");
+}
+function createPrompt(markdownUrl) {
+  return `Read ${markdownUrl}, ${DEFAULT_PROMPT_SUFFIX}`;
+}
+function providerPromptUrl(baseUrl, prompt, param = "q") {
+  const url = new URL(baseUrl);
+  url.searchParams.set(param, prompt);
+  return url.toString();
+}
+var DEFAULT_PRIMARY_ACTION = {
+  id: "copy-page-markdown-primary",
+  title: "Copy Markdown",
+  copy: "page-markdown"
+};
+var DEFAULT_ACTION_GROUPS = [
+  {
+    id: "open-in-ai",
+    title: "Open in",
+    actions: [
+      {
+        id: "open-claude",
+        title: "Claude",
+        icon: /* @__PURE__ */ jsx(Bot, { "aria-hidden": "true", className: "size-4" }),
+        href: ({ prompt }) => providerPromptUrl("https://claude.ai/new", prompt),
+        openInNew: true
+      },
+      {
+        id: "open-chatgpt",
+        title: "ChatGPT",
+        icon: /* @__PURE__ */ jsx(MessageCircle, { "aria-hidden": "true", className: "size-4" }),
+        href: ({ prompt }) => providerPromptUrl("https://chatgpt.com/?hints=search", prompt),
+        openInNew: true
+      },
+      {
+        id: "open-cursor",
+        title: "Cursor",
+        icon: /* @__PURE__ */ jsx(ExternalLink, { "aria-hidden": "true", className: "size-4" }),
+        href: ({ prompt }) => providerPromptUrl("https://cursor.com/link/prompt", prompt, "text"),
+        openInNew: true
+      },
+      {
+        id: "open-copilot",
+        title: "Copilot",
+        icon: /* @__PURE__ */ jsx(MessageCircle, { "aria-hidden": "true", className: "size-4" }),
+        href: ({ prompt }) => providerPromptUrl("https://copilot.microsoft.com/", prompt),
+        openInNew: true
+      },
+      {
+        id: "open-t3-chat",
+        title: "T3 Chat",
+        icon: /* @__PURE__ */ jsx(MessageCircle, { "aria-hidden": "true", className: "size-4" }),
+        href: ({ prompt }) => providerPromptUrl("https://t3.chat/new", prompt),
+        openInNew: true
+      },
+      {
+        id: "open-github",
+        title: "GitHub source",
+        icon: /* @__PURE__ */ jsx(Github, { "aria-hidden": "true", className: "size-4" }),
+        href: ({ sourceUrl }) => sourceUrl,
+        openInNew: true,
+        disabled: ({ sourceUrl }) => !sourceUrl
+      }
+    ]
+  },
+  {
+    id: "page-actions",
+    title: "Page",
+    actions: [
+      {
+        id: "copy-page-markdown",
+        title: "Copy page Markdown",
+        copy: "page-markdown"
+      },
+      {
+        id: "view-page-markdown",
+        title: "View as Markdown",
+        icon: /* @__PURE__ */ jsx(Eye, { "aria-hidden": "true", className: "size-4" }),
+        href: ({ markdownPath }) => markdownPath
+      },
+      {
+        id: "copy-page-link",
+        title: "Copy page link",
+        icon: /* @__PURE__ */ jsx(LinkIcon, { "aria-hidden": "true", className: "size-4" }),
+        copy: "page-link"
+      }
+    ]
+  }
+];
+function resolveValue(value, context) {
+  return typeof value === "function" ? value(context) : value;
+}
+async function copyText(text) {
+  await navigator.clipboard?.writeText(text);
+}
+function AgentActions({
+  actionGroups,
+  buttonSize = "sm",
+  buttonVariant = "outline",
+  className,
+  markdown,
+  markdownPath,
+  markdownUrl,
+  menuLabel = "More agent actions",
+  pagePath,
+  pageUrl,
+  primaryAction,
+  prompt,
+  siteUrl,
+  sourceUrl,
+  ...props
+}) {
+  const [copiedActionId, setCopiedActionId] = useState();
+  const [menuOpen, setMenuOpen] = useState(false);
+  const menuActionsRef = useRef(null);
+  const menuOpenRef = useRef(false);
+  const resetTimerRef = useRef(
+    void 0
+  );
+  const setMenuOpenState = useCallback((open) => {
+    menuOpenRef.current = open;
+    setMenuOpen(open);
+  }, []);
+  const closeMenu = useCallback(() => {
+    flushSync(() => {
+      menuOpenRef.current = false;
+      setMenuOpen(false);
+      menuActionsRef.current?.close();
+      menuActionsRef.current?.unmount();
+    });
+  }, []);
+  useEffect(() => {
+    window.addEventListener("pagehide", closeMenu);
+    window.addEventListener("pageshow", closeMenu);
+    return () => {
+      window.removeEventListener("pagehide", closeMenu);
+      window.removeEventListener("pageshow", closeMenu);
+      if (resetTimerRef.current) {
+        clearTimeout(resetTimerRef.current);
+      }
+    };
+  }, [closeMenu]);
+  const resolvedPagePath = pagePath ?? "/";
+  const resolvedMarkdownPath = markdownPath ?? markdownPathForPagePath(resolvedPagePath);
+  const resolvedMarkdownUrl = absoluteUrl(
+    markdownUrl ?? resolvedMarkdownPath,
+    siteUrl
+  );
+  const context = {
+    markdown,
+    markdownPath: resolvedMarkdownPath,
+    markdownUrl: resolvedMarkdownUrl,
+    pagePath: resolvedPagePath,
+    pageUrl: absoluteUrl(pageUrl ?? resolvedPagePath, siteUrl),
+    prompt: prompt ?? createPrompt(resolvedMarkdownUrl),
+    sourceUrl
+  };
+  const resolvedPrimaryAction = primaryAction ?? DEFAULT_PRIMARY_ACTION;
+  const resolvedActionGroups = actionGroups ?? DEFAULT_ACTION_GROUPS;
+  const markCopied = (actionId) => {
+    if (resetTimerRef.current) {
+      clearTimeout(resetTimerRef.current);
+    }
+    setCopiedActionId(actionId);
+    resetTimerRef.current = setTimeout(() => {
+      setCopiedActionId(void 0);
+    }, COPY_FEEDBACK_MS);
+  };
+  const copyValueForAction = async (action) => {
+    if (action.copy === "page-markdown") {
+      if (context.markdownUrl) {
+        try {
+          const response = await fetch(context.markdownUrl);
+          if (response.ok) return response.text();
+        } catch {
+          return context.markdown ?? "";
+        }
+      }
+      return context.markdown ?? "";
+    }
+    if (action.copy === "page-link") return context.pageUrl;
+    if (action.copy === "markdown-link") return context.markdownUrl;
+    return action.copy ?? "";
+  };
+  const handleAction = async (action) => {
+    if (resolveValue(action.disabled, context)) return;
+    if (action.copy) {
+      const value = await copyValueForAction(action);
+      if (value) {
+        await copyText(value);
+        markCopied(action.id);
+      }
+    }
+    await action.onSelect?.(context);
+  };
+  const iconForAction = (action) => {
+    const copied = copiedActionId === action.id;
+    if (action.copy === "page-markdown") {
+      return /* @__PURE__ */ jsx(
+        AnimatedIconSwap,
+        {
+          active: copied,
+          activeIcon: /* @__PURE__ */ jsx(Check, { "aria-hidden": "true", className: "size-4" }),
+          defaultIcon: action.icon ?? /* @__PURE__ */ jsx(Clipboard, { "aria-hidden": "true", className: "size-4" }),
+          size: 16
+        }
+      );
+    }
+    if (copied) return /* @__PURE__ */ jsx(Check, { "aria-hidden": "true", className: "size-4" });
+    return action.icon;
+  };
+  const renderPrimaryAction = () => {
+    const href = resolveValue(resolvedPrimaryAction.href, context);
+    const disabled = resolveValue(resolvedPrimaryAction.disabled, context);
+    const target = resolvedPrimaryAction.target ?? (resolvedPrimaryAction.openInNew ? "_blank" : void 0);
+    const rel = target === "_blank" ? mergeRel(resolvedPrimaryAction.rel) : void 0;
+    if (href && !resolvedPrimaryAction.copy && !resolvedPrimaryAction.onSelect) {
+      return /* @__PURE__ */ jsxs(
+        "a",
+        {
+          "aria-disabled": disabled ? "true" : void 0,
+          className: cn(
+            buttonVariants({
+              iconOnly: false,
+              size: buttonSize,
+              variant: buttonVariant
+            }),
+            disabled && "pointer-events-none opacity-50"
+          ),
+          "data-disabled": disabled ? "" : void 0,
+          href: disabled ? void 0 : href,
+          rel,
+          target,
+          children: [
+            iconForAction(resolvedPrimaryAction),
+            /* @__PURE__ */ jsx("span", { children: resolvedPrimaryAction.title })
+          ]
+        }
+      );
+    }
+    return /* @__PURE__ */ jsx(
+      Button,
+      {
+        disabled: Boolean(disabled),
+        leftIcon: iconForAction(resolvedPrimaryAction),
+        onClick: () => {
+          void handleAction(resolvedPrimaryAction);
+        },
+        size: buttonSize,
+        variant: buttonVariant,
+        children: resolvedPrimaryAction.title
+      }
+    );
+  };
+  const renderMenuAction = (action) => {
+    const href = resolveValue(action.href, context);
+    const disabled = resolveValue(action.disabled, context);
+    const icon = iconForAction(action);
+    const target = action.target ?? (action.openInNew ? "_blank" : void 0);
+    const rel = target === "_blank" ? mergeRel(action.rel) : void 0;
+    const label = action.title;
+    if (href && !action.copy && !action.onSelect && !disabled) {
+      return /* @__PURE__ */ jsxs(
+        MenuLinkItem,
+        {
+          closeOnClick: true,
+          href,
+          onClick: closeMenu,
+          rel,
+          target,
+          children: [
+            icon,
+            /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate", children: label })
+          ]
+        },
+        action.id
+      );
+    }
+    return /* @__PURE__ */ jsxs(
+      MenuItem,
+      {
+        disabled: Boolean(disabled),
+        onClick: () => {
+          void handleAction(action);
+        },
+        children: [
+          icon,
+          /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate", children: label })
+        ]
+      },
+      action.id
+    );
+  };
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn("inline-flex", className),
+      "data-slot": "agent-actions",
+      ...props,
+      children: /* @__PURE__ */ jsxs(ButtonGroup, { children: [
+        renderPrimaryAction(),
+        /* @__PURE__ */ jsx(ButtonGroupSeparator, {}),
+        /* @__PURE__ */ jsxs(
+          Menu,
+          {
+            actionsRef: menuActionsRef,
+            modal: false,
+            onOpenChange: setMenuOpenState,
+            open: menuOpen,
+            children: [
+              /* @__PURE__ */ jsx(
+                MenuTrigger,
+                {
+                  "aria-label": menuLabel,
+                  className: cn(
+                    buttonVariants({
+                      iconOnly: true,
+                      size: buttonSize,
+                      variant: buttonVariant
+                    }),
+                    "data-[popup-open]:!rounded-r-button"
+                  ),
+                  children: /* @__PURE__ */ jsx(ChevronDown, { "aria-hidden": "true", className: "size-4" })
+                }
+              ),
+              /* @__PURE__ */ jsx(MenuPortal, { children: /* @__PURE__ */ jsx(MenuPositioner, { align: "end", children: /* @__PURE__ */ jsx(MenuPopup, { className: "min-w-56", children: resolvedActionGroups.map((group) => /* @__PURE__ */ jsxs(MenuGroup, { children: [
+                group.title ? /* @__PURE__ */ jsx(MenuGroupLabel, { children: group.title }) : null,
+                group.actions.map(renderMenuAction)
+              ] }, group.id)) }) }) })
+            ]
+          }
+        )
+      ] })
+    }
+  );
+}
+export {
+  AgentActions
+};

package/dist/kernel/components/blocks/animated-icon-swap.cjs

@@ -0,0 +1,101 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/kernel/components/blocks/animated-icon-swap.tsx
+var animated_icon_swap_exports = {};
+__export(animated_icon_swap_exports, {
+  AnimatedIconSwap: () => AnimatedIconSwap
+});
+module.exports = __toCommonJS(animated_icon_swap_exports);
+
+// src/utils/cn.ts
+var import_clsx = require("clsx");
+var import_tailwind_merge = require("tailwind-merge");
+var twMerge = (0, import_tailwind_merge.extendTailwindMerge)({
+  extend: {
+    classGroups: {
+      z: [
+        "z-content",
+        "z-nav",
+        "z-overlay",
+        "z-modal",
+        "z-search",
+        "z-toast",
+        "z-progress"
+      ]
+    }
+  }
+});
+function cn(...inputs) {
+  return twMerge((0, import_clsx.clsx)(inputs));
+}
+
+// src/kernel/components/blocks/animated-icon-swap.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var iconSlotClassName = "pointer-events-none absolute inset-0 flex items-center justify-center transition-[transform,opacity] duration-200 ease-out motion-reduce:scale-100 motion-reduce:transition-opacity motion-reduce:duration-100";
+function AnimatedIconSwap({
+  active,
+  activeIcon,
+  className,
+  defaultIcon,
+  size,
+  style,
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    "span",
+    {
+      className: cn("relative inline-flex shrink-0", className),
+      "data-slot": "animated-icon-swap",
+      "data-state": active ? "active" : "inactive",
+      style: { width: size, height: size, ...style },
+      ...props,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "span",
+          {
+            "aria-hidden": active ? true : void 0,
+            className: cn(
+              iconSlotClassName,
+              active ? "scale-75 opacity-0" : "scale-100 opacity-100"
+            ),
+            "data-slot": "animated-icon-swap-default",
+            children: defaultIcon
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "span",
+          {
+            "aria-hidden": active ? void 0 : true,
+            className: cn(
+              iconSlotClassName,
+              active ? "scale-100 opacity-100" : "scale-75 opacity-0"
+            ),
+            "data-slot": "animated-icon-swap-active",
+            children: activeIcon
+          }
+        )
+      ]
+    }
+  );
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  AnimatedIconSwap
+});

package/dist/kernel/components/blocks/animated-icon-swap.d.cts

@@ -0,0 +1,16 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ComponentPropsWithoutRef, ReactNode } from 'react';
+
+type AnimatedIconSwapProps = Omit<ComponentPropsWithoutRef<"span">, "children"> & {
+    /** Whether to show the active icon. */
+    active: boolean;
+    /** Icon shown when active is false. */
+    defaultIcon: ReactNode;
+    /** Icon shown when active is true. */
+    activeIcon: ReactNode;
+    /** Square wrapper size in pixels. */
+    size: number;
+};
+declare function AnimatedIconSwap({ active, activeIcon, className, defaultIcon, size, style, ...props }: AnimatedIconSwapProps): react_jsx_runtime.JSX.Element;
+
+export { AnimatedIconSwap, type AnimatedIconSwapProps };

package/dist/kernel/components/blocks/animated-icon-swap.d.ts

@@ -0,0 +1,16 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ComponentPropsWithoutRef, ReactNode } from 'react';
+
+type AnimatedIconSwapProps = Omit<ComponentPropsWithoutRef<"span">, "children"> & {
+    /** Whether to show the active icon. */
+    active: boolean;
+    /** Icon shown when active is false. */
+    defaultIcon: ReactNode;
+    /** Icon shown when active is true. */
+    activeIcon: ReactNode;
+    /** Square wrapper size in pixels. */
+    size: number;
+};
+declare function AnimatedIconSwap({ active, activeIcon, className, defaultIcon, size, style, ...props }: AnimatedIconSwapProps): react_jsx_runtime.JSX.Element;
+
+export { AnimatedIconSwap, type AnimatedIconSwapProps };

package/dist/kernel/components/blocks/animated-icon-swap.js

@@ -0,0 +1,74 @@
+// src/utils/cn.ts
+import { clsx } from "clsx";
+import { extendTailwindMerge } from "tailwind-merge";
+var twMerge = extendTailwindMerge({
+  extend: {
+    classGroups: {
+      z: [
+        "z-content",
+        "z-nav",
+        "z-overlay",
+        "z-modal",
+        "z-search",
+        "z-toast",
+        "z-progress"
+      ]
+    }
+  }
+});
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+
+// src/kernel/components/blocks/animated-icon-swap.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var iconSlotClassName = "pointer-events-none absolute inset-0 flex items-center justify-center transition-[transform,opacity] duration-200 ease-out motion-reduce:scale-100 motion-reduce:transition-opacity motion-reduce:duration-100";
+function AnimatedIconSwap({
+  active,
+  activeIcon,
+  className,
+  defaultIcon,
+  size,
+  style,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(
+    "span",
+    {
+      className: cn("relative inline-flex shrink-0", className),
+      "data-slot": "animated-icon-swap",
+      "data-state": active ? "active" : "inactive",
+      style: { width: size, height: size, ...style },
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(
+          "span",
+          {
+            "aria-hidden": active ? true : void 0,
+            className: cn(
+              iconSlotClassName,
+              active ? "scale-75 opacity-0" : "scale-100 opacity-100"
+            ),
+            "data-slot": "animated-icon-swap-default",
+            children: defaultIcon
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "span",
+          {
+            "aria-hidden": active ? void 0 : true,
+            className: cn(
+              iconSlotClassName,
+              active ? "scale-100 opacity-100" : "scale-75 opacity-0"
+            ),
+            "data-slot": "animated-icon-swap-active",
+            children: activeIcon
+          }
+        )
+      ]
+    }
+  );
+}
+export {
+  AnimatedIconSwap
+};