rivet-ui 0.1.0

package/dist/components/Fieldset/index.js.map

@@ -0,0 +1,10 @@
+{
+  "version": 3,
+  "sources": ["../src/components/Fieldset/Fieldset.tsx"],
+  "sourcesContent": [
+    "import { Fieldset as BaseFieldset } from '@base-ui/react/fieldset';\nimport React from 'react';\nimport { cn } from '../../utils/cn';\n\nexport const FieldsetRoot = React.forwardRef<\n    HTMLFieldSetElement,\n    React.ComponentPropsWithoutRef<typeof BaseFieldset.Root>\n>(({ className, ...props }, ref) => (\n    <BaseFieldset.Root\n        ref={ref}\n        className={cn('flex flex-col gap-4 border-0 m-0 p-0', className)}\n        {...props}\n    />\n));\nFieldsetRoot.displayName = 'FieldsetRoot';\n\nexport const FieldsetLegend = React.forwardRef<\n    HTMLDivElement,\n    React.ComponentPropsWithoutRef<typeof BaseFieldset.Legend>\n>(({ className, ...props }, ref) => (\n    <BaseFieldset.Legend\n        ref={ref}\n        className={cn(\n            'text-base font-semibold text-kraft border-b border-kraft/15 pb-3 w-full',\n            className\n        )}\n        {...props}\n    />\n));\nFieldsetLegend.displayName = 'FieldsetLegend';\n"
+  ],
+  "mappings": ";;;;;AAAA,qBAAS;AACT;;AAGO,IAAM,eAAe,MAAM,WAGhC,GAAG,cAAc,SAAS,wBACxB,IAAC,aAAa,MAAd;AAAA,EACI;AAAA,EACA,WAAW,GAAG,wCAAwC,SAAS;AAAA,KAC3D;AAAA,CACR,CACH;AACD,aAAa,cAAc;AAEpB,IAAM,iBAAiB,MAAM,WAGlC,GAAG,cAAc,SAAS,wBACxB,IAAC,aAAa,QAAd;AAAA,EACI;AAAA,EACA,WAAW,GACP,2EACA,SACJ;AAAA,KACI;AAAA,CACR,CACH;AACD,eAAe,cAAc;",
+  "debugId": "CF6A277F31D7E10A64756E2164756E21",
+  "names": []
+}

package/dist/components/Form/Form.d.ts

@@ -0,0 +1,5 @@
+import * as React from 'react';
+import { Form } from '@base-ui/react/form';
+export declare const FormRoot: React.ForwardRefExoticComponent<Omit<Form.Props<Record<string, any>> & {
+    ref?: React.Ref<HTMLFormElement> | undefined;
+}, "ref"> & React.RefAttributes<HTMLFormElement>>;

package/dist/components/Form/Form.stories.d.ts

@@ -0,0 +1,5 @@
+import type { Meta, StoryObj } from '@storybook/react-vite';
+declare const meta: Meta;
+export default meta;
+type Story = StoryObj;
+export declare const Default: Story;

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

@@ -0,0 +1 @@
+export { FormRoot } from './Form';

package/dist/components/Form/index.js

@@ -0,0 +1,20 @@
+import {
+  cn
+} from "../../utils/cn.js";
+
+// src/components/Form/Form.tsx
+import * as React from "react";
+import { Form } from "@base-ui/react/form";
+import { jsx } from "react/jsx-runtime";
+var FormRoot = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Form, {
+  ref,
+  className: cn("space-y-4", className),
+  ...props
+}));
+FormRoot.displayName = "FormRoot";
+export {
+  FormRoot
+};
+export { FormRoot };
+
+//# debugId=6744BFEFDDD7DA8664756E2164756E21

package/dist/components/Form/index.js.map

@@ -0,0 +1,10 @@
+{
+  "version": 3,
+  "sources": ["../src/components/Form/Form.tsx"],
+  "sourcesContent": [
+    "import * as React from 'react';\nimport { Form } from '@base-ui/react/form';\nimport { cn } from '../../utils/cn';\n\nexport const FormRoot = React.forwardRef<\n    HTMLFormElement,\n    React.ComponentPropsWithoutRef<typeof Form>\n>(({ className, ...props }, ref) => (\n    <Form ref={ref} className={cn('space-y-4', className)} {...props} />\n));\nFormRoot.displayName = 'FormRoot';\n"
+  ],
+  "mappings": ";;;;;AAAA;AACA;;AAGO,IAAM,WAAiB,iBAG5B,GAAG,cAAc,SAAS,wBACxB,IAAC,MAAD;AAAA,EAAM;AAAA,EAAU,WAAW,GAAG,aAAa,SAAS;AAAA,KAAO;AAAA,CAAO,CACrE;AACD,SAAS,cAAc;",
+  "debugId": "6744BFEFDDD7DA8664756E2164756E21",
+  "names": []
+}

package/dist/components/Input/Input.d.ts

@@ -0,0 +1,16 @@
+import { Input as BaseInput } from '@base-ui/react/input';
+import { type VariantProps } from 'cva';
+import React from 'react';
+export declare const inputVariants: (props?: ({
+    variant?: "default" | "error" | undefined;
+    size?: "sm" | "md" | "lg" | undefined;
+} & ({
+    class?: import("cva").ClassValue;
+    className?: never;
+} | {
+    class?: never;
+    className?: import("cva").ClassValue;
+})) | undefined) => string;
+export interface InputProps extends Omit<React.ComponentPropsWithoutRef<typeof BaseInput>, 'size'>, VariantProps<typeof inputVariants> {
+}
+export declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement>>;

package/dist/components/Input/Input.stories.d.ts

@@ -0,0 +1,34 @@
+import type { StoryObj } from '@storybook/react-vite';
+declare const meta: {
+    title: string;
+    component: import("react").ForwardRefExoticComponent<import("./Input").InputProps & import("react").RefAttributes<HTMLInputElement>>;
+    parameters: {
+        layout: string;
+    };
+    tags: string[];
+    argTypes: {
+        variant: {
+            control: "select";
+            options: string[];
+        };
+        size: {
+            control: "select";
+            options: string[];
+        };
+        disabled: {
+            control: "boolean";
+        };
+        placeholder: {
+            control: "text";
+        };
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const Error: Story;
+export declare const Small: Story;
+export declare const Large: Story;
+export declare const AllVariants: Story;
+export declare const AllSizes: Story;
+export declare const Disabled: Story;

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

@@ -0,0 +1,2 @@
+export { Input, inputVariants } from './Input';
+export type { InputProps } from './Input';

package/dist/components/Input/index.js

@@ -0,0 +1,44 @@
+import {
+  cva
+} from "../../chunk-fjtwj9cw.js";
+import {
+  cn
+} from "../../utils/cn.js";
+
+// src/components/Input/Input.tsx
+import { Input as BaseInput } from "@base-ui/react/input";
+import React from "react";
+import { jsx } from "react/jsx-runtime";
+var inputVariants = cva({
+  base: "flex w-full rounded-lg border bg-surface px-3 text-sm text-kraft transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-kraft/40 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 data-disabled:cursor-not-allowed data-disabled:opacity-50",
+  variants: {
+    variant: {
+      default: "border-kraft/20 focus-visible:border-ribbon focus-visible:ring-ribbon",
+      error: "border-spool focus-visible:ring-spool"
+    },
+    size: {
+      sm: "h-8 text-xs",
+      md: "h-10",
+      lg: "h-12 text-base"
+    }
+  },
+  defaultVariants: {
+    variant: "default",
+    size: "md"
+  }
+});
+var Input = React.forwardRef(({ className, variant, size, ...props }, ref) => {
+  return /* @__PURE__ */ jsx(BaseInput, {
+    ref,
+    className: cn(inputVariants({ variant, size }), className),
+    ...props
+  });
+});
+Input.displayName = "Input";
+export {
+  inputVariants,
+  Input
+};
+export { inputVariants, Input };
+
+//# debugId=789832A72C9D510264756E2164756E21

package/dist/components/Input/index.js.map

@@ -0,0 +1,10 @@
+{
+  "version": 3,
+  "sources": ["../src/components/Input/Input.tsx"],
+  "sourcesContent": [
+    "import { Input as BaseInput } from '@base-ui/react/input';\nimport { cva, type VariantProps } from 'cva';\nimport { cn } from '../../utils/cn';\nimport React from 'react';\n\nexport const inputVariants = cva({\n    base: 'flex w-full rounded-lg border bg-surface px-3 text-sm text-kraft transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-kraft/40 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 data-disabled:cursor-not-allowed data-disabled:opacity-50',\n    variants: {\n        variant: {\n            default: 'border-kraft/20 focus-visible:border-ribbon focus-visible:ring-ribbon',\n            error: 'border-spool focus-visible:ring-spool'\n        },\n        size: {\n            sm: 'h-8 text-xs',\n            md: 'h-10',\n            lg: 'h-12 text-base'\n        }\n    },\n    defaultVariants: {\n        variant: 'default',\n        size: 'md'\n    }\n});\n\nexport interface InputProps\n    extends Omit<React.ComponentPropsWithoutRef<typeof BaseInput>, 'size'>,\n        VariantProps<typeof inputVariants> {}\n\nexport const Input = React.forwardRef<HTMLInputElement, InputProps>(\n    ({ className, variant, size, ...props }, ref) => {\n        return (\n            <BaseInput\n                ref={ref}\n                className={cn(inputVariants({ variant, size }), className)}\n                {...props}\n            />\n        );\n    }\n);\n\nInput.displayName = 'Input';\n"
+  ],
+  "mappings": ";;;;;;;;AAAA,kBAAS;AAGT;AAAA;AAEO,IAAM,gBAAgB,IAAI;AAAA,EAC7B,MAAM;AAAA,EACN,UAAU;AAAA,IACN,SAAS;AAAA,MACL,SAAS;AAAA,MACT,OAAO;AAAA,IACX;AAAA,IACA,MAAM;AAAA,MACF,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IACR;AAAA,EACJ;AAAA,EACA,iBAAiB;AAAA,IACb,SAAS;AAAA,IACT,MAAM;AAAA,EACV;AACJ,CAAC;AAMM,IAAM,QAAQ,MAAM,WACvB,GAAG,WAAW,SAAS,SAAS,SAAS,QAAQ;AAAA,EAC7C,uBACI,IAAC,WAAD;AAAA,IACI;AAAA,IACA,WAAW,GAAG,cAAc,EAAE,SAAS,KAAK,CAAC,GAAG,SAAS;AAAA,OACrD;AAAA,GACR;AAAA,CAGZ;AAEA,MAAM,cAAc;",
+  "debugId": "789832A72C9D510264756E2164756E21",
+  "names": []
+}

package/dist/components/Menu/Menu.d.ts

@@ -0,0 +1,21 @@
+import * as React from 'react';
+import { Menu } from '@base-ui/react/menu';
+export declare const MenuRoot: <Payload>(props: Menu.Root.Props<Payload>) => import("react/jsx-runtime").JSX.Element;
+export declare const MenuPortal: React.ForwardRefExoticComponent<Omit<import("@base-ui/react").ContextMenuPortalProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const MenuBackdrop: React.ForwardRefExoticComponent<Omit<import("@base-ui/react").ContextMenuBackdropProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const MenuGroup: React.ForwardRefExoticComponent<Omit<import("@base-ui/react").ContextMenuGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const MenuRadioGroup: React.NamedExoticComponent<Omit<import("@base-ui/react").ContextMenuRadioGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const MenuSubmenuRoot: typeof Menu.SubmenuRoot;
+export declare const MenuTrigger: React.ForwardRefExoticComponent<Omit<import("@base-ui/react").MenuTriggerProps<unknown> & React.RefAttributes<HTMLElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export declare const MenuPositioner: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").ContextMenuPositionerProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const MenuPopup: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").ContextMenuPopupProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const MenuArrow: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").ContextMenuArrowProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const MenuItem: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").ContextMenuItemProps, "ref"> & React.RefAttributes<HTMLElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const MenuLinkItem: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").ContextMenuLinkItemProps, "ref"> & React.RefAttributes<Element>, "ref"> & React.RefAttributes<HTMLAnchorElement>>;
+export declare const MenuSeparator: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").SeparatorProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const MenuGroupLabel: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").ContextMenuGroupLabelProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const MenuRadioItem: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").ContextMenuRadioItemProps, "ref"> & React.RefAttributes<HTMLElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const MenuRadioItemIndicator: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").ContextMenuRadioItemIndicatorProps, "ref"> & React.RefAttributes<HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+export declare const MenuCheckboxItem: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").ContextMenuCheckboxItemProps, "ref"> & React.RefAttributes<HTMLElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const MenuCheckboxItemIndicator: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").ContextMenuCheckboxItemIndicatorProps, "ref"> & React.RefAttributes<HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+export declare const MenuSubmenuTrigger: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").ContextMenuSubmenuTriggerProps, "ref"> & React.RefAttributes<HTMLElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/components/Menu/Menu.stories.d.ts

@@ -0,0 +1,9 @@
+import type { Meta, StoryObj } from '@storybook/react';
+declare const meta: Meta;
+export default meta;
+type Story = StoryObj;
+export declare const Basic: Story;
+export declare const WithGroups: Story;
+export declare const WithCheckboxItems: Story;
+export declare const WithRadioItems: Story;
+export declare const WithSubmenu: Story;

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

@@ -0,0 +1 @@
+export { MenuRoot, MenuTrigger, MenuPortal, MenuBackdrop, MenuPositioner, MenuPopup, MenuArrow, MenuItem, MenuLinkItem, MenuSeparator, MenuGroup, MenuGroupLabel, MenuRadioGroup, MenuRadioItem, MenuRadioItemIndicator, MenuCheckboxItem, MenuCheckboxItemIndicator, MenuSubmenuRoot, MenuSubmenuTrigger } from './Menu';

package/dist/components/Menu/index.js

@@ -0,0 +1,117 @@
+import {
+  cn
+} from "../../utils/cn.js";
+
+// src/components/Menu/Menu.tsx
+import * as React from "react";
+import { Menu } from "@base-ui/react/menu";
+import { jsx } from "react/jsx-runtime";
+var MenuRoot = Menu.Root;
+var MenuPortal = Menu.Portal;
+var MenuBackdrop = Menu.Backdrop;
+var MenuGroup = Menu.Group;
+var MenuRadioGroup = Menu.RadioGroup;
+var MenuSubmenuRoot = Menu.SubmenuRoot;
+var MenuTrigger = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Menu.Trigger, {
+  ref,
+  className: cn("inline-flex h-8 cursor-default items-center gap-1 rounded-sm px-3 text-sm font-medium text-kraft select-none outline-none", "hover:bg-canvas/60 focus-visible:outline-2 focus-visible:-outline-offset-1 focus-visible:outline-ribbon-500", "data-popup-open:bg-canvas/60", "data-disabled:cursor-not-allowed data-disabled:opacity-50", className),
+  ...props
+}));
+MenuTrigger.displayName = "MenuTrigger";
+var MenuPositioner = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Menu.Positioner, {
+  ref,
+  className: cn("outline-none", className),
+  ...props
+}));
+MenuPositioner.displayName = "MenuPositioner";
+var MenuPopup = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Menu.Popup, {
+  ref,
+  className: cn("min-w-[8rem] rounded-lg border border-kraft/15 bg-surface p-1 shadow-md", "origin-[var(--transform-origin)] transition-[transform,scale,opacity] duration-150", "data-starting-style:scale-95 data-starting-style:opacity-0", "data-ending-style:scale-95 data-ending-style:opacity-0", className),
+  ...props
+}));
+MenuPopup.displayName = "MenuPopup";
+var MenuArrow = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Menu.Arrow, {
+  ref,
+  className: cn("flex text-kraft/15", "data-[side=top]:bottom-[-8px] data-[side=top]:rotate-180", "data-[side=bottom]:top-[-8px]", "data-[side=left]:right-[-13px] data-[side=left]:rotate-90", "data-[side=right]:left-[-13px] data-[side=right]:-rotate-90", className),
+  ...props
+}));
+MenuArrow.displayName = "MenuArrow";
+var itemClasses = "relative flex cursor-default items-center gap-2 rounded-sm px-3 py-1.5 text-sm text-kraft select-none outline-none " + "data-highlighted:bg-canvas/60 data-popup-open:bg-canvas/40 " + "data-disabled:pointer-events-none data-disabled:opacity-50";
+var MenuItem = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Menu.Item, {
+  ref,
+  className: cn(itemClasses, className),
+  ...props
+}));
+MenuItem.displayName = "MenuItem";
+var MenuLinkItem = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Menu.LinkItem, {
+  ref,
+  className: cn(itemClasses, "no-underline", className),
+  ...props
+}));
+MenuLinkItem.displayName = "MenuLinkItem";
+var MenuSeparator = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Menu.Separator, {
+  ref,
+  className: cn("my-1 h-px bg-kraft/10", className),
+  ...props
+}));
+MenuSeparator.displayName = "MenuSeparator";
+var MenuGroupLabel = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Menu.GroupLabel, {
+  ref,
+  className: cn("px-3 py-1 text-xs font-semibold tracking-wide text-kraft/50", className),
+  ...props
+}));
+MenuGroupLabel.displayName = "MenuGroupLabel";
+var MenuRadioItem = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Menu.RadioItem, {
+  ref,
+  className: cn(itemClasses, "pl-8", className),
+  ...props
+}));
+MenuRadioItem.displayName = "MenuRadioItem";
+var MenuRadioItemIndicator = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Menu.RadioItemIndicator, {
+  ref,
+  className: cn("absolute left-2 flex size-4 items-center justify-center", className),
+  ...props
+}));
+MenuRadioItemIndicator.displayName = "MenuRadioItemIndicator";
+var MenuCheckboxItem = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Menu.CheckboxItem, {
+  ref,
+  className: cn(itemClasses, "pl-8", className),
+  ...props
+}));
+MenuCheckboxItem.displayName = "MenuCheckboxItem";
+var MenuCheckboxItemIndicator = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Menu.CheckboxItemIndicator, {
+  ref,
+  className: cn("absolute left-2 flex size-4 items-center justify-center", className),
+  ...props
+}));
+MenuCheckboxItemIndicator.displayName = "MenuCheckboxItemIndicator";
+var MenuSubmenuTrigger = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Menu.SubmenuTrigger, {
+  ref,
+  className: cn(itemClasses, "justify-between", className),
+  ...props
+}));
+MenuSubmenuTrigger.displayName = "MenuSubmenuTrigger";
+export {
+  MenuTrigger,
+  MenuSubmenuTrigger,
+  MenuSubmenuRoot,
+  MenuSeparator,
+  MenuRoot,
+  MenuRadioItemIndicator,
+  MenuRadioItem,
+  MenuRadioGroup,
+  MenuPositioner,
+  MenuPortal,
+  MenuPopup,
+  MenuLinkItem,
+  MenuItem,
+  MenuGroupLabel,
+  MenuGroup,
+  MenuCheckboxItemIndicator,
+  MenuCheckboxItem,
+  MenuBackdrop,
+  MenuArrow
+};
+export { MenuRoot, MenuPortal, MenuBackdrop, MenuGroup, MenuRadioGroup, MenuSubmenuRoot, MenuTrigger, MenuPositioner, MenuPopup, MenuArrow, MenuItem, MenuLinkItem, MenuSeparator, MenuGroupLabel, MenuRadioItem, MenuRadioItemIndicator, MenuCheckboxItem, MenuCheckboxItemIndicator, MenuSubmenuTrigger };
+
+//# debugId=D9064FB594664C3E64756E2164756E21

package/dist/components/Menu/index.js.map

@@ -0,0 +1,10 @@
+{
+  "version": 3,
+  "sources": ["../src/components/Menu/Menu.tsx"],
+  "sourcesContent": [
+    "import * as React from 'react';\nimport { Menu } from '@base-ui/react/menu';\nimport { cn } from '../../utils/cn';\n\n// Pass-throughs\nexport const MenuRoot = Menu.Root;\nexport const MenuPortal = Menu.Portal;\nexport const MenuBackdrop = Menu.Backdrop;\nexport const MenuGroup = Menu.Group;\nexport const MenuRadioGroup = Menu.RadioGroup;\nexport const MenuSubmenuRoot = Menu.SubmenuRoot;\n\n// Styled parts\n\nexport const MenuTrigger = React.forwardRef<\n    HTMLButtonElement,\n    React.ComponentPropsWithoutRef<typeof Menu.Trigger>\n>(({ className, ...props }, ref) => (\n    <Menu.Trigger\n        ref={ref}\n        className={cn(\n            'inline-flex h-8 cursor-default items-center gap-1 rounded-sm px-3 text-sm font-medium text-kraft select-none outline-none',\n            'hover:bg-canvas/60 focus-visible:outline-2 focus-visible:-outline-offset-1 focus-visible:outline-ribbon-500',\n            'data-popup-open:bg-canvas/60',\n            'data-disabled:cursor-not-allowed data-disabled:opacity-50',\n            className\n        )}\n        {...props}\n    />\n));\nMenuTrigger.displayName = 'MenuTrigger';\n\nexport const MenuPositioner = React.forwardRef<\n    HTMLDivElement,\n    React.ComponentPropsWithoutRef<typeof Menu.Positioner>\n>(({ className, ...props }, ref) => (\n    <Menu.Positioner\n        ref={ref}\n        className={cn('outline-none', className)}\n        {...props}\n    />\n));\nMenuPositioner.displayName = 'MenuPositioner';\n\nexport const MenuPopup = React.forwardRef<\n    HTMLDivElement,\n    React.ComponentPropsWithoutRef<typeof Menu.Popup>\n>(({ className, ...props }, ref) => (\n    <Menu.Popup\n        ref={ref}\n        className={cn(\n            'min-w-[8rem] rounded-lg border border-kraft/15 bg-surface p-1 shadow-md',\n            'origin-[var(--transform-origin)] transition-[transform,scale,opacity] duration-150',\n            'data-starting-style:scale-95 data-starting-style:opacity-0',\n            'data-ending-style:scale-95 data-ending-style:opacity-0',\n            className\n        )}\n        {...props}\n    />\n));\nMenuPopup.displayName = 'MenuPopup';\n\nexport const MenuArrow = React.forwardRef<\n    HTMLDivElement,\n    React.ComponentPropsWithoutRef<typeof Menu.Arrow>\n>(({ className, ...props }, ref) => (\n    <Menu.Arrow\n        ref={ref}\n        className={cn(\n            'flex text-kraft/15',\n            'data-[side=top]:bottom-[-8px] data-[side=top]:rotate-180',\n            'data-[side=bottom]:top-[-8px]',\n            'data-[side=left]:right-[-13px] data-[side=left]:rotate-90',\n            'data-[side=right]:left-[-13px] data-[side=right]:-rotate-90',\n            className\n        )}\n        {...props}\n    />\n));\nMenuArrow.displayName = 'MenuArrow';\n\nconst itemClasses =\n    'relative flex cursor-default items-center gap-2 rounded-sm px-3 py-1.5 text-sm text-kraft select-none outline-none ' +\n    'data-highlighted:bg-canvas/60 data-popup-open:bg-canvas/40 ' +\n    'data-disabled:pointer-events-none data-disabled:opacity-50';\n\nexport const MenuItem = React.forwardRef<\n    HTMLDivElement,\n    React.ComponentPropsWithoutRef<typeof Menu.Item>\n>(({ className, ...props }, ref) => (\n    <Menu.Item ref={ref} className={cn(itemClasses, className)} {...props} />\n));\nMenuItem.displayName = 'MenuItem';\n\nexport const MenuLinkItem = React.forwardRef<\n    HTMLAnchorElement,\n    React.ComponentPropsWithoutRef<typeof Menu.LinkItem>\n>(({ className, ...props }, ref) => (\n    <Menu.LinkItem\n        ref={ref}\n        className={cn(itemClasses, 'no-underline', className)}\n        {...props}\n    />\n));\nMenuLinkItem.displayName = 'MenuLinkItem';\n\nexport const MenuSeparator = React.forwardRef<\n    HTMLDivElement,\n    React.ComponentPropsWithoutRef<typeof Menu.Separator>\n>(({ className, ...props }, ref) => (\n    <Menu.Separator\n        ref={ref}\n        className={cn('my-1 h-px bg-kraft/10', className)}\n        {...props}\n    />\n));\nMenuSeparator.displayName = 'MenuSeparator';\n\nexport const MenuGroupLabel = React.forwardRef<\n    HTMLDivElement,\n    React.ComponentPropsWithoutRef<typeof Menu.GroupLabel>\n>(({ className, ...props }, ref) => (\n    <Menu.GroupLabel\n        ref={ref}\n        className={cn(\n            'px-3 py-1 text-xs font-semibold tracking-wide text-kraft/50',\n            className\n        )}\n        {...props}\n    />\n));\nMenuGroupLabel.displayName = 'MenuGroupLabel';\n\nexport const MenuRadioItem = React.forwardRef<\n    HTMLDivElement,\n    React.ComponentPropsWithoutRef<typeof Menu.RadioItem>\n>(({ className, ...props }, ref) => (\n    <Menu.RadioItem\n        ref={ref}\n        className={cn(itemClasses, 'pl-8', className)}\n        {...props}\n    />\n));\nMenuRadioItem.displayName = 'MenuRadioItem';\n\nexport const MenuRadioItemIndicator = React.forwardRef<\n    HTMLSpanElement,\n    React.ComponentPropsWithoutRef<typeof Menu.RadioItemIndicator>\n>(({ className, ...props }, ref) => (\n    <Menu.RadioItemIndicator\n        ref={ref}\n        className={cn(\n            'absolute left-2 flex size-4 items-center justify-center',\n            className\n        )}\n        {...props}\n    />\n));\nMenuRadioItemIndicator.displayName = 'MenuRadioItemIndicator';\n\nexport const MenuCheckboxItem = React.forwardRef<\n    HTMLDivElement,\n    React.ComponentPropsWithoutRef<typeof Menu.CheckboxItem>\n>(({ className, ...props }, ref) => (\n    <Menu.CheckboxItem\n        ref={ref}\n        className={cn(itemClasses, 'pl-8', className)}\n        {...props}\n    />\n));\nMenuCheckboxItem.displayName = 'MenuCheckboxItem';\n\nexport const MenuCheckboxItemIndicator = React.forwardRef<\n    HTMLSpanElement,\n    React.ComponentPropsWithoutRef<typeof Menu.CheckboxItemIndicator>\n>(({ className, ...props }, ref) => (\n    <Menu.CheckboxItemIndicator\n        ref={ref}\n        className={cn(\n            'absolute left-2 flex size-4 items-center justify-center',\n            className\n        )}\n        {...props}\n    />\n));\nMenuCheckboxItemIndicator.displayName = 'MenuCheckboxItemIndicator';\n\nexport const MenuSubmenuTrigger = React.forwardRef<\n    HTMLDivElement,\n    React.ComponentPropsWithoutRef<typeof Menu.SubmenuTrigger>\n>(({ className, ...props }, ref) => (\n    <Menu.SubmenuTrigger\n        ref={ref}\n        className={cn(itemClasses, 'justify-between', className)}\n        {...props}\n    />\n));\nMenuSubmenuTrigger.displayName = 'MenuSubmenuTrigger';\n"
+  ],
+  "mappings": "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",
+  "debugId": "D9064FB594664C3E64756E2164756E21",
+  "names": []
+}

package/dist/components/Menubar/Menubar.d.ts

@@ -0,0 +1,2 @@
+import * as React from 'react';
+export declare const MenubarRoot: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").MenubarProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/components/Menubar/Menubar.stories.d.ts

@@ -0,0 +1,5 @@
+import type { Meta, StoryObj } from '@storybook/react';
+declare const meta: Meta;
+export default meta;
+type Story = StoryObj;
+export declare const Basic: Story;

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

@@ -0,0 +1 @@
+export { MenubarRoot } from './Menubar';

package/dist/components/Menubar/index.js

@@ -0,0 +1,20 @@
+import {
+  cn
+} from "../../utils/cn.js";
+
+// src/components/Menubar/Menubar.tsx
+import * as React from "react";
+import { Menubar } from "@base-ui/react/menubar";
+import { jsx } from "react/jsx-runtime";
+var MenubarRoot = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Menubar, {
+  ref,
+  className: cn("flex items-center gap-0.5 rounded-lg border border-kraft/15 bg-surface p-0.5", className),
+  ...props
+}));
+MenubarRoot.displayName = "MenubarRoot";
+export {
+  MenubarRoot
+};
+export { MenubarRoot };
+
+//# debugId=629B3381E6DAE41364756E2164756E21

package/dist/components/Menubar/index.js.map

@@ -0,0 +1,10 @@
+{
+  "version": 3,
+  "sources": ["../src/components/Menubar/Menubar.tsx"],
+  "sourcesContent": [
+    "import * as React from 'react';\nimport { Menubar } from '@base-ui/react/menubar';\nimport { cn } from '../../utils/cn';\n\nexport const MenubarRoot = React.forwardRef<\n    HTMLDivElement,\n    React.ComponentPropsWithoutRef<typeof Menubar>\n>(({ className, ...props }, ref) => (\n    <Menubar\n        ref={ref}\n        className={cn(\n            'flex items-center gap-0.5 rounded-lg border border-kraft/15 bg-surface p-0.5',\n            className\n        )}\n        {...props}\n    />\n));\nMenubarRoot.displayName = 'MenubarRoot';\n"
+  ],
+  "mappings": ";;;;;AAAA;AACA;;AAGO,IAAM,cAAoB,iBAG/B,GAAG,cAAc,SAAS,wBACxB,IAAC,SAAD;AAAA,EACI;AAAA,EACA,WAAW,GACP,gFACA,SACJ;AAAA,KACI;AAAA,CACR,CACH;AACD,YAAY,cAAc;",
+  "debugId": "629B3381E6DAE41364756E2164756E21",
+  "names": []
+}

package/dist/components/Meter/Meter.d.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+export declare const MeterRoot: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").MeterRootProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const MeterLabel: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").MeterLabelProps, "ref"> & React.RefAttributes<HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+export declare const MeterTrack: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").MeterTrackProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const MeterIndicator: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").MeterIndicatorProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const MeterValue: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").MeterValueProps, "ref"> & React.RefAttributes<HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;

package/dist/components/Meter/Meter.stories.d.ts

@@ -0,0 +1,7 @@
+import type { Meta, StoryObj } from '@storybook/react-vite';
+declare const meta: Meta;
+export default meta;
+type Story = StoryObj;
+export declare const Default: Story;
+export declare const Low: Story;
+export declare const Full: Story;

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

@@ -0,0 +1 @@
+export { MeterRoot, MeterLabel, MeterTrack, MeterIndicator, MeterValue } from './Meter';

package/dist/components/Meter/index.js

@@ -0,0 +1,48 @@
+import {
+  cn
+} from "../../utils/cn.js";
+
+// src/components/Meter/Meter.tsx
+import * as React from "react";
+import { Meter } from "@base-ui/react/meter";
+import { jsx } from "react/jsx-runtime";
+var MeterRoot = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Meter.Root, {
+  ref,
+  className: cn("flex w-full flex-col gap-1", className),
+  ...props
+}));
+MeterRoot.displayName = "MeterRoot";
+var MeterLabel = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Meter.Label, {
+  ref,
+  className: cn("text-sm font-medium text-kraft", className),
+  ...props
+}));
+MeterLabel.displayName = "MeterLabel";
+var MeterTrack = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Meter.Track, {
+  ref,
+  className: cn("h-2 w-full overflow-hidden rounded-full bg-kraft/15", className),
+  ...props
+}));
+MeterTrack.displayName = "MeterTrack";
+var MeterIndicator = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Meter.Indicator, {
+  ref,
+  className: cn("h-full bg-ribbon transition-[width] duration-300", className),
+  ...props
+}));
+MeterIndicator.displayName = "MeterIndicator";
+var MeterValue = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Meter.Value, {
+  ref,
+  className: cn("text-xs text-kraft/60", className),
+  ...props
+}));
+MeterValue.displayName = "MeterValue";
+export {
+  MeterValue,
+  MeterTrack,
+  MeterRoot,
+  MeterLabel,
+  MeterIndicator
+};
+export { MeterRoot, MeterLabel, MeterTrack, MeterIndicator, MeterValue };
+
+//# debugId=303D7D53D891184B64756E2164756E21

package/dist/components/Meter/index.js.map

@@ -0,0 +1,10 @@
+{
+  "version": 3,
+  "sources": ["../src/components/Meter/Meter.tsx"],
+  "sourcesContent": [
+    "import * as React from 'react';\nimport { Meter } from '@base-ui/react/meter';\nimport { cn } from '../../utils/cn';\n\nexport const MeterRoot = React.forwardRef<\n    HTMLDivElement,\n    React.ComponentPropsWithoutRef<typeof Meter.Root>\n>(({ className, ...props }, ref) => (\n    <Meter.Root\n        ref={ref}\n        className={cn('flex w-full flex-col gap-1', className)}\n        {...props}\n    />\n));\nMeterRoot.displayName = 'MeterRoot';\n\nexport const MeterLabel = React.forwardRef<\n    HTMLSpanElement,\n    React.ComponentPropsWithoutRef<typeof Meter.Label>\n>(({ className, ...props }, ref) => (\n    <Meter.Label\n        ref={ref}\n        className={cn('text-sm font-medium text-kraft', className)}\n        {...props}\n    />\n));\nMeterLabel.displayName = 'MeterLabel';\n\nexport const MeterTrack = React.forwardRef<\n    HTMLDivElement,\n    React.ComponentPropsWithoutRef<typeof Meter.Track>\n>(({ className, ...props }, ref) => (\n    <Meter.Track\n        ref={ref}\n        className={cn(\n            'h-2 w-full overflow-hidden rounded-full bg-kraft/15',\n            className\n        )}\n        {...props}\n    />\n));\nMeterTrack.displayName = 'MeterTrack';\n\nexport const MeterIndicator = React.forwardRef<\n    HTMLDivElement,\n    React.ComponentPropsWithoutRef<typeof Meter.Indicator>\n>(({ className, ...props }, ref) => (\n    <Meter.Indicator\n        ref={ref}\n        className={cn(\n            'h-full bg-ribbon transition-[width] duration-300',\n            className\n        )}\n        {...props}\n    />\n));\nMeterIndicator.displayName = 'MeterIndicator';\n\nexport const MeterValue = React.forwardRef<\n    HTMLSpanElement,\n    React.ComponentPropsWithoutRef<typeof Meter.Value>\n>(({ className, ...props }, ref) => (\n    <Meter.Value\n        ref={ref}\n        className={cn('text-xs text-kraft/60', className)}\n        {...props}\n    />\n));\nMeterValue.displayName = 'MeterValue';\n"
+  ],
+  "mappings": ";;;;;AAAA;AACA;;AAGO,IAAM,YAAkB,iBAG7B,GAAG,cAAc,SAAS,wBACxB,IAAC,MAAM,MAAP;AAAA,EACI;AAAA,EACA,WAAW,GAAG,8BAA8B,SAAS;AAAA,KACjD;AAAA,CACR,CACH;AACD,UAAU,cAAc;AAEjB,IAAM,aAAmB,iBAG9B,GAAG,cAAc,SAAS,wBACxB,IAAC,MAAM,OAAP;AAAA,EACI;AAAA,EACA,WAAW,GAAG,kCAAkC,SAAS;AAAA,KACrD;AAAA,CACR,CACH;AACD,WAAW,cAAc;AAElB,IAAM,aAAmB,iBAG9B,GAAG,cAAc,SAAS,wBACxB,IAAC,MAAM,OAAP;AAAA,EACI;AAAA,EACA,WAAW,GACP,uDACA,SACJ;AAAA,KACI;AAAA,CACR,CACH;AACD,WAAW,cAAc;AAElB,IAAM,iBAAuB,iBAGlC,GAAG,cAAc,SAAS,wBACxB,IAAC,MAAM,WAAP;AAAA,EACI;AAAA,EACA,WAAW,GACP,oDACA,SACJ;AAAA,KACI;AAAA,CACR,CACH;AACD,eAAe,cAAc;AAEtB,IAAM,aAAmB,iBAG9B,GAAG,cAAc,SAAS,wBACxB,IAAC,MAAM,OAAP;AAAA,EACI;AAAA,EACA,WAAW,GAAG,yBAAyB,SAAS;AAAA,KAC5C;AAAA,CACR,CACH;AACD,WAAW,cAAc;",
+  "debugId": "303D7D53D891184B64756E2164756E21",
+  "names": []
+}

package/dist/components/NavigationMenu/NavigationMenu.d.ts

@@ -0,0 +1,12 @@
+import * as React from 'react';
+export declare const NavigationMenuPortal: React.ForwardRefExoticComponent<Omit<import("@base-ui/react").NavigationMenuPortalProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const NavigationMenuRoot: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").NavigationMenuRootProps, "ref"> & React.RefAttributes<HTMLElement>, "ref"> & React.RefAttributes<HTMLElement>>;
+export declare const NavigationMenuList: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").NavigationMenuListProps, "ref"> & React.RefAttributes<HTMLUListElement>, "ref"> & React.RefAttributes<HTMLUListElement>>;
+export declare const NavigationMenuItem: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").NavigationMenuItemProps, "ref"> & React.RefAttributes<HTMLLIElement>, "ref"> & React.RefAttributes<HTMLLIElement>>;
+export declare const NavigationMenuTrigger: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").NavigationMenuTriggerProps, "ref"> & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export declare const NavigationMenuIcon: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").NavigationMenuIconProps, "ref"> & React.RefAttributes<HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+export declare const NavigationMenuPositioner: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").NavigationMenuPositionerProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const NavigationMenuViewport: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").NavigationMenuViewportProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const NavigationMenuPopup: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").NavigationMenuPopupProps, "ref"> & React.RefAttributes<HTMLElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const NavigationMenuContent: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").NavigationMenuContentProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const NavigationMenuLink: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").NavigationMenuLinkProps, "ref"> & React.RefAttributes<HTMLAnchorElement>, "ref"> & React.RefAttributes<HTMLAnchorElement>>;

package/dist/components/NavigationMenu/NavigationMenu.stories.d.ts

@@ -0,0 +1,5 @@
+import type { Meta, StoryObj } from '@storybook/react-vite';
+declare const meta: Meta;
+export default meta;
+type Story = StoryObj;
+export declare const Default: Story;

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

@@ -0,0 +1 @@
+export { NavigationMenuPortal, NavigationMenuRoot, NavigationMenuList, NavigationMenuItem, NavigationMenuTrigger, NavigationMenuIcon, NavigationMenuPositioner, NavigationMenuViewport, NavigationMenuPopup, NavigationMenuContent, NavigationMenuLink } from './NavigationMenu';

package/dist/components/NavigationMenu/index.js

@@ -0,0 +1,100 @@
+import {
+  cn
+} from "../../utils/cn.js";
+
+// src/components/NavigationMenu/NavigationMenu.tsx
+import * as React from "react";
+import { NavigationMenu } from "@base-ui/react/navigation-menu";
+import { jsx } from "react/jsx-runtime";
+var NavigationMenuPortal = NavigationMenu.Portal;
+var NavigationMenuRoot = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(NavigationMenu.Root, {
+  ref,
+  className: cn("relative flex items-center", className),
+  ...props
+}));
+NavigationMenuRoot.displayName = "NavigationMenuRoot";
+var NavigationMenuList = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(NavigationMenu.List, {
+  ref,
+  className: cn("flex flex-1 list-none items-center justify-center gap-1", className),
+  ...props
+}));
+NavigationMenuList.displayName = "NavigationMenuList";
+var NavigationMenuItem = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(NavigationMenu.Item, {
+  ref,
+  className: cn("relative", className),
+  ...props
+}));
+NavigationMenuItem.displayName = "NavigationMenuItem";
+var NavigationMenuTrigger = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(NavigationMenu.Trigger, {
+  ref,
+  className: cn("group inline-flex h-9 items-center justify-center gap-1 rounded-lg bg-transparent px-3 py-2 text-sm font-medium text-kraft transition-colors hover:bg-canvas/40 hover:text-kraft focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ribbon data-popup-open:bg-canvas/40", className),
+  ...props
+}));
+NavigationMenuTrigger.displayName = "NavigationMenuTrigger";
+var NavigationMenuIcon = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(NavigationMenu.Icon, {
+  ref,
+  className: cn("relative top-px ml-0.5 transition-transform duration-200 group-data-popup-open:rotate-180", className),
+  ...props,
+  children: children ?? /* @__PURE__ */ jsx("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "12",
+    height: "12",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2.5",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    "aria-hidden": true,
+    children: /* @__PURE__ */ jsx("polyline", {
+      points: "6 9 12 15 18 9"
+    })
+  })
+}));
+NavigationMenuIcon.displayName = "NavigationMenuIcon";
+var NavigationMenuPositioner = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(NavigationMenu.Positioner, {
+  ref,
+  className: cn("absolute top-full left-0 z-50", className),
+  ...props
+}));
+NavigationMenuPositioner.displayName = "NavigationMenuPositioner";
+var NavigationMenuViewport = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(NavigationMenu.Viewport, {
+  ref,
+  className: cn("mt-1 overflow-hidden rounded-xl border border-kraft/15 bg-surface shadow-lg shadow-kraft/10", "transition-[width,height] duration-200 origin-top-left", className),
+  ...props
+}));
+NavigationMenuViewport.displayName = "NavigationMenuViewport";
+var NavigationMenuPopup = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(NavigationMenu.Popup, {
+  ref,
+  className: cn("p-1", className),
+  ...props
+}));
+NavigationMenuPopup.displayName = "NavigationMenuPopup";
+var NavigationMenuContent = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(NavigationMenu.Content, {
+  ref,
+  className: cn("p-3", className),
+  ...props
+}));
+NavigationMenuContent.displayName = "NavigationMenuContent";
+var NavigationMenuLink = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(NavigationMenu.Link, {
+  ref,
+  className: cn("block select-none rounded-lg px-3 py-2 text-sm text-kraft leading-snug no-underline outline-none transition-colors hover:bg-canvas/40 focus-visible:bg-canvas/40", className),
+  ...props
+}));
+NavigationMenuLink.displayName = "NavigationMenuLink";
+export {
+  NavigationMenuViewport,
+  NavigationMenuTrigger,
+  NavigationMenuRoot,
+  NavigationMenuPositioner,
+  NavigationMenuPortal,
+  NavigationMenuPopup,
+  NavigationMenuList,
+  NavigationMenuLink,
+  NavigationMenuItem,
+  NavigationMenuIcon,
+  NavigationMenuContent
+};
+export { NavigationMenuPortal, NavigationMenuRoot, NavigationMenuList, NavigationMenuItem, NavigationMenuTrigger, NavigationMenuIcon, NavigationMenuPositioner, NavigationMenuViewport, NavigationMenuPopup, NavigationMenuContent, NavigationMenuLink };
+
+//# debugId=A43D4C7F728B250464756E2164756E21