@cloudvoyant/helical-svelte 0.19.0

package/dist/listbox/Listbox.svelte

@@ -0,0 +1,33 @@
+<!-- libs/helical-svelte/src/listbox/Listbox.svelte -->
+<!-- Closely based on: Ark UI listbox (@ark-ui/svelte/listbox), mirrored from @cloudvoyant/helical-react. -->
+<!-- Thin pass-through: owns the collection; the consumer renders the Listbox parts as children. -->
+<!-- There is intentionally no filterFn/filterQuery seam — filtering the collection without -->
+<!-- filtering the children would desync them. Filter `items` yourself and pass the result. -->
+<script lang="ts">
+  import {
+    ListboxRoot,
+    createListCollection,
+    type ListboxRootProps,
+    type CollectionItem,
+    type ListCollection,
+  } from '@ark-ui/svelte/listbox';
+  import { listboxRootBase, cn, type ListboxItemData } from '@cloudvoyant/helical-ui';
+  import type { Snippet } from 'svelte';
+
+  type Props = Omit<ListboxRootProps<CollectionItem>, 'collection'> & {
+    items?: ListboxItemData[];
+    collection?: ListCollection<CollectionItem>;
+    class?: string;
+    children?: Snippet;
+  };
+
+  let { items = [], collection, class: className = '', children, ...rest }: Props = $props();
+
+  const resolvedCollection = $derived(collection ?? createListCollection({ items }));
+
+  const classes = $derived(cn(listboxRootBase, className));
+</script>
+
+<ListboxRoot collection={resolvedCollection} class={classes} {...rest}>
+  {#if children}{@render children()}{/if}
+</ListboxRoot>

package/dist/listbox/Listbox.svelte.d.ts

@@ -0,0 +1,12 @@
+import { type ListboxRootProps, type CollectionItem, type ListCollection } from '@ark-ui/svelte/listbox';
+import { type ListboxItemData } from '@cloudvoyant/helical-ui';
+import type { Snippet } from 'svelte';
+type Props = Omit<ListboxRootProps<CollectionItem>, 'collection'> & {
+    items?: ListboxItemData[];
+    collection?: ListCollection<CollectionItem>;
+    class?: string;
+    children?: Snippet;
+};
+declare const Listbox: import("svelte").Component<Props, {}, "">;
+type Listbox = ReturnType<typeof Listbox>;
+export default Listbox;

package/dist/listbox/ListboxContent.svelte

@@ -0,0 +1,18 @@
+<!-- libs/helical-svelte/src/listbox/ListboxContent.svelte -->
+<!-- The scrollable, `role="listbox"` surface. Options go inside; interactive chrome (the -->
+<!-- filter input) must sit OUTSIDE this element, as a sibling under Listbox. -->
+<script lang="ts">
+  import { ListboxContent, type ListboxContentProps } from '@ark-ui/svelte/listbox';
+  import { listboxContentBase, cn } from '@cloudvoyant/helical-ui';
+  import type { Snippet } from 'svelte';
+
+  type Props = ListboxContentProps & { class?: string; children?: Snippet };
+
+  let { class: className = '', children, ...rest }: Props = $props();
+
+  const classes = $derived(cn(listboxContentBase, className));
+</script>
+
+<ListboxContent class={classes} {...rest}>
+  {#if children}{@render children()}{/if}
+</ListboxContent>

package/dist/listbox/ListboxContent.svelte.d.ts

@@ -0,0 +1,9 @@
+import { ListboxContent, type ListboxContentProps } from '@ark-ui/svelte/listbox';
+import type { Snippet } from 'svelte';
+type Props = ListboxContentProps & {
+    class?: string;
+    children?: Snippet;
+};
+declare const ListboxContent: import("svelte").Component<Props, {}, "">;
+type ListboxContent = ReturnType<typeof ListboxContent>;
+export default ListboxContent;

package/dist/listbox/ListboxContext.svelte.d.ts

@@ -0,0 +1 @@
+export { useListboxContext as useListbox } from '@ark-ui/svelte/listbox';

package/dist/listbox/ListboxContext.svelte.js

@@ -0,0 +1,3 @@
+// libs/helical-svelte/src/listbox/ListboxContext.svelte.ts
+// Closely based on: @ark-ui/svelte/listbox useListboxContext, mirrored from @cloudvoyant/helical-react.
+export { useListboxContext as useListbox } from '@ark-ui/svelte/listbox';

package/dist/listbox/ListboxEmpty.svelte

@@ -0,0 +1,14 @@
+<!-- libs/helical-svelte/src/listbox/ListboxEmpty.svelte -->
+<script lang="ts">
+  import { ListboxEmpty, type ListboxEmptyProps } from '@ark-ui/svelte/listbox';
+  import { listboxEmptyBase, cn } from '@cloudvoyant/helical-ui';
+  import type { Snippet } from 'svelte';
+
+  type Props = ListboxEmptyProps & { class?: string; children?: Snippet };
+
+  let { class: className = '', children, ...rest }: Props = $props();
+</script>
+
+<ListboxEmpty class={cn(listboxEmptyBase, className)} {...rest}>
+  {#if children}{@render children()}{:else}No results.{/if}
+</ListboxEmpty>

package/dist/listbox/ListboxEmpty.svelte.d.ts

@@ -0,0 +1,9 @@
+import { ListboxEmpty, type ListboxEmptyProps } from '@ark-ui/svelte/listbox';
+import type { Snippet } from 'svelte';
+type Props = ListboxEmptyProps & {
+    class?: string;
+    children?: Snippet;
+};
+declare const ListboxEmpty: import("svelte").Component<Props, {}, "">;
+type ListboxEmpty = ReturnType<typeof ListboxEmpty>;
+export default ListboxEmpty;

package/dist/listbox/ListboxInput.svelte

@@ -0,0 +1,14 @@
+<!-- libs/helical-svelte/src/listbox/ListboxInput.svelte -->
+<!-- Ark's listbox input: supplies arrow/Home/End forwarding to the list, highlight -->
+<!-- management, and the aria-activedescendant / aria-controls linkage. Must be a SIBLING -->
+<!-- of ListboxContent (never inside role="listbox"), so it also stays out of the scroller. -->
+<script lang="ts">
+  import { ListboxInput, type ListboxInputProps } from '@ark-ui/svelte/listbox';
+  import { listboxInputBase, cn } from '@cloudvoyant/helical-ui';
+
+  type Props = ListboxInputProps & { class?: string };
+
+  let { class: className = '', ...rest }: Props = $props();
+</script>
+
+<ListboxInput class={cn(listboxInputBase, className)} {...rest} />

package/dist/listbox/ListboxInput.svelte.d.ts

@@ -0,0 +1,7 @@
+import { ListboxInput, type ListboxInputProps } from '@ark-ui/svelte/listbox';
+type Props = ListboxInputProps & {
+    class?: string;
+};
+declare const ListboxInput: import("svelte").Component<Props, {}, "">;
+type ListboxInput = ReturnType<typeof ListboxInput>;
+export default ListboxInput;

package/dist/listbox/ListboxItem.svelte

@@ -0,0 +1,20 @@
+<!-- libs/helical-svelte/src/listbox/ListboxItem.svelte -->
+<!-- Pass-through, matching SelectItem: `children` are the row's CONTENT. Compose -->
+<!-- ListboxItemText / ListboxItemIndicator inside. -->
+<script lang="ts">
+  import { ListboxItem, type ListboxItemProps, type CollectionItem } from '@ark-ui/svelte/listbox';
+  import { listboxItemBase, cn } from '@cloudvoyant/helical-ui';
+  import type { Snippet } from 'svelte';
+
+  type Props = Omit<ListboxItemProps, 'item'> & {
+    item: CollectionItem;
+    class?: string;
+    children?: Snippet;
+  };
+
+  let { item, class: className = '', children, ...rest }: Props = $props();
+</script>
+
+<ListboxItem {item} class={cn(listboxItemBase, className)} {...rest}>
+  {@render children?.()}
+</ListboxItem>

package/dist/listbox/ListboxItem.svelte.d.ts

@@ -0,0 +1,10 @@
+import { ListboxItem, type ListboxItemProps, type CollectionItem } from '@ark-ui/svelte/listbox';
+import type { Snippet } from 'svelte';
+type Props = Omit<ListboxItemProps, 'item'> & {
+    item: CollectionItem;
+    class?: string;
+    children?: Snippet;
+};
+declare const ListboxItem: import("svelte").Component<Props, {}, "">;
+type ListboxItem = ReturnType<typeof ListboxItem>;
+export default ListboxItem;

package/dist/listbox/ListboxItemIndicator.svelte

@@ -0,0 +1,14 @@
+<!-- libs/helical-svelte/src/listbox/ListboxItemIndicator.svelte -->
+<script lang="ts">
+  import { ListboxItemIndicator, type ListboxItemIndicatorProps } from '@ark-ui/svelte/listbox';
+  import { listboxItemIndicatorBase, cn } from '@cloudvoyant/helical-ui';
+  import type { Snippet } from 'svelte';
+
+  type Props = ListboxItemIndicatorProps & { class?: string; children?: Snippet };
+
+  let { class: className = '', children, ...rest }: Props = $props();
+</script>
+
+<ListboxItemIndicator class={cn(listboxItemIndicatorBase, className)} {...rest}>
+  {#if children}{@render children()}{/if}
+</ListboxItemIndicator>

package/dist/listbox/ListboxItemIndicator.svelte.d.ts

@@ -0,0 +1,9 @@
+import { ListboxItemIndicator, type ListboxItemIndicatorProps } from '@ark-ui/svelte/listbox';
+import type { Snippet } from 'svelte';
+type Props = ListboxItemIndicatorProps & {
+    class?: string;
+    children?: Snippet;
+};
+declare const ListboxItemIndicator: import("svelte").Component<Props, {}, "">;
+type ListboxItemIndicator = ReturnType<typeof ListboxItemIndicator>;
+export default ListboxItemIndicator;

package/dist/listbox/ListboxItemText.svelte

@@ -0,0 +1,14 @@
+<!-- libs/helical-svelte/src/listbox/ListboxItemText.svelte -->
+<script lang="ts">
+  import { ListboxItemText, type ListboxItemTextProps } from '@ark-ui/svelte/listbox';
+  import { listboxItemTextBase, cn } from '@cloudvoyant/helical-ui';
+  import type { Snippet } from 'svelte';
+
+  type Props = ListboxItemTextProps & { class?: string; children?: Snippet };
+
+  let { class: className = '', children, ...rest }: Props = $props();
+</script>
+
+<ListboxItemText class={cn(listboxItemTextBase, className)} {...rest}>
+  {#if children}{@render children()}{/if}
+</ListboxItemText>

package/dist/listbox/ListboxItemText.svelte.d.ts

@@ -0,0 +1,9 @@
+import { ListboxItemText, type ListboxItemTextProps } from '@ark-ui/svelte/listbox';
+import type { Snippet } from 'svelte';
+type Props = ListboxItemTextProps & {
+    class?: string;
+    children?: Snippet;
+};
+declare const ListboxItemText: import("svelte").Component<Props, {}, "">;
+type ListboxItemText = ReturnType<typeof ListboxItemText>;
+export default ListboxItemText;

package/dist/listbox/ListboxLabel.svelte

@@ -0,0 +1,14 @@
+<!-- libs/helical-svelte/src/listbox/ListboxLabel.svelte -->
+<script lang="ts">
+  import { ListboxLabel, type ListboxLabelProps } from '@ark-ui/svelte/listbox';
+  import { listboxLabelBase, cn } from '@cloudvoyant/helical-ui';
+  import type { Snippet } from 'svelte';
+
+  type Props = ListboxLabelProps & { class?: string; children?: Snippet };
+
+  let { class: className = '', children, ...rest }: Props = $props();
+</script>
+
+<ListboxLabel class={cn(listboxLabelBase, className)} {...rest}>
+  {#if children}{@render children()}{/if}
+</ListboxLabel>

package/dist/listbox/ListboxLabel.svelte.d.ts

@@ -0,0 +1,9 @@
+import { ListboxLabel, type ListboxLabelProps } from '@ark-ui/svelte/listbox';
+import type { Snippet } from 'svelte';
+type Props = ListboxLabelProps & {
+    class?: string;
+    children?: Snippet;
+};
+declare const ListboxLabel: import("svelte").Component<Props, {}, "">;
+type ListboxLabel = ReturnType<typeof ListboxLabel>;
+export default ListboxLabel;

package/dist/listbox/index.d.ts

@@ -0,0 +1,9 @@
+export { default as Listbox } from './Listbox.svelte';
+export { default as ListboxContent } from './ListboxContent.svelte';
+export { default as ListboxItem } from './ListboxItem.svelte';
+export { default as ListboxItemText } from './ListboxItemText.svelte';
+export { default as ListboxItemIndicator } from './ListboxItemIndicator.svelte';
+export { default as ListboxInput } from './ListboxInput.svelte';
+export { default as ListboxEmpty } from './ListboxEmpty.svelte';
+export { default as ListboxLabel } from './ListboxLabel.svelte';
+export { useListbox } from './ListboxContext.svelte';

package/dist/listbox/index.js

@@ -0,0 +1,10 @@
+// libs/helical-svelte/src/listbox/index.ts
+export { default as Listbox } from './Listbox.svelte';
+export { default as ListboxContent } from './ListboxContent.svelte';
+export { default as ListboxItem } from './ListboxItem.svelte';
+export { default as ListboxItemText } from './ListboxItemText.svelte';
+export { default as ListboxItemIndicator } from './ListboxItemIndicator.svelte';
+export { default as ListboxInput } from './ListboxInput.svelte';
+export { default as ListboxEmpty } from './ListboxEmpty.svelte';
+export { default as ListboxLabel } from './ListboxLabel.svelte';
+export { useListbox } from './ListboxContext.svelte';

package/dist/navbar/NavbarActions.svelte

@@ -0,0 +1,25 @@
+<!-- libs/helical-svelte/src/navbar/NavbarActions.svelte -->
+<!-- Source: @cloudvoyant/helical-react navbar actions (shadcnblocks navbar6/7, re-based on Ark UI) -->
+<script lang="ts">
+  import { Ark } from '@ark-ui/svelte/factory';
+  import { navbarActionsBase, cn } from '@cloudvoyant/helical-ui';
+  import { getNavbarContext } from './NavbarContext.svelte';
+  import type { Snippet } from 'svelte';
+  import type { HTMLAttributes } from 'svelte/elements';
+
+  type Props = {
+    class?: string;
+    children?: Snippet;
+  } & HTMLAttributes<HTMLDivElement>;
+
+  let { class: className = '', children, ...rest }: Props = $props();
+
+  const navbar = getNavbarContext();
+  $effect(() => navbar.setSlot('actions', children));
+
+  const classes = $derived(cn(navbarActionsBase, className));
+</script>
+
+<Ark as="div" data-slot="navbar-actions" class={classes} {...rest}>
+  {@render children?.()}
+</Ark>

package/dist/navbar/NavbarActions.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { Snippet } from 'svelte';
+import type { HTMLAttributes } from 'svelte/elements';
+type Props = {
+    class?: string;
+    children?: Snippet;
+} & HTMLAttributes<HTMLDivElement>;
+declare const NavbarActions: import("svelte").Component<Props, {}, "">;
+type NavbarActions = ReturnType<typeof NavbarActions>;
+export default NavbarActions;

package/dist/navbar/NavbarActivationArea.svelte

@@ -0,0 +1,30 @@
+<!-- libs/helical-svelte/src/navbar/NavbarActivationArea.svelte -->
+<!-- Source: @cloudvoyant/helical-react navbar activation area (hover reveal for variant="hide") -->
+<script lang="ts">
+  import { Ark } from '@ark-ui/svelte/factory';
+  import { navbarActivationAreaBase, cn } from '@cloudvoyant/helical-ui';
+  import { getNavbarContext } from './NavbarContext.svelte';
+  import type { Snippet } from 'svelte';
+  import type { HTMLAttributes } from 'svelte/elements';
+
+  type Props = {
+    class?: string;
+    children?: Snippet;
+  } & HTMLAttributes<HTMLDivElement>;
+
+  let { class: className = '', children, ...rest }: Props = $props();
+
+  const navbar = getNavbarContext();
+  const classes = $derived(cn(navbarActivationAreaBase, className));
+</script>
+
+<Ark
+  as="div"
+  data-slot="navbar-activation-area"
+  class={classes}
+  onmouseenter={() => navbar.setHovered(true)}
+  onmouseleave={() => navbar.setHovered(false)}
+  {...rest}
+>
+  {@render children?.()}
+</Ark>

package/dist/navbar/NavbarActivationArea.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { Snippet } from 'svelte';
+import type { HTMLAttributes } from 'svelte/elements';
+type Props = {
+    class?: string;
+    children?: Snippet;
+} & HTMLAttributes<HTMLDivElement>;
+declare const NavbarActivationArea: import("svelte").Component<Props, {}, "">;
+type NavbarActivationArea = ReturnType<typeof NavbarActivationArea>;
+export default NavbarActivationArea;

package/dist/navbar/NavbarBrand.svelte

@@ -0,0 +1,25 @@
+<!-- libs/helical-svelte/src/navbar/NavbarBrand.svelte -->
+<!-- Source: @cloudvoyant/helical-react navbar brand (shadcnblocks navbar6/7, re-based on Ark UI) -->
+<script lang="ts">
+  import { Ark } from '@ark-ui/svelte/factory';
+  import { navbarBrandBase, cn } from '@cloudvoyant/helical-ui';
+  import { getNavbarContext } from './NavbarContext.svelte';
+  import type { Snippet } from 'svelte';
+  import type { HTMLAttributes } from 'svelte/elements';
+
+  type Props = {
+    class?: string;
+    children?: Snippet;
+  } & HTMLAttributes<HTMLDivElement>;
+
+  let { class: className = '', children, ...rest }: Props = $props();
+
+  const navbar = getNavbarContext();
+  $effect(() => navbar.setSlot('brand', children));
+
+  const classes = $derived(cn(navbarBrandBase, className));
+</script>
+
+<Ark as="div" data-slot="navbar-brand" class={classes} {...rest}>
+  {@render children?.()}
+</Ark>

package/dist/navbar/NavbarBrand.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { Snippet } from 'svelte';
+import type { HTMLAttributes } from 'svelte/elements';
+type Props = {
+    class?: string;
+    children?: Snippet;
+} & HTMLAttributes<HTMLDivElement>;
+declare const NavbarBrand: import("svelte").Component<Props, {}, "">;
+type NavbarBrand = ReturnType<typeof NavbarBrand>;
+export default NavbarBrand;

package/dist/navbar/NavbarContext.svelte.d.ts

@@ -0,0 +1,25 @@
+import type { Snippet } from 'svelte';
+import type { NavbarDensity, NavbarVariant } from '@cloudvoyant/helical-ui';
+export interface NavbarContextValue {
+    id: string;
+    open: boolean;
+    setOpen: (open: boolean) => void;
+    scrolled: boolean;
+    setScrolled: (scrolled: boolean) => void;
+    density: NavbarDensity;
+    variant: NavbarVariant;
+    floating: boolean;
+    hovered: boolean;
+    setHovered: (hovered: boolean) => void;
+    slots: {
+        brand?: Snippet;
+        actions?: Snippet;
+    };
+    setSlot: (key: 'brand' | 'actions', node: Snippet | undefined) => void;
+    /** The element the mobile overlay portals into (the header's parent). */
+    portalEl: HTMLElement | undefined;
+    setPortalEl: (el: HTMLElement | undefined) => void;
+}
+export declare const NAVBAR_CONTEXT_KEY: unique symbol;
+export declare function setNavbarContext(context: NavbarContextValue): void;
+export declare function getNavbarContext(): NavbarContextValue;

package/dist/navbar/NavbarContext.svelte.js

@@ -0,0 +1,14 @@
+// libs/helical-svelte/src/navbar/NavbarContext.svelte.ts
+// Source: @cloudvoyant/helical-react navbar context (shadcnblocks navbar6/7, re-based on Ark UI)
+import { getContext, setContext } from 'svelte';
+export const NAVBAR_CONTEXT_KEY = Symbol('helical-ui.navbar');
+export function setNavbarContext(context) {
+    setContext(NAVBAR_CONTEXT_KEY, context);
+}
+export function getNavbarContext() {
+    const context = getContext(NAVBAR_CONTEXT_KEY);
+    if (!context) {
+        throw new Error('Navbar parts must be used within a NavbarProvider.');
+    }
+    return context;
+}

package/dist/navbar/NavbarMenu.svelte

@@ -0,0 +1,61 @@
+<!-- libs/helical-svelte/src/navbar/NavbarMenu.svelte -->
+<!-- Source: @cloudvoyant/helical-react navbar menu (shadcnblocks navbar6/7, re-based on Ark UI) -->
+<script lang="ts">
+  import { Ark } from '@ark-ui/svelte/factory';
+  import {
+    NavigationMenuRoot,
+    NavigationMenuViewport,
+    NavigationMenuViewportPositioner,
+    type NavigationMenuRootProps,
+  } from '@ark-ui/svelte/navigation-menu';
+  import {
+    navbarMenuRootBase,
+    navbarMenuViewportPositionerBase,
+    navbarMenuViewportBase,
+    navbarMenuBase,
+    navbarMenuPlacementVariants,
+    cn,
+    type NavbarMenuDensity,
+    type NavbarMenuVariant,
+  } from '@cloudvoyant/helical-ui';
+  import { setNavbarMenuStyle } from './NavbarMenuContext.svelte';
+  import { getNavbarContext } from './NavbarContext.svelte';
+  import type { Snippet } from 'svelte';
+
+  type Props = NavigationMenuRootProps & {
+    placement?: 'left' | 'center' | 'right';
+    class?: string;
+    children?: Snippet;
+  };
+
+  let { placement = 'center', class: className = '', children, ...rest }: Props = $props();
+
+  const navbar = getNavbarContext();
+  const menuDensity = $derived<NavbarMenuDensity>(
+    navbar.density === 'compact' || (navbar.variant === 'shrink' && navbar.scrolled)
+      ? 'compact'
+      : 'relaxed',
+  );
+  const classes = $derived(cn(navbarMenuBase, navbarMenuPlacementVariants({ placement }), className));
+
+  setNavbarMenuStyle({
+    get density() {
+      return menuDensity;
+    },
+    get variant() {
+      return 'default' as NavbarMenuVariant;
+    },
+    get inContent() {
+      return false;
+    },
+  });
+</script>
+
+<Ark as="nav" data-slot="navbar-menu" data-placement={placement} class={classes}>
+  <NavigationMenuRoot data-density={menuDensity} class={cn(navbarMenuRootBase)} {...rest}>
+    {@render children?.()}
+    <NavigationMenuViewportPositioner class={cn(navbarMenuViewportPositionerBase)}>
+      <NavigationMenuViewport class={cn(navbarMenuViewportBase)} />
+    </NavigationMenuViewportPositioner>
+  </NavigationMenuRoot>
+</Ark>

package/dist/navbar/NavbarMenu.svelte.d.ts

@@ -0,0 +1,10 @@
+import { type NavigationMenuRootProps } from '@ark-ui/svelte/navigation-menu';
+import type { Snippet } from 'svelte';
+type Props = NavigationMenuRootProps & {
+    placement?: 'left' | 'center' | 'right';
+    class?: string;
+    children?: Snippet;
+};
+declare const NavbarMenu: import("svelte").Component<Props, {}, "">;
+type NavbarMenu = ReturnType<typeof NavbarMenu>;
+export default NavbarMenu;

package/dist/navbar/NavbarMenuContent.svelte

@@ -0,0 +1,16 @@
+<!-- libs/helical-svelte/src/navbar/NavbarMenuContent.svelte -->
+<!-- Closely based on: @ark-ui/svelte/navigation-menu (Ark UI), mirrored from @cloudvoyant/helical-react -->
+<script lang="ts">
+  import { NavigationMenuContent, type NavigationMenuContentProps } from '@ark-ui/svelte/navigation-menu';
+  import { navbarMenuContentBase, cn } from '@cloudvoyant/helical-ui';
+  import { setNavbarMenuStyle } from './NavbarMenuContext.svelte';
+
+  let { value, class: className = '', children, ...rest }: NavigationMenuContentProps = $props();
+
+  const classes = $derived(cn(navbarMenuContentBase, className));
+  setNavbarMenuStyle({ density: 'relaxed', variant: 'default', inContent: true });
+</script>
+
+<NavigationMenuContent {value} class={classes} {...rest}>
+  {@render children?.()}
+</NavigationMenuContent>

package/dist/navbar/NavbarMenuContent.svelte.d.ts

@@ -0,0 +1,4 @@
+import { type NavigationMenuContentProps } from '@ark-ui/svelte/navigation-menu';
+declare const NavbarMenuContent: import("svelte").Component<NavigationMenuContentProps, {}, "">;
+type NavbarMenuContent = ReturnType<typeof NavbarMenuContent>;
+export default NavbarMenuContent;

package/dist/navbar/NavbarMenuContext.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { NavbarMenuDensity, NavbarMenuVariant } from '@cloudvoyant/helical-ui';
+export interface NavbarMenuStyle {
+    density: NavbarMenuDensity;
+    variant: NavbarMenuVariant;
+    inContent: boolean;
+}
+export declare function setNavbarMenuStyle(style: NavbarMenuStyle): void;
+export declare function getNavbarMenuStyle(): NavbarMenuStyle;

package/dist/navbar/NavbarMenuContext.svelte.js

@@ -0,0 +1,14 @@
+// libs/helical-svelte/src/navbar/NavbarMenuContext.svelte.ts
+// Shared Svelte context for the NavbarMenu style (density from the root, variant
+// from the item). NavbarMenuTrigger/NavbarMenuLink read it to resolve their cva
+// directly; NavbarMenuContent overrides it (relaxed/default + inContent) so
+// dropdown panel links use the plain link style and never inherit the
+// top-level density/variant.
+import { getContext, setContext } from 'svelte';
+const NAVBAR_MENU_STYLE_KEY = Symbol('helical-ui.navbar-menu.style');
+export function setNavbarMenuStyle(style) {
+    setContext(NAVBAR_MENU_STYLE_KEY, style);
+}
+export function getNavbarMenuStyle() {
+    return (getContext(NAVBAR_MENU_STYLE_KEY) ?? { density: 'relaxed', variant: 'default', inContent: false });
+}

package/dist/navbar/NavbarMenuIndicator.svelte

@@ -0,0 +1,12 @@
+<!-- libs/helical-svelte/src/navbar/NavbarMenuIndicator.svelte -->
+<!-- Closely based on: @ark-ui/svelte/navigation-menu (Ark UI), mirrored from @cloudvoyant/helical-react -->
+<script lang="ts">
+  import { NavigationMenuIndicator, type NavigationMenuIndicatorProps } from '@ark-ui/svelte/navigation-menu';
+  import { navbarMenuIndicatorBase, cn } from '@cloudvoyant/helical-ui';
+
+  let { class: className = '', ...rest }: NavigationMenuIndicatorProps = $props();
+
+  const classes = $derived(cn(navbarMenuIndicatorBase, className));
+</script>
+
+<NavigationMenuIndicator class={classes} {...rest} />

package/dist/navbar/NavbarMenuIndicator.svelte.d.ts

@@ -0,0 +1,4 @@
+import { type NavigationMenuIndicatorProps } from '@ark-ui/svelte/navigation-menu';
+declare const NavbarMenuIndicator: import("svelte").Component<NavigationMenuIndicatorProps, {}, "">;
+type NavbarMenuIndicator = ReturnType<typeof NavbarMenuIndicator>;
+export default NavbarMenuIndicator;

package/dist/navbar/NavbarMenuItem.svelte

@@ -0,0 +1,34 @@
+<!-- libs/helical-svelte/src/navbar/NavbarMenuItem.svelte -->
+<!-- Closely based on: @ark-ui/svelte/navigation-menu (Ark UI), mirrored from @cloudvoyant/helical-react -->
+<script lang="ts">
+  import { NavigationMenuItem, type NavigationMenuItemProps } from '@ark-ui/svelte/navigation-menu';
+  import { navbarMenuItemBase, cn, type NavbarMenuVariant } from '@cloudvoyant/helical-ui';
+  import { getNavbarMenuStyle, setNavbarMenuStyle } from './NavbarMenuContext.svelte';
+
+  let {
+    value,
+    disabled = false,
+    variant = 'default',
+    class: className = '',
+    children,
+    ...rest
+  }: NavigationMenuItemProps & { variant?: NavbarMenuVariant } = $props();
+
+  const parentStyle = getNavbarMenuStyle();
+  setNavbarMenuStyle({
+    get density() {
+      return parentStyle.density;
+    },
+    get variant() {
+      return variant;
+    },
+    get inContent() {
+      return false;
+    },
+  });
+  const classes = $derived(cn(navbarMenuItemBase, className));
+</script>
+
+<NavigationMenuItem {value} {disabled} data-variant={variant} class={classes} {...rest}>
+  {@render children?.()}
+</NavigationMenuItem>

package/dist/navbar/NavbarMenuItem.svelte.d.ts

@@ -0,0 +1,8 @@
+import { type NavigationMenuItemProps } from '@ark-ui/svelte/navigation-menu';
+import { type NavbarMenuVariant } from '@cloudvoyant/helical-ui';
+type $$ComponentProps = NavigationMenuItemProps & {
+    variant?: NavbarMenuVariant;
+};
+declare const NavbarMenuItem: import("svelte").Component<$$ComponentProps, {}, "">;
+type NavbarMenuItem = ReturnType<typeof NavbarMenuItem>;
+export default NavbarMenuItem;

package/dist/navbar/NavbarMenuLink.svelte

@@ -0,0 +1,18 @@
+<!-- libs/helical-svelte/src/navbar/NavbarMenuLink.svelte -->
+<!-- Closely based on: @ark-ui/svelte/navigation-menu (Ark UI), mirrored from @cloudvoyant/helical-react -->
+<script lang="ts">
+  import { NavigationMenuLink, type NavigationMenuLinkProps } from '@ark-ui/svelte/navigation-menu';
+  import { navbarMenuLinkBase, navbarMenuTriggerStyle, cn } from '@cloudvoyant/helical-ui';
+  import { getNavbarMenuStyle } from './NavbarMenuContext.svelte';
+
+  let { class: className = '', children, ...rest }: NavigationMenuLinkProps = $props();
+
+  const style = getNavbarMenuStyle();
+  const classes = $derived(
+    style.inContent ? cn(navbarMenuLinkBase, className) : cn(navbarMenuTriggerStyle(style), className),
+  );
+</script>
+
+<NavigationMenuLink class={classes} {...rest}>
+  {@render children?.()}
+</NavigationMenuLink>