@bricks-toolkit/toolkit 0.1.12 → 0.1.14

package/dist/combo-box/index.d.mts

@@ -0,0 +1,62 @@
+import { InputHTMLAttributes, ReactNode } from 'react';
+
+type ComboBoxSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+type ComboBoxState = 'default' | 'error' | 'success' | 'warning';
+interface ComboBoxOption {
+    /** The underlying value submitted/returned. */
+    value: string;
+    /** The human-readable label shown in the dropdown and input. */
+    label: string;
+    /** When true the option is shown but cannot be selected. */
+    disabled?: boolean;
+}
+interface ComboBoxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size' | 'value' | 'onChange' | 'multiple'> {
+    /** List of selectable options. */
+    options: ComboBoxOption[];
+    /** Currently selected value(s). Pass string for single, string[] for multi. */
+    value?: string | string[];
+    /** Fired when selection changes. */
+    onChange?: (value: string | string[]) => void;
+    /** Allow selecting multiple options. Defaults to false. */
+    multiple?: boolean;
+    /** Allow the user to type and filter options. Defaults to true. */
+    searchable?: boolean;
+    /** Show a clear (×) button when a value is selected. Defaults to false. */
+    clearable?: boolean;
+    /** Field label rendered above the input. */
+    label?: string;
+    /** Makes the label show a required asterisk. */
+    required?: boolean;
+    /** Helper text shown below the field. */
+    helperText?: string;
+    /** Message shown when state = 'error'. */
+    errorMessage?: string;
+    /** Message shown when state = 'success'. */
+    successMessage?: string;
+    /** Message shown when state = 'warning'. */
+    warningMessage?: string;
+    /** Visual / validation state. Defaults to 'default'. */
+    state?: ComboBoxState;
+    /** Input size. Defaults to 'md'. */
+    size?: ComboBoxSize;
+    /** Stretch to fill its container. Defaults to true. */
+    fullWidth?: boolean;
+    /** Placeholder shown in the input when nothing is selected. */
+    placeholder?: string;
+    /** Rendered when no options match the current search query. */
+    noOptionsMessage?: ReactNode;
+    /** Additional class for the outer wrapper div. */
+    wrapperClassName?: string;
+    /** Additional class for the trigger / input element. */
+    inputClassName?: string;
+    /** Additional class for the dropdown list. */
+    listClassName?: string;
+    /** Additional class for the label element. */
+    labelClassName?: string;
+    /** Additional class for helper / state message text. */
+    helperClassName?: string;
+}
+
+declare const ComboBox: React.ForwardRefExoticComponent<ComboBoxProps & React.RefAttributes<HTMLInputElement>>;
+
+export { ComboBox, type ComboBoxOption, type ComboBoxProps, type ComboBoxSize, type ComboBoxState };

package/dist/combo-box/index.d.ts

@@ -0,0 +1,62 @@
+import { InputHTMLAttributes, ReactNode } from 'react';
+
+type ComboBoxSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+type ComboBoxState = 'default' | 'error' | 'success' | 'warning';
+interface ComboBoxOption {
+    /** The underlying value submitted/returned. */
+    value: string;
+    /** The human-readable label shown in the dropdown and input. */
+    label: string;
+    /** When true the option is shown but cannot be selected. */
+    disabled?: boolean;
+}
+interface ComboBoxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size' | 'value' | 'onChange' | 'multiple'> {
+    /** List of selectable options. */
+    options: ComboBoxOption[];
+    /** Currently selected value(s). Pass string for single, string[] for multi. */
+    value?: string | string[];
+    /** Fired when selection changes. */
+    onChange?: (value: string | string[]) => void;
+    /** Allow selecting multiple options. Defaults to false. */
+    multiple?: boolean;
+    /** Allow the user to type and filter options. Defaults to true. */
+    searchable?: boolean;
+    /** Show a clear (×) button when a value is selected. Defaults to false. */
+    clearable?: boolean;
+    /** Field label rendered above the input. */
+    label?: string;
+    /** Makes the label show a required asterisk. */
+    required?: boolean;
+    /** Helper text shown below the field. */
+    helperText?: string;
+    /** Message shown when state = 'error'. */
+    errorMessage?: string;
+    /** Message shown when state = 'success'. */
+    successMessage?: string;
+    /** Message shown when state = 'warning'. */
+    warningMessage?: string;
+    /** Visual / validation state. Defaults to 'default'. */
+    state?: ComboBoxState;
+    /** Input size. Defaults to 'md'. */
+    size?: ComboBoxSize;
+    /** Stretch to fill its container. Defaults to true. */
+    fullWidth?: boolean;
+    /** Placeholder shown in the input when nothing is selected. */
+    placeholder?: string;
+    /** Rendered when no options match the current search query. */
+    noOptionsMessage?: ReactNode;
+    /** Additional class for the outer wrapper div. */
+    wrapperClassName?: string;
+    /** Additional class for the trigger / input element. */
+    inputClassName?: string;
+    /** Additional class for the dropdown list. */
+    listClassName?: string;
+    /** Additional class for the label element. */
+    labelClassName?: string;
+    /** Additional class for helper / state message text. */
+    helperClassName?: string;
+}
+
+declare const ComboBox: React.ForwardRefExoticComponent<ComboBoxProps & React.RefAttributes<HTMLInputElement>>;
+
+export { ComboBox, type ComboBoxOption, type ComboBoxProps, type ComboBoxSize, type ComboBoxState };

package/dist/date-picker/index.d.mts

@@ -0,0 +1,32 @@
+import { InputHTMLAttributes, ReactNode } from 'react';
+
+type DatePickerVariant = 'default' | 'filled' | 'flushed' | 'unstyled';
+type DatePickerSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+type DatePickerState = 'default' | 'error' | 'success' | 'warning';
+interface DatePickerProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size' | 'prefix' | 'type'> {
+    label?: string;
+    required?: boolean;
+    helperText?: string;
+    errorMessage?: string;
+    successMessage?: string;
+    warningMessage?: string;
+    variant?: DatePickerVariant;
+    size?: DatePickerSize;
+    state?: DatePickerState;
+    fullWidth?: boolean;
+    leftElement?: ReactNode;
+    rightElement?: ReactNode;
+    prefix?: ReactNode;
+    suffix?: ReactNode;
+    wrapperClassName?: string;
+    inputGroupClassName?: string;
+    inputClassName?: string;
+    labelClassName?: string;
+    helperClassName?: string;
+    clearable?: boolean;
+    isLoading?: boolean;
+}
+
+declare const DatePicker: React.ForwardRefExoticComponent<DatePickerProps & React.RefAttributes<HTMLInputElement>>;
+
+export { DatePicker, type DatePickerProps, type DatePickerSize, type DatePickerState, type DatePickerVariant };

package/dist/date-picker/index.d.ts

@@ -0,0 +1,32 @@
+import { InputHTMLAttributes, ReactNode } from 'react';
+
+type DatePickerVariant = 'default' | 'filled' | 'flushed' | 'unstyled';
+type DatePickerSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+type DatePickerState = 'default' | 'error' | 'success' | 'warning';
+interface DatePickerProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size' | 'prefix' | 'type'> {
+    label?: string;
+    required?: boolean;
+    helperText?: string;
+    errorMessage?: string;
+    successMessage?: string;
+    warningMessage?: string;
+    variant?: DatePickerVariant;
+    size?: DatePickerSize;
+    state?: DatePickerState;
+    fullWidth?: boolean;
+    leftElement?: ReactNode;
+    rightElement?: ReactNode;
+    prefix?: ReactNode;
+    suffix?: ReactNode;
+    wrapperClassName?: string;
+    inputGroupClassName?: string;
+    inputClassName?: string;
+    labelClassName?: string;
+    helperClassName?: string;
+    clearable?: boolean;
+    isLoading?: boolean;
+}
+
+declare const DatePicker: React.ForwardRefExoticComponent<DatePickerProps & React.RefAttributes<HTMLInputElement>>;
+
+export { DatePicker, type DatePickerProps, type DatePickerSize, type DatePickerState, type DatePickerVariant };

package/dist/dialog/index.d.mts

@@ -0,0 +1,61 @@
+import { ReactNode } from 'react';
+
+type DialogSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl' | '7xl' | 'full';
+interface DialogProps {
+    /** If true, the dialog will be open. */
+    isOpen: boolean;
+    /** Callback invoked when the dialog should close. */
+    onClose: () => void;
+    /** The content of the dialog. Usually includes DialogHeader, DialogBody, and DialogFooter. */
+    children: ReactNode;
+    /** The size of the dialog. Defaults to 'md'. */
+    size?: DialogSize;
+    /** If true, the dialog will be centered on the screen. Defaults to false. */
+    isCentered?: boolean;
+    /** If true, the dialog will close when the overlay is clicked. Defaults to true. */
+    closeOnOverlayClick?: boolean;
+    /** If true, the dialog will close when the ESC key is pressed. Defaults to true. */
+    closeOnEsc?: boolean;
+    /** If true, focus will be trapped inside the dialog. Defaults to true. */
+    trapFocus?: boolean;
+    /** If true, the body scroll will be locked when the dialog is open. Defaults to true. */
+    lockScroll?: boolean;
+    /** Additional class names for the dialog content. */
+    contentClassName?: string;
+    /** Additional class names for the overlay. */
+    overlayClassName?: string;
+    /** If true, the backdrop will be visible. Defaults to true. */
+    showBackdrop?: boolean;
+    /** If true, the dialog will be treated as a modal (traps focus, locked scroll). Defaults to true. */
+    isModal?: boolean;
+    /** ARIA label for the dialog. */
+    ariaLabel?: string;
+    /** ID of the element that labels the dialog. */
+    ariaLabelledby?: string;
+    /** ID of the element that describes the dialog. */
+    ariaDescribedby?: string;
+}
+interface DialogHeaderProps {
+    children: ReactNode;
+    className?: string;
+}
+interface DialogBodyProps {
+    children: ReactNode;
+    className?: string;
+}
+interface DialogFooterProps {
+    children: ReactNode;
+    className?: string;
+}
+interface DialogCloseButtonProps {
+    onClick?: () => void;
+    className?: string;
+}
+
+declare function Dialog({ isOpen, onClose, children, size, isCentered, closeOnOverlayClick, closeOnEsc, trapFocus, lockScroll, contentClassName, overlayClassName, showBackdrop, isModal, ariaLabel, ariaLabelledby, ariaDescribedby, }: DialogProps): React.ReactPortal | null;
+declare function DialogHeader({ children, className }: DialogHeaderProps): React.JSX.Element;
+declare function DialogBody({ children, className }: DialogBodyProps): React.JSX.Element;
+declare function DialogFooter({ children, className }: DialogFooterProps): React.JSX.Element;
+declare function DialogCloseButton({ onClick, className, }: DialogCloseButtonProps): React.JSX.Element;
+
+export { Dialog, DialogBody, type DialogBodyProps, DialogCloseButton, type DialogCloseButtonProps, DialogFooter, type DialogFooterProps, DialogHeader, type DialogHeaderProps, type DialogProps, type DialogSize };

package/dist/dialog/index.d.ts

@@ -0,0 +1,61 @@
+import { ReactNode } from 'react';
+
+type DialogSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl' | '7xl' | 'full';
+interface DialogProps {
+    /** If true, the dialog will be open. */
+    isOpen: boolean;
+    /** Callback invoked when the dialog should close. */
+    onClose: () => void;
+    /** The content of the dialog. Usually includes DialogHeader, DialogBody, and DialogFooter. */
+    children: ReactNode;
+    /** The size of the dialog. Defaults to 'md'. */
+    size?: DialogSize;
+    /** If true, the dialog will be centered on the screen. Defaults to false. */
+    isCentered?: boolean;
+    /** If true, the dialog will close when the overlay is clicked. Defaults to true. */
+    closeOnOverlayClick?: boolean;
+    /** If true, the dialog will close when the ESC key is pressed. Defaults to true. */
+    closeOnEsc?: boolean;
+    /** If true, focus will be trapped inside the dialog. Defaults to true. */
+    trapFocus?: boolean;
+    /** If true, the body scroll will be locked when the dialog is open. Defaults to true. */
+    lockScroll?: boolean;
+    /** Additional class names for the dialog content. */
+    contentClassName?: string;
+    /** Additional class names for the overlay. */
+    overlayClassName?: string;
+    /** If true, the backdrop will be visible. Defaults to true. */
+    showBackdrop?: boolean;
+    /** If true, the dialog will be treated as a modal (traps focus, locked scroll). Defaults to true. */
+    isModal?: boolean;
+    /** ARIA label for the dialog. */
+    ariaLabel?: string;
+    /** ID of the element that labels the dialog. */
+    ariaLabelledby?: string;
+    /** ID of the element that describes the dialog. */
+    ariaDescribedby?: string;
+}
+interface DialogHeaderProps {
+    children: ReactNode;
+    className?: string;
+}
+interface DialogBodyProps {
+    children: ReactNode;
+    className?: string;
+}
+interface DialogFooterProps {
+    children: ReactNode;
+    className?: string;
+}
+interface DialogCloseButtonProps {
+    onClick?: () => void;
+    className?: string;
+}
+
+declare function Dialog({ isOpen, onClose, children, size, isCentered, closeOnOverlayClick, closeOnEsc, trapFocus, lockScroll, contentClassName, overlayClassName, showBackdrop, isModal, ariaLabel, ariaLabelledby, ariaDescribedby, }: DialogProps): React.ReactPortal | null;
+declare function DialogHeader({ children, className }: DialogHeaderProps): React.JSX.Element;
+declare function DialogBody({ children, className }: DialogBodyProps): React.JSX.Element;
+declare function DialogFooter({ children, className }: DialogFooterProps): React.JSX.Element;
+declare function DialogCloseButton({ onClick, className, }: DialogCloseButtonProps): React.JSX.Element;
+
+export { Dialog, DialogBody, type DialogBodyProps, DialogCloseButton, type DialogCloseButtonProps, DialogFooter, type DialogFooterProps, DialogHeader, type DialogHeaderProps, type DialogProps, type DialogSize };

package/dist/dropdown-menu/index.d.mts

@@ -0,0 +1,34 @@
+import * as React from 'react';
+import { ReactNode, HTMLAttributes, ButtonHTMLAttributes } from 'react';
+
+type DropdownMenuSize = 'sm' | 'md' | 'lg';
+type DropdownMenuVariant = 'default' | 'subtle' | 'ghost';
+interface DropdownMenuProps {
+    children: ReactNode;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    className?: string;
+}
+interface DropdownMenuTriggerProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    size?: DropdownMenuSize;
+    variant?: DropdownMenuVariant;
+}
+interface DropdownMenuContentProps extends HTMLAttributes<HTMLDivElement> {
+    align?: 'left' | 'right' | 'center';
+    width?: string | number;
+}
+interface DropdownMenuItemProps extends HTMLAttributes<HTMLDivElement> {
+    disabled?: boolean;
+    destructive?: boolean;
+    icon?: ReactNode;
+    shortcut?: string;
+}
+type DropdownMenuSeparatorProps = HTMLAttributes<HTMLDivElement>;
+
+declare const DropdownMenu: React.FC<DropdownMenuProps>;
+declare const DropdownMenuTrigger: React.ForwardRefExoticComponent<DropdownMenuTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const DropdownMenuContent: React.ForwardRefExoticComponent<DropdownMenuContentProps & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuItem: React.ForwardRefExoticComponent<DropdownMenuItemProps & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuSeparator: React.FC<DropdownMenuSeparatorProps>;
+
+export { DropdownMenu, DropdownMenuContent, type DropdownMenuContentProps, DropdownMenuItem, type DropdownMenuItemProps, type DropdownMenuProps, DropdownMenuSeparator, type DropdownMenuSeparatorProps, type DropdownMenuSize, DropdownMenuTrigger, type DropdownMenuTriggerProps, type DropdownMenuVariant };

package/dist/dropdown-menu/index.d.ts

@@ -0,0 +1,34 @@
+import * as React from 'react';
+import { ReactNode, HTMLAttributes, ButtonHTMLAttributes } from 'react';
+
+type DropdownMenuSize = 'sm' | 'md' | 'lg';
+type DropdownMenuVariant = 'default' | 'subtle' | 'ghost';
+interface DropdownMenuProps {
+    children: ReactNode;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    className?: string;
+}
+interface DropdownMenuTriggerProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    size?: DropdownMenuSize;
+    variant?: DropdownMenuVariant;
+}
+interface DropdownMenuContentProps extends HTMLAttributes<HTMLDivElement> {
+    align?: 'left' | 'right' | 'center';
+    width?: string | number;
+}
+interface DropdownMenuItemProps extends HTMLAttributes<HTMLDivElement> {
+    disabled?: boolean;
+    destructive?: boolean;
+    icon?: ReactNode;
+    shortcut?: string;
+}
+type DropdownMenuSeparatorProps = HTMLAttributes<HTMLDivElement>;
+
+declare const DropdownMenu: React.FC<DropdownMenuProps>;
+declare const DropdownMenuTrigger: React.ForwardRefExoticComponent<DropdownMenuTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const DropdownMenuContent: React.ForwardRefExoticComponent<DropdownMenuContentProps & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuItem: React.ForwardRefExoticComponent<DropdownMenuItemProps & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuSeparator: React.FC<DropdownMenuSeparatorProps>;
+
+export { DropdownMenu, DropdownMenuContent, type DropdownMenuContentProps, DropdownMenuItem, type DropdownMenuItemProps, type DropdownMenuProps, DropdownMenuSeparator, type DropdownMenuSeparatorProps, type DropdownMenuSize, DropdownMenuTrigger, type DropdownMenuTriggerProps, type DropdownMenuVariant };

package/dist/email/index.d.mts

@@ -0,0 +1,38 @@
+import { InputHTMLAttributes, ReactNode } from 'react';
+
+type EmailVariant = 'default' | 'filled' | 'flushed' | 'unstyled';
+type EmailSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+type EmailState = 'default' | 'error' | 'success' | 'warning';
+interface EmailProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size' | 'prefix' | 'type'> {
+    label?: string;
+    required?: boolean;
+    helperText?: string;
+    errorMessage?: string;
+    successMessage?: string;
+    warningMessage?: string;
+    variant?: EmailVariant;
+    size?: EmailSize;
+    state?: EmailState;
+    fullWidth?: boolean;
+    leftElement?: ReactNode;
+    rightElement?: ReactNode;
+    prefix?: ReactNode;
+    suffix?: ReactNode;
+    wrapperClassName?: string;
+    inputGroupClassName?: string;
+    inputClassName?: string;
+    labelClassName?: string;
+    helperClassName?: string;
+    clearable?: boolean;
+    isLoading?: boolean;
+    /**
+     * If true, allows the user to enter multiple email addresses separated by commas.
+     * Useful for "To" fields in email composers.
+     * @default false
+     */
+    multiple?: boolean;
+}
+
+declare const Email: React.ForwardRefExoticComponent<EmailProps & React.RefAttributes<HTMLInputElement>>;
+
+export { Email, type EmailProps, type EmailSize, type EmailState, type EmailVariant };

package/dist/email/index.d.ts

@@ -0,0 +1,38 @@
+import { InputHTMLAttributes, ReactNode } from 'react';
+
+type EmailVariant = 'default' | 'filled' | 'flushed' | 'unstyled';
+type EmailSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+type EmailState = 'default' | 'error' | 'success' | 'warning';
+interface EmailProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size' | 'prefix' | 'type'> {
+    label?: string;
+    required?: boolean;
+    helperText?: string;
+    errorMessage?: string;
+    successMessage?: string;
+    warningMessage?: string;
+    variant?: EmailVariant;
+    size?: EmailSize;
+    state?: EmailState;
+    fullWidth?: boolean;
+    leftElement?: ReactNode;
+    rightElement?: ReactNode;
+    prefix?: ReactNode;
+    suffix?: ReactNode;
+    wrapperClassName?: string;
+    inputGroupClassName?: string;
+    inputClassName?: string;
+    labelClassName?: string;
+    helperClassName?: string;
+    clearable?: boolean;
+    isLoading?: boolean;
+    /**
+     * If true, allows the user to enter multiple email addresses separated by commas.
+     * Useful for "To" fields in email composers.
+     * @default false
+     */
+    multiple?: boolean;
+}
+
+declare const Email: React.ForwardRefExoticComponent<EmailProps & React.RefAttributes<HTMLInputElement>>;
+
+export { Email, type EmailProps, type EmailSize, type EmailState, type EmailVariant };

package/dist/file-upload/index.d.mts

@@ -0,0 +1,27 @@
+import { InputHTMLAttributes, ReactNode } from 'react';
+
+type FileUploadSize = 'sm' | 'md' | 'lg';
+type FileUploadState = 'default' | 'error' | 'success' | 'warning';
+interface FileUploadProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size' | 'type' | 'value' | 'onChange'> {
+    label?: string;
+    required?: boolean;
+    helperText?: string;
+    errorMessage?: string;
+    successMessage?: string;
+    warningMessage?: string;
+    size?: FileUploadSize;
+    state?: FileUploadState;
+    fullWidth?: boolean;
+    wrapperClassName?: string;
+    labelClassName?: string;
+    helperClassName?: string;
+    dropzoneClassName?: string;
+    icon?: ReactNode;
+    maxSize?: number;
+    maxFiles?: number;
+    onFilesSelected?: (files: File[]) => void;
+}
+
+declare const FileUpload: React.ForwardRefExoticComponent<FileUploadProps & React.RefAttributes<HTMLInputElement>>;
+
+export { FileUpload, type FileUploadProps, type FileUploadSize, type FileUploadState };

package/dist/file-upload/index.d.ts

@@ -0,0 +1,27 @@
+import { InputHTMLAttributes, ReactNode } from 'react';
+
+type FileUploadSize = 'sm' | 'md' | 'lg';
+type FileUploadState = 'default' | 'error' | 'success' | 'warning';
+interface FileUploadProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size' | 'type' | 'value' | 'onChange'> {
+    label?: string;
+    required?: boolean;
+    helperText?: string;
+    errorMessage?: string;
+    successMessage?: string;
+    warningMessage?: string;
+    size?: FileUploadSize;
+    state?: FileUploadState;
+    fullWidth?: boolean;
+    wrapperClassName?: string;
+    labelClassName?: string;
+    helperClassName?: string;
+    dropzoneClassName?: string;
+    icon?: ReactNode;
+    maxSize?: number;
+    maxFiles?: number;
+    onFilesSelected?: (files: File[]) => void;
+}
+
+declare const FileUpload: React.ForwardRefExoticComponent<FileUploadProps & React.RefAttributes<HTMLInputElement>>;
+
+export { FileUpload, type FileUploadProps, type FileUploadSize, type FileUploadState };

package/dist/header/index.d.mts

@@ -0,0 +1,28 @@
+import { ReactNode } from 'react';
+
+interface HeaderProps {
+    /** Logo or brand element to display on the left. */
+    logo?: ReactNode;
+    /** Middle section content, often used for search. */
+    children?: ReactNode;
+    /** Array of menu items or icons for the right side actions. */
+    actions?: ReactNode;
+    /** Optional user profile section content. */
+    userSection?: ReactNode;
+    /** Whether the header is sticky at the top. */
+    isSticky?: boolean;
+    /** Additional CSS classes for the container. */
+    className?: string;
+    /** Whether to show the glass effect. */
+    glass?: boolean;
+    /** Sidebar toggle click handler (for mobile). */
+    onMenuToggle?: () => void;
+}
+
+interface HeaderComponent {
+    (props: HeaderProps): React.JSX.Element;
+    displayName?: string;
+}
+declare const Header: HeaderComponent;
+
+export { Header, type HeaderProps };

package/dist/header/index.d.ts

@@ -0,0 +1,28 @@
+import { ReactNode } from 'react';
+
+interface HeaderProps {
+    /** Logo or brand element to display on the left. */
+    logo?: ReactNode;
+    /** Middle section content, often used for search. */
+    children?: ReactNode;
+    /** Array of menu items or icons for the right side actions. */
+    actions?: ReactNode;
+    /** Optional user profile section content. */
+    userSection?: ReactNode;
+    /** Whether the header is sticky at the top. */
+    isSticky?: boolean;
+    /** Additional CSS classes for the container. */
+    className?: string;
+    /** Whether to show the glass effect. */
+    glass?: boolean;
+    /** Sidebar toggle click handler (for mobile). */
+    onMenuToggle?: () => void;
+}
+
+interface HeaderComponent {
+    (props: HeaderProps): React.JSX.Element;
+    displayName?: string;
+}
+declare const Header: HeaderComponent;
+
+export { Header, type HeaderProps };

package/dist/icon-button/index.d.mts

@@ -0,0 +1,16 @@
+import { ReactNode } from 'react';
+import { B as ButtonProps } from '../Button.types-D-srlWFf.mjs';
+import '../Tooltip.types-PbUasE3C.mjs';
+
+interface IconButtonProps extends Omit<ButtonProps, 'children' | 'leftIcon' | 'rightIcon' | 'loadingText' | 'fullWidth'> {
+    /** The icon to display inside the button */
+    icon: ReactNode;
+    /** Accessible label for the icon button */
+    'aria-label': string;
+    /** Whether the button should be rounded/circular */
+    isRound?: boolean;
+}
+
+declare const IconButton: React.ForwardRefExoticComponent<IconButtonProps & React.RefAttributes<HTMLButtonElement>>;
+
+export { IconButton, type IconButtonProps };

package/dist/icon-button/index.d.ts

@@ -0,0 +1,16 @@
+import { ReactNode } from 'react';
+import { B as ButtonProps } from '../Button.types-BsQYqZml.js';
+import '../Tooltip.types-PbUasE3C.js';
+
+interface IconButtonProps extends Omit<ButtonProps, 'children' | 'leftIcon' | 'rightIcon' | 'loadingText' | 'fullWidth'> {
+    /** The icon to display inside the button */
+    icon: ReactNode;
+    /** Accessible label for the icon button */
+    'aria-label': string;
+    /** Whether the button should be rounded/circular */
+    isRound?: boolean;
+}
+
+declare const IconButton: React.ForwardRefExoticComponent<IconButtonProps & React.RefAttributes<HTMLButtonElement>>;
+
+export { IconButton, type IconButtonProps };

package/dist/image/index.d.mts

@@ -0,0 +1,48 @@
+import React__default, { ImgHTMLAttributes, ReactNode } from 'react';
+
+interface ImageProps extends ImgHTMLAttributes<HTMLImageElement> {
+    /**
+     * The source URL of the image.
+     */
+    src: string;
+    /**
+     * The alt text for the image.
+     */
+    alt: string;
+    /**
+     * Optional fallback component or image URL to show if the image fails to load.
+     */
+    fallback?: ReactNode;
+    /**
+     * Optional component to show while the image is loading.
+     * If not provided, a default Skeleton will be used.
+     */
+    loadingComponent?: ReactNode;
+    /**
+     * Whether to show a skeleton loader while loading.
+     * @default true
+     */
+    showSkeleton?: boolean;
+    /**
+     * The aspect ratio of the image container.
+     * Useful to prevent layout shift.
+     * Example: '16/9', '1/1', '4/3'
+     */
+    aspectRatio?: string;
+    /**
+     * How the image should be fitted in its container.
+     * @default 'cover'
+     */
+    objectFit?: 'cover' | 'contain' | 'fill' | 'none' | 'scale-down';
+    /**
+     * Container className.
+     */
+    containerClassName?: string;
+}
+
+/**
+ * A robust Image component with built-in loading states and error handling.
+ */
+declare const Image: React__default.ForwardRefExoticComponent<ImageProps & React__default.RefAttributes<HTMLImageElement>>;
+
+export { Image, type ImageProps };