@brainfish-ai/components 0.35.20 → 0.36.0

package/dist/esm/scenes/knowledge-review/scene.js

@@ -0,0 +1,122 @@
+import React__default, { useRef, useImperativeHandle, useEffect } from 'react';
+import { ReviewsSelectionProvider, useReviewsSelection } from './context.js';
+import { KnowledgeReviewPanel } from './knowledge-review-panel.js';
+import { Card, CardContent } from '../../components/ui/card.js';
+import { ScrollArea } from '../../components/ui/scroll-area.js';
+import { Spinner } from '../../components/ui/spinner.js';
+import { cn } from '../../lib/utils.js';
+import './knowledge-review.css';/* empty css                     */
+import { ReviewList } from './review-list/review-list.js';
+
+const SCROLL_HEIGHT_VAR = "--knowledge-review-scroll-height";
+const KnowledgeReviewSceneInner = React__default.forwardRef(
+  function KnowledgeReviewSceneInner2({
+    diffTitle = "Knowledge Review",
+    children,
+    items,
+    isLoading,
+    totalItemsCount,
+    showActionButtons = true,
+    className,
+    onApproveAllSuggestions,
+    onRejectAllSuggestions,
+    onOpenArticleLink,
+    onAcceptAndPublish,
+    onApplyAllInEditor,
+    onRejectAllInEditor,
+    onSourceLinkClick,
+    breadcrumb,
+    sourceIcon,
+    sourceDescription,
+    suggestionReasonBody,
+    hideAcceptAndPublishPublic,
+    ...props
+  }, ref) {
+    const innerRef = useRef(null);
+    const { selectedItem, setSelectedItem } = useReviewsSelection();
+    useImperativeHandle(
+      ref,
+      () => ({
+        selectedItem,
+        setSelectedItem
+      }),
+      [selectedItem, setSelectedItem]
+    );
+    useEffect(() => {
+      const cardEl = innerRef.current;
+      if (!cardEl) return;
+      const updateHeight = () => {
+        const { height } = cardEl.getBoundingClientRect();
+        cardEl.style.setProperty(SCROLL_HEIGHT_VAR, `${height}px`);
+      };
+      updateHeight();
+      if (typeof ResizeObserver !== "function") {
+        return;
+      }
+      const observer = new ResizeObserver(updateHeight);
+      observer.observe(cardEl);
+      return () => observer.disconnect();
+    }, []);
+    const resolvedIsLoading = isLoading ?? items.length === 0;
+    const isLoadingItems = resolvedIsLoading && items.length === 0;
+    return /* @__PURE__ */ React__default.createElement(Card, { className: cn("h-full", className) }, /* @__PURE__ */ React__default.createElement(CardContent, { className: "p-4 lg:p-8 h-full" }, /* @__PURE__ */ React__default.createElement(
+      "div",
+      {
+        ref: innerRef,
+        className: "grid xs:max-lg:grid-cols-1 lg:grid-cols-[1fr_4fr] gap-6 min-h-96 h-full",
+        style: { [SCROLL_HEIGHT_VAR]: "100px" },
+        ...props
+      },
+      /* @__PURE__ */ React__default.createElement(ScrollArea, { className: "h-[calc(var(--knowledge-review-scroll-height))] min-w-80 lg:block hidden" }, isLoadingItems ? /* @__PURE__ */ React__default.createElement("div", { className: "flex h-full min-h-96 items-center justify-center text-muted-foreground" }, /* @__PURE__ */ React__default.createElement(Spinner, { className: "size-6" })) : /* @__PURE__ */ React__default.createElement(ReviewList, { items })),
+      /* @__PURE__ */ React__default.createElement(
+        KnowledgeReviewPanel,
+        {
+          diffTitle,
+          items,
+          isLoading: resolvedIsLoading,
+          totalItemsCount,
+          showActionButtons,
+          sourceIcon,
+          sourceDescription
+        },
+        children
+      )
+    )));
+  }
+);
+const KnowledgeReviewScene = React__default.forwardRef(
+  function KnowledgeReviewScene2(props, ref) {
+    const {
+      items,
+      onApproveAllSuggestions,
+      onRejectAllSuggestions,
+      onAcceptAndPublish,
+      onApplyAllInEditor,
+      onRejectAllInEditor,
+      onOpenArticleLink,
+      onSourceLinkClick,
+      breadcrumb,
+      suggestionReasonBody,
+      hideAcceptAndPublishPublic
+    } = props;
+    return /* @__PURE__ */ React__default.createElement(
+      ReviewsSelectionProvider,
+      {
+        defaultSelectedItem: items.find((m) => m.isSelected) ?? null,
+        onApproveAllSuggestions,
+        onRejectAllSuggestions,
+        onAcceptAndPublish,
+        onApplyAllInEditor,
+        onRejectAllInEditor,
+        onOpenArticleLink,
+        onSourceLinkClick,
+        breadcrumb,
+        suggestionReasonBody,
+        hideAcceptAndPublishPublic
+      },
+      /* @__PURE__ */ React__default.createElement(KnowledgeReviewSceneInner, { ...props, ref })
+    );
+  }
+);
+
+export { KnowledgeReviewScene };

package/dist/esm/scenes/knowledge-review/status-source-summary.js

@@ -0,0 +1,41 @@
+import * as React from 'react';
+import { EditCount } from './review-list/edit-count.js';
+import { StatusBadge } from '../../components/convos/status-badge.js';
+import { Button } from '../../components/ui/button.js';
+import { cn } from '../../lib/utils.js';
+
+function StatusSourceSummary({
+  isNew,
+  isAccepted,
+  editCount,
+  sourceIcon,
+  sourceDescription,
+  onSourceLinkClick,
+  sourceLabel = "Open source",
+  className
+}) {
+  let status;
+  if (isAccepted) {
+    status = /* @__PURE__ */ React.createElement(StatusBadge, { variant: "accepted" }, "Accepted");
+  } else if (isNew) {
+    status = /* @__PURE__ */ React.createElement(StatusBadge, { variant: "success", surface: "transparent" }, "New");
+  } else if (editCount) {
+    status = /* @__PURE__ */ React.createElement(EditCount, { count: editCount });
+  }
+  if (!status && !sourceIcon && !sourceDescription) {
+    return null;
+  }
+  return /* @__PURE__ */ React.createElement("span", { className: cn("flex items-center gap-1 leading-4 min-w-0", className) }, status && /* @__PURE__ */ React.createElement("span", { className: "shrink-0 flex items-center" }, status), sourceDescription && (onSourceLinkClick ? /* @__PURE__ */ React.createElement(
+    Button,
+    {
+      variant: "link",
+      onClick: onSourceLinkClick,
+      "aria-label": sourceLabel,
+      className: "[&_svg]:size-4 h-auto p-0 text-xs font-normal text-subtle gap-1"
+    },
+    sourceIcon && /* @__PURE__ */ React.createElement("span", { className: "shrink-0 flex items-center" }, sourceIcon),
+    /* @__PURE__ */ React.createElement("span", { className: "truncate" }, sourceDescription)
+  ) : /* @__PURE__ */ React.createElement("span", { className: "[&_svg]:size-4 flex items-center gap-1 text-xs text-subtle min-w-0" }, sourceIcon && /* @__PURE__ */ React.createElement("span", { className: "shrink-0 flex items-center" }, sourceIcon), /* @__PURE__ */ React.createElement("span", { className: "truncate" }, sourceDescription))));
+}
+
+export { StatusSourceSummary };

package/dist/esm/scenes/knowledge-review/suggestion-card/suggestion-card.js

@@ -0,0 +1,110 @@
+import * as React from 'react';
+import { CheckCircle, XCircle, CaretUp, CaretDown } from '@phosphor-icons/react';
+import { Button } from '../../../components/ui/button.js';
+import { ScrollArea } from '../../../components/ui/scroll-area.js';
+import { brandShadowEffect } from '../../../lib/styles.js';
+import { cn } from '../../../lib/utils.js';
+
+const SuggestionCard = React.forwardRef(function SuggestionCard2({
+  source,
+  diff,
+  reason,
+  onAccept,
+  onReject,
+  onSourceClick,
+  acceptDisabled,
+  rejectDisabled,
+  pagination,
+  className,
+  readOnly,
+  ...props
+}, ref) {
+  const acceptIsDisabled = acceptDisabled || !onAccept;
+  const rejectIsDisabled = rejectDisabled || !onReject;
+  const hasDiff = Boolean(diff && diff.oldText && diff.newText);
+  return /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      ref,
+      role: "group",
+      "aria-label": "Review suggestion",
+      className: cn(
+        // The card grows with short suggestions, then caps so long bodies scroll.
+        "!grid max-h-[calc(var(--knowledge-review-scroll-height)-250px)] w-full grid-rows-[auto_minmax(0,1fr)_auto] items-stretch gap-4 rounded-lg bg-surface p-4 border shadow-md dark:shadow-brand-dark",
+        className
+      ),
+      ...props
+    },
+    /* @__PURE__ */ React.createElement("div", { className: "flex min-w-0 flex-col justify-start gap-1" }, source && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("span", { className: "text-xs font-bold uppercase leading-4 text-default" }, source.label), /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-0.5 [&_svg]:size-4 [&_svg]:shrink-0" }, onSourceClick ? /* @__PURE__ */ React.createElement(
+      Button,
+      {
+        type: "button",
+        variant: "link",
+        onClick: onSourceClick,
+        className: "[&_svg]:size-4 h-auto p-0 text-sm font-normal text-subtle gap-0.5 whitespace-normal break-all"
+      },
+      /* @__PURE__ */ React.createElement("span", { className: "flex items-center", "aria-hidden": "true" }, source.icon),
+      /* @__PURE__ */ React.createElement("span", { className: "leading-4" }, source.name)
+    ) : /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("span", { className: "flex items-center text-subtle", "aria-hidden": "true" }, source.icon), /* @__PURE__ */ React.createElement("span", { className: "text-sm leading-4 text-subtle break-all" }, source.name))))),
+    /* @__PURE__ */ React.createElement("div", { className: "flex min-w-0 min-h-0 items-stretch gap-2" }, /* @__PURE__ */ React.createElement(ScrollArea, { className: "-mr-2 min-h-0 flex-1 pr-2" }, /* @__PURE__ */ React.createElement("div", { className: "flex w-full flex-col" }, /* @__PURE__ */ React.createElement("span", { className: "text-xs font-bold uppercase leading-4 text-default" }, "Why"), reason && /* @__PURE__ */ React.createElement("span", { className: "text-sm leading-4 text-default" }, reason), hasDiff && /* @__PURE__ */ React.createElement(SuggestionCardDiffRow, { oldText: diff?.oldText, newText: diff?.newText }))), pagination && pagination.totalCount > 1 && /* @__PURE__ */ React.createElement(SuggestionCardPaginator, { ...pagination })),
+    /* @__PURE__ */ React.createElement("div", { className: "flex min-w-0 items-end" }, !readOnly && /* @__PURE__ */ React.createElement("div", { className: "flex shrink-0 items-center gap-2" }, !acceptIsDisabled && /* @__PURE__ */ React.createElement(
+      Button,
+      {
+        type: "button",
+        variant: "default",
+        elevation: "shadow",
+        size: "icon",
+        onClick: onAccept,
+        "aria-label": "Accept suggestion",
+        className: cn("rounded-md border-border bg-green-400 text-default", brandShadowEffect)
+      },
+      /* @__PURE__ */ React.createElement(CheckCircle, { weight: "regular", "aria-hidden": "true" })
+    ), !rejectIsDisabled && /* @__PURE__ */ React.createElement(
+      Button,
+      {
+        type: "button",
+        variant: "destructive",
+        elevation: "shadow",
+        size: "icon",
+        onClick: onReject,
+        "aria-label": "Reject suggestion",
+        className: cn("rounded-md border-border bg-red-400 text-default", brandShadowEffect)
+      },
+      /* @__PURE__ */ React.createElement(XCircle, { weight: "regular", "aria-hidden": "true" })
+    )))
+  );
+});
+function SuggestionCardDiffRow({ oldText, newText }) {
+  return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col items-baseline gap-2 border-t border-dark-300 py-4 text-sm leading-4 mt-4" }, oldText && /* @__PURE__ */ React.createElement("div", { className: "text-destructive" }, /* @__PURE__ */ React.createElement("span", { className: "font-bold" }, "Replace: "), /* @__PURE__ */ React.createElement("span", null, oldText)), newText && /* @__PURE__ */ React.createElement("div", { className: "text-blue" }, /* @__PURE__ */ React.createElement("span", { className: "font-bold" }, "With: "), /* @__PURE__ */ React.createElement("span", null, newText)));
+}
+function SuggestionCardPaginator({ currentIndex, totalCount, onPrevious, onNext }) {
+  const hasPrevious = currentIndex > 1 && !!onPrevious;
+  const hasNext = currentIndex < totalCount && !!onNext;
+  return /* @__PURE__ */ React.createElement("div", { className: "flex w-10 shrink-0 flex-col items-center justify-center self-stretch py-2 pl-3" }, /* @__PURE__ */ React.createElement("div", { className: "flex flex-col items-center gap-0.5" }, /* @__PURE__ */ React.createElement(
+    Button,
+    {
+      type: "button",
+      variant: "ghost",
+      size: "icon",
+      onClick: onPrevious,
+      disabled: !hasPrevious,
+      "aria-label": "Previous suggestion",
+      className: "text-subtlest disabled:invisible"
+    },
+    /* @__PURE__ */ React.createElement(CaretUp, { "aria-hidden": "true", className: "size-3.5" })
+  ), /* @__PURE__ */ React.createElement("span", { className: "text-xs leading-4 text-subtlest tabular-nums", "aria-hidden": "true" }, currentIndex, "/", totalCount), /* @__PURE__ */ React.createElement("span", { className: "sr-only", "aria-live": "polite" }, "Suggestion ", currentIndex, " of ", totalCount), /* @__PURE__ */ React.createElement(
+    Button,
+    {
+      type: "button",
+      variant: "ghost",
+      size: "icon",
+      onClick: onNext,
+      disabled: !hasNext,
+      "aria-label": "Next suggestion",
+      className: "text-subtlest disabled:invisible"
+    },
+    /* @__PURE__ */ React.createElement(CaretDown, { "aria-hidden": "true", className: "size-3.5" })
+  )));
+}
+
+export { SuggestionCard };

package/dist/esm/scenes/knowledge-review/suggestions-header/suggestions-header-title-nav.js

@@ -0,0 +1,54 @@
+import { CaretDown, CaretUp } from '@phosphor-icons/react';
+import * as React from 'react';
+import { Button } from '../../../components/ui/button.js';
+import { Tooltip, TooltipTrigger, TooltipContent } from '../../../components/ui/tooltip.js';
+
+function SuggestionsHeaderTitleNav({
+  title,
+  breadcrumb,
+  onOpenArticleLink,
+  currentArticleIndex,
+  totalArticles,
+  displayTotalArticles,
+  onNextArticle,
+  onPreviousArticle
+}) {
+  const hasNextArticle = totalArticles > 0 && currentArticleIndex < totalArticles - 1;
+  const hasPreviousArticle = currentArticleIndex > 0;
+  const currentArticle = totalArticles === 0 ? 0 : currentArticleIndex + 1;
+  const totalArticlesForDisplay = displayTotalArticles ?? totalArticles;
+  const hasDisplayArticles = totalArticlesForDisplay > 0;
+  return /* @__PURE__ */ React.createElement("div", { className: "flex justify-between items-center" }, /* @__PURE__ */ React.createElement("h1", { className: "heading-lg" }, title, onOpenArticleLink && breadcrumb && /* @__PURE__ */ React.createElement(
+    Button,
+    {
+      variant: "link",
+      size: "sm",
+      onClick: onOpenArticleLink,
+      "aria-label": "Open article",
+      className: "block px-0 text-subtle text-xs"
+    },
+    breadcrumb
+  )), /* @__PURE__ */ React.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ React.createElement("p", { className: "text-xs text-foreground pr-2" }, /* @__PURE__ */ React.createElement("span", { "aria-hidden": "true" }, hasDisplayArticles ? `${currentArticle}/${totalArticlesForDisplay}` : "0"), /* @__PURE__ */ React.createElement("span", { className: "sr-only", "aria-live": "polite" }, hasDisplayArticles ? `Article ${currentArticle} of ${totalArticlesForDisplay}` : "No articles")), /* @__PURE__ */ React.createElement(Tooltip, null, /* @__PURE__ */ React.createElement(TooltipTrigger, { asChild: true }, /* @__PURE__ */ React.createElement(
+    Button,
+    {
+      variant: "ghost",
+      size: "icon",
+      disabled: !hasNextArticle,
+      onClick: onNextArticle,
+      "aria-label": "Go to next article"
+    },
+    /* @__PURE__ */ React.createElement(CaretDown, { "aria-hidden": "true" })
+  )), /* @__PURE__ */ React.createElement(TooltipContent, { side: "bottom", bgColor: "--bfc-foreground", className: "text-background" }, "Next Article")), /* @__PURE__ */ React.createElement(Tooltip, null, /* @__PURE__ */ React.createElement(TooltipTrigger, { asChild: true }, /* @__PURE__ */ React.createElement(
+    Button,
+    {
+      variant: "ghost",
+      size: "icon",
+      disabled: !hasPreviousArticle,
+      onClick: onPreviousArticle,
+      "aria-label": "Go to previous article"
+    },
+    /* @__PURE__ */ React.createElement(CaretUp, { "aria-hidden": "true" })
+  )), /* @__PURE__ */ React.createElement(TooltipContent, { side: "top", bgColor: "--bfc-foreground", className: "text-background" }, "Previous Article"))));
+}
+
+export { SuggestionsHeaderTitleNav };

package/dist/esm/scenes/knowledge-review/suggestions-header/suggestions-header-toolbar.js

@@ -0,0 +1,114 @@
+import { Lightbulb, Backspace, CheckCircle, CaretDown, Globe, LockKey } from '@phosphor-icons/react';
+import * as React from 'react';
+import { StatusSourceSummary } from '../status-source-summary.js';
+import { Button } from '../../../components/ui/button.js';
+import { brandShadowEffect } from '../../../lib/styles.js';
+import { Spinner } from '../../../components/ui/spinner.js';
+import { Popover, PopoverTrigger, PopoverContent } from '../../../components/ui/popover.js';
+import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem } from '../../../components/ui/dropdown-menu.js';
+import { ButtonGroup } from '../../../components/ui/button-group.js';
+import { cn } from '../../../lib/utils.js';
+import { REASON_TITLE } from './suggestions-header.js';
+
+function SuggestionsHeaderToolbar({
+  isNew,
+  isAccepted = false,
+  suggestionsCount,
+  sourceIcon,
+  sourceDescription,
+  onSourceLinkClick,
+  showActionButtons = true,
+  suggestionReasonBody,
+  hideAcceptAndPublishPublic = false,
+  pendingAction = null,
+  onAcceptAndPublish,
+  onRejectAll,
+  onAcceptAll,
+  onAcceptAndPublishAction
+}) {
+  const [whyOpen, setWhyOpen] = React.useState(false);
+  const isActionPending = pendingAction != null;
+  const isRejectPending = pendingAction === "reject";
+  const isAcceptPending = pendingAction === "accept-draft" || pendingAction === "accept-publish-public" || pendingAction === "accept-publish-internal";
+  return /* @__PURE__ */ React.createElement("div", { className: "flex-1 px-2 pb-2 flex justify-between items-center" }, /* @__PURE__ */ React.createElement(
+    StatusSourceSummary,
+    {
+      isNew,
+      isAccepted,
+      editCount: suggestionsCount,
+      sourceIcon,
+      sourceDescription,
+      onSourceLinkClick
+    }
+  ), showActionButtons && /* @__PURE__ */ React.createElement(
+    ButtonGroup,
+    {
+      orientation: "horizontal",
+      rounded: false,
+      "aria-label": "Suggestion actions",
+      "aria-busy": isActionPending,
+      className: "gap-1"
+    },
+    suggestionReasonBody && /* @__PURE__ */ React.createElement(Popover, { open: whyOpen, onOpenChange: setWhyOpen }, /* @__PURE__ */ React.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React.createElement(Button, { variant: "ghost", "aria-label": REASON_TITLE, disabled: isActionPending }, /* @__PURE__ */ React.createElement(Lightbulb, { "aria-hidden": "true" }), "Why")), /* @__PURE__ */ React.createElement(
+      PopoverContent,
+      {
+        align: "start",
+        side: "bottom",
+        className: "z-above-modal shadow-md dark:shadow-md-invert border-dark-300"
+      },
+      /* @__PURE__ */ React.createElement("div", { className: "font-bold text-sm" }, REASON_TITLE),
+      /* @__PURE__ */ React.createElement("div", { className: "text-sm text-subtle mt-1" }, suggestionReasonBody)
+    )),
+    /* @__PURE__ */ React.createElement(Button, { variant: "ghost", disabled: isActionPending, onClick: () => void onRejectAll() }, isRejectPending ? /* @__PURE__ */ React.createElement(Spinner, { className: "size-5" }) : /* @__PURE__ */ React.createElement(Backspace, { "aria-hidden": "true" }), isNew ? "Reject" : "Reject all"),
+    onAcceptAndPublish ? /* @__PURE__ */ React.createElement(DropdownMenu, null, /* @__PURE__ */ React.createElement("div", { className: cn("flex items-center rounded border border-border bg-primary", brandShadowEffect) }, /* @__PURE__ */ React.createElement(
+      Button,
+      {
+        variant: "default",
+        elevation: "shadow",
+        className: "gap-1 rounded-none border-0 bg-transparent shadow-none",
+        disabled: isActionPending,
+        onClick: () => void onAcceptAll()
+      },
+      isAcceptPending ? /* @__PURE__ */ React.createElement(Spinner, { className: "size-5" }) : /* @__PURE__ */ React.createElement(CheckCircle, { "aria-hidden": "true" }),
+      isNew ? "Accept as draft" : "Accept all as draft"
+    ), /* @__PURE__ */ React.createElement("span", { className: "h-full w-px self-stretch bg-foreground", "aria-hidden": "true" }), /* @__PURE__ */ React.createElement(DropdownMenuTrigger, { asChild: true }, /* @__PURE__ */ React.createElement(
+      Button,
+      {
+        variant: "default",
+        size: "icon",
+        className: "size-9 rounded-none border-0 bg-transparent shadow-none",
+        "aria-label": "More accept options",
+        disabled: isActionPending
+      },
+      /* @__PURE__ */ React.createElement(CaretDown, { className: "size-4", "aria-hidden": "true" })
+    ))), /* @__PURE__ */ React.createElement(
+      DropdownMenuContent,
+      {
+        align: "end",
+        className: "z-above-modal border-none shadow-md dark:shadow-md-invert mt-1 "
+      },
+      !hideAcceptAndPublishPublic && /* @__PURE__ */ React.createElement(
+        DropdownMenuItem,
+        {
+          className: "p-3",
+          disabled: isActionPending,
+          onClick: () => void onAcceptAndPublishAction("public")
+        },
+        /* @__PURE__ */ React.createElement(Globe, { "aria-hidden": "true" }),
+        isNew ? "Accept & publish publicly" : "Accept all & publish publicly"
+      ),
+      /* @__PURE__ */ React.createElement(
+        DropdownMenuItem,
+        {
+          className: "p-3",
+          disabled: isActionPending,
+          onClick: () => void onAcceptAndPublishAction("internal")
+        },
+        /* @__PURE__ */ React.createElement(LockKey, { "aria-hidden": "true" }),
+        isNew ? "Accept & publish internally" : "Accept all & publish internally"
+      )
+    )) : /* @__PURE__ */ React.createElement(Button, { variant: "default", elevation: "shadow", disabled: isActionPending, onClick: () => void onAcceptAll() }, isAcceptPending ? /* @__PURE__ */ React.createElement(Spinner, { className: "size-5" }) : /* @__PURE__ */ React.createElement(CheckCircle, { "aria-hidden": "true" }), isNew ? "Accept as draft" : "Accept all as draft")
+  ));
+}
+
+export { SuggestionsHeaderToolbar };

package/dist/esm/scenes/knowledge-review/suggestions-header/suggestions-header.js

@@ -0,0 +1,105 @@
+import * as React from 'react';
+import { useReviewsSelection } from '../context.js';
+import { SuggestionsHeaderTitleNav } from './suggestions-header-title-nav.js';
+import { SuggestionsHeaderToolbar } from './suggestions-header-toolbar.js';
+import { cn } from '../../../lib/utils.js';
+
+const REASON_TITLE = "Why is Brainfish suggesting this?";
+const SuggestionsHeader = React.forwardRef(function SuggestionsHeader2({
+  title,
+  isNew,
+  isAccepted = false,
+  suggestionsCount,
+  sourceIcon,
+  sourceDescription,
+  currentArticleIndex,
+  totalArticles,
+  displayTotalArticles,
+  showActionButtons = true,
+  onNextArticle,
+  onPreviousArticle,
+  className,
+  ...props
+}, ref) {
+  const {
+    onApproveAllSuggestions,
+    onRejectAllSuggestions,
+    onAcceptAndPublish,
+    onApplyAllInEditor,
+    onRejectAllInEditor,
+    onOpenArticleLink,
+    onSourceLinkClick,
+    breadcrumb,
+    suggestionReasonBody,
+    hideAcceptAndPublishPublic = false
+  } = useReviewsSelection();
+  const [pendingAction, setPendingAction] = React.useState(null);
+  const pendingActionRef = React.useRef(null);
+  const runAction = React.useCallback(async (action, fn) => {
+    if (pendingActionRef.current) return;
+    pendingActionRef.current = action;
+    setPendingAction(action);
+    try {
+      await fn();
+    } finally {
+      pendingActionRef.current = null;
+      setPendingAction(null);
+    }
+  }, []);
+  const handleRejectAll = React.useCallback(async () => {
+    await runAction("reject", async () => {
+      if (onRejectAllInEditor) await onRejectAllInEditor();
+      await Promise.resolve(onRejectAllSuggestions());
+    });
+  }, [onRejectAllInEditor, onRejectAllSuggestions, runAction]);
+  const handleAcceptAll = React.useCallback(async () => {
+    await runAction("accept-draft", async () => {
+      if (onApplyAllInEditor) await onApplyAllInEditor();
+      await Promise.resolve(onApproveAllSuggestions());
+    });
+  }, [onApplyAllInEditor, onApproveAllSuggestions, runAction]);
+  const handleAcceptAndPublish = React.useCallback(
+    async (visibility) => {
+      if (!onAcceptAndPublish) return;
+      const action = visibility === "public" ? "accept-publish-public" : "accept-publish-internal";
+      await runAction(action, async () => {
+        if (onApplyAllInEditor) await onApplyAllInEditor();
+        await Promise.resolve(onAcceptAndPublish(visibility));
+      });
+    },
+    [onApplyAllInEditor, onAcceptAndPublish, runAction]
+  );
+  return /* @__PURE__ */ React.createElement("div", { ref, className: cn("flex flex-col gap-4", className), ...props }, /* @__PURE__ */ React.createElement(
+    SuggestionsHeaderTitleNav,
+    {
+      title,
+      breadcrumb,
+      onOpenArticleLink,
+      currentArticleIndex,
+      totalArticles,
+      displayTotalArticles,
+      onNextArticle,
+      onPreviousArticle
+    }
+  ), /* @__PURE__ */ React.createElement(
+    SuggestionsHeaderToolbar,
+    {
+      isNew,
+      isAccepted,
+      suggestionsCount,
+      sourceIcon,
+      sourceDescription,
+      onSourceLinkClick,
+      showActionButtons,
+      suggestionReasonBody,
+      hideAcceptAndPublishPublic,
+      pendingAction,
+      onAcceptAndPublish,
+      onRejectAll: handleRejectAll,
+      onAcceptAll: handleAcceptAll,
+      onAcceptAndPublishAction: handleAcceptAndPublish
+    }
+  ));
+});
+
+export { REASON_TITLE, SuggestionsHeader };

package/dist/esm/scenes/knowledge-review.js

@@ -1,20 +1,5 @@
-import*as e from"react";import t,{useCallback as n,useEffect as l,useRef as r,useState as c,useImperativeHandle as a}from"react";import{u as i,c as s,b as o,R as d}from"../chunks/suggestion-card.PPUwB3ML.js";import '../knowledge-review.css';export{S as SuggestionCard}from"../chunks/suggestion-card.PPUwB3ML.js";import u from"html-react-parser";import{CaretDown as m,CaretUp as p,Lightbulb as f,Backspace as g,CheckCircle as A,Globe as h,LockKey as b,HandsClapping as E}from"@phosphor-icons/react";import{Card as N,CardHeader as v,CardTitle as x,CardContent as w}from"../components/ui/card.js";import{ScrollArea as y}from"../components/ui/scroll-area.js";import{Spinner as k}from"../components/ui/spinner.js";import{B as C,a as I}from"../chunks/button.DXe2tRBO.js";import{Tooltip as P,TooltipTrigger as j,TooltipContent as R}from"../components/ui/tooltip.js";import{Popover as L,PopoverTrigger as D,PopoverContent as z}from"../components/ui/popover.js";import{DropdownMenu as B,DropdownMenuTrigger as O,DropdownMenuContent as T,DropdownMenuItem as q}from"../components/ui/dropdown-menu.js";import{ButtonGroup as F}from"../components/ui/button-group.js";import{c as $}from"../chunks/utils.DtKoarLP.js";function M({fetchDiffForItem:e}){const{selectedItem:t,setLoadedDiffDoc:r,setLoadingDiff:c}=i(),a=n(async(t,n)=>{c(!0),r(null);try{const l=await e(t);if(n.aborted)return;r(l)}catch(l){if(n.aborted)return;console.error("Failed to fetch diff:",l),r(null)}finally{n.aborted||c(!1)}},[e,r,c]),s=t?.id;return l(()=>{if(!s)return r(null),void c(!1);const e=new AbortController;return a(s,e.signal),()=>{e.abort()}},[s,a]),null}function W({title:t,breadcrumb:n,onOpenArticleLink:l,currentArticleIndex:r,totalArticles:c,displayTotalArticles:a,onNextArticle:i,onPreviousArticle:s}){const o=c>0&&r<c-1,d=r>0,u=0===c?0:r+1,f=a??c,g=f>0;/* @__PURE__ */
-return e.createElement("div",{className:"flex justify-between items-center"},/* @__PURE__ */e.createElement("h1",{className:"heading-lg"},t,l&&n&&/* @__PURE__ */e.createElement(C,{variant:"link",size:"sm",onClick:l,"aria-label":"Open article",className:"block px-0 text-subtle text-xs"},n)),/* @__PURE__ */e.createElement("div",{className:"flex items-center"},/* @__PURE__ */e.createElement("p",{className:"text-xs text-foreground pr-2"},/* @__PURE__ */e.createElement("span",{"aria-hidden":"true"},g?`${u}/${f}`:"0"),/* @__PURE__ */e.createElement("span",{className:"sr-only","aria-live":"polite"},g?`Article ${u} of ${f}`:"No articles")),/* @__PURE__ */e.createElement(P,null,/* @__PURE__ */e.createElement(j,{asChild:!0},/* @__PURE__ */e.createElement(C,{variant:"ghost",size:"icon",disabled:!o,onClick:i,"aria-label":"Go to next article"},
-/* @__PURE__ */e.createElement(m,{"aria-hidden":"true"}))),/* @__PURE__ */e.createElement(R,{side:"bottom",bgColor:"--bfc-foreground",className:"text-background"},"Next Article")),/* @__PURE__ */e.createElement(P,null,/* @__PURE__ */e.createElement(j,{asChild:!0},/* @__PURE__ */e.createElement(C,{variant:"ghost",size:"icon",disabled:!d,onClick:s,"aria-label":"Go to previous article"},
-/* @__PURE__ */e.createElement(p,{"aria-hidden":"true"}))),/* @__PURE__ */e.createElement(R,{side:"top",bgColor:"--bfc-foreground",className:"text-background"},"Previous Article"))))}function _({isNew:t,isAccepted:n=!1,suggestionsCount:l,sourceIcon:r,sourceDescription:c,onSourceLinkClick:a,showActionButtons:i=!0,suggestionReasonBody:o,hideAcceptAndPublishPublic:d=!1,pendingAction:u=null,onAcceptAndPublish:p,onRejectAll:E,onAcceptAll:N,onAcceptAndPublishAction:v}){const[x,w]=e.useState(!1),y=null!=u,P="reject"===u,S="accept-draft"===u||"accept-publish-public"===u||"accept-publish-internal"===u;/* @__PURE__ */
-return e.createElement("div",{className:"flex-1 px-2 pb-2 flex justify-between items-center"},/* @__PURE__ */e.createElement(s,{isNew:t,isAccepted:n,editCount:l,sourceIcon:r,sourceDescription:c,onSourceLinkClick:a}),i&&/* @__PURE__ */e.createElement(F,{orientation:"horizontal",rounded:!1,"aria-label":"Suggestion actions","aria-busy":y,className:"gap-1"},o&&/* @__PURE__ */e.createElement(L,{open:x,onOpenChange:w},/* @__PURE__ */e.createElement(D,{asChild:!0},/* @__PURE__ */e.createElement(C,{variant:"ghost","aria-label":G,disabled:y},/* @__PURE__ */e.createElement(f,{"aria-hidden":"true"}),"Why")),/* @__PURE__ */e.createElement(z,{align:"start",side:"bottom",className:"z-above-modal shadow-md dark:shadow-md-invert border-dark-300"},
-/* @__PURE__ */e.createElement("div",{className:"font-bold text-sm"},G),
-/* @__PURE__ */e.createElement("div",{className:"text-sm text-subtle mt-1"},o))),
-/* @__PURE__ */e.createElement(C,{variant:"ghost",disabled:y,onClick:()=>{E()}},P?/* @__PURE__ */e.createElement(k,{className:"size-5"}):/* @__PURE__ */e.createElement(g,{"aria-hidden":"true"}),t?"Reject":"Reject all"),p?/* @__PURE__ */e.createElement(B,null,/* @__PURE__ */e.createElement("div",{className:$("flex items-center rounded border border-border bg-primary",I)},/* @__PURE__ */e.createElement(C,{variant:"default",elevation:"shadow",className:"gap-1 rounded-none border-0 bg-transparent shadow-none",disabled:y,onClick:()=>{N()}},S?/* @__PURE__ */e.createElement(k,{className:"size-5"}):/* @__PURE__ */e.createElement(A,{"aria-hidden":"true"}),t?"Accept as draft":"Accept all as draft"),/* @__PURE__ */e.createElement("span",{className:"h-full w-px self-stretch bg-foreground","aria-hidden":"true"}),/* @__PURE__ */e.createElement(O,{asChild:!0},/* @__PURE__ */e.createElement(C,{variant:"default",size:"icon",className:"size-9 rounded-none border-0 bg-transparent shadow-none","aria-label":"More accept options",disabled:y},
-/* @__PURE__ */e.createElement(m,{className:"size-4","aria-hidden":"true"})))),/* @__PURE__ */e.createElement(T,{align:"end",className:"z-above-modal border-none shadow-md dark:shadow-md-invert mt-1 "},!d&&/* @__PURE__ */e.createElement(q,{className:"p-3",disabled:y,onClick:()=>{v("public")}},
-/* @__PURE__ */e.createElement(h,{"aria-hidden":"true"}),t?"Accept & publish publicly":"Accept all & publish publicly"),
-/* @__PURE__ */e.createElement(q,{className:"p-3",disabled:y,onClick:()=>{v("internal")}},
-/* @__PURE__ */e.createElement(b,{"aria-hidden":"true"}),t?"Accept & publish internally":"Accept all & publish internally"))):/* @__PURE__ */e.createElement(C,{variant:"default",elevation:"shadow",disabled:y,onClick:()=>{N()}},S?/* @__PURE__ */e.createElement(k,{className:"size-5"}):/* @__PURE__ */e.createElement(A,{"aria-hidden":"true"}),t?"Accept as draft":"Accept all as draft")))}const G="Why is Brainfish suggesting this?",K=e.forwardRef(function({title:t,isNew:n,isAccepted:l=!1,suggestionsCount:r,sourceIcon:c,sourceDescription:a,currentArticleIndex:s,totalArticles:o,displayTotalArticles:d,showActionButtons:u=!0,onNextArticle:m,onPreviousArticle:p,className:f,...g},A){const{onApproveAllSuggestions:h,onRejectAllSuggestions:b,onAcceptAndPublish:E,onApplyAllInEditor:N,onRejectAllInEditor:v,onOpenArticleLink:x,onSourceLinkClick:w,breadcrumb:y,suggestionReasonBody:k,hideAcceptAndPublishPublic:C=!1}=i(),[I,P]=e.useState(null),S=e.useRef(null),j=e.useCallback(async(e,t)=>{if(!S.current){S.current=e,P(e);try{await t()}finally{S.current=null,P(null)}}},[]),R=e.useCallback(async()=>{await j("reject",async()=>{v&&await v(),await Promise.resolve(b())})},[v,b,j]),L=e.useCallback(async()=>{await j("accept-draft",async()=>{N&&await N(),await Promise.resolve(h())})},[N,h,j]),D=e.useCallback(async e=>{if(!E)return;const t="public"===e?"accept-publish-public":"accept-publish-internal";await j(t,async()=>{N&&await N(),await Promise.resolve(E(e))})},[N,E,j]);/* @__PURE__ */
-return e.createElement("div",{ref:A,className:$("flex flex-col gap-4",f),...g},/* @__PURE__ */e.createElement(W,{title:t,breadcrumb:y,onOpenArticleLink:x,currentArticleIndex:s,totalArticles:o,displayTotalArticles:d,onNextArticle:m,onPreviousArticle:p}),/* @__PURE__ */e.createElement(_,{isNew:n,isAccepted:l,suggestionsCount:r,sourceIcon:c,sourceDescription:a,onSourceLinkClick:w,showActionButtons:u,suggestionReasonBody:k,hideAcceptAndPublishPublic:C,pendingAction:I,onAcceptAndPublish:E,onRejectAll:R,onAcceptAll:L,onAcceptAndPublishAction:D}))});function H(e){const t=e.querySelectorAll("del + ins"),n=e.querySelectorAll("ins:not(del + ins)"),l=e.querySelectorAll("del"),r=Array.from(l).filter(e=>"INS"!==e.nextElementSibling?.tagName);return t.length+n.length+r.length}function J({diffTitle:e,items:a,isLoading:s,totalItemsCount:o,showActionButtons:d=!0,children:m,sourceIcon:p,sourceDescription:f}){const{selectedItem:g,setSelectedItem:A,loadedDiffDoc:h,loadingDiff:b}=i(),C=a.length>0,I=s??!C,P=I&&!C,S=!I&&!C,j=b?"":u(h?.diffTitle??e??""),R=b?/* @__PURE__ */t.createElement("div",{className:"text-muted-foreground"},"Loading diff…"):h?.diffContent,L=b?0:(D=h?.diffTitle??e)&&"undefined"!=typeof DOMParser?H((new DOMParser).parseFromString(D,"text/html")):0;var D;const z=r(null),[B,O]=c(0);l(()=>{if(b||!h)return void O(0);const e=z.current;if(!e)return;const t=requestAnimationFrame(()=>{var t;O((t=e)?H(t):0)});return()=>cancelAnimationFrame(t)},[b,h]);const T=L+B,q=a.length,F=o??q,$=g?Math.max(0,a.findIndex(e=>e.id===g.id)):0,M=n(()=>{$<q-1&&A(a[$+1]??null)},[$,a,A,q]),W=n(()=>{$>0&&A(a[$-1]??null)},[$,a,A]),_=g?a.find(e=>e.id===g.id)??g:null,G=_?.icon??p,J=_?.description??f,Q=_?.isAccepted??!1;/* @__PURE__ */
-return t.createElement(N,{className:"py-6 pl-4","data-name":"knowledge-reviews"},/* @__PURE__ */t.createElement(y,{className:"h-[calc(var(--knowledge-review-scroll-height)-50px)] pr-8"},/* @__PURE__ */t.createElement(v,{className:"p-0"},C&&/* @__PURE__ */t.createElement(x,{className:"border-b border-dark-300 mb-6 pb-2 font-normal"},/* @__PURE__ */t.createElement(K,{title:j,isNew:h?.isNew??!1,isAccepted:Q,suggestionsCount:T,sourceIcon:G,sourceDescription:J,currentArticleIndex:$,totalArticles:q,displayTotalArticles:F,showActionButtons:d,onNextArticle:M,onPreviousArticle:W}))),/* @__PURE__ */t.createElement(w,{className:"p-0 [&_ol]:!pl-16 [&_ul]:!pl-16"},/* @__PURE__ */t.createElement("div",{"aria-hidden":"true",className:"sr-only",hidden:!0},m),P?/* @__PURE__ */t.createElement("div",{className:"flex flex-col items-center justify-center gap-4 text-center h-[50dvh] text-muted-foreground"},/* @__PURE__ */t.createElement(k,{className:"size-8"}),/* @__PURE__ */t.createElement("p",{className:"text-base font-medium"},"Loading suggestions...")):S?/* @__PURE__ */t.createElement("div",{className:"flex flex-col items-center justify-center gap-4 text-center h-[50dvh]"},/* @__PURE__ */t.createElement(E,{className:"text-muted-foreground",size:32,weight:"fill"}),/* @__PURE__ */t.createElement("p",{className:"text-base font-medium text-foreground"},"All up to date. Well done, mate.")):/* @__PURE__ */t.createElement("div",{ref:z,className:"pl-12"},R))))}const Q="--knowledge-review-scroll-height",U=t.forwardRef(function({diffTitle:e="Knowledge Review",children:n,items:c,isLoading:s,totalItemsCount:o,showActionButtons:u=!0,className:m,onApproveAllSuggestions:p,onRejectAllSuggestions:f,onOpenArticleLink:g,onAcceptAndPublish:A,onApplyAllInEditor:h,onRejectAllInEditor:b,onSourceLinkClick:E,breadcrumb:v,sourceIcon:x,sourceDescription:C,suggestionReasonBody:I,hideAcceptAndPublishPublic:P,...S},j){const R=r(null),{selectedItem:L,setSelectedItem:D}=i();a(j,()=>({selectedItem:L,setSelectedItem:D}),[L,D]),l(()=>{const e=R.current;if(!e)return;const t=()=>{const{height:t}=e.getBoundingClientRect();e.style.setProperty(Q,`${t}px`)};if(t(),"function"!=typeof ResizeObserver)return;const n=new ResizeObserver(t);return n.observe(e),()=>n.disconnect()},[]);const z=s??0===c.length,B=z&&0===c.length;/* @__PURE__ */
-return t.createElement(N,{className:$("h-full",m)},/* @__PURE__ */t.createElement(w,{className:"p-4 lg:p-8 h-full"},/* @__PURE__ */t.createElement("div",{ref:R,className:"grid xs:max-lg:grid-cols-1 lg:grid-cols-[1fr_4fr] gap-6 min-h-96 h-full",style:{[Q]:"100px"},...S},
-/* @__PURE__ */t.createElement(y,{className:"h-[calc(var(--knowledge-review-scroll-height))] min-w-80 lg:block hidden"},B?/* @__PURE__ */t.createElement("div",{className:"flex h-full min-h-96 items-center justify-center text-muted-foreground"},/* @__PURE__ */t.createElement(k,{className:"size-6"})):/* @__PURE__ */t.createElement(d,{items:c})),
-/* @__PURE__ */t.createElement(J,{diffTitle:e,items:c,isLoading:z,totalItemsCount:o,showActionButtons:u,sourceIcon:x,sourceDescription:C},n))))}),V=t.forwardRef(function(e,n){const{items:l,onApproveAllSuggestions:r,onRejectAllSuggestions:c,onAcceptAndPublish:a,onApplyAllInEditor:i,onRejectAllInEditor:s,onOpenArticleLink:d,onSourceLinkClick:u,breadcrumb:m,suggestionReasonBody:p,hideAcceptAndPublishPublic:f}=e;/* @__PURE__ */
-return t.createElement(o,{defaultSelectedItem:l.find(e=>e.isSelected)??null,onApproveAllSuggestions:r,onRejectAllSuggestions:c,onAcceptAndPublish:a,onApplyAllInEditor:i,onRejectAllInEditor:s,onOpenArticleLink:d,onSourceLinkClick:u,breadcrumb:m,suggestionReasonBody:p,hideAcceptAndPublishPublic:f},
-/* @__PURE__ */t.createElement(U,{...e,ref:n}))});export{M as KnowledgeReviewDiffLoader,J as KnowledgeReviewPanel,V as KnowledgeReviewScene,o as ReviewsSelectionProvider,i as useReviewsSelection};
-//# sourceMappingURL=knowledge-review.js.map
+export { KnowledgeReviewDiffLoader } from './knowledge-review/diff-loader.js';
+export { KnowledgeReviewPanel } from './knowledge-review/knowledge-review-panel.js';
+export { KnowledgeReviewScene } from './knowledge-review/scene.js';
+export { ReviewsSelectionProvider, useReviewsSelection } from './knowledge-review/context.js';
+export { SuggestionCard } from './knowledge-review/suggestion-card/suggestion-card.js';