dune-react 0.0.10 → 0.0.12

package/dist/components/puck-base/fields/action-field.js

@@ -0,0 +1,289 @@
+"use client";
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
+import { memo, useCallback } from "react";
+import { Input } from "../../shadcn/input.js";
+import { Button } from "../../shadcn/button.js";
+import { Label } from "../../shadcn/label.js";
+import { Tabs, TabsList, TabsTrigger } from "../../shadcn/tabs.js";
+import { LinkIcon, XIcon, ClipboardIcon, GlobeIcon } from "lucide-react";
+import { useEditorContext } from "../editor-context.js";
+const ACTION_TYPE_OPTIONS = [
+  { label: "Page Link", value: "page" },
+  { label: "External Link", value: "external" },
+  { label: "Email", value: "email" },
+  { label: "Phone", value: "phone" },
+  { label: "Page Section", value: "section" },
+  { label: "Download", value: "download" },
+  { label: "None", value: "none" }
+];
+const PageActionFields = memo(function PageActionFields2({
+  name,
+  value,
+  onChange
+}) {
+  const { sitePages } = useEditorContext();
+  const pages = sitePages ?? [];
+  const pageUrl = value.pageUrl ?? "";
+  const selectedSlug = pageUrl.startsWith("/") ? pageUrl.slice(1) : null;
+  const handlePaste = useCallback(async () => {
+    try {
+      const text = await navigator.clipboard.readText();
+      if (text) onChange({ pageUrl: text.trim() });
+    } catch {
+    }
+  }, [onChange]);
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3", children: [
+    /* @__PURE__ */ jsx(Label, { children: "Page URL" }),
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex flex-1 items-center gap-2 rounded-lg border px-3 py-2", children: [
+        /* @__PURE__ */ jsx(LinkIcon, { className: "text-muted-foreground size-4 shrink-0" }),
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            name: `${name}.pageUrl`,
+            className: "w-full bg-transparent text-sm outline-none placeholder:text-muted-foreground",
+            placeholder: "/about",
+            value: pageUrl,
+            onChange: (e) => onChange({ pageUrl: e.target.value })
+          }
+        ),
+        pageUrl && /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: "text-muted-foreground hover:text-foreground shrink-0",
+            onClick: () => onChange({ pageUrl: "" }),
+            children: /* @__PURE__ */ jsx(XIcon, { className: "size-3.5" })
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs(
+        Button,
+        {
+          type: "button",
+          variant: "outline",
+          size: "sm",
+          className: "shrink-0 gap-1.5",
+          onClick: handlePaste,
+          children: [
+            /* @__PURE__ */ jsx(ClipboardIcon, { className: "size-3.5" }),
+            "Paste"
+          ]
+        }
+      )
+    ] }),
+    pages.length > 0 && /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ jsx("span", { className: "text-muted-foreground text-xs font-medium", children: "Site pages" }),
+      /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-2", children: pages.map((page) => {
+        const isSelected = selectedSlug === page.slug;
+        return /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            className: `inline-flex items-center gap-1.5 rounded-full border px-3 py-1 text-xs font-medium transition-colors ${isSelected ? "border-primary bg-primary text-primary-foreground" : "border-border bg-background text-foreground hover:bg-accent"}`,
+            onClick: () => onChange({ pageUrl: isSelected ? "" : `${page.slug}` }),
+            children: [
+              /* @__PURE__ */ jsx(GlobeIcon, { className: "size-3" }),
+              page.label
+            ]
+          },
+          page.slug
+        );
+      }) })
+    ] })
+  ] });
+});
+const ExternalActionFields = memo(function ExternalActionFields2({
+  name,
+  value,
+  onChange
+}) {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
+      /* @__PURE__ */ jsx(Label, { children: "External URL" }),
+      /* @__PURE__ */ jsx(
+        Input,
+        {
+          name: `${name}.externalUrl`,
+          className: "h-8 text-sm",
+          value: value.externalUrl ?? "",
+          onChange: (e) => onChange({ externalUrl: e.target.value }),
+          placeholder: "https://example.com"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs("fieldset", { className: "flex flex-col gap-1.5", children: [
+      /* @__PURE__ */ jsx(Label, { children: "Open in new tab" }),
+      /* @__PURE__ */ jsxs("div", { className: "flex gap-3", children: [
+        /* @__PURE__ */ jsxs("label", { className: "flex items-center gap-1.5 text-sm", children: [
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              type: "radio",
+              name: `${name}.openInNewTab`,
+              value: "true",
+              checked: value.openInNewTab === "true",
+              onChange: () => onChange({ openInNewTab: "true" })
+            }
+          ),
+          "Yes"
+        ] }),
+        /* @__PURE__ */ jsxs("label", { className: "flex items-center gap-1.5 text-sm", children: [
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              type: "radio",
+              name: `${name}.openInNewTab`,
+              value: "false",
+              checked: value.openInNewTab !== "true",
+              onChange: () => onChange({ openInNewTab: "false" })
+            }
+          ),
+          "No"
+        ] })
+      ] })
+    ] })
+  ] });
+});
+const EmailActionFields = memo(function EmailActionFields2({
+  name,
+  value,
+  onChange
+}) {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
+      /* @__PURE__ */ jsx(Label, { children: "Email" }),
+      /* @__PURE__ */ jsx(
+        Input,
+        {
+          name: `${name}.email`,
+          className: "h-8 text-sm",
+          value: value.email ?? "",
+          onChange: (e) => onChange({ email: e.target.value }),
+          placeholder: "hello@example.com"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
+      /* @__PURE__ */ jsx(Label, { children: "Subject" }),
+      /* @__PURE__ */ jsx(
+        Input,
+        {
+          name: `${name}.subject`,
+          className: "h-8 text-sm",
+          value: value.subject ?? "",
+          onChange: (e) => onChange({ subject: e.target.value }),
+          placeholder: "Optional email subject"
+        }
+      )
+    ] })
+  ] });
+});
+const PhoneActionFields = memo(function PhoneActionFields2({
+  name,
+  value,
+  onChange
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
+    /* @__PURE__ */ jsx(Label, { children: "Phone" }),
+    /* @__PURE__ */ jsx(
+      Input,
+      {
+        name: `${name}.phone`,
+        className: "h-8 text-sm",
+        value: value.phone ?? "",
+        onChange: (e) => onChange({ phone: e.target.value }),
+        placeholder: "+1 234 567 890"
+      }
+    )
+  ] });
+});
+const SectionActionFields = memo(function SectionActionFields2({
+  name,
+  value,
+  onChange
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
+    /* @__PURE__ */ jsx(Label, { children: "Section ID" }),
+    /* @__PURE__ */ jsx(
+      Input,
+      {
+        name: `${name}.sectionId`,
+        className: "h-8 text-sm",
+        value: value.sectionId ?? "",
+        onChange: (e) => onChange({ sectionId: e.target.value }),
+        placeholder: "#section-id"
+      }
+    )
+  ] });
+});
+const DownloadActionFields = memo(function DownloadActionFields2({
+  name,
+  value,
+  onChange
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
+    /* @__PURE__ */ jsx(Label, { children: "Download URL" }),
+    /* @__PURE__ */ jsx(
+      Input,
+      {
+        name: `${name}.downloadUrl`,
+        className: "h-8 text-sm",
+        value: value.downloadUrl ?? "",
+        onChange: (e) => onChange({ downloadUrl: e.target.value }),
+        placeholder: "https://example.com/file.pdf"
+      }
+    )
+  ] });
+});
+const ACTION_TYPE_FIELD_MAP = {
+  page: PageActionFields,
+  external: ExternalActionFields,
+  email: EmailActionFields,
+  phone: PhoneActionFields,
+  section: SectionActionFields,
+  download: DownloadActionFields
+};
+function ActionField({ name, value, onChange }) {
+  const current = value ?? { type: "none" };
+  const update = useCallback(
+    (patch) => {
+      onChange({ ...current, ...patch });
+    },
+    [current, onChange]
+  );
+  const TypeFields = ACTION_TYPE_FIELD_MAP[current.type];
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
+      /* @__PURE__ */ jsx(Label, { children: "Action Type" }),
+      /* @__PURE__ */ jsx(
+        Tabs,
+        {
+          value: current.type,
+          onValueChange: (val) => update({ type: val }),
+          children: /* @__PURE__ */ jsx(TabsList, { className: "h-auto w-full flex-wrap justify-start gap-1 p-1 group-data-[orientation=horizontal]/tabs:h-auto", children: ACTION_TYPE_OPTIONS.map((opt) => /* @__PURE__ */ jsx(
+            TabsTrigger,
+            {
+              value: opt.value,
+              className: "h-7 flex-none text-xs",
+              children: opt.label
+            },
+            opt.value
+          )) })
+        }
+      )
+    ] }),
+    TypeFields && /* @__PURE__ */ jsx(TypeFields, { name, value: current, onChange: update })
+  ] });
+}
+export {
+  ACTION_TYPE_FIELD_MAP,
+  ACTION_TYPE_OPTIONS,
+  ActionField,
+  DownloadActionFields,
+  EmailActionFields,
+  ExternalActionFields,
+  PageActionFields,
+  PhoneActionFields,
+  SectionActionFields
+};

package/dist/components/puck-base/fields/auto-field.d.ts

@@ -1,3 +1,2 @@
 import type { AutoFieldProps } from "./types";
-/** 按 field.type 分发控件；名为 url 且类型为 text 时固定使用 UrlField（链接 + 站内路由） */
 export declare const AutoField: import("react").NamedExoticComponent<AutoFieldProps>;

package/dist/components/puck-base/fields/auto-field.js

@@ -1,5 +1,5 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { memo, useCallback, useState, useRef, useMemo, useEffect } from "react";
+import { memo, useState, useRef, useMemo, useCallback, useEffect } from "react";
 import { Input } from "../../shadcn/input.js";
 import { Textarea } from "../../shadcn/textarea.js";
 import { Label } from "../../shadcn/label.js";
@@ -8,8 +8,7 @@ import { Button } from "../../shadcn/button.js";
 import { Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from "../../shadcn/select.js";
 import { Popover, PopoverTrigger, PopoverContent } from "../../shadcn/popover.js";
 import { ToggleGroup, ToggleGroupItem } from "../../shadcn/toggle-group.js";
-import { LinkIcon, XIcon, ClipboardIcon, GlobeIcon, ChevronDownIcon, CheckIcon } from "lucide-react";
-import { useEditorContext } from "../editor-context.js";
+import { ChevronDownIcon, CheckIcon } from "lucide-react";
 const LARGE_SELECT_THRESHOLD = 200;
 const VIRTUAL_ITEM_HEIGHT = 32;
 const VIRTUAL_VIEWPORT_HEIGHT = 256;
@@ -213,81 +212,6 @@ const VirtualizedSelectField = memo(function VirtualizedSelectField2({
     ] })
   ] });
 });
-const UrlField = memo(function UrlField2({
-  label,
-  value,
-  onChange,
-  sitePages
-}) {
-  const currentValue = value ?? "";
-  const selectedSlug = currentValue.startsWith("/") ? currentValue.slice(1) : null;
-  const handlePaste = useCallback(async () => {
-    try {
-      const text = await navigator.clipboard.readText();
-      if (text) onChange(text.trim());
-    } catch {
-    }
-  }, [onChange]);
-  return /* @__PURE__ */ jsxs("div", { className: "mb-4 space-y-3", children: [
-    /* @__PURE__ */ jsx(Label, { children: label }),
-    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ jsxs("div", { className: "flex flex-1 items-center gap-2 rounded-lg border px-3 py-2", children: [
-        /* @__PURE__ */ jsx(LinkIcon, { className: "text-muted-foreground size-4 shrink-0" }),
-        /* @__PURE__ */ jsx(
-          "input",
-          {
-            className: "w-full bg-transparent text-sm outline-none placeholder:text-muted-foreground",
-            placeholder: "https:// or /page-slug",
-            value: currentValue,
-            onChange: (e) => onChange(e.target.value)
-          }
-        ),
-        currentValue && /* @__PURE__ */ jsx(
-          "button",
-          {
-            type: "button",
-            className: "text-muted-foreground hover:text-foreground shrink-0",
-            onClick: () => onChange(""),
-            children: /* @__PURE__ */ jsx(XIcon, { className: "size-3.5" })
-          }
-        )
-      ] }),
-      /* @__PURE__ */ jsxs(
-        Button,
-        {
-          type: "button",
-          variant: "outline",
-          size: "sm",
-          className: "shrink-0 gap-1.5",
-          onClick: handlePaste,
-          children: [
-            /* @__PURE__ */ jsx(ClipboardIcon, { className: "size-3.5" }),
-            "Paste"
-          ]
-        }
-      )
-    ] }),
-    sitePages.length > 0 && /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
-      /* @__PURE__ */ jsx("span", { className: "text-muted-foreground text-xs font-medium", children: "Site pages" }),
-      /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-2", children: sitePages.map((page) => {
-        const isSelected = selectedSlug === page.slug;
-        return /* @__PURE__ */ jsxs(
-          "button",
-          {
-            type: "button",
-            className: `inline-flex items-center gap-1.5 rounded-full border px-3 py-1 text-xs font-medium transition-colors ${isSelected ? "border-primary bg-primary text-primary-foreground" : "border-border bg-background text-foreground hover:bg-accent"}`,
-            onClick: () => onChange(isSelected ? "" : `${page.slug}`),
-            children: [
-              /* @__PURE__ */ jsx(GlobeIcon, { className: "size-3" }),
-              page.label
-            ]
-          },
-          page.slug
-        );
-      }) })
-    ] })
-  ] });
-});
 const AutoField = memo(function AutoField2({
   field,
   name,
@@ -296,18 +220,6 @@ const AutoField = memo(function AutoField2({
 }) {
   var _a, _b;
   const label = field.label || name;
-  const { sitePages } = useEditorContext();
-  if (name === "url" && field.type === "text") {
-    return /* @__PURE__ */ jsx(
-      UrlField,
-      {
-        label,
-        value,
-        onChange,
-        sitePages: sitePages ?? []
-      }
-    );
-  }
   switch (field.type) {
     case "text":
       return /* @__PURE__ */ jsxs("div", { className: "mb-4 space-y-1.5", children: [

package/dist/components/puck-base/form.js

@@ -19,7 +19,6 @@ const CompoundForm = (props) => {
           CompoundButton,
           {
             label: props.button.label,
-            url: props.button.url,
             variant: props.button.variant,
             size: props.button.size,
             icon: props.button.icon,

package/dist/components/puck-base/gradient-text.js

@@ -33,7 +33,7 @@ const GradientText = ({
     Tag,
     {
       className: cn(
-        "bg-clip-text text-transparent",
+        "bg-clip-text text-transparent pb-2",
         TAG_STYLES[Tag],
         className
       ),

package/dist/components/puck-base/icon-picker-field.d.ts

@@ -0,0 +1,8 @@
+export declare function IconPickerField({ value, onChange, }: {
+    field: any;
+    name: string;
+    id: string;
+    value: any;
+    onChange: (value: any) => void;
+    readOnly?: boolean;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/components/puck-base/icon-picker-field.js

@@ -0,0 +1,153 @@
+"use client";
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useState, useMemo } from "react";
+import { cn } from "../../utils/css-utils.js";
+import { Popover, PopoverTrigger, PopoverContent } from "../shadcn/popover.js";
+import { Command, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandItem } from "../shadcn/command.js";
+import { ScrollArea } from "../shadcn/scroll-area.js";
+import { Input } from "../shadcn/input.js";
+import { Label } from "../shadcn/label.js";
+import { ICON_MAP, ICON_CATALOG } from "./core/icon-catalog.js";
+import { ChevronDown } from "lucide-react";
+function IconPickerField({
+  value,
+  onChange
+}) {
+  const [open, setOpen] = useState(false);
+  const current = value ?? "none";
+  const [search, setSearch] = useState("");
+  const [manualInput, setManualInput] = useState("");
+  const CurrentIcon = ICON_MAP.get(current);
+  const filteredCatalog = useMemo(() => {
+    const q = search.trim().toLowerCase();
+    if (!q) return ICON_CATALOG;
+    return ICON_CATALOG.map((cat) => ({
+      ...cat,
+      icons: cat.icons.filter((e) => e.name.toLowerCase().includes(q))
+    })).filter((cat) => cat.icons.length > 0);
+  }, [search]);
+  const handleSelect = (name) => {
+    onChange(name);
+    setSearch("");
+    setOpen(false);
+  };
+  const handleManualSubmit = () => {
+    const v = manualInput.trim();
+    if (v) {
+      onChange(v);
+      setManualInput("");
+      setOpen(false);
+    }
+  };
+  return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        className: cn(
+          "inline-flex h-8 w-full items-center gap-2 rounded-md border bg-background px-2.5 text-sm",
+          "text-foreground transition-colors hover:bg-accent/50",
+          "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/50"
+        ),
+        children: [
+          CurrentIcon ? /* @__PURE__ */ jsx(CurrentIcon, { className: "size-4 shrink-0 text-muted-foreground" }) : /* @__PURE__ */ jsx("span", { className: "size-4 shrink-0 rounded-sm border border-dashed" }),
+          /* @__PURE__ */ jsx("span", { className: "flex-1 truncate text-left", children: current === "none" ? /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "None" }) : current }),
+          /* @__PURE__ */ jsx(ChevronDown, { className: "size-3.5 shrink-0 text-muted-foreground" })
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ jsx(
+      PopoverContent,
+      {
+        className: "w-72 p-0",
+        align: "start",
+        side: "bottom",
+        sideOffset: 4,
+        children: /* @__PURE__ */ jsxs(Command, { shouldFilter: false, children: [
+          /* @__PURE__ */ jsx(
+            CommandInput,
+            {
+              placeholder: "Search icons...",
+              value: search,
+              onValueChange: setSearch
+            }
+          ),
+          /* @__PURE__ */ jsxs(CommandList, { className: "max-h-none overflow-visible", children: [
+            /* @__PURE__ */ jsx(CommandEmpty, { children: "No icons found." }),
+            /* @__PURE__ */ jsxs(ScrollArea, { className: "h-72", children: [
+              /* @__PURE__ */ jsx(CommandGroup, { children: /* @__PURE__ */ jsxs(
+                CommandItem,
+                {
+                  value: "none",
+                  onSelect: () => handleSelect("none"),
+                  "data-checked": current === "none" ? "true" : void 0,
+                  className: "gap-2",
+                  children: [
+                    /* @__PURE__ */ jsx("span", { className: "size-4 shrink-0 rounded-sm border border-dashed" }),
+                    /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "None" })
+                  ]
+                }
+              ) }),
+              filteredCatalog.map((cat) => /* @__PURE__ */ jsx(CommandGroup, { heading: cat.label, children: /* @__PURE__ */ jsx("div", { className: "grid grid-cols-6 gap-0.5 px-1 py-0.5", children: cat.icons.map((entry) => {
+                const IconComp = entry.component;
+                const isSelected = current === entry.name;
+                return /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    type: "button",
+                    title: entry.name,
+                    onClick: () => handleSelect(entry.name),
+                    className: cn(
+                      "flex size-8 items-center justify-center rounded-md transition-colors",
+                      "hover:bg-accent hover:text-accent-foreground",
+                      isSelected && "bg-primary text-primary-foreground hover:bg-primary/90"
+                    ),
+                    "aria-label": entry.name,
+                    "aria-pressed": isSelected,
+                    children: /* @__PURE__ */ jsx(IconComp, { className: "size-4" })
+                  },
+                  entry.name
+                );
+              }) }) }, cat.label))
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "border-t p-2", children: [
+              /* @__PURE__ */ jsx(Label, { className: "mb-1 block text-xs text-muted-foreground", children: "Or type any Lucide icon name" }),
+              /* @__PURE__ */ jsxs("div", { className: "flex gap-1.5", children: [
+                /* @__PURE__ */ jsx(
+                  Input,
+                  {
+                    className: "h-7 flex-1 text-xs",
+                    placeholder: "e.g. arrow-right",
+                    value: manualInput,
+                    onChange: (e) => setManualInput(e.target.value),
+                    onKeyDown: (e) => {
+                      if (e.key === "Enter") {
+                        e.preventDefault();
+                        handleManualSubmit();
+                      }
+                    }
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: handleManualSubmit,
+                    className: cn(
+                      "inline-flex h-7 items-center rounded-md border bg-secondary px-2.5 text-xs font-medium",
+                      "text-secondary-foreground transition-colors hover:bg-secondary/80"
+                    ),
+                    children: "Set"
+                  }
+                )
+              ] })
+            ] })
+          ] })
+        ] })
+      }
+    )
+  ] });
+}
+export {
+  IconPickerField
+};

package/dist/components/puck-base/index.d.ts

@@ -8,7 +8,7 @@ export { CompoundForm, type CompoundFormProps, formMethods, type FormMethods } f
 export { CompoundImage, type CompoundImageProps } from "./image";
 export { CompoundArticleCard, type CompoundArticleCardProps } from "./article-card";
 export { ImageUploadField } from "./image-upload-field";
-export { ActionField } from "./action-field";
+export { ActionField, ACTION_TYPE_FIELD_MAP, ACTION_TYPE_OPTIONS, PageActionFields, ExternalActionFields, EmailActionFields, PhoneActionFields, SectionActionFields, DownloadActionFields, type ActionTypeFieldProps, } from "./fields/action-field";
 export { ErrorBoundary } from "./error-boundary";
 export { GradientText, type GradientTextProps } from "./gradient-text";
 export { InlineEditable } from "./inline-editable";

package/dist/components/puck-base/navigation-menu.d.ts

@@ -0,0 +1,18 @@
+import { NavigationMenu as NavigationMenuPrimitive } from "@base-ui/react/navigation-menu";
+declare function NavigationMenu({ align, portalContainer, className, children, onValueChange, ...props }: NavigationMenuPrimitive.Root.Props & Pick<NavigationMenuPrimitive.Positioner.Props, "align"> & {
+    portalContainer?: HTMLElement | null | React.RefObject<HTMLElement | null>;
+}): import("react/jsx-runtime").JSX.Element;
+declare function NavigationMenuList({ className, ...props }: React.ComponentPropsWithRef<typeof NavigationMenuPrimitive.List>): import("react/jsx-runtime").JSX.Element;
+declare function NavigationMenuItem({ className, ...props }: React.ComponentPropsWithRef<typeof NavigationMenuPrimitive.Item>): import("react/jsx-runtime").JSX.Element;
+declare const navigationMenuTriggerStyle: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+declare function NavigationMenuTrigger({ className, children, ...props }: NavigationMenuPrimitive.Trigger.Props): import("react/jsx-runtime").JSX.Element;
+declare function NavigationMenuContent({ className, ...props }: NavigationMenuPrimitive.Content.Props): import("react/jsx-runtime").JSX.Element;
+declare function NavigationMenuPositioner({ className, side, sideOffset, align, alignOffset, portalContainer, ...props }: NavigationMenuPrimitive.Positioner.Props & {
+    portalContainer?: HTMLElement | null | React.RefObject<HTMLElement | null>;
+}): import("react/jsx-runtime").JSX.Element;
+declare function NavigationMenuLink({ className, asChild, children, active, ...props }: NavigationMenuPrimitive.Link.Props & {
+    asChild?: boolean;
+    active?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+declare function NavigationMenuIndicator({ className, ...props }: React.ComponentPropsWithRef<typeof NavigationMenuPrimitive.Icon>): import("react/jsx-runtime").JSX.Element;
+export { NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, navigationMenuTriggerStyle, NavigationMenuPositioner, };