@makolabs/ripple 1.8.0 → 1.9.1

package/dist/index.d.ts

@@ -15,404 +15,29 @@ export type VariantColors = (typeof Color)[keyof typeof Color];
  */
 export { Color, Size, ChartColor };
 export { buildTestId } from './helper/testid.js';
-import type { ClassValue } from 'tailwind-variants';
 export type { ClassValue } from 'tailwind-variants';
-import type { Snippet } from 'svelte';
-import type { Component } from 'svelte';
-import type { HTMLButtonAttributes, HTMLAttributeAnchorTarget, DOMAttributes } from 'svelte/elements';
-import type { ECharts } from 'echarts/types/src/export/core.js';
-import type { SuperForm } from 'sveltekit-superforms';
-import type { FileAction, StorageAdapter } from './adapters/storage/types.js';
-export type BadgeProps = {
-    size?: VariantSizes;
-    color?: VariantColors;
-    class?: ClassValue;
-    children: Snippet;
-    onclose?: (event: MouseEvent) => void;
-    testId?: string;
-};
-export type BaseButtonProps = {
-    class?: ClassValue;
-    variant?: 'solid' | 'outline' | 'ghost' | 'link';
-    color?: VariantColors;
-    size?: VariantSizes;
-    rounded?: 'none' | 'xs' | 'sm' | 'base' | 'lg' | 'xl' | '2xl' | 'full';
-    disabled?: boolean | undefined | null;
-    isLoading?: boolean;
-    children?: Snippet;
-    testId?: string;
-};
-export type ButtonHTMLProps = {
-    href?: never;
-} & HTMLButtonAttributes;
-export type AnchorHTMLProps = {
-    rel?: string | undefined | null;
-    target?: HTMLAttributeAnchorTarget | undefined | null;
-    referrerpolicy?: 'no-referrer' | 'no-referrer-when-downgrade' | 'origin' | 'origin-when-cross-origin' | 'same-origin' | 'strict-origin' | 'strict-origin-when-cross-origin' | 'unsafe-url' | undefined | null;
-    href: string;
-} & Record<string, unknown>;
-export type ButtonProps = BaseButtonProps & (ButtonHTMLProps | AnchorHTMLProps);
-export type ModalProps = {
-    open?: boolean;
-    onclose?: () => void;
-    title?: string;
-    description?: string;
-    size?: VariantSizes;
-    hideCloseButton?: boolean;
-    class?: ClassValue;
-    /** @deprecated Use contentClass instead */
-    contentclass?: ClassValue;
-    contentClass?: ClassValue;
-    /** @deprecated Use bodyClass instead */
-    bodyclass?: ClassValue;
-    bodyClass?: ClassValue;
-    /** @deprecated Use titleClass instead */
-    titleclass?: ClassValue;
-    titleClass?: ClassValue;
-    /** @deprecated Use headerClass instead */
-    headerclass?: ClassValue;
-    headerClass?: ClassValue;
-    /** @deprecated Use backdropClass instead */
-    backdropclass?: ClassValue;
-    backdropClass?: ClassValue;
-    /** @deprecated Use footerClass instead */
-    footerclass?: ClassValue;
-    footerClass?: ClassValue;
-    children?: Snippet;
-    footer?: Snippet;
-    header?: Snippet;
-    testId?: string;
-};
-export type DrawerProps = {
-    open?: boolean;
-    onclose?: () => void;
-    title?: string;
-    position?: 'left' | 'right';
-    size?: VariantSizes;
-    class?: ClassValue;
-    /** @deprecated Use backdropClass instead */
-    backdropclass?: ClassValue;
-    backdropClass?: ClassValue;
-    /** @deprecated Use contentClass instead */
-    contentclass?: ClassValue;
-    contentClass?: ClassValue;
-    /** @deprecated Use headerClass instead */
-    headerclass?: ClassValue;
-    headerClass?: ClassValue;
-    /** @deprecated Use bodyClass instead */
-    bodyclass?: ClassValue;
-    bodyClass?: ClassValue;
-    /** @deprecated Use titleClass instead */
-    titleclass?: ClassValue;
-    titleClass?: ClassValue;
-    /** @deprecated Use footerClass instead */
-    footerclass?: ClassValue;
-    footerClass?: ClassValue;
-    children?: Snippet;
-    header?: Snippet;
-    footer?: Snippet;
-    testId?: string;
-};
-export type DropdownItem = {
-    label: string;
-    href?: `/${string}`;
-    icon?: Component;
-    onclick?: () => void;
-    active?: boolean;
-};
-export type DropSection = {
-    items: DropdownItem[];
-};
-export type DropHeaderConfig = {
-    title?: string;
-    subtitle?: string;
-    content?: Snippet<[]>;
-    class?: ClassValue;
-    titleClass?: ClassValue;
-    subtitleClass?: ClassValue;
-    onclick?: () => void;
-};
-export type DropdownMenuProps = {
-    open?: boolean;
-    sections: DropSection[];
-    label?: string;
-    icon?: Component;
-    containerClass?: ClassValue;
-    itemClass?: ClassValue;
-    class?: ClassValue;
-    size?: VariantSizes;
-    disabled?: boolean;
-    position?: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
-    width?: string;
-    header?: DropHeaderConfig;
-    testId?: string;
-};
-export type SelectItem = {
-    label: string;
-    value: string;
-    disabled?: boolean;
-    icon?: Component;
-};
-export type SelectProps = {
-    items: SelectItem[];
-    value?: string | string[];
-    multiple?: boolean;
-    placeholder?: string;
-    searchable?: boolean;
-    disabled?: boolean;
-    size?: VariantSizes;
-    class?: ClassValue;
-    containerClass?: ClassValue;
-    listClass?: ClassValue;
-    itemClass?: ClassValue;
-    triggerClass?: ClassValue;
-    searchInputClass?: ClassValue;
-    clearable?: boolean;
-    icon?: Component;
-    iconClass?: ClassValue;
-    onselect?: ({ value }: {
-        value: string | string[];
-    }) => void;
-    onopen?: () => void;
-    onclose?: () => void;
-    testId?: string;
-};
-export type CardProps = {
-    color?: VariantColors;
-    title?: string;
-    class?: ClassValue;
-    /** @deprecated Use titleClass instead */
-    titleclass?: ClassValue;
-    titleClass?: ClassValue;
-    /** @deprecated Use bodyClass instead */
-    bodyclass?: ClassValue;
-    bodyClass?: ClassValue;
-    children?: Snippet;
-    custom?: Snippet;
-    testId?: string;
-};
-export type AlertProps = {
-    title?: string;
-    message: string;
-    color?: VariantColors;
-    class?: ClassValue;
-    onclose?: () => void;
-    footer?: Snippet;
-    icon?: Component;
-    testId?: string;
-};
-export type MetricDetail = {
-    label: string;
-    value: string | number;
-    color?: VariantColors;
-};
-export type MetricCardProps = {
-    title: string;
-    value: string | number;
-    details?: MetricDetail[];
-    percent?: number;
-    segments?: ProgressSegment[];
-    class?: ClassValue;
-    testId?: string;
-};
+export type { BadgeProps } from './elements/badge/badge-types.js';
+export type { BaseButtonProps, ButtonHTMLProps, AnchorHTMLProps, ButtonProps } from './button/button-types.js';
+export type { ModalProps } from './modal/modal-types.js';
+export type { DrawerProps } from './drawer/drawer-types.js';
+export type { DropdownItem, DropSection, DropHeaderConfig, DropdownMenuProps, SelectItem, SelectProps } from './elements/dropdown/dropdown-types.js';
+export type { CardProps, AlertProps, MetricDetail, MetricCardProps } from './layout/card/card-types.js';
 export type { RankedCardProps, RankedCardItem, RankedCardMetric } from './layout/card/ranked-card.js';
-export type DataRow = Record<string, any>;
-export type KeyType = keyof DataRow;
-export type StatusType = 'active' | 'inactive' | 'pending' | 'error' | 'default';
-export type TableColumn<T extends DataRow = any> = {
-    key: KeyType;
-    header: string;
-    cell?: Snippet<[row: T, key: KeyType, index?: number]>;
-    sortable?: boolean;
-    sortKey?: string;
-    align?: 'left' | 'center' | 'right';
-    width?: string;
-    class?: ClassValue;
-};
-export type SortDirection = 'asc' | 'desc' | null;
-export type SortState = {
-    column: string | null;
-    direction: SortDirection;
-};
-export type TableProps<T extends DataRow = any> = {
-    data: T[];
-    columns: TableColumn<T>[];
-    bordered?: boolean;
-    striped?: boolean;
-    pageSize?: number;
-    currentPage?: number;
-    totalItems?: number;
-    selectable?: boolean;
-    selected?: T[];
-    class?: ClassValue;
-    /** @deprecated Use wrapperClass instead */
-    wrapperclass?: ClassValue;
-    wrapperClass?: ClassValue;
-    /** @deprecated Use tableClass instead */
-    tableclass?: ClassValue;
-    tableClass?: ClassValue;
-    /** @deprecated Use theadClass instead */
-    theadclass?: ClassValue;
-    theadClass?: ClassValue;
-    /** @deprecated Use tbodyClass instead */
-    tbodyclass?: ClassValue;
-    tbodyClass?: ClassValue;
-    /** @deprecated Use trClass instead */
-    trclass?: ClassValue;
-    trClass?: ClassValue;
-    /** @deprecated Use thClass instead */
-    thclass?: ClassValue;
-    thClass?: ClassValue;
-    /** @deprecated Use tdClass instead */
-    tdclass?: ClassValue;
-    tdClass?: ClassValue;
-    /** @deprecated Use footerClass instead */
-    footerclass?: ClassValue;
-    footerClass?: ClassValue;
-    /** @deprecated Use paginationClass instead */
-    paginationclass?: ClassValue;
-    paginationClass?: ClassValue;
-    onrowclick?: (row: T, index: number) => void;
-    onsort?: (sortState: SortState) => void;
-    onselect?: (selected: T[]) => void;
-    onpagechange?: (page: number) => void;
-    /** @deprecated Use rowClass instead */
-    rowclass?: (row: T, index: number) => ClassValue;
-    rowClass?: (row: T, index: number) => ClassValue;
-    loading?: boolean;
-    expandedContent?: Snippet<[T]>;
-    pagination?: boolean;
-    showPagination?: boolean;
-    showPageSize?: boolean;
-    pageSizeOptions?: number[];
-    onpagesizechange?: (pageSize: number) => void;
-    paginationPosition?: 'top' | 'bottom' | 'both';
-    paginationTemplate?: 'simple' | 'full';
-    title?: string;
-    subtitle?: string;
-    headerActions?: Snippet;
-    selectAllScope?: 'page' | 'all';
-    rowKey?: string;
-    expandable?: boolean;
-    testId?: string;
-};
-export type BreadcrumbItem = {
-    label: string;
-    href: string;
-    current?: boolean;
-    icon?: Component;
-};
-export type BreadcrumbsProps = {
-    items: BreadcrumbItem[];
-    size?: 'xs' | 'sm' | 'base' | 'lg';
-    weight?: 'normal' | 'medium' | 'semibold' | 'bold';
-    color?: VariantColors;
-    icon?: Component;
-    class?: ClassValue;
-    /** @deprecated Use listClass instead */
-    listclass?: ClassValue;
-    listClass?: ClassValue;
-    /** @deprecated Use itemClass instead */
-    itemclass?: ClassValue;
-    itemClass?: ClassValue;
-    /** @deprecated Use separatorClass instead */
-    separatorclass?: ClassValue;
-    separatorClass?: ClassValue;
-    /** @deprecated Use wrapperClass instead */
-    wrapperclass?: ClassValue;
-    wrapperClass?: ClassValue;
-    testId?: string;
-};
-export type PageHeaderProps = {
-    title: string;
-    subtitle?: string;
-    breadcrumbs?: BreadcrumbItem[];
-    children?: Snippet;
-    class?: ClassValue;
-    /** @deprecated Use titleClass instead */
-    titleclass?: ClassValue;
-    titleClass?: ClassValue;
-    layout?: 'vertical' | 'horizontal';
-    testId?: string;
-};
-export type TabItem = {
-    value: string;
-    label: string;
-    icon?: Component;
-    disabled?: boolean;
-};
-export type NavbarLinkItem = {
-    label: string;
-    href: string;
-    icon?: Component;
-    active?: boolean;
-    children?: NavbarLinkItem[];
-};
-export type NavbarProps = {
-    logo?: string | Component;
-    links?: NavbarLinkItem[];
-    class?: ClassValue;
-    brand?: Snippet;
-    children?: Snippet;
-    actions?: Snippet;
-    testId?: string;
-};
-export type MenuBar = {
-    collapsed: boolean;
-};
-export interface BaseNavigationItem {
-    label: string;
-}
-export interface WithIcon {
-    Icon?: Component;
-}
-export interface Activatable {
-    active?: boolean;
-}
-export interface LinkItem extends BaseNavigationItem, WithIcon, Activatable {
-    href: string;
-    meta?: string;
-    /**
-     * When true, the link will be active if the current route starts with this href.
-     * Example: href="/tushar" will be active for "/tushar/overview" and "/tushar/profile"
-     * @default false
-     */
-    matchPartial?: boolean;
-}
-export interface ParentItem extends BaseNavigationItem, Activatable {
-    children: LinkItem[];
-}
-export interface DividerItem {
-    type: 'horizontal-divider';
-}
-export type NavigationItem = LinkItem | ParentItem | DividerItem;
-export type LogoType = {
-    src?: string;
-    title: string;
-};
-export interface NavGroupProps {
-    labelArea: Snippet<[string, string]>;
-    active?: boolean;
-    children?: Snippet;
-    class?: ClassValue;
-    testId?: string;
-}
-export interface NavItemProps {
-    href: string;
-    active?: boolean;
-    children: Snippet<[ClassValue]>;
-    class?: ClassValue;
-    testId?: string;
-}
-export interface SidebarProps {
-    items?: NavigationItem[];
-    logo: LogoType;
-    /** Optional footer snippet rendered at the bottom of the sidebar */
-    footer?: Snippet<[{
-        collapsed: boolean;
-    }]>;
-    testId?: string;
-}
+export type { DataRow, KeyType, StatusType, TableColumn, SortDirection, SortState, TableProps } from './layout/table/table-types.js';
+export type { BreadcrumbItem, BreadcrumbsProps, PageHeaderProps } from './header/header-types.js';
+export type { TabItem, TabProps, TabsGroupProps, TabContentProps } from './layout/tabs/tabs-types.js';
+export type { NavbarLinkItem, NavbarProps } from './layout/navbar/navbar-types.js';
+export type { MenuBar, BaseNavigationItem, WithIcon, Activatable, LinkItem, ParentItem, DividerItem, NavigationItem, LogoType, NavGroupProps, NavItemProps, SidebarProps } from './layout/sidebar/sidebar-types.js';
+export type { ChartColorKey, ChartColorValue, ChartColors, ChartType, ChartColorString, XAxisConfig, YAxisConfig, SeriesConfig, GridConfig, LegendConfig, TooltipConfig, ToolboxConfig, ChartConfig, PointClickType, ChartRenderType, ChartProps } from './charts/chart-types.js';
+export type { FormProps, InputProps, RadioOption, RadioInputsProps, CheckboxProps, ToggleProps, CurrencyOption, NumberInputProps, DateRangeProps, DateSelectEvent, TagsProps, SliderMode, NotationType, EnumOption, SliderProps, RadioPillProps } from './forms/form-types.js';
+export type { ProgressSegment, ProgressProps } from './elements/progress/progress-types.js';
+export type { AccordionProps } from './elements/accordion/accordion-types.js';
+export type { TimelineItem } from './elements/timeline/timeline-types.js';
+export type { FilterTab, FilterGroup, CompactFiltersProps } from './filters/filter-types.js';
+export type { ActivityItemBadge, ActivityItemAction, ActivityItem, ActivityListProps } from './layout/activity-list/activity-list-types.js';
+export type { FileUploadProps, FilePreviewProps, UploadedFile } from './elements/file-upload/file-upload-types.js';
+export type { ChatMessageType, StreamingCallback, ChatAction, ChatMessage, ChatResponse, QuickAction, FileBrowserProps } from './ai/ai-types.js';
+export type { GetUsersOptions, GetUsersResult, UserEmail, UserPhone, User, Permission, Role, UserTableProps, UserModalProps, UserViewModalProps, UserManagementAdapter, UserManagementProps, FormErrors } from './user-management/user-management-types.js';
 export { tv, cn } from './helper/cls.js';
 export { isRouteActive } from './helper/nav.svelte.js';
 export { default as Button } from './button/Button.svelte';
@@ -431,39 +56,6 @@ export { default as RankedCard } from './layout/card/RankedCard.svelte';
 export { default as Alert } from './elements/alert/Alert.svelte';
 export { default as Pagination } from './elements/pagination/Pagination.svelte';
 export type { PaginationProps } from './elements/pagination/Pagination.svelte';
-export type TabProps = {
-    value: string;
-    label: string;
-    icon?: Component;
-    selected?: boolean;
-    disabled?: boolean;
-    color?: VariantColors;
-    size?: VariantSizes;
-    variant?: 'line' | 'pill';
-    onclick?: (event: Event) => void;
-    testId?: string;
-};
-export type TabsGroupProps = {
-    tabs: TabItem[];
-    selected?: string;
-    color?: VariantColors;
-    size?: VariantSizes;
-    variant?: 'line' | 'pill';
-    class?: ClassValue;
-    listClass?: ClassValue;
-    triggerClass?: ClassValue;
-    panelClass?: ClassValue;
-    children?: Snippet<[active: string]>;
-    onchange?: (value: string) => void;
-    testId?: string;
-};
-export type TabContentProps = {
-    value: string;
-    persisted?: boolean;
-    panelClass?: ClassValue;
-    children?: Snippet<[value: string]>;
-    testId?: string;
-};
 export { default as Tab } from './layout/tabs/Tab.svelte';
 export { default as TabContent } from './layout/tabs/TabContent.svelte';
 export { default as TabGroup } from './layout/tabs/TabGroup.svelte';
@@ -474,217 +66,10 @@ export { default as Sidebar } from './layout/sidebar/Sidebar.svelte';
 export { default as NavItem } from './layout/sidebar/NavItem.svelte';
 export { default as NavGroup } from './layout/sidebar/NavGroup.svelte';
 export { default as ActivityList } from './layout/activity-list/ActivityList.svelte';
-export { dropdownMenu } from './elements/dropdown/dropdown.js';
-export { badge } from './elements/badge/badge.js';
-export { buttonVariants } from './button/button.js';
-export { modal } from './modal/modal.js';
-export { drawer } from './drawer/drawer.js';
-export { selectTV } from './elements/dropdown/select.js';
-export { breadcrumbs } from './header/breadcrumbs.js';
-export { metricCard } from './layout/card/metric-card.js';
-export { rankedCard } from './layout/card/ranked-card.js';
-export { activityList } from './layout/activity-list/activity-list.js';
-export type ChartColorKey = keyof typeof ChartColor;
-export type ChartColorValue = (typeof ChartColor)[ChartColorKey];
-export type ChartColors = {
-    [K in ChartColorValue]: string;
-};
-export type ChartType = 'line' | 'bar' | 'horizontal-bar' | 'pie' | 'stacked-bar';
-export type ChartColorString = `#${string}` | keyof ChartColors;
-export type XAxisConfig<T> = {
-    dataKey: keyof T;
-    label?: string;
-    format?: (value: any) => string;
-    tick?: {
-        fontSize?: number;
-        rotate?: number;
-        interval?: number | 'auto' | Function;
-    };
-    axisLine?: {
-        show?: boolean;
-        lineStyle?: {
-            color?: string;
-            width?: number;
-            type?: 'solid' | 'dashed' | 'dotted';
-        };
-    };
-};
-export type YAxisConfig<T> = {
-    dataKey: keyof T;
-    label?: string;
-    format?: (value: any) => string;
-    unit?: string;
-    position?: 'left' | 'right';
-    min?: number;
-    max?: number;
-    axisLine?: {
-        show?: boolean;
-        lineStyle?: {
-            color?: string;
-            width?: number;
-            type?: 'solid' | 'dashed' | 'dotted';
-        };
-    };
-};
-export interface SeriesConfig<T> {
-    dataKey: keyof T;
-    name?: string;
-    type?: ChartType;
-    color?: ChartColorString;
-    yAxisIndex?: number;
-    stack?: string;
-    barWidth?: string;
-    showArea?: boolean;
-    showSymbol?: boolean;
-    showLabel?: boolean;
-    smooth?: boolean;
-    areaOpacity?: number;
-    lineWidth?: number;
-    opacity?: number;
-    lineStyle?: {
-        type?: 'solid' | 'dashed' | 'dotted';
-        width?: number;
-        color?: string;
-    };
-    emphasis?: {
-        focus?: 'series' | 'self' | 'none';
-    };
-    radius?: [string, string];
-    centerText?: string;
-}
-export interface GridConfig {
-    horizontal?: boolean;
-    vertical?: boolean;
-    containLabel?: boolean;
-    top?: number | string;
-    right?: number | string;
-    bottom?: number | string;
-    left?: number | string;
-}
-export interface LegendConfig {
-    show?: boolean;
-    position?: 'top' | 'bottom' | 'left' | 'right';
-    orient?: 'horizontal' | 'vertical';
-}
-export interface TooltipConfig {
-    show?: boolean;
-    trigger?: 'item' | 'axis' | 'none';
-    formatter?: string | ((params: any) => string);
-}
-export interface ToolboxConfig {
-    show?: boolean;
-    features?: {
-        saveAsImage?: boolean;
-        dataView?: boolean;
-        dataZoom?: boolean;
-        magicType?: boolean;
-        restore?: boolean;
-    };
-}
-export type ChartConfig<T> = {
-    xAxis: XAxisConfig<T>;
-    yAxis: YAxisConfig<T>[];
-    series: SeriesConfig<T>[];
-    grid?: GridConfig;
-    legend?: LegendConfig;
-    tooltip?: TooltipConfig;
-    toolbox?: ToolboxConfig;
-    showAxisLines?: boolean;
-};
-export interface PointClickType<T> {
-    detail: {
-        seriesIndex: number;
-        dataIndex: number;
-        seriesName: string;
-        name: string;
-        value?: number | string | null;
-        originalData: T;
-    };
-}
-export interface ChartRenderType<T> {
-    detail: {
-        chart: ECharts;
-        options: ChartConfig<T>;
-    };
-}
-export interface ChartProps<T> {
-    data: T[];
-    config: ChartConfig<T>;
-    colors?: Partial<ChartColors>;
-    height?: string;
-    width?: string;
-    class?: ClassValue;
-    onpointclick?: (event: PointClickType<T>) => void;
-    onchartrender?: (event: ChartRenderType<T>) => void;
-    testId?: string;
-}
+export { default as Progress } from './elements/progress/Progress.svelte';
+export { default as Accordion } from './elements/accordion/Accordion.svelte';
+export { default as Timeline } from './elements/timeline/Timeline.svelte';
 export { default as Chart } from './charts/Chart.svelte';
-export interface FileUploadProps {
-    /**
-     * Array of allowed file MIME types or extensions
-     * @example ['image/jpeg', 'image/png']
-     */
-    allowedMimeTypes?: string[];
-    /**
-     * Maximum file size in bytes
-     */
-    maxSize?: number;
-    /**
-     * Maximum number of files that can be uploaded; maxFiles<=0 is disabled, maxFiles=1 is singular, maxFiles>1 is multiple
-     * @default 10
-     */
-    maxFiles?: number;
-    /**
-     * CSS class for the component container
-     */
-    class?: ClassValue;
-    /**
-     * CSS class for the dropzone
-     */
-    dropzoneClass?: ClassValue;
-    /**
-     * ID for the file input element
-     * @default 'file-upload'
-     */
-    id?: string;
-    /**
-     * Callback when files are selected or dropped
-     */
-    onfiles?: (files: FileList | File[]) => void;
-    /**
-     * Content to display when no files are uploaded
-     */
-    uploadContent?: Snippet;
-    testId?: string;
-}
-export interface FilePreviewProps {
-    files: UploadedFile[];
-    ondelete?: (fileId: string, index: number) => void;
-    class?: ClassValue;
-    testId?: string;
-}
-export interface UploadedFile {
-    FileID: string;
-    OriginalFilename: string;
-    Size: number;
-    ContentType: string;
-    MD5Hash: string;
-    UploadTimestamp: string;
-    Expiry?: string;
-    CustomMetadata?: Record<string, string>;
-    /**
-     * Current status of the file
-     */
-    status: 'uploading' | 'success' | 'error';
-    /**
-     * Upload progress (0-100)
-     */
-    progress?: number;
-    /**
-     * Error message if upload failed
-     */
-    error?: string;
-}
 export { default as FileUpload } from './elements/file-upload/FileUpload.svelte';
 export { default as FilesPreview } from './elements/file-upload/FilesPreview.svelte';
 export { default as Toaster } from './sonner/sonner.svelte';
@@ -692,129 +77,6 @@ export { default as AIChatInterface } from './ai/AIChatInterface.svelte';
 export { default as MermaidRenderer } from './ai/MermaidRenderer.svelte';
 export { default as CodeRenderer } from './ai/CodeRenderer.svelte';
 export * from './ai/content-detector.js';
-export interface FormProps<T extends Record<string, unknown>> {
-    form: SuperForm<any>;
-    class?: ClassValue;
-    method?: 'GET' | 'POST' | 'dialog' | 'get' | 'post' | 'DIALOG' | null | undefined;
-    action?: string;
-    enctype?: 'application/x-www-form-urlencoded' | 'multipart/form-data' | 'text/plain' | null | undefined;
-    autocomplete?: 'on' | 'off';
-    novalidate?: boolean;
-    children?: Snippet;
-    testId?: string;
-}
-export type InputProps = {
-    type?: 'text' | 'email' | 'password' | 'number' | 'tel' | 'url' | 'date' | 'textarea';
-    value?: string | number;
-    name: string;
-    label?: string;
-    placeholder?: string;
-    required?: boolean;
-    disabled?: boolean;
-    class?: ClassValue;
-    size?: VariantSizes;
-    id?: string;
-    errors?: string[];
-    testId?: string;
-} & DOMAttributes<HTMLInputElement>;
-export type RadioOption = {
-    value: string;
-    label: string;
-};
-export type RadioInputsProps = {
-    name: string;
-    label?: string;
-    options: RadioOption[];
-    value?: string;
-    disabled?: boolean;
-    class?: ClassValue;
-    size?: VariantSizes;
-    color?: VariantColors;
-    errors?: string[];
-    required?: boolean;
-    testId?: string;
-};
-export type CheckboxProps = {
-    name: string;
-    label?: string;
-    value?: boolean;
-    disabled?: boolean;
-    class?: ClassValue;
-    size?: VariantSizes;
-    color?: VariantColors;
-    errors?: string[];
-    required?: boolean;
-    testId?: string;
-};
-export interface ToggleProps {
-    name: string;
-    label?: string;
-    disabled?: boolean;
-    class?: ClassValue;
-    value?: boolean;
-    size?: VariantSizes;
-    color?: VariantColors;
-    id?: string;
-    errors?: string[];
-    offColor?: string;
-    onColor?: string;
-    testId?: string;
-}
-export type CurrencyOption = {
-    value: string;
-    icon?: Component;
-};
-export type NumberInputProps = {
-    value?: number;
-    name?: string;
-    label?: string;
-    placeholder?: string;
-    size?: VariantSizes;
-    class?: ClassValue;
-    unit?: string;
-    units?: CurrencyOption[];
-    errors?: string[];
-    disabled?: boolean;
-    dropdownicon?: Component;
-    onunitchange?: (prevUnit: string, newUnit: string) => void;
-    testId?: string;
-};
-export interface DateRangeProps {
-    startDate?: Date;
-    endDate?: Date;
-    minDate?: Date;
-    maxDate?: Date;
-    disabled?: boolean;
-    class?: ClassValue;
-    placeholder?: string;
-    startLabel?: string;
-    endLabel?: string;
-    format?: string;
-    onselect?: ({ startDate, endDate }: {
-        startDate?: Date;
-        endDate?: Date;
-    }) => void;
-    id?: string;
-    name?: string;
-    testId?: string;
-}
-export interface DateSelectEvent {
-    startDate: Date | null;
-    endDate: Date | null;
-}
-export type TagsProps = {
-    value?: string[];
-    name?: string;
-    label?: string;
-    errors?: string[];
-    placeholder?: string;
-    size?: VariantSizes;
-    class?: ClassValue;
-    suggestions?: string[];
-    onaddtag?: (tag: string) => void;
-    onremovetag?: (tag: string) => void;
-    testId?: string;
-};
 export { default as Form } from './forms/Form.svelte';
 export { default as Input } from './forms/Input.svelte';
 export { default as RadioInputs } from './forms/RadioInputs.svelte';
@@ -825,353 +87,21 @@ export { default as NumberInput } from './forms/NumberInput.svelte';
 export { default as DateRange } from './forms/DateRange.svelte';
 export { default as Tags } from './forms/Tags.svelte';
 export { default as RadioPill } from './forms/RadioPill.svelte';
-export type SliderMode = 'single' | 'range' | 'enum';
-export type NotationType = 'standard' | 'compact' | 'scientific' | 'engineering';
-export type EnumOption = {
-    value: string | number;
-    label: string;
-};
-export interface SliderProps {
-    name: string;
-    label?: string;
-    mode?: SliderMode;
-    disabled?: boolean;
-    size?: VariantSizes;
-    errors?: string[];
-    class?: ClassValue;
-    min?: number;
-    max?: number;
-    step?: number;
-    value?: number | string;
-    valueStart?: number;
-    valueEnd?: number;
-    showValue?: boolean;
-    valuePrefix?: string;
-    valueSuffix?: string;
-    options?: EnumOption[];
-    formatOptions?: Intl.NumberFormatOptions & {
-        notation?: NotationType;
-    };
-    testId?: string;
-}
-export type ProgressSegment = {
-    value: number;
-    color: VariantColors;
-    label?: string;
-};
-export type ProgressProps = {
-    value: number;
-    max?: number;
-    size?: VariantSizes;
-    color?: VariantColors;
-    showLabel?: boolean;
-    labelPosition?: 'top' | 'bottom' | 'right';
-    segments?: ProgressSegment[];
-    showLabels?: boolean;
-    showValues?: boolean;
-    class?: ClassValue;
-    labelClass?: ClassValue;
-    barClass?: ClassValue;
-    testId?: string;
-};
-export { default as Progress } from './elements/progress/Progress.svelte';
-export type AccordionProps = {
-    id?: string;
-    title?: string;
-    description?: string;
-    children?: Snippet;
-    summary?: Snippet;
-    open?: boolean;
-    color?: VariantColors;
-    class?: ClassValue;
-    /** @deprecated Use titleClass instead */
-    titleclass?: ClassValue;
-    titleClass?: ClassValue;
-    /** @deprecated Use bodyClass instead */
-    bodyclass?: ClassValue;
-    bodyClass?: ClassValue;
-    /** @deprecated Use headerClass instead */
-    headerclass?: ClassValue;
-    headerClass?: ClassValue;
-    icon?: Component;
-    iconPosition?: 'start' | 'end';
-    bordered?: boolean;
-    onexpand?: () => void;
-    oncollapse?: () => void;
-    testId?: string;
-};
-export { default as Accordion } from './elements/accordion/Accordion.svelte';
-export interface TimelineItem {
-    title: string;
-    time: Date | string;
-    link?: {
-        text: string;
-        url: string;
-    };
-    Icon?: Component;
-    details?: string;
-}
-export { default as Timeline } from './elements/timeline/Timeline.svelte';
-export type RadioPillProps = {
-    name: string;
-    options: RadioOption[];
-    value?: string;
-    label?: string;
-    class?: ClassValue;
-    errors?: string[];
-    onchange?: (value: string) => void;
-    testId?: string;
-};
-export type FilterTab = {
-    value: string;
-    label: string;
-};
-export type FilterGroup = {
-    key: string;
-    label: string;
-    tabs: FilterTab[];
-    selectedValue: string;
-    onChange: (value: string) => void;
-    minWidth?: string;
-};
-export type CompactFiltersProps = {
-    filterGroups: FilterGroup[];
-    isExpanded?: boolean;
-    title?: string;
-    class?: ClassValue;
-    summaryClass?: ClassValue;
-    expandedClass?: ClassValue;
-    FilterIcon?: Component;
-    testId?: string;
-};
-export type ActivityItemBadge = {
-    text: string;
-    class: string;
-};
-export type ActivityItemAction = {
-    label: string;
-    onClick?: () => void;
-};
-export type ActivityItem = {
-    title: string;
-    subtitle?: string;
-    badges?: ActivityItemBadge[];
-    actions?: ActivityItemAction[];
-};
-export type ActivityListProps = {
-    title?: string;
-    items?: ActivityItem[];
-    color?: VariantColors;
-    class?: ClassValue;
-    headerClass?: ClassValue;
-    titleClass?: ClassValue;
-    contentClass?: ClassValue;
-    itemClass?: ClassValue;
-    onItemClick?: (item: ActivityItem, index: number) => void;
-    children?: Snippet;
-    testId?: string;
-};
+export { dropdownMenu } from './elements/dropdown/dropdown.js';
+export { badge } from './elements/badge/badge.js';
+export { buttonVariants } from './button/button.js';
+export { modal } from './modal/modal.js';
+export { drawer } from './drawer/drawer.js';
+export { selectTV } from './elements/dropdown/select.js';
+export { breadcrumbs } from './header/breadcrumbs.js';
+export { metricCard } from './layout/card/metric-card.js';
+export { rankedCard } from './layout/card/ranked-card.js';
+export { activityList } from './layout/activity-list/activity-list.js';
+export { slider } from './forms/slider.js';
 export { CompactFilters } from './filters/index.js';
 export * from './file-browser/index.js';
 export * from './adapters/storage/index.js';
 export * from './adapters/ai/index.js';
-export type ChatMessageType = 'chat' | 'action' | 'thinking';
-export type StreamingCallback = (response: ChatResponse) => void;
-export interface ChatAction {
-    type: string;
-    data: any;
-    metadata?: Record<string, any>;
-}
-export interface ChatMessage {
-    id: string;
-    type: ChatMessageType;
-    content: string;
-    timestamp: Date;
-    action?: ChatAction;
-    thinkingContent?: string;
-    isThinkingComplete?: boolean;
-}
-export interface ChatResponse {
-    type: ChatMessageType;
-    content: string;
-    action?: ChatAction;
-    messageId?: string;
-    isStreaming?: boolean;
-    isStreamEnd?: boolean;
-    thinkingContent?: string;
-    isThinkingComplete?: boolean;
-}
-export interface QuickAction {
-    label: string;
-    prompt: string;
-    icon?: Component;
-}
-export interface FileBrowserProps {
-    adapter: StorageAdapter;
-    startPath?: string;
-    actions?: FileAction[];
-    selectedFiles?: string[];
-    infoSection?: (props: {
-        selectedFiles: string[];
-        navToFileFolder: (fileKey: string) => void;
-    }) => any;
-    testId?: string;
-}
-export interface GetUsersOptions {
-    page: number;
-    pageSize: number;
-    sortBy?: string;
-    sortOrder?: 'asc' | 'desc';
-    query?: string;
-}
-export interface GetUsersResult {
-    users: User[];
-    totalUsers: number;
-}
-export interface UserEmail {
-    email_address: string;
-    verified?: boolean;
-}
-export interface UserPhone {
-    phone_number: string;
-    verified?: boolean;
-}
-export interface User {
-    id: string;
-    first_name?: string;
-    last_name?: string;
-    username?: string;
-    email_addresses?: UserEmail[];
-    phone_numbers?: UserPhone[];
-    image_url?: string;
-    created_at?: number;
-    last_sign_in_at?: number;
-    private_metadata?: Record<string, unknown>;
-    public_metadata?: Record<string, unknown>;
-    permissions?: string[];
-    role?: string;
-}
-export interface Permission {
-    id: string;
-    name: string;
-    description?: string;
-    category?: string;
-}
-export interface Role {
-    value: string;
-    label: string;
-    description?: string;
-    permissions: string[];
-}
-export interface UserTableProps {
-    users: User[];
-    loading?: boolean;
-    currentPage?: number;
-    pageSize?: number;
-    totalUsers?: number;
-    onPageChange: (page: number) => void;
-    onPageSizeChange: (size: number) => void;
-    onSort?: (state: {
-        column: string | null;
-        direction: 'asc' | 'desc' | null;
-    }) => void;
-    onView: (user: User) => void;
-    onEdit: (user: User) => void;
-    onDelete: (userId: string) => void;
-    class?: ClassValue;
-    testId?: string;
-}
-export interface UserModalProps {
-    open?: boolean;
-    user?: User | null;
-    roles?: Role[];
-    adapter?: UserManagementAdapter;
-    loadingPermissions?: boolean;
-    onSave: (user: User, mode: 'create' | 'edit') => void | Promise<void>;
-    onClose?: () => void;
-    class?: ClassValue;
-    testId?: string;
-}
-export interface UserViewModalProps {
-    open?: boolean;
-    user: User | null;
-    permissions?: Permission[];
-    roles?: Role[];
-    onEdit?: (user: User) => void;
-    onRegenerateApiKey?: (userId: string) => Promise<void>;
-    onClose: () => void;
-    class?: ClassValue;
-    testId?: string;
-}
-/**
- * User Management Adapter Interface
- *
- * Defines the contract for user management adapters.
- * Adapters can be remote function modules (returning RemoteQuery/RemoteCommand)
- * or regular async function modules (returning Promise).
- *
- * Uses PromiseLike to accept both Promise and RemoteQuery/RemoteCommand types.
- */
-export interface UserManagementAdapter {
-    getUsers: (options: GetUsersOptions) => PromiseLike<GetUsersResult>;
-    createUser: (userData: Partial<User>) => PromiseLike<User>;
-    updateUser: (options: {
-        userId: string;
-        userData: Partial<User>;
-    }) => PromiseLike<User>;
-    deleteUser: (userId: string) => PromiseLike<void>;
-    deleteUsers: (userIds: string[]) => PromiseLike<void>;
-    getUserPermissions: (userId: string) => PromiseLike<string[]>;
-    updateUserPermissions: (options: {
-        userId: string;
-        permissions: string[];
-    }) => PromiseLike<void>;
-    generateApiKey?: (options: {
-        userId: string;
-        permissions: string[];
-        revokeOld?: boolean;
-    }) => PromiseLike<{
-        success: boolean;
-        apiKey: string;
-        message: string;
-        verificationWarning?: string;
-    }>;
-    verifyToken?: (options: {
-        apiKey: string;
-    }) => PromiseLike<{
-        valid: boolean;
-        scopes?: string[];
-        error?: string;
-        token?: string;
-    }>;
-}
-export interface UserManagementProps {
-    /**
-     * Adapter module containing remote functions or async functions
-     * Should be imported from a .remote.ts file
-     * If not provided, uses the default adapter from @makolabs/ripple
-     *
-     * Example:
-     * ```ts
-     * import * as adapter from './adapter.remote';
-     * <UserManagement adapter={adapter} roles={roles} />
-     * ```
-     */
-    adapter: UserManagementAdapter;
-    /**
-     * Available roles for user assignment
-     */
-    roles?: Role[];
-    /**
-     * Available permissions for display (optional)
-     */
-    permissions?: Permission[];
-    class?: ClassValue;
-    testId?: string;
-}
-export interface FormErrors {
-    [key: string]: string;
-}
 export { getUserDisplayName, getUserInitials } from './user-management/user-management.js';
 export { default as UserManagement } from './user-management/UserManagement.svelte';
 export { default as UserTable } from './user-management/UserTable.svelte';