sheer-ui 0.0.0

package/src/lib/components/menu/types.ts

@@ -0,0 +1,285 @@
+import type { Expand } from '../../internal/tools/index.js';
+import type { PopperLayerProps, PopperLayerStaticProps } from '../../internal/popper-layer/types.js';
+import type { FloatingLayerArrowProps, FloatingLayerArrowPropsWithoutHTML } from '../../internal/floating-layer/types.js';
+import type { OnChangeFn, WithChild, WithChildNoChildrenSnippetProps, WithChildren, Without } from '../../internal/types.js';
+import type { BitsPrimitiveButtonAttributes, BitsPrimitiveDivAttributes } from '../../internal/attribute-types.js';
+import type { Direction } from '../../internal/index.js';
+import type { Snippet } from 'svelte';
+import type { OpenCell } from '../../internal/open-cell.svelte.js';
+import type { PortalProps } from '../../internal/portal/index.js';
+import type { FloatingContentSnippetProps, StaticContentSnippetProps } from '../../internal/types.js';
+
+export type MenuRootPropsWithoutHTML = {
+	/**
+	 * The derivation source for the menu's open state: the internal cell
+	 * re-derives whenever this prop changes, and interactions (trigger, Escape,
+	 * a snippet-cell write) override it until the next change. Reconcile
+	 * dismissals via onOpenChangeComplete. Plain value — not bindable.
+	 */
+	open?: boolean;
+
+	// /**
+	//  * When `true`, renders safe-area debug overlays for submenu pointer intent.
+	//  *
+	//  * @defaultValue false
+	//  */
+	// debugMode?: boolean;
+
+	/**
+	 * A callback that is called when the menu finishes opening/closing animations.
+	 * This is an occurrence (animation settled), not a state mirror — depend on the cell instead.
+	 */
+	onOpenChangeComplete?: OnChangeFn<boolean>;
+
+	/**
+	 * A caller-constructed cell (own source and, optionally, a delegate writer)
+	 * used instead of building one from `open`. When given, `open` is ignored.
+	 */
+	state?: OpenCell;
+
+	/**
+	 * The direction of the site.
+	 *
+	 * @defaultValue "ltr"
+	 */
+	dir?: Direction;
+
+	/** Children receive the state cell, typed and guaranteed within the tree. */
+	children?: Snippet<[OpenCell]>;
+};
+
+export type MenuRootProps = MenuRootPropsWithoutHTML;
+
+export type _SharedMenuContentProps = {
+	/**
+	 * When `true`, the menu will loop through items when navigating with the keyboard.
+	 *
+	 * @defaultValue false
+	 */
+	loop?: boolean;
+};
+
+export type MenuContentPropsWithoutHTML = Expand<
+	WithChildNoChildrenSnippetProps<Omit<PopperLayerProps, 'content'> & _SharedMenuContentProps, FloatingContentSnippetProps>
+>;
+
+export type MenuContentProps = MenuContentPropsWithoutHTML & Without<BitsPrimitiveDivAttributes, MenuContentPropsWithoutHTML>;
+
+export type MenuContentStaticPropsWithoutHTML = Expand<
+	WithChildNoChildrenSnippetProps<Omit<PopperLayerStaticProps, 'content'> & _SharedMenuContentProps, StaticContentSnippetProps>
+>;
+
+export type MenuContentStaticProps = MenuContentStaticPropsWithoutHTML &
+	Without<BitsPrimitiveDivAttributes, MenuContentStaticPropsWithoutHTML>;
+
+export type MenuItemPropsWithoutHTML<U extends Record<PropertyKey, unknown> = { _default: never }> = WithChild<
+	{
+		/**
+		 * When `true`, the user will not be able to interact with the menu item.
+		 *
+		 * @defaultValue false
+		 */
+		disabled?: boolean;
+
+		/**
+		 * Optional text to use for typeahead filtering. By default, typeahead will use
+		 * the `.textContent` of the menu item. When the content is more complex, you
+		 * can provide a string here instead.
+		 *
+		 * @defaultValue undefined
+		 */
+		textValue?: string;
+
+		/**
+		 * A callback fired when the menu item is selected.
+		 *
+		 * Prevent default behavior of selection with `event.preventDefault()`.
+		 */
+		onSelect?: (event: Event) => void;
+
+		/**
+		 * Whether or not the menu item should close when selected.
+		 * @defaultValue true
+		 */
+		closeOnSelect?: boolean;
+	},
+	U
+>;
+
+export type MenuItemProps = MenuItemPropsWithoutHTML & Without<BitsPrimitiveDivAttributes, MenuItemPropsWithoutHTML>;
+
+export type MenuCheckboxItemSnippetProps = { checked: boolean; indeterminate: boolean };
+
+export type MenuCheckboxItemPropsWithoutHTML = MenuItemPropsWithoutHTML<MenuCheckboxItemSnippetProps> & {
+	/**
+	 * The checked state of the checkbox. It can be one of:
+	 * - `true` for checked
+	 * - `false` for unchecked
+	 *
+	 * @defaultValue false
+	 */
+	checked?: boolean;
+
+	/**
+	 * A callback that is fired when the checked state changes.
+	 */
+	onCheckedChange?: OnChangeFn<boolean>;
+
+	/**
+	 * Whether the checkbox is in an indeterminate state or not.
+	 *
+	 * @defaultValue false
+	 */
+	indeterminate?: boolean;
+
+	/**
+	 * A callback function called when the indeterminate state changes.
+	 */
+	onIndeterminateChange?: OnChangeFn<boolean>;
+
+	/**
+	 * Whether or not the menu item should close when selected.
+	 *
+	 * @defaultValue true
+	 */
+	closeOnSelect?: boolean;
+
+	/**
+	 * The value of the checkbox item when used in a checkbox group.
+	 */
+	value?: string;
+};
+
+export type MenuCheckboxItemProps = MenuCheckboxItemPropsWithoutHTML &
+	Without<BitsPrimitiveDivAttributes, MenuCheckboxItemPropsWithoutHTML>;
+
+export type MenuCheckboxGroupPropsWithoutHTML = WithChild<{
+	/**
+	 * The values of the selected checkbox items.
+	 *
+	 * Supports two-way binding with `bind:value`.
+	 */
+	value?: string[];
+
+	/**
+	 * A callback that is fired when the selected checkbox items change.
+	 */
+	onValueChange?: OnChangeFn<string[]>;
+}>;
+
+export type MenuCheckboxGroupProps = MenuCheckboxGroupPropsWithoutHTML &
+	Without<BitsPrimitiveDivAttributes, MenuCheckboxGroupPropsWithoutHTML>;
+
+export type MenuTriggerPropsWithoutHTML = WithChild<{
+	/**
+	 * Whether the trigger is disabled.
+	 *
+	 * @defaultValue false
+	 */
+	disabled?: boolean | null | undefined;
+}>;
+
+export type MenuTriggerProps = MenuTriggerPropsWithoutHTML & Without<BitsPrimitiveButtonAttributes, MenuTriggerPropsWithoutHTML>;
+
+export type MenuSubPropsWithoutHTML = WithChildren<{
+	/**
+	 * The open state of the menu.
+	 */
+	open?: boolean;
+
+	/**
+	 * A callback that is called when the menu is opened or closed.
+	 */
+	onOpenChange?: OnChangeFn<boolean>;
+
+	/**
+	 * A callback that is called when the menu finishes opening/closing animations.
+	 */
+	onOpenChangeComplete?: OnChangeFn<boolean>;
+}>;
+
+export type MenuSubProps = MenuSubPropsWithoutHTML;
+
+export type MenuSubContentPropsWithoutHTML = Expand<
+	WithChildNoChildrenSnippetProps<
+		Omit<PopperLayerProps, 'content' | 'preventScroll'> & _SharedMenuContentProps,
+		FloatingContentSnippetProps
+	>
+>;
+
+export type MenuSubContentProps = MenuSubContentPropsWithoutHTML & Without<BitsPrimitiveDivAttributes, MenuSubContentPropsWithoutHTML>;
+
+export type MenuSubContentStaticPropsWithoutHTML = Expand<
+	WithChildNoChildrenSnippetProps<
+		Omit<PopperLayerStaticProps, 'content' | 'preventScroll'> & _SharedMenuContentProps,
+		StaticContentSnippetProps
+	>
+>;
+
+export type MenuSubContentStaticProps = MenuSubContentStaticPropsWithoutHTML &
+	Without<BitsPrimitiveDivAttributes, MenuSubContentStaticPropsWithoutHTML>;
+
+export type MenuSubTriggerPropsWithoutHTML = Omit<MenuItemPropsWithoutHTML, 'closeOnSelect'> & {
+	/**
+	 * The amount of time in ms from when the mouse enters the subtrigger until
+	 * the submenu opens. This is useful for preventing the submenu from opening
+	 * as a user is moving their mouse through the menu without a true intention to open that
+	 * submenu.
+	 *
+	 * To disable the behavior, set it to `0`.
+	 *
+	 * @default 100
+	 */
+	openDelay?: number;
+};
+
+export type MenuSubTriggerProps = MenuSubTriggerPropsWithoutHTML & Without<BitsPrimitiveDivAttributes, MenuSubTriggerPropsWithoutHTML>;
+
+export type MenuSeparatorPropsWithoutHTML = WithChild;
+export type MenuSeparatorProps = MenuSeparatorPropsWithoutHTML & Without<BitsPrimitiveDivAttributes, MenuSeparatorPropsWithoutHTML>;
+
+export type MenuArrowPropsWithoutHTML = FloatingLayerArrowPropsWithoutHTML;
+export type MenuArrowProps = FloatingLayerArrowProps;
+
+export type MenuGroupPropsWithoutHTML = WithChild;
+export type MenuGroupProps = MenuGroupPropsWithoutHTML & Without<BitsPrimitiveDivAttributes, MenuGroupPropsWithoutHTML>;
+
+export type MenuGroupHeadingPropsWithoutHTML = WithChild;
+export type MenuGroupHeadingProps = MenuGroupHeadingPropsWithoutHTML &
+	Without<BitsPrimitiveDivAttributes, MenuGroupHeadingPropsWithoutHTML>;
+
+export type MenuRadioGroupPropsWithoutHTML = WithChild<{
+	/**
+	 * The value of the selected radio item.
+	 *
+	 * Supports two-way binding with `bind:value`.
+	 */
+	value?: string;
+
+	/**
+	 * A callback that is fired when the selected radio item changes.
+	 */
+	onValueChange?: OnChangeFn<string>;
+}>;
+
+export type MenuRadioGroupProps = MenuRadioGroupPropsWithoutHTML & Without<BitsPrimitiveDivAttributes, MenuRadioGroupPropsWithoutHTML>;
+
+export type MenuRadioItemSnippetProps = { checked: boolean };
+
+export type MenuRadioItemPropsWithoutHTML = MenuItemPropsWithoutHTML<MenuRadioItemSnippetProps> & {
+	/**
+	 * The value of the radio item.
+	 */
+	value: string;
+
+	/**
+	 * Whether or not the menu item should close when selected.
+	 * @defaultValue true
+	 */
+	closeOnSelect?: boolean;
+};
+
+export type MenuRadioItemProps = MenuRadioItemPropsWithoutHTML & Without<BitsPrimitiveDivAttributes, MenuRadioItemPropsWithoutHTML>;
+
+export type MenuPortalPropsWithoutHTML = PortalProps;
+export type MenuPortalProps = MenuPortalPropsWithoutHTML;

package/src/lib/components/menu/utils.ts

@@ -0,0 +1,68 @@
+import { kbd, SELECTION_KEYS } from "../../internal/kbd.js";
+import type { Direction } from "../../internal/index.js";
+import { isHTMLElement } from '../../internal/tools/utils/dom.js';
+import type { MenuContentState } from './menu.svelte.js';
+
+export type CheckedState = boolean | "indeterminate";
+
+export const SUB_OPEN_KEYS: Record<Direction, string[]> = {
+	ltr: [...SELECTION_KEYS, kbd.ARROW_RIGHT],
+	rtl: [...SELECTION_KEYS, kbd.ARROW_LEFT],
+};
+export const SUB_CLOSE_KEYS: Record<Direction, string[]> = {
+	ltr: [kbd.ARROW_LEFT],
+	rtl: [kbd.ARROW_RIGHT],
+};
+
+export const isIndeterminate = (checked?: CheckedState): checked is "indeterminate" => checked === "indeterminate";
+
+export const getCheckedState = (checked: CheckedState) => isIndeterminate(checked) ? "indeterminate" : checked ? "checked" : "unchecked";
+
+export const isMouseEvent = (event: PointerEvent) => event.pointerType === "mouse";
+
+type SubmenuHandlerOptions = {
+	onInteractOutside: () => (event: PointerEvent) => void;
+	onEscapeKeydown: () => (event: KeyboardEvent) => void;
+	onFocusOutside: () => (event: FocusEvent) => void;
+};
+
+export function createSubmenuHandlers(state: MenuContentState, options: SubmenuHandlerOptions) {
+	const onkeydown = (event: KeyboardEvent) => {
+		const inside = (event.currentTarget as HTMLElement).contains(event.target as HTMLElement);
+		const closeKey = SUB_CLOSE_KEYS[state.parentMenu.root.opts.dir.current].includes(event.key);
+		if (!inside || !closeKey) return;
+		state.parentMenu.onClose();
+		state.parentMenu.triggerNode?.focus();
+		event.preventDefault();
+	};
+
+	const handleInteractOutside = (event: PointerEvent) => {
+		options.onInteractOutside()(event);
+		if (!event.defaultPrevented) state.parentMenu.onClose();
+	};
+
+	const handleEscapeKeydown = (event: KeyboardEvent) => {
+		options.onEscapeKeydown()(event);
+		if (!event.defaultPrevented) state.parentMenu.onClose();
+	};
+
+	const handleOnFocusOutside = (event: FocusEvent) => {
+		options.onFocusOutside()(event);
+		if (event.defaultPrevented || !isHTMLElement(event.target)) return;
+		if (event.target.id === state.parentMenu.triggerNode?.id) return;
+		const parentContent = state.parentMenu.parentMenu?.contentNode;
+		if (parentContent?.contains(event.target)) {
+			state.parentMenu.onClose();
+			event.preventDefault();
+			return;
+		}
+		const subContentSelector = `[${state.parentMenu.root.getBitsAttr('sub-content')}]`;
+		if (event.target.closest(subContentSelector)) {
+			event.preventDefault();
+			return;
+		}
+		state.parentMenu.onClose();
+	};
+
+	return { onkeydown, handleInteractOutside, handleEscapeKeydown, handleOnFocusOutside };
+}

package/src/lib/components/menubar/components/menubar-content-static.svelte

@@ -0,0 +1,50 @@
+<script lang="ts">
+	import { boxWith } from '../../../internal/tools/index.js';
+	import { mergeProps } from '../../../internal/merge-props.js';
+	import type { MenubarContentStaticProps } from '../types.js';
+	import { MenubarContentState } from '../menubar.svelte.js';
+	import { createId } from '../../../internal/create-id.js';
+	import { getFloatingContentCSSVars } from '../../../internal/floating-layer/index.js';
+	import MenuContent from '../../menu/components/menu-content.svelte';
+
+	const uid = $props.id();
+
+	let {
+		ref = $bindable(null),
+		interactOutsideBehavior = 'close',
+		id = createId(uid),
+		onInteractOutside = () => {},
+		onCloseAutoFocus = () => {},
+		onFocusOutside = () => {},
+		onOpenAutoFocus = () => {},
+		...restProps
+	}: MenubarContentStaticProps = $props();
+
+	const contentState = MenubarContentState.create({
+		id: boxWith(() => id),
+		interactOutsideBehavior: boxWith(() => interactOutsideBehavior),
+		ref: boxWith(
+			() => ref,
+			(v) => (ref = v),
+		),
+		onInteractOutside: boxWith(() => onInteractOutside),
+		onFocusOutside: boxWith(() => onFocusOutside),
+		onCloseAutoFocus: boxWith(() => onCloseAutoFocus),
+		onOpenAutoFocus: boxWith(() => onOpenAutoFocus),
+	});
+
+	const mergedProps = $derived(
+		mergeProps(
+			{
+				'data-slot': 'menubar-content',
+				class:
+					'bg-popover text-popover-foreground popup-surface popup-surface-static z-50 min-w-48 origin-(--bits-menu-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-md outline-none',
+				style: getFloatingContentCSSVars('menu'),
+			},
+			restProps,
+			contentState.props,
+		),
+	);
+</script>
+
+<MenuContent bind:ref {...mergedProps} {...contentState.popperProps} preventScroll={false} isStatic />

package/src/lib/components/menubar/components/menubar-content.svelte

@@ -0,0 +1,54 @@
+<script lang="ts">
+	import { boxWith } from '../../../internal/tools/index.js';
+	import { mergeProps } from '../../../internal/merge-props.js';
+	import type { MenubarContentProps } from '../types.js';
+	import { MenubarContentState } from '../menubar.svelte.js';
+	import MenuContent from '../../menu/components/menu-content.svelte';
+	import { createId } from '../../../internal/create-id.js';
+	import { getFloatingContentCSSVars } from '../../../internal/floating-layer/index.js';
+
+	const uid = $props.id();
+
+	let {
+		ref = $bindable(null),
+		interactOutsideBehavior = 'close',
+		id = createId(uid),
+		sideOffset = 8,
+		alignOffset = -4,
+		align = 'start',
+		side = 'bottom',
+		onInteractOutside = () => {},
+		onFocusOutside = () => {},
+		onCloseAutoFocus = () => {},
+		onOpenAutoFocus = () => {},
+		...restProps
+	}: MenubarContentProps = $props();
+
+	const contentState = MenubarContentState.create({
+		id: boxWith(() => id),
+		interactOutsideBehavior: boxWith(() => interactOutsideBehavior),
+		ref: boxWith(
+			() => ref,
+			(v) => (ref = v),
+		),
+		onInteractOutside: boxWith(() => onInteractOutside),
+		onFocusOutside: boxWith(() => onFocusOutside),
+		onCloseAutoFocus: boxWith(() => onCloseAutoFocus),
+		onOpenAutoFocus: boxWith(() => onOpenAutoFocus),
+	});
+
+	const mergedProps = $derived(
+		mergeProps(
+			{
+				'data-slot': 'menubar-content',
+				class:
+					'bg-popover text-popover-foreground popup-surface z-50 min-w-48 origin-(--bits-menu-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-md outline-none',
+				style: getFloatingContentCSSVars('menu'),
+			},
+			restProps,
+			contentState.props,
+		),
+	);
+</script>
+
+<MenuContent bind:ref {...mergedProps} {...contentState.popperProps} {sideOffset} {alignOffset} {align} {side} preventScroll={false} />

package/src/lib/components/menubar/components/menubar-menu.svelte

@@ -0,0 +1,34 @@
+<script lang="ts">
+	import { boxWith } from '../../../internal/tools/index.js';
+	import { OpenCell } from '../../../internal/open-cell.svelte.js';
+	import type { MenubarMenuProps } from '../types.js';
+	import { MenubarMenuState } from '../menubar.svelte.js';
+	import Menu from '../../menu/components/menu.svelte';
+	import { createId } from '../../../internal/create-id.js';
+
+	const uid = $props.id();
+
+	let { value = createId(uid), onOpenChange = () => {}, ...restProps }: MenubarMenuProps = $props();
+
+	const menuState = MenubarMenuState.create({
+		value: boxWith(() => value),
+		onOpenChange: boxWith(() => onOpenChange),
+	});
+
+	// Delegate cell: the menubar root is the source of which menu is open; a
+	// self-close (Escape / dismiss) inside the menu reports back so the root
+	// leaves open-mode. Opens only ever come from the menubar's own triggers.
+	const cell = new OpenCell(
+		() => menuState.open,
+		(open) => {
+			if (!open) menuState.root.onMenuClose();
+		},
+	);
+</script>
+
+<Menu
+	state={cell}
+	dir={menuState.root.opts.dir.current}
+	_internal_variant="menubar"
+	{...restProps}
+	_internal_should_skip_exit_animation={() => menuState.root.skipExitAnimationForMenuValue === menuState.opts.value.current} />

package/src/lib/components/menubar/components/menubar-trigger.svelte

@@ -0,0 +1,50 @@
+<script lang="ts">
+	import { attachRef, boxWith } from '../../../internal/tools/index.js';
+	import { mergeProps } from '../../../internal/merge-props.js';
+	import type { MenubarTriggerProps } from '../types.js';
+	import { MenubarTriggerState } from '../menubar.svelte.js';
+	import { createId } from '../../../internal/create-id.js';
+	import { floatingAnchor } from '../../../internal/floating-layer/index.js';
+	import { DropdownMenuTriggerState } from '../../menu/menu.svelte.js';
+
+	const uid = $props.id();
+
+	let { id = createId(uid), disabled = false, children, child, ref = $bindable(null), ...restProps }: MenubarTriggerProps = $props();
+
+	const triggerState = MenubarTriggerState.create({
+		id: boxWith(() => id),
+		disabled: boxWith(() => disabled ?? false),
+		ref: boxWith(
+			() => ref,
+			(v) => (ref = v),
+		),
+	});
+
+	const dropdownTriggerState = DropdownMenuTriggerState.create(triggerState.opts);
+	const triggerAttachment = attachRef((v: HTMLElement | null) => (dropdownTriggerState.parentMenu.triggerNode = v));
+
+	const mergedProps = $derived(
+		mergeProps(
+			{
+				'data-slot': 'menubar-trigger',
+				class:
+					'focus:bg-accent focus:text-accent-foreground data-open:bg-accent data-open:text-accent-foreground flex items-center rounded-md px-2 py-1 text-sm font-medium outline-hidden select-none',
+			},
+			restProps,
+			triggerState.props,
+			{
+				...triggerAttachment,
+			},
+		),
+	);
+
+	const anchor = floatingAnchor();
+</script>
+
+{#if child}
+	{@render child({ props: mergeProps(mergedProps, anchor) })}
+{:else}
+	<button {...mergeProps(mergedProps, anchor)}>
+		{@render children?.()}
+	</button>
+{/if}

package/src/lib/components/menubar/components/menubar.svelte

@@ -0,0 +1,57 @@
+<script lang="ts">
+	import { boxWith } from '../../../internal/tools/index.js';
+	import { mergeProps } from '../../../internal/merge-props.js';
+	import type { MenubarRootProps } from '../types.js';
+	import { MenubarRootState } from '../menubar.svelte.js';
+	import { createId } from '../../../internal/create-id.js';
+
+	const uid = $props.id();
+
+	let {
+		id = createId(uid),
+		children,
+		child,
+		ref = $bindable(null),
+		value = $bindable(''),
+		dir = 'ltr',
+		loop = true,
+		onValueChange = () => {},
+		...restProps
+	}: MenubarRootProps = $props();
+
+	const rootState = MenubarRootState.create({
+		id: boxWith(() => id),
+		value: boxWith(
+			() => value,
+			(v) => {
+				value = v;
+				onValueChange?.(v);
+			},
+		),
+		dir: boxWith(() => dir),
+		loop: boxWith(() => loop),
+		ref: boxWith(
+			() => ref,
+			(v) => (ref = v),
+		),
+	});
+
+	const mergedProps = $derived(
+		mergeProps(
+			{
+				'data-slot': 'menubar',
+				class: 'bg-background flex h-9 items-center gap-1 rounded-md border p-1 shadow-xs',
+			},
+			restProps,
+			rootState.props,
+		),
+	);
+</script>
+
+{#if child}
+	{@render child({ props: mergedProps })}
+{:else}
+	<div {...mergedProps}>
+		{@render children?.()}
+	</div>
+{/if}

package/src/lib/components/menubar/exports.ts

@@ -0,0 +1,44 @@
+export { default as Root } from "./components/menubar.svelte";
+export { default as Menu } from "./components/menubar-menu.svelte";
+export { default as Content } from "./components/menubar-content.svelte";
+export { default as ContentStatic } from "./components/menubar-content-static.svelte";
+export { default as Trigger } from "./components/menubar-trigger.svelte";
+export { default as Sub } from "../menu/components/menu-sub.svelte";
+export { default as Item } from "../menu/components/menu-item.svelte";
+export { default as Group } from "../menu/components/menu-group.svelte";
+export { default as GroupHeading } from "../menu/components/menu-group-heading.svelte";
+export { default as Arrow } from "../menu/components/menu-arrow.svelte";
+export { default as RadioItem } from "../menu/components/menu-radio-item.svelte";
+export { default as Separator } from "../menu/components/menu-separator.svelte";
+export { default as SubContent } from "../menu/components/menu-sub-content.svelte";
+export { default as SubContentStatic } from "../menu/components/menu-sub-content-static.svelte";
+export { default as SubTrigger } from "../menu/components/menu-sub-trigger.svelte";
+export { default as RadioGroup } from "../menu/components/menu-radio-group.svelte";
+export { default as CheckboxItem } from "../menu/components/menu-checkbox-item.svelte";
+export { default as Portal } from "../../internal/portal/portal.svelte";
+export { default as CheckboxGroup } from "../menu/components/menu-checkbox-group.svelte";
+
+export type {
+	MenubarRootProps as RootProps,
+	MenubarMenuProps as MenuProps,
+	MenubarTriggerProps as TriggerProps,
+	MenubarContentProps as ContentProps,
+	MenubarContentStaticProps as ContentStaticProps,
+	MenubarPortalProps as PortalProps,
+} from "./types.js";
+
+export type {
+	MenuSubPropsWithoutHTML as SubProps,
+	MenuItemProps as ItemProps,
+	MenuGroupProps as GroupProps,
+	MenuGroupHeadingProps as GroupHeadingProps,
+	MenuArrowProps as ArrowProps,
+	MenuRadioItemProps as RadioItemProps,
+	MenuSeparatorProps as SeparatorProps,
+	MenuSubContentProps as SubContentProps,
+	MenuSubTriggerProps as SubTriggerProps,
+	MenuRadioGroupProps as RadioGroupProps,
+	MenuCheckboxItemProps as CheckboxItemProps,
+	MenuSubContentStaticProps as SubContentStaticProps,
+	MenuCheckboxGroupProps as CheckboxGroupProps,
+} from "../menu/types.js";

package/src/lib/components/menubar/index.ts

@@ -0,0 +1,2 @@
+export * as Menubar from './exports.js';
+export * from './exports.js';