@vibesdotdev/kit 0.0.0-stage → 1.0.0-rc.3

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

@@ -0,0 +1,47 @@
+import { type VariantProps } from 'tailwind-variants';
+export declare const itemVariants: import("tailwind-variants").TVReturnType<{
+    variant: {
+        default: "bg-transparent";
+        outline: "border-border";
+        muted: "bg-muted/50";
+    };
+    size: {
+        default: "gap-4 p-4";
+        sm: "gap-2.5 px-4 py-3";
+    };
+}, undefined, "group/item [a]:hover:bg-accent/50 [a]:transition-colors focus-visible:border-ring focus-visible:ring-ring/50 flex flex-wrap items-center rounded-md border border-transparent text-sm outline-none transition-colors duration-100 focus-visible:ring-[3px]", {
+    variant: {
+        default: "bg-transparent";
+        outline: "border-border";
+        muted: "bg-muted/50";
+    };
+    size: {
+        default: "gap-4 p-4";
+        sm: "gap-2.5 px-4 py-3";
+    };
+}, undefined, import("tailwind-variants").TVReturnTypeLike<{
+    variant: {
+        default: "bg-transparent";
+        outline: "border-border";
+        muted: "bg-muted/50";
+    };
+    size: {
+        default: "gap-4 p-4";
+        sm: "gap-2.5 px-4 py-3";
+    };
+}, undefined>>;
+export type ItemSize = VariantProps<typeof itemVariants>['size'];
+export type ItemVariant = VariantProps<typeof itemVariants>['variant'];
+import { type WithElementRef } from '../../../utils.js';
+import type { HTMLAttributes } from 'svelte/elements';
+import type { Snippet } from 'svelte';
+type $$ComponentProps = WithElementRef<HTMLAttributes<HTMLDivElement>> & {
+    child?: Snippet<[{
+        props: HTMLAttributes<HTMLDivElement>;
+    }]>;
+    variant?: ItemVariant;
+    size?: ItemSize;
+};
+declare const Item: import("svelte").Component<$$ComponentProps, {}, "ref">;
+type Item = ReturnType<typeof Item>;
+export default Item;

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

@@ -0,0 +1,3 @@
+import Root from './kbd.svelte';
+import Group from './kbd-group.svelte';
+export { Root, Group, Root as Kbd, Group as KbdGroup };

package/dist/lib/components/ui/kbd/index.js

@@ -0,0 +1,5 @@
+import Root from './kbd.svelte';
+import Group from './kbd-group.svelte';
+export { Root, Group, 
+//
+Root as Kbd, Group as KbdGroup };

package/dist/lib/components/ui/kbd/kbd-group.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">import { cn } from "../../../utils.js";
+let { ref = $bindable(null), class: className, children, ...restProps } = $props();
+</script>
+
+<kbd
+	bind:this={ref}
+	data-slot="kbd-group"
+	class={cn('inline-flex items-center gap-1', className)}
+	{...restProps}
+>
+	{@render children?.()}
+</kbd>

package/dist/lib/components/ui/kbd/kbd-group.svelte.d.ts

@@ -0,0 +1,5 @@
+import { type WithElementRef } from '../../../utils.js';
+import type { HTMLAttributes } from 'svelte/elements';
+declare const KbdGroup: import("svelte").Component<WithElementRef<HTMLAttributes<HTMLElement>>, {}, "ref">;
+type KbdGroup = ReturnType<typeof KbdGroup>;
+export default KbdGroup;

package/dist/lib/components/ui/kbd/kbd.svelte

@@ -0,0 +1,17 @@
+<script lang="ts">import { cn } from "../../../utils.js";
+let { ref = $bindable(null), class: className, children, ...restProps } = $props();
+</script>
+
+<kbd
+	bind:this={ref}
+	data-slot="kbd"
+	class={cn(
+		'pointer-events-none inline-flex h-5 w-fit min-w-5 items-center justify-center gap-1 rounded-sm bg-muted px-1 font-sans text-xs font-medium text-muted-foreground select-none',
+		"[&_svg:not([class*='size-'])]:size-3",
+		'[[data-slot=tooltip-content]_&]:bg-background/20 [[data-slot=tooltip-content]_&]:text-background dark:[[data-slot=tooltip-content]_&]:bg-background/10',
+		className
+	)}
+	{...restProps}
+>
+	{@render children?.()}
+</kbd>

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

@@ -0,0 +1,5 @@
+import { type WithElementRef } from '../../../utils.js';
+import type { HTMLAttributes } from 'svelte/elements';
+declare const Kbd: import("svelte").Component<WithElementRef<HTMLAttributes<HTMLElement>>, {}, "ref">;
+type Kbd = ReturnType<typeof Kbd>;
+export default Kbd;

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

@@ -0,0 +1,2 @@
+import Root from './label.svelte';
+export { Root, Root as Label };

package/dist/lib/components/ui/label/index.js

@@ -0,0 +1,4 @@
+import Root from './label.svelte';
+export { Root, 
+//
+Root as Label };

package/dist/lib/components/ui/label/label.svelte

@@ -0,0 +1,14 @@
+<script lang="ts">import { Label as LabelPrimitive } from "bits-ui";
+import { cn } from "../../../utils.js";
+let { ref = $bindable(null), class: className, ...restProps } = $props();
+</script>
+
+<LabelPrimitive.Root
+	bind:ref
+	data-slot="label"
+	class={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
+	)}
+	{...restProps}
+/>

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

@@ -0,0 +1,4 @@
+import { Label as LabelPrimitive } from 'bits-ui';
+declare const Label: import("svelte").Component<LabelPrimitive.RootProps, {}, "ref">;
+type Label = ReturnType<typeof Label>;
+export default Label;

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

@@ -0,0 +1,37 @@
+import Root from './menubar.svelte';
+import Menu from './menubar-menu.svelte';
+import Sub from './menubar-sub.svelte';
+import RadioGroup from './menubar-radio-group.svelte';
+import CheckboxItem from './menubar-checkbox-item.svelte';
+import Content from './menubar-content.svelte';
+import Item from './menubar-item.svelte';
+import Group from './menubar-group.svelte';
+import RadioItem from './menubar-radio-item.svelte';
+import Separator from './menubar-separator.svelte';
+import Shortcut from './menubar-shortcut.svelte';
+import SubContent from './menubar-sub-content.svelte';
+import SubTrigger from './menubar-sub-trigger.svelte';
+import Trigger from './menubar-trigger.svelte';
+import Label from './menubar-label.svelte';
+import GroupHeading from './menubar-group-heading.svelte';
+import Portal from './menubar-portal.svelte';
+declare const Menubar: typeof Root & {
+    Root: typeof Root;
+    Menu: typeof Menu;
+    Sub: typeof Sub;
+    RadioGroup: typeof RadioGroup;
+    CheckboxItem: typeof CheckboxItem;
+    Content: typeof Content;
+    Item: typeof Item;
+    Group: typeof Group;
+    RadioItem: typeof RadioItem;
+    Separator: typeof Separator;
+    Shortcut: typeof Shortcut;
+    SubContent: typeof SubContent;
+    SubTrigger: typeof SubTrigger;
+    Trigger: typeof Trigger;
+    Label: typeof Label;
+    GroupHeading: typeof GroupHeading;
+    Portal: typeof Portal;
+};
+export { Root, CheckboxItem, Content, Item, RadioItem, Separator, Shortcut, SubContent, SubTrigger, Trigger, Menu, Group, Sub, RadioGroup, Label, GroupHeading, Portal, Menubar, Menubar as MenubarRoot, CheckboxItem as MenubarCheckboxItem, Content as MenubarContent, Item as MenubarItem, RadioItem as MenubarRadioItem, Separator as MenubarSeparator, Shortcut as MenubarShortcut, SubContent as MenubarSubContent, SubTrigger as MenubarSubTrigger, Trigger as MenubarTrigger, Menu as MenubarMenu, Group as MenubarGroup, Sub as MenubarSub, RadioGroup as MenubarRadioGroup, Label as MenubarLabel, GroupHeading as MenubarGroupHeading, Portal as MenubarPortal };

package/dist/lib/components/ui/menubar/index.js

@@ -0,0 +1,40 @@
+import Root from './menubar.svelte';
+import Menu from './menubar-menu.svelte';
+import Sub from './menubar-sub.svelte';
+import RadioGroup from './menubar-radio-group.svelte';
+import CheckboxItem from './menubar-checkbox-item.svelte';
+import Content from './menubar-content.svelte';
+import Item from './menubar-item.svelte';
+import Group from './menubar-group.svelte';
+import RadioItem from './menubar-radio-item.svelte';
+import Separator from './menubar-separator.svelte';
+import Shortcut from './menubar-shortcut.svelte';
+import SubContent from './menubar-sub-content.svelte';
+import SubTrigger from './menubar-sub-trigger.svelte';
+import Trigger from './menubar-trigger.svelte';
+import Label from './menubar-label.svelte';
+import GroupHeading from './menubar-group-heading.svelte';
+import Portal from './menubar-portal.svelte';
+// Dual export: <Menubar> renders Root, <Menubar.Menu> accesses the namespace.
+const Menubar = Object.assign(Root, {
+    Root,
+    Menu,
+    Sub,
+    RadioGroup,
+    CheckboxItem,
+    Content,
+    Item,
+    Group,
+    RadioItem,
+    Separator,
+    Shortcut,
+    SubContent,
+    SubTrigger,
+    Trigger,
+    Label,
+    GroupHeading,
+    Portal
+});
+export { Root, CheckboxItem, Content, Item, RadioItem, Separator, Shortcut, SubContent, SubTrigger, Trigger, Menu, Group, Sub, RadioGroup, Label, GroupHeading, Portal, Menubar, 
+//
+Menubar as MenubarRoot, CheckboxItem as MenubarCheckboxItem, Content as MenubarContent, Item as MenubarItem, RadioItem as MenubarRadioItem, Separator as MenubarSeparator, Shortcut as MenubarShortcut, SubContent as MenubarSubContent, SubTrigger as MenubarSubTrigger, Trigger as MenubarTrigger, Menu as MenubarMenu, Group as MenubarGroup, Sub as MenubarSub, RadioGroup as MenubarRadioGroup, Label as MenubarLabel, GroupHeading as MenubarGroupHeading, Portal as MenubarPortal };

package/dist/lib/components/ui/menubar/menubar-checkbox-item.svelte

@@ -0,0 +1,28 @@
+<script lang="ts">import { Menubar as MenubarPrimitive } from "bits-ui";
+import { Icon } from "../../icon";
+import { cn } from "../../../utils.js";
+let { ref = $bindable(null), class: className, checked = $bindable(false), indeterminate = $bindable(false), children: childrenProp, ...restProps } = $props();
+</script>
+
+<MenubarPrimitive.CheckboxItem
+	bind:ref
+	bind:checked
+	bind:indeterminate
+	data-slot="menubar-checkbox-item"
+	class={cn(
+		"relative flex cursor-default items-center gap-2 rounded-xs py-1.5 ps-8 pe-2 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+		className
+	)}
+	{...restProps}
+>
+	{#snippet children({ checked, indeterminate })}
+		<span class="pointer-events-none absolute start-2 flex size-3.5 items-center justify-center">
+			{#if indeterminate}
+				<Icon icon="lucide:minus" class="size-4" />
+			{:else}
+				<Icon icon="lucide:check" class={cn('size-4', !checked && 'text-transparent')} />
+			{/if}
+		</span>
+		{@render childrenProp?.()}
+	{/snippet}
+</MenubarPrimitive.CheckboxItem>

package/dist/lib/components/ui/menubar/menubar-checkbox-item.svelte.d.ts

@@ -0,0 +1,9 @@
+import { Menubar as MenubarPrimitive } from 'bits-ui';
+import { type WithoutChildrenOrChild } from '../../../utils.js';
+import type { Snippet } from 'svelte';
+type $$ComponentProps = WithoutChildrenOrChild<MenubarPrimitive.CheckboxItemProps> & {
+    children?: Snippet;
+};
+declare const MenubarCheckboxItem: import("svelte").Component<$$ComponentProps, {}, "ref" | "checked" | "indeterminate">;
+type MenubarCheckboxItem = ReturnType<typeof MenubarCheckboxItem>;
+export default MenubarCheckboxItem;

package/dist/lib/components/ui/menubar/menubar-content.svelte

@@ -0,0 +1,21 @@
+<script lang="ts">import { Menubar as MenubarPrimitive } from "bits-ui";
+import MenubarPortal from "./menubar-portal.svelte";
+import { cn } from "../../../utils.js";
+let { ref = $bindable(null), class: className, sideOffset = 8, alignOffset = -4, align = "start", side = "bottom", portalProps, ...restProps } = $props();
+</script>
+
+<MenubarPortal {...portalProps}>
+	<MenubarPrimitive.Content
+		bind:ref
+		data-slot="menubar-content"
+		{sideOffset}
+		{align}
+		{alignOffset}
+		{side}
+		class={cn(
+			'z-50 min-w-[12rem] origin-(--bits-menubar-content-transform-origin) overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-end-2 data-[side=right]:slide-in-from-start-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95',
+			className
+		)}
+		{...restProps}
+	/>
+</MenubarPortal>

package/dist/lib/components/ui/menubar/menubar-content.svelte.d.ts

@@ -0,0 +1,10 @@
+import { Menubar as MenubarPrimitive } from 'bits-ui';
+import MenubarPortal from './menubar-portal.svelte';
+import { type WithoutChildrenOrChild } from '../../../utils.js';
+import type { ComponentProps } from 'svelte';
+type $$ComponentProps = MenubarPrimitive.ContentProps & {
+    portalProps?: WithoutChildrenOrChild<ComponentProps<typeof MenubarPortal>>;
+};
+declare const MenubarContent: import("svelte").Component<$$ComponentProps, {}, "ref">;
+type MenubarContent = ReturnType<typeof MenubarContent>;
+export default MenubarContent;

package/dist/lib/components/ui/menubar/menubar-group-heading.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">import { cn } from "../../../utils.js";
+import { Menubar as MenubarPrimitive } from "bits-ui";
+let { ref = $bindable(null), inset, class: className, ...restProps } = $props();
+</script>
+
+<MenubarPrimitive.GroupHeading
+	bind:ref
+	data-slot="menubar-group-heading"
+	data-inset={inset}
+	class={cn('px-2 py-1.5 text-sm font-medium data-[inset]:ps-8', className)}
+	{...restProps}
+/>

package/dist/lib/components/ui/menubar/menubar-group-heading.svelte.d.ts

@@ -0,0 +1,8 @@
+import { Menubar as MenubarPrimitive } from 'bits-ui';
+import type { ComponentProps } from 'svelte';
+type $$ComponentProps = ComponentProps<typeof MenubarPrimitive.GroupHeading> & {
+    inset?: boolean;
+};
+declare const MenubarGroupHeading: import("svelte").Component<$$ComponentProps, {}, "ref">;
+type MenubarGroupHeading = ReturnType<typeof MenubarGroupHeading>;
+export default MenubarGroupHeading;

package/dist/lib/components/ui/menubar/menubar-group.svelte

@@ -0,0 +1,5 @@
+<script lang="ts">import { Menubar as MenubarPrimitive } from "bits-ui";
+let { ref = $bindable(null), ...restProps } = $props();
+</script>
+
+<MenubarPrimitive.Group bind:ref data-slot="menubar-group" {...restProps} />

package/dist/lib/components/ui/menubar/menubar-group.svelte.d.ts

@@ -0,0 +1,7 @@
+import { Menubar as MenubarPrimitive } from 'bits-ui';
+type $$ComponentProps = MenubarPrimitive.GroupProps & {
+    inset?: boolean;
+};
+declare const MenubarGroup: import("svelte").Component<$$ComponentProps, {}, "ref">;
+type MenubarGroup = ReturnType<typeof MenubarGroup>;
+export default MenubarGroup;

package/dist/lib/components/ui/menubar/menubar-item.svelte

@@ -0,0 +1,16 @@
+<script lang="ts">import { Menubar as MenubarPrimitive } from "bits-ui";
+import { cn } from "../../../utils.js";
+let { ref = $bindable(null), class: className, inset = undefined, variant = "default", ...restProps } = $props();
+</script>
+
+<MenubarPrimitive.Item
+	bind:ref
+	data-slot="menubar-item"
+	data-inset={inset}
+	data-variant={variant}
+	class={cn(
+		"relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:ps-8 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 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground data-[variant=destructive]:*:[svg]:!text-destructive",
+		className
+	)}
+	{...restProps}
+/>

package/dist/lib/components/ui/menubar/menubar-item.svelte.d.ts

@@ -0,0 +1,8 @@
+import { Menubar as MenubarPrimitive } from 'bits-ui';
+type $$ComponentProps = MenubarPrimitive.ItemProps & {
+    inset?: boolean;
+    variant?: 'default' | 'destructive';
+};
+declare const MenubarItem: import("svelte").Component<$$ComponentProps, {}, "ref">;
+type MenubarItem = ReturnType<typeof MenubarItem>;
+export default MenubarItem;

package/dist/lib/components/ui/menubar/menubar-label.svelte

@@ -0,0 +1,14 @@
+<script lang="ts">import { cn } from "../../../utils.js";
+import "bits-ui";
+let { ref = $bindable(null), inset, children, class: className, ...restProps } = $props();
+</script>
+
+<div
+	bind:this={ref}
+	data-slot="menubar-label"
+	data-inset={inset}
+	class={cn('px-2 py-1.5 text-sm font-medium data-[inset]:ps-8', className)}
+	{...restProps}
+>
+	{@render children?.()}
+</div>

package/dist/lib/components/ui/menubar/menubar-label.svelte.d.ts

@@ -0,0 +1,8 @@
+import { type WithElementRef } from 'bits-ui';
+import type { HTMLAttributes } from 'svelte/elements';
+type $$ComponentProps = WithElementRef<HTMLAttributes<HTMLElement>> & {
+    inset?: boolean;
+};
+declare const MenubarLabel: import("svelte").Component<$$ComponentProps, {}, "ref">;
+type MenubarLabel = ReturnType<typeof MenubarLabel>;
+export default MenubarLabel;

package/dist/lib/components/ui/menubar/menubar-menu.svelte

@@ -0,0 +1,5 @@
+<script lang="ts">import { Menubar as MenubarPrimitive } from "bits-ui";
+let { ...restProps } = $props();
+</script>
+
+<MenubarPrimitive.Menu {...restProps} />

package/dist/lib/components/ui/menubar/menubar-menu.svelte.d.ts

@@ -0,0 +1,3 @@
+declare const MenubarMenu: import("svelte").Component<import("bits-ui").MenubarMenuPropsWithoutHTML, {}, "">;
+type MenubarMenu = ReturnType<typeof MenubarMenu>;
+export default MenubarMenu;

package/dist/lib/components/ui/menubar/menubar-portal.svelte

@@ -0,0 +1,5 @@
+<script lang="ts">import { Menubar as MenubarPrimitive } from "bits-ui";
+let { ...restProps } = $props();
+</script>
+
+<MenubarPrimitive.Portal {...restProps} />

package/dist/lib/components/ui/menubar/menubar-portal.svelte.d.ts

@@ -0,0 +1,3 @@
+declare const MenubarPortal: import("svelte").Component<import("bits-ui").PortalProps, {}, "">;
+type MenubarPortal = ReturnType<typeof MenubarPortal>;
+export default MenubarPortal;

package/dist/lib/components/ui/menubar/menubar-radio-group.svelte

@@ -0,0 +1,5 @@
+<script lang="ts">import { Menubar as MenubarPrimitive } from "bits-ui";
+let { ref = $bindable(null), value = $bindable(""), ...restProps } = $props();
+</script>
+
+<MenubarPrimitive.RadioGroup bind:ref bind:value data-slot="menubar-radio-group" {...restProps} />

package/dist/lib/components/ui/menubar/menubar-radio-group.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Menubar as MenubarPrimitive } from 'bits-ui';
+declare const MenubarRadioGroup: import("svelte").Component<MenubarPrimitive.RadioGroupProps, {}, "value" | "ref">;
+type MenubarRadioGroup = ReturnType<typeof MenubarRadioGroup>;
+export default MenubarRadioGroup;

package/dist/lib/components/ui/menubar/menubar-radio-item.svelte

@@ -0,0 +1,24 @@
+<script lang="ts">import { Menubar as MenubarPrimitive } from "bits-ui";
+import { Icon } from "../../icon";
+import { cn } from "../../../utils.js";
+let { ref = $bindable(null), class: className, children: childrenProp, ...restProps } = $props();
+</script>
+
+<MenubarPrimitive.RadioItem
+	bind:ref
+	data-slot="menubar-radio-item"
+	class={cn(
+		"relative flex cursor-default items-center gap-2 rounded-xs py-1.5 ps-8 pe-2 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+		className
+	)}
+	{...restProps}
+>
+	{#snippet children({ checked })}
+		<span class="pointer-events-none absolute start-2 flex size-3.5 items-center justify-center">
+			{#if checked}
+				<Icon icon="lucide:circle" class="size-2 fill-current" />
+			{/if}
+		</span>
+		{@render childrenProp?.({ checked })}
+	{/snippet}
+</MenubarPrimitive.RadioItem>

package/dist/lib/components/ui/menubar/menubar-radio-item.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Menubar as MenubarPrimitive } from 'bits-ui';
+declare const MenubarRadioItem: import("svelte").Component<Omit<MenubarPrimitive.RadioItemProps, "child">, {}, "ref">;
+type MenubarRadioItem = ReturnType<typeof MenubarRadioItem>;
+export default MenubarRadioItem;

package/dist/lib/components/ui/menubar/menubar-separator.svelte

@@ -0,0 +1,11 @@
+<script lang="ts">import { Menubar as MenubarPrimitive } from "bits-ui";
+import { cn } from "../../../utils.js";
+let { ref = $bindable(null), class: className, ...restProps } = $props();
+</script>
+
+<MenubarPrimitive.Separator
+	bind:ref
+	data-slot="menubar-separator"
+	class={cn('-mx-1 my-1 h-px bg-border', className)}
+	{...restProps}
+/>

package/dist/lib/components/ui/menubar/menubar-separator.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Menubar as MenubarPrimitive } from 'bits-ui';
+declare const MenubarSeparator: import("svelte").Component<MenubarPrimitive.SeparatorProps, {}, "ref">;
+type MenubarSeparator = ReturnType<typeof MenubarSeparator>;
+export default MenubarSeparator;

package/dist/lib/components/ui/menubar/menubar-shortcut.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">import { cn } from "../../../utils.js";
+let { ref = $bindable(null), class: className, children, ...restProps } = $props();
+</script>
+
+<span
+	bind:this={ref}
+	data-slot="menubar-shortcut"
+	class={cn('ms-auto text-xs tracking-widest text-muted-foreground', className)}
+	{...restProps}
+>
+	{@render children?.()}
+</span>

package/dist/lib/components/ui/menubar/menubar-shortcut.svelte.d.ts

@@ -0,0 +1,5 @@
+import type { HTMLAttributes } from 'svelte/elements';
+import { type WithElementRef } from '../../../utils.js';
+declare const MenubarShortcut: import("svelte").Component<WithElementRef<HTMLAttributes<HTMLSpanElement>>, {}, "ref">;
+type MenubarShortcut = ReturnType<typeof MenubarShortcut>;
+export default MenubarShortcut;

package/dist/lib/components/ui/menubar/menubar-sub-content.svelte

@@ -0,0 +1,14 @@
+<script lang="ts">import { Menubar as MenubarPrimitive } from "bits-ui";
+import { cn } from "../../../utils.js";
+let { ref = $bindable(null), class: className, ...restProps } = $props();
+</script>
+
+<MenubarPrimitive.SubContent
+	bind:ref
+	data-slot="menubar-sub-content"
+	class={cn(
+		'z-50 min-w-[8rem] origin-(--bits-menubar-content-transform-origin) overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-end-2 data-[side=right]:slide-in-from-start-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95',
+		className
+	)}
+	{...restProps}
+/>

package/dist/lib/components/ui/menubar/menubar-sub-content.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Menubar as MenubarPrimitive } from 'bits-ui';
+declare const MenubarSubContent: import("svelte").Component<MenubarPrimitive.SubContentProps, {}, "ref">;
+type MenubarSubContent = ReturnType<typeof MenubarSubContent>;
+export default MenubarSubContent;

package/dist/lib/components/ui/menubar/menubar-sub-trigger.svelte

@@ -0,0 +1,19 @@
+<script lang="ts">import { Menubar as MenubarPrimitive } from "bits-ui";
+import { Icon } from "../../icon";
+import { cn } from "../../../utils.js";
+let { ref = $bindable(null), class: className, inset = undefined, children, ...restProps } = $props();
+</script>
+
+<MenubarPrimitive.SubTrigger
+	bind:ref
+	data-slot="menubar-sub-trigger"
+	data-inset={inset}
+	class={cn(
+		'flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-none select-none focus:bg-accent focus:text-accent-foreground data-[inset]:ps-8 data-[state=open]:bg-accent data-[state=open]:text-accent-foreground',
+		className
+	)}
+	{...restProps}
+>
+	{@render children?.()}
+	<Icon icon="lucide:chevron-right" class="ms-auto size-4" />
+</MenubarPrimitive.SubTrigger>

package/dist/lib/components/ui/menubar/menubar-sub-trigger.svelte.d.ts

@@ -0,0 +1,8 @@
+import { Menubar as MenubarPrimitive } from 'bits-ui';
+import { type WithoutChild } from '../../../utils.js';
+type $$ComponentProps = WithoutChild<MenubarPrimitive.SubTriggerProps> & {
+    inset?: boolean;
+};
+declare const MenubarSubTrigger: import("svelte").Component<$$ComponentProps, {}, "ref">;
+type MenubarSubTrigger = ReturnType<typeof MenubarSubTrigger>;
+export default MenubarSubTrigger;

package/dist/lib/components/ui/menubar/menubar-sub.svelte

@@ -0,0 +1,5 @@
+<script lang="ts">import { Menubar as MenubarPrimitive } from "bits-ui";
+let { open = $bindable(false), ...restProps } = $props();
+</script>
+
+<MenubarPrimitive.Sub bind:open {...restProps} />

package/dist/lib/components/ui/menubar/menubar-sub.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Menubar as MenubarPrimitive } from 'bits-ui';
+declare const MenubarSub: import("svelte").Component<MenubarPrimitive.SubProps, {}, "open">;
+type MenubarSub = ReturnType<typeof MenubarSub>;
+export default MenubarSub;

package/dist/lib/components/ui/menubar/menubar-trigger.svelte

@@ -0,0 +1,14 @@
+<script lang="ts">import { Menubar as MenubarPrimitive } from "bits-ui";
+import { cn } from "../../../utils.js";
+let { ref = $bindable(null), class: className, ...restProps } = $props();
+</script>
+
+<MenubarPrimitive.Trigger
+	bind:ref
+	data-slot="menubar-trigger"
+	class={cn(
+		'flex items-center rounded-sm px-2 py-1 text-sm font-medium outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground',
+		className
+	)}
+	{...restProps}
+/>

package/dist/lib/components/ui/menubar/menubar-trigger.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Menubar as MenubarPrimitive } from 'bits-ui';
+declare const MenubarTrigger: import("svelte").Component<MenubarPrimitive.TriggerProps, {}, "ref">;
+type MenubarTrigger = ReturnType<typeof MenubarTrigger>;
+export default MenubarTrigger;

package/dist/lib/components/ui/menubar/menubar.svelte

@@ -0,0 +1,11 @@
+<script lang="ts">import { Menubar as MenubarPrimitive } from "bits-ui";
+import { cn } from "../../../utils.js";
+let { ref = $bindable(null), class: className, ...restProps } = $props();
+</script>
+
+<MenubarPrimitive.Root
+	bind:ref
+	data-slot="menubar"
+	class={cn('flex h-9 items-center gap-1 rounded-md border bg-background p-1 shadow-xs', className)}
+	{...restProps}
+/>

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

@@ -0,0 +1,4 @@
+import { Menubar as MenubarPrimitive } from 'bits-ui';
+declare const Menubar: import("svelte").Component<MenubarPrimitive.RootProps, {}, "ref">;
+type Menubar = ReturnType<typeof Menubar>;
+export default Menubar;