"use client";

// src/components/data-views/finder-panel-view.tsx
import * as React from "react";

// src/lib/utils.ts
import { clsx } from "clsx";
import { twMerge } from "tailwind-merge";
function cn(...inputs) {
  return twMerge(clsx(inputs));
}

// src/components/ui/resizable.tsx
import { GripVertical } from "lucide-react";
import { Group, Panel, Separator } from "react-resizable-panels";
import { jsx } from "react/jsx-runtime";
function ResizablePanelGroup({
  direction = "horizontal",
  className,
  ...props
}) {
  return /* @__PURE__ */ jsx(
    Group,
    {
      orientation: direction,
      className: cn(
        "flex size-full",
        direction === "vertical" && "flex-col",
        className
      ),
      ...props
    }
  );
}
var ResizablePanel = Panel;
function ResizableHandle({ withHandle, className, ...props }) {
  return /* @__PURE__ */ jsx(
    Separator,
    {
      className: cn(
        // Base — horizontal handle (between side-by-side panels)
        "relative flex w-1 shrink-0 cursor-col-resize items-center justify-center bg-border/60",
        "transition-colors hover:bg-border active:bg-primary/30",
        "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1",
        // Vertical handle (between stacked panels)
        "data-[orientation=vertical]:h-1 data-[orientation=vertical]:w-full data-[orientation=vertical]:cursor-row-resize data-[orientation=vertical]:flex-row",
        className
      ),
      ...props,
      children: withHandle && /* @__PURE__ */ jsx("div", { className: "z-10 flex h-5 w-3.5 items-center justify-center rounded-sm border border-border bg-background shadow-sm", children: /* @__PURE__ */ jsx(GripVertical, { className: "size-3 text-muted-foreground" }) })
    }
  );
}

// src/components/data-views/list-page-tree-column-header.tsx
import { jsx as jsx2, jsxs } from "react/jsx-runtime";
function ListPageTreeColumnHeader({
  title,
  trailing,
  className
}) {
  return /* @__PURE__ */ jsx2("div", { className: cn("shrink-0 border-b border-border/50 bg-card px-3 py-2", className), children: /* @__PURE__ */ jsxs("div", { className: "flex h-9 items-center justify-between gap-2", children: [
    /* @__PURE__ */ jsx2("h3", { className: "min-w-0 flex-1 truncate text-sm font-medium text-foreground", children: title }),
    trailing ? /* @__PURE__ */ jsx2("div", { className: "flex shrink-0 items-center gap-0.5", children: trailing }) : null
  ] }) });
}

// src/components/data-views/list-page-split-details-placeholder.tsx
import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
function ListPageSplitDetailsPlaceholder({
  title = "Nothing selected",
  description,
  className
}) {
  return /* @__PURE__ */ jsxs2(
    "div",
    {
      className: cn(
        "flex h-full min-h-0 flex-col items-center justify-center bg-card px-6 py-10 text-center",
        className
      ),
      children: [
        /* @__PURE__ */ jsx3("div", { className: "mb-4 flex size-14 items-center justify-center rounded-2xl border border-dashed border-border/70 bg-card", children: /* @__PURE__ */ jsx3(
          "i",
          {
            className: "fa-light fa-sidebar text-[1.65rem] leading-none text-muted-foreground/70",
            "aria-hidden": "true"
          }
        ) }),
        /* @__PURE__ */ jsx3("p", { className: "text-sm font-medium text-foreground", children: title }),
        description ? /* @__PURE__ */ jsx3("div", { className: "mt-1.5 max-w-[16rem] text-xs leading-relaxed text-muted-foreground", children: description }) : null
      ]
    }
  );
}

// src/components/data-views/list-page-split-hub-tokens.ts
var LIST_PAGE_SPLIT_RESIZABLE_HANDLE_CLASS = "w-1 bg-border/40 hover:bg-brand/20 transition-colors";
var LIST_PAGE_SPLIT_MILLER_COLUMN_PANEL_CLASS = "flex min-h-0 min-w-0 flex-col bg-card";
var LIST_PAGE_SPLIT_MILLER_DETAIL_PANEL_CLASS = "flex min-h-0 min-w-0 flex-col bg-card";

// src/components/data-views/finder-panel-view.tsx
import { Fragment, jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
function GroupsColumn({
  groups,
  selectedGroupId,
  onSelect,
  columnTitle
}) {
  return /* @__PURE__ */ jsxs3("div", { className: "flex h-full min-h-0 flex-col overflow-hidden", children: [
    /* @__PURE__ */ jsx4(ListPageTreeColumnHeader, { title: columnTitle }),
    /* @__PURE__ */ jsx4(
      "div",
      {
        className: "min-h-0 flex-1 overflow-y-auto py-1",
        role: "listbox",
        "aria-label": "Group navigation",
        children: groups.map((group) => {
          const isSelected = group.id === selectedGroupId;
          return /* @__PURE__ */ jsx4("div", { className: "group flex items-center hover:bg-muted/50", children: /* @__PURE__ */ jsxs3(
            "button",
            {
              type: "button",
              role: "option",
              "aria-selected": isSelected,
              onClick: () => onSelect(group.id),
              className: cn(
                "flex w-full flex-1 items-center gap-2 px-3 py-2 text-start text-sm transition-colors duration-75",
                "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-inset",
                isSelected ? "bg-accent font-medium text-accent-foreground" : "text-foreground"
              ),
              children: [
                group.accent ? /* @__PURE__ */ jsx4("span", { className: cn("size-2 shrink-0 rounded-full", group.accent), "aria-hidden": "true" }) : group.icon ? /* @__PURE__ */ jsx4(
                  "i",
                  {
                    className: cn(
                      "fa-light shrink-0 text-xs",
                      group.icon,
                      isSelected ? "text-accent-foreground" : "text-muted-foreground"
                    ),
                    "aria-hidden": "true"
                  }
                ) : null,
                /* @__PURE__ */ jsx4("span", { className: "min-w-0 flex-1 truncate leading-tight", children: group.label }),
                /* @__PURE__ */ jsx4(
                  "span",
                  {
                    className: cn(
                      "shrink-0 tabular-nums text-xs",
                      isSelected ? "text-accent-foreground/80" : "text-muted-foreground"
                    ),
                    children: group.count
                  }
                )
              ]
            }
          ) }, group.id);
        })
      }
    )
  ] });
}
function FinderGroupStrip({
  groups,
  selectedGroupId,
  onSelect,
  ariaLabel = "Scope"
}) {
  return /* @__PURE__ */ jsx4(
    "div",
    {
      role: "toolbar",
      "aria-label": ariaLabel,
      className: "flex min-h-10 flex-wrap items-center gap-1.5 border-b border-border bg-card p-2",
      children: groups.map((group) => {
        const isSelected = group.id === selectedGroupId;
        return /* @__PURE__ */ jsxs3(
          "button",
          {
            type: "button",
            "aria-pressed": isSelected,
            onClick: () => onSelect(group.id),
            className: cn(
              "inline-flex h-8 max-w-full min-w-0 shrink-0 items-center gap-1.5 rounded-lg border px-2.5 text-xs font-medium transition-colors",
              "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
              isSelected ? "border-brand/40 bg-accent text-accent-foreground" : "border-transparent bg-background/80 text-foreground hover:bg-muted"
            ),
            children: [
              group.accent ? /* @__PURE__ */ jsx4("span", { className: cn("size-2 shrink-0 rounded-full", group.accent), "aria-hidden": "true" }) : group.icon ? /* @__PURE__ */ jsx4(
                "i",
                {
                  className: cn(
                    "fa-light shrink-0 text-[11px]",
                    group.icon,
                    isSelected ? "text-accent-foreground" : "text-muted-foreground"
                  ),
                  "aria-hidden": "true"
                }
              ) : null,
              /* @__PURE__ */ jsx4("span", { className: "min-w-0 truncate", children: group.label }),
              /* @__PURE__ */ jsx4(
                "span",
                {
                  className: cn(
                    "shrink-0 tabular-nums text-[11px]",
                    isSelected ? "text-accent-foreground/85" : "text-muted-foreground"
                  ),
                  children: group.count
                }
              )
            ]
          },
          group.id
        );
      })
    }
  );
}
function FinderListRowContent({
  row,
  isSelected,
  renderListRow
}) {
  return /* @__PURE__ */ jsx4(Fragment, { children: renderListRow(row, isSelected) });
}
function ListColumn({
  rows,
  getRowId,
  selectedId,
  renderListRow,
  onSelect,
  emptyList,
  groupLabel,
  columnTitle,
  onAddItem
}) {
  return /* @__PURE__ */ jsxs3("div", { className: "flex h-full min-h-0 flex-col overflow-hidden", children: [
    /* @__PURE__ */ jsx4(ListPageTreeColumnHeader, { title: columnTitle }),
    /* @__PURE__ */ jsxs3("div", { className: "flex min-h-0 flex-1 flex-col", children: [
      /* @__PURE__ */ jsx4(
        "div",
        {
          className: "min-h-0 flex-1 overflow-y-auto py-1",
          role: "listbox",
          "aria-label": `${groupLabel} items`,
          children: rows.length === 0 ? /* @__PURE__ */ jsx4("div", { className: "flex flex-col items-center justify-center px-4 py-12 text-center text-sm text-muted-foreground", children: emptyList ?? /* @__PURE__ */ jsx4("p", { children: "No items in this group." }) }) : rows.map((row) => {
            const id = getRowId(row);
            const isSelected = id === selectedId;
            return /* @__PURE__ */ jsx4("div", { className: "group flex items-center hover:bg-muted/50", children: /* @__PURE__ */ jsx4(
              "button",
              {
                type: "button",
                role: "option",
                "aria-selected": isSelected,
                onClick: () => onSelect(id),
                className: cn(
                  "flex w-full flex-1 items-center gap-3 px-3 py-2 text-start text-sm transition-colors duration-75",
                  "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-inset",
                  isSelected ? "bg-accent font-medium text-accent-foreground" : "text-foreground"
                ),
                children: /* @__PURE__ */ jsx4(FinderListRowContent, { row, isSelected, renderListRow })
              }
            ) }, id);
          })
        }
      ),
      onAddItem ? /* @__PURE__ */ jsx4("div", { className: "flex shrink-0 items-center justify-center border-t border-border/50 px-2 py-1.5", children: /* @__PURE__ */ jsx4(
        "button",
        {
          type: "button",
          onClick: onAddItem,
          className: "flex size-8 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-muted hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
          "aria-label": `Add item to ${groupLabel}`,
          children: /* @__PURE__ */ jsx4("i", { className: "fa-light fa-plus text-xs", "aria-hidden": "true" })
        }
      ) }) : null
    ] })
  ] });
}
function DetailColumn({ children }) {
  return /* @__PURE__ */ jsxs3("div", { className: cn(LIST_PAGE_SPLIT_MILLER_DETAIL_PANEL_CLASS, "overflow-hidden"), children: [
    /* @__PURE__ */ jsx4(ListPageTreeColumnHeader, { title: "Details" }),
    /* @__PURE__ */ jsx4("div", { className: "flex min-h-0 flex-1 flex-col overflow-hidden", children })
  ] });
}
function DefaultEmptyDetail() {
  return /* @__PURE__ */ jsx4(ListPageSplitDetailsPlaceholder, { title: "Nothing selected" });
}
function FinderPanelView({
  groups,
  rows,
  getRowId,
  getRowGroupId,
  renderListRow,
  renderDetail,
  emptyDetail,
  emptyList,
  defaultGroupId,
  ariaLabel = "List and details",
  autoSaveId = "finder-panel-view",
  className,
  style,
  onAddItem,
  embedded = false,
  groupsColumnTitle = "Categories",
  getListColumnTitle = (g) => g?.label ?? "Items"
}) {
  const mergedStyle = React.useMemo(() => {
    if (embedded) {
      return { height: "100%", minHeight: 0, ...style };
    }
    return {
      height: "calc(100vh - 280px)",
      minHeight: 420,
      ...style
    };
  }, [embedded, style]);
  const firstGroupId = defaultGroupId ?? groups[0]?.id ?? "all";
  const [selectedGroupId, setSelectedGroupId] = React.useState(firstGroupId);
  const [selectedRowId, setSelectedRowId] = React.useState(null);
  const visibleRows = React.useMemo(() => {
    if (selectedGroupId === "all") return rows;
    return rows.filter((r) => getRowGroupId(r) === selectedGroupId);
  }, [rows, selectedGroupId, getRowGroupId]);
  const resolvedRowId = React.useMemo(() => {
    if (selectedRowId !== null && visibleRows.some((r) => getRowId(r) === selectedRowId)) {
      return selectedRowId;
    }
    return visibleRows[0] ? getRowId(visibleRows[0]) : null;
  }, [selectedRowId, visibleRows, getRowId]);
  const handleSelectGroup = React.useCallback(
    (id) => {
      setSelectedGroupId(id);
      const nextRows = id === "all" ? rows : rows.filter((r) => getRowGroupId(r) === id);
      setSelectedRowId(nextRows[0] ? getRowId(nextRows[0]) : null);
    },
    [rows, getRowGroupId, getRowId]
  );
  const selectedRow = resolvedRowId !== null ? visibleRows.find((r) => getRowId(r) === resolvedRowId) ?? null : null;
  const selectedGroup = groups.find((g) => g.id === selectedGroupId);
  const listColumnTitle = getListColumnTitle(selectedGroup);
  return /* @__PURE__ */ jsx4(
    "div",
    {
      className: cn(
        embedded ? "flex h-full min-h-0 flex-col overflow-hidden" : "mx-4 mb-6 overflow-hidden rounded-xl border border-border bg-card lg:mx-6",
        className
      ),
      style: mergedStyle,
      "aria-label": ariaLabel,
      children: /* @__PURE__ */ jsxs3(
        ResizablePanelGroup,
        {
          id: String(autoSaveId),
          direction: "horizontal",
          className: "h-full min-h-0 w-full flex-1",
          children: [
            /* @__PURE__ */ jsx4(
              ResizablePanel,
              {
                id: "groups",
                defaultSize: "22%",
                minSize: "16%",
                maxSize: "32%",
                className: LIST_PAGE_SPLIT_MILLER_COLUMN_PANEL_CLASS,
                children: /* @__PURE__ */ jsx4(
                  GroupsColumn,
                  {
                    columnTitle: groupsColumnTitle,
                    groups,
                    selectedGroupId,
                    onSelect: handleSelectGroup
                  }
                )
              }
            ),
            /* @__PURE__ */ jsx4(ResizableHandle, { withHandle: true, className: LIST_PAGE_SPLIT_RESIZABLE_HANDLE_CLASS }),
            /* @__PURE__ */ jsx4(
              ResizablePanel,
              {
                id: "list",
                defaultSize: "34%",
                minSize: "22%",
                maxSize: "48%",
                className: LIST_PAGE_SPLIT_MILLER_COLUMN_PANEL_CLASS,
                children: /* @__PURE__ */ jsx4(
                  ListColumn,
                  {
                    columnTitle: listColumnTitle,
                    rows: visibleRows,
                    getRowId,
                    selectedId: resolvedRowId,
                    renderListRow,
                    onSelect: setSelectedRowId,
                    emptyList,
                    groupLabel: selectedGroup?.label ?? "All",
                    onAddItem
                  }
                )
              }
            ),
            /* @__PURE__ */ jsx4(ResizableHandle, { withHandle: true, className: LIST_PAGE_SPLIT_RESIZABLE_HANDLE_CLASS }),
            /* @__PURE__ */ jsx4(ResizablePanel, { id: "detail", defaultSize: "44%", minSize: "30%", className: LIST_PAGE_SPLIT_MILLER_DETAIL_PANEL_CLASS, children: /* @__PURE__ */ jsx4(DetailColumn, { children: selectedRow ? renderDetail(selectedRow) : emptyDetail ?? /* @__PURE__ */ jsx4(DefaultEmptyDetail, {}) }) })
          ]
        }
      )
    }
  );
}
export {
  FinderGroupStrip,
  FinderPanelView,
  GroupsColumn
};
//# sourceMappingURL=finder-panel-view.js.map