harebear-ui 0.0.0-stage → 0.1.0

package/dist/components/ui/input-group.js

@@ -0,0 +1,77 @@
+"use client";
+import { cn } from "../../lib/utils.js";
+import { Button } from "./button.js";
+import { Input } from "./input.js";
+import { Textarea } from "./textarea.js";
+import { jsx } from "react/jsx-runtime";
+import { cva } from "class-variance-authority";
+// src/components/ui/input-group.tsx
+function InputGroup({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "input-group",
+		role: "group",
+		className: cn("group/input-group relative flex h-8 w-full min-w-0 items-center rounded-lg border border-input transition-colors outline-none in-data-[slot=combobox-content]:focus-within:border-inherit in-data-[slot=combobox-content]:focus-within:ring-0 has-disabled:bg-input/50 has-disabled:opacity-50 has-[[data-slot=input-group-control]:focus-visible]:border-ring has-[[data-slot=input-group-control]:focus-visible]:ring-3 has-[[data-slot=input-group-control]:focus-visible]:ring-ring/50 has-[[data-slot][aria-invalid=true]]:border-destructive has-[[data-slot][aria-invalid=true]]:ring-3 has-[[data-slot][aria-invalid=true]]:ring-destructive/20 has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>textarea]:h-auto dark:bg-input/30 dark:has-disabled:bg-input/80 dark:has-[[data-slot][aria-invalid=true]]:ring-destructive/40 has-[>[data-align=block-end]]:[&>input]:pt-3 has-[>[data-align=block-start]]:[&>input]:pb-3 has-[>[data-align=inline-end]]:[&>input]:pr-1.5 has-[>[data-align=inline-start]]:[&>input]:pl-1.5", className),
+		...props
+	});
+}
+const inputGroupAddonVariants = cva("flex h-auto cursor-text items-center justify-center gap-2 py-1.5 text-sm font-medium text-muted-foreground select-none group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4", {
+	variants: { align: {
+		"inline-start": "order-first pl-2 has-[>button]:ml-[-0.3rem] has-[>kbd]:ml-[-0.15rem]",
+		"inline-end": "order-last pr-2 has-[>button]:mr-[-0.3rem] has-[>kbd]:mr-[-0.15rem]",
+		"block-start": "order-first w-full justify-start px-2.5 pt-2 group-has-[>input]/input-group:pt-2 [.border-b]:pb-2",
+		"block-end": "order-last w-full justify-start px-2.5 pb-2 group-has-[>input]/input-group:pb-2 [.border-t]:pt-2"
+	} },
+	defaultVariants: { align: "inline-start" }
+});
+function InputGroupAddon({ className, align = "inline-start", ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		role: "group",
+		"data-slot": "input-group-addon",
+		"data-align": align,
+		className: cn(inputGroupAddonVariants({ align }), className),
+		onClick: (e) => {
+			if (e.target.closest("button")) return;
+			e.currentTarget.parentElement?.querySelector("input")?.focus();
+		},
+		...props
+	});
+}
+const inputGroupButtonVariants = cva("flex items-center gap-2 text-sm shadow-none", {
+	variants: { size: {
+		xs: "h-6 gap-1 rounded-[calc(var(--radius)-3px)] px-1.5 [&>svg:not([class*='size-'])]:size-3.5",
+		sm: "",
+		"icon-xs": "size-6 rounded-[calc(var(--radius)-3px)] p-0 has-[>svg]:p-0",
+		"icon-sm": "size-8 p-0 has-[>svg]:p-0"
+	} },
+	defaultVariants: { size: "xs" }
+});
+function InputGroupButton({ className, type = "button", variant = "ghost", size = "xs", ...props }) {
+	return /* @__PURE__ */ jsx(Button, {
+		type,
+		"data-size": size,
+		variant,
+		className: cn(inputGroupButtonVariants({ size }), className),
+		...props
+	});
+}
+function InputGroupText({ className, ...props }) {
+	return /* @__PURE__ */ jsx("span", {
+		className: cn("flex items-center gap-2 text-sm text-muted-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4", className),
+		...props
+	});
+}
+function InputGroupInput({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Input, {
+		"data-slot": "input-group-control",
+		className: cn("flex-1 rounded-none border-0 bg-transparent shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent", className),
+		...props
+	});
+}
+function InputGroupTextarea({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Textarea, {
+		"data-slot": "input-group-control",
+		className: cn("flex-1 resize-none rounded-none border-0 bg-transparent py-2 shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent", className),
+		...props
+	});
+}
+export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea };

package/dist/components/ui/input-otp.d.ts

@@ -0,0 +1,11 @@
+import * as React from "react";
+import { OTPInput } from "input-otp";
+declare function InputOTP({ className, containerClassName, ...props }: React.ComponentProps<typeof OTPInput> & {
+  containerClassName?: string;
+}): React.JSX.Element;
+declare function InputOTPGroup({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function InputOTPSlot({ index, className, ...props }: React.ComponentProps<"div"> & {
+  index: number;
+}): React.JSX.Element;
+declare function InputOTPSeparator({ ...props }: React.ComponentProps<"div">): React.JSX.Element;
+export { InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot };

package/dist/components/ui/input-otp.js

@@ -0,0 +1,46 @@
+"use client";
+import { cn } from "../../lib/utils.js";
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { MinusIcon } from "lucide-react";
+import { OTPInput, OTPInputContext } from "input-otp";
+// src/components/ui/input-otp.tsx
+function InputOTP({ className, containerClassName, ...props }) {
+	return /* @__PURE__ */ jsx(OTPInput, {
+		"data-slot": "input-otp",
+		containerClassName: cn("cn-input-otp flex items-center has-disabled:opacity-50", containerClassName),
+		spellCheck: false,
+		className: cn("disabled:cursor-not-allowed", className),
+		...props
+	});
+}
+function InputOTPGroup({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "input-otp-group",
+		className: cn("flex items-center rounded-lg has-aria-invalid:border-destructive has-aria-invalid:ring-3 has-aria-invalid:ring-destructive/20 dark:has-aria-invalid:ring-destructive/40", className),
+		...props
+	});
+}
+function InputOTPSlot({ index, className, ...props }) {
+	const { char, hasFakeCaret, isActive } = React.useContext(OTPInputContext)?.slots[index] ?? {};
+	return /* @__PURE__ */ jsxs("div", {
+		"data-slot": "input-otp-slot",
+		"data-active": isActive,
+		className: cn("relative flex size-8 items-center justify-center border-y border-r border-input text-sm transition-all outline-none first:rounded-l-lg first:border-l last:rounded-r-lg aria-invalid:border-destructive data-[active=true]:z-10 data-[active=true]:border-ring data-[active=true]:ring-3 data-[active=true]:ring-ring/50 data-[active=true]:aria-invalid:border-destructive data-[active=true]:aria-invalid:ring-destructive/20 dark:bg-input/30 dark:data-[active=true]:aria-invalid:ring-destructive/40", className),
+		...props,
+		children: [char, hasFakeCaret && /* @__PURE__ */ jsx("div", {
+			className: "pointer-events-none absolute inset-0 flex items-center justify-center",
+			children: /* @__PURE__ */ jsx("div", { className: "h-4 w-px animate-caret-blink bg-foreground duration-1000" })
+		})]
+	});
+}
+function InputOTPSeparator({ ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "input-otp-separator",
+		className: "flex items-center [&_svg:not([class*='size-'])]:size-4",
+		role: "separator",
+		...props,
+		children: /* @__PURE__ */ jsx(MinusIcon, {})
+	});
+}
+export { InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot };

package/dist/components/ui/input.d.ts

@@ -0,0 +1,3 @@
+import * as React from "react";
+declare function Input({ className, type, ...props }: React.ComponentProps<"input">): React.JSX.Element;
+export { Input };

package/dist/components/ui/input.js

@@ -0,0 +1,13 @@
+"use client";
+import { cn } from "../../lib/utils.js";
+import { jsx } from "react/jsx-runtime";
+// src/components/ui/input.tsx
+function Input({ className, type, ...props }) {
+	return /* @__PURE__ */ jsx("input", {
+		type,
+		"data-slot": "input",
+		className: cn("h-10 w-full min-w-0 py-1 file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground [&::-webkit-search-cancel-button]:hidden rounded-md border border-transparent bg-muted px-3.5 text-base transition-[border-color,box-shadow,background-color] outline-none placeholder:text-muted-foreground focus-visible:border-primary focus-visible:bg-card focus-visible:ring-4 focus-visible:ring-primary/15 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-4 aria-invalid:ring-destructive/15 md:text-sm", className),
+		...props
+	});
+}
+export { Input };

package/dist/components/ui/item.d.ts

@@ -0,0 +1,23 @@
+import { Separator } from "./separator.js";
+import * as React from "react";
+import { VariantProps } from "class-variance-authority";
+declare function ItemGroup({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function ItemSeparator({ className, ...props }: React.ComponentProps<typeof Separator>): React.JSX.Element;
+declare const itemVariants: (props?: ({
+  variant?: "default" | "muted" | "outline" | null | undefined;
+  size?: "default" | "sm" | "xs" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare function Item({ className, variant, size, asChild, ...props }: React.ComponentProps<"div"> & VariantProps<typeof itemVariants> & {
+  asChild?: boolean;
+}): React.JSX.Element;
+declare const itemMediaVariants: (props?: ({
+  variant?: "default" | "icon" | "image" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare function ItemMedia({ className, variant, ...props }: React.ComponentProps<"div"> & VariantProps<typeof itemMediaVariants>): React.JSX.Element;
+declare function ItemContent({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function ItemTitle({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function ItemDescription({ className, ...props }: React.ComponentProps<"p">): React.JSX.Element;
+declare function ItemActions({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function ItemHeader({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function ItemFooter({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+export { Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle };

package/dist/components/ui/item.js

@@ -0,0 +1,117 @@
+"use client";
+import { cn } from "../../lib/utils.js";
+import { Separator as Separator$1 } from "./separator.js";
+import { jsx } from "react/jsx-runtime";
+import { cva } from "class-variance-authority";
+import { Slot } from "radix-ui";
+// src/components/ui/item.tsx
+function ItemGroup({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		role: "list",
+		"data-slot": "item-group",
+		className: cn("group/item-group flex w-full flex-col gap-4 has-data-[size=sm]:gap-2.5 has-data-[size=xs]:gap-2", className),
+		...props
+	});
+}
+function ItemSeparator({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Separator$1, {
+		"data-slot": "item-separator",
+		orientation: "horizontal",
+		className: cn("my-2", className),
+		...props
+	});
+}
+const itemVariants = cva("group/item flex w-full flex-wrap items-center rounded-lg border text-sm transition-colors duration-100 outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 [a]:transition-colors [a]:hover:bg-muted", {
+	variants: {
+		variant: {
+			default: "border-transparent",
+			outline: "border-border",
+			muted: "border-transparent bg-muted/50"
+		},
+		size: {
+			default: "gap-2.5 px-3 py-2.5",
+			sm: "gap-2.5 px-3 py-2.5",
+			xs: "gap-2 px-2.5 py-2 in-data-[slot=dropdown-menu-content]:p-0"
+		}
+	},
+	defaultVariants: {
+		variant: "default",
+		size: "default"
+	}
+});
+function Item({ className, variant = "default", size = "default", asChild = false, ...props }) {
+	const Comp = asChild ? Slot.Root : "div";
+	return /* @__PURE__ */ jsx(Comp, {
+		"data-slot": "item",
+		"data-variant": variant,
+		"data-size": size,
+		className: cn(itemVariants({
+			variant,
+			size,
+			className
+		})),
+		...props
+	});
+}
+const itemMediaVariants = cva("flex shrink-0 items-center justify-center gap-2 group-has-data-[slot=item-description]/item:translate-y-0.5 group-has-data-[slot=item-description]/item:self-start [&_svg]:pointer-events-none", {
+	variants: { variant: {
+		default: "bg-transparent",
+		icon: "[&_svg:not([class*='size-'])]:size-4",
+		image: "size-10 overflow-hidden rounded-sm group-data-[size=sm]/item:size-8 group-data-[size=xs]/item:size-6 [&_img]:size-full [&_img]:object-cover"
+	} },
+	defaultVariants: { variant: "default" }
+});
+function ItemMedia({ className, variant = "default", ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "item-media",
+		"data-variant": variant,
+		className: cn(itemMediaVariants({
+			variant,
+			className
+		})),
+		...props
+	});
+}
+function ItemContent({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "item-content",
+		className: cn("flex flex-1 flex-col gap-1 group-data-[size=xs]/item:gap-0 [&+[data-slot=item-content]]:flex-none", className),
+		...props
+	});
+}
+function ItemTitle({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "item-title",
+		className: cn("line-clamp-1 flex w-fit items-center gap-2 text-sm leading-snug font-medium underline-offset-4", className),
+		...props
+	});
+}
+function ItemDescription({ className, ...props }) {
+	return /* @__PURE__ */ jsx("p", {
+		"data-slot": "item-description",
+		className: cn("line-clamp-2 text-left text-sm leading-normal font-normal text-muted-foreground group-data-[size=xs]/item:text-xs [&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary", className),
+		...props
+	});
+}
+function ItemActions({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "item-actions",
+		className: cn("flex items-center gap-2", className),
+		...props
+	});
+}
+function ItemHeader({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "item-header",
+		className: cn("flex basis-full items-center justify-between gap-2", className),
+		...props
+	});
+}
+function ItemFooter({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "item-footer",
+		className: cn("flex basis-full items-center justify-between gap-2", className),
+		...props
+	});
+}
+export { Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle };

package/dist/components/ui/kbd.d.ts

@@ -0,0 +1,3 @@
+declare function Kbd({ className, ...props }: React.ComponentProps<"kbd">): import("react").JSX.Element;
+declare function KbdGroup({ className, ...props }: React.ComponentProps<"div">): import("react").JSX.Element;
+export { Kbd, KbdGroup };

package/dist/components/ui/kbd.js

@@ -0,0 +1,19 @@
+"use client";
+import { cn } from "../../lib/utils.js";
+import { jsx } from "react/jsx-runtime";
+// src/components/ui/kbd.tsx
+function Kbd({ className, ...props }) {
+	return /* @__PURE__ */ jsx("kbd", {
+		"data-slot": "kbd",
+		className: cn("pointer-events-none inline-flex h-5 w-fit min-w-5 items-center justify-center gap-1 rounded-[6px] border bg-card px-1.5 font-mono text-[11px] font-medium text-muted-foreground select-none in-data-[slot=tooltip-content]:bg-background/20 in-data-[slot=tooltip-content]:text-background dark:in-data-[slot=tooltip-content]:bg-background/10 [&_svg:not([class*='size-'])]:size-3", className),
+		...props
+	});
+}
+function KbdGroup({ className, ...props }) {
+	return /* @__PURE__ */ jsx("kbd", {
+		"data-slot": "kbd-group",
+		className: cn("inline-flex items-center gap-1", className),
+		...props
+	});
+}
+export { Kbd, KbdGroup };

package/dist/components/ui/label.d.ts

@@ -0,0 +1,4 @@
+import * as React from "react";
+import { Label as Label$1 } from "radix-ui";
+declare function Label({ className, ...props }: React.ComponentProps<typeof Label$1.Root>): React.JSX.Element;
+export { Label };

package/dist/components/ui/label.js

@@ -0,0 +1,13 @@
+"use client";
+import { cn } from "../../lib/utils.js";
+import { jsx } from "react/jsx-runtime";
+import { Label as Label$1 } from "radix-ui";
+// src/components/ui/label.tsx
+function Label({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Label$1.Root, {
+		"data-slot": "label",
+		className: cn("flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50", className),
+		...props
+	});
+}
+export { Label };

package/dist/components/ui/menubar.d.ts

@@ -0,0 +1,30 @@
+import * as React from "react";
+import { Menubar as Menubar$1 } from "radix-ui";
+declare function Menubar({ className, ...props }: React.ComponentProps<typeof Menubar$1.Root>): React.JSX.Element;
+declare function MenubarMenu({ ...props }: React.ComponentProps<typeof Menubar$1.Menu>): React.JSX.Element;
+declare function MenubarGroup({ ...props }: React.ComponentProps<typeof Menubar$1.Group>): React.JSX.Element;
+declare function MenubarPortal({ ...props }: React.ComponentProps<typeof Menubar$1.Portal>): React.JSX.Element;
+declare function MenubarRadioGroup({ ...props }: React.ComponentProps<typeof Menubar$1.RadioGroup>): React.JSX.Element;
+declare function MenubarTrigger({ className, ...props }: React.ComponentProps<typeof Menubar$1.Trigger>): React.JSX.Element;
+declare function MenubarContent({ className, align, alignOffset, sideOffset, ...props }: React.ComponentProps<typeof Menubar$1.Content>): React.JSX.Element;
+declare function MenubarItem({ className, inset, variant, ...props }: React.ComponentProps<typeof Menubar$1.Item> & {
+  inset?: boolean;
+  variant?: "default" | "destructive";
+}): React.JSX.Element;
+declare function MenubarCheckboxItem({ className, children, checked, inset, ...props }: React.ComponentProps<typeof Menubar$1.CheckboxItem> & {
+  inset?: boolean;
+}): React.JSX.Element;
+declare function MenubarRadioItem({ className, children, inset, ...props }: React.ComponentProps<typeof Menubar$1.RadioItem> & {
+  inset?: boolean;
+}): React.JSX.Element;
+declare function MenubarLabel({ className, inset, ...props }: React.ComponentProps<typeof Menubar$1.Label> & {
+  inset?: boolean;
+}): React.JSX.Element;
+declare function MenubarSeparator({ className, ...props }: React.ComponentProps<typeof Menubar$1.Separator>): React.JSX.Element;
+declare function MenubarShortcut({ className, ...props }: React.ComponentProps<"span">): React.JSX.Element;
+declare function MenubarSub({ ...props }: React.ComponentProps<typeof Menubar$1.Sub>): React.JSX.Element;
+declare function MenubarSubTrigger({ className, inset, children, ...props }: React.ComponentProps<typeof Menubar$1.SubTrigger> & {
+  inset?: boolean;
+}): React.JSX.Element;
+declare function MenubarSubContent({ className, ...props }: React.ComponentProps<typeof Menubar$1.SubContent>): React.JSX.Element;
+export { Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger };

package/dist/components/ui/menubar.js

@@ -0,0 +1,133 @@
+"use client";
+import { cn } from "../../lib/utils.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { CheckIcon, ChevronRightIcon } from "lucide-react";
+import { Menubar as Menubar$1 } from "radix-ui";
+// src/components/ui/menubar.tsx
+function Menubar({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Menubar$1.Root, {
+		"data-slot": "menubar",
+		className: cn("flex h-8 items-center gap-0.5 rounded-lg border p-[3px]", className),
+		...props
+	});
+}
+function MenubarMenu({ ...props }) {
+	return /* @__PURE__ */ jsx(Menubar$1.Menu, {
+		"data-slot": "menubar-menu",
+		...props
+	});
+}
+function MenubarGroup({ ...props }) {
+	return /* @__PURE__ */ jsx(Menubar$1.Group, {
+		"data-slot": "menubar-group",
+		...props
+	});
+}
+function MenubarPortal({ ...props }) {
+	return /* @__PURE__ */ jsx(Menubar$1.Portal, {
+		"data-slot": "menubar-portal",
+		...props
+	});
+}
+function MenubarRadioGroup({ ...props }) {
+	return /* @__PURE__ */ jsx(Menubar$1.RadioGroup, {
+		"data-slot": "menubar-radio-group",
+		...props
+	});
+}
+function MenubarTrigger({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Menubar$1.Trigger, {
+		"data-slot": "menubar-trigger",
+		className: cn("flex items-center rounded-sm px-1.5 py-[2px] text-sm font-medium outline-hidden select-none hover:bg-muted aria-expanded:bg-muted", className),
+		...props
+	});
+}
+function MenubarContent({ className, align = "start", alignOffset = -4, sideOffset = 8, ...props }) {
+	return /* @__PURE__ */ jsx(MenubarPortal, { children: /* @__PURE__ */ jsx(Menubar$1.Content, {
+		"data-slot": "menubar-content",
+		align,
+		alignOffset,
+		sideOffset,
+		className: cn("z-50 min-w-36 origin-(--radix-menubar-content-transform-origin) overflow-hidden rounded-lg bg-popover p-1 text-popover-foreground shadow-md ring-1 ring-foreground/10 duration-100 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95", className),
+		...props
+	}) });
+}
+function MenubarItem({ className, inset, variant = "default", ...props }) {
+	return /* @__PURE__ */ jsx(Menubar$1.Item, {
+		"data-slot": "menubar-item",
+		"data-inset": inset,
+		"data-variant": variant,
+		className: cn("group/menubar-item relative flex cursor-default items-center gap-1.5 rounded-md px-1.5 py-1 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-inset:pl-7 data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive dark:data-[variant=destructive]:focus:bg-destructive/20 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 data-[variant=destructive]:*:[svg]:text-destructive!", className),
+		...props
+	});
+}
+function MenubarCheckboxItem({ className, children, checked, inset, ...props }) {
+	return /* @__PURE__ */ jsxs(Menubar$1.CheckboxItem, {
+		"data-slot": "menubar-checkbox-item",
+		"data-inset": inset,
+		className: cn("relative flex cursor-default items-center gap-1.5 rounded-md py-1 pr-1.5 pl-7 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground focus:**:text-accent-foreground data-inset:pl-7 data-disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0", className),
+		checked,
+		...props,
+		children: [/* @__PURE__ */ jsx("span", {
+			className: "pointer-events-none absolute left-1.5 flex size-4 items-center justify-center [&_svg:not([class*='size-'])]:size-4",
+			children: /* @__PURE__ */ jsx(Menubar$1.ItemIndicator, { children: /* @__PURE__ */ jsx(CheckIcon, {}) })
+		}), children]
+	});
+}
+function MenubarRadioItem({ className, children, inset, ...props }) {
+	return /* @__PURE__ */ jsxs(Menubar$1.RadioItem, {
+		"data-slot": "menubar-radio-item",
+		"data-inset": inset,
+		className: cn("relative flex cursor-default items-center gap-1.5 rounded-md py-1 pr-1.5 pl-7 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground focus:**:text-accent-foreground data-inset:pl-7 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
+		...props,
+		children: [/* @__PURE__ */ jsx("span", {
+			className: "pointer-events-none absolute left-1.5 flex size-4 items-center justify-center [&_svg:not([class*='size-'])]:size-4",
+			children: /* @__PURE__ */ jsx(Menubar$1.ItemIndicator, { children: /* @__PURE__ */ jsx(CheckIcon, {}) })
+		}), children]
+	});
+}
+function MenubarLabel({ className, inset, ...props }) {
+	return /* @__PURE__ */ jsx(Menubar$1.Label, {
+		"data-slot": "menubar-label",
+		"data-inset": inset,
+		className: cn("px-1.5 py-1 text-sm font-medium data-inset:pl-7", className),
+		...props
+	});
+}
+function MenubarSeparator({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Menubar$1.Separator, {
+		"data-slot": "menubar-separator",
+		className: cn("-mx-1 my-1 h-px bg-border", className),
+		...props
+	});
+}
+function MenubarShortcut({ className, ...props }) {
+	return /* @__PURE__ */ jsx("span", {
+		"data-slot": "menubar-shortcut",
+		className: cn("ml-auto text-xs tracking-widest text-muted-foreground group-focus/menubar-item:text-accent-foreground", className),
+		...props
+	});
+}
+function MenubarSub({ ...props }) {
+	return /* @__PURE__ */ jsx(Menubar$1.Sub, {
+		"data-slot": "menubar-sub",
+		...props
+	});
+}
+function MenubarSubTrigger({ className, inset, children, ...props }) {
+	return /* @__PURE__ */ jsxs(Menubar$1.SubTrigger, {
+		"data-slot": "menubar-sub-trigger",
+		"data-inset": inset,
+		className: cn("flex cursor-default items-center gap-1.5 rounded-md px-1.5 py-1 text-sm outline-none select-none focus:bg-accent focus:text-accent-foreground data-inset:pl-7 data-open:bg-accent data-open:text-accent-foreground [&_svg:not([class*='size-'])]:size-4", className),
+		...props,
+		children: [children, /* @__PURE__ */ jsx(ChevronRightIcon, { className: "ml-auto size-4" })]
+	});
+}
+function MenubarSubContent({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Menubar$1.SubContent, {
+		"data-slot": "menubar-sub-content",
+		className: cn("z-50 min-w-32 origin-(--radix-menubar-content-transform-origin) overflow-hidden rounded-lg bg-popover p-1 text-popover-foreground shadow-lg ring-1 ring-foreground/10 duration-100 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", className),
+		...props
+	});
+}
+export { Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger };

package/dist/components/ui/navigation-menu.d.ts

@@ -0,0 +1,14 @@
+import * as React from "react";
+import { NavigationMenu as NavigationMenu$1 } from "radix-ui";
+declare function NavigationMenu({ className, children, viewport, ...props }: React.ComponentProps<typeof NavigationMenu$1.Root> & {
+  viewport?: boolean;
+}): React.JSX.Element;
+declare function NavigationMenuList({ className, ...props }: React.ComponentProps<typeof NavigationMenu$1.List>): React.JSX.Element;
+declare function NavigationMenuItem({ className, ...props }: React.ComponentProps<typeof NavigationMenu$1.Item>): React.JSX.Element;
+declare const navigationMenuTriggerStyle: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+declare function NavigationMenuTrigger({ className, children, ...props }: React.ComponentProps<typeof NavigationMenu$1.Trigger>): React.JSX.Element;
+declare function NavigationMenuContent({ className, ...props }: React.ComponentProps<typeof NavigationMenu$1.Content>): React.JSX.Element;
+declare function NavigationMenuViewport({ className, ...props }: React.ComponentProps<typeof NavigationMenu$1.Viewport>): React.JSX.Element;
+declare function NavigationMenuLink({ className, ...props }: React.ComponentProps<typeof NavigationMenu$1.Link>): React.JSX.Element;
+declare function NavigationMenuIndicator({ className, ...props }: React.ComponentProps<typeof NavigationMenu$1.Indicator>): React.JSX.Element;
+export { NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, navigationMenuTriggerStyle };

package/dist/components/ui/navigation-menu.js

@@ -0,0 +1,79 @@
+"use client";
+import { cn } from "../../lib/utils.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { ChevronDownIcon } from "lucide-react";
+import { cva } from "class-variance-authority";
+import { NavigationMenu as NavigationMenu$1 } from "radix-ui";
+// src/components/ui/navigation-menu.tsx
+function NavigationMenu({ className, children, viewport = true, ...props }) {
+	return /* @__PURE__ */ jsxs(NavigationMenu$1.Root, {
+		"data-slot": "navigation-menu",
+		"data-viewport": viewport,
+		className: cn("group/navigation-menu relative flex max-w-max flex-1 items-center justify-center", className),
+		...props,
+		children: [children, viewport && /* @__PURE__ */ jsx(NavigationMenuViewport, {})]
+	});
+}
+function NavigationMenuList({ className, ...props }) {
+	return /* @__PURE__ */ jsx(NavigationMenu$1.List, {
+		"data-slot": "navigation-menu-list",
+		className: cn("group flex flex-1 list-none items-center justify-center gap-0", className),
+		...props
+	});
+}
+function NavigationMenuItem({ className, ...props }) {
+	return /* @__PURE__ */ jsx(NavigationMenu$1.Item, {
+		"data-slot": "navigation-menu-item",
+		className: cn("relative", className),
+		...props
+	});
+}
+const navigationMenuTriggerStyle = cva("group/navigation-menu-trigger inline-flex h-9 w-max items-center justify-center rounded-lg px-2.5 py-1.5 text-sm font-medium transition-all outline-none hover:bg-muted focus:bg-muted focus-visible:ring-3 focus-visible:ring-ring/50 focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-popup-open:bg-muted/50 data-popup-open:hover:bg-muted data-open:bg-muted/50 data-open:hover:bg-muted data-open:focus:bg-muted");
+function NavigationMenuTrigger({ className, children, ...props }) {
+	return /* @__PURE__ */ jsxs(NavigationMenu$1.Trigger, {
+		"data-slot": "navigation-menu-trigger",
+		className: cn(navigationMenuTriggerStyle(), "group", className),
+		...props,
+		children: [
+			children,
+			" ",
+			/* @__PURE__ */ jsx(ChevronDownIcon, {
+				className: "relative top-px ml-1 size-3 transition duration-300 group-data-popup-open/navigation-menu-trigger:rotate-180 group-data-open/navigation-menu-trigger:rotate-180",
+				"aria-hidden": "true"
+			})
+		]
+	});
+}
+function NavigationMenuContent({ className, ...props }) {
+	return /* @__PURE__ */ jsx(NavigationMenu$1.Content, {
+		"data-slot": "navigation-menu-content",
+		className: cn("top-0 left-0 w-full p-1 ease-[cubic-bezier(0.22,1,0.36,1)] group-data-[viewport=false]/navigation-menu:top-full group-data-[viewport=false]/navigation-menu:mt-1.5 group-data-[viewport=false]/navigation-menu:overflow-hidden group-data-[viewport=false]/navigation-menu:rounded-lg group-data-[viewport=false]/navigation-menu:bg-popover group-data-[viewport=false]/navigation-menu:text-popover-foreground group-data-[viewport=false]/navigation-menu:shadow group-data-[viewport=false]/navigation-menu:ring-1 group-data-[viewport=false]/navigation-menu:ring-foreground/10 group-data-[viewport=false]/navigation-menu:duration-300 data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 data-[motion^=from-]:animate-in data-[motion^=from-]:fade-in data-[motion^=to-]:animate-out data-[motion^=to-]:fade-out **:data-[slot=navigation-menu-link]:focus:ring-0 **:data-[slot=navigation-menu-link]:focus:outline-none md:absolute md:w-auto group-data-[viewport=false]/navigation-menu:data-open:animate-in group-data-[viewport=false]/navigation-menu:data-open:fade-in-0 group-data-[viewport=false]/navigation-menu:data-open:zoom-in-95 group-data-[viewport=false]/navigation-menu:data-closed:animate-out group-data-[viewport=false]/navigation-menu:data-closed:fade-out-0 group-data-[viewport=false]/navigation-menu:data-closed:zoom-out-95", className),
+		...props
+	});
+}
+function NavigationMenuViewport({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		className: cn("absolute top-full left-0 isolate z-50 flex justify-center"),
+		children: /* @__PURE__ */ jsx(NavigationMenu$1.Viewport, {
+			"data-slot": "navigation-menu-viewport",
+			className: cn("origin-top-center relative mt-1.5 h-(--radix-navigation-menu-viewport-height) w-full overflow-hidden rounded-lg bg-popover text-popover-foreground shadow ring-1 ring-foreground/10 duration-100 md:w-(--radix-navigation-menu-viewport-width) data-open:animate-in data-open:zoom-in-90 data-closed:animate-out data-closed:zoom-out-90", className),
+			...props
+		})
+	});
+}
+function NavigationMenuLink({ className, ...props }) {
+	return /* @__PURE__ */ jsx(NavigationMenu$1.Link, {
+		"data-slot": "navigation-menu-link",
+		className: cn("flex items-center gap-2 rounded-lg p-2 text-sm transition-all outline-none hover:bg-muted focus:bg-muted focus-visible:ring-3 focus-visible:ring-ring/50 focus-visible:outline-1 in-data-[slot=navigation-menu-content]:rounded-md data-active:bg-muted/50 data-active:hover:bg-muted data-active:focus:bg-muted [&_svg:not([class*='size-'])]:size-4", className),
+		...props
+	});
+}
+function NavigationMenuIndicator({ className, ...props }) {
+	return /* @__PURE__ */ jsx(NavigationMenu$1.Indicator, {
+		"data-slot": "navigation-menu-indicator",
+		className: cn("top-full z-1 flex h-1.5 items-end justify-center overflow-hidden data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:animate-in data-[state=visible]:fade-in", className),
+		...props,
+		children: /* @__PURE__ */ jsx("div", { className: "relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm bg-border shadow-md" })
+	});
+}
+export { NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, navigationMenuTriggerStyle };

package/dist/components/ui/pagination.d.ts

@@ -0,0 +1,17 @@
+import { Button } from "./button.js";
+import * as React from "react";
+declare function Pagination({ className, ...props }: React.ComponentProps<"nav">): React.JSX.Element;
+declare function PaginationContent({ className, ...props }: React.ComponentProps<"ul">): React.JSX.Element;
+declare function PaginationItem({ ...props }: React.ComponentProps<"li">): React.JSX.Element;
+type PaginationLinkProps = {
+  isActive?: boolean;
+} & Pick<React.ComponentProps<typeof Button>, "size"> & React.ComponentProps<"a">;
+declare function PaginationLink({ className, isActive, size, ...props }: PaginationLinkProps): React.JSX.Element;
+declare function PaginationPrevious({ className, text, ...props }: React.ComponentProps<typeof PaginationLink> & {
+  text?: string;
+}): React.JSX.Element;
+declare function PaginationNext({ className, text, ...props }: React.ComponentProps<typeof PaginationLink> & {
+  text?: string;
+}): React.JSX.Element;
+declare function PaginationEllipsis({ className, ...props }: React.ComponentProps<"span">): React.JSX.Element;
+export { Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious };