import { type Readable } from 'svelte/store';
import { type AugmentedMotionValue } from './augmentMotionValue.svelte.js';
/**
 * Input to {@link useMotionTemplate}'s interpolation slots: a motion-dom
 * `MotionValue`, a Svelte readable, or a plain `number` / `string` literal.
 * Mirrors framer-motion's `useMotionTemplate` signature.
 */
export type MotionTemplateInput = AugmentedMotionValue<number | string> | Readable<number | string> | number | string;
/**
 * Tagged template literal that builds an augmented `MotionValue<string>`
 * from interpolated motion values, Svelte readables, and plain literals.
 *
 * Mirrors framer-motion 1:1: returns a real motion-dom `MotionValue<string>`
 * (via `transformValue`) that auto-tracks every `MotionValue.get()` called
 * during template composition. Whenever any tracked input emits, the
 * composer reruns and writes the new string into the result value.
 *
 * Svelte-readable slots are sampled via `svelte/store`'s `get()` inside the
 * composer so they re-emit when adjacent motion values trigger a recompute.
 * Plain `number` / `string` slots are stringified inline.
 *
 * The result is augmented with a `$state`-backed `.current` getter and a
 * Svelte readable `.subscribe` shim so it composes with the rest of the
 * Tier 2 surface and reads reactively in Svelte 5 scopes.
 *
 * Lifecycle: must be called during component initialization. motion-dom
 * cleans up the change-subscriptions when the result `MotionValue` is
 * destroyed; we wire that destroy to the surrounding `$effect`.
 *
 * SSR-safe: motion-dom's `transformValue` works without DOM access (no
 * timers, no listeners). On the server the result is a static augmented
 * motion value with no `$effect` registered.
 *
 * @param strings Static template string parts (supplied by the tagged-template syntax).
 * @param values Interpolated motion values, Svelte readables, or literals.
 * @returns An `AugmentedMotionValue<string>` with the composed template.
 *
 * @example
 * ```svelte
 * <script>
 *   import { useSpring, useTransform, useMotionTemplate } from '@humanspeak/svelte-motion'
 *
 *   const x = useSpring(0)
 *   const blur = useTransform(x, [-100, 0, 100], [10, 0, 10])
 *   const filter = useMotionTemplate`blur(${blur}px)`
 * </script>
 *
 * <div style="filter: {filter.current}">Animated blur</div>
 * ```
 *
 * @see https://motion.dev/docs/react-use-motion-template
 */
export declare const useMotionTemplate: (strings: TemplateStringsArray, ...values: MotionTemplateInput[]) => AugmentedMotionValue<string>;