@rufous/ui 0.3.1 → 0.3.7

package/dist/main.d.ts

@@ -1,5 +1,6 @@
 import * as React from 'react';
 import React__default, { ReactNode, CSSProperties, InputHTMLAttributes, TextareaHTMLAttributes, ReactElement, ComponentType } from 'react';
+import { ICity, ICountry, IState } from 'country-state-city';
 
 declare const APP_THEMES: {
     default: {
@@ -103,30 +104,47 @@ declare const APP_THEMES: {
     };
 };
 
-interface ArchivedIconProps extends React__default.SVGProps<SVGSVGElement> {
+interface MinusIconProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
+}
+declare const MinusIcon: React.FC<MinusIconProps>;
+
+interface PlusIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const PlusIcon: React.FC<PlusIconProps>;
+
+interface ArchivedIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
 }
-declare const ArchivedIcon: React__default.FC<ArchivedIconProps>;
+declare const ArchivedIcon: React.FC<ArchivedIconProps>;
 
-interface CopyIconProps extends React__default.SVGProps<SVGSVGElement> {
+interface CopyIconProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
-declare const CopyIcon: React__default.FC<CopyIconProps>;
+declare const CopyIcon: React.FC<CopyIconProps>;
 
 interface EditIconProps extends React__default.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
 declare const EditIcon: React__default.FC<EditIconProps>;
 
 interface HeplOutlinedIconProps extends React__default.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
 declare const HelpOutlinedIcon: React__default.FC<HeplOutlinedIconProps>;
 
-interface HierarchyIconProps extends React__default.SVGProps<SVGSVGElement> {
+interface HierarchyIconProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
-declare const HierarchyIcon: React__default.FC<HierarchyIconProps>;
+declare const HierarchyIcon: React.FC<HierarchyIconProps>;
 
 interface NineDotMenuIconProps extends React__default.SVGProps<SVGSVGElement> {
     color?: string;
@@ -138,108 +156,128 @@ interface RufousLauncherIconProps extends React__default.SVGProps<SVGSVGElement>
 }
 declare const RufousLauncherIcon: React__default.FC<RufousLauncherIconProps>;
 
-interface UnArchivedIconProps extends React__default.SVGProps<SVGSVGElement> {
+interface UnArchivedIconProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
-declare const UnArchivedIcon: React__default.FC<UnArchivedIconProps>;
+declare const UnArchivedIcon: React.FC<UnArchivedIconProps>;
 
-interface WorkItemIconProps extends React__default.SVGProps<SVGSVGElement> {
+interface WorkItemIconProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
-declare const WorkItemIcon: React__default.FC<WorkItemIconProps>;
+declare const WorkItemIcon: React.FC<WorkItemIconProps>;
 
-interface DownloadIconProps extends React__default.SVGProps<SVGSVGElement> {
+interface DownloadIconProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
-declare const DownloadIcon: React__default.FC<DownloadIconProps>;
+declare const DownloadIcon: React.FC<DownloadIconProps>;
 
 interface ActivateUserProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
 declare const ActivateUserIcon: React.FC<ActivateUserProps>;
 
 interface AssignGroupProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
 declare const AssignGroupIcon: React.FC<AssignGroupProps>;
 
 interface DifficultyAllProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
 declare const DifficultyAllIcon: React.FC<DifficultyAllProps>;
 
 interface DifficultyEasyProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
 declare const DifficultyEasyIcon: React.FC<DifficultyEasyProps>;
 
 interface DifficultyHardProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
 declare const DifficultyHardIcon: React.FC<DifficultyHardProps>;
 
 interface DifficultyMediumProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
 declare const DifficultyMediumIcon: React.FC<DifficultyMediumProps>;
 
 interface InactiveGroupProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
 declare const InactiveGroupIcon: React.FC<InactiveGroupProps>;
 
-interface InvoiceProps extends React.SVGProps<SVGSVGElement> {
+interface InvoiceIconProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
-declare const InvoiceIcon: React.FC<InvoiceProps>;
+declare const InvoiceIcon: React.FC<InvoiceIconProps>;
 
-interface LogsProps extends React.SVGProps<SVGSVGElement> {
+interface LogsIconProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
-declare const LogsIcon: React.FC<LogsProps>;
+declare const LogsIcon: React.FC<LogsIconProps>;
 
-interface QuestionStatusAllIconProps extends React.SVGProps<SVGSVGElement> {
+interface QuestionStatusAllProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
-declare const QuestionStatusAllIcon: React.FC<QuestionStatusAllIconProps>;
+declare const QuestionStatusAllIcon: React.FC<QuestionStatusAllProps>;
 
-interface QuestionStatusPrivateIconProps extends React.SVGProps<SVGSVGElement> {
+interface QuestionStatusPrivateProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
-declare const QuestionStatusPrivateIcon: React.FC<QuestionStatusPrivateIconProps>;
+declare const QuestionStatusPrivateIcon: React.FC<QuestionStatusPrivateProps>;
 
-interface QuestionStatusPublicIconProps extends React.SVGProps<SVGSVGElement> {
+interface QuestionStatusPublicProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
-declare const QuestionStatusPublicIcon: React.FC<QuestionStatusPublicIconProps>;
+declare const QuestionStatusPublicIcon: React.FC<QuestionStatusPublicProps>;
 
 interface QuestionTypeAllIconProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
 declare const QuestionTypeAllIcon: React.FC<QuestionTypeAllIconProps>;
 
-interface QuestionTypeCodingIconProps extends React.SVGProps<SVGSVGElement> {
+interface QuestionTypeCodingProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
-declare const QuestionTypeCodingIcon: React.FC<QuestionTypeCodingIconProps>;
+declare const QuestionTypeCodingIcon: React.FC<QuestionTypeCodingProps>;
 
-interface QuestionTypeDescriptiveIconProps extends React.SVGProps<SVGSVGElement> {
+interface QuestionTypeDescriptiveProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
-declare const QuestionTypeDescriptiveIcon: React.FC<QuestionTypeDescriptiveIconProps>;
+declare const QuestionTypeDescriptiveIcon: React.FC<QuestionTypeDescriptiveProps>;
 
 interface QuestionTypeMultipleIconProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
 }
 declare const QuestionTypeMultipleIcon: React.FC<QuestionTypeMultipleIconProps>;
 
-interface QuestionTypeSingleIconProps extends React.SVGProps<SVGSVGElement> {
+interface QuestionTypeSingleProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
-declare const QuestionTypeSingleIcon: React.FC<QuestionTypeSingleIconProps>;
+declare const QuestionTypeSingleIcon: React.FC<QuestionTypeSingleProps>;
 
 interface ResendInviteIconProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
 declare const ResendInviteIcon: React.FC<ResendInviteIconProps>;
 
@@ -260,16 +298,19 @@ declare const UnsubscribeIcon: React.FC<UnsubscribeIconProps>;
 
 interface UploadIconProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
 declare const UploadIcon: React.FC<UploadIconProps>;
 
 interface ViewIconProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
 declare const ViewIcon: React.FC<ViewIconProps>;
 
 interface UserAssignIconProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
 declare const UserAssignIcon: React.FC<UserAssignIconProps>;
 
@@ -280,46 +321,55 @@ declare const RufousBirdIcon: React.FC<RufousBirdIconProps>;
 
 interface TickIconProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
 declare const TickIcon: React.FC<TickIconProps>;
 
 interface TimerIconProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
 declare const TimerIcon: React.FC<TimerIconProps>;
 
 interface TrashIconProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
 declare const TrashIcon: React.FC<TrashIconProps>;
 
-interface EditChatProps extends React.SVGProps<SVGSVGElement> {
+interface EditChatIconProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
-declare const EditChatIcon: React.FC<EditChatProps>;
+declare const EditChatIcon: React.FC<EditChatIconProps>;
 
 interface SidebarProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
 declare const SidebarIcon: React.FC<SidebarProps>;
 
-interface NotificationIconProps extends React__default.SVGProps<SVGSVGElement> {
+interface NotificationIconProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
-declare const NotificationIcon: React__default.FC<NotificationIconProps>;
+declare const NotificationIcon: React.FC<NotificationIconProps>;
 
-interface RefreshIconProps extends React__default.SVGProps<SVGSVGElement> {
+interface RefreshIconProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
-declare const RefreshIcon: React__default.FC<RefreshIconProps>;
+declare const RefreshIcon: React.FC<RefreshIconProps>;
 
 interface DollarIconProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
 declare const DollarIcon: React.FC<DollarIconProps>;
 
 interface EngagementIconProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
 declare const EngagementIcon: React.FC<EngagementIconProps>;
 
@@ -335,16 +385,19 @@ declare const IndustryIcon: React.FC<IndustryIconProps>;
 
 interface MinExperienceIconProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
 declare const MinExperienceIcon: React.FC<MinExperienceIconProps>;
 
 interface ProjectIconProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
 declare const ProjectIcon: React.FC<ProjectIconProps>;
 
 interface RolesIconProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
 declare const RolesIcon: React.FC<RolesIconProps>;
 
@@ -355,39 +408,382 @@ declare const RufousAiIcon: React.FC<RufousAiIconProps>;
 
 interface CloseProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
 declare const CloseIcon: React.FC<CloseProps>;
 
-interface LocationPinProps extends React.SVGProps<SVGSVGElement> {
+interface LocationPinIconProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
-declare const LocationPinIcon: React.FC<LocationPinProps>;
+declare const LocationPinIcon: React.FC<LocationPinIconProps>;
 
 interface DownloadPdfProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
 declare const DownloadPdfIcon: React.FC<DownloadPdfProps>;
 
 interface SoftSkillsIconProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
 declare const SoftSkillsIcon: React.FC<SoftSkillsIconProps>;
 
 interface TechnicalSkillsIconProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
 declare const TechnicalSkillsIcon: React.FC<TechnicalSkillsIconProps>;
 
 interface QualificationsIconProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
 declare const QualificationsIcon: React.FC<QualificationsIconProps>;
 
 interface CameraIconProps extends React.SVGProps<SVGSVGElement> {
     color?: string;
+    size?: number;
 }
 declare const CameraIcon: React.FC<CameraIconProps>;
 
+interface SearchIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const SearchIcon: React.FC<SearchIconProps>;
+
+interface SendIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const SendIcon: React.FC<SendIconProps>;
+
+interface HomeIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const HomeIcon: React.FC<HomeIconProps>;
+
+interface SettingsIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const SettingsIcon: React.FC<SettingsIconProps>;
+
+interface UserIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const UserIcon: React.FC<UserIconProps>;
+
+interface UsersIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const UsersIcon: React.FC<UsersIconProps>;
+
+interface MailIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const MailIcon: React.FC<MailIconProps>;
+
+interface PhoneIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const PhoneIcon: React.FC<PhoneIconProps>;
+
+interface CheckCircleIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const CheckCircleIcon: React.FC<CheckCircleIconProps>;
+
+interface XCircleIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const XCircleIcon: React.FC<XCircleIconProps>;
+
+interface InfoIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const InfoIcon: React.FC<InfoIconProps>;
+
+interface AlertTriangleIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const AlertTriangleIcon: React.FC<AlertTriangleIconProps>;
+
+interface ArrowLeftIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const ArrowLeftIcon: React.FC<ArrowLeftIconProps>;
+
+interface ArrowRightIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const ArrowRightIcon: React.FC<ArrowRightIconProps>;
+
+interface ArrowUpIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const ArrowUpIcon: React.FC<ArrowUpIconProps>;
+
+interface ArrowDownIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const ArrowDownIcon: React.FC<ArrowDownIconProps>;
+
+interface ChevronUpIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const ChevronUpIcon: React.FC<ChevronUpIconProps>;
+
+interface ChevronDownIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const ChevronDownIcon: React.FC<ChevronDownIconProps>;
+
+interface ChevronLeftIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const ChevronLeftIcon: React.FC<ChevronLeftIconProps>;
+
+interface ChevronRightIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const ChevronRightIcon: React.FC<ChevronRightIconProps>;
+
+interface FilterIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const FilterIcon: React.FC<FilterIconProps>;
+
+interface GridViewIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const GridViewIcon: React.FC<GridViewIconProps>;
+
+interface ListViewIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const ListViewIcon: React.FC<ListViewIconProps>;
+
+interface StarIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const StarIcon: React.FC<StarIconProps>;
+
+interface HeartIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const HeartIcon: React.FC<HeartIconProps>;
+
+interface ShareIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const ShareIcon: React.FC<ShareIconProps>;
+
+interface LockIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const LockIcon: React.FC<LockIconProps>;
+
+interface UnlockIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const UnlockIcon: React.FC<UnlockIconProps>;
+
+interface EyeOffIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const EyeOffIcon: React.FC<EyeOffIconProps>;
+
+interface MenuIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const MenuIcon: React.FC<MenuIconProps>;
+
+interface MoreHorizontalIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const MoreHorizontalIcon: React.FC<MoreHorizontalIconProps>;
+
+interface MoreVerticalIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const MoreVerticalIcon: React.FC<MoreVerticalIconProps>;
+
+interface ExternalLinkIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const ExternalLinkIcon: React.FC<ExternalLinkIconProps>;
+
+interface SaveIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const SaveIcon: React.FC<SaveIconProps>;
+
+interface BookmarkIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const BookmarkIcon: React.FC<BookmarkIconProps>;
+
+interface GlobeIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const GlobeIcon: React.FC<GlobeIconProps>;
+
+interface SunIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const SunIcon: React.FC<SunIconProps>;
+
+interface MoonIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const MoonIcon: React.FC<MoonIconProps>;
+
+interface TagIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const TagIcon: React.FC<TagIconProps>;
+
+interface FlagIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const FlagIcon: React.FC<FlagIconProps>;
+
+interface ClipboardIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const ClipboardIcon: React.FC<ClipboardIconProps>;
+
+interface PaperclipIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const PaperclipIcon: React.FC<PaperclipIconProps>;
+
+interface LinkIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const LinkIcon: React.FC<LinkIconProps>;
+
+interface PrintIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const PrintIcon: React.FC<PrintIconProps>;
+
+interface ZoomInIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const ZoomInIcon: React.FC<ZoomInIconProps>;
+
+interface ZoomOutIconProps extends React.SVGProps<SVGSVGElement> {
+    color?: string;
+    size?: number;
+}
+declare const ZoomOutIcon: React.FC<ZoomOutIconProps>;
+
+type MaterialIconVariant = "filled" | "outlined";
+interface MaterialIconProps extends Omit<React.SVGProps<SVGSVGElement>, "color"> {
+    color?: string;
+    size?: number | string;
+    variant?: MaterialIconVariant;
+}
+
+declare const DragIndicatorIcon: React.FC<MaterialIconProps>;
+
+declare const CalendarIcon: React.FC<MaterialIconProps>;
+
+declare const TrendingFlatIcon: React.FC<MaterialIconProps>;
+
+declare const OpenInFullIcon: React.FC<MaterialIconProps>;
+
+declare const PinIcon: React.FC<MaterialIconProps>;
+
+declare const TextFieldsIcon: React.FC<MaterialIconProps>;
+
+declare const NotesIcon: React.FC<MaterialIconProps>;
+
+declare const StarBorderIcon: React.FC<MaterialIconProps>;
+
+declare const BusinessIcon: React.FC<MaterialIconProps>;
+
+declare const ContactsIcon: React.FC<MaterialIconProps>;
+
+declare const FactoryIcon: React.FC<MaterialIconProps>;
+
+declare const LocationCityIcon: React.FC<MaterialIconProps>;
+
+declare const MemoryIcon: React.FC<MaterialIconProps>;
+
+declare const ChatBubbleIcon: React.FC<MaterialIconProps>;
+
+declare const AttachFileIcon: React.FC<MaterialIconProps>;
+
+declare const PlaceIcon: React.FC<MaterialIconProps>;
+
+declare const PersonSearchIcon: React.FC<MaterialIconProps>;
+
+declare const CheckBoxIcon: React.FC<MaterialIconProps>;
+
+declare const RecommendIcon: React.FC<MaterialIconProps>;
+
+declare const TrendingUpIcon: React.FC<MaterialIconProps>;
+
+declare const PieChartIcon: React.FC<MaterialIconProps>;
+
+declare const BarChartIcon: React.FC<MaterialIconProps>;
+
+declare const DonutLargeIcon: React.FC<MaterialIconProps>;
+
+declare const ShowChartIcon: React.FC<MaterialIconProps>;
+
+declare const LightbulbIcon: React.FC<MaterialIconProps>;
+
+declare const AddIcon: React.FC<PlusIconProps>;
+declare const RemoveIcon: React.FC<MinusIconProps>;
+
 type SxProp = {
     [key: string]: string | number | SxProp | undefined | null;
 };
@@ -404,6 +800,7 @@ interface SubmitButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement
     bgGradiant?: boolean;
     onClick?: (e: React.MouseEvent<HTMLButtonElement>) => Promise<void> | void;
     onDoubleClick?: (e: React.MouseEvent<HTMLButtonElement>) => Promise<void> | void;
+    /** Externally controlled loading state — stacks with internal loading */
     isLoading?: boolean;
     sx?: SxProp;
 }
@@ -432,6 +829,7 @@ interface ButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>
     disableElevation?: boolean;
     disableRipple?: boolean;
     href?: string;
+    /** Controlled external loading state */
     loading?: boolean;
     loadingPosition?: "start" | "end" | "center";
     component?: React.ElementType;
@@ -439,6 +837,16 @@ interface ButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>
     className?: string;
     style?: CSSProperties;
     sx?: SxProp;
+    /**
+     * When true, the button automatically enters a loading/disabled state
+     * on click and stays there for at least `minLoadingMs` (default 1500 ms).
+     * If `onClick` returns a Promise, loading persists until the Promise
+     * settles **and** the minimum duration has elapsed — whichever is longer.
+     * Prevents accidental double-submissions without any extra state in the parent.
+     */
+    debounce?: boolean;
+    /** Minimum loading duration in ms when `debounce` is enabled. Default: 1500. */
+    minLoadingMs?: number;
 }
 declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
 
@@ -457,6 +865,16 @@ interface IconButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElem
 }
 declare const IconButton: React.ForwardRefExoticComponent<IconButtonProps & React.RefAttributes<HTMLButtonElement>>;
 
+interface ButtonGroupProps extends React.HTMLAttributes<HTMLDivElement> {
+    orientation?: "horizontal" | "vertical";
+    variant?: "contained" | "outlined" | "text";
+    size?: "small" | "medium" | "large";
+    fullWidth?: boolean;
+    disabled?: boolean;
+    sx?: SxProp;
+}
+declare const ButtonGroup: React.ForwardRefExoticComponent<ButtonGroupProps & React.RefAttributes<HTMLDivElement>>;
+
 interface BaseDialogForm {
     handleSubmit?: (e: React.FormEvent) => void;
     [key: string]: any;
@@ -474,6 +892,14 @@ interface BaseDialogProps {
     confirmText?: string;
     submitText?: string;
     title?: string;
+    /** Hide the default header (title, close button, and divider) entirely */
+    hideHeader?: boolean;
+    /** Custom header content rendered in place of the default title/close-button header */
+    customHeader?: React.ReactNode;
+    /** Hide the default footer (action buttons and divider) entirely */
+    hideFooter?: boolean;
+    /** Custom footer content rendered in place of the default action footer */
+    customFooter?: React.ReactNode;
     isLoading?: boolean;
     disableConfirmBtn?: boolean;
     fullScreen?: boolean;
@@ -481,6 +907,8 @@ interface BaseDialogProps {
     showCloseButton?: boolean;
     buttonAlign?: "flex-start" | "flex-end" | "center";
     showCancelButton?: boolean;
+    /** Show/hide the confirm (or submit) button. Defaults to true. */
+    showConfirmButton?: boolean;
     formatTitle?: boolean;
     fullWidth?: boolean;
     className?: string;
@@ -536,6 +964,8 @@ interface TextFieldProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'si
      * All number variants block `e`, `E`, `+`, `-`.
      */
     numberVariant?: NumberVariant;
+    /** Custom step for number inputs. Overrides the default step derived from numberVariant. */
+    step?: number;
     /** The color of the component */
     color?: 'primary' | 'secondary' | 'error' | 'success' | 'info' | 'warning';
     /** If true, the label is displayed in an error state. */
@@ -658,6 +1088,20 @@ interface DateFieldProps {
     placeholder?: string;
     className?: string;
     style?: CSSProperties;
+    /**
+     * Which selection panels are available in the picker.
+     * - `"day"` — day calendar (default)
+     * - `"month"` — month grid
+     * - `"year"` — year grid
+     *
+     * Common patterns:
+     * - `["month", "year"]` — month+year picker, no day calendar
+     * - `["year"]` — year-only picker
+     * - `["month"]` — month picker (‹ › navigate years)
+     *
+     * Defaults to `["day", "month", "year"]` (full picker).
+     */
+    views?: ("day" | "month" | "year")[];
     /** Scoped style overrides. Supports nested CSS selectors with & */
     sx?: SxProp;
 }
@@ -697,8 +1141,8 @@ interface AutocompleteProps<T = string> {
     onChange?: (event: React__default.SyntheticEvent, value: T | T[] | null, reason: 'selectOption' | 'removeOption' | 'clear' | 'freeSolo') => void;
     /** Controlled text in the input */
     inputValue?: string;
-    /** Called on every keystroke — receives the native event and the new input string */
-    onInputChange?: (event: React__default.SyntheticEvent | null, value: string) => void;
+    /** Called on every keystroke or when input resets — receives the native event, new input string, and reason */
+    onInputChange?: (event: React__default.SyntheticEvent | null, value: string, reason: 'input' | 'reset' | 'clear') => void;
     /** Return the string label for an option */
     getOptionLabel?: (option: T) => string;
     /** Decide equality between option and value (useful for objects) */
@@ -804,6 +1248,18 @@ interface CircularProgressIconProps {
 }
 declare const CircularProgressIcon: React.FC<CircularProgressIconProps>;
 
+type LinearProgressVariant = "determinate" | "indeterminate" | "buffer" | "query";
+interface LinearProgressProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "color"> {
+    variant?: LinearProgressVariant;
+    value?: number;
+    valueBuffer?: number;
+    color?: string;
+    trackColor?: string;
+    thickness?: number;
+    sx?: SxProp;
+}
+declare const LinearProgress: React.ForwardRefExoticComponent<LinearProgressProps & React.RefAttributes<HTMLDivElement>>;
+
 interface RufousLogoLoaderProps {
     /** Width of the loader in pixels — height is proportioned automatically */
     size?: number;
@@ -819,6 +1275,11 @@ interface Column<T> {
     header?: string;
     headerName?: string;
     sortable?: boolean;
+    /**
+     * Seed the initial sort from this column. If multiple columns set it, the
+     * first one wins. Ignored when `initialState.sorting.sortModel` is provided.
+     */
+    defaultSort?: 'asc' | 'desc';
     filterable?: boolean;
     render?: (value: any, item: T) => React__default.ReactNode;
     renderCell?: (params: {
@@ -836,6 +1297,12 @@ interface Column<T> {
         row: T;
         field: string;
     }) => string;
+    /**
+     * Override the value written to CSV export for this column.
+     * Receives the raw field value and the full row item.
+     * Takes precedence over valueGetter / valueFormatter for export purposes.
+     */
+    exportValue?: (value: any, item: T) => string;
     width?: string | number;
     minWidth?: string | number;
     maxWidth?: string | number;
@@ -844,6 +1311,41 @@ interface Column<T> {
     hidden?: boolean;
     type?: 'string' | 'number' | 'date' | 'boolean' | 'actions' | 'status';
     statusOptions?: string[];
+    /**
+     * Custom operator list for this column in the advanced filter panel,
+     * overriding the type-derived defaults. Each item is { value, label }.
+     * The first item is used as the default operator when the column is chosen.
+     */
+    filterOperators?: {
+        value: string;
+        label: string;
+    }[];
+    /**
+     * Render a fully custom value editor for this column in the advanced filter
+     * panel — e.g. a status dropdown with colored options while the cell itself
+     * renders something else (stars, chips, …). Overrides the default
+     * text/number/date/status input. Not shown for the "is empty" / "is not
+     * empty" operators.
+     */
+    renderFilterInput?: (params: {
+        value: string;
+        onChange: (value: string) => void;
+        operator: string;
+        column: Column<T>;
+    }) => React__default.ReactNode;
+    /**
+     * Custom matching logic for this column's advanced filter. When provided it
+     * fully controls whether a row passes the filter, so you can pair it with
+     * custom operators / a custom input. `cellValue` is the resolved display
+     * value (after valueGetter → valueFormatter).
+     */
+    filterMatcher?: (params: {
+        value: string;
+        operator: string;
+        row: T;
+        field: string;
+        cellValue: string;
+    }) => boolean;
     editable?: boolean;
     onEnter?: (params: {
         value: any;
@@ -857,9 +1359,79 @@ interface Column<T> {
     }) => void;
     headerClassName?: string;
     cellClassName?: string;
+    /**
+     * When true, the body cell renders with no padding so the renderer can use
+     * the full column width (e.g. for clickable rows, full-bleed media, status
+     * bars). Header padding is unaffected.
+     */
+    disablePadding?: boolean;
     hideable?: boolean;
     disableColumnMenu?: boolean;
     isExportable?: boolean;
+    /**
+     * When false, this column cannot be used as a grouping criterion via the
+     * column menu. Defaults to true.
+     */
+    groupable?: boolean;
+    /**
+     * Override the value used for grouping. Return a string/number so rows
+     * with the same derived value land in the same group. Falls back to
+     * valueGetter, then the raw field value.
+     */
+    groupingValueGetter?: (value: any, row: T) => string | number | null | undefined;
+}
+interface FilterState {
+    column: string;
+    operator: string;
+    value: string;
+    logic: 'AND' | 'OR';
+}
+/** A single sort rule. The grid applies single-column sort, so only the first item is used. */
+interface SortModelItem {
+    field: string;
+    sort: 'asc' | 'desc';
+}
+type SortModel = SortModelItem[];
+/** Maps a column field to its visibility. `false` = hidden, `true`/absent = visible. */
+type ColumnVisibilityModel = Record<string, boolean>;
+/** Parameters passed to `getRowClassName`. */
+interface RowClassNameParams<T> {
+    id: string | number;
+    row: T;
+    /** Zero-based index of the row within the current page. */
+    rowIndex: number;
+}
+/** Seed the grid's initial (uncontrolled) sort and column pinning. */
+interface GridInitialState {
+    sorting?: {
+        sortModel?: SortModel;
+    };
+    pinnedColumns?: {
+        left?: string[];
+        right?: string[];
+    };
+}
+/**
+ * Imperative handle exposed via `apiRef` / `getApiRef`. Lets a parent drive the
+ * grid without lifting all state up (mirrors the subset of MUI's apiRef we use).
+ */
+interface DataGridApi<T> {
+    /** Replace the sort model. Only the first item is applied (single-column sort). */
+    setSortModel: (model: SortModel) => void;
+    getSortModel: () => SortModel;
+    /** Replace the advanced filter model. */
+    setFilterModel: (filters: FilterState[]) => void;
+    getFilterModel: () => FilterState[];
+    /** Open the advanced filter modal. */
+    showFilterPanel: () => void;
+    /** Set which columns are visible. */
+    setColumnVisibilityModel: (model: ColumnVisibilityModel) => void;
+    /** The current filtered + sorted rows in display order (across all pages). */
+    getSortedRows: () => T[];
+    /** The ids of the currently selected rows. */
+    getSelectedRows: () => (string | number)[];
+    /** Trigger CSV export (identical to the toolbar Export button). */
+    exportDataAsCsv: () => void;
 }
 interface Action<T> {
     label: string;
@@ -871,18 +1443,89 @@ interface Action<T> {
 interface DataGridToolbarSlot {
     content: React__default.ReactNode;
     align?: 'left' | 'center' | 'right';
+    /**
+     * Where to inject the slot inside the toolbar action row.
+     * - `'before-search'`  — left of the search input
+     * - `'after-search'`   — right of search, left of Filter / Columns / Export
+     * - `'after-actions'`  — rightmost position, after Export button (default)
+     */
+    position?: 'before-search' | 'after-search' | 'after-actions';
+}
+/**
+ * Granular visibility control for the built-in toolbar.
+ * Each flag hides the corresponding built-in element.
+ */
+interface ToolbarOptions {
+    /** Hide the global search input. */
+    hideSearch?: boolean;
+    /** Hide the advanced filter button. */
+    hideFilter?: boolean;
+    /** Hide the "Manage Columns" button. */
+    hideColumns?: boolean;
+    /** Hide the "Export CSV" button in the top toolbar. */
+    hideExport?: boolean;
+    /** Hide the export icon button in the bottom pagination footer. */
+    hideBottomExport?: boolean;
+    /** Hide the title text on the left side. */
+    hideTitle?: boolean;
+    /** Hide the record count below the title. */
+    hideRecordCount?: boolean;
+    /** Hide the entire top header bar (title, search, filter, columns, export). */
+    hideHeader?: boolean;
+    /** Hide the pagination footer bar entirely. */
+    hideFooter?: boolean;
 }
 interface PaginationModel {
     /** 0-indexed current page */
     page: number;
     pageSize: number;
 }
+/** Shape of a single group node, passed to isGroupExpandedByDefault. */
+interface GroupNode {
+    /** Unique ID for this group, built from its field+key ancestry path. */
+    id: string;
+    /** The column field this group is keyed by. */
+    field: string;
+    /** The group value (display string). */
+    key: string;
+    /** Nesting depth: 0 = top-level group. */
+    depth: number;
+    /** Total leaf (data) row count under this group. */
+    count: number;
+}
+/** Customise the auto-generated grouping column. */
+interface GroupingColDef {
+    /** Override the column header text. */
+    headerName?: string;
+    /** Override the column width (px). Defaults to 200. */
+    width?: number;
+    /** Hide the descendant row count shown in parentheses. */
+    hideDescendantCount?: boolean;
+    /**
+     * When set, leaf cells in the grouping column display the value of this
+     * column field instead of being blank.
+     */
+    leafField?: string;
+    /** Custom cell renderer for group header cells. */
+    renderCell?: (params: {
+        groupKey: string;
+        field: string;
+        depth: number;
+        leafCount: number;
+    }) => React__default.ReactNode;
+}
 interface DataGridProps<T> {
     columns: Column<T>[];
     data: T[];
     actions?: Action<T>[] | ((item: T) => Action<T>[]);
-    /** Show a loading overlay over the table body */
+    /** Show a loading indicator over the table body */
     loading?: boolean;
+    /**
+     * How the loading state is rendered while `loading` is true.
+     * - `'circular'` (default) — a centered spinner overlay.
+     * - `'skeleton'` — shimmering placeholder rows in the table body.
+     */
+    loaderType?: 'circular' | 'skeleton';
     /** Show the pagination bar. Defaults to true. */
     pagination?: boolean;
     /**
@@ -915,20 +1558,165 @@ interface DataGridProps<T> {
         value: any;
     }) => void;
     /** Extra buttons/components rendered beside the Export button in the header row */
-    headerActions?: DataGridToolbarSlot;
+    /** One slot or an array of slots — each can have its own `position`.
+     *  This lets you place a select before the search AND an Add button after
+     *  Export in a single prop:
+     *  ```
+     *  headerActions={[
+     *    { position: 'before-search', content: <select className="dg-toolbar-select">…</select> },
+     *    { position: 'after-actions', content: <button>+ Add</button> },
+     *  ]}
+     *  ``` */
+    headerActions?: DataGridToolbarSlot | DataGridToolbarSlot[];
     /** Extra content rendered in a second row below the header */
     toolbarContent?: DataGridToolbarSlot;
+    /**
+     * Limit global search to these column field names.
+     * When omitted, all visible columns are searched.
+     */
+    searchableColumns?: string[];
+    /**
+     * Called when the search query finds no local results.
+     * Use this to trigger a server-side search.
+     */
+    onSearchChange?: (query: string) => void;
+    /** Called whenever the applied advanced filters change. */
+    onFiltersChange?: (filters: FilterState[]) => void;
+    /**
+     * Seed the advanced filter panel with pre-set filters on mount.
+     * These are used as the initial state; the user can still modify them.
+     */
+    initialFilters?: FilterState[];
+    /**
+     * Granular show/hide control for each built-in toolbar element.
+     * Ignored when `customToolbar` is provided.
+     */
+    toolbarOptions?: ToolbarOptions;
+    /**
+     * Fully custom toolbar node. When provided, replaces the built-in
+     * header action bar (search, filter, columns, export) entirely.
+     * The title/record-count block on the left is still controlled by
+     * `toolbarOptions.hideTitle` / `toolbarOptions.hideRecordCount`.
+     */
+    customToolbar?: React__default.ReactNode;
+    /**
+     * Fully custom footer node. When provided, replaces the built-in
+     * pagination bar entirely. Use `toolbarOptions.hideFooter` to hide
+     * the footer without replacing it.
+     */
+    customFooter?: React__default.ReactNode;
+    /** Hide the "Export CSV" button in the header toolbar. @deprecated Use toolbarOptions.hideExport instead. */
+    hideTopExport?: boolean;
+    /**
+     * Controlled grouping model — an ordered array of column field names to
+     * group by. Provide together with onRowGroupingModelChange.
+     */
+    rowGroupingModel?: string[];
+    /**
+     * Initial grouping model for uncontrolled mode.
+     * Ignored if rowGroupingModel is provided.
+     */
+    defaultRowGroupingModel?: string[];
+    /** Called when the user adds or removes a grouping criterion via the UI. */
+    onRowGroupingModelChange?: (model: string[]) => void;
+    /**
+     * 'single' (default) — all grouped columns share one auto-generated column.
+     * 'multiple' — each criterion gets its own dedicated column.
+     */
+    rowGroupingColumnMode?: 'single' | 'multiple';
+    /**
+     * Customise the auto-generated grouping column.
+     * Pass a callback `(field: string) => GroupingColDef` for per-field
+     * overrides when rowGroupingColumnMode='multiple'.
+     */
+    groupingColDef?: GroupingColDef | ((field: string) => GroupingColDef);
+    /**
+     * Depth to which groups are expanded on initial render (and whenever the
+     * grouping model changes). 0 = all collapsed (default), -1 = all expanded.
+     */
+    defaultGroupingExpansionDepth?: number;
+    /**
+     * Return true for a group that should be expanded on initial render.
+     * Takes precedence over defaultGroupingExpansionDepth.
+     */
+    isGroupExpandedByDefault?: (group: GroupNode) => boolean;
+    /**
+     * Disables the "Group by / Ungroup" column menu items and the grouping
+     * chips bar. If a rowGroupingModel is also provided the grid renders in
+     * read-only grouped mode.
+     */
+    disableRowGrouping?: boolean;
+    /**
+     * Enable tree-data mode. Each row in `data` is a top-level node;
+     * children are retrieved via `getChildRows` (or the row's `children`
+     * field by default). Parent rows render all their own column values
+     * plus a toggle button — unlike field grouping which generates a
+     * separate header row.
+     */
+    treeData?: boolean;
+    /**
+     * Return the child rows for a given parent row.
+     * Defaults to `(row) => (row as any).children ?? null`.
+     */
+    getChildRows?: <T>(row: T) => T[] | null | undefined;
+    /** A ref that the grid populates with its imperative API handle. */
+    apiRef?: React__default.MutableRefObject<DataGridApi<T> | null>;
+    /** Callback invoked once with the imperative API handle on mount. */
+    getApiRef?: (api: DataGridApi<T>) => void;
+    /**
+     * Controlled column visibility. Maps field → boolean (`false` hides the
+     * column). When provided, this takes precedence over each column's `hidden`.
+     */
+    columnVisibilityModel?: ColumnVisibilityModel;
+    /** Called whenever the user shows/hides columns via the UI. */
+    onColumnVisibilityModelChange?: (model: ColumnVisibilityModel) => void;
+    /**
+     * Seed the initial sort and column pinning. Applied on mount only; the user
+     * can change both afterwards. Use `onSortModelChange` to persist sort.
+     */
+    initialState?: GridInitialState;
+    /** Called whenever the sort column or direction changes. */
+    onSortModelChange?: (model: SortModel) => void;
+    /** Return a CSS class string applied to a data row's `<tr>`. */
+    getRowClassName?: (params: RowClassNameParams<T>) => string;
+    /** Called on a single click anywhere in a data row. */
+    onRowClick?: (params: {
+        row: T;
+        id: string | number;
+    }) => void;
+    /** Called on a single click on a data cell. */
+    onCellClick?: (params: {
+        row: T;
+        field: string;
+        value: any;
+    }) => void;
+    /** Render a leading checkbox column for row selection. */
+    checkboxSelection?: boolean;
+    /** Controlled selection — the ids of selected rows. */
+    rowSelectionModel?: (string | number)[];
+    /** Called whenever the set of selected rows changes. */
+    onRowSelectionModelChange?: (model: (string | number)[]) => void;
 }
 
 declare function DataGrid<T extends {
     id: string | number;
-}>({ columns: initialColumnsProp, data, actions, loading, pagination, paginationMode, rowCount, paginationModel, onPaginationModelChange, pageSize: initialPageSize, pageSizeOptions, title, className, sx, onRowDoubleClick, onCellDoubleClick, headerActions, toolbarContent, }: DataGridProps<T>): React__default.JSX.Element;
+}>({ columns: initialColumnsProp, data, actions, loading, loaderType, pagination, paginationMode, rowCount, paginationModel, onPaginationModelChange, pageSize: initialPageSize, pageSizeOptions, title, className, sx, onRowDoubleClick, onCellDoubleClick, headerActions, toolbarContent, searchableColumns, onSearchChange, onFiltersChange, initialFilters, toolbarOptions, customToolbar, customFooter, hideTopExport, rowGroupingModel, defaultRowGroupingModel, onRowGroupingModelChange, rowGroupingColumnMode, groupingColDef, defaultGroupingExpansionDepth, isGroupExpandedByDefault, disableRowGrouping, treeData, getChildRows, apiRef, getApiRef, columnVisibilityModel, onColumnVisibilityModelChange, initialState, onSortModelChange, getRowClassName, onRowClick, onCellClick, checkboxSelection, rowSelectionModel, onRowSelectionModelChange, }: DataGridProps<T>): React__default.JSX.Element;
 
 type SelectOption = {
     value: string | number;
     label: string;
     disabled?: boolean;
     group?: string;
+    /**
+     * Optional icon rendered to the left of the label in both the dropdown and the trigger.
+     * Pass a React component (e.g. a Lucide icon) **or** an image URL string.
+     * Max size is capped to 18 × 18 px via CSS.
+     */
+    icon?: React__default.ComponentType<{
+        size?: number;
+        className?: string;
+        style?: React__default.CSSProperties;
+    }> | string;
 };
 interface SelectProps {
     options: SelectOption[] | string[];
@@ -1020,7 +1808,14 @@ interface RadioGroupProps {
     style?: CSSProperties;
     sx?: SxProp;
 }
-declare const RadioGroup: React__default.ForwardRefExoticComponent<RadioGroupProps & React__default.RefAttributes<HTMLDivElement>>;
+declare const RadioGroup: React__default.ForwardRefExoticComponent<RadioGroupProps & React__default.RefAttributes<HTMLDivElement>>;
+
+interface FormGroupProps extends React.HTMLAttributes<HTMLDivElement> {
+    row?: boolean;
+    spacing?: number | string;
+    sx?: SxProp;
+}
+declare const FormGroup: React.ForwardRefExoticComponent<FormGroupProps & React.RefAttributes<HTMLDivElement>>;
 
 interface RatingProps {
     value?: number | null;
@@ -1177,10 +1972,116 @@ interface ListSubheaderProps {
 }
 declare const ListSubheader: React__default.FC<ListSubheaderProps>;
 
-interface TypographyProps {
+/**
+ * Shared system-prop surface for the four system-prop components. All values
+ * are `string | number`; numeric spacing/border values are resolved through
+ * the sx engine (1 unit = 8px by default).
+ */
+interface SystemProps {
+    m?: number | string;
+    mt?: number | string;
+    mb?: number | string;
+    ml?: number | string;
+    mr?: number | string;
+    mx?: number | string;
+    my?: number | string;
+    margin?: number | string;
+    marginTop?: number | string;
+    marginBottom?: number | string;
+    marginLeft?: number | string;
+    marginRight?: number | string;
+    marginInline?: number | string;
+    marginInlineStart?: number | string;
+    marginInlineEnd?: number | string;
+    marginBlock?: number | string;
+    marginBlockStart?: number | string;
+    marginBlockEnd?: number | string;
+    p?: number | string;
+    pt?: number | string;
+    pb?: number | string;
+    pl?: number | string;
+    pr?: number | string;
+    px?: number | string;
+    py?: number | string;
+    padding?: number | string;
+    paddingTop?: number | string;
+    paddingBottom?: number | string;
+    paddingLeft?: number | string;
+    paddingRight?: number | string;
+    paddingInline?: number | string;
+    paddingInlineStart?: number | string;
+    paddingInlineEnd?: number | string;
+    paddingBlock?: number | string;
+    paddingBlockStart?: number | string;
+    paddingBlockEnd?: number | string;
+    gap?: number | string;
+    rowGap?: number | string;
+    columnGap?: number | string;
+    border?: number | string;
+    borderTop?: number | string;
+    borderRight?: number | string;
+    borderBottom?: number | string;
+    borderLeft?: number | string;
+    borderRadius?: number | string;
+    borderColor?: string;
+    width?: number | string;
+    height?: number | string;
+    minWidth?: number | string;
+    maxWidth?: number | string;
+    minHeight?: number | string;
+    maxHeight?: number | string;
+    boxSizing?: string;
+    bgcolor?: string;
+    color?: string;
+    boxShadow?: number | string;
+    zIndex?: number | string;
+    typography?: string;
+    display?: string;
+    alignContent?: string;
+    alignItems?: string;
+    alignSelf?: string;
+    flex?: number | string;
+    flexDirection?: string;
+    flexGrow?: number | string;
+    flexShrink?: number | string;
+    flexWrap?: string;
+    flexBasis?: number | string;
+    justifyContent?: string;
+    justifyItems?: string;
+    justifySelf?: string;
+    order?: number | string;
+    gridColumn?: number | string;
+    gridRow?: number | string;
+    gridAutoFlow?: string;
+    gridAutoColumns?: string;
+    gridAutoRows?: string;
+    gridTemplateColumns?: string;
+    gridTemplateRows?: string;
+    gridTemplateAreas?: string;
+    gridArea?: string;
+    position?: string;
+    top?: number | string;
+    right?: number | string;
+    bottom?: number | string;
+    left?: number | string;
+    fontFamily?: string;
+    fontSize?: number | string;
+    fontStyle?: string;
+    fontWeight?: number | string;
+    letterSpacing?: number | string;
+    lineHeight?: number | string;
+    textAlign?: string;
+    textTransform?: string;
+    overflow?: string;
+    overflowX?: string;
+    overflowY?: string;
+}
+
+interface TypographyProps extends Omit<React__default.HTMLAttributes<HTMLElement>, "color">, SystemProps {
     variant?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "subtitle1" | "subtitle2" | "body1" | "body2" | "caption" | "overline" | "button";
     component?: keyof React__default.JSX.IntrinsicElements;
     align?: "inherit" | "left" | "center" | "right" | "justify";
+    /** Palette token (`primary`, `secondary`, `textPrimary`, …) or any CSS colour. */
     color?: "primary" | "secondary" | "textPrimary" | "textSecondary" | "error" | string;
     noWrap?: boolean;
     gutterBottom?: boolean;
@@ -1221,51 +2122,20 @@ interface TooltipProps {
 }
 declare const Tooltip: React__default.FC<TooltipProps>;
 
-interface BoxProps extends React.HTMLAttributes<HTMLElement> {
+interface BoxProps extends Omit<React.HTMLAttributes<HTMLElement>, "color">, SystemProps {
     component?: keyof React.JSX.IntrinsicElements;
     children?: ReactNode;
-    display?: string;
-    flexDirection?: string;
-    alignItems?: string;
-    justifyContent?: string;
-    gap?: string | number;
-    padding?: string | number;
-    margin?: string | number;
-    width?: string | number;
-    height?: string | number;
-    minWidth?: string | number;
-    maxWidth?: string | number;
-    minHeight?: string | number;
-    maxHeight?: string | number;
-    flex?: string | number;
-    flexWrap?: string;
-    flexGrow?: number;
-    flexShrink?: number;
-    overflow?: string;
-    position?: string;
-    top?: string | number;
-    right?: string | number;
-    bottom?: string | number;
-    left?: string | number;
-    borderRadius?: string | number;
-    bgcolor?: string;
-    color?: string;
     className?: string;
     style?: CSSProperties;
     sx?: SxProp;
 }
 declare const Box: React.ForwardRefExoticComponent<BoxProps & React.RefAttributes<HTMLElement>>;
 
-interface StackProps extends React.HTMLAttributes<HTMLElement> {
+interface StackProps extends Omit<React.HTMLAttributes<HTMLElement>, "color">, SystemProps {
     direction?: "row" | "row-reverse" | "column" | "column-reverse";
     spacing?: number | string;
-    alignItems?: "flex-start" | "flex-end" | "center" | "stretch" | "baseline";
-    justifyContent?: "flex-start" | "flex-end" | "center" | "space-between" | "space-around" | "space-evenly";
     divider?: ReactNode;
-    flexWrap?: "nowrap" | "wrap" | "wrap-reverse";
     useFlexGap?: boolean;
-    flex?: string | number;
-    overflow?: string;
     component?: keyof React.JSX.IntrinsicElements;
     children: ReactNode;
     className?: string;
@@ -1274,7 +2144,7 @@ interface StackProps extends React.HTMLAttributes<HTMLElement> {
 }
 declare const Stack: React.ForwardRefExoticComponent<StackProps & React.RefAttributes<HTMLElement>>;
 
-interface GridProps extends React.HTMLAttributes<HTMLElement> {
+interface GridProps extends Omit<React.HTMLAttributes<HTMLElement>, "color">, SystemProps {
     container?: boolean;
     item?: boolean;
     xs?: number | "auto" | true;
@@ -1288,8 +2158,6 @@ interface GridProps extends React.HTMLAttributes<HTMLElement> {
         md?: number;
     };
     direction?: "row" | "row-reverse" | "column" | "column-reverse";
-    alignItems?: string;
-    justifyContent?: string;
     wrap?: "nowrap" | "wrap" | "wrap-reverse";
     zeroMinWidth?: boolean;
     component?: keyof React.JSX.IntrinsicElements;
@@ -1300,6 +2168,127 @@ interface GridProps extends React.HTMLAttributes<HTMLElement> {
 }
 declare const Grid: React.ForwardRefExoticComponent<GridProps & React.RefAttributes<HTMLElement>>;
 
+type ContainerMaxWidth = "xs" | "sm" | "md" | "lg" | "xl" | false;
+interface ContainerProps extends React.HTMLAttributes<HTMLElement> {
+    maxWidth?: ContainerMaxWidth;
+    fixed?: boolean;
+    disableGutters?: boolean;
+    component?: keyof React.JSX.IntrinsicElements;
+    sx?: SxProp;
+}
+declare const Container: React.ForwardRefExoticComponent<ContainerProps & React.RefAttributes<HTMLElement>>;
+
+interface TableContainerProps extends React__default.HTMLAttributes<HTMLElement> {
+    component?: keyof React__default.JSX.IntrinsicElements;
+    children?: ReactNode;
+    className?: string;
+    style?: CSSProperties;
+    sx?: SxProp;
+}
+declare const TableContainer: React__default.ForwardRefExoticComponent<TableContainerProps & React__default.RefAttributes<HTMLElement>>;
+interface TableProps extends React__default.TableHTMLAttributes<HTMLTableElement> {
+    size?: "small" | "medium";
+    stickyHeader?: boolean;
+    padding?: "normal" | "checkbox" | "none";
+    children?: ReactNode;
+    className?: string;
+    style?: CSSProperties;
+    sx?: SxProp;
+}
+declare const Table: React__default.ForwardRefExoticComponent<TableProps & React__default.RefAttributes<HTMLTableElement>>;
+interface TableHeadProps extends React__default.HTMLAttributes<HTMLTableSectionElement> {
+    children?: ReactNode;
+    className?: string;
+    style?: CSSProperties;
+    sx?: SxProp;
+}
+declare const TableHead: React__default.ForwardRefExoticComponent<TableHeadProps & React__default.RefAttributes<HTMLTableSectionElement>>;
+interface TableBodyProps extends React__default.HTMLAttributes<HTMLTableSectionElement> {
+    children?: ReactNode;
+    className?: string;
+    style?: CSSProperties;
+    sx?: SxProp;
+}
+declare const TableBody: React__default.ForwardRefExoticComponent<TableBodyProps & React__default.RefAttributes<HTMLTableSectionElement>>;
+interface TableFooterProps extends React__default.HTMLAttributes<HTMLTableSectionElement> {
+    children?: ReactNode;
+    className?: string;
+    style?: CSSProperties;
+    sx?: SxProp;
+}
+declare const TableFooter: React__default.ForwardRefExoticComponent<TableFooterProps & React__default.RefAttributes<HTMLTableSectionElement>>;
+interface TableRowProps extends React__default.HTMLAttributes<HTMLTableRowElement> {
+    hover?: boolean;
+    selected?: boolean;
+    children?: ReactNode;
+    className?: string;
+    style?: CSSProperties;
+    sx?: SxProp;
+}
+declare const TableRow: React__default.ForwardRefExoticComponent<TableRowProps & React__default.RefAttributes<HTMLTableRowElement>>;
+interface TableCellProps extends React__default.TdHTMLAttributes<HTMLTableCellElement> {
+    /** Render as <th> instead of <td>. Auto-set when inside TableHead. */
+    component?: "td" | "th";
+    align?: "left" | "right" | "center" | "justify";
+    /** Override the table-level padding for this cell */
+    padding?: "normal" | "checkbox" | "none";
+    /** Conveys sort direction for assistive technology */
+    sortDirection?: "asc" | "desc" | false;
+    /** Visual variant — auto-detected from parent section */
+    variant?: "head" | "body" | "footer";
+    children?: ReactNode;
+    className?: string;
+    style?: CSSProperties;
+    sx?: SxProp;
+}
+declare const TableCell: React__default.ForwardRefExoticComponent<TableCellProps & React__default.RefAttributes<HTMLTableCellElement>>;
+interface TableSortLabelProps extends React__default.ButtonHTMLAttributes<HTMLButtonElement> {
+    /** Whether this column is the current sort column */
+    active?: boolean;
+    /** Current sort direction */
+    direction?: "asc" | "desc";
+    /** Hide the sort arrow icon when the column is not active */
+    hideSortIcon?: boolean;
+    children?: ReactNode;
+    className?: string;
+    style?: CSSProperties;
+    sx?: SxProp;
+}
+declare const TableSortLabel: React__default.ForwardRefExoticComponent<TableSortLabelProps & React__default.RefAttributes<HTMLButtonElement>>;
+interface TablePaginationProps extends React__default.HTMLAttributes<HTMLDivElement> {
+    /** Total number of rows */
+    count: number;
+    /** Current 0-indexed page */
+    page: number;
+    /** Number of rows per page */
+    rowsPerPage: number;
+    /** Called when the user changes the page */
+    onPageChange: (event: React__default.MouseEvent<HTMLButtonElement> | null, page: number) => void;
+    /** Available rows-per-page options */
+    rowsPerPageOptions?: (number | {
+        value: number;
+        label: string;
+    })[];
+    /** Called when rows-per-page changes */
+    onRowsPerPageChange?: (event: React__default.ChangeEvent<HTMLSelectElement>) => void;
+    /** Label before the rows-per-page selector */
+    labelRowsPerPage?: ReactNode;
+    /** Override the "X–Y of Z" display */
+    labelDisplayedRows?: (args: {
+        from: number;
+        to: number;
+        count: number;
+    }) => ReactNode;
+    /** Show first-page button */
+    showFirstButton?: boolean;
+    /** Show last-page button */
+    showLastButton?: boolean;
+    className?: string;
+    style?: CSSProperties;
+    sx?: SxProp;
+}
+declare const TablePagination: React__default.ForwardRefExoticComponent<TablePaginationProps & React__default.RefAttributes<HTMLDivElement>>;
+
 interface PaperProps extends React.HTMLAttributes<HTMLElement> {
     elevation?: number;
     square?: boolean;
@@ -1555,6 +2544,26 @@ interface DrawerProps {
 }
 declare const Drawer: React__default.FC<DrawerProps>;
 
+type PaginationItemType = "page" | "first" | "previous" | "next" | "last" | "start-ellipsis" | "end-ellipsis";
+interface PaginationProps extends Omit<React.HTMLAttributes<HTMLElement>, "onChange" | "color"> {
+    count: number;
+    page?: number;
+    defaultPage?: number;
+    onChange?: (event: React.MouseEvent<HTMLButtonElement>, page: number) => void;
+    siblingCount?: number;
+    boundaryCount?: number;
+    showFirstButton?: boolean;
+    showLastButton?: boolean;
+    hidePrevButton?: boolean;
+    hideNextButton?: boolean;
+    disabled?: boolean;
+    shape?: "circular" | "rounded";
+    size?: "small" | "medium" | "large";
+    color?: "primary" | "standard";
+    sx?: SxProp;
+}
+declare const Pagination: React.ForwardRefExoticComponent<PaginationProps & React.RefAttributes<HTMLElement>>;
+
 interface SnackbarProps {
     open: boolean;
     onClose?: (reason: "timeout" | "clickaway" | "escapeKeyDown") => void;
@@ -1574,6 +2583,66 @@ interface SnackbarProps {
 }
 declare const Snackbar: React__default.FC<SnackbarProps>;
 
+type AlertSeverity = "success" | "info" | "warning" | "error";
+type AlertVariant = "standard" | "filled" | "outlined";
+interface AlertProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {
+    severity?: AlertSeverity;
+    variant?: AlertVariant;
+    title?: React.ReactNode;
+    icon?: React.ReactNode | false;
+    action?: React.ReactNode;
+    onClose?: () => void;
+    sx?: SxProp;
+}
+declare const Alert: React.ForwardRefExoticComponent<AlertProps & React.RefAttributes<HTMLDivElement>>;
+
+type TimelinePosition = "right" | "left" | "alternate" | "alternate-reverse";
+type TimelineDotColor = "inherit" | "grey" | "primary" | "secondary" | "success" | "error" | "info" | "warning";
+type TimelineDotVariant = "filled" | "outlined";
+interface TimelineProps extends Omit<React.HTMLAttributes<HTMLUListElement>, "color"> {
+    position?: TimelinePosition;
+    sx?: SxProp;
+}
+declare const Timeline: React.ForwardRefExoticComponent<TimelineProps & React.RefAttributes<HTMLUListElement>>;
+interface TimelineItemProps extends React.LiHTMLAttributes<HTMLLIElement> {
+    position?: "right" | "left";
+    sx?: SxProp;
+}
+declare const TimelineItem: React.ForwardRefExoticComponent<TimelineItemProps & React.RefAttributes<HTMLLIElement>>;
+interface TimelineSeparatorProps extends React.HTMLAttributes<HTMLDivElement> {
+    sx?: SxProp;
+}
+declare const TimelineSeparator: React.ForwardRefExoticComponent<TimelineSeparatorProps & React.RefAttributes<HTMLDivElement>>;
+interface TimelineDotProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, "color"> {
+    color?: TimelineDotColor;
+    variant?: TimelineDotVariant;
+    sx?: SxProp;
+}
+declare const TimelineDot: React.ForwardRefExoticComponent<TimelineDotProps & React.RefAttributes<HTMLSpanElement>>;
+interface TimelineConnectorProps extends React.HTMLAttributes<HTMLSpanElement> {
+    sx?: SxProp;
+}
+declare const TimelineConnector: React.ForwardRefExoticComponent<TimelineConnectorProps & React.RefAttributes<HTMLSpanElement>>;
+interface TimelineContentProps extends React.HTMLAttributes<HTMLDivElement> {
+    sx?: SxProp;
+}
+declare const TimelineContent: React.ForwardRefExoticComponent<TimelineContentProps & React.RefAttributes<HTMLDivElement>>;
+interface TimelineOppositeContentProps extends React.HTMLAttributes<HTMLDivElement> {
+    sx?: SxProp;
+}
+declare const TimelineOppositeContent: React.ForwardRefExoticComponent<TimelineOppositeContentProps & React.RefAttributes<HTMLDivElement>>;
+
+type ClickAwayMouseEventHandler = "onClick" | "onMouseDown" | "onMouseUp" | "onPointerDown" | "onPointerUp";
+type ClickAwayTouchEventHandler = "onTouchStart" | "onTouchEnd";
+interface ClickAwayListenerProps {
+    children: React.ReactElement<any>;
+    disableReactTree?: boolean;
+    mouseEvent?: ClickAwayMouseEventHandler | false;
+    onClickAway: (event: MouseEvent | TouchEvent) => void;
+    touchEvent?: ClickAwayTouchEventHandler | false;
+}
+declare function ClickAwayListener(props: ClickAwayListenerProps): React.JSX.Element;
+
 interface LinkProps {
     href?: string;
     target?: string;
@@ -1743,6 +2812,257 @@ interface PhoneFieldProps {
 }
 declare const PhoneField: React__default.ForwardRefExoticComponent<PhoneFieldProps & React__default.RefAttributes<HTMLDivElement>>;
 
+interface TreeNode {
+    id?: string | number;
+    /** MongoDB-style id — used as fallback when `id` is absent */
+    _id?: string | number;
+    label: string;
+    name?: string;
+    children?: TreeNode[];
+}
+type TreeSelectMultiValue = Record<string, boolean>;
+type TreeSelectSingleValue = string | number | null;
+type TreeSelectValue = TreeSelectSingleValue | TreeSelectMultiValue;
+interface TreeSelectProps {
+    /** Tree data — each node may have nested children */
+    options: TreeNode[];
+    /** Controlled value. Single mode: id or null. Multiple mode: Record<id, boolean>. */
+    value?: TreeSelectValue;
+    /** Called when selection changes. In single mode, `node` is also included for convenience. */
+    onChange?: (e: {
+        value: TreeSelectValue;
+        node?: TreeNode | null;
+    }) => void;
+    /** Called when a node is selected */
+    onNodeSelect?: (e: {
+        node: TreeNode;
+    }) => void;
+    /** Called when a node is unselected */
+    onNodeUnselect?: (e: {
+        node: TreeNode;
+    }) => void;
+    /** 'single' (default) or 'multiple' (checkbox tree) */
+    selectionMode?: 'single' | 'multiple';
+    /** Placeholder text shown when nothing is selected */
+    placeholder?: string;
+    /** Show a search filter input at the top of the dropdown */
+    filter?: boolean;
+    /** Auto-focus the filter input when the dropdown opens */
+    filterInputAutoFocus?: boolean;
+    /** Clear filter text when the dropdown closes */
+    resetFilterOnHide?: boolean;
+    /**
+     * When **true**, selecting a parent selects all its descendants and vice-versa (cascade).
+     * When **false** (default), every node is selected/deselected independently — no cascade.
+     * Only relevant in `multiple` mode.
+     */
+    allowChildSelection?: boolean;
+    /** PrimeReact compat — accepted but not used */
+    metaKeySelection?: boolean;
+    /** Disable the whole control */
+    disabled?: boolean;
+    /** Floating label */
+    label?: string;
+    /** Visual variant (mirrors TextField) */
+    variant?: 'outlined' | 'filled' | 'standard';
+    /** Size */
+    size?: 'small' | 'medium';
+    /** Error state */
+    error?: boolean;
+    /** Helper / error text below the field */
+    helperText?: ReactNode;
+    /** Stretch to full container width */
+    fullWidth?: boolean;
+    /** Show a clear button when a value is selected */
+    clearable?: boolean;
+    /** Mark the field as required — appends an asterisk to the label */
+    required?: boolean;
+    style?: CSSProperties;
+    className?: string;
+    sx?: SxProp;
+}
+declare function TreeSelect({ options, value, onChange, onNodeSelect, onNodeUnselect, selectionMode, allowChildSelection, placeholder, filter, filterInputAutoFocus, resetFilterOnHide, metaKeySelection: _metaKeySelection, disabled, label, variant, size, error, helperText, fullWidth, clearable, required, style, className, sx, }: TreeSelectProps): React__default.JSX.Element;
+
+interface UserOption {
+    id?: string | number;
+    _id?: string | number;
+    userFirstName?: string;
+    userLastName?: string;
+    emailId?: string;
+}
+interface UserSelectionFieldProps {
+    /** Selected user (single) or array of users (multiple) */
+    value?: UserOption | UserOption[] | null;
+    /** Called when selection changes */
+    onChange: (value: UserOption | UserOption[] | null) => void;
+    /** Available user options */
+    options?: UserOption[];
+    /** Show a loading spinner */
+    loading?: boolean;
+    /**
+     * Called when the search text changes and no local match is found —
+     * use this to trigger an API search.
+     */
+    onSearchChange?: (value: string) => void;
+    /** Label / placeholder text */
+    label?: string;
+    /** Allow selecting multiple users */
+    multiple?: boolean;
+    /** In multiple mode, cap how many tag chips are shown before "+N more" */
+    limitTags?: number;
+    size?: 'small' | 'medium';
+    variant?: 'outlined' | 'filled' | 'standard';
+    disabled?: boolean;
+    error?: boolean;
+    helperText?: ReactNode;
+    fullWidth?: boolean;
+    required?: boolean;
+    /**
+     * Override the default name/email filter. Receives (options, inputValue).
+     * Pass `(opts) => opts` to skip internal filtering when options are pre-filtered externally.
+     */
+    filterOptions?: (options: UserOption[], inputValue: string) => UserOption[];
+    className?: string;
+    style?: CSSProperties;
+    sx?: SxProp;
+}
+declare function UserSelectionField({ value, onChange, options, loading, onSearchChange, label, multiple, limitTags, size, variant, disabled, error, helperText, fullWidth, required, filterOptions: filterOptionsProp, className, style, sx, }: UserSelectionFieldProps): React__default.JSX.Element;
+
+interface SmartSelectProps<T = any> {
+    /** Options array — can be flat or hierarchical (via getOptionChildren) */
+    options: T[];
+    /** Controlled value. Single: T | null. Multiple: T[] */
+    value?: T | T[] | null;
+    /** Called when selection changes */
+    onChange?: (value: T | T[] | null) => void;
+    /**
+     * Controlled text shown in the search input.
+     * When provided the input is fully controlled — update it via `onInputChange`.
+     * When omitted SmartSelect manages the input text internally.
+     */
+    inputValue?: string;
+    /**
+     * Called whenever the input text changes.
+     * - `reason: 'input'`  — user typed
+     * - `reason: 'reset'`  — option selected or dropdown closed
+     * - `reason: 'clear'`  — field was cleared
+     *
+     * Pair with `inputValue` for full controlled mode:
+     * ```
+     * const [search, setSearch] = useState('');
+     * <SmartSelect
+     *   inputValue={search}
+     *   onInputChange={(val, reason) => { if (reason !== 'reset') setSearch(val); }}
+     * />
+     * ```
+     */
+    onInputChange?: (value: string, reason: 'input' | 'reset' | 'clear') => void;
+    /**
+     * Called when local matches fall below `searchThreshold`.
+     * Receives the current query and how many more records are needed.
+     */
+    onSearchChange?: (query: string, needed: number) => void;
+    /**
+     * Results returned by the API for the current query.
+     * Merged with local matches (duplicates excluded) to fill up to `searchThreshold`.
+     * Reset this to [] when the query is cleared.
+     */
+    searchResults?: T[];
+    /**
+     * Debounce delay in ms before `onSearchChange` fires. Default: 300.
+     * Pass 0 to disable.
+     */
+    debounceMs?: number;
+    /**
+     * Max results to show when a query is active.
+     * `onSearchChange` fires only when local matches < this threshold.
+     * Default: 10. Pass 0 to always call the API.
+     */
+    searchThreshold?: number;
+    /** Primary display label for an option (required) */
+    getOptionLabel: (option: T) => string;
+    /** Unique key for an option — defaults to the label string */
+    getOptionValue?: (option: T) => string | number;
+    /** Optional secondary line shown below the label */
+    getOptionSubLabel?: (option: T) => string | undefined;
+    /**
+     * Return child options to create a hierarchical list.
+     * The tree is flattened with indentation for display.
+     */
+    getOptionChildren?: (option: T) => T[] | undefined;
+    /** Allow selecting multiple options */
+    multiple?: boolean;
+    /**
+     * When **true** (default) selecting a parent selects all its descendants.
+     * When **false** every option is selected / deselected independently.
+     * Only relevant when getOptionChildren is provided and multiple is true.
+     */
+    allowChildNodesSelection?: boolean;
+    /**
+     * When **true**, the incoming `value` is validated against the source options
+     * before being used. Three cases are handled strictly:
+     *
+     * - **Case 1 — Empty**: `value` is `null`, `undefined`, or `""` → treated as no selection.
+     * - **Case 2 — Missing**: value's key is not present in `options` or `searchResults`
+     *   → ignored; not injected into the dropdown list.
+     * - **Case 3 — Incomplete**: value's key exists in the source but the canonical source
+     *   option returns an empty label from `getOptionLabel` → not treated as selected.
+     *
+     * When invalid, `null` is passed to Autocomplete (nothing selected) and the raw text
+     * is shown in the input field. No `onChange` fires.
+     *
+     * Only applies to single-select mode. Default: **false**.
+     */
+    strictSelection?: boolean;
+    /** Show a loading spinner in the dropdown */
+    loading?: boolean;
+    /** Content shown while loading */
+    loadingText?: ReactNode;
+    /**
+     * Override the default label + sub-label filter.
+     * Pass `(opts) => opts` to bypass when options are pre-filtered externally.
+     */
+    filterOptions?: (options: T[], inputValue: string) => T[];
+    /**
+     * Custom option renderer. Receives the li props, option, and { selected } state.
+     * When provided, overrides the default Select-style rendering.
+     */
+    renderOption?: (props: React__default.HTMLAttributes<HTMLLIElement> & {
+        key: React__default.Key;
+    }, option: T, state: {
+        selected: boolean;
+        index: number;
+    }) => ReactNode;
+    /** In multiple mode, cap how many tag chips are shown before "+N more" */
+    limitTags?: number;
+    /**
+     * In multiple mode, controls whether already-selected options stay visible
+     * at the top of the dropdown while the user is actively searching.
+     *
+     * - **false** (default): selected options are hidden during search — only
+     *   matching results are shown. They reappear when a result is selected, the
+     *   search text is cleared, or the dropdown is reopened.
+     * - **true**: existing behaviour — selected options remain pinned at the top
+     *   with search results listed below them.
+     *
+     * Only applies to `multiple` selection mode. Default: **false**.
+     */
+    showSelectedOnSearch?: boolean;
+    label?: string;
+    placeholder?: string;
+    variant?: 'outlined' | 'filled' | 'standard';
+    size?: 'small' | 'medium';
+    disabled?: boolean;
+    error?: boolean;
+    helperText?: ReactNode;
+    fullWidth?: boolean;
+    required?: boolean;
+    className?: string;
+    style?: CSSProperties;
+    sx?: SxProp;
+}
+declare function SmartSelect<T = any>({ options, value, onChange, inputValue: inputValueProp, onInputChange, onSearchChange, searchResults, debounceMs, searchThreshold, getOptionLabel, getOptionValue, getOptionSubLabel, getOptionChildren, multiple, allowChildNodesSelection, strictSelection, loading, loadingText, filterOptions: filterOptionsProp, renderOption: renderOptionProp, limitTags, showSelectedOnSearch, label, placeholder, variant, size, disabled, error, helperText, fullWidth, required, className, style, sx, }: SmartSelectProps<T>): React__default.JSX.Element;
+
 type ToolbarButton = 'undo' | 'redo' | 'ai' | 'paragraph' | 'fontsize' | 'font' | 'color' | 'bold' | 'italic' | 'strike' | 'link' | 'lineheight' | 'ul' | 'ol' | 'align' | 'indent' | 'outdent' | 'table' | 'image' | 'video' | 'cut' | 'copy' | 'paste' | 'specialchars' | 'code' | 'fullscreen' | 'tts' | 'stt' | 'translate' | 'todo' | '|';
 type EditorVariant = 'default' | 'basic';
 interface RufousTextEditorProps {
@@ -1829,4 +3149,151 @@ interface MentionItemData {
     shortName?: string;
 }
 
-export { APP_THEMES, Accordion, AccordionDetails, type AccordionDetailsProps, type AccordionProps, AccordionSummary, type AccordionSummaryProps, type Action, ActivateUserIcon, AddButton, AddressLookup, ArchivedIcon, AssignGroupIcon, Autocomplete, type AutocompleteProps, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, BaseDialog, Box, type BoxProps, Breadcrumbs, type BreadcrumbsProps, Button, type ButtonProps, CameraIcon, CancelButton, Card, CardActions, type CardActionsProps, CardContent, type CardContentProps, CardHeader, type CardHeaderProps, CardMedia, type CardMediaProps, type CardProps, Checkbox, type CheckboxProps, Chip, type ChipProps, CircularProgress, CircularProgressIcon, type CircularProgressIconProps, CloseIcon, Collapse, type CollapseProps, type Column, CopyIcon, DataGrid, type DataGridProps, DateField, type DateFieldProps, type DateFormatString, DateRangeField, type DateRangeFieldProps, type DateRangeValue, DifficultyAllIcon, DifficultyEasyIcon, DifficultyHardIcon, DifficultyMediumIcon, Divider, type DividerProps, DollarIcon, DownloadIcon, DownloadPdfIcon, Drawer, type DrawerProps, EditChatIcon, EditIcon, EngagementIcon, Fade, type FadeProps, FunctionIcon, Grid, type GridProps, Grow, type GrowProps, HelpOutlinedIcon, HierarchyIcon, IconButton, type IconButtonProps, ImageField, type ImageFieldProps, InactiveGroupIcon, IndustryIcon, InvoiceIcon, Link, type LinkProps, List, ListItem, ListItemButton, type ListItemButtonProps, ListItemIcon, type ListItemIconProps, type ListItemProps, ListItemText, type ListItemTextProps, type ListProps, ListSubheader, type ListSubheaderProps, LocationPinIcon, LogsIcon, Menu, MenuDivider, MenuItem, type MenuItemProps, MenuList, type MenuListProps, type MenuProps, MinExperienceIcon, NineDotMenuIcon, NotificationIcon, type NumberVariant, Paper, type PaperProps, PhoneField, type PhoneFieldProps, Popover, type PopoverProps, Popper, type PopperProps, ProjectIcon, QualificationsIcon, QuestionStatusAllIcon, QuestionStatusPrivateIcon, QuestionStatusPublicIcon, QuestionTypeAllIcon, QuestionTypeCodingIcon, QuestionTypeDescriptiveIcon, QuestionTypeMultipleIcon, QuestionTypeSingleIcon, Radio, RadioGroup, type RadioGroupProps, type RadioProps, Rating, type RatingProps, RefreshIcon, ResendInviteIcon, RolesIcon, RufousAiIcon, RufousBirdIcon, RufousLauncherIcon, RufousLogoLoader, type RufousLogoLoaderProps, RufousTextContent, type RufousTextContentProps, RufousTextEditor, type MentionItemData as RufousTextEditorMentionItem, type RufousTextEditorProps, RufousThemeProvider, Select, type SelectProps, SidebarIcon, Skeleton, type SkeletonProps, Slide, type SlideProps, Slider, type SliderProps, Snackbar, type SnackbarProps, SoftSkillsIcon, type SortDirection, Stack, type StackProps, StandardButton, Step, StepButton, type StepButtonProps, StepContent, type StepContentProps, StepLabel, type StepLabelProps, type StepProps, Stepper, type StepperProps, SubmitButton, SubscribeIcon, SuspendUserIcon, Switch, type SwitchProps, type SxProp, Tab, TabPanel, type TabPanelProps, type TabProps, Tabs, type TabsProps, TechnicalSkillsIcon, TextField, type TextFieldProps, TickIcon, TimerIcon, ToggleButton, ToggleButtonGroup, type ToggleButtonGroupProps, type ToggleButtonProps, Tooltip, type TooltipProps, TrashIcon, Typography, type TypographyProps, UnArchivedIcon, UnsubscribeIcon, UploadIcon, UserAssignIcon, ViewIcon, WorkItemIcon, Zoom, type ZoomProps, transformLegacyTodos, useRufousTheme };
+declare const FontSize: any;
+declare const LineHeight: any;
+declare const FontFamily: any;
+declare const ListStyle: any;
+declare const INDENT_STEP = 40;
+declare const MAX_INDENT = 200;
+declare const Indent: any;
+declare const CustomVideo: any;
+declare const CustomYoutube: any;
+declare const CustomImage: any;
+declare const STATUS_IMAGES: Record<string, string>;
+declare const STATUS_LABELS: Record<string, string>;
+declare const STATUS_COLORS: Record<string, {
+    border: string;
+    bg: string;
+    color: string;
+}>;
+declare const CustomTaskItem: any;
+
+/** Country — same shape as the library; re-exported with a typed name for convenience. */
+type EnhancedCountry = ICountry;
+/** State enriched with the full name of its parent country. */
+interface EnhancedState extends IState {
+    countryName: string;
+}
+/** City enriched with a short city code and the full state + country names. */
+interface EnhancedCity extends ICity {
+    /** First three characters of the city name (e.g. "Des" for "Des Moines"). */
+    cityCode: string;
+    /** Full name of the parent country (e.g. "United States"). */
+    countryName: string;
+    /** Full name of the parent state (e.g. "Iowa"). */
+    stateName: string;
+}
+/** Returns all countries (same data as the library, typed as EnhancedCountry). */
+declare function getAllCountries(): EnhancedCountry[];
+/** Returns a single country by its ISO 2-letter code, or undefined if not found. */
+declare function getCountryByCode(isoCode: string): EnhancedCountry | undefined;
+/**
+ * Returns the first country whose name matches the query (case-insensitive).
+ * Pass `exact: false` (default) to also match partial names.
+ * @param name   Country name or partial name, e.g. "United States" or "united"
+ * @param exact  When true, requires an exact case-insensitive match. Default false.
+ */
+declare function getCountryByName(name: string, exact?: boolean): EnhancedCountry | undefined;
+/**
+ * Returns all countries whose names match the query (case-insensitive, partial by default).
+ * Useful for search-as-you-type flows where you want multiple candidates.
+ * @param name   Search string, e.g. "ind" matches "India", "Indonesia", etc.
+ * @param exact  When true, only exact case-insensitive matches are returned. Default false.
+ */
+declare function getCountriesByName(name: string, exact?: boolean): EnhancedCountry[];
+/**
+ * Returns all states for a country, each enriched with `countryName`.
+ * @param countryCode  ISO 2-letter country code, e.g. "US"
+ */
+declare function getStatesOfCountry(countryCode: string): EnhancedState[];
+/**
+ * Returns a single state by its code + parent country, enriched with `countryName`.
+ * @param stateCode    ISO state code, e.g. "IA"
+ * @param countryCode  ISO 2-letter country code, e.g. "US"
+ */
+declare function getStateByCode(stateCode: string, countryCode: string): EnhancedState | undefined;
+/**
+ * Returns the first state whose name matches the query across **all countries** (case-insensitive).
+ * @param name   State name or partial name, e.g. "Iowa" or "iow"
+ * @param exact  When true, requires an exact case-insensitive match. Default false.
+ */
+declare function getStateByName(name: string, exact?: boolean): EnhancedState | undefined;
+/**
+ * Returns all states whose names match the query across **all countries** (case-insensitive, partial by default).
+ * @param name   Search string, e.g. "new" matches "New York", "New South Wales", etc.
+ * @param exact  When true, only exact case-insensitive matches are returned. Default false.
+ */
+declare function getStatesByName(name: string, exact?: boolean): EnhancedState[];
+/**
+ * Returns all cities for a given state, each enriched with `cityCode`, `countryName`,
+ * and `stateName`.
+ * @param countryCode  ISO 2-letter country code, e.g. "US"
+ * @param stateCode    ISO state code, e.g. "IA"
+ */
+declare function getCitiesOfState(countryCode: string, stateCode: string): EnhancedCity[];
+/**
+ * Returns all cities for a given country, each enriched with `cityCode`, `countryName`,
+ * and `stateName`.
+ * @param countryCode  ISO 2-letter country code, e.g. "US"
+ */
+declare function getCitiesOfCountry(countryCode: string): EnhancedCity[];
+/**
+ * Returns the first city whose name matches the query across **all countries and states** (case-insensitive).
+ * @param name   City name or partial name, e.g. "Delhi" or "del"
+ * @param exact  When true, requires an exact case-insensitive match. Default false.
+ */
+declare function getCityByName(name: string, exact?: boolean): EnhancedCity | undefined;
+/**
+ * Returns all cities whose names match the query across **all countries and states** (case-insensitive, partial by default).
+ * Searches ~148k cities — prefer the debounced `useCitiesSearch` hook in React components.
+ * @param name   Search string, e.g. "spring" matches "Springfield", "Spring Hill", etc.
+ * @param exact  When true, only exact case-insensitive matches are returned. Default false.
+ */
+declare function getCitiesByName(name: string, exact?: boolean): EnhancedCity[];
+
+interface SearchResult<T> {
+    /** Filtered results. Empty while query is blank. */
+    results: T[];
+    /** Current value of the search input (updated immediately on each keystroke). */
+    query: string;
+    /** Call this on every keystroke — triggers the debounced filter. */
+    search: (name: string) => void;
+    /** Resets query and results immediately. */
+    clear: () => void;
+}
+/**
+ * Debounced country name search across all ~250 countries.
+ *
+ * @param debounceMs  Delay before filtering runs. Defaults to 300 ms.
+ *
+ * @example
+ * const { results, search, clear, query } = useCountriesSearch();
+ * <input onChange={e => search(e.target.value)} value={query} />
+ * {results.map(c => <div key={c.isoCode}>{c.flag} {c.name}</div>)}
+ */
+declare function useCountriesSearch(debounceMs?: number): SearchResult<EnhancedCountry>;
+/**
+ * Debounced state / province name search across **all countries** (~5k states).
+ * No country scoping — results include `countryName` so you can display origin.
+ *
+ * @param debounceMs  Delay before filtering runs. Defaults to 300 ms.
+ *
+ * @example
+ * const { results, search, clear } = useStatesSearch();
+ * // results[0] → { name, isoCode, countryCode, countryName, latitude, longitude }
+ */
+declare function useStatesSearch(debounceMs?: number): SearchResult<EnhancedState>;
+/**
+ * Debounced city name search across **all countries and states** (~148k cities).
+ * No country / state scoping — results include `countryName` and `stateName`.
+ * Debouncing is strongly recommended given the dataset size.
+ *
+ * @param debounceMs  Delay before filtering runs. Defaults to 300 ms.
+ *
+ * @example
+ * const { results, search, clear } = useCitiesSearch(400);
+ * // results[0] → { name, cityCode, stateCode, stateName, countryCode, countryName, … }
+ */
+declare function useCitiesSearch(debounceMs?: number): SearchResult<EnhancedCity>;
+
+export { APP_THEMES, Accordion, AccordionDetails, type AccordionDetailsProps, type AccordionProps, AccordionSummary, type AccordionSummaryProps, type Action, ActivateUserIcon, AddButton, AddIcon, AddressLookup, Alert, type AlertProps, type AlertSeverity, AlertTriangleIcon, type AlertVariant, ArchivedIcon, ArrowDownIcon, ArrowLeftIcon, ArrowRightIcon, ArrowUpIcon, AssignGroupIcon, AttachFileIcon, Autocomplete, type AutocompleteProps, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, BarChartIcon, BaseDialog, BookmarkIcon, Box, type BoxProps, Breadcrumbs, type BreadcrumbsProps, BusinessIcon, Button, ButtonGroup, type ButtonGroupProps, type ButtonProps, CalendarIcon, CameraIcon, CancelButton, Card, CardActions, type CardActionsProps, CardContent, type CardContentProps, CardHeader, type CardHeaderProps, CardMedia, type CardMediaProps, type CardProps, ChatBubbleIcon, CheckBoxIcon, CheckCircleIcon, Checkbox, type CheckboxProps, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, Chip, type ChipProps, CircularProgress, CircularProgressIcon, type CircularProgressIconProps, ClickAwayListener, type ClickAwayListenerProps, ClipboardIcon, CloseIcon, Collapse, type CollapseProps, type Column, type ColumnVisibilityModel, ContactsIcon, Container, type ContainerMaxWidth, type ContainerProps, CopyIcon, CustomImage, CustomTaskItem, CustomVideo, CustomYoutube, DataGrid, type DataGridApi, type DataGridProps, DateField, type DateFieldProps, type DateFormatString, DateRangeField, type DateRangeFieldProps, type DateRangeValue, DifficultyAllIcon, DifficultyEasyIcon, DifficultyHardIcon, DifficultyMediumIcon, Divider, type DividerProps, DollarIcon, DonutLargeIcon, DownloadIcon, DownloadPdfIcon, DragIndicatorIcon, Drawer, type DrawerProps, EditChatIcon, EditIcon, EngagementIcon, type EnhancedCity, type EnhancedCountry, type EnhancedState, ExternalLinkIcon, EyeOffIcon, FactoryIcon, Fade, type FadeProps, FilterIcon, type FilterState, FlagIcon, FontFamily, FontSize, FormGroup, type FormGroupProps, FunctionIcon, GlobeIcon, Grid, type GridInitialState, type GridProps, GridViewIcon, Grow, type GrowProps, HeartIcon, HelpOutlinedIcon, HierarchyIcon, HomeIcon, INDENT_STEP, IconButton, type IconButtonProps, ImageField, type ImageFieldProps, InactiveGroupIcon, Indent, IndustryIcon, InfoIcon, InvoiceIcon, LightbulbIcon, LineHeight, LinearProgress, type LinearProgressProps, type LinearProgressVariant, Link, LinkIcon, type LinkProps, List, ListItem, ListItemButton, type ListItemButtonProps, ListItemIcon, type ListItemIconProps, type ListItemProps, ListItemText, type ListItemTextProps, type ListProps, ListStyle, ListSubheader, type ListSubheaderProps, ListViewIcon, LocationCityIcon, LocationPinIcon, LockIcon, LogsIcon, MAX_INDENT, MailIcon, type MaterialIconProps, type MaterialIconVariant, MemoryIcon, Menu, MenuDivider, MenuIcon, MenuItem, type MenuItemProps, MenuList, type MenuListProps, type MenuProps, MinExperienceIcon, MinusIcon, MoonIcon, MoreHorizontalIcon, MoreVerticalIcon, NineDotMenuIcon, NotesIcon, NotificationIcon, type NumberVariant, OpenInFullIcon, Pagination, type PaginationItemType, type PaginationModel, type PaginationProps, Paper, type PaperProps, PaperclipIcon, PersonSearchIcon, PhoneField, type PhoneFieldProps, PhoneIcon, PieChartIcon, PinIcon, PlaceIcon, PlusIcon, Popover, type PopoverProps, Popper, type PopperProps, PrintIcon, ProjectIcon, QualificationsIcon, QuestionStatusAllIcon, QuestionStatusPrivateIcon, QuestionStatusPublicIcon, QuestionTypeAllIcon, QuestionTypeCodingIcon, QuestionTypeDescriptiveIcon, QuestionTypeMultipleIcon, QuestionTypeSingleIcon, Radio, RadioGroup, type RadioGroupProps, type RadioProps, Rating, type RatingProps, RecommendIcon, RefreshIcon, RemoveIcon, ResendInviteIcon, RolesIcon, type RowClassNameParams, RufousAiIcon, RufousBirdIcon, RufousLauncherIcon, RufousLogoLoader, type RufousLogoLoaderProps, RufousTextContent, type RufousTextContentProps, RufousTextEditor, type MentionItemData as RufousTextEditorMentionItem, type RufousTextEditorProps, RufousThemeProvider, STATUS_COLORS, STATUS_IMAGES, STATUS_LABELS, SaveIcon, SearchIcon, Select, type SelectProps, SendIcon, SettingsIcon, ShareIcon, ShowChartIcon, SidebarIcon, Skeleton, type SkeletonProps, Slide, type SlideProps, Slider, type SliderProps, SmartSelect, type SmartSelectProps, Snackbar, type SnackbarProps, SoftSkillsIcon, type SortDirection, type SortModel, type SortModelItem, Stack, type StackProps, StandardButton, StarBorderIcon, StarIcon, Step, StepButton, type StepButtonProps, StepContent, type StepContentProps, StepLabel, type StepLabelProps, type StepProps, Stepper, type StepperProps, SubmitButton, SubscribeIcon, SunIcon, SuspendUserIcon, Switch, type SwitchProps, type SxProp, Tab, TabPanel, type TabPanelProps, type TabProps, Table, TableBody, type TableBodyProps, TableCell, type TableCellProps, TableContainer, type TableContainerProps, TableFooter, type TableFooterProps, TableHead, type TableHeadProps, TablePagination, type TablePaginationProps, type TableProps, TableRow, type TableRowProps, TableSortLabel, type TableSortLabelProps, Tabs, type TabsProps, TagIcon, TechnicalSkillsIcon, TextField, type TextFieldProps, TextFieldsIcon, TickIcon, Timeline, TimelineConnector, type TimelineConnectorProps, TimelineContent, type TimelineContentProps, TimelineDot, type TimelineDotColor, type TimelineDotProps, type TimelineDotVariant, TimelineItem, type TimelineItemProps, TimelineOppositeContent, type TimelineOppositeContentProps, type TimelinePosition, type TimelineProps, TimelineSeparator, type TimelineSeparatorProps, TimerIcon, ToggleButton, ToggleButtonGroup, type ToggleButtonGroupProps, type ToggleButtonProps, Tooltip, type TooltipProps, TrashIcon, type TreeNode, TreeSelect, type TreeSelectMultiValue, type TreeSelectProps, type TreeSelectValue, TrendingFlatIcon, TrendingUpIcon, Typography, type TypographyProps, UnArchivedIcon, UnlockIcon, UnsubscribeIcon, UploadIcon, UserAssignIcon, UserIcon, type UserOption, UserSelectionField, type UserSelectionFieldProps, UsersIcon, ViewIcon, WorkItemIcon, XCircleIcon, Zoom, ZoomInIcon, ZoomOutIcon, type ZoomProps, getAllCountries, getCitiesByName, getCitiesOfCountry, getCitiesOfState, getCityByName, getCountriesByName, getCountryByCode, getCountryByName, getStateByCode, getStateByName, getStatesByName, getStatesOfCountry, transformLegacyTodos, useCitiesSearch, useCountriesSearch, useRufousTheme, useStatesSearch };