@cloudvoyant/helical-svelte 0.19.0

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

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

package/dist/navbar/NavbarMenuList.svelte

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

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

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

package/dist/navbar/NavbarMenuTrigger.svelte

@@ -0,0 +1,30 @@
+<!-- libs/helical-svelte/src/navbar/NavbarMenuTrigger.svelte -->
+<!-- Closely based on: @ark-ui/svelte/navigation-menu (Ark UI), mirrored from @cloudvoyant/helical-react -->
+<script lang="ts">
+  import { NavigationMenuTrigger, type NavigationMenuTriggerProps } from '@ark-ui/svelte/navigation-menu';
+  import { navbarMenuTriggerStyle, cn } from '@cloudvoyant/helical-ui';
+  import { getNavbarMenuStyle } from './NavbarMenuContext.svelte';
+
+  let { disabled = false, asChild, class: className = '', children, ...rest }: NavigationMenuTriggerProps = $props();
+
+  const style = getNavbarMenuStyle();
+  const classes = $derived(cn(navbarMenuTriggerStyle(style), className));
+</script>
+
+<NavigationMenuTrigger {disabled} {asChild} class={classes} {...rest}>
+  {@render children?.()}
+  {#if !asChild}
+    <svg
+      class="relative top-[1px] ml-1 size-3 transition duration-300 group-data-[state=open]:rotate-180"
+      aria-hidden="true"
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor"
+      stroke-width="2"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+    >
+      <path d="m6 9 6 6 6-6"></path>
+    </svg>
+  {/if}
+</NavigationMenuTrigger>

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

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

package/dist/navbar/NavbarMenuViewport.svelte

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

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

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

package/dist/navbar/NavbarMenuViewportPositioner.svelte

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

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

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

package/dist/navbar/NavbarMobileMenu.svelte

@@ -0,0 +1,14 @@
+<!-- libs/helical-svelte/src/navbar/NavbarMobileMenu.svelte -->
+<!-- Closely based on: @ark-ui/svelte/collapsible (Ark UI), mirrored from @cloudvoyant/helical-react -->
+<script lang="ts">
+  import { CollapsibleRoot, type CollapsibleRootProps } from '@ark-ui/svelte/collapsible';
+  import { cn } from '@cloudvoyant/helical-ui';
+
+  let { class: className = '', children, ...rest }: CollapsibleRootProps = $props();
+
+  const classes = $derived(cn('group', className));
+</script>
+
+<CollapsibleRoot data-slot="navbar-mobile-menu" class={classes} {...rest}>
+  {@render children?.()}
+</CollapsibleRoot>

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

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

package/dist/navbar/NavbarMobileMenuContent.svelte

@@ -0,0 +1,23 @@
+<!-- libs/helical-svelte/src/navbar/NavbarMobileMenuContent.svelte -->
+<!-- Closely based on: @ark-ui/svelte/collapsible (Ark UI), mirrored from @cloudvoyant/helical-react -->
+<script lang="ts">
+  import { CollapsibleContent } from '@ark-ui/svelte/collapsible';
+  import { navbarMobileMenuContentBase, cn } from '@cloudvoyant/helical-ui';
+  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 classes = $derived(cn(navbarMobileMenuContentBase, className));
+</script>
+
+<CollapsibleContent>
+  <div data-slot="navbar-mobile-menu-content" class={classes} {...rest}>
+    {@render children?.()}
+  </div>
+</CollapsibleContent>

package/dist/navbar/NavbarMobileMenuContent.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 NavbarMobileMenuContent: import("svelte").Component<Props, {}, "">;
+type NavbarMobileMenuContent = ReturnType<typeof NavbarMobileMenuContent>;
+export default NavbarMobileMenuContent;

package/dist/navbar/NavbarMobileMenuTrigger.svelte

@@ -0,0 +1,26 @@
+<!-- libs/helical-svelte/src/navbar/NavbarMobileMenuTrigger.svelte -->
+<!-- Closely based on: @ark-ui/svelte/collapsible (Ark UI), mirrored from @cloudvoyant/helical-react -->
+<script lang="ts">
+  import { CollapsibleTrigger, type CollapsibleTriggerProps } from '@ark-ui/svelte/collapsible';
+  import { navbarMenuTriggerStyle, cn } from '@cloudvoyant/helical-ui';
+
+  let { class: className = '', children, ...rest }: CollapsibleTriggerProps = $props();
+
+  const classes = $derived(cn(navbarMenuTriggerStyle(), 'w-full justify-between', className));
+</script>
+
+<CollapsibleTrigger data-slot="navbar-mobile-menu-trigger" class={classes} {...rest}>
+  {@render children?.()}
+  <svg
+    class="size-4 transition-transform duration-200 group-data-[state=open]:rotate-180"
+    aria-hidden="true"
+    viewBox="0 0 24 24"
+    fill="none"
+    stroke="currentColor"
+    stroke-width="2"
+    stroke-linecap="round"
+    stroke-linejoin="round"
+  >
+    <path d="m6 9 6 6 6-6"></path>
+  </svg>
+</CollapsibleTrigger>

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

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

package/dist/navbar/NavbarMobileOverlay.svelte

@@ -0,0 +1,85 @@
+<!-- libs/helical-svelte/src/navbar/NavbarMobileOverlay.svelte -->
+<!-- Source: @cloudvoyant/helical-react navbar mobile (Ark UI dialog overlay), mirrored from @cloudvoyant/helical-react -->
+<script lang="ts">
+  import {
+    Root,
+    DialogBackdrop,
+    Positioner,
+    DialogContent,
+    DialogCloseTrigger,
+    Title,
+    DialogDescription,
+  } from '@ark-ui/svelte/dialog';
+  import { Portal } from '@ark-ui/svelte/portal';
+  import {
+    navbarMobileContentBase,
+    navbarMobileHeaderBase,
+    navbarMobileMenuBase,
+    navbarMobileActionsBase,
+    navbarTriggerVariants,
+    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 open = $derived(navbar.open);
+
+  const classes = $derived(cn(navbarMobileContentBase, className));
+
+  // Ark's focus trap doesn't engage for a controlled dialog (no DialogTrigger),
+  // so Escape isn't handled — add a minimal fallback.
+  $effect(() => {
+    if (!open) return;
+    const onKeydown = (event: KeyboardEvent) => {
+      if (event.key === 'Escape') navbar.setOpen(false);
+    };
+    document.addEventListener('keydown', onKeydown);
+    return () => document.removeEventListener('keydown', onKeydown);
+  });
+</script>
+
+<Portal container={navbar.portalEl}>
+  <Root {open} lazyMount unmountOnExit onOpenChange={(d: { open: boolean }) => navbar.setOpen(d.open)} preventScroll={false}>
+    <DialogBackdrop class="absolute inset-0 z-[100] bg-background/60 backdrop-blur-sm" />
+    <Positioner class="absolute inset-0 z-[100]">
+      <DialogContent id={navbar.id} data-slot="navbar-mobile-overlay" class={classes} {...rest}>
+        <Title class="sr-only">Navigation menu</Title>
+        <DialogDescription class="sr-only">Mobile navigation menu</DialogDescription>
+        <div class={navbarMobileHeaderBase}>
+          {@render navbar.slots.brand?.()}
+          <DialogCloseTrigger class={cn(navbarTriggerVariants({ floating: navbar.floating }))} aria-label="Close navigation menu">
+            <svg
+              class="size-4"
+              viewBox="0 0 24 24"
+              fill="none"
+              stroke="currentColor"
+              stroke-width="2"
+              stroke-linecap="round"
+              stroke-linejoin="round"
+              aria-hidden="true"
+            >
+              <path d="M18 6 6 18M6 6l12 12"></path>
+            </svg>
+          </DialogCloseTrigger>
+        </div>
+        <div class={navbarMobileMenuBase}>
+          {@render children?.()}
+        </div>
+        {#if navbar.slots.actions}
+          <div class={navbarMobileActionsBase}>
+            {@render navbar.slots.actions()}
+          </div>
+        {/if}
+      </DialogContent>
+    </Positioner>
+  </Root>
+</Portal>

package/dist/navbar/NavbarMobileOverlay.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 NavbarMobileOverlay: import("svelte").Component<Props, {}, "">;
+type NavbarMobileOverlay = ReturnType<typeof NavbarMobileOverlay>;
+export default NavbarMobileOverlay;

package/dist/navbar/NavbarProvider.svelte

@@ -0,0 +1,83 @@
+<!-- libs/helical-svelte/src/navbar/NavbarProvider.svelte -->
+<!-- Source: @cloudvoyant/helical-react navbar provider (shadcnblocks navbar6/7, re-based on Ark UI) -->
+<script module lang="ts">
+  let navbarIdCounter = 0;
+</script>
+
+<script lang="ts">
+  import { setNavbarContext } from './NavbarContext.svelte';
+  import type { NavbarDensity, NavbarVariant } from '@cloudvoyant/helical-ui';
+  import type { Snippet } from 'svelte';
+
+  type Props = {
+    defaultOpen?: boolean;
+    children?: Snippet;
+  };
+
+  let { defaultOpen = false, children }: Props = $props();
+
+  let id = $state(`helical-ui-navbar-${++navbarIdCounter}`);
+  let open = $state(defaultOpen);
+  let scrolled = $state(false);
+  let hovered = $state(false);
+  let slots = $state<{ brand?: Snippet; actions?: Snippet }>({});
+  let portalEl = $state<HTMLElement>();
+
+  function setOpen(value: boolean) {
+    open = value;
+  }
+
+  function setScrolled(value: boolean) {
+    scrolled = value;
+  }
+
+  function setHovered(value: boolean) {
+    hovered = value;
+  }
+
+  function setSlot(key: 'brand' | 'actions', node: Snippet | undefined) {
+    slots[key] = node;
+  }
+
+  function setPortalEl(el: HTMLElement | undefined) {
+    portalEl = el;
+  }
+
+  setNavbarContext({
+    get id() {
+      return id;
+    },
+    get open() {
+      return open;
+    },
+    setOpen,
+    get scrolled() {
+      return scrolled;
+    },
+    setScrolled,
+    get hovered() {
+      return hovered;
+    },
+    setHovered,
+    get slots() {
+      return slots;
+    },
+    setSlot,
+    get portalEl() {
+      return portalEl;
+    },
+    setPortalEl,
+    // Baseline config; NavbarRoot overrides these with its props.
+    get variant() {
+      return 'sticky' as NavbarVariant;
+    },
+    get floating() {
+      return false;
+    },
+    get density() {
+      return 'relaxed' as NavbarDensity;
+    },
+  });
+</script>
+
+{@render children?.()}

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

@@ -0,0 +1,8 @@
+import type { Snippet } from 'svelte';
+type Props = {
+    defaultOpen?: boolean;
+    children?: Snippet;
+};
+declare const NavbarProvider: import("svelte").Component<Props, {}, "">;
+type NavbarProvider = ReturnType<typeof NavbarProvider>;
+export default NavbarProvider;

package/dist/navbar/NavbarRoot.svelte

@@ -0,0 +1,142 @@
+<!-- libs/helical-svelte/src/navbar/NavbarRoot.svelte -->
+<!-- Source: @cloudvoyant/helical-react navbar root (shadcnblocks navbar6/7, re-based on Ark UI) -->
+<script lang="ts">
+  import {
+    navbarVariants,
+    navbarContainerBase,
+    navbarDensityVariants,
+    navbarShrunkBase,
+    cn,
+    type NavbarDensity,
+    type NavbarVariant,
+  } from '@cloudvoyant/helical-ui';
+  import { getNavbarContext, setNavbarContext } from './NavbarContext.svelte';
+  import type { Snippet } from 'svelte';
+  import type { HTMLAttributes } from 'svelte/elements';
+
+  type Props = {
+    variant?: NavbarVariant;
+    floating?: boolean;
+    density?: NavbarDensity;
+    class?: string;
+    children?: Snippet;
+  } & HTMLAttributes<HTMLElement>;
+
+  let {
+    variant = 'sticky',
+    floating = false,
+    density = 'relaxed',
+    class: className = '',
+    children,
+    ...rest
+  }: Props = $props();
+
+  const parent = getNavbarContext();
+  let headerEl = $state<HTMLElement>();
+
+  // Resolve the nearest scrollable ancestor (e.g. a demo container with
+  // overflow-y-auto); null means the viewport itself scrolls.
+  function resolveScrollContainer(el: HTMLElement | undefined): HTMLElement | null {
+    if (!el) return null;
+    for (let n: HTMLElement | null = el; n; n = n.parentElement) {
+      const oy = getComputedStyle(n).overflowY;
+      if (oy === 'auto' || oy === 'scroll' || oy === 'overlay') return n;
+    }
+    return null;
+  }
+
+  // Listen to the nearest scrollable ancestor (e.g. a demo container with
+  // overflow-y-auto); fall back to the window. `position: sticky` sticks
+  // relative to that same container, so data-scrolled stays in sync.
+  $effect(() => {
+    if (!headerEl) return;
+    const target = resolveScrollContainer(headerEl) ?? window;
+    const getY = () => (target === window ? window.scrollY : (target as Element).scrollTop);
+    const onScroll = () => parent.setScrolled(getY() > 24);
+    onScroll();
+    (target as EventTarget).addEventListener('scroll', onScroll, { passive: true });
+    return () => (target as EventTarget).removeEventListener('scroll', onScroll);
+  });
+
+  // Anchor the mobile overlay to the element that contains the bar (its
+  // parent), so it covers the surrounding container rather than the window.
+  $effect(() => {
+    parent.setPortalEl(headerEl?.parentElement ?? undefined);
+  });
+
+  // The mobile overlay portals into the bar's scroll container. Lock that
+  // container's scroll while the overlay is open so the background can't be
+  // scrolled past it; Ark's body scroll lock is disabled. When no ancestor is
+  // scrollable the viewport scrolls, so lock the documentElement instead.
+  $effect(() => {
+    if (!parent.open) return;
+    const el = resolveScrollContainer(headerEl) ?? document.documentElement;
+    const prev = el.style.overflow;
+    el.style.overflow = 'hidden';
+    return () => {
+      el.style.overflow = prev;
+    };
+  });
+
+  setNavbarContext({
+    get id() {
+      return parent.id;
+    },
+    get open() {
+      return parent.open;
+    },
+    setOpen: parent.setOpen,
+    get scrolled() {
+      return parent.scrolled;
+    },
+    setScrolled: parent.setScrolled,
+    get hovered() {
+      return parent.hovered;
+    },
+    setHovered: parent.setHovered,
+    get slots() {
+      return parent.slots;
+    },
+    setSlot: parent.setSlot,
+    get portalEl() {
+      return parent.portalEl;
+    },
+    setPortalEl: parent.setPortalEl,
+    get variant() {
+      return variant;
+    },
+    get floating() {
+      return floating;
+    },
+    get density() {
+      return density;
+    },
+  });
+
+  const scrolled = $derived(parent.scrolled);
+  const hidden = $derived(variant === 'hide' && parent.scrolled && !parent.hovered);
+  const shrunk = $derived(variant === 'shrink' && parent.scrolled);
+  const classes = $derived(
+    cn(
+      navbarVariants({ variant, floating }),
+      navbarContainerBase,
+      navbarDensityVariants({ density }),
+      shrunk && navbarShrunkBase,
+      className,
+    ),
+  );
+</script>
+
+<header
+  bind:this={headerEl}
+  data-slot="navbar"
+  data-scrolled={scrolled || undefined}
+  data-hidden={hidden || undefined}
+  data-shrunk={shrunk || undefined}
+  class={classes}
+  onmouseenter={() => parent.setHovered(true)}
+  onmouseleave={() => parent.setHovered(false)}
+  {...rest}
+>
+  {@render children?.()}
+</header>

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

@@ -0,0 +1,13 @@
+import { type NavbarDensity, type NavbarVariant } from '@cloudvoyant/helical-ui';
+import type { Snippet } from 'svelte';
+import type { HTMLAttributes } from 'svelte/elements';
+type Props = {
+    variant?: NavbarVariant;
+    floating?: boolean;
+    density?: NavbarDensity;
+    class?: string;
+    children?: Snippet;
+} & HTMLAttributes<HTMLElement>;
+declare const NavbarRoot: import("svelte").Component<Props, {}, "">;
+type NavbarRoot = ReturnType<typeof NavbarRoot>;
+export default NavbarRoot;

package/dist/navbar/NavbarTrigger.svelte

@@ -0,0 +1,60 @@
+<!-- libs/helical-svelte/src/navbar/NavbarTrigger.svelte -->
+<!-- Source: @cloudvoyant/helical-react navbar trigger (shadcnblocks navbar6/7, re-based on Ark UI collapsible) -->
+<script lang="ts">
+  import { navbarTriggerVariants, cn } from '@cloudvoyant/helical-ui';
+  import { getNavbarContext } from './NavbarContext.svelte';
+  import type { Snippet } from 'svelte';
+  import type { HTMLButtonAttributes } from 'svelte/elements';
+
+  type Props = {
+    'aria-label'?: string;
+    class?: string;
+    children?: Snippet;
+  } & HTMLButtonAttributes;
+
+  let {
+    'aria-label': ariaLabel = 'Toggle navigation menu',
+    class: className = '',
+    children,
+    ...rest
+  }: Props = $props();
+
+  const navbar = getNavbarContext();
+  const open = $derived(navbar.open);
+
+  const classes = $derived(cn(navbarTriggerVariants({ floating: navbar.floating }), 'md:hidden', className));
+
+  function toggle() {
+    navbar.setOpen(!open);
+  }
+</script>
+
+<button
+  type="button"
+  data-slot="navbar-trigger"
+  aria-expanded={open}
+  aria-controls={navbar.id}
+  aria-label={ariaLabel}
+  class={classes}
+  onclick={toggle}
+  {...rest}
+>
+  {#if children}
+    {@render children()}
+  {:else}
+    <svg
+      class="size-4"
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor"
+      stroke-width="2"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+      aria-hidden="true"
+    >
+      <line x1="4" x2="20" y1="6" y2="6"></line>
+      <line x1="4" x2="20" y1="12" y2="12"></line>
+      <line x1="4" x2="20" y1="18" y2="18"></line>
+    </svg>
+  {/if}
+</button>

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

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

package/dist/navbar/index.d.ts

@@ -0,0 +1,22 @@
+import NavbarProvider from './NavbarProvider.svelte';
+import Navbar from './NavbarRoot.svelte';
+import NavbarActivationArea from './NavbarActivationArea.svelte';
+import NavbarBrand from './NavbarBrand.svelte';
+import NavbarMenu from './NavbarMenu.svelte';
+import NavbarActions from './NavbarActions.svelte';
+import NavbarTrigger from './NavbarTrigger.svelte';
+import NavbarMobileOverlay from './NavbarMobileOverlay.svelte';
+import NavbarMenuList from './NavbarMenuList.svelte';
+import NavbarMenuItem from './NavbarMenuItem.svelte';
+import NavbarMenuTrigger from './NavbarMenuTrigger.svelte';
+import NavbarMenuContent from './NavbarMenuContent.svelte';
+import NavbarMenuLink from './NavbarMenuLink.svelte';
+import NavbarMobileMenu from './NavbarMobileMenu.svelte';
+import NavbarMobileMenuTrigger from './NavbarMobileMenuTrigger.svelte';
+import NavbarMobileMenuContent from './NavbarMobileMenuContent.svelte';
+import NavbarMenuViewport from './NavbarMenuViewport.svelte';
+import NavbarMenuViewportPositioner from './NavbarMenuViewportPositioner.svelte';
+import NavbarMenuIndicator from './NavbarMenuIndicator.svelte';
+import { getNavbarContext as useNavbar } from './NavbarContext.svelte';
+import { navbarMenuTriggerStyle, type NavbarMenuDensity, type NavbarMenuVariant } from '@cloudvoyant/helical-ui';
+export { Navbar, NavbarProvider, NavbarActivationArea, NavbarBrand, NavbarMenu, NavbarActions, NavbarTrigger, NavbarMobileOverlay, NavbarMenuList, NavbarMenuItem, NavbarMenuTrigger, NavbarMenuContent, NavbarMenuLink, NavbarMobileMenu, NavbarMobileMenuTrigger, NavbarMobileMenuContent, NavbarMenuViewport, NavbarMenuViewportPositioner, NavbarMenuIndicator, useNavbar, navbarMenuTriggerStyle, type NavbarMenuDensity, type NavbarMenuVariant, };