@cloudvoyant/helical-svelte 0.19.0

package/dist/code-block/CodeRenderer.svelte

@@ -0,0 +1,78 @@
+<!-- libs/helical-svelte/src/code-block/CodeRenderer.svelte -->
+<!-- Shared shiki renderer for the code-block family, mirrored from @cloudvoyant/helical-react -->
+<script lang="ts">
+  import {
+    codeBlockBodyBase,
+    codeBlockBodyScrollableBase,
+    codeBlockContentBase,
+    codeBlockLineNumbersBase,
+    codeBlockHighlightBase,
+    codeBlockLoadingBase,
+    codeBlockSpinnerBase,
+    injectCodeBlockStyles,
+    renderCodeToHtml,
+    cn,
+  } from '@cloudvoyant/helical-ui';
+
+  type Props = {
+    code: string;
+    language: string;
+    html?: string;
+    showLineNumbers: boolean;
+    scrollable: boolean;
+    maxHeight: number;
+    highlightLines?: number[];
+  };
+
+  let {
+    code,
+    language,
+    html = undefined,
+    showLineNumbers,
+    scrollable,
+    maxHeight,
+    highlightLines = undefined,
+  }: Props = $props();
+
+  let rendered = $state<string | null>(html ?? null);
+
+  const highlightKey = $derived(highlightLines?.join(',') ?? '');
+
+  // The scoped `.hx-cb`/`.cbln`/`.cbhl` styles must be present for both the client
+  // highlight path and the prerendered `html` path, so inject them on mount (idempotent).
+  $effect(() => {
+    injectCodeBlockStyles();
+  });
+
+  $effect(() => {
+    if (html !== undefined) return;
+    let cancelled = false;
+    rendered = null;
+    renderCodeToHtml(code, language, highlightLines).then((h) => {
+      if (!cancelled) rendered = h;
+    });
+    return () => {
+      cancelled = true;
+    };
+  });
+
+  const classes = $derived(cn(codeBlockBodyBase, scrollable && codeBlockBodyScrollableBase));
+  const contentClasses = $derived(
+    cn(
+      codeBlockContentBase,
+      showLineNumbers && codeBlockLineNumbersBase,
+      highlightLines?.length && codeBlockHighlightBase,
+    ),
+  );
+  const styles = $derived(scrollable ? `max-height: ${maxHeight}px;` : undefined);
+</script>
+
+<div class={classes} style={styles}>
+  {#if rendered !== null}
+    <div class={contentClasses}>{@html rendered}</div>
+  {:else}
+    <div class={codeBlockLoadingBase}>
+      <div class={codeBlockSpinnerBase}></div>
+    </div>
+  {/if}
+</div>

package/dist/code-block/CodeRenderer.svelte.d.ts

@@ -0,0 +1,12 @@
+type Props = {
+    code: string;
+    language: string;
+    html?: string;
+    showLineNumbers: boolean;
+    scrollable: boolean;
+    maxHeight: number;
+    highlightLines?: number[];
+};
+declare const CodeRenderer: import("svelte").Component<Props, {}, "">;
+type CodeRenderer = ReturnType<typeof CodeRenderer>;
+export default CodeRenderer;

package/dist/code-block/LanguageTabsCodeBlock.svelte

@@ -0,0 +1,119 @@
+<!-- libs/helical-svelte/src/code-block/LanguageTabsCodeBlock.svelte -->
+<!-- Closely based on: diffbook code-block family, rebuilt with a helical-ui Select language dropdown
+     + floating copy, mirrored from @cloudvoyant/helical-react -->
+<script lang="ts">
+  import { Ark } from '@ark-ui/svelte/factory';
+  import CopyButton from '../CopyButton.svelte';
+  import {
+    Select,
+    SelectTrigger,
+    SelectValue,
+    SelectIndicator,
+    SelectContent,
+    SelectItem,
+    SelectItemText,
+    SelectItemIndicator,
+  } from '../select';
+  import CodeBlockHeader from './CodeBlockHeader.svelte';
+  import CodeBlockTitle from './CodeBlockTitle.svelte';
+  import CodeRenderer from './CodeRenderer.svelte';
+  import {
+    codeBlockRootBase,
+    codeBlockCopyFloatBase,
+    cn,
+  } from '@cloudvoyant/helical-ui';
+  import type { LanguageTab } from '@cloudvoyant/helical-ui';
+  import type { HTMLAttributes } from 'svelte/elements';
+
+  type Props = {
+    tabs: LanguageTab[];
+    showLineNumbers?: boolean;
+    scrollable?: boolean;
+    maxHeight?: number;
+    class?: string;
+  } & HTMLAttributes<HTMLDivElement>;
+
+  let {
+    tabs,
+    showLineNumbers = false,
+    scrollable = false,
+    maxHeight = 400,
+    class: className = '',
+    ...rest
+  }: Props = $props();
+
+  let active = $state(tabs[0]?.label ?? '');
+  const tab = $derived(tabs.find((t) => t.label === active) ?? tabs[0]);
+  const items = $derived(tabs.map((t) => ({ value: t.label, label: t.label })));
+
+  $effect(() => {
+    if (!tabs.some((t) => t.label === active)) {
+      active = tabs[0]?.label ?? '';
+    }
+  });
+
+  const classes = $derived(cn(codeBlockRootBase, className));
+</script>
+
+<Ark as="div" data-code-block class={classes} {...rest}>
+  <CodeBlockHeader>
+    <CodeBlockTitle>{tab?.filename}</CodeBlockTitle>
+    <div class="ml-auto">
+      <Select {items} value={[active]} onValueChange={(details) => (active = details.value[0])} aria-label="Language">
+        <SelectTrigger size="sm" class="min-w-28 justify-between font-mono text-xs">
+          <SelectValue />
+          <SelectIndicator>
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              viewBox="0 0 24 24"
+              fill="none"
+              stroke="currentColor"
+              stroke-width="2"
+              stroke-linecap="round"
+              stroke-linejoin="round"
+              aria-hidden="true"
+            >
+              <path d="m6 9 6 6 6-6"></path>
+            </svg>
+          </SelectIndicator>
+        </SelectTrigger>
+        <SelectContent>
+          {#each tabs as t (t.label)}
+            <SelectItem item={{ value: t.label, label: t.label }}>
+              <SelectItemText>{t.label}</SelectItemText>
+              <SelectItemIndicator>
+                <svg
+                  xmlns="http://www.w3.org/2000/svg"
+                  viewBox="0 0 24 24"
+                  fill="none"
+                  stroke="currentColor"
+                  stroke-width="2"
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                  aria-hidden="true"
+                >
+                  <path d="M20 6 9 17l-5-5"></path>
+                </svg>
+              </SelectItemIndicator>
+            </SelectItem>
+          {/each}
+        </SelectContent>
+      </Select>
+    </div>
+  </CodeBlockHeader>
+  {#if tab}
+    <div class="relative">
+      <CodeRenderer
+        code={tab.code}
+        language={tab.language ?? 'tsx'}
+        html={tab.html}
+        {showLineNumbers}
+        {scrollable}
+        {maxHeight}
+      />
+      <div class={codeBlockCopyFloatBase}>
+        <CopyButton value={tab.code} label="Copy code" />
+      </div>
+    </div>
+  {/if}
+</Ark>

package/dist/code-block/LanguageTabsCodeBlock.svelte.d.ts

@@ -0,0 +1,12 @@
+import type { LanguageTab } from '@cloudvoyant/helical-ui';
+import type { HTMLAttributes } from 'svelte/elements';
+type Props = {
+    tabs: LanguageTab[];
+    showLineNumbers?: boolean;
+    scrollable?: boolean;
+    maxHeight?: number;
+    class?: string;
+} & HTMLAttributes<HTMLDivElement>;
+declare const LanguageTabsCodeBlock: import("svelte").Component<Props, {}, "">;
+type LanguageTabsCodeBlock = ReturnType<typeof LanguageTabsCodeBlock>;
+export default LanguageTabsCodeBlock;

package/dist/code-block/MultiFileCodeBlock.svelte

@@ -0,0 +1,75 @@
+<!-- libs/helical-svelte/src/code-block/MultiFileCodeBlock.svelte -->
+<!-- Closely based on: diffbook code-block family, mirrored from @cloudvoyant/helical-react -->
+<script lang="ts">
+  import { Ark } from '@ark-ui/svelte/factory';
+  import CopyButton from '../CopyButton.svelte';
+  import CodeRenderer from './CodeRenderer.svelte';
+  import { codeBlockRootBase, cn } from '@cloudvoyant/helical-ui';
+  import type { FileEntry } from '@cloudvoyant/helical-ui';
+  import type { HTMLAttributes } from 'svelte/elements';
+
+  type Props = {
+    files: FileEntry[];
+    showLineNumbers?: boolean;
+    scrollable?: boolean;
+    maxHeight?: number;
+    class?: string;
+  } & HTMLAttributes<HTMLDivElement>;
+
+  let {
+    files,
+    showLineNumbers = false,
+    scrollable = false,
+    maxHeight = 400,
+    class: className = '',
+    ...rest
+  }: Props = $props();
+
+  let active = $state(files[0]?.filename ?? '');
+  const file = $derived(files.find((f) => f.filename === active) ?? files[0]);
+
+  $effect(() => {
+    if (!files.some((f) => f.filename === active)) {
+      active = files[0]?.filename ?? '';
+    }
+  });
+
+  const classes = $derived(cn(codeBlockRootBase, className));
+</script>
+
+<Ark as="div" data-code-block class={classes} {...rest}>
+  <div class="flex items-center justify-between border-b bg-muted/50">
+    <div role="tablist" aria-label="Files" class="flex overflow-x-auto no-scrollbar pl-1">
+      {#each files as f (f.filename)}
+        <button
+          role="tab"
+          aria-selected={active === f.filename}
+          onclick={() => (active = f.filename)}
+          class={cn(
+            'h-10 shrink-0 border-b-2 px-3 font-mono text-xs transition-colors',
+            active === f.filename
+              ? 'border-foreground text-foreground'
+              : 'border-transparent text-muted-foreground hover:text-foreground',
+          )}
+        >
+          {f.filename}
+        </button>
+      {/each}
+    </div>
+    {#if file}
+      <div class="shrink-0 pr-3">
+        <CopyButton value={file.code} label="Copy code" />
+      </div>
+    {/if}
+  </div>
+  {#if file}
+    <CodeRenderer
+      code={file.code}
+      language={file.language ?? 'tsx'}
+      html={file.html}
+      {showLineNumbers}
+      {scrollable}
+      {maxHeight}
+    />
+  {/if}
+</Ark>

package/dist/code-block/MultiFileCodeBlock.svelte.d.ts

@@ -0,0 +1,12 @@
+import type { FileEntry } from '@cloudvoyant/helical-ui';
+import type { HTMLAttributes } from 'svelte/elements';
+type Props = {
+    files: FileEntry[];
+    showLineNumbers?: boolean;
+    scrollable?: boolean;
+    maxHeight?: number;
+    class?: string;
+} & HTMLAttributes<HTMLDivElement>;
+declare const MultiFileCodeBlock: import("svelte").Component<Props, {}, "">;
+type MultiFileCodeBlock = ReturnType<typeof MultiFileCodeBlock>;
+export default MultiFileCodeBlock;

package/dist/code-block/index.d.ts

@@ -0,0 +1,7 @@
+export { default as CodeBlock } from './CodeBlock.svelte';
+export { default as CodeBlockHeader } from './CodeBlockHeader.svelte';
+export { default as CodeBlockTitle } from './CodeBlockTitle.svelte';
+export { default as CodeBlockContent } from './CodeBlockContent.svelte';
+export { default as CodeBlockCopyButton } from './CodeBlockCopyButton.svelte';
+export { default as MultiFileCodeBlock } from './MultiFileCodeBlock.svelte';
+export { default as LanguageTabsCodeBlock } from './LanguageTabsCodeBlock.svelte';

package/dist/code-block/index.js

@@ -0,0 +1,8 @@
+// libs/helical-svelte/src/code-block/index.ts
+export { default as CodeBlock } from './CodeBlock.svelte';
+export { default as CodeBlockHeader } from './CodeBlockHeader.svelte';
+export { default as CodeBlockTitle } from './CodeBlockTitle.svelte';
+export { default as CodeBlockContent } from './CodeBlockContent.svelte';
+export { default as CodeBlockCopyButton } from './CodeBlockCopyButton.svelte';
+export { default as MultiFileCodeBlock } from './MultiFileCodeBlock.svelte';
+export { default as LanguageTabsCodeBlock } from './LanguageTabsCodeBlock.svelte';

package/dist/combobox/Combobox.svelte

@@ -0,0 +1,25 @@
+<!-- libs/helical-svelte/src/combobox/Combobox.svelte -->
+<!-- Closely based on: Shark UI combobox (@ark-ui/svelte/combobox), mirrored from @cloudvoyant/helical-react -->
+<!-- Note: adapted to Ark UI v5 collection-based API (ComboboxRoot `collection` + ComboboxItem `item`). -->
+<script lang="ts">
+  import {
+    ComboboxRoot,
+    createListCollection,
+    type ComboboxRootProps,
+    type ListCollection,
+  } from '@ark-ui/svelte/combobox';
+  import type { SelectItemData } from '@cloudvoyant/helical-ui';
+
+  type Props = Omit<ComboboxRootProps<SelectItemData>, 'collection'> & {
+    items?: SelectItemData[];
+    collection?: ListCollection<SelectItemData>;
+  };
+
+  let { items, collection, openOnClick = true, lazyMount = true, unmountOnExit = true, children, ...rest }: Props = $props();
+
+  const resolvedCollection = $derived(collection ?? createListCollection({ items: items ?? [] }));
+</script>
+
+<ComboboxRoot collection={resolvedCollection} {openOnClick} {lazyMount} {unmountOnExit} {...rest}>
+  {@render children?.()}
+</ComboboxRoot>

package/dist/combobox/Combobox.svelte.d.ts

@@ -0,0 +1,9 @@
+import { type ComboboxRootProps, type ListCollection } from '@ark-ui/svelte/combobox';
+import type { SelectItemData } from '@cloudvoyant/helical-ui';
+type Props = Omit<ComboboxRootProps<SelectItemData>, 'collection'> & {
+    items?: SelectItemData[];
+    collection?: ListCollection<SelectItemData>;
+};
+declare const Combobox: import("svelte").Component<Props, {}, "">;
+type Combobox = ReturnType<typeof Combobox>;
+export default Combobox;

package/dist/combobox/ComboboxClear.svelte

@@ -0,0 +1,14 @@
+<!-- libs/helical-svelte/src/combobox/ComboboxClear.svelte -->
+<!-- Closely based on: Shark UI combobox (@ark-ui/svelte/combobox), mirrored from @cloudvoyant/helical-react -->
+<script lang="ts">
+  import { ComboboxClearTrigger, type ComboboxClearTriggerProps } from '@ark-ui/svelte/combobox';
+  import { comboboxClearTriggerBase, cn } from '@cloudvoyant/helical-ui';
+
+  let { class: className = '', children, ...rest }: ComboboxClearTriggerProps = $props();
+
+  const classes = $derived(cn(comboboxClearTriggerBase, className));
+</script>
+
+<ComboboxClearTrigger aria-label="Clear" class={classes} {...rest}>
+  {@render children?.()}
+</ComboboxClearTrigger>

package/dist/combobox/ComboboxClear.svelte.d.ts

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

package/dist/combobox/ComboboxContent.svelte

@@ -0,0 +1,19 @@
+<!-- libs/helical-svelte/src/combobox/ComboboxContent.svelte -->
+<!-- Closely based on: Shark UI combobox (@ark-ui/svelte/combobox), mirrored from @cloudvoyant/helical-react -->
+<script lang="ts">
+  import { Portal } from '@ark-ui/svelte/portal';
+  import { ComboboxPositioner, ComboboxContent, type ComboboxContentProps } from '@ark-ui/svelte/combobox';
+  import { comboboxContentBase, comboboxPositionerBase, cn } from '@cloudvoyant/helical-ui';
+
+  let { class: className = '', children, ...rest }: ComboboxContentProps = $props();
+
+  const classes = $derived(cn(comboboxContentBase, className));
+</script>
+
+<Portal>
+  <ComboboxPositioner class={comboboxPositionerBase}>
+    <ComboboxContent class={classes} {...rest}>
+      {@render children?.()}
+    </ComboboxContent>
+  </ComboboxPositioner>
+</Portal>

package/dist/combobox/ComboboxContent.svelte.d.ts

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

package/dist/combobox/ComboboxContext.svelte.d.ts

@@ -0,0 +1 @@
+export { useComboboxContext as useCombobox } from '@ark-ui/svelte/combobox';

package/dist/combobox/ComboboxContext.svelte.js

@@ -0,0 +1,3 @@
+// libs/helical-svelte/src/combobox/ComboboxContext.svelte.ts
+// Closely based on: @ark-ui/svelte/combobox useComboboxContext, mirrored from @cloudvoyant/helical-react useCombobox
+export { useComboboxContext as useCombobox } from '@ark-ui/svelte/combobox';

package/dist/combobox/ComboboxControl.svelte

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

package/dist/combobox/ComboboxControl.svelte.d.ts

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

package/dist/combobox/ComboboxEmpty.svelte

@@ -0,0 +1,18 @@
+<!-- libs/helical-svelte/src/combobox/ComboboxEmpty.svelte -->
+<!-- Closely based on: Shark UI combobox (@ark-ui/svelte/combobox), mirrored from @cloudvoyant/helical-react -->
+<script lang="ts">
+  import { ComboboxEmpty, type ComboboxEmptyProps } from '@ark-ui/svelte/combobox';
+  import { comboboxEmptyBase, cn } from '@cloudvoyant/helical-ui';
+
+  let { class: className = '', children, ...rest }: ComboboxEmptyProps = $props();
+
+  const classes = $derived(cn(comboboxEmptyBase, className));
+</script>
+
+<ComboboxEmpty class={classes} {...rest}>
+  {#if children}
+    {@render children()}
+  {:else}
+    No results found.
+  {/if}
+</ComboboxEmpty>

package/dist/combobox/ComboboxEmpty.svelte.d.ts

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

package/dist/combobox/ComboboxInput.svelte

@@ -0,0 +1,17 @@
+<!-- libs/helical-svelte/src/combobox/ComboboxInput.svelte -->
+<!-- Closely based on: Shark UI combobox (@ark-ui/svelte/combobox), mirrored from @cloudvoyant/helical-react -->
+<script lang="ts">
+  import { ComboboxInput, type ComboboxInputProps } from '@ark-ui/svelte/combobox';
+  import { inputVariants, comboboxInputBase, cn } from '@cloudvoyant/helical-ui';
+
+  type Props = Omit<ComboboxInputProps, 'size'> & {
+    size?: 'sm' | 'md' | 'lg';
+    class?: string;
+  };
+
+  let { size = 'md', class: className = '', ...rest }: Props = $props();
+
+  const classes = $derived(cn(inputVariants({ size }), comboboxInputBase, className));
+</script>
+
+<ComboboxInput class={classes} {...rest} />

package/dist/combobox/ComboboxInput.svelte.d.ts

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

package/dist/combobox/ComboboxItem.svelte

@@ -0,0 +1,22 @@
+<!-- libs/helical-svelte/src/combobox/ComboboxItem.svelte -->
+<!-- Closely based on: Shark UI combobox (@ark-ui/svelte/combobox), mirrored from @cloudvoyant/helical-react -->
+<!-- Note: adapted to Ark UI v5 — ComboboxItem takes `item` (the collection item). -->
+<script lang="ts">
+  import { ComboboxItem, type ComboboxItemProps } from '@ark-ui/svelte/combobox';
+  import { comboboxItemVariants, cn } from '@cloudvoyant/helical-ui';
+  import type { SelectItemData } from '@cloudvoyant/helical-ui';
+
+  type Props = Omit<ComboboxItemProps, 'item'> & {
+    item: SelectItemData;
+    showIndicator?: boolean;
+    class?: string;
+  };
+
+  let { item, showIndicator = true, class: className = '', children, ...rest }: Props = $props();
+
+  const classes = $derived(cn(comboboxItemVariants({ showIndicator }), className));
+</script>
+
+<ComboboxItem {item} persistFocus class={classes} {...rest}>
+  {@render children?.()}
+</ComboboxItem>

package/dist/combobox/ComboboxItem.svelte.d.ts

@@ -0,0 +1,10 @@
+import { ComboboxItem, type ComboboxItemProps } from '@ark-ui/svelte/combobox';
+import type { SelectItemData } from '@cloudvoyant/helical-ui';
+type Props = Omit<ComboboxItemProps, 'item'> & {
+    item: SelectItemData;
+    showIndicator?: boolean;
+    class?: string;
+};
+declare const ComboboxItem: import("svelte").Component<Props, {}, "">;
+type ComboboxItem = ReturnType<typeof ComboboxItem>;
+export default ComboboxItem;

package/dist/combobox/ComboboxItemGroup.svelte

@@ -0,0 +1,11 @@
+<!-- libs/helical-svelte/src/combobox/ComboboxItemGroup.svelte -->
+<!-- Closely based on: Shark UI combobox (@ark-ui/svelte/combobox), mirrored from @cloudvoyant/helical-react -->
+<script lang="ts">
+  import { ComboboxItemGroup, type ComboboxItemGroupProps } from '@ark-ui/svelte/combobox';
+
+  let { class: className = '', children, ...rest }: ComboboxItemGroupProps = $props();
+</script>
+
+<ComboboxItemGroup class={className} {...rest}>
+  {@render children?.()}
+</ComboboxItemGroup>

package/dist/combobox/ComboboxItemGroup.svelte.d.ts

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

package/dist/combobox/ComboboxItemGroupLabel.svelte

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

package/dist/combobox/ComboboxItemGroupLabel.svelte.d.ts

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

package/dist/combobox/ComboboxItemIndicator.svelte

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

package/dist/combobox/ComboboxItemIndicator.svelte.d.ts

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

package/dist/combobox/ComboboxItemText.svelte

@@ -0,0 +1,11 @@
+<!-- libs/helical-svelte/src/combobox/ComboboxItemText.svelte -->
+<!-- Closely based on: Shark UI combobox (@ark-ui/svelte/combobox), mirrored from @cloudvoyant/helical-react -->
+<script lang="ts">
+  import { ComboboxItemText, type ComboboxItemTextProps } from '@ark-ui/svelte/combobox';
+
+  let { class: className = '', children, ...rest }: ComboboxItemTextProps = $props();
+</script>
+
+<ComboboxItemText class={className} {...rest}>
+  {@render children?.()}
+</ComboboxItemText>

package/dist/combobox/ComboboxItemText.svelte.d.ts

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

package/dist/combobox/ComboboxList.svelte

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

package/dist/combobox/ComboboxList.svelte.d.ts

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