type VariantValue = string | number | boolean | undefined;
type VariantProps = Record<string, VariantValue>;

/**
 * tailwind-styled-v4 — Svelte Adapter
 *
 * Svelte 4+ adapter menggunakan action dan store pattern.
 * Kompatibel dengan Svelte 5 runes mode.
 *
 * Dua pola yang didukung:
 * 1. `tw()` — buat class string resolver untuk dipakai di template
 * 2. `createSvelteComponent()` — buat Svelte component via Svelte API
 *
 * @example
 * <!-- Pola 1: tw() sebagai class resolver -->
 * <script>
 *   import { cv } from '@tailwind-styled/svelte'
 *
 *   const buttonClass = cv({
 *     base: 'px-4 py-2 rounded font-medium',
 *     variants: {
 *       intent: { primary: 'bg-blue-500 text-white', danger: 'bg-red-500 text-white' },
 *       size: { sm: 'h-8 text-sm', lg: 'h-12 text-lg' },
 *     },
 *     defaultVariants: { intent: 'primary', size: 'sm' },
 *   })
 *
 *   export let intent = 'primary'
 *   export let size = 'sm'
 * </script>
 *
 * <button class={buttonClass({ intent, size })}>
 *   <slot />
 * </button>
 */

interface SvelteComponentConfig {
    base?: string;
    variants?: Record<string, Record<string, string>>;
    compoundVariants?: Array<{
        class: string;
        [key: string]: VariantValue;
    }>;
    defaultVariants?: Record<string, string>;
}
/**
 * Class variant resolver — pola utama untuk Svelte.
 * Returns fungsi yang menerima props dan mengembalikan class string.
 *
 * Gunakan ini di `<script>` block, lalu panggil di template.
 *
 * @example
 * const button = cv({
 *   base: 'px-4 py-2 rounded',
 *   variants: { size: { sm: 'h-8', lg: 'h-12' } },
 * })
 *
 * // Di template: class={button({ size: 'lg' })}
 */
declare function cv(config: SvelteComponentConfig): (props?: VariantProps) => string;
/**
 * Simple class merger — berguna untuk merge class dinamis.
 *
 * @example
 * import { tw } from '@tailwind-styled/svelte'
 *
 * // Merge class string
 * const cls = tw('px-4 py-2', isActive && 'bg-blue-500', className)
 */
declare function tw(...classes: Array<string | boolean | null | undefined>): string;
/**
 * Svelte action untuk menerapkan class dinamis.
 *
 * @example
 * <script>
 *   import { styled } from '@tailwind-styled/svelte'
 *   const buttonConfig = { base: 'px-4 py-2', variants: { size: { sm: 'h-8', lg: 'h-12' } } }
 * </script>
 *
 * <button use:styled={{ config: buttonConfig, props: { size: 'lg' } }}>
 *   Click me
 * </button>
 */
declare function styled(node: HTMLElement, { config, props }: {
    config: SvelteComponentConfig;
    props?: VariantProps;
}): {
    update: ({ config: cfg, props: p, }: {
        config: SvelteComponentConfig;
        props?: VariantProps;
    }) => void;
    destroy(): void;
};
/**
 * Svelte 5 runes-compatible variant factory.
 * Mengembalikan reactive class string menggunakan $derived pattern.
 *
 * @example
 * // Dalam Svelte 5 component:
 * const { className, variantProps } = createVariants({
 *   base: 'px-4 py-2',
 *   variants: { size: { sm: 'h-8', lg: 'h-12' } },
 * }, () => ({ size: currentSize }))
 *
 * // className adalah fungsi yang return class string terkini
 */
declare function createVariants(config: SvelteComponentConfig, getProps: () => VariantProps): {
    className: () => string;
    config: SvelteComponentConfig;
};

export { type SvelteComponentConfig, createVariants, cv, styled, tw };