claritykit-svelte
Version:
A comprehensive Svelte component library focused on accessibility, ADHD-optimized design, developer experience, and full SSR compatibility
28 lines • 1.17 kB
TypeScript
type $$ComponentProps = {
variant?: 'spinner' | 'bar' | 'dots';
size?: 'sm' | 'md' | 'lg';
color?: 'accent' | 'primary' | 'secondary' | 'muted';
progress?: number;
label?: string;
inline?: boolean;
class?: string;
};
/**
* Loader
*
* Loading indicator component with different variants for various loading states.
* Provides visual feedback during operations with ADHD-friendly animations.
* SSR-compatible with safe animation handling and reduced motion support.
*
* @prop {string} [variant='spinner'] - Loader variant (spinner, bar, dots)
* @prop {string} [size='md'] - Loader size (sm, md, lg)
* @prop {string} [color='accent'] - Loader color (accent, primary, secondary, muted)
* @prop {number} [progress] - Progress value for bar variant (0-100)
* @prop {string} [label] - Accessible label for the loader
* @prop {boolean} [inline=false] - Whether to display inline with content
* @prop {string} [className] - Additional CSS classes
*/
declare const Loader: import("svelte").Component<$$ComponentProps, {}, "">;
type Loader = ReturnType<typeof Loader>;
export default Loader;
//# sourceMappingURL=Loader.svelte.d.ts.map