sve-ui 0.2.1 → 0.3.1

package/README.md

@@ -71,6 +71,8 @@ without it):
 **Display & form** — `Button`, `Input`, `Card`, `Badge`, `Avatar`, `Spinner`,
 `Text`, `Heading`, `Alert`.
 
+**Form controls** (on Bits UI) — `Switch`, `Checkbox`, `RadioGroup`.
+
 **Overlays** (on Bits UI) — `Dialog`, `DropdownMenu`, `Tooltip`, `Popover`.
 
 Most components take `variant`, `color` and `size` props, e.g.:
@@ -82,9 +84,9 @@ Most components take `variant`, `color` and `size` props, e.g.:
 <Input variant="outline" size="md" placeholder="you@example.com" bind:value />
 ```
 
-Overlays (`Dialog`, `DropdownMenu`, `Tooltip`, `Popover`, plus `Avatar`, `Card`,
-`Alert`) are **namespaced** compositions — import the namespace and compose its
-parts (`Dialog.Root`, `Dialog.Trigger`, `Dialog.Content`, …).
+`Avatar`, `Card`, `Alert`, the overlays, and the form controls are **namespaced**
+compositions — import the namespace and compose its parts (`Dialog.Root`,
+`Dialog.Trigger`, `Dialog.Content`; `RadioGroup.Root`, `RadioGroup.Item`; …).
 
 ## Theming
 

package/dist/components/Accordion/AccordionContent.svelte

@@ -0,0 +1,25 @@
+<script lang="ts">
+  import { Accordion } from 'bits-ui';
+  import type { ComponentProps } from 'svelte';
+
+  type BitsContentProps = ComponentProps<typeof Accordion.Content>;
+
+  interface Props extends Omit<BitsContentProps, 'class'> {
+    class?: string;
+  }
+
+  let { class: cls, ...rest }: Props = $props();
+
+  const className = $derived(['sve-accordion__content', cls].filter(Boolean).join(' '));
+</script>
+
+<Accordion.Content class={className} data-slot="accordion-content" {...rest} />
+
+<style>
+  :global(.sve-accordion__content) {
+    padding-bottom: var(--sve-space-4);
+    color: var(--sve-color-default-foreground);
+    font-size: var(--sve-font-size-sm);
+    line-height: var(--sve-line-height-normal);
+  }
+</style>

package/dist/components/Accordion/AccordionContent.svelte.d.ts

@@ -0,0 +1,10 @@
+import { Accordion } from 'bits-ui';
+import type { ComponentProps } from 'svelte';
+type BitsContentProps = ComponentProps<typeof Accordion.Content>;
+interface Props extends Omit<BitsContentProps, 'class'> {
+    class?: string;
+}
+declare const AccordionContent: import("svelte").Component<Props, {}, "">;
+type AccordionContent = ReturnType<typeof AccordionContent>;
+export default AccordionContent;
+//# sourceMappingURL=AccordionContent.svelte.d.ts.map

package/dist/components/Accordion/AccordionContent.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionContent.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Accordion/AccordionContent.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AACpC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,QAAQ,CAAC;AAG3C,KAAK,gBAAgB,GAAG,cAAc,CAAC,OAAO,SAAS,CAAC,OAAO,CAAC,CAAC;AAEjE,UAAU,KAAM,SAAQ,IAAI,CAAC,gBAAgB,EAAE,OAAO,CAAC;IACrD,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAkBH,QAAA,MAAM,gBAAgB,2CAAwC,CAAC;AAC/D,KAAK,gBAAgB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAC5D,eAAe,gBAAgB,CAAC"}

package/dist/components/Accordion/AccordionHeader.svelte

@@ -0,0 +1,22 @@
+<script lang="ts">
+  import { Accordion } from 'bits-ui';
+  import type { ComponentProps } from 'svelte';
+
+  type BitsHeaderProps = ComponentProps<typeof Accordion.Header>;
+
+  interface Props extends Omit<BitsHeaderProps, 'class'> {
+    class?: string;
+  }
+
+  let { class: cls, ...rest }: Props = $props();
+
+  const className = $derived(['sve-accordion__header', cls].filter(Boolean).join(' '));
+</script>
+
+<Accordion.Header class={className} data-slot="accordion-header" {...rest} />
+
+<style>
+  :global(.sve-accordion__header) {
+    margin: 0;
+  }
+</style>

package/dist/components/Accordion/AccordionHeader.svelte.d.ts

@@ -0,0 +1,10 @@
+import { Accordion } from 'bits-ui';
+import type { ComponentProps } from 'svelte';
+type BitsHeaderProps = ComponentProps<typeof Accordion.Header>;
+interface Props extends Omit<BitsHeaderProps, 'class'> {
+    class?: string;
+}
+declare const AccordionHeader: import("svelte").Component<Props, {}, "">;
+type AccordionHeader = ReturnType<typeof AccordionHeader>;
+export default AccordionHeader;
+//# sourceMappingURL=AccordionHeader.svelte.d.ts.map

package/dist/components/Accordion/AccordionHeader.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionHeader.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Accordion/AccordionHeader.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AACpC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,QAAQ,CAAC;AAG3C,KAAK,eAAe,GAAG,cAAc,CAAC,OAAO,SAAS,CAAC,MAAM,CAAC,CAAC;AAE/D,UAAU,KAAM,SAAQ,IAAI,CAAC,eAAe,EAAE,OAAO,CAAC;IACpD,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAkBH,QAAA,MAAM,eAAe,2CAAwC,CAAC;AAC9D,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAC1D,eAAe,eAAe,CAAC"}

package/dist/components/Accordion/AccordionItem.svelte

@@ -0,0 +1,22 @@
+<script lang="ts">
+  import { Accordion } from 'bits-ui';
+  import type { ComponentProps } from 'svelte';
+
+  type BitsItemProps = ComponentProps<typeof Accordion.Item>;
+
+  interface Props extends Omit<BitsItemProps, 'class'> {
+    class?: string;
+  }
+
+  let { class: cls, ...rest }: Props = $props();
+
+  const className = $derived(['sve-accordion__item', cls].filter(Boolean).join(' '));
+</script>
+
+<Accordion.Item class={className} data-slot="accordion-item" {...rest} />
+
+<style>
+  :global(.sve-accordion__item) {
+    border-bottom: 1px solid var(--sve-color-default-border);
+  }
+</style>

package/dist/components/Accordion/AccordionItem.svelte.d.ts

@@ -0,0 +1,10 @@
+import { Accordion } from 'bits-ui';
+import type { ComponentProps } from 'svelte';
+type BitsItemProps = ComponentProps<typeof Accordion.Item>;
+interface Props extends Omit<BitsItemProps, 'class'> {
+    class?: string;
+}
+declare const AccordionItem: import("svelte").Component<Props, {}, "">;
+type AccordionItem = ReturnType<typeof AccordionItem>;
+export default AccordionItem;
+//# sourceMappingURL=AccordionItem.svelte.d.ts.map

package/dist/components/Accordion/AccordionItem.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionItem.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Accordion/AccordionItem.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AACpC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,QAAQ,CAAC;AAG3C,KAAK,aAAa,GAAG,cAAc,CAAC,OAAO,SAAS,CAAC,IAAI,CAAC,CAAC;AAE3D,UAAU,KAAM,SAAQ,IAAI,CAAC,aAAa,EAAE,OAAO,CAAC;IAClD,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAkBH,QAAA,MAAM,aAAa,2CAAwC,CAAC;AAC5D,KAAK,aAAa,GAAG,UAAU,CAAC,OAAO,aAAa,CAAC,CAAC;AACtD,eAAe,aAAa,CAAC"}

package/dist/components/Accordion/AccordionRoot.svelte

@@ -0,0 +1,37 @@
+<script lang="ts">
+  import { Accordion } from 'bits-ui';
+  import type { Component, Snippet } from 'svelte';
+  import type { HTMLAttributes } from 'svelte/elements';
+
+  /**
+   * Bits' Accordion.Root props are a discriminated union (single vs multiple)
+   * over 400+ HTML attributes, which overflows TypeScript's union representation
+   * when spread. We expose a flat, non-union surface here and forward it to a
+   * loosely-typed view of the Bits root — behavior is unchanged.
+   */
+  interface Props extends Omit<HTMLAttributes<HTMLDivElement>, 'class'> {
+    type?: 'single' | 'multiple';
+    value?: string | string[];
+    onValueChange?: (value: string & string[]) => void;
+    disabled?: boolean;
+    loop?: boolean;
+    class?: string;
+    children?: Snippet;
+  }
+
+  let { type = 'single', class: cls, ...rest }: Props = $props();
+
+  const className = $derived(['sve-accordion', cls].filter(Boolean).join(' '));
+
+  const Root = Accordion.Root as unknown as Component<Record<string, unknown>>;
+</script>
+
+<Root {type} class={className} data-slot="accordion" {...rest} />
+
+<style>
+  :global(.sve-accordion) {
+    display: block;
+    font-family: var(--sve-font-family-sans);
+    border-top: 1px solid var(--sve-color-default-border);
+  }
+</style>

package/dist/components/Accordion/AccordionRoot.svelte.d.ts

@@ -0,0 +1,21 @@
+import type { Component, Snippet } from 'svelte';
+import type { HTMLAttributes } from 'svelte/elements';
+/**
+ * Bits' Accordion.Root props are a discriminated union (single vs multiple)
+ * over 400+ HTML attributes, which overflows TypeScript's union representation
+ * when spread. We expose a flat, non-union surface here and forward it to a
+ * loosely-typed view of the Bits root — behavior is unchanged.
+ */
+interface Props extends Omit<HTMLAttributes<HTMLDivElement>, 'class'> {
+    type?: 'single' | 'multiple';
+    value?: string | string[];
+    onValueChange?: (value: string & string[]) => void;
+    disabled?: boolean;
+    loop?: boolean;
+    class?: string;
+    children?: Snippet;
+}
+declare const AccordionRoot: Component<Props, {}, "">;
+type AccordionRoot = ReturnType<typeof AccordionRoot>;
+export default AccordionRoot;
+//# sourceMappingURL=AccordionRoot.svelte.d.ts.map

package/dist/components/Accordion/AccordionRoot.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionRoot.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Accordion/AccordionRoot.svelte.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AACjD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAGpD;;;;;GAKG;AACH,UAAU,KAAM,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IACnE,IAAI,CAAC,EAAE,QAAQ,GAAG,UAAU,CAAC;IAC7B,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IAC1B,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,KAAK,IAAI,CAAC;IACnD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAoBH,QAAA,MAAM,aAAa,0BAAwC,CAAC;AAC5D,KAAK,aAAa,GAAG,UAAU,CAAC,OAAO,aAAa,CAAC,CAAC;AACtD,eAAe,aAAa,CAAC"}

package/dist/components/Accordion/AccordionTrigger.svelte

@@ -0,0 +1,71 @@
+<script lang="ts">
+  import { Accordion } from 'bits-ui';
+  import type { ComponentProps, Snippet } from 'svelte';
+
+  type BitsTriggerProps = ComponentProps<typeof Accordion.Trigger>;
+
+  interface Props extends Omit<BitsTriggerProps, 'class' | 'children'> {
+    class?: string;
+    children?: Snippet;
+  }
+
+  let { class: cls, children, ...rest }: Props = $props();
+
+  const className = $derived(['sve-accordion__trigger', cls].filter(Boolean).join(' '));
+</script>
+
+<Accordion.Trigger class={className} data-slot="accordion-trigger" {...rest}>
+  <span class="sve-accordion__label">{@render children?.()}</span>
+  <svg class="sve-accordion__chevron" 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" />
+  </svg>
+</Accordion.Trigger>
+
+<style>
+  :global(.sve-accordion__trigger) {
+    display: flex;
+    width: 100%;
+    align-items: center;
+    justify-content: space-between;
+    gap: var(--sve-space-2);
+    padding: var(--sve-space-4) 0;
+    border: none;
+    background-color: transparent;
+    color: var(--sve-color-default-foreground);
+    font-family: var(--sve-font-family-sans);
+    font-size: var(--sve-font-size-md);
+    font-weight: var(--sve-font-weight-medium);
+    text-align: left;
+    cursor: pointer;
+  }
+
+  :global(.sve-accordion__trigger:focus-visible) {
+    outline: 2px solid var(--sve-color-primary);
+    outline-offset: 2px;
+    border-radius: var(--sve-radius-sm);
+  }
+
+  :global(.sve-accordion__trigger:disabled) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  :global(.sve-accordion__chevron) {
+    width: 1.25rem;
+    height: 1.25rem;
+    flex-shrink: 0;
+    color: var(--sve-color-default-foreground);
+    opacity: 0.6;
+    transition: transform 0.2s ease;
+  }
+
+  :global(.sve-accordion__trigger[data-state='open'] .sve-accordion__chevron) {
+    transform: rotate(180deg);
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    :global(.sve-accordion__chevron) {
+      transition: none;
+    }
+  }
+</style>

package/dist/components/Accordion/AccordionTrigger.svelte.d.ts

@@ -0,0 +1,11 @@
+import { Accordion } from 'bits-ui';
+import type { ComponentProps, Snippet } from 'svelte';
+type BitsTriggerProps = ComponentProps<typeof Accordion.Trigger>;
+interface Props extends Omit<BitsTriggerProps, 'class' | 'children'> {
+    class?: string;
+    children?: Snippet;
+}
+declare const AccordionTrigger: import("svelte").Component<Props, {}, "">;
+type AccordionTrigger = ReturnType<typeof AccordionTrigger>;
+export default AccordionTrigger;
+//# sourceMappingURL=AccordionTrigger.svelte.d.ts.map

package/dist/components/Accordion/AccordionTrigger.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionTrigger.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Accordion/AccordionTrigger.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AACpC,OAAO,KAAK,EAAE,cAAc,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AAGpD,KAAK,gBAAgB,GAAG,cAAc,CAAC,OAAO,SAAS,CAAC,OAAO,CAAC,CAAC;AAEjE,UAAU,KAAM,SAAQ,IAAI,CAAC,gBAAgB,EAAE,OAAO,GAAG,UAAU,CAAC;IAClE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAuBH,QAAA,MAAM,gBAAgB,2CAAwC,CAAC;AAC/D,KAAK,gBAAgB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAC5D,eAAe,gBAAgB,CAAC"}

package/dist/components/Accordion/index.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Accordion namespace — sve-ui styled wrappers over bits-ui Accordion.
+ *
+ * Root: container; requires `type` ("single" | "multiple"); `bind:value` tracks
+ * the open item(s) (Bits owns ARIA, keyboard, and open/close state).
+ * Item / Header / Trigger / Content: styled parts. Trigger includes a chevron
+ * that rotates on open; compose Trigger inside Header.
+ */
+export { default as Root } from './AccordionRoot.svelte';
+export { default as Item } from './AccordionItem.svelte';
+export { default as Header } from './AccordionHeader.svelte';
+export { default as Trigger } from './AccordionTrigger.svelte';
+export { default as Content } from './AccordionContent.svelte';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Accordion/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Accordion/index.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,wBAAwB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,wBAAwB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,2BAA2B,CAAC;AAC/D,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,2BAA2B,CAAC"}

package/dist/components/Accordion/index.js

@@ -0,0 +1,13 @@
+/**
+ * Accordion namespace — sve-ui styled wrappers over bits-ui Accordion.
+ *
+ * Root: container; requires `type` ("single" | "multiple"); `bind:value` tracks
+ * the open item(s) (Bits owns ARIA, keyboard, and open/close state).
+ * Item / Header / Trigger / Content: styled parts. Trigger includes a chevron
+ * that rotates on open; compose Trigger inside Header.
+ */
+export { default as Root } from './AccordionRoot.svelte';
+export { default as Item } from './AccordionItem.svelte';
+export { default as Header } from './AccordionHeader.svelte';
+export { default as Trigger } from './AccordionTrigger.svelte';
+export { default as Content } from './AccordionContent.svelte';

package/dist/components/Checkbox/CheckboxRoot.svelte

@@ -0,0 +1,95 @@
+<script module lang="ts">
+  export type Size = 'sm' | 'md' | 'lg';
+</script>
+
+<script lang="ts">
+  import { Checkbox } from 'bits-ui';
+  import type { ComponentProps } from 'svelte';
+
+  type BitsRootProps = ComponentProps<typeof Checkbox.Root>;
+
+  interface Props extends Omit<BitsRootProps, 'class' | 'children'> {
+    size?: Size;
+    class?: string;
+  }
+
+  let {
+    size = 'md',
+    checked = $bindable(false),
+    indeterminate = $bindable(false),
+    class: cls,
+    ...rest
+  }: Props = $props();
+
+  const className = $derived(
+    ['sve-checkbox', `sve-checkbox--${size}`, cls].filter(Boolean).join(' ')
+  );
+</script>
+
+<Checkbox.Root
+  bind:checked
+  bind:indeterminate
+  class={className}
+  data-slot="checkbox"
+  {...rest}
+>
+  {#snippet children({ checked, indeterminate })}
+    {#if indeterminate}
+      <svg class="sve-checkbox__icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3.2" stroke-linecap="round" aria-hidden="true">
+        <path d="M5 12h14" />
+      </svg>
+    {:else if checked}
+      <svg class="sve-checkbox__icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+        <path d="M20 6 9 17l-5-5" />
+      </svg>
+    {/if}
+  {/snippet}
+</Checkbox.Root>
+
+<style>
+  :global(.sve-checkbox) {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    flex-shrink: 0;
+    padding: 0;
+    border: 1px solid var(--sve-color-default-border);
+    border-radius: var(--sve-radius-sm);
+    background-color: transparent;
+    color: var(--sve-color-primary-foreground);
+    cursor: pointer;
+    transition: background-color 0.15s ease, border-color 0.15s ease;
+  }
+
+  :global(.sve-checkbox[data-state='checked']),
+  :global(.sve-checkbox[data-state='indeterminate']) {
+    background-color: var(--sve-color-primary);
+    border-color: var(--sve-color-primary);
+  }
+
+  :global(.sve-checkbox:focus-visible) {
+    outline: 2px solid var(--sve-color-primary);
+    outline-offset: 2px;
+  }
+
+  :global(.sve-checkbox:disabled) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  :global(.sve-checkbox__icon) {
+    width: 80%;
+    height: 80%;
+  }
+
+  /* --- Sizes --- */
+  :global(.sve-checkbox--sm) { width: 1rem; height: 1rem; }
+  :global(.sve-checkbox--md) { width: 1.25rem; height: 1.25rem; }
+  :global(.sve-checkbox--lg) { width: 1.5rem; height: 1.5rem; }
+
+  @media (prefers-reduced-motion: reduce) {
+    :global(.sve-checkbox) {
+      transition: none;
+    }
+  }
+</style>

package/dist/components/Checkbox/CheckboxRoot.svelte.d.ts

@@ -0,0 +1,12 @@
+export type Size = 'sm' | 'md' | 'lg';
+import { Checkbox } from 'bits-ui';
+import type { ComponentProps } from 'svelte';
+type BitsRootProps = ComponentProps<typeof Checkbox.Root>;
+interface Props extends Omit<BitsRootProps, 'class' | 'children'> {
+    size?: Size;
+    class?: string;
+}
+declare const CheckboxRoot: import("svelte").Component<Props, {}, "checked" | "indeterminate">;
+type CheckboxRoot = ReturnType<typeof CheckboxRoot>;
+export default CheckboxRoot;
+//# sourceMappingURL=CheckboxRoot.svelte.d.ts.map

package/dist/components/Checkbox/CheckboxRoot.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckboxRoot.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Checkbox/CheckboxRoot.svelte.ts"],"names":[],"mappings":"AAGE,MAAM,MAAM,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAGxC,OAAO,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AACnC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,QAAQ,CAAC;AAG3C,KAAK,aAAa,GAAG,cAAc,CAAC,OAAO,QAAQ,CAAC,IAAI,CAAC,CAAC;AAE1D,UAAU,KAAM,SAAQ,IAAI,CAAC,aAAa,EAAE,OAAO,GAAG,UAAU,CAAC;IAC/D,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAwCH,QAAA,MAAM,YAAY,oEAAwC,CAAC;AAC3D,KAAK,YAAY,GAAG,UAAU,CAAC,OAAO,YAAY,CAAC,CAAC;AACpD,eAAe,YAAY,CAAC"}

package/dist/components/Checkbox/index.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Checkbox namespace — sve-ui styled wrapper over the bits-ui Checkbox primitive.
+ *
+ * Root: styled box + check/indeterminate indicator (Bits owns ARIA
+ * role="checkbox", keyboard, and state). `bind:checked` and `bind:indeterminate`
+ * are forwarded to the Bits root.
+ */
+export { default as Root, type Size as CheckboxSize } from './CheckboxRoot.svelte';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Checkbox/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Checkbox/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,KAAK,IAAI,IAAI,YAAY,EAAE,MAAM,uBAAuB,CAAC"}

package/dist/components/Checkbox/index.js

@@ -0,0 +1,8 @@
+/**
+ * Checkbox namespace — sve-ui styled wrapper over the bits-ui Checkbox primitive.
+ *
+ * Root: styled box + check/indeterminate indicator (Bits owns ARIA
+ * role="checkbox", keyboard, and state). `bind:checked` and `bind:indeterminate`
+ * are forwarded to the Bits root.
+ */
+export { default as Root } from './CheckboxRoot.svelte';

package/dist/components/Code/Code.svelte

@@ -0,0 +1,130 @@
+<script lang="ts">
+  import { onDestroy } from 'svelte';
+  import type { HTMLAttributes } from 'svelte/elements';
+
+  interface Props extends Omit<HTMLAttributes<HTMLDivElement>, 'class'> {
+    /** The code to display (and copy). Kept as a string so copy is SSR-safe — no DOM scraping. */
+    code: string;
+    /** Optional header label, e.g. a filename or language. */
+    label?: string;
+    /** Show the copy-to-clipboard button. */
+    copyable?: boolean;
+    class?: string;
+  }
+
+  let { code, label, copyable = true, class: cls, ...rest }: Props = $props();
+
+  const className = $derived(['sve-code', cls].filter(Boolean).join(' '));
+
+  let copied = $state(false);
+  let resetTimer: ReturnType<typeof setTimeout> | undefined;
+
+  async function copy() {
+    // SSR-safe: only touched on click, and guarded for environments without the API.
+    if (typeof navigator === 'undefined' || !navigator.clipboard) return;
+    try {
+      await navigator.clipboard.writeText(code);
+      copied = true;
+      clearTimeout(resetTimer);
+      resetTimer = setTimeout(() => (copied = false), 1500);
+    } catch {
+      // Clipboard denied/unavailable — silently no-op.
+    }
+  }
+
+  onDestroy(() => clearTimeout(resetTimer));
+</script>
+
+<div class={className} {...rest}>
+  {#if label || copyable}
+    <div class="sve-code__bar">
+      {#if label}<span class="sve-code__label">{label}</span>{/if}
+      {#if copyable}
+        <button
+          type="button"
+          class="sve-code__copy"
+          onclick={copy}
+          aria-label={copied ? 'Copied' : 'Copy code'}
+        >
+          {#if copied}
+            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 6 9 17l-5-5" /></svg>
+          {:else}
+            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="9" y="9" width="11" height="11" rx="2" /><path d="M5 15V5a2 2 0 0 1 2-2h10" /></svg>
+          {/if}
+        </button>
+      {/if}
+    </div>
+  {/if}
+  <pre class="sve-code__pre"><code>{code}</code></pre>
+</div>
+
+<style>
+  .sve-code {
+    position: relative;
+    border: 1px solid var(--sve-color-default-border);
+    border-radius: var(--sve-radius-md);
+    background-color: var(--sve-color-default-surface);
+    overflow: hidden;
+    font-family: var(--sve-font-family-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace);
+  }
+
+  .sve-code__bar {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: var(--sve-space-2);
+    min-height: 2.25rem;
+    padding: 0 var(--sve-space-2) 0 var(--sve-space-3);
+    border-bottom: 1px solid var(--sve-color-default-border);
+  }
+
+  .sve-code__label {
+    font-size: var(--sve-font-size-xs);
+    font-weight: var(--sve-font-weight-medium);
+    color: var(--sve-color-default-foreground);
+    opacity: 0.7;
+  }
+
+  .sve-code__copy {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    margin-left: auto;
+    width: 1.75rem;
+    height: 1.75rem;
+    padding: 0;
+    border: none;
+    border-radius: var(--sve-radius-sm);
+    background-color: transparent;
+    color: var(--sve-color-default-foreground);
+    cursor: pointer;
+    transition: background-color 0.15s ease, color 0.15s ease;
+  }
+
+  .sve-code__copy:hover {
+    background-color: var(--sve-color-default);
+  }
+
+  .sve-code__copy:focus-visible {
+    outline: 2px solid var(--sve-color-primary);
+    outline-offset: 2px;
+  }
+
+  .sve-code__copy svg {
+    width: 1rem;
+    height: 1rem;
+  }
+
+  .sve-code__pre {
+    margin: 0;
+    padding: var(--sve-space-4);
+    overflow-x: auto;
+    font-size: var(--sve-font-size-sm);
+    line-height: var(--sve-line-height-relaxed);
+    color: var(--sve-color-default-foreground);
+  }
+
+  .sve-code__pre code {
+    font-family: inherit;
+  }
+</style>

package/dist/components/Code/Code.svelte.d.ts

@@ -0,0 +1,14 @@
+import type { HTMLAttributes } from 'svelte/elements';
+interface Props extends Omit<HTMLAttributes<HTMLDivElement>, 'class'> {
+    /** The code to display (and copy). Kept as a string so copy is SSR-safe — no DOM scraping. */
+    code: string;
+    /** Optional header label, e.g. a filename or language. */
+    label?: string;
+    /** Show the copy-to-clipboard button. */
+    copyable?: boolean;
+    class?: string;
+}
+declare const Code: import("svelte").Component<Props, {}, "">;
+type Code = ReturnType<typeof Code>;
+export default Code;
+//# sourceMappingURL=Code.svelte.d.ts.map

package/dist/components/Code/Code.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Code.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Code/Code.svelte.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAGpD,UAAU,KAAM,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IACnE,8FAA8F;IAC9F,IAAI,EAAE,MAAM,CAAC;IACb,0DAA0D;IAC1D,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,yCAAyC;IACzC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAmDH,QAAA,MAAM,IAAI,2CAAwC,CAAC;AACnD,KAAK,IAAI,GAAG,UAAU,CAAC,OAAO,IAAI,CAAC,CAAC;AACpC,eAAe,IAAI,CAAC"}

package/dist/components/Combobox/ComboboxContent.svelte

@@ -0,0 +1,33 @@
+<script lang="ts">
+  import { Combobox } from 'bits-ui';
+  import type { ComponentProps } from 'svelte';
+
+  type BitsContentProps = ComponentProps<typeof Combobox.Content>;
+
+  interface Props extends Omit<BitsContentProps, 'class'> {
+    class?: string;
+  }
+
+  let { class: cls, ...rest }: Props = $props();
+
+  const className = $derived(['sve-combobox__content', cls].filter(Boolean).join(' '));
+</script>
+
+<Combobox.Portal>
+  <Combobox.Content class={className} data-slot="combobox-content" {...rest} />
+</Combobox.Portal>
+
+<style>
+  :global(.sve-combobox__content) {
+    z-index: 60;
+    min-width: var(--bits-combobox-anchor-width, 12rem);
+    max-height: 18rem;
+    overflow-y: auto;
+    padding: var(--sve-space-1);
+    border: 1px solid var(--sve-color-default-border);
+    border-radius: var(--sve-radius-md);
+    background-color: var(--sve-color-default-surface);
+    box-shadow: var(--sve-shadow-md);
+    font-family: var(--sve-font-family-sans);
+  }
+</style>