@almadar/ui 5.79.1 → 5.80.0

package/dist/components/core/atoms/Divider.d.ts

@@ -0,0 +1,29 @@
+/**
+ * Divider Atom Component
+ *
+ * A divider component for separating content sections.
+ */
+import React from "react";
+export type DividerOrientation = "horizontal" | "vertical";
+export type DividerVariant = "solid" | "dashed" | "dotted";
+export interface DividerProps {
+    /**
+     * Orientation of the divider
+     * @default 'horizontal'
+     */
+    orientation?: DividerOrientation;
+    /**
+     * Text label to display in the divider
+     */
+    label?: string;
+    /**
+     * Line style variant
+     * @default 'solid'
+     */
+    variant?: DividerVariant;
+    /**
+     * Additional CSS classes
+     */
+    className?: string;
+}
+export declare const Divider: React.FC<DividerProps>;

package/dist/components/core/atoms/FilterPill.d.ts

@@ -0,0 +1,30 @@
+import React from "react";
+import type { EventEmit } from "@almadar/core";
+import { type IconInput } from "./Icon";
+export type FilterPillVariant = "default" | "primary" | "secondary" | "success" | "warning" | "danger" | "info" | "neutral";
+export type FilterPillSize = "sm" | "md" | "lg";
+export interface FilterPillProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, "onClick"> {
+    /** Additional CSS classes applied to the root element. */
+    className?: string;
+    variant?: FilterPillVariant;
+    size?: FilterPillSize;
+    /** Pill label text (alternative to children for schema-driven rendering). */
+    label?: string | number;
+    /** Lucide icon component or canonical kebab-case icon name string */
+    icon?: IconInput;
+    /** Called when the user clicks the remove (×) button */
+    onRemove?: () => void;
+    /** Disable the remove button (renders without × control) */
+    removable?: boolean;
+    /** Click handler for the body of the pill (filter toggle) */
+    onClick?: () => void;
+    /** Event name dispatched via event bus when the pill body is clicked. Payload: { label } */
+    clickEvent?: EventEmit<{
+        label: string | number | undefined;
+    }>;
+    /** Event name dispatched via event bus when the remove (×) button is clicked. Payload: { label } */
+    removeEvent?: EventEmit<{
+        label: string | number | undefined;
+    }>;
+}
+export declare const FilterPill: React.ForwardRefExoticComponent<FilterPillProps & React.RefAttributes<HTMLSpanElement>>;

package/dist/components/core/atoms/FlipContainer.d.ts

@@ -0,0 +1,21 @@
+/**
+ * FlipContainer — CSS 3D perspective atom (distinct from FlipCard molecule).
+ * Owns perspective/preserve-3d/rotateY only. Children are the raw face elements.
+ * Use FlipCard when you need standard card chrome; use FlipContainer when you
+ * need the flip mechanic around custom face content.
+ */
+import React from 'react';
+export interface FlipContainerProps {
+    /** Whether the container is flipped (rotateY 180deg) */
+    flipped: boolean;
+    /** Optional className for the outer wrapper */
+    className?: string;
+    /** The two face elements (front and back) */
+    children: React.ReactNode;
+    /** Click handler on the outer wrapper */
+    onClick?: () => void;
+}
+export declare const FlipContainer: {
+    ({ flipped, className, children, onClick, }: FlipContainerProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/components/core/atoms/Icon.d.ts

@@ -0,0 +1,57 @@
+/**
+ * Icon Atom Component
+ *
+ * Renders an icon from the active icon family (Layer 1 Iconography axis —
+ * see lib/iconFamily.ts). Canonical names are lucide kebab-case; the resolver
+ * dispatches to phosphor / tabler / fa-solid when `--icon-family` selects them,
+ * re-rendering automatically on theme switch.
+ *
+ * Supports two APIs:
+ * - `icon` prop: Pass a LucideIcon component directly (bypasses family resolver
+ *   — used for direct lucide component refs, stays in lucide regardless of theme)
+ * - `name` prop: Pass a canonical kebab-case name (family-aware, swaps on theme)
+ */
+import React from 'react';
+import type { LucideIcon } from 'lucide-react';
+import type { ColorToken } from './types';
+export type IconSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+export type IconAnimation = 'spin' | 'pulse' | 'none';
+export type { ColorToken };
+/**
+ * Canonical icon-input type: a Lucide component reference OR a canonical
+ * kebab-case icon name string. The single source of truth for every
+ * icon-bearing prop across `@almadar/ui` — pattern-sync's parser maps this
+ * union to the `icon` config type, so the factory inspector renders an
+ * IconPicker and a string name resolves via `resolveIcon`. Never declare an
+ * icon prop as `React.ReactNode` (it collapses to a non-editable `node`).
+ */
+export type IconInput = LucideIcon | string;
+/**
+ * Resolve an icon name to a Lucide icon component.
+ * Supports all 1500+ Lucide icons via dynamic PascalCase lookup.
+ * Falls back to HelpCircle if not found.
+ */
+export declare function resolveIcon(name: string): LucideIcon;
+export interface IconProps {
+    /**
+     * Lucide icon component (preferred for type-safe usage), OR a canonical
+     * kebab-case icon name string — a string is treated exactly like `name` so
+     * trait/factory authors can pass an icon by name through the `icon` prop.
+     */
+    icon?: IconInput;
+    /** Icon name as string (resolved from iconMap) */
+    name?: string;
+    /** Size of the icon */
+    size?: IconSize;
+    /** Semantic palette token or an arbitrary Tailwind color class. */
+    color?: ColorToken | string;
+    /** Animation type */
+    animation?: IconAnimation;
+    /** Additional CSS classes */
+    className?: string;
+    /** Icon stroke width - uses theme default if not specified */
+    strokeWidth?: number;
+    /** Inline style */
+    style?: React.CSSProperties;
+}
+export declare const Icon: React.FC<IconProps>;

package/dist/components/core/atoms/InfiniteScrollSentinel.d.ts

@@ -0,0 +1,24 @@
+/**
+ * InfiniteScrollSentinel Atom Component
+ *
+ * Invisible element placed at the end of a list. Uses IntersectionObserver
+ * via useInfiniteScroll to detect when the user scrolls near the bottom,
+ * then fires a load-more event through the event bus.
+ */
+import React from "react";
+import type { EventKey, EventPayload } from "@almadar/core";
+export interface InfiniteScrollSentinelProps {
+    /** Event name to emit when load-more is triggered (emitted as UI:{loadMoreEvent}) */
+    loadMoreEvent: EventKey;
+    /** Optional payload to include with the load-more event */
+    loadMorePayload?: EventPayload;
+    /** Whether a load operation is currently in progress */
+    isLoading?: boolean;
+    /** Whether there are more items to load */
+    hasMore?: boolean;
+    /** IntersectionObserver rootMargin for early trigger */
+    threshold?: string;
+    /** Additional class names */
+    className?: string;
+}
+export declare const InfiniteScrollSentinel: React.FC<InfiniteScrollSentinelProps>;

package/dist/components/core/atoms/Input.d.ts

@@ -0,0 +1,39 @@
+import React from "react";
+import type { EventKey } from "@almadar/core";
+import { type IconInput } from "./Icon";
+export interface SelectOption {
+    value: string;
+    label: string;
+}
+export interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "onChange"> {
+    /** Additional CSS classes applied to the root element. */
+    className?: string;
+    /** Placeholder text */
+    placeholder?: string;
+    /** Current value */
+    value?: string | number;
+    /** Whether input is disabled */
+    disabled?: boolean;
+    /** Declarative event name for trait dispatch */
+    action?: EventKey;
+    /** Input type - supports 'select' and 'textarea' in addition to standard types */
+    inputType?: "text" | "email" | "password" | "number" | "tel" | "url" | "search" | "date" | "datetime-local" | "time" | "checkbox" | "select" | "textarea";
+    label?: string;
+    helperText?: string;
+    error?: string;
+    leftIcon?: IconInput;
+    rightIcon?: IconInput;
+    /** Lucide icon component or canonical kebab-case icon name string for left side */
+    icon?: IconInput;
+    /** Show clear button when input has value */
+    clearable?: boolean;
+    /** Callback or declarative event key when clear button is clicked */
+    onClear?: (() => void) | EventKey;
+    /** Options for select type */
+    options?: SelectOption[];
+    /** Rows for textarea type */
+    rows?: number;
+    /** onChange handler or declarative event key for trait dispatch */
+    onChange?: React.ChangeEventHandler<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement> | EventKey;
+}
+export declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLSelectElement | HTMLInputElement | HTMLTextAreaElement>>;

package/dist/components/core/atoms/Label.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+export interface LabelProps extends React.LabelHTMLAttributes<HTMLLabelElement> {
+    /** Additional CSS classes applied to the root element. */
+    className?: string;
+    /** Label text content */
+    text?: string;
+    /** Associated input element ID */
+    htmlFor?: string;
+    /** Show required indicator */
+    required?: boolean;
+}
+export declare const Label: React.ForwardRefExoticComponent<LabelProps & React.RefAttributes<HTMLLabelElement>>;

package/dist/components/core/atoms/LawReferenceTooltip.d.ts

@@ -0,0 +1,48 @@
+/**
+ * LawReferenceTooltip Atom Component
+ *
+ * A specialized tooltip for displaying law references in inspection forms.
+ * Shows law name, article number, and relevant clause text.
+ */
+import React from "react";
+/**
+ * Law reference definition
+ */
+export type LawReference = {
+    /** Law identifier (e.g., "VVO", "TPED") */
+    law: string;
+    /** Full name of the law */
+    lawName?: string;
+    /** Article number (e.g., "§8", "Artikel 5") */
+    article: string;
+    /** Clause or paragraph text */
+    clause?: string;
+    /** Optional link to full law text */
+    link?: string;
+};
+export interface LawReferenceTooltipProps {
+    /** The law reference to display */
+    reference: LawReference;
+    /** Children element that triggers the tooltip */
+    children: React.ReactNode;
+    /** Tooltip position */
+    position?: "top" | "bottom" | "left" | "right";
+    /** Additional CSS classes */
+    className?: string;
+}
+/**
+ * LawReferenceTooltip displays legal references with structured formatting.
+ *
+ * @example
+ * <LawReferenceTooltip
+ *   reference={{
+ *     law: "VVO",
+ *     lawName: "Verkehrsverordnung",
+ *     article: "§8 Abs. 3",
+ *     clause: "Die zulässige Gesamtmasse darf 3500 kg nicht überschreiten."
+ *   }}
+ * >
+ *   <Typography variant="small" className="text-blue-600 underline cursor-help">VVO §8</Typography>
+ * </LawReferenceTooltip>
+ */
+export declare const LawReferenceTooltip: React.FC<LawReferenceTooltipProps>;

package/dist/components/core/atoms/Overlay.d.ts

@@ -0,0 +1,17 @@
+/**
+ * Overlay Atom Component
+ *
+ * A fixed backdrop for modals and drawers.
+ */
+import React from "react";
+import type { EventKey } from "@almadar/core";
+export interface OverlayProps {
+    isVisible?: boolean;
+    onClick?: (e: React.MouseEvent) => void;
+    className?: string;
+    blur?: boolean;
+    /** Declarative event name — emits UI:{action} via eventBus on click */
+    action?: EventKey;
+}
+export declare const Overlay: React.FC<OverlayProps>;
+export default Overlay;

package/dist/components/core/atoms/ProgressBar.d.ts

@@ -0,0 +1,63 @@
+/**
+ * ProgressBar Atom Component
+ *
+ * A progress bar component with linear, circular, and stepped variants.
+ */
+import React from "react";
+export type ProgressBarType = "linear" | "circular" | "stepped";
+export type ProgressBarVariant = "default" | "primary" | "success" | "warning" | "error" | "danger";
+export type ProgressBarColor = ProgressBarVariant;
+export interface ProgressBarProps {
+    /**
+     * Progress value (0-100)
+     */
+    value: number;
+    /**
+     * Maximum value (for calculating percentage)
+     * @default 100
+     */
+    max?: number;
+    /**
+     * Type of the progress bar (linear, circular, stepped)
+     * @default 'linear'
+     */
+    progressType?: ProgressBarType;
+    /**
+     * Variant/color of the progress bar
+     * @default 'primary'
+     */
+    variant?: ProgressBarVariant;
+    /**
+     * Color variant (alias for variant)
+     * @default 'primary'
+     */
+    color?: ProgressBarColor;
+    /**
+     * Show percentage text
+     * @default false
+     */
+    showPercentage?: boolean;
+    /**
+     * Alias for showPercentage (pattern compatibility)
+     */
+    showLabel?: boolean;
+    /**
+     * Label text
+     */
+    label?: string;
+    /**
+     * Size (for circular variant)
+     * @default 'md'
+     */
+    size?: "sm" | "md" | "lg";
+    /**
+     * Number of steps (for stepped variant)
+     * @default 5
+     */
+    steps?: number;
+    /**
+     * Additional CSS classes
+     */
+    className?: string;
+}
+export declare const ProgressBar: React.FC<ProgressBarProps>;

package/dist/components/core/atoms/Radio.d.ts

@@ -0,0 +1,35 @@
+/**
+ * Radio Atom Component
+ *
+ * A radio button component with label support and accessibility.
+ */
+import React from "react";
+import type { EventKey } from "@almadar/core";
+export interface RadioProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "size"> {
+    /** Additional CSS classes applied to the root element. */
+    className?: string;
+    /** Radio options (string array or SelectOption array) */
+    options?: string[];
+    /** Current selected value */
+    value?: string;
+    /** Declarative event name for trait dispatch */
+    action?: EventKey;
+    /**
+     * Label text displayed next to the radio button
+     */
+    label?: string;
+    /**
+     * Helper text displayed below the radio button
+     */
+    helperText?: string;
+    /**
+     * Error message displayed below the radio button
+     */
+    error?: string;
+    /**
+     * Size of the radio button
+     * @default 'md'
+     */
+    size?: "sm" | "md" | "lg";
+}
+export declare const Radio: React.ForwardRefExoticComponent<RadioProps & React.RefAttributes<HTMLInputElement>>;

package/dist/components/core/atoms/RangeSlider.d.ts

@@ -0,0 +1,34 @@
+import React from "react";
+import type { EventKey, EventPayload } from "@almadar/core";
+export type RangeSliderSize = "sm" | "md" | "lg";
+export interface RangeSliderProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange"> {
+    /** Additional CSS classes applied to the root element. */
+    className?: string;
+    /** Minimum value */
+    min?: number;
+    /** Maximum value */
+    max?: number;
+    /** Current value */
+    value?: number;
+    /** Step increment */
+    step?: number;
+    /** Show tooltip with current value on drag */
+    showTooltip?: boolean;
+    /** Show tick marks at step intervals */
+    showTicks?: boolean;
+    /** Buffered range (0-100), for media seek bars */
+    buffered?: number;
+    /** Slider size */
+    size?: RangeSliderSize;
+    /** Disabled state */
+    disabled?: boolean;
+    /** Declarative event name for value changes */
+    action?: EventKey;
+    /** Payload to include with the action event */
+    actionPayload?: EventPayload;
+    /** Direct onChange callback */
+    onChange?: (value: number) => void;
+    /** Format function for tooltip display */
+    formatValue?: (value: number) => string;
+}
+export declare const RangeSlider: React.ForwardRefExoticComponent<RangeSliderProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/core/atoms/SectionHeader.d.ts

@@ -0,0 +1,14 @@
+import React from "react";
+export interface SectionHeaderProps {
+    /** Section title text */
+    title: string;
+    /** Optional subtitle text */
+    subtitle?: string;
+    /** Text alignment */
+    align?: "center" | "left" | "right";
+    /** Heading level (1, 2, or 3) */
+    level?: 1 | 2 | 3;
+    /** Additional class names */
+    className?: string;
+}
+export declare const SectionHeader: React.FC<SectionHeaderProps>;

package/dist/components/core/atoms/Select.d.ts

@@ -0,0 +1,49 @@
+import React from "react";
+import type { EventKey, EventEmit } from "@almadar/core";
+export interface SelectOption {
+    value: string;
+    label: string;
+    disabled?: boolean;
+    /** Leading content rendered in rich mode only (native mode ignores this). */
+    icon?: React.ReactNode;
+    /** Secondary line of text rendered below label in rich mode only. */
+    secondaryLabel?: string;
+    /** dir attribute applied to the option row in rich mode only. */
+    dir?: string;
+}
+export interface SelectOptionGroup {
+    label: string;
+    options: SelectOption[];
+}
+export interface SelectProps extends Omit<React.SelectHTMLAttributes<HTMLSelectElement>, "children" | "onChange" | "multiple"> {
+    /** Additional CSS classes applied to the root element. */
+    className?: string;
+    /** Select options (flat list) */
+    options?: SelectOption[];
+    /** Grouped options — rendered as <optgroup> in native mode, sections in rich mode. */
+    groups?: SelectOptionGroup[];
+    /** Placeholder text */
+    placeholder?: string;
+    /** Current value (string for single, string[] for multiple) */
+    value?: string | string[];
+    /** Declarative event name for trait dispatch */
+    action?: EventKey;
+    /** Error message */
+    error?: string;
+    /** Allow selecting multiple values — activates the rich dropdown. */
+    multiple?: boolean;
+    /** Show a search input inside the dropdown — activates the rich dropdown. */
+    searchable?: boolean;
+    /** Show a clear button when a value is selected. */
+    clearable?: boolean;
+    /** onChange handler (native ChangeEvent) or declarative event key for trait dispatch */
+    onChange?: React.ChangeEventHandler<HTMLSelectElement> | EventKey;
+    /** Value-based change: a React callback (internal use) OR a declarative event
+     *  key that emits `{ value }` on the bus (render-ui / lolo authoring). Mirrors
+     *  the `onChange` handler|event convention so it's an event-emitting prop, not a
+     *  bare callback. */
+    onValueChange?: ((value: string | string[]) => void) | EventEmit<{
+        value: string | string[];
+    }>;
+}
+export declare const Select: React.ForwardRefExoticComponent<SelectProps & React.RefAttributes<HTMLSelectElement>>;

package/dist/components/core/atoms/Spacer.d.ts

@@ -0,0 +1,25 @@
+/**
+ * Spacer Component
+ *
+ * A flexible spacer that expands to fill available space in a flex container.
+ * Useful for pushing elements apart or creating consistent spacing.
+ */
+import React from 'react';
+export type SpacerSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | 'auto';
+export interface SpacerProps {
+    /** Fixed size (auto = flex grow) */
+    size?: SpacerSize;
+    /** Orientation (for fixed sizes) */
+    axis?: 'horizontal' | 'vertical';
+    /** Custom class name */
+    className?: string;
+}
+/**
+ * Spacer - Flexible spacing element for flex layouts
+ *
+ * Usage:
+ * - size="auto" (default): Expands to fill available space (flex: 1)
+ * - size="md": Fixed size spacing
+ */
+export declare const Spacer: React.FC<SpacerProps>;
+export default Spacer;

package/dist/components/core/atoms/Sparkline.d.ts

@@ -0,0 +1,30 @@
+/**
+ * Sparkline Atom Component
+ *
+ * Minimal inline trend chart. Pure SVG polyline over a numeric series.
+ * Extracted from StatCard's sparkline path so any KPI or list row can
+ * include a trend visualization without compositing the whole card.
+ */
+import React from "react";
+export type SparklineColor = "auto" | "primary" | "success" | "warning" | "error" | "info" | "muted";
+export interface SparklineProps {
+    /** Numeric series to plot. Length < 2 renders nothing. */
+    data: readonly number[];
+    /**
+     * Stroke color.
+     * `auto` (default): success when the series trends up (last ≥ first),
+     * error when it trends down.
+     */
+    color?: SparklineColor;
+    /** SVG width in px. Default 80. */
+    width?: number;
+    /** SVG height in px. Default 32. */
+    height?: number;
+    /** Stroke width in px. Default 2. */
+    strokeWidth?: number;
+    /** Fill the area under the line with the stroke color at low opacity. */
+    fill?: boolean;
+    /** Additional CSS classes. */
+    className?: string;
+}
+export declare const Sparkline: React.FC<SparklineProps>;

package/dist/components/core/atoms/Spinner.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+export type SpinnerSize = "xs" | "sm" | "md" | "lg";
+export interface SpinnerProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Additional CSS classes applied to the root element. */
+    className?: string;
+    size?: SpinnerSize;
+    /** Renders a centered overlay backdrop instead of inline. */
+    overlay?: boolean;
+}
+export declare const Spinner: React.ForwardRefExoticComponent<SpinnerProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/core/atoms/Stack.d.ts

@@ -0,0 +1,67 @@
+/**
+ * Stack Component
+ *
+ * A layout primitive for arranging children in a vertical or horizontal stack with consistent spacing.
+ * Includes convenience exports VStack and HStack for common use cases.
+ */
+import React from "react";
+import type { EventKey, EventPayload } from "@almadar/core";
+export type StackDirection = "horizontal" | "vertical";
+export type StackGap = "none" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl";
+export type StackAlign = "start" | "center" | "end" | "stretch" | "baseline";
+export type StackJustify = "start" | "center" | "end" | "between" | "around" | "evenly";
+export interface StackProps {
+    /** Stack direction */
+    direction?: StackDirection;
+    /** Gap between children */
+    gap?: StackGap;
+    /** Align items on the cross axis */
+    align?: StackAlign;
+    /** Justify items on the main axis */
+    justify?: StackJustify;
+    /** Allow items to wrap */
+    wrap?: boolean;
+    /** Reverse the order of children */
+    reverse?: boolean;
+    /** Fill available space (flex: 1) */
+    flex?: boolean;
+    /** Custom class name */
+    className?: string;
+    /** Inline styles */
+    style?: React.CSSProperties;
+    /** Children elements */
+    children?: React.ReactNode;
+    /** HTML element to render as */
+    as?: React.ElementType;
+    /** Click handler */
+    onClick?: (e: React.MouseEvent) => void;
+    /** Keyboard handler */
+    onKeyDown?: (e: React.KeyboardEvent) => void;
+    /** Role for accessibility */
+    role?: string;
+    /** Tab index for focus management */
+    tabIndex?: number;
+    /** Declarative event name — emits UI:{action} via eventBus on click */
+    action?: EventKey;
+    /** Payload to include with the action event */
+    actionPayload?: EventPayload;
+    /** When true, horizontal stacks flip to vertical below the md breakpoint (768px) */
+    responsive?: boolean;
+}
+/**
+ * Stack - Flexible layout component for arranging children
+ */
+export declare const Stack: React.FC<StackProps>;
+/**
+ * VStack - Vertical stack shorthand
+ */
+export interface VStackProps extends Omit<StackProps, "direction"> {
+}
+export declare const VStack: React.FC<VStackProps>;
+/**
+ * HStack - Horizontal stack shorthand
+ */
+export interface HStackProps extends Omit<StackProps, "direction"> {
+}
+export declare const HStack: React.FC<HStackProps>;
+export default Stack;

package/dist/components/core/atoms/StatusDot.d.ts

@@ -0,0 +1,16 @@
+import React from "react";
+export type StatusDotStatus = "online" | "offline" | "away" | "busy" | "warning" | "critical";
+export type StatusDotSize = "sm" | "md" | "lg";
+export interface StatusDotProps extends React.HTMLAttributes<HTMLSpanElement> {
+    /** Additional CSS classes applied to the root element. */
+    className?: string;
+    /** Status determines the dot color */
+    status?: StatusDotStatus;
+    /** Enable pulse animation for active/critical states */
+    pulse?: boolean;
+    /** Dot size */
+    size?: StatusDotSize;
+    /** Accessible label (rendered as sr-only text) */
+    label?: string;
+}
+export declare const StatusDot: React.ForwardRefExoticComponent<StatusDotProps & React.RefAttributes<HTMLSpanElement>>;

package/dist/components/core/atoms/Switch.d.ts

@@ -0,0 +1,12 @@
+import * as React from "react";
+export interface SwitchProps {
+    checked?: boolean;
+    defaultChecked?: boolean;
+    onChange?: (checked: boolean) => void;
+    disabled?: boolean;
+    label?: string;
+    id?: string;
+    name?: string;
+    className?: string;
+}
+export declare const Switch: React.ForwardRefExoticComponent<SwitchProps & React.RefAttributes<HTMLButtonElement>>;