@canopy-iiif/app 0.7.16 → 0.7.18

package/lib/search/search.js

@@ -150,7 +150,6 @@ async function buildSearchPage() {
     head = rendered && rendered.head ? rendered.head : '';
     if (!body) throw new Error('Search: content/search/_layout.mdx produced empty output');
     const importMap = '';
-    const cssRel = path.relative(path.dirname(outPath), path.join(OUT_DIR, 'styles', 'styles.css')).split(path.sep).join('/');
     const jsAbs = path.join(OUT_DIR, 'scripts', 'search.js');
     let jsRel = path.relative(path.dirname(outPath), jsAbs).split(path.sep).join('/');
     let v = '';
@@ -166,7 +165,14 @@ async function buildSearchPage() {
       return rel;
     }
     const vendorTags = `<script src="${verRel(vendorReactAbs)}"></script><script src="${verRel(vendorFlexAbs)}"></script><script src="${verRel(vendorCommandAbs)}"></script>`;
-    let html = htmlShell({ title: 'Search', body, cssHref: cssRel || 'styles.css', scriptHref: jsRel, headExtra: vendorTags + head + importMap });
+    let headExtra = vendorTags + head + importMap;
+    try {
+      const { BASE_PATH } = require('../common');
+      if (BASE_PATH) {
+        headExtra = `<script>window.CANOPY_BASE_PATH=${JSON.stringify(BASE_PATH)}</script>` + headExtra;
+      }
+    } catch (_) {}
+    let html = htmlShell({ title: 'Search', body, cssHref: null, scriptHref: jsRel, headExtra });
     try { html = require('./common').applyBaseToHtml(html); } catch (_) {}
     await fsp.writeFile(outPath, html, 'utf8');
     console.log('Search: Built', path.relative(process.cwd(), outPath));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@canopy-iiif/app",
-  "version": "0.7.16",
+  "version": "0.7.18",
   "private": false,
   "license": "MIT",
   "author": "Mat Jordan <mat@northwestern.edu>",
@@ -14,14 +14,21 @@
     "./ui/styles/index.css": "./ui/styles/index.css",
     "./ui/canopy-iiif-plugin": "./ui/tailwind-canopy-iiif-plugin.js",
     "./ui/canopy-iiif-preset": "./ui/tailwind-canopy-iiif-preset.js",
-    "./lib/components/*": "./lib/components/*"
+    "./lib/components/*": "./lib/components/*",
+    "./head": "./lib/head.js",
+    "./orchestrator": {
+      "types": "./types/orchestrator.d.ts",
+      "require": "./lib/orchestrator.js",
+      "default": "./lib/orchestrator.js"
+    }
   },
   "files": [
     "lib/**",
     "ui/dist/**",
     "ui/styles/**",
     "ui/tailwind-canopy-iiif-plugin.js",
-    "ui/tailwind-canopy-iiif-preset.js"
+    "ui/tailwind-canopy-iiif-preset.js",
+    "types/**"
   ],
   "publishConfig": {
     "access": "public"

package/types/orchestrator.d.ts

@@ -0,0 +1,18 @@
+import type { ChildProcess } from 'node:child_process';
+
+export type Mode = 'build' | 'dev';
+
+export interface LibraryApi {
+  build?: () => Promise<void> | void;
+  dev?: () => Promise<void> | void;
+}
+
+export type NullableChildProcess = ChildProcess | null;
+
+export interface OrchestratorOptions {
+  argv?: string[];
+  env?: NodeJS.ProcessEnv;
+}
+
+export declare function orchestrate(options?: OrchestratorOptions): Promise<void>;
+export declare function verifyBuildOutput(outDir?: string): void;

package/ui/dist/index.mjs

@@ -377,40 +377,233 @@ function SearchResults({
 
 // ui/src/search/SearchTabs.jsx
 import React11 from "react";
-function SearchTabs({ type = "all", onTypeChange, types = [], counts = {} }) {
+function SearchTabs({
+  type = "all",
+  onTypeChange,
+  types = [],
+  counts = {},
+  onOpenFilters,
+  activeFilterCount = 0,
+  filtersLabel = "Filters",
+  filtersOpen = false
+}) {
   const orderedTypes = Array.isArray(types) ? types : [];
   const toLabel = (t) => t && t.length ? t.charAt(0).toUpperCase() + t.slice(1) : "";
-  return /* @__PURE__ */ React11.createElement("div", { role: "tablist", "aria-label": "Search types", className: "flex items-center gap-2 border-b border-slate-200" }, orderedTypes.map((t) => {
-    const active = String(type).toLowerCase() === String(t).toLowerCase();
-    const cRaw = counts && Object.prototype.hasOwnProperty.call(counts, t) ? counts[t] : void 0;
-    const c = Number.isFinite(Number(cRaw)) ? Number(cRaw) : 0;
-    return /* @__PURE__ */ React11.createElement(
+  const hasFilters = typeof onOpenFilters === "function";
+  const filterBadge = activeFilterCount > 0 ? ` (${activeFilterCount})` : "";
+  return /* @__PURE__ */ React11.createElement("div", { className: "flex flex-wrap items-center justify-between gap-3 border-b border-slate-200 pb-1" }, /* @__PURE__ */ React11.createElement(
+    "div",
+    {
+      role: "tablist",
+      "aria-label": "Search types",
+      className: "flex items-center gap-2"
+    },
+    orderedTypes.map((t) => {
+      const active = String(type).toLowerCase() === String(t).toLowerCase();
+      const cRaw = counts && Object.prototype.hasOwnProperty.call(counts, t) ? counts[t] : void 0;
+      const c = Number.isFinite(Number(cRaw)) ? Number(cRaw) : 0;
+      return /* @__PURE__ */ React11.createElement(
+        "button",
+        {
+          key: t,
+          role: "tab",
+          "aria-selected": active,
+          type: "button",
+          onClick: () => onTypeChange && onTypeChange(t),
+          className: "px-3 py-2 text-sm rounded-t-md border-b-2 -mb-px transition-colors " + (active ? "border-brand-600 text-brand-700" : "border-transparent text-slate-600 hover:text-slate-900 hover:border-slate-300")
+        },
+        toLabel(t),
+        " (",
+        c,
+        ")"
+      );
+    })
+  ), hasFilters ? /* @__PURE__ */ React11.createElement(
+    "button",
+    {
+      type: "button",
+      onClick: () => onOpenFilters && onOpenFilters(),
+      "aria-expanded": filtersOpen ? "true" : "false",
+      className: "inline-flex items-center gap-2 rounded-md border border-slate-200 bg-white px-3 py-1.5 text-sm font-medium text-slate-700 shadow-sm transition hover:border-brand-200 hover:bg-brand-50 hover:text-brand-700"
+    },
+    /* @__PURE__ */ React11.createElement("span", null, filtersLabel, filterBadge)
+  ) : null);
+}
+
+// ui/src/search/SearchFiltersDialog.jsx
+import React12 from "react";
+function toArray(input) {
+  if (!input) return [];
+  if (Array.isArray(input)) return input;
+  return [input];
+}
+function normalizeSelected(selected = {}) {
+  const map = /* @__PURE__ */ new Map();
+  if (selected && typeof selected === "object") {
+    Object.keys(selected).forEach((key) => {
+      const vals = new Set(toArray(selected[key]).map((v) => String(v)));
+      if (vals.size) map.set(String(key), vals);
+    });
+  }
+  return map;
+}
+function facetMatches(values = [], query) {
+  const q = String(query || "").trim().toLowerCase();
+  if (!q) return values;
+  const starts = [];
+  const contains = [];
+  values.forEach((entry) => {
+    if (!entry || !entry.value) return;
+    const value = String(entry.value);
+    const slug = String(entry.slug || entry.value || "");
+    const match = value.toLowerCase();
+    if (match.startsWith(q))
+      starts.push({ value, slug, doc_count: entry.doc_count });
+    else if (match.includes(q))
+      contains.push({ value, slug, doc_count: entry.doc_count });
+  });
+  return [...starts, ...contains].slice(0, 10);
+}
+function FacetSection({ facet, selected, onToggle }) {
+  if (!facet || !facet.label || !Array.isArray(facet.values)) return null;
+  const { label, slug, values } = facet;
+  const selectedValues = selected.get(String(slug)) || /* @__PURE__ */ new Set();
+  const checkboxId = (valueSlug) => `filter-${slug}-${valueSlug}`;
+  const hasSelection = selectedValues.size > 0;
+  const [quickQuery, setQuickQuery] = React12.useState("");
+  const hasQuery = quickQuery.trim().length > 0;
+  const filteredValues = React12.useMemo(
+    () => facetMatches(values, quickQuery),
+    [values, quickQuery]
+  );
+  return /* @__PURE__ */ React12.createElement(
+    "details",
+    {
+      className: "rounded-lg border border-slate-200 bg-slate-50",
+      open: hasSelection
+    },
+    /* @__PURE__ */ React12.createElement("summary", { className: "flex cursor-pointer items-center justify-between gap-3 px-4 py-3 text-sm font-medium text-slate-900" }, /* @__PURE__ */ React12.createElement("span", null, label), /* @__PURE__ */ React12.createElement("span", { className: "text-xs font-normal text-slate-500" }, values.length)),
+    /* @__PURE__ */ React12.createElement("div", { className: "max-h-60 overflow-y-auto border-t border-slate-200 bg-white px-4 py-3 text-sm text-slate-700" }, /* @__PURE__ */ React12.createElement("div", { className: "mb-3 flex items-center gap-2" }, /* @__PURE__ */ React12.createElement(
+      "input",
+      {
+        type: "search",
+        value: quickQuery,
+        onChange: (event) => setQuickQuery(event.target.value),
+        placeholder: "Search values",
+        className: "flex-1 rounded-md border border-slate-300 px-2 py-1 text-sm text-slate-700 focus:border-brand focus:outline-none focus:ring-1 focus:ring-brand",
+        "aria-label": `Filter ${label} values`
+      }
+    ), quickQuery ? /* @__PURE__ */ React12.createElement(
       "button",
       {
-        key: t,
-        role: "tab",
-        "aria-selected": active,
         type: "button",
-        onClick: () => onTypeChange && onTypeChange(t),
-        className: "px-3 py-1.5 text-sm rounded-t-md border-b-2 -mb-px transition-colors " + (active ? "border-brand-600 text-brand-700" : "border-transparent text-slate-600 hover:text-slate-900 hover:border-slate-300")
+        onClick: () => setQuickQuery(""),
+        className: "rounded-md border border-slate-200 px-2 py-1 text-xs text-slate-600 transition hover:bg-slate-100"
       },
-      toLabel(t),
-      " (",
-      c,
-      ")"
-    );
-  }));
+      "Clear"
+    ) : null), hasQuery && !filteredValues.length ? /* @__PURE__ */ React12.createElement("p", { className: "mb-3 text-xs text-slate-400" }, "No matches found.") : null, /* @__PURE__ */ React12.createElement("ul", { className: "space-y-2", style: { padding: 0 } }, filteredValues.map((entry) => {
+      const valueSlug = String(entry.slug || entry.value || "");
+      const isChecked = selectedValues.has(valueSlug);
+      const inputId = checkboxId(valueSlug);
+      return /* @__PURE__ */ React12.createElement("li", { key: valueSlug, className: "flex items-start gap-2" }, /* @__PURE__ */ React12.createElement(
+        "input",
+        {
+          id: inputId,
+          type: "checkbox",
+          className: "mt-1 h-4 w-4 rounded border-slate-300 text-brand focus:ring-brand",
+          checked: isChecked,
+          onChange: (event) => {
+            const nextChecked = !!event.target.checked;
+            if (onToggle) onToggle(slug, valueSlug, nextChecked);
+          }
+        }
+      ), /* @__PURE__ */ React12.createElement(
+        "label",
+        {
+          htmlFor: inputId,
+          className: "flex flex-1 flex-col gap-0.5"
+        },
+        /* @__PURE__ */ React12.createElement("span", null, entry.value, " ", Number.isFinite(entry.doc_count) ? /* @__PURE__ */ React12.createElement("span", { className: "text-xs text-slate-500" }, "(", entry.doc_count, ")") : null)
+      ));
+    }), !filteredValues.length && !hasQuery ? /* @__PURE__ */ React12.createElement("li", { className: "text-xs text-slate-400" }, "No values available.") : null))
+  );
+}
+function SearchFiltersDialog(props = {}) {
+  const {
+    open = false,
+    onOpenChange,
+    facets = [],
+    selected = {},
+    onToggle,
+    onClear,
+    title = "Filters",
+    subtitle = "Refine results by metadata"
+  } = props;
+  const selectedMap = normalizeSelected(selected);
+  const activeCount = Array.from(selectedMap.values()).reduce(
+    (total, set) => total + set.size,
+    0
+  );
+  if (!open) return null;
+  return /* @__PURE__ */ React12.createElement(
+    "div",
+    {
+      role: "dialog",
+      "aria-modal": "true",
+      className: "fixed inset-0 z-50 flex items-start justify-center bg-slate-900/50 px-4 py-8",
+      onClick: (event) => {
+        if (event.target === event.currentTarget && onOpenChange)
+          onOpenChange(false);
+      }
+    },
+    /* @__PURE__ */ React12.createElement("div", { className: "w-full max-w-3xl overflow-hidden rounded-xl bg-white shadow-2xl" }, /* @__PURE__ */ React12.createElement("header", { className: "flex items-start justify-between gap-4 border-b border-slate-200 px-6 py-4" }, /* @__PURE__ */ React12.createElement("div", null, /* @__PURE__ */ React12.createElement("h2", { className: "text-lg font-semibold text-slate-900" }, title), /* @__PURE__ */ React12.createElement("p", { className: "text-sm text-slate-500" }, subtitle)), /* @__PURE__ */ React12.createElement(
+      "button",
+      {
+        type: "button",
+        onClick: () => onOpenChange && onOpenChange(false),
+        className: "rounded-md border border-transparent px-2 py-1 text-sm text-slate-600 transition hover:bg-slate-100 hover:text-slate-900"
+      },
+      "Close"
+    )), /* @__PURE__ */ React12.createElement("div", { className: "grid gap-4 px-6 py-6" }, Array.isArray(facets) && facets.length ? /* @__PURE__ */ React12.createElement("div", { className: "space-y-3" }, facets.map((facet) => /* @__PURE__ */ React12.createElement(
+      FacetSection,
+      {
+        key: facet.slug || facet.label,
+        facet,
+        selected: selectedMap,
+        onToggle
+      }
+    ))) : /* @__PURE__ */ React12.createElement("p", { className: "text-sm text-slate-500" }, "No filters are available for this collection.")), /* @__PURE__ */ React12.createElement("footer", { className: "flex items-center justify-between gap-4 border-t border-slate-200 px-6 py-4" }, /* @__PURE__ */ React12.createElement("div", { className: "text-sm text-slate-500" }, activeCount ? `${activeCount} filter${activeCount === 1 ? "" : "s"} applied` : "No filters applied"), /* @__PURE__ */ React12.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React12.createElement(
+      "button",
+      {
+        type: "button",
+        onClick: () => {
+          if (onClear) onClear();
+        },
+        disabled: !activeCount,
+        className: "rounded-md border border-slate-200 px-3 py-1.5 text-sm text-slate-600 transition disabled:cursor-not-allowed disabled:text-slate-400 hover:bg-slate-100"
+      },
+      "Clear all"
+    ), /* @__PURE__ */ React12.createElement(
+      "button",
+      {
+        type: "button",
+        onClick: () => onOpenChange && onOpenChange(false),
+        className: "rounded-md bg-brand px-4 py-1.5 text-sm font-semibold text-white shadow-sm transition hover:bg-brand-700"
+      },
+      "Done"
+    ))))
+  );
 }
 
 // ui/src/command/MdxCommandPalette.jsx
-import React15 from "react";
+import React16 from "react";
 
 // ui/src/Icons.jsx
-import React12 from "react";
-var MagnifyingGlassIcon = (props) => /* @__PURE__ */ React12.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512", ...props }, /* @__PURE__ */ React12.createElement("path", { d: "M456.69 421.39L362.6 327.3a173.81 173.81 0 0034.84-104.58C397.44 126.38 319.06 48 222.72 48S48 126.38 48 222.72s78.38 174.72 174.72 174.72A173.81 173.81 0 00327.3 362.6l94.09 94.09a25 25 0 0035.3-35.3zM97.92 222.72a124.8 124.8 0 11124.8 124.8 124.95 124.95 0 01-124.8-124.8z" }));
+import React13 from "react";
+var MagnifyingGlassIcon = (props) => /* @__PURE__ */ React13.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512", ...props }, /* @__PURE__ */ React13.createElement("path", { d: "M456.69 421.39L362.6 327.3a173.81 173.81 0 0034.84-104.58C397.44 126.38 319.06 48 222.72 48S48 126.38 48 222.72s78.38 174.72 174.72 174.72A173.81 173.81 0 00327.3 362.6l94.09 94.09a25 25 0 0035.3-35.3zM97.92 222.72a124.8 124.8 0 11124.8 124.8 124.95 124.95 0 01-124.8-124.8z" }));
 
 // ui/src/search/SearchPanelForm.jsx
-import React13 from "react";
+import React14 from "react";
 function readBasePath() {
   const normalize = (val) => {
     const raw = typeof val === "string" ? val.trim() : "";
@@ -468,14 +661,42 @@ function SearchPanelForm(props = {}) {
     placeholder = "Search\u2026",
     buttonLabel = "Search",
     label,
-    searchPath = "/search"
+    searchPath = "/search",
+    inputId: inputIdProp
   } = props || {};
   const text = typeof label === "string" && label.trim() ? label.trim() : buttonLabel;
-  const action = React13.useMemo(
+  const action = React14.useMemo(
     () => resolveSearchPath(searchPath),
     [searchPath]
   );
-  return /* @__PURE__ */ React13.createElement(
+  const autoId = typeof React14.useId === "function" ? React14.useId() : void 0;
+  const [fallbackId] = React14.useState(
+    () => `canopy-cmdk-${Math.random().toString(36).slice(2, 10)}`
+  );
+  const inputId = inputIdProp || autoId || fallbackId;
+  const inputRef = React14.useRef(null);
+  const focusInput = React14.useCallback(() => {
+    const el = inputRef.current;
+    if (!el) return;
+    if (document.activeElement === el) return;
+    try {
+      el.focus({ preventScroll: true });
+    } catch (_) {
+      try {
+        el.focus();
+      } catch (_2) {
+      }
+    }
+  }, []);
+  const handlePointerDown = React14.useCallback((event) => {
+    const target = event.target;
+    if (target && typeof target.closest === "function") {
+      if (target.closest("[data-canopy-command-trigger]")) return;
+    }
+    event.preventDefault();
+    focusInput();
+  }, [focusInput]);
+  return /* @__PURE__ */ React14.createElement(
     "form",
     {
       action,
@@ -483,36 +704,47 @@ function SearchPanelForm(props = {}) {
       role: "search",
       autoComplete: "off",
       spellCheck: "false",
-      className: "group flex items-center gap-2 px-2 py-1.5 rounded-lg border border-slate-300 bg-white/95 backdrop-blur text-slate-700 shadow-sm hover:shadow transition w-full focus-within:ring-2 focus-within:ring-brand-500"
+      className: "group flex items-center gap-2 rounded-lg border border-slate-300 text-slate-700 shadow-sm transition focus-within:ring-2 focus-within:ring-brand-500 canopy-cmdk-form",
+      onPointerDown: handlePointerDown,
+      "data-placeholder": placeholder || ""
     },
-    /* @__PURE__ */ React13.createElement(MagnifyingGlassIcon, { className: "w-5 h-5 text-slate-400 group-focus-within:text-brand-500" }),
-    /* @__PURE__ */ React13.createElement(
-      "input",
+    /* @__PURE__ */ React14.createElement(
+      "label",
       {
-        type: "search",
-        name: "q",
-        inputMode: "search",
-        "data-canopy-command-input": true,
-        placeholder,
-        className: "flex-1 bg-transparent outline-none placeholder:text-slate-400 py-0.5 min-w-0",
-        "aria-label": "Search"
-      }
+        htmlFor: inputId,
+        className: "flex items-center gap-2 flex-1 min-w-0 cursor-text canopy-cmdk-label"
+      },
+      /* @__PURE__ */ React14.createElement(MagnifyingGlassIcon, { className: "w-5 h-5 text-slate-400 group-focus-within:text-brand-500 pointer-events-none" }),
+      /* @__PURE__ */ React14.createElement(
+        "input",
+        {
+          id: inputId,
+          type: "search",
+          name: "q",
+          inputMode: "search",
+          "data-canopy-command-input": true,
+          placeholder,
+          className: "flex-1 bg-transparent outline-none placeholder:text-slate-400 py-1 min-w-0",
+          "aria-label": "Search",
+          ref: inputRef
+        }
+      )
     ),
-    /* @__PURE__ */ React13.createElement(
+    /* @__PURE__ */ React14.createElement(
       "button",
       {
-        type: "button",
-        "data-canopy-command-trigger": true,
+        type: "submit",
+        "data-canopy-command-trigger": "submit",
         className: "inline-flex items-center gap-2 rounded-md border border-transparent bg-brand px-2 py-1 text-sm font-medium text-white shadow-sm transition hover:bg-brand-700 focus:outline-none focus-visible:ring-2 focus-visible:ring-brand focus-visible:ring-offset-2"
       },
-      /* @__PURE__ */ React13.createElement("span", null, text),
-      /* @__PURE__ */ React13.createElement("span", { "aria-hidden": true, className: "hidden sm:inline-flex items-center gap-1 rounded border border-white/40 bg-white/20 px-1.5 py-0.5 text-xs font-semibold" }, /* @__PURE__ */ React13.createElement("span", null, "\u2318"), /* @__PURE__ */ React13.createElement("span", null, "K"))
+      /* @__PURE__ */ React14.createElement("span", null, text),
+      /* @__PURE__ */ React14.createElement("span", { "aria-hidden": true, className: "hidden sm:inline-flex items-center gap-1 text-xs font-semibold canopy-cmdk-shortcut" }, /* @__PURE__ */ React14.createElement("span", null, "\u2318"), /* @__PURE__ */ React14.createElement("span", null, "K"))
     )
   );
 }
 
 // ui/src/search/SearchPanelTeaserResults.jsx
-import React14 from "react";
+import React15 from "react";
 function SearchPanelTeaserResults(props = {}) {
   const { style } = props || {};
   const baseStyle = {
@@ -529,7 +761,7 @@ function SearchPanelTeaserResults(props = {}) {
     overflow: "auto",
     maxHeight: "60vh"
   };
-  return /* @__PURE__ */ React14.createElement("div", { "data-canopy-command-panel": true, style: { ...baseStyle, ...style || {} } }, /* @__PURE__ */ React14.createElement("div", { id: "cplist" }));
+  return /* @__PURE__ */ React15.createElement("div", { "data-canopy-command-panel": true, style: { ...baseStyle, ...style || {} } }, /* @__PURE__ */ React15.createElement("div", { id: "cplist" }));
 }
 
 // ui/src/command/MdxCommandPalette.jsx
@@ -548,17 +780,17 @@ function MdxCommandPalette(props = {}) {
   const text = typeof label === "string" && label.trim() ? label.trim() : buttonLabel;
   const resolvedSearchPath = resolveSearchPath(searchPath);
   const data = { placeholder, hotkey, maxResults, groupOrder, label: text, searchPath: resolvedSearchPath };
-  return /* @__PURE__ */ React15.createElement("div", { "data-canopy-command": true, className: "flex-1 min-w-0" }, /* @__PURE__ */ React15.createElement("div", { className: "relative w-full" }, /* @__PURE__ */ React15.createElement("style", null, `.relative[data-canopy-panel-auto='1']:focus-within [data-canopy-command-panel]{display:block}`), /* @__PURE__ */ React15.createElement(SearchPanelForm, { placeholder, buttonLabel, label, searchPath: resolvedSearchPath }), /* @__PURE__ */ React15.createElement(SearchPanelTeaserResults, null)), /* @__PURE__ */ React15.createElement("script", { type: "application/json", dangerouslySetInnerHTML: { __html: JSON.stringify(data) } }));
+  return /* @__PURE__ */ React16.createElement("div", { "data-canopy-command": true, className: "flex-1 min-w-0" }, /* @__PURE__ */ React16.createElement("div", { className: "relative w-full" }, /* @__PURE__ */ React16.createElement("style", null, `.relative[data-canopy-panel-auto='1']:focus-within [data-canopy-command-panel]{display:block}`), /* @__PURE__ */ React16.createElement(SearchPanelForm, { placeholder, buttonLabel, label, searchPath: resolvedSearchPath }), /* @__PURE__ */ React16.createElement(SearchPanelTeaserResults, null)), /* @__PURE__ */ React16.createElement("script", { type: "application/json", dangerouslySetInnerHTML: { __html: JSON.stringify(data) } }));
 }
 
 // ui/src/search/SearchPanel.jsx
-import React16 from "react";
+import React17 from "react";
 function SearchPanel(props = {}) {
   const {
     placeholder = "Search\u2026",
     hotkey = "mod+k",
     maxResults = 8,
-    groupOrder = ["work", "page"],
+    groupOrder = ["work", "docs", "page"],
     // Kept for backward compat; form always renders submit
     button = true,
     // eslint-disable-line no-unused-vars
@@ -569,7 +801,7 @@ function SearchPanel(props = {}) {
   const text = typeof label === "string" && label.trim() ? label.trim() : buttonLabel;
   const resolvedSearchPath = resolveSearchPath(searchPath);
   const data = { placeholder, hotkey, maxResults, groupOrder, label: text, searchPath: resolvedSearchPath };
-  return /* @__PURE__ */ React16.createElement("div", { "data-canopy-command": true, className: "flex-1 min-w-0" }, /* @__PURE__ */ React16.createElement("div", { className: "relative w-full" }, /* @__PURE__ */ React16.createElement("style", null, `.relative[data-canopy-panel-auto='1']:focus-within [data-canopy-command-panel]{display:block}`), /* @__PURE__ */ React16.createElement(SearchPanelForm, { placeholder, buttonLabel, label, searchPath: resolvedSearchPath }), /* @__PURE__ */ React16.createElement(SearchPanelTeaserResults, null)), /* @__PURE__ */ React16.createElement("script", { type: "application/json", dangerouslySetInnerHTML: { __html: JSON.stringify(data) } }));
+  return /* @__PURE__ */ React17.createElement("div", { "data-canopy-command": true, className: "flex-1 min-w-0" }, /* @__PURE__ */ React17.createElement("div", { className: "relative w-full" }, /* @__PURE__ */ React17.createElement("style", null, `.relative[data-canopy-panel-auto='1']:focus-within [data-canopy-command-panel]{display:block}`), /* @__PURE__ */ React17.createElement(SearchPanelForm, { placeholder, buttonLabel, label, searchPath: resolvedSearchPath }), /* @__PURE__ */ React17.createElement(SearchPanelTeaserResults, null)), /* @__PURE__ */ React17.createElement("script", { type: "application/json", dangerouslySetInnerHTML: { __html: JSON.stringify(data) } }));
 }
 export {
   Card,
@@ -578,6 +810,7 @@ export {
   GridItem,
   HelloWorld,
   MdxRelatedItems as RelatedItems,
+  SearchFiltersDialog,
   SearchPanel,
   SearchPanelForm,
   SearchPanelTeaserResults,