@arbidocs/blocks 0.4.83 → 0.4.85

package/dist/chunk-O4YPVYPO.cjs

@@ -0,0 +1,373 @@
+"use client";
+'use strict';
+
+var chunkMHVNT4J3_cjs = require('./chunk-MHVNT4J3.cjs');
+var react = require('react');
+var lucideReact = require('lucide-react');
+var ui = require('@arbidocs/react/ui');
+var jsxRuntime = require('react/jsx-runtime');
+
+var DEFAULT_FOLDER_PICKER_LABELS = {
+  none: "None",
+  removeFromFolder: "Remove from folder",
+  searchOrCreate: "Search or create...",
+  noFolders: "No folders yet",
+  create: (name) => `Create \u201C${name}\u201D`
+};
+function FolderPickerRow({
+  label,
+  icon,
+  count,
+  depth,
+  isActive,
+  muted,
+  checkbox,
+  indeterminate,
+  testId,
+  onClick
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "button",
+    {
+      type: "button",
+      "data-testid": testId,
+      onClick,
+      role: checkbox ? "checkbox" : void 0,
+      "aria-checked": checkbox ? indeterminate ? "mixed" : isActive : void 0,
+      style: { paddingLeft: `${4 + depth * 14}px` },
+      className: ui.cn(
+        // `[&:hover]:`, not `hover:`: the latter compiles behind `@media (hover: hover)`, so on a
+        // touchscreen whose PRIMARY pointer reports `hover: none` the row would never highlight
+        // even with a real mouse attached. The arbitrary selector has no media gate.
+        "flex w-full items-center gap-1 rounded-sm py-1 pr-2 text-sm transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring [&:hover]:bg-accent pointer-coarse:min-h-11",
+        isActive && "bg-primary/10",
+        muted && !isActive && "text-muted-foreground"
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex w-4 shrink-0 items-center justify-center", children: checkbox ? /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            className: ui.cn(
+              "flex size-3.5 items-center justify-center rounded-[3px] border transition-colors",
+              isActive || indeterminate ? "border-primary bg-primary text-primary-foreground" : "border-muted-foreground/40"
+            ),
+            children: indeterminate ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Minus, { className: "size-2.5" }) : isActive && /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "size-2.5" })
+          }
+        ) : isActive && /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "size-3.5 text-primary" }) }),
+        icon,
+        label !== "" && /* @__PURE__ */ jsxRuntime.jsx("span", { className: ui.cn("min-w-0 truncate", isActive && "font-semibold text-primary"), children: label }),
+        count !== void 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-auto pl-2 text-sm font-semibold text-muted-foreground", children: count })
+      ]
+    }
+  );
+}
+function FolderTree({
+  nodes,
+  unfiledCount,
+  value,
+  onChange,
+  showUnfiledAlways,
+  labels
+}) {
+  const l = { ...DEFAULT_FOLDER_PICKER_LABELS, ...labels };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "max-h-[240px] overflow-y-auto", children: [
+    nodes.map((node) => /* @__PURE__ */ jsxRuntime.jsx(
+      FolderPickerRow,
+      {
+        label: node.label,
+        icon: node.icon,
+        count: node.count,
+        depth: node.depth,
+        isActive: value === node.path,
+        onClick: () => onChange(node.path)
+      },
+      node.path
+    )),
+    (unfiledCount > 0 || showUnfiledAlways) && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      nodes.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "my-1 border-t border-border" }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        FolderPickerRow,
+        {
+          label: l.none,
+          count: unfiledCount,
+          depth: 0,
+          isActive: value === null,
+          muted: true,
+          onClick: () => onChange(null)
+        }
+      )
+    ] })
+  ] });
+}
+function FolderBreadcrumb({ folder }) {
+  const parts = folder.split("/");
+  return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "whitespace-nowrap", children: parts.map((part, i) => /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-0.5", children: [
+    i > 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "mx-0.5 text-sm text-muted-foreground/50", children: "/" }),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: i < parts.length - 1 ? "text-sm text-muted-foreground" : "", children: part })
+  ] }, i)) });
+}
+function FolderCommandList({
+  folders,
+  value,
+  onSelect,
+  showRemove = false,
+  removeLabel,
+  placeholder,
+  autoFocus = true,
+  labels,
+  testIds
+}) {
+  const l = { ...DEFAULT_FOLDER_PICKER_LABELS, ...labels };
+  const [search, setSearch] = react.useState("");
+  const trimmed = search.trim();
+  const matchesExisting = folders.some((f) => f.toLowerCase() === trimmed.toLowerCase());
+  const handleCreate = react.useCallback(
+    (name) => {
+      const next = name.trim();
+      if (!next) return;
+      onSelect(next);
+      setSearch("");
+    },
+    [onSelect]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsxs(ui.Command, { shouldFilter: true, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      ui.CommandInput,
+      {
+        placeholder: placeholder ?? l.searchOrCreate,
+        value: search,
+        onValueChange: setSearch,
+        autoFocus,
+        onKeyDown: (e) => {
+          if (e.key === "Enter" && trimmed && !matchesExisting) {
+            e.preventDefault();
+            handleCreate(search);
+          }
+        }
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsxs(ui.CommandList, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(ui.CommandEmpty, { children: trimmed ? /* @__PURE__ */ jsxRuntime.jsxs(
+        "button",
+        {
+          type: "button",
+          "data-testid": chunkMHVNT4J3_cjs.testIdOr(testIds?.create, { testId: "folder-picker-create" }),
+          onClick: () => handleCreate(search),
+          onPointerDown: (e) => e.preventDefault(),
+          className: "flex w-full cursor-pointer items-center gap-1.5 rounded px-2 py-1.5 text-left text-sm text-primary hover:bg-accent pointer-coarse:min-h-11",
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, { className: "size-3.5 shrink-0" }),
+            l.create(trimmed)
+          ]
+        }
+      ) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", children: l.noFolders }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(ui.CommandGroup, { children: folders.map((folder) => /* @__PURE__ */ jsxRuntime.jsxs(
+        ui.CommandItem,
+        {
+          value: folder,
+          "data-testid": chunkMHVNT4J3_cjs.testIdOr(testIds?.option?.(folder), {
+            testId: `folder-picker-option-${folder}`
+          }),
+          onSelect: () => onSelect(folder),
+          onPointerDown: (e) => e.preventDefault(),
+          className: "cursor-pointer text-sm",
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.FolderOpen, { className: "mr-1.5 size-3.5 flex-none shrink-0 text-yellow-text" }),
+            /* @__PURE__ */ jsxRuntime.jsx(FolderBreadcrumb, { folder }),
+            value === folder && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-auto flex-none text-sm text-primary", children: "\u2713" })
+          ]
+        },
+        folder
+      )) }),
+      trimmed && !matchesExisting && folders.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(ui.CommandGroup, { children: /* @__PURE__ */ jsxRuntime.jsxs(
+        ui.CommandItem,
+        {
+          value: `__create__${trimmed}`,
+          "data-testid": chunkMHVNT4J3_cjs.testIdOr(testIds?.createOption, {
+            testId: "folder-picker-create-option"
+          }),
+          onSelect: () => handleCreate(search),
+          onPointerDown: (e) => e.preventDefault(),
+          className: "cursor-pointer text-sm text-primary",
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, { className: "mr-1.5 size-3.5 shrink-0" }),
+            /* @__PURE__ */ jsxRuntime.jsx("span", { children: l.create(trimmed) })
+          ]
+        }
+      ) }),
+      showRemove && /* @__PURE__ */ jsxRuntime.jsx(ui.CommandGroup, { children: /* @__PURE__ */ jsxRuntime.jsxs(
+        ui.CommandItem,
+        {
+          value: "__none__",
+          "data-testid": chunkMHVNT4J3_cjs.testIdOr(testIds?.remove, { testId: "folder-picker-remove" }),
+          onSelect: () => onSelect(null),
+          onPointerDown: (e) => e.preventDefault(),
+          className: "cursor-pointer text-sm text-muted-foreground",
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "mr-1 size-3.5 shrink-0" }),
+            /* @__PURE__ */ jsxRuntime.jsx("span", { children: removeLabel ?? l.removeFromFolder }),
+            value === null && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-auto flex-none text-sm text-primary", children: "\u2713" })
+          ]
+        }
+      ) })
+    ] })
+  ] });
+}
+var DEFAULT_FOLDER_FILTER_LABELS = {
+  all: "All",
+  newFolder: "New folder"
+};
+function FolderFilterButton({
+  label,
+  icon,
+  isActive,
+  open,
+  onOpenChange,
+  allCount,
+  onSelectAll,
+  onNewFolder,
+  children,
+  className,
+  labels,
+  testId,
+  newFolderTestId
+}) {
+  const l = { ...DEFAULT_FOLDER_FILTER_LABELS, ...labels };
+  return /* @__PURE__ */ jsxRuntime.jsxs(ui.Popover, { open, onOpenChange, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(ui.PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
+      ui.Button,
+      {
+        variant: "ghost",
+        size: "sm",
+        "data-slot": "folder-filter-button",
+        "data-testid": testId,
+        className: ui.cn(
+          "h-7 shrink-0 gap-1.5 px-2 text-sm font-normal pointer-coarse:h-10",
+          isActive && "bg-accent font-medium text-accent-foreground",
+          className
+        ),
+        children: [
+          icon ?? /* @__PURE__ */ jsxRuntime.jsx(
+            lucideReact.FolderOpen,
+            {
+              className: ui.cn(
+                "h-3.5 w-3.5 shrink-0 text-muted-foreground",
+                isActive && "fill-muted-foreground/30"
+              )
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "max-w-[280px] truncate", children: label }),
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "h-4 w-4 text-foreground", strokeWidth: 2.5 })
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      ui.PopoverContent,
+      {
+        className: "w-max min-w-56 max-w-[480px] p-1 shadow-lg",
+        align: "start",
+        sideOffset: 4,
+        children: [
+          onSelectAll && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              FolderPickerRow,
+              {
+                label: l.all,
+                count: allCount,
+                depth: 0,
+                isActive: !isActive,
+                onClick: onSelectAll
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "my-1 border-t border-border" })
+          ] }),
+          children,
+          onNewFolder && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "my-1 border-t border-border" }),
+            /* @__PURE__ */ jsxRuntime.jsxs(
+              "button",
+              {
+                type: "button",
+                onClick: onNewFolder,
+                "data-testid": chunkMHVNT4J3_cjs.testIdOr(newFolderTestId, { testId: "explorer-new-folder" }),
+                className: "flex w-full items-center gap-2 rounded-md px-2 py-1.5 text-sm text-muted-foreground transition-colors hover:bg-accent hover:text-accent-foreground pointer-coarse:min-h-11",
+                children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(lucideReact.FolderPlus, { className: "h-3.5 w-3.5" }),
+                  l.newFolder
+                ]
+              }
+            )
+          ] })
+        ]
+      }
+    )
+  ] });
+}
+function FilesFilterBar({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "files-filter-bar",
+      className: ui.cn("flex min-w-0 flex-1 flex-nowrap items-center gap-2", className),
+      ...props
+    }
+  );
+}
+function FilesTagsButton({
+  onClick,
+  label = "Tags",
+  className,
+  testId
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    ui.Button,
+    {
+      variant: "ghost",
+      size: "sm",
+      className: ui.cn("h-8 shrink-0 gap-1.5 px-2 font-normal pointer-coarse:h-11", className),
+      onClick,
+      "data-testid": chunkMHVNT4J3_cjs.testIdOr(testId, { testId: "filter-bar-tags-button" }),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.BookMarked, { className: "h-3.5 w-3.5" }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm max-[480px]:sr-only", children: label })
+      ]
+    }
+  );
+}
+function FilesViewCenter({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "files-view-center",
+      className: ui.cn("@container flex min-w-[9.5rem] flex-1 items-center gap-2", className),
+      ...props
+    }
+  );
+}
+function FilesModalFooter({ children, className }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "files-modal-footer",
+      className: ui.cn(
+        // Sticks to the bottom of the modal's scrolling body so Close is always reachable.
+        "sticky bottom-0 z-40 flex justify-end gap-2 border-t border-border bg-background px-4 py-3 sm:px-6",
+        className
+      ),
+      children
+    }
+  );
+}
+
+exports.DEFAULT_FOLDER_FILTER_LABELS = DEFAULT_FOLDER_FILTER_LABELS;
+exports.DEFAULT_FOLDER_PICKER_LABELS = DEFAULT_FOLDER_PICKER_LABELS;
+exports.FilesFilterBar = FilesFilterBar;
+exports.FilesModalFooter = FilesModalFooter;
+exports.FilesTagsButton = FilesTagsButton;
+exports.FilesViewCenter = FilesViewCenter;
+exports.FolderCommandList = FolderCommandList;
+exports.FolderFilterButton = FolderFilterButton;
+exports.FolderPickerRow = FolderPickerRow;
+exports.FolderTree = FolderTree;
+//# sourceMappingURL=chunk-O4YPVYPO.cjs.map
+//# sourceMappingURL=chunk-O4YPVYPO.cjs.map

package/dist/chunk-O4YPVYPO.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/files/FolderPicker.tsx","../src/files/bulk/FolderFilterButton.tsx","../src/files/page/FilesPageParts.tsx"],"names":["jsxs","cn","jsx","Minus","Check","Fragment","useState","useCallback","Command","CommandInput","CommandList","CommandEmpty","testIdOr","Plus","CommandGroup","CommandItem","FolderOpen","X","Popover","PopoverTrigger","Button","ChevronDown","PopoverContent","FolderPlus","BookMarked"],"mappings":"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","file":"chunk-O4YPVYPO.cjs","sourcesContent":["import { useCallback, useState } from 'react'\nimport type { ReactNode } from 'react'\nimport { Check, FolderOpen, Minus, Plus, X } from 'lucide-react'\nimport {\n  Command,\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem,\n  CommandList,\n  cn,\n} from '@arbidocs/react/ui'\nimport { testIdOr } from '../chat/test-id'\n\n/** Every fixed string of the folder pickers. Pass a partial `labels` to translate or reword. */\nexport interface FolderPickerLabels {\n  none: string\n  removeFromFolder: string\n  searchOrCreate: string\n  noFolders: string\n  create: (name: string) => string\n}\n\nexport const DEFAULT_FOLDER_PICKER_LABELS: FolderPickerLabels = {\n  none: 'None',\n  removeFromFolder: 'Remove from folder',\n  searchOrCreate: 'Search or create...',\n  noFolders: 'No folders yet',\n  create: (name) => `Create \\u201c${name}\\u201d`,\n}\n\nexport interface FolderCommandListTestIds {\n  create: string\n  createOption: string\n  remove: string\n  /** Replaces the whole `folder-picker-option-<folder>` id. */\n  option: (folder: string) => string\n}\n\n// ── Tree row ────────────────────────────────────────────────────────────────────────────────\n\nexport interface FolderPickerRowProps {\n  label: string\n  /** Optional leading glyph (e.g. a connector brand mark for provider roots). */\n  icon?: ReactNode\n  /** Shown at the right edge; omit for rows with nothing to count (e.g. an empty unread count). */\n  count?: number\n  depth: number\n  isActive: boolean\n  muted?: boolean\n  /** Test id of the row button (none by default). */\n  testId?: string\n  /**\n   * Draw a checkbox in the leading slot instead of the single-select tick. A list you can pick\n   * SEVERAL rows from should look like one: a lone tick reads \"this is the current one\", a box\n   * reads \"tick the ones you want\".\n   */\n  checkbox?: boolean\n  /** Checkbox only: some descendants are selected, so show a dash, not a tick. */\n  indeterminate?: boolean\n  onClick: () => void\n}\n\n/** One folder row: indented by depth, with a count. Whole row is the target (44px on touch). */\nexport function FolderPickerRow({\n  label,\n  icon,\n  count,\n  depth,\n  isActive,\n  muted,\n  checkbox,\n  indeterminate,\n  testId,\n  onClick,\n}: FolderPickerRowProps) {\n  return (\n    <button\n      type=\"button\"\n      data-testid={testId}\n      onClick={onClick}\n      // The row IS the checkbox: a real <Checkbox> inside this button would nest one interactive\n      // element in another and swallow the click. role + aria-checked carry the same meaning.\n      role={checkbox ? 'checkbox' : undefined}\n      aria-checked={checkbox ? (indeterminate ? 'mixed' : isActive) : undefined}\n      style={{ paddingLeft: `${4 + depth * 14}px` }}\n      className={cn(\n        // `[&:hover]:`, not `hover:`: the latter compiles behind `@media (hover: hover)`, so on a\n        // touchscreen whose PRIMARY pointer reports `hover: none` the row would never highlight\n        // even with a real mouse attached. The arbitrary selector has no media gate.\n        'flex w-full items-center gap-1 rounded-sm py-1 pr-2 text-sm transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring [&:hover]:bg-accent pointer-coarse:min-h-11',\n        isActive && 'bg-primary/10',\n        muted && !isActive && 'text-muted-foreground'\n      )}\n    >\n      <span className=\"flex w-4 shrink-0 items-center justify-center\">\n        {checkbox ? (\n          <span\n            className={cn(\n              'flex size-3.5 items-center justify-center rounded-[3px] border transition-colors',\n              isActive || indeterminate\n                ? 'border-primary bg-primary text-primary-foreground'\n                : 'border-muted-foreground/40'\n            )}\n          >\n            {indeterminate ? (\n              <Minus className=\"size-2.5\" />\n            ) : (\n              isActive && <Check className=\"size-2.5\" />\n            )}\n          </span>\n        ) : (\n          isActive && <Check className=\"size-3.5 text-primary\" />\n        )}\n      </span>\n      {icon}\n      {label !== '' && (\n        <span className={cn('min-w-0 truncate', isActive && 'font-semibold text-primary')}>\n          {label}\n        </span>\n      )}\n      {count !== undefined && (\n        <span className=\"ml-auto pl-2 text-sm font-semibold text-muted-foreground\">{count}</span>\n      )}\n    </button>\n  )\n}\n\n// ── Tree ────────────────────────────────────────────────────────────────────────────────────\n\nexport interface FolderTreeNode {\n  path: string\n  label: string\n  depth: number\n  count: number\n  /** Replaces the label's default look (provider roots show a brand mark). */\n  icon?: ReactNode\n}\n\nexport interface FolderTreeProps {\n  nodes: FolderTreeNode[]\n  unfiledCount: number\n  /** string = folder path selected, null = Unfiled selected, undefined = nothing selected. */\n  value: string | null | undefined\n  onChange: (folder: string | null) => void\n  /** Show the Unfiled (\"None\") row even when it is empty. */\n  showUnfiledAlways?: boolean\n  labels?: Partial<FolderPickerLabels>\n}\n\n/** Folder hierarchy with an Unfiled option at the bottom. No \"All\" row: callers add their own. */\nexport function FolderTree({\n  nodes,\n  unfiledCount,\n  value,\n  onChange,\n  showUnfiledAlways,\n  labels,\n}: FolderTreeProps) {\n  const l = { ...DEFAULT_FOLDER_PICKER_LABELS, ...labels }\n  return (\n    <div className=\"max-h-[240px] overflow-y-auto\">\n      {nodes.map((node) => (\n        <FolderPickerRow\n          key={node.path}\n          label={node.label}\n          icon={node.icon}\n          count={node.count}\n          depth={node.depth}\n          isActive={value === node.path}\n          onClick={() => onChange(node.path)}\n        />\n      ))}\n      {(unfiledCount > 0 || showUnfiledAlways) && (\n        <>\n          {nodes.length > 0 && <div className=\"my-1 border-t border-border\" />}\n          <FolderPickerRow\n            label={l.none}\n            count={unfiledCount}\n            depth={0}\n            isActive={value === null}\n            muted\n            onClick={() => onChange(null)}\n          />\n        </>\n      )}\n    </div>\n  )\n}\n\n// ── Searchable list ─────────────────────────────────────────────────────────────────────────\n\nfunction FolderBreadcrumb({ folder }: { folder: string }) {\n  const parts = folder.split('/')\n  return (\n    <span className=\"whitespace-nowrap\">\n      {parts.map((part, i) => (\n        <span key={i} className=\"inline-flex items-center gap-0.5\">\n          {i > 0 && <span className=\"mx-0.5 text-sm text-muted-foreground/50\">/</span>}\n          <span className={i < parts.length - 1 ? 'text-sm text-muted-foreground' : ''}>\n            {part}\n          </span>\n        </span>\n      ))}\n    </span>\n  )\n}\n\nexport interface FolderCommandListProps {\n  /** Existing folder paths (the host derives them from its documents). */\n  folders: string[]\n  /** Selected folder (null = unfiled, undefined = no selection). */\n  value?: string | null\n  /** A folder was picked or a new one created. */\n  onSelect: (folder: string | null) => void\n  /** Show the remove / move-to-root option. */\n  showRemove?: boolean\n  /** Wins over `labels.removeFromFolder`. */\n  removeLabel?: string\n  /** Wins over `labels.searchOrCreate`. */\n  placeholder?: string\n  autoFocus?: boolean\n  labels?: Partial<FolderPickerLabels>\n  /** Overrides for the test ids (defaults keep the current ids). */\n  testIds?: Partial<FolderCommandListTestIds>\n}\n\n/**\n * Searchable folder picker: filter existing folders, create one by typing a new name, optional\n * \"Remove from folder\". Shows hierarchy as breadcrumbs.\n */\nexport function FolderCommandList({\n  folders,\n  value,\n  onSelect,\n  showRemove = false,\n  removeLabel,\n  placeholder,\n  autoFocus = true,\n  labels,\n  testIds,\n}: FolderCommandListProps) {\n  const l = { ...DEFAULT_FOLDER_PICKER_LABELS, ...labels }\n  const [search, setSearch] = useState('')\n  const trimmed = search.trim()\n  const matchesExisting = folders.some((f) => f.toLowerCase() === trimmed.toLowerCase())\n\n  const handleCreate = useCallback(\n    (name: string) => {\n      const next = name.trim()\n      if (!next) return\n      onSelect(next)\n      setSearch('')\n    },\n    [onSelect]\n  )\n\n  return (\n    <Command shouldFilter={true}>\n      <CommandInput\n        placeholder={placeholder ?? l.searchOrCreate}\n        value={search}\n        onValueChange={setSearch}\n        autoFocus={autoFocus}\n        onKeyDown={(e) => {\n          if (e.key === 'Enter' && trimmed && !matchesExisting) {\n            e.preventDefault()\n            handleCreate(search)\n          }\n        }}\n      />\n      <CommandList>\n        <CommandEmpty>\n          {trimmed ? (\n            <button\n              type=\"button\"\n              data-testid={testIdOr(testIds?.create, { testId: 'folder-picker-create' })}\n              onClick={() => handleCreate(search)}\n              onPointerDown={(e) => e.preventDefault()}\n              className=\"flex w-full cursor-pointer items-center gap-1.5 rounded px-2 py-1.5 text-left text-sm text-primary hover:bg-accent pointer-coarse:min-h-11\"\n            >\n              <Plus className=\"size-3.5 shrink-0\" />\n              {l.create(trimmed)}\n            </button>\n          ) : (\n            <span className=\"text-muted-foreground\">{l.noFolders}</span>\n          )}\n        </CommandEmpty>\n        <CommandGroup>\n          {folders.map((folder) => (\n            <CommandItem\n              key={folder}\n              value={folder}\n              data-testid={testIdOr(testIds?.option?.(folder), {\n                testId: `folder-picker-option-${folder}`,\n              })}\n              onSelect={() => onSelect(folder)}\n              onPointerDown={(e) => e.preventDefault()}\n              className=\"cursor-pointer text-sm\"\n            >\n              <FolderOpen className=\"mr-1.5 size-3.5 flex-none shrink-0 text-yellow-text\" />\n              <FolderBreadcrumb folder={folder} />\n              {value === folder && (\n                <span className=\"ml-auto flex-none text-sm text-primary\">✓</span>\n              )}\n            </CommandItem>\n          ))}\n        </CommandGroup>\n\n        {trimmed && !matchesExisting && folders.length > 0 && (\n          <CommandGroup>\n            <CommandItem\n              value={`__create__${trimmed}`}\n              data-testid={testIdOr(testIds?.createOption, {\n                testId: 'folder-picker-create-option',\n              })}\n              onSelect={() => handleCreate(search)}\n              onPointerDown={(e) => e.preventDefault()}\n              className=\"cursor-pointer text-sm text-primary\"\n            >\n              <Plus className=\"mr-1.5 size-3.5 shrink-0\" />\n              <span>{l.create(trimmed)}</span>\n            </CommandItem>\n          </CommandGroup>\n        )}\n\n        {showRemove && (\n          <CommandGroup>\n            <CommandItem\n              value=\"__none__\"\n              data-testid={testIdOr(testIds?.remove, { testId: 'folder-picker-remove' })}\n              onSelect={() => onSelect(null)}\n              onPointerDown={(e) => e.preventDefault()}\n              className=\"cursor-pointer text-sm text-muted-foreground\"\n            >\n              <X className=\"mr-1 size-3.5 shrink-0\" />\n              <span>{removeLabel ?? l.removeFromFolder}</span>\n              {value === null && <span className=\"ml-auto flex-none text-sm text-primary\">✓</span>}\n            </CommandItem>\n          </CommandGroup>\n        )}\n      </CommandList>\n    </Command>\n  )\n}\n","import type { ReactNode } from 'react'\nimport { ChevronDown, FolderOpen, FolderPlus } from 'lucide-react'\nimport { Button, Popover, PopoverContent, PopoverTrigger, cn } from '@arbidocs/react/ui'\nimport { FolderPickerRow } from '../FolderPicker'\nimport { testIdOr } from '../../chat/test-id'\n\n/** Every fixed string of the folder filter. Pass a partial `labels` to translate or reword. */\nexport interface FolderFilterLabels {\n  all: string\n  newFolder: string\n}\n\nexport const DEFAULT_FOLDER_FILTER_LABELS: FolderFilterLabels = {\n  all: 'All',\n  newFolder: 'New folder',\n}\n\nexport interface FolderFilterButtonProps {\n  /** Text of the active folder (\"All\", \"None\", or the display path). */\n  label: string\n  /** Leading glyph for connector folders; falls back to a folder icon. */\n  icon?: ReactNode\n  /** A folder filter is active: the trigger takes the selection tint. */\n  isActive: boolean\n  open: boolean\n  onOpenChange: (open: boolean) => void\n  /** Total documents, shown on the \"All\" row. */\n  allCount?: number\n  /** When set, the popover starts with an \"All\" row; omit it for lists that have no \"All\". */\n  onSelectAll?: () => void\n  /** When set, the popover offers a \"New folder\" action. */\n  onNewFolder?: () => void\n  /** Slot: the folder tree picker. */\n  children: ReactNode\n  className?: string\n  labels?: Partial<FolderFilterLabels>\n  /** Test id of the trigger button (none by default). */\n  testId?: string\n  /** Overrides the \"New folder\" test id (default `explorer-new-folder`). */\n  newFolderTestId?: string\n}\n\n/**\n * The folder filter control: a ghost button naming the active folder that opens a popover with\n * an \"All\" row, the folder tree (slot) and an optional \"New folder\" action.\n */\nexport function FolderFilterButton({\n  label,\n  icon,\n  isActive,\n  open,\n  onOpenChange,\n  allCount,\n  onSelectAll,\n  onNewFolder,\n  children,\n  className,\n  labels,\n  testId,\n  newFolderTestId,\n}: FolderFilterButtonProps) {\n  const l = { ...DEFAULT_FOLDER_FILTER_LABELS, ...labels }\n  return (\n    <Popover open={open} onOpenChange={onOpenChange}>\n      <PopoverTrigger asChild>\n        <Button\n          variant=\"ghost\"\n          size=\"sm\"\n          data-slot=\"folder-filter-button\"\n          data-testid={testId}\n          className={cn(\n            'h-7 shrink-0 gap-1.5 px-2 text-sm font-normal pointer-coarse:h-10',\n            isActive && 'bg-accent font-medium text-accent-foreground',\n            className\n          )}\n        >\n          {icon ?? (\n            <FolderOpen\n              className={cn(\n                'h-3.5 w-3.5 shrink-0 text-muted-foreground',\n                isActive && 'fill-muted-foreground/30'\n              )}\n            />\n          )}\n          <span className=\"max-w-[280px] truncate\">{label}</span>\n          <ChevronDown className=\"h-4 w-4 text-foreground\" strokeWidth={2.5} />\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent\n        className=\"w-max min-w-56 max-w-[480px] p-1 shadow-lg\"\n        align=\"start\"\n        sideOffset={4}\n      >\n        {onSelectAll && (\n          <>\n            <FolderPickerRow\n              label={l.all}\n              count={allCount}\n              depth={0}\n              isActive={!isActive}\n              onClick={onSelectAll}\n            />\n            <div className=\"my-1 border-t border-border\" />\n          </>\n        )}\n        {children}\n        {onNewFolder && (\n          <>\n            <div className=\"my-1 border-t border-border\" />\n            <button\n              type=\"button\"\n              onClick={onNewFolder}\n              data-testid={testIdOr(newFolderTestId, { testId: 'explorer-new-folder' })}\n              className=\"flex w-full items-center gap-2 rounded-md px-2 py-1.5 text-sm text-muted-foreground transition-colors hover:bg-accent hover:text-accent-foreground pointer-coarse:min-h-11\"\n            >\n              <FolderPlus className=\"h-3.5 w-3.5\" />\n              {l.newFolder}\n            </button>\n          </>\n        )}\n      </PopoverContent>\n    </Popover>\n  )\n}\n","import type { ComponentProps, ReactNode } from 'react'\nimport { BookMarked } from 'lucide-react'\nimport { Button, cn } from '@arbidocs/react/ui'\nimport { testIdOr } from '../../chat/test-id'\n\n/** Row of controls that follows the tab: filter field, folder picker, tags button. */\nexport function FilesFilterBar({ className, ...props }: ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"files-filter-bar\"\n      className={cn('flex min-w-0 flex-1 flex-nowrap items-center gap-2', className)}\n      {...props}\n    />\n  )\n}\n\nexport interface FilesTagsButtonProps {\n  onClick: () => void\n  /** Button text (default \"Tags\"). */\n  label?: string\n  className?: string\n  /** Overrides the test id (default `filter-bar-tags-button`). */\n  testId?: string\n}\n\n/** Opens the labels / annotations vocabulary editor. The label collapses to sr-only on phones. */\nexport function FilesTagsButton({\n  onClick,\n  label = 'Tags',\n  className,\n  testId,\n}: FilesTagsButtonProps) {\n  return (\n    <Button\n      variant=\"ghost\"\n      size=\"sm\"\n      className={cn('h-8 shrink-0 gap-1.5 px-2 font-normal pointer-coarse:h-11', className)}\n      onClick={onClick}\n      data-testid={testIdOr(testId, { testId: 'filter-bar-tags-button' })}\n    >\n      <BookMarked className=\"h-3.5 w-3.5\" />\n      <span className=\"text-sm max-[480px]:sr-only\">{label}</span>\n    </Button>\n  )\n}\n\n/**\n * The view switch beside the page title. Marks a size container so the switch collapses its labels\n * to icons by the room it is given (not the viewport), and shrinks with the row.\n */\nexport function FilesViewCenter({ className, ...props }: ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"files-view-center\"\n      className={cn('@container flex min-w-[9.5rem] flex-1 items-center gap-2', className)}\n      {...props}\n    />\n  )\n}\n\nexport interface FilesModalFooterProps {\n  children?: ReactNode\n  className?: string\n}\n\n/** Footer row used when the page is hosted in a modal. */\nexport function FilesModalFooter({ children, className }: FilesModalFooterProps) {\n  return (\n    <div\n      data-slot=\"files-modal-footer\"\n      className={cn(\n        // Sticks to the bottom of the modal's scrolling body so Close is always reachable.\n        'sticky bottom-0 z-40 flex justify-end gap-2 border-t border-border bg-background px-4 py-3 sm:px-6',\n        className\n      )}\n    >\n      {children}\n    </div>\n  )\n}\n"]}