@svelte-atoms/core 1.0.0-alpha.41 → 1.0.0-alpha.44

package/dist/components/alert/types.d.ts

@@ -1,61 +1,27 @@
 import type { Snippet } from 'svelte';
-import type { HtmlAtomProps, Base } from '../atom';
+import type { HtmlAtomProps, Base, SnippetProps } from '../atom';
 import type { Factory } from '../../types';
 import type { AlertBond } from './bond.svelte';
-/**
- * Extend this interface to add custom alert root properties in your application.
- */
-export interface AlertRootExtendProps {
-}
-/**
- * Extend this interface to add custom alert content properties in your application.
- */
-export interface AlertContentExtendProps {
-}
-/**
- * Extend this interface to add custom alert title properties in your application.
- */
-export interface AlertTitleExtendProps {
-}
-/**
- * Extend this interface to add custom alert description properties in your application.
- */
-export interface AlertDescriptionExtendProps {
-}
-/**
- * Extend this interface to add custom alert icon properties in your application.
- */
-export interface AlertIconExtendProps {
-}
-/**
- * Extend this interface to add custom alert actions properties in your application.
- */
-export interface AlertActionsExtendProps {
-}
-/**
- * Extend this interface to add custom alert close button properties in your application.
- */
-export interface AlertCloseButtonExtendProps {
-}
-export interface AlertRootProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> extends HtmlAtomProps<E, B>, AlertRootExtendProps {
+export interface AlertSnippetProps extends SnippetProps {
+    alert: AlertBond;
+}
+export type AlertChildren = Snippet<[AlertSnippetProps]>;
+export interface AlertRootProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> extends HtmlAtomProps<E, B, AlertChildren> {
     dismissible?: boolean;
     dismissed?: boolean;
     disabled?: boolean;
     extend?: Record<string, unknown>;
     factory?: Factory<AlertBond>;
-    children?: Snippet<[{
-        alert: AlertBond;
-    }]>;
 }
-export interface AlertContentProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> extends HtmlAtomProps<E, B>, AlertContentExtendProps {
+export interface AlertContentProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> extends HtmlAtomProps<E, B, AlertChildren> {
 }
-export interface AlertTitleProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> extends HtmlAtomProps<E, B>, AlertTitleExtendProps {
+export interface AlertTitleProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> extends HtmlAtomProps<E, B, AlertChildren> {
 }
-export interface AlertDescriptionProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> extends HtmlAtomProps<E, B>, AlertDescriptionExtendProps {
+export interface AlertDescriptionProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> extends HtmlAtomProps<E, B, AlertChildren> {
 }
-export interface AlertIconProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> extends HtmlAtomProps<E, B>, AlertIconExtendProps {
+export interface AlertIconProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> extends HtmlAtomProps<E, B, AlertChildren> {
 }
-export interface AlertActionsProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> extends HtmlAtomProps<E, B>, AlertActionsExtendProps {
+export interface AlertActionsProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> extends HtmlAtomProps<E, B, AlertChildren> {
 }
-export interface AlertCloseButtonProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> extends HtmlAtomProps<E, B>, AlertCloseButtonExtendProps {
+export interface AlertCloseButtonProps<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base> extends HtmlAtomProps<E, B, AlertChildren> {
 }

package/dist/components/atom/html-atom.svelte

@@ -1,95 +1,84 @@
-<script lang="ts" generics="E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base">
-	import type { HTMLAttributes } from 'svelte/elements';
-	import type { Base, HtmlAtomProps, SnippetBase } from './types';
-	import { RootBond } from '../root';
-	import { HtmlElement } from '../element';
-	import { getPreset } from '../../context';
-	import type { PresetModuleName } from '../../context/preset.svelte';
-	import SnippetRenderer from './snippet-renderer.svelte';
-	import type { Component } from 'svelte';
-	import type { ClassValue } from '../../utils';
-	import {
-		resolvePreset,
-		resolveLocalVariants,
-		mergeVariants,
-		mergeClassesWithPreset,
-		extractRestProps,
-		isSnippetBase
-	} from './utils';
-
-	type Element = HTMLElementTagNameMap[E];
-
-	type Props =  Omit<HTMLAttributes<Element>, 'children'> & HtmlAtomProps<E, B>;
-
-	const rootBond = RootBond.get();
-
-	let {
-		class: klass = '',
-		as = 'div',
-		base = undefined,
-		preset: presetKey = undefined,
-		bond = undefined,
-		variants = undefined,
-		children: childrenProp = undefined,
-		...restProps
-	}: Props = $props();
-
-	// Memoize preset resolution - only recompute when presetKey or bond changes
-	const preset = $derived.by(() => {
-		if (!presetKey) return undefined;
-		const result = getPreset(presetKey as PresetModuleName)?.apply?.(bond, [bond]);
-		return resolvePreset(result);
-	});
-
-	const presetVariantsProps = $derived(preset?.variants);
-
-	// Resolve local variants - either VariantDefinition or function
-	const localVariants = $derived(resolveLocalVariants(variants, bond, restProps));
-
-	// Merge preset variants with local variants
-	// Memoized to avoid recomputation when inputs haven't changed
-	const mergedVariants = $derived.by(() => {
-		return mergeVariants(
-			presetVariantsProps,
-			preset?.class,
-			preset?.compounds,
-			preset?.defaults,
-			localVariants,
-			bond,
-			restProps
-		);
-	});
-
-	const _klass = $derived(
-		mergeClassesWithPreset(klass, preset?.class, mergedVariants?.class as ClassValue)
-	);
-
-	const _base = $derived(base ?? preset?.base);
-	const _as = $derived(as ?? preset?.as);
-	const _restProps = $derived(extractRestProps(preset, mergedVariants, restProps));
-
-	const isSnippet = $derived(isSnippetBase(_base));
-
-	const snippet = $derived(_base as SnippetBase);
-
-	const atom = rootBond?.state?.props?.renderers?.html ?? HtmlElement;
-
-	const renderer = $derived.by(() => {
-		if (isSnippet)
-			return {
-				component: SnippetRenderer,
-				props: { snippet: snippet, class: _klass, as: _as, children: childrenProp, ..._restProps }
-			};
-
-		return {
-			component: _base ?? atom,
-			props: { class: _klass, as: _as, ..._restProps }
-		};
-	}) as { component: Component; props: Record<string, any> };
-</script>
-
-<renderer.component {...renderer.props}>
-	{#snippet children(args: any)}
-		{@render (childrenProp as any)?.(args)}
-	{/snippet}
-</renderer.component>
+<script lang="ts" generics="E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base">
+	import type { Base, HtmlAtomProps } from './types';
+	import { RootBond } from '../root';
+	import { HtmlElement } from '../element';
+	import { getPreset } from '../../context';
+	import type { PresetModuleName } from '../../context/preset.svelte';
+	import SnippetRenderer from './snippet-renderer.svelte';
+	import type { Component } from 'svelte';
+	import type { ClassValue } from '../../utils';
+	import {
+		resolvePreset,
+		resolveLocalVariants,
+		mergeVariants,
+		mergeClassesWithPreset,
+		extractRestProps,
+		isSnippetBase
+	} from './utils';
+
+	const rootBond = RootBond.get();
+
+	let {
+		class: klass = '',
+		as = 'div',
+		base = undefined,
+		preset: presetKey = undefined,
+		bond = undefined,
+		variants = undefined,
+		children: childrenProp = undefined,
+		...restProps
+	}: HtmlAtomProps<E, B> = $props();
+
+	// Memoize preset resolution - only recompute when presetKey or bond changes
+	const preset = $derived.by(() => {
+		if (!presetKey) return undefined;
+		const result = getPreset(presetKey as PresetModuleName)?.(bond);
+		return resolvePreset(result);
+	});
+
+	// Resolve local variants - either VariantDefinition or function
+	const localVariants = $derived(resolveLocalVariants(variants, bond, restProps));
+
+	// Merge preset variants with local variants
+	// Memoized to avoid recomputation when inputs haven't changed
+	const mergedVariants = $derived.by(() => {
+		return mergeVariants(
+			preset?.variants,
+			preset?.class,
+			preset?.compounds,
+			preset?.defaults,
+			localVariants,
+			bond,
+			restProps
+		);
+	});
+
+	const finalKlass = $derived(
+		mergeClassesWithPreset(klass, preset?.class, mergedVariants?.class as ClassValue)
+	);
+
+	const finalBase = $derived(base ?? preset?.base);
+	const finalAs = $derived(as ?? preset?.as);
+	const finalRestProps = $derived(extractRestProps(preset, mergedVariants, restProps));
+
+	const atom = $derived(rootBond?.state?.props?.renderers?.html ?? HtmlElement);
+
+	const renderer = $derived.by(() => {
+		if (isSnippetBase(finalBase))
+			return {
+				component: SnippetRenderer,
+				props: { snippet: finalBase, class: finalKlass, as: finalAs, children: childrenProp, ...finalRestProps }
+			};
+
+		return {
+			component: finalBase ?? atom,
+			props: { class: finalKlass, as: finalAs, ...finalRestProps }
+		};
+	}) as { component: Component; props: Record<string, any> };
+</script>
+
+<renderer.component {...renderer.props}>
+	{#snippet children(args: any)}
+		{@render (childrenProp as any)?.(args)}
+	{/snippet}
+</renderer.component>

package/dist/components/atom/html-atom.svelte.d.ts

@@ -1,7 +1,6 @@
-import type { HTMLAttributes } from 'svelte/elements';
 import type { Base, HtmlAtomProps } from './types';
 declare function $$render<E extends keyof HTMLElementTagNameMap = 'div', B extends Base = Base>(): {
-    props: Omit<HTMLAttributes<HTMLElementTagNameMap[E]>, "children"> & HtmlAtomProps<E, B>;
+    props: HtmlAtomProps<E, B>;
     exports: {};
     bindings: "";
     slots: {};

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

@@ -1,3 +1,4 @@
 export { default as HtmlAtom } from './html-atom.svelte';
 export * as Atom from './atoms';
 export * from './types';
+export { resolvePreset } from './utils';

package/dist/components/atom/index.js

@@ -1,3 +1,4 @@
 export { default as HtmlAtom } from './html-atom.svelte';
 export * as Atom from './atoms';
 export * from './types';
+export { resolvePreset } from './utils';

package/dist/components/atom/types.d.ts

@@ -1,26 +1,68 @@
 import type { Component, Snippet } from 'svelte';
-import { type HtmlElementTagName } from '../element';
+import type { HtmlElementTagName } from '../element';
 import type { HtmlElementProps, ElementType } from '../element/types';
 import type { PresetModuleName } from '../../context/preset.svelte';
 import type { Bond } from '../../shared';
 import type { VariantDefinition } from '../../utils';
+/** Base type for component-based implementations */
 export type ComponentBase = Component;
+/** Base type for snippet-based implementations */
 export type SnippetBase = Snippet;
-export type Base<Args = any> = Args extends Record<string, any> ? ComponentBase : Args extends unknown[] ? SnippetBase : never;
 /**
- * Extend this interface to add custom HTML atom properties in your application.
+ * Generic base type that can be either a Component or Snippet
+ * - Allows components to work with both rendering patterns
+ * - Provides type safety for generic component props
  */
-export interface HtmlAtomExtendProps {
+export type Base<Args extends unknown[] = unknown[]> = Args extends [
+    infer First extends Record<string, any>,
+    ...unknown[]
+] ? ComponentBase : Args extends [] ? SnippetBase | ComponentBase : Args extends unknown[] ? SnippetBase : never;
+/**
+ * Base interface for snippet context props.
+ * Extend this to type the snippet argument in your component.
+ */
+export interface SnippetProps {
 }
-type Variants = VariantDefinition<any> | ((bond: Bond, variantProps: Record<string, any>) => Record<string, any>);
-export interface HtmlAtomProps<E extends HtmlElementTagName = HtmlElementTagName, B extends Base<any> = Base> extends HtmlElementProps<E>, HtmlAtomExtendProps {
-    bond?: Bond;
+/** Variant configuration - can be static or dynamic */
+export type Variants = VariantDefinition<any> | ((bond: Bond, variantProps: Record<string, any>) => Record<string, any>);
+/**
+ * Base props for HTML atom components
+ *
+ * Extensibility pattern:
+ * ```ts
+ * // In component type file:
+ * interface CustomSnippetProps extends SnippetProps {
+ *   value: string;
+ *   onChange: (value: string) => void;
+ * }
+ *
+ * interface CustomAtomProps extends HtmlAtomProps<'input'> {
+ *   children?: Snippet<[CustomSnippetProps]>;
+ * }
+ * ```
+ */
+export interface HtmlAtomProps<E extends HtmlElementTagName = HtmlElementTagName, B extends Base<any> = Base, Children extends Snippet<unknown[]> = Snippet> extends HtmlElementProps<E, Children> {
+    /** Optional Bond for state management & context */
+    bond?: Bond | undefined;
+    /** Base component or snippet to render (can be overridden) */
     base?: B | undefined;
+    /** Preset configuration module */
     preset?: PresetModuleName | (string & {});
     /**
-     * Variant definition or function to resolve variants
-     * - VariantDefinition: Static variant config with base, variants, compoundVariants, defaultVariants
-     * - Function: Dynamic function that receives bond and props, returns props (legacy)
+     * Variant definition or function to resolve variants dynamically
+     *
+     * Supports two patterns:
+     * 1. Static: `VariantDefinition` - static config with variants, defaultVariants, etc.
+     * 2. Dynamic: `Function` - receives bond and props, returns resolved props
+     *
+     * Example:
+     * ```ts
+     * variants: cva('button', {
+     *   variants: {
+     *     size: { sm: 'px-2 py-1', lg: 'px-4 py-2' }
+     *   }
+     * })
+     * ```
      */
     variants?: Variants;
 }

package/dist/components/atom/types.js

@@ -1 +1 @@
-import {} from '../element';
+export {};

package/dist/components/atom/utils.d.ts

@@ -22,8 +22,13 @@ export declare function mergeVariants(presetVariants: Record<string, any> | unde
  */
 export declare function mergeClassesWithPreset(userClass: string | ClassValue | undefined, presetClass: ClassValue | undefined, variantClass: ClassValue | undefined): string;
 /**
- * Pure function to resolve local variants
- * Handles both function-based and VariantDefinition-based variants
+ * Pure function to resolve local variants.
+ * Handles both function-based and VariantDefinition-based variants.
+ *
+ * If the function was created by `defineVariants`, it carries a VARIANT_DEF_TAG
+ * symbol with the original config. We detect this and route through the cached
+ * resolveVariants engine so defineVariants-based variants benefit from the same
+ * two-level WeakMap cache as raw VariantDefinition objects.
  */
 export declare function resolveLocalVariants(variants: any, bond: Bond | null | undefined, props: Record<string, unknown>): ResolvedProps | undefined;
 /**
@@ -31,7 +36,9 @@ export declare function resolveLocalVariants(variants: any, bond: Bond | null |
  */
 export declare function extractRestProps(preset: Record<string, any> | undefined, mergedVariants: ResolvedProps | undefined, restProps: Record<string, unknown>): Record<string, unknown>;
 /**
- * Pure function to check if a base is a snippet
+ * Pure function to check if a base is a snippet.
+ * Svelte 5 snippets compile to arrow functions (no prototype),
+ * while components compile to named functions (with prototype).
  */
 export declare function isSnippetBase(base: unknown): boolean;
 export {};

package/dist/components/atom/utils.js

@@ -1,14 +1,32 @@
-import { cn } from '../../utils';
+import { cn, VARIANT_DEF_TAG } from '../../utils';
 import { call } from '../../utils/function';
 /**
- * Cache for resolved variants to avoid recomputation
- * Key: JSON stringified combination of variant props
- */
-const variantCache = new Map();
-/**
- * Maximum cache size to prevent memory leaks
+ * Two-level cache for resolved variants.
+ * Outer key: bond instance identity (WeakMap for automatic GC when bond is destroyed).
+ * Inner key: JSON stringified variant-relevant props.
+ * Bond-less calls share a single flat Map.
  */
+const variantCacheByBond = new WeakMap();
+const variantCacheNoBond = new Map();
 const MAX_CACHE_SIZE = 100;
+function getCacheMap(bond) {
+    if (!bond)
+        return variantCacheNoBond;
+    let map = variantCacheByBond.get(bond);
+    if (!map) {
+        map = new Map();
+        variantCacheByBond.set(bond, map);
+    }
+    return map;
+}
+function hasOwnKeys(obj) {
+    for (const k in obj)
+        if (Object.hasOwn(obj, k))
+            return true;
+    return false;
+}
+const PRESET_SKIP = new Set(['class', 'base', 'as', 'variants', 'compounds', 'defaults']);
+const VARIANTS_SKIP = new Set(['class', 'variants', 'compounds', 'defaults']);
 /**
  * Resolves preset to its final value, handling both direct values and factory functions
  */
@@ -27,14 +45,21 @@ export function resolvePreset(preset) {
 export function resolveVariants(def, bond, props) {
     const { variants: variantMap, compounds, defaults, class: baseClass } = def;
     // Merge props with defaults
-    const finalProps = { ...defaults, ...props };
-    // Create cache key from final props (only variant-related props)
+    const finalProps = defaults && hasOwnKeys(defaults) ? { ...defaults, ...props } : props;
     const variantKeys = variantMap ? Object.keys(variantMap) : [];
-    const relevantProps = Object.fromEntries(Object.entries(finalProps).filter(([key]) => variantKeys.includes(key)));
+    // Fast path: no variants or compounds — skip cache entirely
+    if (variantKeys.length === 0 && !compounds?.length) {
+        return { class: baseClass ? [baseClass] : [] };
+    }
+    // Build cache key only when variants are present
+    const relevantProps = {};
+    for (const key of variantKeys)
+        if (key in finalProps)
+            relevantProps[key] = finalProps[key];
     const cacheKey = JSON.stringify({ relevantProps, baseClass, compounds });
-    // Check cache
-    if (variantCache.has(cacheKey)) {
-        return variantCache.get(cacheKey);
+    const cacheMap = getCacheMap(bond);
+    if (cacheMap.has(cacheKey)) {
+        return cacheMap.get(cacheKey);
     }
     const classes = [];
     const attributes = {};
@@ -43,7 +68,10 @@ export function resolveVariants(def, bond, props) {
         classes.push(baseClass);
     // Add variant classes
     if (variantMap) {
-        for (const [key, value] of Object.entries(finalProps)) {
+        for (const key of variantKeys) {
+            const value = finalProps[key];
+            if (value === undefined)
+                continue;
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
             const variantValue = variantMap[key]?.[value];
             if (variantValue !== undefined) {
@@ -64,19 +92,25 @@ export function resolveVariants(def, bond, props) {
         }
     }
     // Add compound variants
-    if (compounds) {
+    if (compounds?.length) {
         for (const compound of compounds) {
-            const { class: compoundClass, ...compoundProps } = compound;
-            const matches = Object.entries(compoundProps).every(([key, value]) => finalProps[key] === value);
+            const compoundClass = compound.class;
+            const compoundPropKeys = new Set(Object.keys(compound).filter((k) => k !== 'class'));
+            let matches = true;
+            for (const key of compoundPropKeys) {
+                if (finalProps[key] !== compound[key]) {
+                    matches = false;
+                    break;
+                }
+            }
             if (matches) {
                 if (compoundClass)
                     classes.push(compoundClass);
-                // Add compound attributes
-                Object.entries(compound).forEach(([k, v]) => {
-                    if (k !== 'class' && !Object.keys(compoundProps).includes(k)) {
+                // Add compound attributes (string keys that are not condition keys or 'class')
+                for (const [k, v] of Object.entries(compound)) {
+                    if (k !== 'class' && !compoundPropKeys.has(k))
                         attributes[k] = v;
-                    }
-                });
+                }
             }
         }
     }
@@ -84,14 +118,13 @@ export function resolveVariants(def, bond, props) {
         class: classes,
         ...attributes
     };
-    // Store in cache (limit cache size to prevent memory leaks)
-    if (variantCache.size >= MAX_CACHE_SIZE) {
-        // Clear oldest entry (first in Map)
-        const firstKey = variantCache.keys().next().value;
+    // Store in cache (limit per-bond cache size to prevent memory leaks)
+    if (cacheMap.size >= MAX_CACHE_SIZE) {
+        const firstKey = cacheMap.keys().next().value;
         if (firstKey)
-            variantCache.delete(firstKey);
+            cacheMap.delete(firstKey);
     }
-    variantCache.set(cacheKey, result);
+    cacheMap.set(cacheKey, result);
     return result;
 }
 /**
@@ -141,9 +174,9 @@ presetDefaults, localVariants, bond, props) {
         ? localVariants.class
         : [localVariants?.class];
     return {
-        class: [...presetClasses, ...localClasses].filter(Boolean),
         ...presetResolved,
-        ...localVariants
+        ...localVariants,
+        class: [...presetClasses, ...localClasses].filter(Boolean)
     };
 }
 /**
@@ -167,42 +200,76 @@ export function mergeClassesWithPreset(userClass, presetClass, variantClass) {
     return cn(beforeLastPlaceholder, presetClassString, variantClass ?? '', afterLastPlaceholder);
 }
 /**
- * Pure function to resolve local variants
- * Handles both function-based and VariantDefinition-based variants
+ * Pure function to resolve local variants.
+ * Handles both function-based and VariantDefinition-based variants.
+ *
+ * If the function was created by `defineVariants`, it carries a VARIANT_DEF_TAG
+ * symbol with the original config. We detect this and route through the cached
+ * resolveVariants engine so defineVariants-based variants benefit from the same
+ * two-level WeakMap cache as raw VariantDefinition objects.
  */
 export function resolveLocalVariants(
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 variants, bond, props) {
     if (!variants)
         return undefined;
-    // If it's a function, call it directly
+    // Detect functions tagged by defineVariants — route through the cache
+    if (typeof variants === 'function' && VARIANT_DEF_TAG in variants) {
+        const config = variants[VARIANT_DEF_TAG];
+        // If config is a function (dynamic/bond-based), resolve it to a VariantDefinition first
+        const resolvedConfig = typeof config === 'function' ? config(bond) : config;
+        return resolveVariants(resolvedConfig, bond, props);
+    }
+    // Plain function (legacy / manual variants fn) — call directly, no cache
     if (typeof variants === 'function') {
         return variants(bond, props);
     }
-    // Otherwise it's a VariantDefinition, resolve it
+    // Raw VariantDefinition object — resolve through cache
     return resolveVariants(variants, bond, props);
 }
+/**
+ * Internal keys that are never valid DOM attributes — stripped before spreading onto element
+ */
+const INTERNAL_PROPS = new Set(['class', 'base', 'as', 'variants', 'compounds', 'defaults']);
 /**
  * Pure function to extract rest props by filtering out preset and variant-specific props
  */
 export function extractRestProps(
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 preset, mergedVariants, restProps) {
-    const presetProps = { ...preset };
-    const presetKeysToRemove = ['class', 'base', 'as', 'variants', 'compounds', 'defaults'];
-    for (const key of presetKeysToRemove) {
-        delete presetProps[key];
+    const result = {};
+    if (preset) {
+        for (const k in preset)
+            if (Object.hasOwn(preset, k) && !PRESET_SKIP.has(k))
+                result[k] = preset[k];
+        // Preserve Symbol-keyed attachment props (e.g. from createAttachmentKey())
+        const symPreset = preset;
+        for (const s of Object.getOwnPropertySymbols(preset))
+            result[s] = symPreset[s];
     }
-    const variantsRestProps = { ...mergedVariants };
-    const variantKeysToRemove = ['class', 'variants', 'compounds', 'defaults'];
-    for (const key of variantKeysToRemove) {
-        delete variantsRestProps[key];
+    if (mergedVariants) {
+        for (const k in mergedVariants)
+            if (Object.hasOwn(mergedVariants, k) && !VARIANTS_SKIP.has(k))
+                result[k] = mergedVariants[k];
+        // Preserve Symbol-keyed attachment props (e.g. from variant definitions)
+        const symProps = mergedVariants;
+        for (const s of Object.getOwnPropertySymbols(mergedVariants))
+            result[s] = symProps[s];
     }
-    return { ...presetProps, ...variantsRestProps, ...restProps };
+    for (const k in restProps)
+        if (Object.hasOwn(restProps, k))
+            result[k] = restProps[k];
+    // Preserve Symbol-keyed attachment props from restProps (e.g. {@attach} directives)
+    const symRestProps = restProps;
+    for (const s of Object.getOwnPropertySymbols(restProps))
+        result[s] = symRestProps[s];
+    return result;
 }
 /**
- * Pure function to check if a base is a snippet
+ * Pure function to check if a base is a snippet.
+ * Svelte 5 snippets compile to arrow functions (no prototype),
+ * while components compile to named functions (with prototype).
  */
 export function isSnippetBase(base) {
-    return typeof base === 'function' && base.length === 1 && !base.prototype;
+    return typeof base === 'function' && !base.prototype;
 }

package/dist/components/avatar/types.d.ts

@@ -1,10 +1,5 @@
 import type { Component } from 'svelte';
-/**
- * Extend this interface to add custom avatar properties in your application.
- */
-export interface AvatarExtendProps {
-}
-export interface AvatarProps extends AvatarExtendProps {
+export interface AvatarProps {
     class?: string;
     src?: string | Component;
     alt?: string;

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

@@ -1,2 +1,3 @@
 export { default as Badge } from './badge.svelte';
 export type { BadgeProps } from './badge.svelte';
+export type { BadgeSnippetProps, BadgeChildren } from './types';