@cloudvoyant/helical-svelte 0.19.0

package/dist/sidebar/MenuSkeleton.svelte

@@ -0,0 +1,38 @@
+<!-- libs/helical-svelte/src/SidebarMenuSkeleton.svelte -->
+<!-- Source: @ark-ui/svelte/factory (Ark UI), mirrored from @cloudvoyant/helical-react -->
+<script lang="ts">
+  import { Ark } from '@ark-ui/svelte/factory';
+  import { sidebarStyles, cn } from '@cloudvoyant/helical-ui';
+  import type { HTMLAttributes } from 'svelte/elements';
+
+  type Props = {
+    showIcon?: boolean;
+    class?: string;
+  } & HTMLAttributes<HTMLDivElement>;
+
+  let { showIcon = false, class: className = '', ...rest }: Props = $props();
+
+  const width = $derived(`${Math.floor(Math.random() * 40) + 50}%`);
+</script>
+
+<Ark
+  as="div"
+  data-slot="sidebar-menu-skeleton"
+  data-sidebar="menu-skeleton"
+  class={cn(sidebarStyles.menuSkeletonClass, className)}
+  {...rest}
+>
+  {#if showIcon}
+    <Ark
+      as="div"
+      class="size-4 shrink-0 animate-pulse rounded-md bg-sidebar-accent"
+      data-sidebar="menu-skeleton-icon"
+    />
+  {/if}
+  <Ark
+    as="div"
+    class="h-4 max-w-(--skeleton-width) flex-1 animate-pulse rounded-md bg-sidebar-accent"
+    data-sidebar="menu-skeleton-text"
+    style={`--skeleton-width: ${width};`}
+  />
+</Ark>

package/dist/sidebar/MenuSkeleton.svelte.d.ts

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

package/dist/sidebar/MenuSub.svelte

@@ -0,0 +1,25 @@
+<!-- libs/helical-svelte/src/SidebarMenuSub.svelte -->
+<!-- Source: @ark-ui/svelte/factory (Ark UI), mirrored from @cloudvoyant/helical-react -->
+<script lang="ts">
+  import { Ark } from '@ark-ui/svelte/factory';
+  import { sidebarStyles, cn } from '@cloudvoyant/helical-ui';
+  import type { Snippet } from 'svelte';
+  import type { HTMLAttributes } from 'svelte/elements';
+
+  type Props = {
+    class?: string;
+    children?: Snippet;
+  } & HTMLAttributes<HTMLUListElement>;
+
+  let { class: className = '', children, ...rest }: Props = $props();
+</script>
+
+<Ark
+  as="ul"
+  data-slot="sidebar-menu-sub"
+  data-sidebar="menu-sub"
+  class={cn(sidebarStyles.menuSubClass, className)}
+  {...rest}
+>
+  {@render children?.()}
+</Ark>

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

package/dist/sidebar/MenuSubButton.svelte

@@ -0,0 +1,31 @@
+<!-- libs/helical-svelte/src/SidebarMenuSubButton.svelte -->
+<!-- Source: @ark-ui/svelte/factory (Ark UI), mirrored from @cloudvoyant/helical-react -->
+<script lang="ts">
+  import { Ark } from '@ark-ui/svelte/factory';
+  import { sidebarStyles, cn } from '@cloudvoyant/helical-ui';
+  import type { Snippet } from 'svelte';
+  import type { HTMLAttributes, HTMLAnchorAttributes } from 'svelte/elements';
+
+  type Props = {
+    asChild?: Snippet<[(props: HTMLAnchorAttributes) => HTMLAttributes<HTMLElement>]>;
+    size?: 'sm' | 'md';
+    isActive?: boolean;
+    class?: string;
+    children?: Snippet;
+  } & HTMLAnchorAttributes;
+
+  let { asChild, size = 'md', isActive = false, class: className = '', children, ...rest }: Props = $props();
+</script>
+
+<Ark
+  as="a"
+  data-slot="sidebar-menu-sub-button"
+  data-sidebar="menu-sub-button"
+  data-size={size}
+  data-active={isActive}
+  {asChild}
+  class={cn(sidebarStyles.menuSubButtonClass, className)}
+  {...rest}
+>
+  {@render children?.()}
+</Ark>

package/dist/sidebar/MenuSubButton.svelte.d.ts

@@ -0,0 +1,12 @@
+import type { Snippet } from 'svelte';
+import type { HTMLAttributes, HTMLAnchorAttributes } from 'svelte/elements';
+type Props = {
+    asChild?: Snippet<[(props: HTMLAnchorAttributes) => HTMLAttributes<HTMLElement>]>;
+    size?: 'sm' | 'md';
+    isActive?: boolean;
+    class?: string;
+    children?: Snippet;
+} & HTMLAnchorAttributes;
+declare const MenuSubButton: import("svelte").Component<Props, {}, "">;
+type MenuSubButton = ReturnType<typeof MenuSubButton>;
+export default MenuSubButton;

package/dist/sidebar/MenuSubItem.svelte

@@ -0,0 +1,25 @@
+<!-- libs/helical-svelte/src/SidebarMenuSubItem.svelte -->
+<!-- Source: @ark-ui/svelte/factory (Ark UI), mirrored from @cloudvoyant/helical-react -->
+<script lang="ts">
+  import { Ark } from '@ark-ui/svelte/factory';
+  import { sidebarStyles, cn } from '@cloudvoyant/helical-ui';
+  import type { Snippet } from 'svelte';
+  import type { HTMLAttributes } from 'svelte/elements';
+
+  type Props = {
+    class?: string;
+    children?: Snippet;
+  } & HTMLAttributes<HTMLLIElement>;
+
+  let { class: className = '', children, ...rest }: Props = $props();
+</script>
+
+<Ark
+  as="li"
+  data-slot="sidebar-menu-sub-item"
+  data-sidebar="menu-sub-item"
+  class={cn(sidebarStyles.menuSubItemClass, className)}
+  {...rest}
+>
+  {@render children?.()}
+</Ark>

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

package/dist/sidebar/Provider.svelte

@@ -0,0 +1,103 @@
+<!-- libs/helical-svelte/src/SidebarProvider.svelte -->
+<!-- Source: @ark-ui/svelte/factory + drawer (Ark UI), mirrored from @cloudvoyant/helical-react -->
+<script lang="ts">
+  import {
+    SIDEBAR_WIDTH,
+    SIDEBAR_WIDTH_ICON,
+    SIDEBAR_KEYBOARD_SHORTCUT,
+    sidebarStyles,
+    cn,
+    type SidebarContextProps,
+  } from '@cloudvoyant/helical-ui';
+  import { setSidebarContext } from './context.svelte';
+  import Row from '../Row.svelte';
+  import type { Snippet } from 'svelte';
+  import type { HTMLAttributes } from 'svelte/elements';
+
+  type Props = {
+    defaultOpen?: boolean;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    class?: string;
+    children?: Snippet;
+  } & HTMLAttributes<HTMLDivElement>;
+
+  let { defaultOpen = true, open: openProp, onOpenChange, class: className = '', style, children, ...rest }: Props = $props();
+
+  let isMobile = $state(false);
+  let openMobile = $state(false);
+  // svelte-ignore state_referenced_locally
+  let _open = $state(defaultOpen);
+  const open = $derived(openProp ?? _open);
+  const contextState = $derived<SidebarContextProps['state']>(open ? 'expanded' : 'collapsed');
+
+  const setOpen = (value: boolean | ((value: boolean) => boolean)) => {
+    const openState = typeof value === 'function' ? value(open) : value;
+    if (onOpenChange) {
+      onOpenChange(openState);
+    } else {
+      _open = openState;
+    }
+    if (typeof document !== 'undefined') {
+      document.cookie = `sidebar_state=${openState}; path=/; max-age=604800`;
+    }
+  };
+
+  const toggleSidebar = () => {
+    if (isMobile) {
+      openMobile = !openMobile;
+    } else {
+      setOpen((o) => !o);
+    }
+  };
+
+  $effect(() => {
+    const mql = window.matchMedia('(max-width: 767px)');
+    const onChange = () => {
+      isMobile = window.innerWidth < 768;
+    };
+    onChange();
+    mql.addEventListener('change', onChange);
+    return () => mql.removeEventListener('change', onChange);
+  });
+
+  $effect(() => {
+    const handleKeyDown = (event: KeyboardEvent) => {
+      if (event.key === SIDEBAR_KEYBOARD_SHORTCUT && (event.metaKey || event.ctrlKey)) {
+        event.preventDefault();
+        toggleSidebar();
+      }
+    };
+    window.addEventListener('keydown', handleKeyDown);
+    return () => window.removeEventListener('keydown', handleKeyDown);
+  });
+
+  setSidebarContext({
+    get state() {
+      return contextState;
+    },
+    get open() {
+      return open;
+    },
+    setOpen,
+    get openMobile() {
+      return openMobile;
+    },
+    setOpenMobile(value: boolean | ((open: boolean) => boolean)) {
+      openMobile = typeof value === 'function' ? value(openMobile) : value;
+    },
+    get isMobile() {
+      return isMobile;
+    },
+    toggleSidebar,
+  });
+</script>
+
+<Row
+  data-slot="sidebar-wrapper"
+  class={cn(sidebarStyles.wrapperClass, className)}
+  style={`--sidebar-width: ${SIDEBAR_WIDTH}; --sidebar-width-icon: ${SIDEBAR_WIDTH_ICON}; ${style ?? ''}`}
+  {...rest}
+>
+  {@render children?.()}
+</Row>

package/dist/sidebar/Provider.svelte.d.ts

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

package/dist/sidebar/Rail.svelte

@@ -0,0 +1,32 @@
+<!-- libs/helical-svelte/src/SidebarRail.svelte -->
+<!-- Source: @ark-ui/svelte/factory (Ark UI), mirrored from @cloudvoyant/helical-react -->
+<script lang="ts">
+  import { Ark } from '@ark-ui/svelte/factory';
+  import { sidebarStyles, cn } from '@cloudvoyant/helical-ui';
+  import { getSidebarContext } from './context.svelte';
+  import type { HTMLButtonAttributes } from 'svelte/elements';
+
+  type Props = {
+    class?: string;
+  } & HTMLButtonAttributes;
+
+  let { class: className = '', onclick, ...rest }: Props = $props();
+
+  const { toggleSidebar } = getSidebarContext();
+</script>
+
+<Ark
+  as="button"
+  data-sidebar="rail"
+  data-slot="sidebar-rail"
+  type="button"
+  aria-label="Toggle Sidebar"
+  tabindex={-1}
+  title="Toggle Sidebar"
+  class={cn(sidebarStyles.railClass, className)}
+  onclick={(e) => {
+    onclick?.(e);
+    toggleSidebar();
+  }}
+  {...rest}
+/>

package/dist/sidebar/Rail.svelte.d.ts

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

package/dist/sidebar/Root.svelte

@@ -0,0 +1,109 @@
+<!-- libs/helical-svelte/src/Sidebar.svelte -->
+<!-- Source: @ark-ui/svelte/drawer (Ark UI), mirrored from @cloudvoyant/helical-react -->
+<script lang="ts">
+  import {
+    DrawerRoot,
+    DrawerBackdrop,
+    DrawerPositioner,
+    DrawerContent,
+    DrawerTitle,
+    DrawerDescription,
+    DrawerCloseTrigger,
+  } from '@ark-ui/svelte/drawer';
+  import { SIDEBAR_WIDTH_MOBILE, sidebarStyles, cn } from '@cloudvoyant/helical-ui';
+  import Col from '../Col.svelte';
+  import { getSidebarContext } from './context.svelte';
+  import type { Snippet } from 'svelte';
+  import type { HTMLAttributes } from 'svelte/elements';
+
+  type Props = {
+    side?: 'left' | 'right';
+    variant?: 'sidebar' | 'floating' | 'inset';
+    collapsible?: 'offcanvas' | 'icon' | 'none';
+    class?: string;
+    children?: Snippet;
+  } & HTMLAttributes<HTMLDivElement> & { id?: string; role?: 'dialog' | 'alertdialog' };
+
+  let {
+    side = 'left',
+    variant = 'sidebar',
+    collapsible = 'offcanvas',
+    class: className = '',
+    children,
+    ...rest
+  }: Props = $props();
+
+  const sidebar = getSidebarContext();
+  const state = $derived(sidebar.state);
+  const isMobile = $derived(sidebar.isMobile);
+  const openMobile = $derived(sidebar.openMobile);
+  const setOpenMobile = sidebar.setOpenMobile;
+
+  const containerClasses = $derived(
+    cn(
+      sidebarStyles.containerClass,
+      side === 'left'
+        ? 'left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]'
+        : 'right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]',
+      variant === 'floating' || variant === 'inset'
+        ? 'p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4))+2px)]'
+        : 'group-data-[collapsible=icon]:w-(--sidebar-width-icon) group-data-[side=left]:border-r group-data-[side=right]:border-l',
+      className,
+    ),
+  );
+
+  const gapClasses = $derived(
+    cn(
+      sidebarStyles.gapClass,
+      side === 'right' && 'rotate-180',
+      variant === 'floating' || variant === 'inset'
+        ? 'group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4)))]'
+        : 'group-data-[collapsible=icon]:w-(--sidebar-width-icon)',
+    ),
+  );
+</script>
+
+{#if collapsible === 'none'}
+  <Col
+    data-slot="sidebar"
+    data-sidebar="sidebar"
+    class={cn('h-full w-(--sidebar-width) bg-sidebar text-sidebar-foreground', className)}
+    {...rest}
+  >
+    {@render children?.()}
+  </Col>
+{:else if isMobile}
+  <DrawerRoot open={openMobile} onOpenChange={(details) => setOpenMobile(details.open)} {...rest}>
+    <DrawerBackdrop />
+    <DrawerPositioner class="w-(--sidebar-width)">
+      <DrawerContent
+        data-sidebar="sidebar"
+        data-slot="sidebar"
+        data-mobile="true"
+        class="w-(--sidebar-width) bg-sidebar p-0 text-sidebar-foreground"
+        style={`--sidebar-width: ${SIDEBAR_WIDTH_MOBILE};`}
+      >
+        <DrawerTitle class="sr-only">Sidebar</DrawerTitle>
+        <DrawerDescription class="sr-only">Displays the mobile sidebar.</DrawerDescription>
+        <DrawerCloseTrigger class="hidden" />
+        <Col class="h-full w-full">{@render children?.()}</Col>
+      </DrawerContent>
+    </DrawerPositioner>
+  </DrawerRoot>
+{:else}
+  <div
+    class="group peer hidden text-sidebar-foreground md:block"
+    data-state={state}
+    data-collapsible={state === 'collapsed' ? collapsible : ''}
+    data-variant={variant}
+    data-side={side}
+    data-slot="sidebar"
+  >
+    <div data-slot="sidebar-gap" class={gapClasses}></div>
+    <div data-slot="sidebar-container" class={containerClasses} {...rest}>
+      <Col data-sidebar="sidebar" data-slot="sidebar-inner" data-variant={variant} class={cn(sidebarStyles.innerClass)}>
+        {@render children?.()}
+      </Col>
+    </div>
+  </div>
+{/if}

package/dist/sidebar/Root.svelte.d.ts

@@ -0,0 +1,15 @@
+import type { Snippet } from 'svelte';
+import type { HTMLAttributes } from 'svelte/elements';
+type Props = {
+    side?: 'left' | 'right';
+    variant?: 'sidebar' | 'floating' | 'inset';
+    collapsible?: 'offcanvas' | 'icon' | 'none';
+    class?: string;
+    children?: Snippet;
+} & HTMLAttributes<HTMLDivElement> & {
+    id?: string;
+    role?: 'dialog' | 'alertdialog';
+};
+declare const Root: import("svelte").Component<Props, {}, "">;
+type Root = ReturnType<typeof Root>;
+export default Root;

package/dist/sidebar/Separator.svelte

@@ -0,0 +1,22 @@
+<!-- libs/helical-svelte/src/SidebarSeparator.svelte -->
+<!-- Source: @ark-ui/svelte/factory (Ark UI), mirrored from @cloudvoyant/helical-react -->
+<script lang="ts">
+  import { Ark } from '@ark-ui/svelte/factory';
+  import { sidebarStyles, cn } from '@cloudvoyant/helical-ui';
+  import type { HTMLAttributes } from 'svelte/elements';
+
+  type Props = {
+    class?: string;
+  } & HTMLAttributes<HTMLDivElement>;
+
+  let { class: className = '', ...rest }: Props = $props();
+</script>
+
+<Ark
+  as="div"
+  data-slot="sidebar-separator"
+  data-sidebar="separator"
+  role="separator"
+  class={cn(sidebarStyles.separatorClass, className)}
+  {...rest}
+/>

package/dist/sidebar/Separator.svelte.d.ts

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

package/dist/sidebar/Trigger.svelte

@@ -0,0 +1,34 @@
+<!-- libs/helical-svelte/src/SidebarTrigger.svelte -->
+<!-- Source: @ark-ui/svelte/factory (Ark UI), mirrored from @cloudvoyant/helical-react -->
+<script lang="ts">
+  import { Ark } from '@ark-ui/svelte/factory';
+  import { sidebarStyles, cn } from '@cloudvoyant/helical-ui';
+  import { getSidebarContext } from './context.svelte';
+  import type { Snippet } from 'svelte';
+  import type { HTMLButtonAttributes } from 'svelte/elements';
+
+  type Props = {
+    class?: string;
+    children?: Snippet;
+  } & HTMLButtonAttributes;
+
+  let { class: className = '', children, onclick, ...rest }: Props = $props();
+
+  const { toggleSidebar } = getSidebarContext();
+</script>
+
+<Ark
+  as="button"
+  data-sidebar="trigger"
+  data-slot="sidebar-trigger"
+  type="button"
+  aria-label="Toggle Sidebar"
+  class={cn(sidebarStyles.triggerClass, className)}
+  onclick={(e) => {
+    onclick?.(e);
+    toggleSidebar();
+  }}
+  {...rest}
+>
+  {@render children?.()}
+</Ark>

package/dist/sidebar/Trigger.svelte.d.ts

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

package/dist/sidebar/context.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { SidebarContextProps } from '@cloudvoyant/helical-ui';
+export declare const SIDEBAR_CONTEXT_KEY: unique symbol;
+export declare function setSidebarContext(context: SidebarContextProps): void;
+export declare function getSidebarContext(): SidebarContextProps;

package/dist/sidebar/context.svelte.js

@@ -0,0 +1,14 @@
+// libs/helical-svelte/src/sidebar/context.svelte.ts
+// Source: @cloudvoyant/helical-react sidebar context (shadcn/ui sidebar, re-based on Ark UI)
+import { getContext, setContext } from 'svelte';
+export const SIDEBAR_CONTEXT_KEY = Symbol('helical-ui.sidebar');
+export function setSidebarContext(context) {
+    setContext(SIDEBAR_CONTEXT_KEY, context);
+}
+export function getSidebarContext() {
+    const context = getContext(SIDEBAR_CONTEXT_KEY);
+    if (!context) {
+        throw new Error('Sidebar parts must be used within a SidebarProvider.');
+    }
+    return context;
+}

package/dist/sidebar/index.d.ts

@@ -0,0 +1,24 @@
+import Provider from './Provider.svelte';
+import Root from './Root.svelte';
+import Header from './Header.svelte';
+import Footer from './Footer.svelte';
+import Separator from './Separator.svelte';
+import Content from './Content.svelte';
+import Group from './Group.svelte';
+import GroupAction from './GroupAction.svelte';
+import Menu from './Menu.svelte';
+import MenuItem from './MenuItem.svelte';
+import MenuButton from './MenuButton.svelte';
+import MenuLink from './MenuLink.svelte';
+import MenuAction from './MenuAction.svelte';
+import MenuBadge from './MenuBadge.svelte';
+import MenuSkeleton from './MenuSkeleton.svelte';
+import MenuSub from './MenuSub.svelte';
+import MenuSubItem from './MenuSubItem.svelte';
+import MenuSubButton from './MenuSubButton.svelte';
+import Trigger from './Trigger.svelte';
+import Rail from './Rail.svelte';
+import Inset from './Inset.svelte';
+import Input from './Input.svelte';
+import { getSidebarContext as useSidebar } from './context.svelte';
+export { Provider as SidebarProvider, Root as Sidebar, Header as SidebarHeader, Footer as SidebarFooter, Separator as SidebarSeparator, Content as SidebarContent, Group as SidebarGroup, GroupAction as SidebarGroupAction, Menu as SidebarMenu, MenuItem as SidebarMenuItem, MenuButton as SidebarMenuButton, MenuLink as SidebarMenuLink, MenuAction as SidebarMenuAction, MenuBadge as SidebarMenuBadge, MenuSkeleton as SidebarMenuSkeleton, MenuSub as SidebarMenuSub, MenuSubItem as SidebarMenuSubItem, MenuSubButton as SidebarMenuSubButton, Trigger as SidebarTrigger, Rail as SidebarRail, Inset as SidebarInset, Input as SidebarInput, useSidebar, };

package/dist/sidebar/index.js

@@ -0,0 +1,28 @@
+// libs/helical-svelte/src/sidebar/index.ts
+// Unified export. `Sidebar` parts are exported flat (SidebarProvider,
+// Sidebar, SidebarHeader, and the other named parts) as the only public API:
+//   <SidebarProvider> <Sidebar> <SidebarHeader> </SidebarProvider>
+import Provider from './Provider.svelte';
+import Root from './Root.svelte';
+import Header from './Header.svelte';
+import Footer from './Footer.svelte';
+import Separator from './Separator.svelte';
+import Content from './Content.svelte';
+import Group from './Group.svelte';
+import GroupAction from './GroupAction.svelte';
+import Menu from './Menu.svelte';
+import MenuItem from './MenuItem.svelte';
+import MenuButton from './MenuButton.svelte';
+import MenuLink from './MenuLink.svelte';
+import MenuAction from './MenuAction.svelte';
+import MenuBadge from './MenuBadge.svelte';
+import MenuSkeleton from './MenuSkeleton.svelte';
+import MenuSub from './MenuSub.svelte';
+import MenuSubItem from './MenuSubItem.svelte';
+import MenuSubButton from './MenuSubButton.svelte';
+import Trigger from './Trigger.svelte';
+import Rail from './Rail.svelte';
+import Inset from './Inset.svelte';
+import Input from './Input.svelte';
+import { getSidebarContext as useSidebar } from './context.svelte';
+export { Provider as SidebarProvider, Root as Sidebar, Header as SidebarHeader, Footer as SidebarFooter, Separator as SidebarSeparator, Content as SidebarContent, Group as SidebarGroup, GroupAction as SidebarGroupAction, Menu as SidebarMenu, MenuItem as SidebarMenuItem, MenuButton as SidebarMenuButton, MenuLink as SidebarMenuLink, MenuAction as SidebarMenuAction, MenuBadge as SidebarMenuBadge, MenuSkeleton as SidebarMenuSkeleton, MenuSub as SidebarMenuSub, MenuSubItem as SidebarMenuSubItem, MenuSubButton as SidebarMenuSubButton, Trigger as SidebarTrigger, Rail as SidebarRail, Inset as SidebarInset, Input as SidebarInput, useSidebar, };

package/dist/switch/Switch.svelte

@@ -0,0 +1,23 @@
+<!-- libs/helical-svelte/src/switch/Switch.svelte -->
+<!-- Closely based on: Shark UI switch (@ark-ui/svelte/switch), mirrored from @cloudvoyant/helical-react -->
+<script lang="ts">
+  import { setContext } from 'svelte';
+  import { SwitchRoot, SwitchHiddenInput, type SwitchRootProps } from '@ark-ui/svelte/switch';
+  import { cn } from '@cloudvoyant/helical-ui';
+
+  type Props = SwitchRootProps & {
+    size?: 'sm' | 'md' | 'lg';
+    class?: string;
+  };
+
+  let { size = 'md', class: className = '', children, ...rest }: Props = $props();
+
+  setContext<'sm' | 'md' | 'lg'>('switch-size', size);
+
+  const classes = $derived(cn('flex items-center gap-2', className));
+</script>
+
+<SwitchRoot class={classes} {...rest}>
+  {@render children?.()}
+  <SwitchHiddenInput />
+</SwitchRoot>

package/dist/switch/Switch.svelte.d.ts

@@ -0,0 +1,8 @@
+import { type SwitchRootProps } from '@ark-ui/svelte/switch';
+type Props = SwitchRootProps & {
+    size?: 'sm' | 'md' | 'lg';
+    class?: string;
+};
+declare const Switch: import("svelte").Component<Props, {}, "">;
+type Switch = ReturnType<typeof Switch>;
+export default Switch;

package/dist/switch/SwitchContext.svelte.d.ts

@@ -0,0 +1 @@
+export { useSwitchContext as useSwitch } from '@ark-ui/svelte/switch';

package/dist/switch/SwitchContext.svelte.js

@@ -0,0 +1,3 @@
+// libs/helical-svelte/src/switch/SwitchContext.svelte.ts
+// Closely based on: @ark-ui/svelte/switch useSwitchContext, mirrored from @cloudvoyant/helical-react useSwitch
+export { useSwitchContext as useSwitch } from '@ark-ui/svelte/switch';