@mintlify/components 1.0.3 → 1.0.4

package/dist/components/index.d.ts

@@ -12,6 +12,7 @@ export * from './icon';
 export * from './mermaid';
 export * from './panel';
 export * from './property';
+export * from './search';
 export * from './steps';
 export * from './tabs';
 export * from './tile';

package/dist/components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC;AAC1B,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC;AAC1B,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC"}

package/dist/components/search/button.d.ts

@@ -0,0 +1,12 @@
+import { ButtonHTMLAttributes } from 'react';
+type SearchButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {
+    showShortcut?: boolean;
+    shortcutText?: string;
+};
+declare const SearchButton: import('react').ForwardRefExoticComponent<ButtonHTMLAttributes<HTMLButtonElement> & {
+    showShortcut?: boolean;
+    shortcutText?: string;
+} & import('react').RefAttributes<HTMLButtonElement>>;
+export type { SearchButtonProps };
+export { SearchButton };
+//# sourceMappingURL=button.d.ts.map

package/dist/components/search/button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/components/search/button.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,oBAAoB,EAAc,MAAM,OAAO,CAAC;AAI9D,KAAK,iBAAiB,GAAG,oBAAoB,CAAC,iBAAiB,CAAC,GAAG;IACjE,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AAEF,QAAA,MAAM,YAAY;mBAJD,OAAO;mBACP,MAAM;qDAsDtB,CAAC;AAIF,YAAY,EAAE,iBAAiB,EAAE,CAAC;AAClC,OAAO,EAAE,YAAY,EAAE,CAAC"}

package/dist/components/search/button.js

@@ -0,0 +1,53 @@
+import { jsxs as f, jsx as r } from "react/jsx-runtime";
+import { forwardRef as x } from "react";
+import { cn as l } from "../../utils/cn.js";
+import { useSearch as p } from "./provider.js";
+import u from "../../node_modules/.pnpm/lucide-react@0.453.0_react@18.3.1/node_modules/lucide-react/dist/esm/icons/search.js";
+const b = x(
+  ({
+    showShortcut: o = !0,
+    shortcutText: s = "⌘K",
+    className: n,
+    children: a,
+    onClick: e,
+    ...d
+  }, i) => {
+    const t = p(), m = (c) => {
+      t == null || t.open(), e == null || e(c);
+    };
+    return /* @__PURE__ */ f(
+      "button",
+      {
+        className: l(
+          "flex w-full items-center gap-2 px-3 py-2 text-left text-sm",
+          "bg-white dark:bg-stone-900",
+          "border border-stone-200 dark:border-stone-700",
+          "rounded-xl",
+          "hover:bg-stone-50 dark:hover:bg-stone-800",
+          "focus:outline-none focus:ring-2 focus:ring-stone-400 dark:focus:ring-stone-600",
+          "transition-colors",
+          n
+        ),
+        onClick: m,
+        ref: i,
+        type: "button",
+        ...d,
+        children: [
+          /* @__PURE__ */ r(
+            u,
+            {
+              className: "shrink-0 text-stone-400 dark:text-stone-500",
+              size: 16
+            }
+          ),
+          /* @__PURE__ */ r("span", { className: "flex-1 text-stone-500 dark:text-stone-400", children: a || "Search..." }),
+          o && /* @__PURE__ */ r("kbd", { className: "hidden items-center gap-0.5 rounded border border-stone-200 bg-stone-100 px-1.5 py-0.5 font-medium font-sans text-stone-500 text-xs sm:inline-flex dark:border-stone-700 dark:bg-stone-800 dark:text-stone-400", children: s })
+        ]
+      }
+    );
+  }
+);
+b.displayName = "SearchButton";
+export {
+  b as SearchButton
+};

package/dist/components/search/index.d.ts

@@ -0,0 +1,7 @@
+export type { SearchButtonProps } from './button';
+export { SearchButton } from './button';
+export type { SearchContextValue, SearchProviderProps, } from './provider';
+export { SearchProvider, useSearch } from './provider';
+export type { SearchProps, SearchResult } from './search';
+export { Search } from './search';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/search/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/search/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAClD,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AACxC,YAAY,EACV,kBAAkB,EAClB,mBAAmB,GACpB,MAAM,YAAY,CAAC;AACpB,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AACvD,YAAY,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAC1D,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC"}

package/dist/components/search/provider.d.ts

@@ -0,0 +1,19 @@
+import { ReactNode } from 'react';
+import { SearchProps } from './search';
+type SearchContextValue = {
+    isOpen: boolean;
+    open: () => void;
+    close: () => void;
+    toggle: () => void;
+};
+type SearchProviderProps = {
+    children: ReactNode;
+    shortcutKey?: string;
+    requireModifier?: boolean;
+    searchProps: Omit<SearchProps, "isOpen" | "onClose">;
+};
+declare const SearchProvider: ({ children, shortcutKey, requireModifier, searchProps, }: SearchProviderProps) => import("react/jsx-runtime").JSX.Element;
+declare const useSearch: () => SearchContextValue | null;
+export type { SearchContextValue, SearchProviderProps };
+export { SearchProvider, useSearch };
+//# sourceMappingURL=provider.d.ts.map

package/dist/components/search/provider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"provider.d.ts","sourceRoot":"","sources":["../../../src/components/search/provider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,SAAS,EAKf,MAAM,OAAO,CAAC;AACf,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC;AAEpD,KAAK,kBAAkB,GAAG;IACxB,MAAM,EAAE,OAAO,CAAC;IAChB,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB,CAAC;AAIF,KAAK,mBAAmB,GAAG;IACzB,QAAQ,EAAE,SAAS,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,WAAW,EAAE,IAAI,CAAC,WAAW,EAAE,QAAQ,GAAG,SAAS,CAAC,CAAC;CACtD,CAAC;AAEF,QAAA,MAAM,cAAc,GAAI,0DAKrB,mBAAmB,4CA2CrB,CAAC;AAEF,QAAA,MAAM,SAAS,iCAEd,CAAC;AAEF,YAAY,EAAE,kBAAkB,EAAE,mBAAmB,EAAE,CAAC;AACxD,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,CAAC"}

package/dist/components/search/provider.js

@@ -0,0 +1,32 @@
+import { jsxs as g, jsx as C } from "react/jsx-runtime";
+import { useState as p, useCallback as a, useEffect as E, createContext as v, useContext as h } from "react";
+import { Search as k } from "./search.js";
+const u = v(null), b = ({
+  children: f,
+  shortcutKey: o = "k",
+  requireModifier: i = !0,
+  searchProps: m
+}) => {
+  const [c, r] = p(!1), w = a(() => r(!0), []), l = a(() => r(!1), []), n = a(() => r((t) => !t), []);
+  return E(() => {
+    const t = (e) => {
+      const d = e.metaKey || e.ctrlKey;
+      if (i ? d && e.key.toLowerCase() === o.toLowerCase() : e.key.toLowerCase() === o.toLowerCase()) {
+        if (!d) {
+          const s = e.target;
+          if (s.tagName === "INPUT" || s.tagName === "TEXTAREA" || s.isContentEditable)
+            return;
+        }
+        e.preventDefault(), n();
+      }
+    };
+    return window.addEventListener("keydown", t), () => window.removeEventListener("keydown", t);
+  }, [o, i, n]), /* @__PURE__ */ g(u.Provider, { value: { isOpen: c, open: w, close: l, toggle: n }, children: [
+    f,
+    /* @__PURE__ */ C(k, { ...m, isOpen: c, onClose: l })
+  ] });
+}, P = () => h(u);
+export {
+  b as SearchProvider,
+  P as useSearch
+};

package/dist/components/search/search.d.ts

@@ -0,0 +1,36 @@
+import { ReactNode } from 'react';
+type SearchResult = {
+    id: string;
+    header: string;
+    content: string;
+    link: string;
+    metadata?: {
+        breadcrumbs?: string[];
+        [key: string]: unknown;
+    };
+};
+type SearchProps = {
+    onSearch: (query: string) => void;
+    results: SearchResult[];
+    isOpen: boolean;
+    onClose: () => void;
+    isLoading?: boolean;
+    placeholder?: string;
+    recentSearches?: SearchResult[];
+    onSelectResult?: (result: SearchResult, query: string) => void;
+    className?: string;
+    emptyState?: ReactNode;
+    loadingState?: ReactNode;
+    position?: "top" | "center";
+};
+type SearchHitProps = {
+    isActive: boolean;
+    header: string;
+    description: string;
+    metadata?: SearchResult["metadata"];
+};
+declare const SearchHit: ({ isActive, header, description, metadata, }: SearchHitProps) => import("react/jsx-runtime").JSX.Element;
+declare const Search: import('react').ForwardRefExoticComponent<SearchProps & import('react').RefAttributes<HTMLInputElement>>;
+export type { SearchResult, SearchProps };
+export { Search, SearchHit };
+//# sourceMappingURL=search.d.ts.map

package/dist/components/search/search.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"search.d.ts","sourceRoot":"","sources":["../../../src/components/search/search.tsx"],"names":[],"mappings":"AAWA,OAAO,EAGL,KAAK,SAAS,EAOf,MAAM,OAAO,CAAC;AAGf,KAAK,YAAY,GAAG;IAClB,EAAE,EAAE,MAAM,CAAC;IACX,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE;QACT,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;QACvB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;KACxB,CAAC;CACH,CAAC;AAEF,KAAK,WAAW,GAAG;IACjB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,cAAc,CAAC,EAAE,YAAY,EAAE,CAAC;IAChC,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,YAAY,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,QAAQ,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC;CAC7B,CAAC;AAEF,KAAK,cAAc,GAAG;IACpB,QAAQ,EAAE,OAAO,CAAC;IAClB,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,YAAY,CAAC,UAAU,CAAC,CAAC;CACrC,CAAC;AAEF,QAAA,MAAM,SAAS,GAAI,8CAKhB,cAAc,4CA6BhB,CAAC;AAEF,QAAA,MAAM,MAAM,0GAyRX,CAAC;AAIF,YAAY,EAAE,YAAY,EAAE,WAAW,EAAE,CAAC;AAC1C,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC"}

package/dist/components/search/search.js

@@ -0,0 +1,253 @@
+import { jsxs as n, jsx as t, Fragment as g } from "react/jsx-runtime";
+import { forwardRef as q, useState as N, useRef as G, useImperativeHandle as M, useEffect as O, useCallback as x, useMemo as b, Fragment as f } from "react";
+import { cn as d } from "../../utils/cn.js";
+import { Combobox as P, ComboboxInput as X, ComboboxOptions as B, ComboboxOption as T } from "../../node_modules/.pnpm/@headlessui_react@2.2.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@headlessui/react/dist/components/combobox/combobox.js";
+import J from "../../node_modules/.pnpm/lucide-react@0.453.0_react@18.3.1/node_modules/lucide-react/dist/esm/icons/search.js";
+import U from "../../node_modules/.pnpm/lucide-react@0.453.0_react@18.3.1/node_modules/lucide-react/dist/esm/icons/loader-circle.js";
+import V from "../../node_modules/.pnpm/lucide-react@0.453.0_react@18.3.1/node_modules/lucide-react/dist/esm/icons/search-x.js";
+import { Transition as W, TransitionChild as C } from "../../node_modules/.pnpm/@headlessui_react@2.2.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@headlessui/react/dist/components/transition/transition.js";
+import { Dialog as Y, DialogPanel as Z } from "../../node_modules/.pnpm/@headlessui_react@2.2.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@headlessui/react/dist/components/dialog/dialog.js";
+const F = ({
+  isActive: m,
+  header: r,
+  description: c,
+  metadata: o
+}) => /* @__PURE__ */ n(
+  "div",
+  {
+    className: d(
+      "flex w-full cursor-pointer flex-col gap-1 rounded-md px-2.5 py-2 transition-colors",
+      m && "bg-stone-100 dark:bg-white/5"
+    ),
+    children: [
+      (o == null ? void 0 : o.breadcrumbs) && o.breadcrumbs.length > 0 && /* @__PURE__ */ t("div", { className: "flex items-center gap-1 truncate text-stone-500 text-xs dark:text-stone-400", children: o.breadcrumbs.map((s, h) => (
+        // biome-ignore lint/suspicious/noArrayIndexKey: Breadcrumbs are positional and may contain duplicates
+        /* @__PURE__ */ n(f, { children: [
+          h > 0 && /* @__PURE__ */ t("span", { className: "text-stone-400", children: " > " }),
+          /* @__PURE__ */ t("span", { className: "truncate", children: s })
+        ] }, h)
+      )) }),
+      /* @__PURE__ */ t("div", { className: "truncate font-medium text-sm text-stone-900 dark:text-white", children: r }),
+      c && /* @__PURE__ */ t("div", { className: "line-clamp-2 text-sm text-stone-600 dark:text-stone-400", children: c })
+    ]
+  }
+), _ = q(
+  ({
+    onSearch: m,
+    results: r,
+    isOpen: c,
+    onClose: o,
+    isLoading: s = !1,
+    placeholder: h = "Search...",
+    recentSearches: l = [],
+    onSelectResult: p,
+    className: j,
+    emptyState: z,
+    loadingState: S,
+    position: D = "top"
+  }, E) => {
+    const [a, y] = N(""), [v, k] = N(!1), w = G(null);
+    M(E, () => w.current), O(() => {
+      c || (y(""), k(!1));
+    }, [c]);
+    const K = x(
+      (e) => {
+        y(e), m(e);
+      },
+      [m]
+    ), u = x(
+      (e) => {
+        e && (p == null || p(e, a), o());
+      },
+      [p, a, o]
+    ), H = x(
+      (e) => {
+        if (e.key === "Escape") {
+          e.preventDefault(), o();
+          return;
+        }
+        if (e.key === "Tab" && (r.length > 0 || l.length > 0) && (e.preventDefault(), e.currentTarget.setSelectionRange(
+          e.currentTarget.value.length,
+          e.currentTarget.value.length
+        )), e.key === "Enter" && (e.metaKey || e.ctrlKey) && a && r.length > 0 && !s) {
+          const i = r[0];
+          i && u(i);
+        }
+      },
+      [r, l, u, o, a, s]
+    ), I = x((e) => {
+      k(e.currentTarget.scrollTop > 0);
+    }, []), R = b(
+      () => !a && l.length > 0 && r.length === 0,
+      [a, l.length, r.length]
+    ), A = b(
+      () => a && r.length > 0 && !s,
+      [a, r.length, s]
+    ), Q = b(
+      () => a && !s && r.length === 0,
+      [a, s, r.length]
+    ), $ = /* @__PURE__ */ n(
+      P,
+      {
+        onChange: (e) => {
+          e && u(e);
+        },
+        value: null,
+        children: [
+          /* @__PURE__ */ n(
+            "div",
+            {
+              className: d(
+                "relative z-10 h-14 border-transparent border-b p-1.5 transition",
+                v && "border-stone-200 dark:border-white/10"
+              ),
+              children: [
+                /* @__PURE__ */ t(
+                  X,
+                  {
+                    autoComplete: "off",
+                    autoFocus: !0,
+                    className: d(
+                      "peer h-full w-full rounded-md bg-white pr-14 pl-11 text-stone-950 tracking-tight shadow-sm outline-none ring ring-black/5 transition placeholder:text-stone-400 focus:ring-black/90 dark:bg-stone-900 dark:text-white dark:focus:ring-white placeholder:dark:text-white/50",
+                      "[&::-webkit-search-cancel-button]:appearance-none [&::-webkit-search-decoration]:appearance-none",
+                      !v && a && "shadow-lg"
+                    ),
+                    onChange: (e) => K(e.target.value),
+                    onKeyDown: H,
+                    placeholder: h,
+                    ref: w,
+                    type: "search",
+                    value: a
+                  }
+                ),
+                /* @__PURE__ */ t(
+                  J,
+                  {
+                    className: "absolute top-1/2 left-5 -translate-y-1/2 text-stone-950 opacity-50 peer-focus:opacity-100 dark:text-white",
+                    size: 18
+                  }
+                ),
+                a && /* @__PURE__ */ t("div", { className: "absolute top-1/2 right-6 flex -translate-y-1/2 items-center justify-center gap-1 rounded-md bg-stone-950/5 px-1.5 py-1.5 font-medium text-xs text-zinc-950/70 leading-[9px] dark:bg-white/5 dark:text-white/70", children: "ESC" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ n(
+            B,
+            {
+              className: "mx-1.5 max-h-[calc(100vh-10rem)] overflow-y-auto",
+              onScroll: I,
+              static: !0,
+              children: [
+                R && /* @__PURE__ */ n(g, { children: [
+                  /* @__PURE__ */ t("div", { className: "flex items-center justify-between px-2.5 py-2", children: /* @__PURE__ */ t("span", { className: "truncate text-sm text-stone-500", children: "Recent searches" }) }),
+                  l.map((e) => /* @__PURE__ */ t(
+                    T,
+                    {
+                      className: "last:mb-1.5",
+                      value: e,
+                      children: ({ focus: i }) => /* @__PURE__ */ t(
+                        F,
+                        {
+                          description: e.content,
+                          header: e.header,
+                          isActive: i,
+                          metadata: e.metadata
+                        }
+                      )
+                    },
+                    e.id
+                  ))
+                ] }),
+                A && r.map((e) => /* @__PURE__ */ t(
+                  T,
+                  {
+                    className: "last:mb-1.5",
+                    value: e,
+                    children: ({ focus: i }) => /* @__PURE__ */ t(
+                      F,
+                      {
+                        description: e.content,
+                        header: e.header,
+                        isActive: i,
+                        metadata: e.metadata
+                      }
+                    )
+                  },
+                  e.id
+                )),
+                s && a && /* @__PURE__ */ t("div", { className: "flex flex-col items-center justify-center gap-3 px-2.5 py-12", children: S || /* @__PURE__ */ n(g, { children: [
+                  /* @__PURE__ */ t(U, { className: "size-6 animate-spin text-stone-400 dark:text-stone-500" }),
+                  /* @__PURE__ */ n("div", { className: "text-center", children: [
+                    /* @__PURE__ */ t("p", { className: "font-medium text-sm text-stone-700 dark:text-stone-300", children: "Searching..." }),
+                    /* @__PURE__ */ n("p", { className: "mt-1 text-stone-500 text-xs dark:text-stone-400", children: [
+                      'Finding results for "',
+                      a,
+                      '"'
+                    ] })
+                  ] })
+                ] }) }),
+                Q && /* @__PURE__ */ t("div", { className: "flex flex-col items-center justify-center gap-3 px-2.5 py-12", children: z || /* @__PURE__ */ n(g, { children: [
+                  /* @__PURE__ */ t(V, { className: "size-6 text-stone-300 dark:text-stone-600" }),
+                  /* @__PURE__ */ n("div", { className: "text-center", children: [
+                    /* @__PURE__ */ t("p", { className: "font-medium text-sm text-stone-700 dark:text-stone-300", children: "No results found" }),
+                    /* @__PURE__ */ t("p", { className: "mt-1 text-stone-500 text-xs dark:text-stone-400", children: "Try searching with different keywords" })
+                  ] })
+                ] }) })
+              ]
+            }
+          )
+        ]
+      }
+    );
+    return /* @__PURE__ */ t(W, { appear: !0, as: f, show: c, children: /* @__PURE__ */ n(
+      Y,
+      {
+        as: "div",
+        className: d("relative z-50", j),
+        onClose: o,
+        children: [
+          /* @__PURE__ */ t(
+            C,
+            {
+              as: f,
+              enter: "ease-out duration-100",
+              enterFrom: "opacity-0",
+              enterTo: "opacity-100",
+              leave: "ease-in duration-50",
+              leaveFrom: "opacity-100",
+              leaveTo: "opacity-0",
+              children: /* @__PURE__ */ t("div", { className: "fixed inset-0 bg-black/20 backdrop-blur-sm transition-opacity dark:bg-black/40" })
+            }
+          ),
+          /* @__PURE__ */ t(
+            "div",
+            {
+              className: d(
+                "fixed inset-0 z-10 flex justify-center p-4",
+                D === "top" ? "items-start pt-16" : "items-center"
+              ),
+              children: /* @__PURE__ */ t(
+                C,
+                {
+                  as: f,
+                  enter: "ease-out duration-100",
+                  enterFrom: "opacity-0 scale-95",
+                  enterTo: "opacity-100 scale-100",
+                  leave: "ease-in duration-50",
+                  leaveFrom: "opacity-100 scale-100",
+                  leaveTo: "opacity-0 scale-95",
+                  children: /* @__PURE__ */ t(Z, { className: "flex w-full max-w-[640px] flex-col overflow-hidden rounded-xl border border-stone-200 bg-white shadow-2xl dark:border-white/10 dark:bg-stone-900", children: $ })
+                }
+              )
+            }
+          )
+        ]
+      }
+    ) });
+  }
+);
+_.displayName = "Search";
+export {
+  _ as Search,
+  F as SearchHit
+};

package/dist/index.js

@@ -2,62 +2,69 @@ import { cn as e } from "./utils/cn.js";
 import { getInitialOpenState as p, updateAndCopyUrl as m } from "./components/accordion/accordion-url-utils.js";
 import { Accordion as x } from "./components/accordion/index.js";
 import { Badge as n } from "./components/badge/badge.js";
-import { Callout as d, Check as C, Danger as i, Info as T, Note as c, Tip as s, Warning as u } from "./components/callout/callout.js";
-import { Card as S } from "./components/card/card.js";
-import { BaseCodeBlock as B } from "./components/code-block/base-code-block.js";
-import { CodeBlock as P } from "./components/code-block/code-block.js";
-import { CodeGroup as Z } from "./components/code-group/code-group.js";
-import { Color as y } from "./components/color/color.js";
-import { Columns as U } from "./components/columns/columns.js";
-import { Expandable as h } from "./components/expandable/expandable.js";
-import { Frame as D } from "./components/frame/frame.js";
-import { Icon as G } from "./components/icon/icon.js";
-import { Mermaid as M } from "./components/mermaid/mermaid.js";
-import { usePanZoom as O } from "./components/mermaid/use-pan-zoom.js";
-import { ZoomControls as W } from "./components/mermaid/zoom-controls.js";
-import { Panel as q } from "./components/panel/panel.js";
+import { Callout as d, Check as c, Danger as i, Info as C, Note as S, Tip as T, Warning as s } from "./components/callout/callout.js";
+import { Card as h } from "./components/card/card.js";
+import { BaseCodeBlock as I } from "./components/code-block/base-code-block.js";
+import { CodeBlock as g } from "./components/code-block/code-block.js";
+import { CodeGroup as k } from "./components/code-group/code-group.js";
+import { Color as b } from "./components/color/color.js";
+import { Columns as A } from "./components/columns/columns.js";
+import { Expandable as _ } from "./components/expandable/expandable.js";
+import { Frame as w } from "./components/frame/frame.js";
+import { Icon as F } from "./components/icon/icon.js";
+import { Mermaid as L } from "./components/mermaid/mermaid.js";
+import { usePanZoom as N } from "./components/mermaid/use-pan-zoom.js";
+import { ZoomControls as V } from "./components/mermaid/zoom-controls.js";
+import { Panel as j } from "./components/panel/panel.js";
 import { Property as z } from "./components/property/property.js";
-import { STEP_TITLE_SIZES as J } from "./components/steps/constants.js";
-import { Steps as Q } from "./components/steps/steps.js";
-import { Tabs as X } from "./components/tabs/tabs.js";
-import { Tile as $ } from "./components/tile/tile.js";
-import { Tooltip as ro } from "./components/tooltip/tooltip.js";
-import { Tree as to } from "./components/tree/index.js";
-import { Update as mo } from "./components/update/update.js";
-import { View as xo } from "./components/view/view.js";
+import { SearchButton as J } from "./components/search/button.js";
+import { SearchProvider as Q, useSearch as R } from "./components/search/provider.js";
+import { Search as Y } from "./components/search/search.js";
+import { STEP_TITLE_SIZES as oo } from "./components/steps/constants.js";
+import { Steps as eo } from "./components/steps/steps.js";
+import { Tabs as po } from "./components/tabs/tabs.js";
+import { Tile as fo } from "./components/tile/tile.js";
+import { Tooltip as ao } from "./components/tooltip/tooltip.js";
+import { Tree as lo } from "./components/tree/index.js";
+import { Update as io } from "./components/update/update.js";
+import { View as So } from "./components/view/view.js";
 export {
   x as Accordion,
   n as Badge,
-  B as BaseCodeBlock,
+  I as BaseCodeBlock,
   d as Callout,
-  S as Card,
-  C as Check,
-  P as CodeBlock,
-  Z as CodeGroup,
-  y as Color,
-  U as Columns,
+  h as Card,
+  c as Check,
+  g as CodeBlock,
+  k as CodeGroup,
+  b as Color,
+  A as Columns,
   i as Danger,
-  h as Expandable,
-  D as Frame,
-  G as Icon,
-  T as Info,
-  M as Mermaid,
-  c as Note,
-  q as Panel,
+  _ as Expandable,
+  w as Frame,
+  F as Icon,
+  C as Info,
+  L as Mermaid,
+  S as Note,
+  j as Panel,
   z as Property,
-  J as STEP_TITLE_SIZES,
-  Q as Steps,
-  X as Tabs,
-  $ as Tile,
-  s as Tip,
-  ro as Tooltip,
-  to as Tree,
-  mo as Update,
-  xo as View,
-  u as Warning,
-  W as ZoomControls,
+  oo as STEP_TITLE_SIZES,
+  Y as Search,
+  J as SearchButton,
+  Q as SearchProvider,
+  eo as Steps,
+  po as Tabs,
+  fo as Tile,
+  T as Tip,
+  ao as Tooltip,
+  lo as Tree,
+  io as Update,
+  So as View,
+  s as Warning,
+  V as ZoomControls,
   e as cn,
   p as getInitialOpenState,
   m as updateAndCopyUrl,
-  O as usePanZoom
+  N as usePanZoom,
+  R as useSearch
 };

package/dist/node_modules/.pnpm/@floating-ui_core@1.7.3/node_modules/@floating-ui/core/dist/floating-ui.core.js

@@ -1,4 +1,4 @@
-import { evaluate as R, getSide as E, getSideAxis as C, getOppositePlacement as Q, getExpandedPlacements as U, getOppositeAxisPlacements as Z, getAlignmentSides as ee, getAlignment as $, min as z, max as L, getPaddingObject as te, rectToClientRect as X, sides as ne, getAlignmentAxis as ie, getAxisLength as se, clamp as _, getOppositeAxis as J } from "../../../../../@floating-ui_utils@0.2.10/node_modules/@floating-ui/utils/dist/floating-ui.utils.js";
+import { evaluate as R, getSide as E, getSideAxis as C, getOppositePlacement as Q, getExpandedPlacements as U, getOppositeAxisPlacements as Z, getAlignmentSides as ee, getAlignment as $, min as z, max as L, getPaddingObject as te, rectToClientRect as X, clamp as _, sides as ne, getOppositeAxis as J, getAlignmentAxis as ie, getAxisLength as se } from "../../../../../@floating-ui_utils@0.2.10/node_modules/@floating-ui/utils/dist/floating-ui.utils.js";
 function I(t, e, d) {
   let {
     reference: s,