@sprawlify/svelte 0.0.46 → 0.0.47

package/dist/components/marquee/marquee-edge.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { EdgeProps } from '@sprawlify/primitives/machines/marquee';
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface MarqueeEdgeBaseProps extends EdgeProps, PolymorphicProps<'div'>, RefAttribute {
+}
+export interface MarqueeEdgeProps extends Assign<HTMLProps<'div'>, MarqueeEdgeBaseProps> {
+}
+declare const MarqueeEdge: import("svelte").Component<MarqueeEdgeProps, {}, "ref">;
+type MarqueeEdge = ReturnType<typeof MarqueeEdge>;
+export default MarqueeEdge;

package/dist/components/marquee/marquee-item.svelte

@@ -0,0 +1,19 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  export interface MarqueeItemBaseProps extends PolymorphicProps<'div'>, RefAttribute {}
+  export interface MarqueeItemProps extends Assign<HTMLProps<'div'>, MarqueeItemBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { useMarqueeContext } from './use-marquee-context'
+
+  let { ref = $bindable(null), ...props }: MarqueeItemProps = $props()
+
+  const marquee = useMarqueeContext()
+  const mergedProps = $derived(mergeProps(marquee().getItemProps(), props))
+</script>
+
+<Sprawlify as="div" bind:ref {...mergedProps} />

package/dist/components/marquee/marquee-item.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface MarqueeItemBaseProps extends PolymorphicProps<'div'>, RefAttribute {
+}
+export interface MarqueeItemProps extends Assign<HTMLProps<'div'>, MarqueeItemBaseProps> {
+}
+declare const MarqueeItem: import("svelte").Component<MarqueeItemProps, {}, "ref">;
+type MarqueeItem = ReturnType<typeof MarqueeItem>;
+export default MarqueeItem;

package/dist/components/marquee/marquee-root-provider.svelte

@@ -0,0 +1,25 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+  import type { UseMarqueeReturn } from './use-marquee.svelte'
+
+  interface RootProviderProps {
+    value: UseMarqueeReturn
+  }
+
+  export interface MarqueeRootProviderBaseProps extends RootProviderProps, PolymorphicProps<'div'>, RefAttribute {}
+  export interface MarqueeRootProviderProps extends Assign<HTMLProps<'div'>, MarqueeRootProviderBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { MarqueeProvider } from './use-marquee-context'
+
+  let { ref = $bindable(null), ...props }: MarqueeRootProviderProps = $props()
+  const { value: marquee, ...localProps } = props
+  const mergedProps = $derived(mergeProps(marquee().getRootProps(), localProps))
+
+  MarqueeProvider(marquee)
+</script>
+
+<Sprawlify as="div" bind:ref {...mergedProps} />

package/dist/components/marquee/marquee-root-provider.svelte.d.ts

@@ -0,0 +1,12 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+import type { UseMarqueeReturn } from './use-marquee.svelte';
+interface RootProviderProps {
+    value: UseMarqueeReturn;
+}
+export interface MarqueeRootProviderBaseProps extends RootProviderProps, PolymorphicProps<'div'>, RefAttribute {
+}
+export interface MarqueeRootProviderProps extends Assign<HTMLProps<'div'>, MarqueeRootProviderBaseProps> {
+}
+declare const MarqueeRootProvider: import("svelte").Component<MarqueeRootProviderProps, {}, "ref">;
+type MarqueeRootProvider = ReturnType<typeof MarqueeRootProvider>;
+export default MarqueeRootProvider;

package/dist/components/marquee/marquee-root.svelte

@@ -0,0 +1,54 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, Optional, PolymorphicProps, RefAttribute } from '../../types'
+  import type { UseMarqueeProps } from './use-marquee.svelte'
+
+  export interface MarqueeRootBaseProps
+    extends Optional<UseMarqueeProps, 'id'>,
+      PolymorphicProps<'div'>,
+      RefAttribute {}
+  export interface MarqueeRootProps extends Assign<HTMLProps<'div'>, MarqueeRootBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { createSplitProps } from '../../utils/create-split-props'
+  import { Sprawlify } from '../factory'
+  import { MarqueeProvider } from './use-marquee-context'
+  import { useMarquee } from './use-marquee.svelte'
+
+  let { ref = $bindable(null), ...props }: MarqueeRootProps = $props()
+  const providedId = $props.id()
+
+  const [useMarqueeProps, localProps] = $derived(
+    createSplitProps<Optional<UseMarqueeProps, 'id'>>()(props, [
+      'autoFill',
+      'defaultPaused',
+      'delay',
+      'id',
+      'ids',
+      'loopCount',
+      'onComplete',
+      'onLoopComplete',
+      'onPauseChange',
+      'paused',
+      'pauseOnInteraction',
+      'reverse',
+      'side',
+      'spacing',
+      'speed',
+      'translations',
+    ]),
+  )
+
+  const resolvedProps = $derived({
+    ...useMarqueeProps,
+    id: providedId,
+  })
+
+  const marquee = useMarquee(() => resolvedProps)
+  const mergedProps = $derived(mergeProps(marquee().getRootProps(), localProps))
+
+  MarqueeProvider(marquee)
+</script>
+
+<Sprawlify as="div" bind:ref {...mergedProps} />

package/dist/components/marquee/marquee-root.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { Assign, HTMLProps, Optional, PolymorphicProps, RefAttribute } from '../../types';
+import type { UseMarqueeProps } from './use-marquee.svelte';
+export interface MarqueeRootBaseProps extends Optional<UseMarqueeProps, 'id'>, PolymorphicProps<'div'>, RefAttribute {
+}
+export interface MarqueeRootProps extends Assign<HTMLProps<'div'>, MarqueeRootBaseProps> {
+}
+declare const MarqueeRoot: import("svelte").Component<MarqueeRootProps, {}, "ref">;
+type MarqueeRoot = ReturnType<typeof MarqueeRoot>;
+export default MarqueeRoot;

package/dist/components/marquee/marquee-viewport.svelte

@@ -0,0 +1,19 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  export interface MarqueeViewportBaseProps extends PolymorphicProps<'div'>, RefAttribute {}
+  export interface MarqueeViewportProps extends Assign<HTMLProps<'div'>, MarqueeViewportBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { useMarqueeContext } from './use-marquee-context'
+
+  let { ref = $bindable(null), ...props }: MarqueeViewportProps = $props()
+
+  const marquee = useMarqueeContext()
+  const mergedProps = $derived(mergeProps(marquee().getViewportProps(), props))
+</script>
+
+<Sprawlify as="div" bind:ref {...mergedProps} />

package/dist/components/marquee/marquee-viewport.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface MarqueeViewportBaseProps extends PolymorphicProps<'div'>, RefAttribute {
+}
+export interface MarqueeViewportProps extends Assign<HTMLProps<'div'>, MarqueeViewportBaseProps> {
+}
+declare const MarqueeViewport: import("svelte").Component<MarqueeViewportProps, {}, "ref">;
+type MarqueeViewport = ReturnType<typeof MarqueeViewport>;
+export default MarqueeViewport;

package/dist/components/marquee/marquee.d.ts

@@ -0,0 +1,8 @@
+export type { PauseStatusDetails, Side } from '@sprawlify/primitives/machines/marquee';
+export { default as Content, type MarqueeContentBaseProps as ContentBaseProps, type MarqueeContentProps as ContentProps, } from './marquee-content.svelte';
+export { default as Context, type MarqueeContextProps as ContextProps } from './marquee-context.svelte';
+export { default as Edge, type MarqueeEdgeBaseProps as EdgeBaseProps, type MarqueeEdgeProps as EdgeProps, } from './marquee-edge.svelte';
+export { default as Item, type MarqueeItemBaseProps as ItemBaseProps, type MarqueeItemProps as ItemProps, } from './marquee-item.svelte';
+export { default as Root, type MarqueeRootBaseProps as RootBaseProps, type MarqueeRootProps as RootProps, } from './marquee-root.svelte';
+export { default as RootProvider, type MarqueeRootProviderBaseProps as RootProviderBaseProps, type MarqueeRootProviderProps as RootProviderProps, } from './marquee-root-provider.svelte';
+export { default as Viewport, type MarqueeViewportBaseProps as ViewportBaseProps, type MarqueeViewportProps as ViewportProps, } from './marquee-viewport.svelte';

package/dist/components/marquee/marquee.js

@@ -0,0 +1,7 @@
+export { default as Content, } from './marquee-content.svelte';
+export { default as Context } from './marquee-context.svelte';
+export { default as Edge, } from './marquee-edge.svelte';
+export { default as Item, } from './marquee-item.svelte';
+export { default as Root, } from './marquee-root.svelte';
+export { default as RootProvider, } from './marquee-root-provider.svelte';
+export { default as Viewport, } from './marquee-viewport.svelte';

package/dist/components/marquee/use-marquee-context.d.ts

@@ -0,0 +1,4 @@
+import type { UseMarqueeReturn } from './use-marquee.svelte';
+export interface UseMarqueeContext extends UseMarqueeReturn {
+}
+export declare const MarqueeProvider: (opts: UseMarqueeContext) => void, useMarqueeContext: (fallback?: UseMarqueeContext | undefined) => UseMarqueeContext;

package/dist/components/marquee/use-marquee-context.js

@@ -0,0 +1,5 @@
+import { createContext } from '../../utils/create-context';
+export const [MarqueeProvider, useMarqueeContext] = createContext({
+    hookName: 'useMarqueeContext',
+    providerName: '<MarqueeProvider />',
+});

package/dist/components/marquee/use-marquee.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { Accessor } from '../../types';
+import * as marquee from '@sprawlify/primitives/machines/marquee';
+import { type PropTypes } from '../../core';
+import { type MaybeFunction } from '@sprawlify/primitives/utils';
+export interface UseMarqueeProps extends Omit<marquee.Props, 'dir' | 'getRootNode'> {
+}
+export interface UseMarqueeReturn extends Accessor<marquee.Api<PropTypes>> {
+}
+export declare const useMarquee: (props: MaybeFunction<UseMarqueeProps>) => () => marquee.Api<PropTypes>;

package/dist/components/marquee/use-marquee.svelte.js

@@ -0,0 +1,20 @@
+import { useEnvironmentContext } from '../../providers/environment';
+import { useLocaleContext } from '../../providers/locale';
+import * as marquee from '@sprawlify/primitives/machines/marquee';
+import { normalizeProps, useMachine } from '../../core';
+import { runIfFn } from '@sprawlify/primitives/utils';
+export const useMarquee = (props) => {
+    const env = useEnvironmentContext();
+    const locale = useLocaleContext();
+    const machineProps = $derived.by(() => {
+        const resolvedProps = runIfFn(props);
+        return {
+            dir: locale().dir,
+            getRootNode: env().getRootNode,
+            ...resolvedProps,
+        };
+    });
+    const service = useMachine(marquee.machine, () => machineProps);
+    const api = $derived(marquee.connect(service, normalizeProps));
+    return () => api;
+};

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

@@ -0,0 +1,28 @@
+export type { FocusOutsideEvent as MenuFocusOutsideEvent, HighlightChangeDetails as MenuHighlightChangeDetails, InteractOutsideEvent as MenuInteractOutsideEvent, OpenChangeDetails as MenuOpenChangeDetails, PointerDownOutsideEvent as MenuPointerDownOutsideEvent, SelectionDetails as MenuSelectionDetails, } from '@sprawlify/primitives/machines/menu';
+export { default as MenuArrowTip, type MenuArrowTipBaseProps, type MenuArrowTipProps } from './menu-arrow-tip.svelte';
+export { default as MenuArrow, type MenuArrowBaseProps, type MenuArrowProps } from './menu-arrow.svelte';
+export { default as MenuCheckboxItem, type MenuCheckboxItemBaseProps, type MenuCheckboxItemProps, } from './menu-checkbox-item.svelte';
+export { default as MenuContent, type MenuContentBaseProps, type MenuContentProps } from './menu-content.svelte';
+export { default as MenuContextTrigger, type MenuContextTriggerBaseProps, type MenuContextTriggerProps, } from './menu-context-trigger.svelte';
+export { default as MenuContext, type MenuContextProps } from './menu-context.svelte';
+export { default as MenuIndicator, type MenuIndicatorBaseProps, type MenuIndicatorProps } from './menu-indicator.svelte';
+export { default as MenuItemContext, type MenuItemContextProps } from './menu-item-context.svelte';
+export { default as MenuItemGroupLabel, type MenuItemGroupLabelBaseProps, type MenuItemGroupLabelProps, } from './menu-item-group-label.svelte';
+export { default as MenuItemGroup, type MenuItemGroupBaseProps, type MenuItemGroupProps, } from './menu-item-group.svelte';
+export { default as MenuItemIndicator, type MenuItemIndicatorBaseProps, type MenuItemIndicatorProps, } from './menu-item-indicator.svelte';
+export { default as MenuItemText, type MenuItemTextBaseProps, type MenuItemTextProps } from './menu-item-text.svelte';
+export { default as MenuItem, type MenuItemBaseProps, type MenuItemProps } from './menu-item.svelte';
+export { default as MenuPositioner, type MenuPositionerBaseProps, type MenuPositionerProps, } from './menu-positioner.svelte';
+export { default as MenuRadioItemGroup, type MenuRadioItemGroupBaseProps, type MenuRadioItemGroupProps, } from './menu-radio-item-group.svelte';
+export { default as MenuRadioItem, type MenuRadioItemBaseProps, type MenuRadioItemProps, } from './menu-radio-item.svelte';
+export { default as MenuRootProvider, type MenuRootProviderBaseProps, type MenuRootProviderProps, } from './menu-root-provider.svelte';
+export { default as MenuRoot, type MenuRootBaseProps, type MenuRootProps } from './menu-root.svelte';
+export { default as MenuSeparator, type MenuSeparatorBaseProps, type MenuSeparatorProps } from './menu-separator.svelte';
+export { default as MenuTriggerItem, type MenuTriggerItemBaseProps, type MenuTriggerItemProps, } from './menu-trigger-item.svelte';
+export { default as MenuTrigger, type MenuTriggerBaseProps, type MenuTriggerProps } from './menu-trigger.svelte';
+export { menuAnatomy } from './menu-anatomy';
+export { useMenuContext, type UseMenuContext } from './use-menu-context';
+export { useMenuItemContext, type UseMenuItemContext } from './use-menu-item-context';
+export type { ValueChangeDetails as MenuValueChangeDetails } from './use-menu-item-group-context';
+export { useMenu, type UseMenuProps, type UseMenuReturn } from './use-menu.svelte';
+export * as Menu from './menu';

package/dist/components/menu/index.js

@@ -0,0 +1,26 @@
+export { default as MenuArrowTip } from './menu-arrow-tip.svelte';
+export { default as MenuArrow } from './menu-arrow.svelte';
+export { default as MenuCheckboxItem, } from './menu-checkbox-item.svelte';
+export { default as MenuContent } from './menu-content.svelte';
+export { default as MenuContextTrigger, } from './menu-context-trigger.svelte';
+export { default as MenuContext } from './menu-context.svelte';
+export { default as MenuIndicator } from './menu-indicator.svelte';
+export { default as MenuItemContext } from './menu-item-context.svelte';
+export { default as MenuItemGroupLabel, } from './menu-item-group-label.svelte';
+export { default as MenuItemGroup, } from './menu-item-group.svelte';
+export { default as MenuItemIndicator, } from './menu-item-indicator.svelte';
+export { default as MenuItemText } from './menu-item-text.svelte';
+export { default as MenuItem } from './menu-item.svelte';
+export { default as MenuPositioner, } from './menu-positioner.svelte';
+export { default as MenuRadioItemGroup, } from './menu-radio-item-group.svelte';
+export { default as MenuRadioItem, } from './menu-radio-item.svelte';
+export { default as MenuRootProvider, } from './menu-root-provider.svelte';
+export { default as MenuRoot } from './menu-root.svelte';
+export { default as MenuSeparator } from './menu-separator.svelte';
+export { default as MenuTriggerItem, } from './menu-trigger-item.svelte';
+export { default as MenuTrigger } from './menu-trigger.svelte';
+export { menuAnatomy } from './menu-anatomy';
+export { useMenuContext } from './use-menu-context';
+export { useMenuItemContext } from './use-menu-item-context';
+export { useMenu } from './use-menu.svelte';
+export * as Menu from './menu';

package/dist/components/menu/menu-anatomy.d.ts

@@ -0,0 +1 @@
+export { anatomy as menuAnatomy } from '@sprawlify/primitives/machines/menu';

package/dist/components/menu/menu-anatomy.js

@@ -0,0 +1 @@
+export { anatomy as menuAnatomy } from '@sprawlify/primitives/machines/menu';

package/dist/components/menu/menu-arrow-tip.svelte

@@ -0,0 +1,19 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  export interface MenuArrowTipBaseProps extends PolymorphicProps<'div'>, RefAttribute {}
+  export interface MenuArrowTipProps extends Assign<HTMLProps<'div'>, MenuArrowTipBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { useMenuContext } from './use-menu-context'
+
+  let { ref = $bindable(null), ...props }: MenuArrowTipProps = $props()
+
+  const menu = useMenuContext()
+  const mergedProps = $derived(mergeProps(menu().getArrowTipProps(), props))
+</script>
+
+<Sprawlify as="div" bind:ref {...mergedProps} />

package/dist/components/menu/menu-arrow-tip.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface MenuArrowTipBaseProps extends PolymorphicProps<'div'>, RefAttribute {
+}
+export interface MenuArrowTipProps extends Assign<HTMLProps<'div'>, MenuArrowTipBaseProps> {
+}
+declare const MenuArrowTip: import("svelte").Component<MenuArrowTipProps, {}, "ref">;
+type MenuArrowTip = ReturnType<typeof MenuArrowTip>;
+export default MenuArrowTip;

package/dist/components/menu/menu-arrow.svelte

@@ -0,0 +1,19 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  export interface MenuArrowBaseProps extends PolymorphicProps<'div'>, RefAttribute {}
+  export interface MenuArrowProps extends Assign<HTMLProps<'div'>, MenuArrowBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { useMenuContext } from './use-menu-context'
+
+  let { ref = $bindable(null), ...props }: MenuArrowProps = $props()
+
+  const menu = useMenuContext()
+  const mergedProps = $derived(mergeProps(menu().getArrowProps(), props))
+</script>
+
+<Sprawlify as="div" bind:ref {...mergedProps} />

package/dist/components/menu/menu-arrow.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface MenuArrowBaseProps extends PolymorphicProps<'div'>, RefAttribute {
+}
+export interface MenuArrowProps extends Assign<HTMLProps<'div'>, MenuArrowBaseProps> {
+}
+declare const MenuArrow: import("svelte").Component<MenuArrowProps, {}, "ref">;
+type MenuArrow = ReturnType<typeof MenuArrow>;
+export default MenuArrow;

package/dist/components/menu/menu-checkbox-item.svelte

@@ -0,0 +1,50 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+  import type { OptionItemProps } from '@sprawlify/primitives/machines/menu'
+
+  type PartialOptionItemProps = Omit<OptionItemProps, 'type'>
+
+  export interface MenuCheckboxItemBaseProps extends PartialOptionItemProps, PolymorphicProps<'div'>, RefAttribute {}
+  export interface MenuCheckboxItemProps extends Assign<HTMLProps<'div'>, MenuCheckboxItemBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { createSplitProps } from '../../utils/create-split-props'
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { useMenuContext } from './use-menu-context'
+  import { MenuItemProvider } from './use-menu-item-context'
+  import { MenuItemPropsProvider } from './use-menu-option-item-props-context'
+
+  let { ref = $bindable(null), checked = $bindable<boolean>(), ...props }: MenuCheckboxItemProps = $props()
+
+  const [partialOptionItemProps, localProps] = $derived(
+    createSplitProps<PartialOptionItemProps>()({ checked, ...props }, [
+      'checked',
+      'closeOnSelect',
+      'disabled',
+      'onCheckedChange',
+      'value',
+      'valueText',
+    ]),
+  )
+
+  const optionItemProps = $derived<OptionItemProps>({
+    ...partialOptionItemProps,
+    type: 'checkbox',
+    checked,
+    onCheckedChange(nextChecked) {
+      if (checked !== undefined) checked = nextChecked
+      partialOptionItemProps.onCheckedChange?.(nextChecked)
+    },
+  })
+
+  const menu = useMenuContext()
+  const mergedProps = $derived(mergeProps(menu().getOptionItemProps(optionItemProps), localProps))
+  const optionItemState = $derived(menu().getOptionItemState(optionItemProps))
+
+  MenuItemPropsProvider(() => optionItemProps)
+  MenuItemProvider(() => optionItemState)
+</script>
+
+<Sprawlify as="div" bind:ref {...mergedProps} />

package/dist/components/menu/menu-checkbox-item.svelte.d.ts

@@ -0,0 +1,10 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+import type { OptionItemProps } from '@sprawlify/primitives/machines/menu';
+type PartialOptionItemProps = Omit<OptionItemProps, 'type'>;
+export interface MenuCheckboxItemBaseProps extends PartialOptionItemProps, PolymorphicProps<'div'>, RefAttribute {
+}
+export interface MenuCheckboxItemProps extends Assign<HTMLProps<'div'>, MenuCheckboxItemBaseProps> {
+}
+declare const MenuCheckboxItem: import("svelte").Component<MenuCheckboxItemProps, {}, "checked" | "ref">;
+type MenuCheckboxItem = ReturnType<typeof MenuCheckboxItem>;
+export default MenuCheckboxItem;

package/dist/components/menu/menu-content.svelte

@@ -0,0 +1,27 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  export interface MenuContentBaseProps extends PolymorphicProps<'div'>, RefAttribute {}
+  export interface MenuContentProps extends Assign<HTMLProps<'div'>, MenuContentBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { usePresenceContext } from '../presence'
+  import { useMenuContext } from './use-menu-context'
+
+  let { ref = $bindable(null), ...props }: MenuContentProps = $props()
+
+  const menu = useMenuContext()
+  const presence = usePresenceContext()
+  const mergedProps = $derived(mergeProps(menu().getContentProps(), presence().getPresenceProps(), props))
+
+  function setNode(node: HTMLElement | null) {
+    presence().setNode(node)
+  }
+</script>
+
+{#if !presence().unmounted}
+  <Sprawlify as="div" bind:ref {@attach setNode} {...mergedProps} />
+{/if}

package/dist/components/menu/menu-content.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface MenuContentBaseProps extends PolymorphicProps<'div'>, RefAttribute {
+}
+export interface MenuContentProps extends Assign<HTMLProps<'div'>, MenuContentBaseProps> {
+}
+declare const MenuContent: import("svelte").Component<MenuContentProps, {}, "ref">;
+type MenuContent = ReturnType<typeof MenuContent>;
+export default MenuContent;

package/dist/components/menu/menu-context-trigger.svelte

@@ -0,0 +1,19 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  export interface MenuContextTriggerBaseProps extends PolymorphicProps<'button'>, RefAttribute {}
+  export interface MenuContextTriggerProps extends Assign<HTMLProps<'button'>, MenuContextTriggerBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { useMenuContext } from './use-menu-context'
+
+  let { ref = $bindable(null), ...props }: MenuContextTriggerProps = $props()
+
+  const menu = useMenuContext()
+  const mergedProps = $derived(mergeProps(menu().getContextTriggerProps(), props))
+</script>
+
+<Sprawlify as="button" bind:ref {...mergedProps} />

package/dist/components/menu/menu-context-trigger.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface MenuContextTriggerBaseProps extends PolymorphicProps<'button'>, RefAttribute {
+}
+export interface MenuContextTriggerProps extends Assign<HTMLProps<'button'>, MenuContextTriggerBaseProps> {
+}
+declare const MenuContextTrigger: import("svelte").Component<MenuContextTriggerProps, {}, "ref">;
+type MenuContextTrigger = ReturnType<typeof MenuContextTrigger>;
+export default MenuContextTrigger;

package/dist/components/menu/menu-context.svelte

@@ -0,0 +1,17 @@
+<script module lang="ts">
+  import type { Snippet } from 'svelte'
+  import type { UseMenuContext } from './use-menu-context'
+
+  export interface MenuContextProps {
+    render: Snippet<[UseMenuContext]>
+  }
+</script>
+
+<script lang="ts">
+  import { useMenuContext } from './use-menu-context'
+
+  const { render }: MenuContextProps = $props()
+  const context = useMenuContext()
+</script>
+
+{@render render(context)}

package/dist/components/menu/menu-context.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Snippet } from 'svelte';
+import type { UseMenuContext } from './use-menu-context';
+export interface MenuContextProps {
+    render: Snippet<[UseMenuContext]>;
+}
+declare const MenuContext: import("svelte").Component<MenuContextProps, {}, "">;
+type MenuContext = ReturnType<typeof MenuContext>;
+export default MenuContext;

package/dist/components/menu/menu-indicator.svelte

@@ -0,0 +1,19 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  export interface MenuIndicatorBaseProps extends PolymorphicProps<'div'>, RefAttribute {}
+  export interface MenuIndicatorProps extends Assign<HTMLProps<'div'>, MenuIndicatorBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { useMenuContext } from './use-menu-context'
+
+  let { ref = $bindable(null), ...props }: MenuIndicatorProps = $props()
+
+  const menu = useMenuContext()
+  const mergedProps = $derived(mergeProps(menu().getIndicatorProps(), props))
+</script>
+
+<Sprawlify as="div" bind:ref {...mergedProps} />

package/dist/components/menu/menu-indicator.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface MenuIndicatorBaseProps extends PolymorphicProps<'div'>, RefAttribute {
+}
+export interface MenuIndicatorProps extends Assign<HTMLProps<'div'>, MenuIndicatorBaseProps> {
+}
+declare const MenuIndicator: import("svelte").Component<MenuIndicatorProps, {}, "ref">;
+type MenuIndicator = ReturnType<typeof MenuIndicator>;
+export default MenuIndicator;

package/dist/components/menu/menu-item-context.svelte

@@ -0,0 +1,14 @@
+<script lang="ts">
+  import type { Snippet } from 'svelte'
+  import { useMenuItemContext, type UseMenuItemContext } from './use-menu-item-context'
+
+  export interface MenuItemContextProps {
+    render: Snippet<[UseMenuItemContext]>
+  }
+
+  const props: MenuItemContextProps = $props()
+
+  const context = useMenuItemContext()
+</script>
+
+{@render props.render(context)}

package/dist/components/menu/menu-item-context.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Snippet } from 'svelte';
+import { type UseMenuItemContext } from './use-menu-item-context';
+export interface MenuItemContextProps {
+    render: Snippet<[UseMenuItemContext]>;
+}
+declare const MenuItemContext: import("svelte").Component<MenuItemContextProps, {}, "">;
+type MenuItemContext = ReturnType<typeof MenuItemContext>;
+export default MenuItemContext;

package/dist/components/menu/menu-item-group-label.svelte

@@ -0,0 +1,21 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  export interface MenuItemGroupLabelBaseProps extends PolymorphicProps<'div'>, RefAttribute {}
+  export interface MenuItemGroupLabelProps extends Assign<HTMLProps<'div'>, MenuItemGroupLabelBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { useMenuContext } from './use-menu-context'
+  import { useMenuItemGroupContext } from './use-menu-item-group-context'
+
+  let { ref = $bindable(null), ...props }: MenuItemGroupLabelProps = $props()
+
+  const menu = useMenuContext()
+  const itemGroup = useMenuItemGroupContext()
+  const mergedProps = $derived(mergeProps(menu().getItemGroupLabelProps({ htmlFor: itemGroup().id }), props))
+</script>
+
+<Sprawlify as="div" bind:ref {...mergedProps} />

package/dist/components/menu/menu-item-group-label.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface MenuItemGroupLabelBaseProps extends PolymorphicProps<'div'>, RefAttribute {
+}
+export interface MenuItemGroupLabelProps extends Assign<HTMLProps<'div'>, MenuItemGroupLabelBaseProps> {
+}
+declare const MenuItemGroupLabel: import("svelte").Component<MenuItemGroupLabelProps, {}, "ref">;
+type MenuItemGroupLabel = ReturnType<typeof MenuItemGroupLabel>;
+export default MenuItemGroupLabel;