@profidev/pleiades 1.7.0

package/dist/components/ui/chart/chart-tooltip.svelte

@@ -0,0 +1,191 @@
+<script lang="ts">
+  import { cn, type WithElementRef, type WithoutChildren } from '../../../utils.js';
+  import type { HTMLAttributes } from 'svelte/elements';
+  import {
+    getPayloadConfigFromPayload,
+    useChart,
+    type TooltipPayload
+  } from './chart-utils.js';
+  import { getChartContext, Tooltip as TooltipPrimitive } from 'layerchart';
+  import type { Snippet } from 'svelte';
+
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  function defaultFormatter(value: any, _payload: TooltipPayload[]) {
+    return `${value}`;
+  }
+
+  let {
+    ref = $bindable(null),
+    class: className,
+    hideLabel = false,
+    indicator = 'dot',
+    hideIndicator = false,
+    labelKey,
+    label,
+    labelFormatter = defaultFormatter,
+    labelClassName,
+    formatter,
+    nameKey,
+    color,
+    ...restProps
+  }: WithoutChildren<WithElementRef<HTMLAttributes<HTMLDivElement>>> & {
+    hideLabel?: boolean;
+    label?: string;
+    indicator?: 'line' | 'dot' | 'dashed';
+    nameKey?: string;
+    labelKey?: string;
+    hideIndicator?: boolean;
+    labelClassName?: string;
+    labelFormatter?: // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      | ((value: any, payload: TooltipPayload[]) => string | number | Snippet)
+      | null;
+    formatter?: Snippet<
+      [
+        {
+          value: unknown;
+          name: string;
+          item: TooltipPayload;
+          index: number;
+          payload: TooltipPayload[];
+        }
+      ]
+    >;
+  } = $props();
+
+  const chart = useChart();
+  const chartCtx = getChartContext();
+
+  // Filter to series with defined values (important for item-based charts like Pie/Arc
+  // where only the hovered item has a value)
+  const visibleSeries = $derived(
+    chartCtx.tooltip.series.filter((s: TooltipPayload) => s.value !== undefined)
+  );
+
+  const formattedLabel = $derived.by(() => {
+    if (hideLabel || !visibleSeries?.length) return null;
+
+    const [item] = visibleSeries;
+    const tooltipData = chartCtx.tooltip.data;
+
+    // Get the x-axis label value from the raw tooltip data (e.g. a Date or month string)
+    const dataLabel = tooltipData != null ? chartCtx.x(tooltipData) : undefined;
+
+    const key = labelKey ?? item?.label ?? item?.key ?? 'value';
+    const itemConfig = getPayloadConfigFromPayload(
+      chart.config,
+      item,
+      key,
+      tooltipData as Record<string, unknown> | null
+    );
+
+    let value: unknown;
+    if (!labelKey && typeof label === 'string') {
+      value = chart.config[label as keyof typeof chart.config]?.label ?? label;
+    } else if (labelKey) {
+      value = itemConfig?.label ?? dataLabel;
+    } else {
+      value = dataLabel;
+    }
+
+    if (value === undefined) return null;
+    if (!labelFormatter) return value;
+    return labelFormatter(value, visibleSeries);
+  });
+
+  const nestLabel = $derived(visibleSeries.length === 1 && indicator !== 'dot');
+</script>
+
+{#snippet TooltipLabel()}
+  {#if formattedLabel}
+    <div class={cn('font-medium', labelClassName)}>
+      {#if typeof formattedLabel === 'function'}
+        {@render formattedLabel()}
+      {:else}
+        {formattedLabel}
+      {/if}
+    </div>
+  {/if}
+{/snippet}
+
+<TooltipPrimitive.Root variant="none">
+  <div
+    bind:this={ref}
+    class={cn(
+      'border-border/50 bg-background grid min-w-[9rem] items-start gap-1.5 rounded-lg border px-2.5 py-1.5 text-xs shadow-xl',
+      className
+    )}
+    {...restProps}
+  >
+    {#if !nestLabel}
+      {@render TooltipLabel()}
+    {/if}
+    <div class="grid gap-1.5">
+      {#each visibleSeries as item, i (item.key + i)}
+        {@const key = `${nameKey || item.key || item.label || 'value'}`}
+        {@const itemConfig = getPayloadConfigFromPayload(
+          chart.config,
+          item,
+          key,
+          chartCtx.tooltip.data
+        )}
+        {@const indicatorColor = color || item.config?.color || item.color}
+        <div
+          class={cn(
+            '[&>svg]:text-muted-foreground flex w-full flex-wrap items-stretch gap-2 [&>svg]:size-2.5',
+            indicator === 'dot' && 'items-center'
+          )}
+        >
+          {#if formatter && item.value !== undefined && item.label}
+            {@render formatter({
+              value: item.value,
+              name: item.label,
+              item,
+              index: i,
+              payload: visibleSeries
+            })}
+          {:else}
+            {#if itemConfig?.icon}
+              <itemConfig.icon />
+            {:else if !hideIndicator}
+              <div
+                style="--color-bg: {indicatorColor}; --color-border: {indicatorColor};"
+                class={cn(
+                  'shrink-0 rounded-[2px] border-(--color-border) bg-(--color-bg)',
+                  {
+                    'size-2.5': indicator === 'dot',
+                    'h-full w-1': indicator === 'line',
+                    'w-0 border-[1.5px] border-dashed bg-transparent':
+                      indicator === 'dashed',
+                    'my-0.5': nestLabel && indicator === 'dashed'
+                  }
+                )}
+              ></div>
+            {/if}
+            <div
+              class={cn(
+                'flex flex-1 shrink-0 justify-between leading-none',
+                nestLabel ? 'items-end' : 'items-center'
+              )}
+            >
+              <div class="grid gap-1.5">
+                {#if nestLabel}
+                  {@render TooltipLabel()}
+                {/if}
+                <span class="text-muted-foreground">
+                  {itemConfig?.label || item.label}
+                </span>
+              </div>
+              {#if item.value !== undefined}
+                <span
+                  class="text-foreground font-mono font-medium tabular-nums"
+                >
+                  {item.value.toLocaleString()}
+                </span>
+              {/if}
+            </div>
+          {/if}
+        </div>
+      {/each}
+    </div>
+  </div>
+</TooltipPrimitive.Root>

package/dist/components/ui/chart/chart-tooltip.svelte.d.ts

@@ -0,0 +1,26 @@
+import { type WithElementRef, type WithoutChildren } from '../../../utils.js';
+import type { HTMLAttributes } from 'svelte/elements';
+import { type TooltipPayload } from './chart-utils.js';
+import type { Snippet } from 'svelte';
+type $$ComponentProps = WithoutChildren<WithElementRef<HTMLAttributes<HTMLDivElement>>> & {
+    hideLabel?: boolean;
+    label?: string;
+    indicator?: 'line' | 'dot' | 'dashed';
+    nameKey?: string;
+    labelKey?: string;
+    hideIndicator?: boolean;
+    labelClassName?: string;
+    labelFormatter?: ((value: any, payload: TooltipPayload[]) => string | number | Snippet) | null;
+    formatter?: Snippet<[
+        {
+            value: unknown;
+            name: string;
+            item: TooltipPayload;
+            index: number;
+            payload: TooltipPayload[];
+        }
+    ]>;
+};
+declare const ChartTooltip: import("svelte").Component<$$ComponentProps, {}, "ref">;
+type ChartTooltip = ReturnType<typeof ChartTooltip>;
+export default ChartTooltip;

package/dist/components/ui/chart/chart-utils.d.ts

@@ -0,0 +1,36 @@
+import type { Tooltip } from 'layerchart';
+import { type Component, type Snippet } from 'svelte';
+export declare const THEMES: {
+    readonly light: "";
+    readonly dark: ".dark";
+};
+export type ChartConfig = {
+    [k in string]: {
+        label?: string;
+        icon?: Component;
+    } & ({
+        color?: string;
+        theme?: never;
+    } | {
+        color?: never;
+        theme: Record<keyof typeof THEMES, string>;
+    });
+};
+export type ExtractSnippetParams<T> = T extends Snippet<[infer P]> ? P : never;
+export type TooltipPayload = Tooltip.TooltipSeries;
+export declare function getPayloadConfigFromPayload(config: ChartConfig, payload: TooltipPayload, key: string, data?: Record<string, any> | null): ({
+    label?: string;
+    icon?: Component;
+} & ({
+    color?: string;
+    theme?: never;
+} | {
+    color?: never;
+    theme: Record<keyof typeof THEMES, string>;
+})) | undefined;
+type ChartContextValue = {
+    config: ChartConfig;
+};
+export declare function setChartContext(value: ChartContextValue): ChartContextValue;
+export declare function useChart(): ChartContextValue;
+export {};

package/dist/components/ui/chart/chart-utils.js

@@ -0,0 +1,43 @@
+import { getContext, setContext } from 'svelte';
+export const THEMES = { light: '', dark: '.dark' };
+// Helper to extract item config from a payload.
+export function getPayloadConfigFromPayload(config, payload, key, 
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+data) {
+    if (typeof payload !== 'object' || payload === null)
+        return undefined;
+    const payloadConfig = 'config' in payload &&
+        typeof payload.config === 'object' &&
+        payload.config !== null
+        ? payload.config
+        : undefined;
+    let configLabelKey = key;
+    if (payload.key === key) {
+        configLabelKey = payload.key;
+    }
+    else if (payload.label === key) {
+        configLabelKey = payload.label;
+    }
+    else if (key in payload &&
+        typeof payload[key] === 'string') {
+        configLabelKey = payload[key];
+    }
+    else if (payloadConfig !== undefined &&
+        key in payloadConfig &&
+        typeof payloadConfig[key] === 'string') {
+        configLabelKey = payloadConfig[key];
+    }
+    else if (data != null && key in data && typeof data[key] === 'string') {
+        configLabelKey = data[key];
+    }
+    return configLabelKey in config
+        ? config[configLabelKey]
+        : config[key];
+}
+const chartContextKey = Symbol('chart-context');
+export function setChartContext(value) {
+    return setContext(chartContextKey, value);
+}
+export function useChart() {
+    return getContext(chartContextKey);
+}

package/dist/components/ui/chart/index.d.ts

@@ -0,0 +1,4 @@
+import ChartContainer from './chart-container.svelte';
+import ChartTooltip from './chart-tooltip.svelte';
+export { getPayloadConfigFromPayload, type ChartConfig } from './chart-utils.js';
+export { ChartContainer, ChartTooltip, ChartContainer as Container, ChartTooltip as Tooltip };

package/dist/components/ui/chart/index.js

@@ -0,0 +1,4 @@
+import ChartContainer from './chart-container.svelte';
+import ChartTooltip from './chart-tooltip.svelte';
+export { getPayloadConfigFromPayload } from './chart-utils.js';
+export { ChartContainer, ChartTooltip, ChartContainer as Container, ChartTooltip as Tooltip };

package/dist/components/ui/checkbox/checkbox.svelte

@@ -0,0 +1,39 @@
+<script lang="ts">
+  import { Checkbox as CheckboxPrimitive } from 'bits-ui';
+  import { cn, type WithoutChildrenOrChild } from '../../../utils.js';
+  import CheckIcon from '@lucide/svelte/icons/check';
+  import MinusIcon from '@lucide/svelte/icons/minus';
+
+  let {
+    ref = $bindable(null),
+    checked = $bindable(false),
+    indeterminate = $bindable(false),
+    class: className,
+    ...restProps
+  }: WithoutChildrenOrChild<CheckboxPrimitive.RootProps> = $props();
+</script>
+
+<CheckboxPrimitive.Root
+  bind:ref
+  data-slot="checkbox"
+  class={cn(
+    'border-input dark:bg-input/30 data-checked:bg-primary data-checked:text-primary-foreground dark:data-checked:bg-primary data-checked:border-primary aria-invalid:aria-checked:border-primary aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 peer relative flex size-4 shrink-0 items-center justify-center rounded-[4px] border transition-colors outline-none group-has-disabled/field:opacity-50 after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:ring-3 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:ring-3',
+    className
+  )}
+  bind:checked
+  bind:indeterminate
+  {...restProps}
+>
+  {#snippet children({ checked, indeterminate })}
+    <div
+      data-slot="checkbox-indicator"
+      class="grid place-content-center text-current transition-none [&>svg]:size-3.5"
+    >
+      {#if checked}
+        <CheckIcon />
+      {:else if indeterminate}
+        <MinusIcon />
+      {/if}
+    </div>
+  {/snippet}
+</CheckboxPrimitive.Root>

package/dist/components/ui/checkbox/checkbox.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Checkbox as CheckboxPrimitive } from 'bits-ui';
+declare const Checkbox: import("svelte").Component<Omit<Omit<CheckboxPrimitive.RootProps, "child">, "children">, {}, "ref" | "checked" | "indeterminate">;
+type Checkbox = ReturnType<typeof Checkbox>;
+export default Checkbox;

package/dist/components/ui/checkbox/index.d.ts

@@ -0,0 +1,2 @@
+import Root from './checkbox.svelte';
+export { Root, Root as Checkbox };

package/dist/components/ui/checkbox/index.js

@@ -0,0 +1,4 @@
+import Root from './checkbox.svelte';
+export { Root, 
+//
+Root as Checkbox };

package/dist/components/ui/collapsible/collapsible-content.svelte

@@ -0,0 +1,14 @@
+<script lang="ts">
+  import { Collapsible as CollapsiblePrimitive } from 'bits-ui';
+
+  let {
+    ref = $bindable(null),
+    ...restProps
+  }: CollapsiblePrimitive.ContentProps = $props();
+</script>
+
+<CollapsiblePrimitive.Content
+  bind:ref
+  data-slot="collapsible-content"
+  {...restProps}
+/>

package/dist/components/ui/collapsible/collapsible-content.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Collapsible as CollapsiblePrimitive } from 'bits-ui';
+declare const CollapsibleContent: import("svelte").Component<CollapsiblePrimitive.ContentProps, {}, "ref">;
+type CollapsibleContent = ReturnType<typeof CollapsibleContent>;
+export default CollapsibleContent;

package/dist/components/ui/collapsible/collapsible-trigger.svelte

@@ -0,0 +1,14 @@
+<script lang="ts">
+  import { Collapsible as CollapsiblePrimitive } from 'bits-ui';
+
+  let {
+    ref = $bindable(null),
+    ...restProps
+  }: CollapsiblePrimitive.TriggerProps = $props();
+</script>
+
+<CollapsiblePrimitive.Trigger
+  bind:ref
+  data-slot="collapsible-trigger"
+  {...restProps}
+/>

package/dist/components/ui/collapsible/collapsible-trigger.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Collapsible as CollapsiblePrimitive } from 'bits-ui';
+declare const CollapsibleTrigger: import("svelte").Component<CollapsiblePrimitive.TriggerProps, {}, "ref">;
+type CollapsibleTrigger = ReturnType<typeof CollapsibleTrigger>;
+export default CollapsibleTrigger;

package/dist/components/ui/collapsible/collapsible.svelte

@@ -0,0 +1,16 @@
+<script lang="ts">
+  import { Collapsible as CollapsiblePrimitive } from 'bits-ui';
+
+  let {
+    ref = $bindable(null),
+    open = $bindable(false),
+    ...restProps
+  }: CollapsiblePrimitive.RootProps = $props();
+</script>
+
+<CollapsiblePrimitive.Root
+  bind:ref
+  bind:open
+  data-slot="collapsible"
+  {...restProps}
+/>

package/dist/components/ui/collapsible/collapsible.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Collapsible as CollapsiblePrimitive } from 'bits-ui';
+declare const Collapsible: import("svelte").Component<CollapsiblePrimitive.RootProps, {}, "ref" | "open">;
+type Collapsible = ReturnType<typeof Collapsible>;
+export default Collapsible;

package/dist/components/ui/collapsible/index.d.ts

@@ -0,0 +1,4 @@
+import Root from './collapsible.svelte';
+import Trigger from './collapsible-trigger.svelte';
+import Content from './collapsible-content.svelte';
+export { Root, Content, Trigger, Root as Collapsible, Content as CollapsibleContent, Trigger as CollapsibleTrigger };

package/dist/components/ui/collapsible/index.js

@@ -0,0 +1,6 @@
+import Root from './collapsible.svelte';
+import Trigger from './collapsible-trigger.svelte';
+import Content from './collapsible-content.svelte';
+export { Root, Content, Trigger, 
+//
+Root as Collapsible, Content as CollapsibleContent, Trigger as CollapsibleTrigger };

package/dist/components/ui/command/command-dialog.svelte

@@ -0,0 +1,48 @@
+<script lang="ts">
+  import type {
+    Command as CommandPrimitive,
+    Dialog as DialogPrimitive
+  } from 'bits-ui';
+  import type { Snippet } from 'svelte';
+  import Command from './command.svelte';
+  import * as Dialog from '../dialog/index.js';
+  import { cn, type WithoutChildrenOrChild } from '../../../utils.js';
+
+  let {
+    open = $bindable(false),
+    ref = $bindable(null),
+    value = $bindable(''),
+    title = 'Command Palette',
+    description = 'Search for a command to run...',
+    showCloseButton = false,
+    portalProps,
+    children,
+    class: className,
+    ...restProps
+  }: WithoutChildrenOrChild<DialogPrimitive.RootProps> &
+    WithoutChildrenOrChild<CommandPrimitive.RootProps> & {
+      portalProps?: DialogPrimitive.PortalProps;
+      children: Snippet;
+      title?: string;
+      description?: string;
+      showCloseButton?: boolean;
+      class?: string;
+    } = $props();
+</script>
+
+<Dialog.Root bind:open {...restProps}>
+  <Dialog.Header class="sr-only">
+    <Dialog.Title>{title}</Dialog.Title>
+    <Dialog.Description>{description}</Dialog.Description>
+  </Dialog.Header>
+  <Dialog.Content
+    class={cn(
+      'top-1/3 translate-y-0 overflow-hidden rounded-xl! p-0',
+      className
+    )}
+    {showCloseButton}
+    {portalProps}
+  >
+    <Command {...restProps} bind:value bind:ref {children} />
+  </Dialog.Content>
+</Dialog.Root>

package/dist/components/ui/command/command-dialog.svelte.d.ts

@@ -0,0 +1,14 @@
+import type { Command as CommandPrimitive, Dialog as DialogPrimitive } from 'bits-ui';
+import type { Snippet } from 'svelte';
+import { type WithoutChildrenOrChild } from '../../../utils.js';
+type $$ComponentProps = WithoutChildrenOrChild<DialogPrimitive.RootProps> & WithoutChildrenOrChild<CommandPrimitive.RootProps> & {
+    portalProps?: DialogPrimitive.PortalProps;
+    children: Snippet;
+    title?: string;
+    description?: string;
+    showCloseButton?: boolean;
+    class?: string;
+};
+declare const CommandDialog: import("svelte").Component<$$ComponentProps, {}, "value" | "ref" | "open">;
+type CommandDialog = ReturnType<typeof CommandDialog>;
+export default CommandDialog;

package/dist/components/ui/command/command-empty.svelte

@@ -0,0 +1,17 @@
+<script lang="ts">
+  import { Command as CommandPrimitive } from 'bits-ui';
+  import { cn } from '../../../utils.js';
+
+  let {
+    ref = $bindable(null),
+    class: className,
+    ...restProps
+  }: CommandPrimitive.EmptyProps = $props();
+</script>
+
+<CommandPrimitive.Empty
+  bind:ref
+  data-slot="command-empty"
+  class={cn('py-6 text-center text-sm', className)}
+  {...restProps}
+/>

package/dist/components/ui/command/command-empty.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Command as CommandPrimitive } from 'bits-ui';
+declare const CommandEmpty: import("svelte").Component<CommandPrimitive.EmptyProps, {}, "ref">;
+type CommandEmpty = ReturnType<typeof CommandEmpty>;
+export default CommandEmpty;

package/dist/components/ui/command/command-group.svelte

@@ -0,0 +1,35 @@
+<script lang="ts">
+  import { Command as CommandPrimitive, useId } from 'bits-ui';
+  import { cn } from '../../../utils.js';
+
+  let {
+    ref = $bindable(null),
+    class: className,
+    children,
+    heading,
+    value,
+    ...restProps
+  }: CommandPrimitive.GroupProps & {
+    heading?: string;
+  } = $props();
+</script>
+
+<CommandPrimitive.Group
+  bind:ref
+  data-slot="command-group"
+  class={cn(
+    'text-foreground **:[[cmdk-group-heading]]:text-muted-foreground overflow-hidden p-1 **:[[cmdk-group-heading]]:px-2 **:[[cmdk-group-heading]]:py-1.5 **:[[cmdk-group-heading]]:text-xs **:[[cmdk-group-heading]]:font-medium',
+    className
+  )}
+  value={value ?? heading ?? `----${useId()}`}
+  {...restProps}
+>
+  {#if heading}
+    <CommandPrimitive.GroupHeading
+      class="text-muted-foreground px-2 py-1.5 text-xs font-medium"
+    >
+      {heading}
+    </CommandPrimitive.GroupHeading>
+  {/if}
+  <CommandPrimitive.GroupItems {children} />
+</CommandPrimitive.Group>

package/dist/components/ui/command/command-group.svelte.d.ts

@@ -0,0 +1,7 @@
+import { Command as CommandPrimitive } from 'bits-ui';
+type $$ComponentProps = CommandPrimitive.GroupProps & {
+    heading?: string;
+};
+declare const CommandGroup: import("svelte").Component<$$ComponentProps, {}, "ref">;
+type CommandGroup = ReturnType<typeof CommandGroup>;
+export default CommandGroup;

package/dist/components/ui/command/command-input.svelte

@@ -0,0 +1,33 @@
+<script lang="ts">
+  import { Command as CommandPrimitive } from 'bits-ui';
+  import { cn } from '../../../utils.js';
+  import * as InputGroup from '../input-group/index.js';
+  import SearchIcon from '@lucide/svelte/icons/search';
+
+  let {
+    ref = $bindable(null),
+    class: className,
+    value = $bindable(''),
+    ...restProps
+  }: CommandPrimitive.InputProps = $props();
+</script>
+
+<div data-slot="command-input-wrapper" class="p-1 pb-0">
+  <InputGroup.Root
+    class="bg-input/30 border-input/30 h-8! rounded-lg! shadow-none! *:data-[slot=input-group-addon]:pl-2!"
+  >
+    <CommandPrimitive.Input
+      data-slot="command-input"
+      class={cn(
+        'w-full text-sm outline-hidden disabled:cursor-not-allowed disabled:opacity-50',
+        className
+      )}
+      bind:ref
+      {...restProps}
+      bind:value
+    />
+    <InputGroup.Addon>
+      <SearchIcon class="size-4 shrink-0 opacity-50" />
+    </InputGroup.Addon>
+  </InputGroup.Root>
+</div>

package/dist/components/ui/command/command-input.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Command as CommandPrimitive } from 'bits-ui';
+declare const CommandInput: import("svelte").Component<CommandPrimitive.InputProps, {}, "value" | "ref">;
+type CommandInput = ReturnType<typeof CommandInput>;
+export default CommandInput;

package/dist/components/ui/command/command-item.svelte

@@ -0,0 +1,27 @@
+<script lang="ts">
+  import { Command as CommandPrimitive } from 'bits-ui';
+  import { cn } from '../../../utils.js';
+  import CheckIcon from '@lucide/svelte/icons/check';
+
+  let {
+    ref = $bindable(null),
+    class: className,
+    children,
+    ...restProps
+  }: CommandPrimitive.ItemProps = $props();
+</script>
+
+<CommandPrimitive.Item
+  bind:ref
+  data-slot="command-item"
+  class={cn(
+    "group/command-item data-selected:bg-muted data-selected:text-foreground data-selected:*:[svg]:text-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none in-data-[slot=dialog-content]:rounded-lg! data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+    className
+  )}
+  {...restProps}
+>
+  {@render children?.()}
+  <CheckIcon
+    class="cn-command-item-indicator ml-auto opacity-0 group-has-[[data-slot=command-shortcut]]/command-item:hidden group-data-[checked=true]/command-item:opacity-100"
+  />
+</CommandPrimitive.Item>

package/dist/components/ui/command/command-item.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Command as CommandPrimitive } from 'bits-ui';
+declare const CommandItem: import("svelte").Component<CommandPrimitive.ItemProps, {}, "ref">;
+type CommandItem = ReturnType<typeof CommandItem>;
+export default CommandItem;