claritykit-svelte/dist/components/therapeutic/TherapeuticAnchor/TherapeuticAnchor.svelte.d.ts

A comprehensive Svelte component library focused on accessibility, ADHD-optimized design, developer experience, and full SSR compatibility

import type { Snippet } from 'svelte';
import type { AnchorType, AnchorSize, AnchorVariant, InteractionPattern, BreathingConfig } from './types.js';
interface Props {
    type: AnchorType;
    size?: AnchorSize;
    variant?: AnchorVariant;
    interaction?: InteractionPattern;
    title?: string;
    description?: string;
    icon?: string;
    active?: boolean;
    disabled?: boolean;
    showLabel?: boolean;
    showDescription?: boolean;
    breathingConfig?: BreathingConfig;
    customColor?: {
        primary: string;
        secondary: string;
        background: string;
    };
    class?: string;
    onActivate?: () => void;
    onBreathingPhase?: (phase: 'inhale' | 'hold' | 'exhale') => void;
    children?: Snippet;
}
/**
 * TherapeuticAnchor
 *
 * ADHD-friendly therapeutic anchor component for grounding, motivation, and emotional regulation.
 * Designed with evidence-based therapeutic principles for neurodivergent users.
 *
 * @prop {AnchorType} type - Type of therapeutic anchor
 * @prop {AnchorSize} [size='md'] - Size variant ('sm', 'md', 'lg')
 * @prop {AnchorVariant} [variant='default'] - Visual variant ('default', 'outlined', 'filled', 'minimal')
 * @prop {InteractionPattern} [interaction='hover'] - Interaction pattern ('hover', 'click', 'breathing', 'pulse', 'glow', 'none')
 * @prop {string} [title] - Custom title text
 * @prop {string} [description] - Custom description text
 * @prop {string} [icon] - Custom icon or emoji
 * @prop {boolean} [active=false] - Whether the anchor is active/highlighted
 * @prop {boolean} [disabled=false] - Whether the anchor is disabled
 * @prop {boolean} [showLabel=true] - Whether to show text labels
 * @prop {boolean} [showDescription=true] - Whether to show description
 * @prop {BreathingConfig} [breathingConfig] - Breathing exercise configuration
 * @prop {object} [customColor] - Custom color scheme
 * @prop {string} [class] - Additional CSS classes
 *
 * @event activate - Dispatched when anchor is activated
 * @event breathingphase - Dispatched during breathing exercises
 */
declare const TherapeuticAnchor: import("svelte").Component<Props, {}, "">;
type TherapeuticAnchor = ReturnType<typeof TherapeuticAnchor>;
export default TherapeuticAnchor;
//# sourceMappingURL=TherapeuticAnchor.svelte.d.ts.map