@campxdev/react-blueprint 3.0.0-alpha.1 → 3.0.0-alpha.3

package/dist/esm/types/src/components/DataDisplay/DataTable/DataTable.d.ts

@@ -19,6 +19,9 @@ type DataTableProps<TData = any> = {
     rowSelectionModel?: Record<string, boolean>;
     onRowSelectionModelChange?: (newRowSelectionModel: Record<string, boolean>) => void;
     selectionActions?: React.ReactNode[];
+    onRowClick?: (params: {
+        row: Row<TData>;
+    }) => void;
     enableSorting?: boolean;
     sortingState?: SortingState;
     onSortingChange?: (newSortingState: SortingState) => void;

package/dist/esm/types/src/components/DataDisplay/DataTable/components/TableView.d.ts

@@ -15,6 +15,9 @@ interface TableViewProps<TData = any> {
     totalCount?: number;
     onPageChange?: (page: number) => void;
     onLimitChange?: (limit: number) => void;
+    onRowClick?: (params: {
+        row: Row<TData>;
+    }) => void;
 }
 declare const TableView: React.ForwardRefExoticComponent<TableViewProps<any> & React.RefAttributes<HTMLDivElement>>;
 export default TableView;

package/dist/esm/types/src/components/Input/DatePicker/DatePicker.d.ts

@@ -1,4 +1,3 @@
-import * as React from 'react';
 type DateFormat = 'yyyy' | 'MMMM yyyy' | 'dd MMMM yyyy' | 'dd/MM/yyyy';
 export type DatePickerProps = {
     label?: React.ReactNode | string;
@@ -28,7 +27,8 @@ export type DatePickerProps = {
     onOpen?: () => void;
     onClose?: () => void;
     onBlur?: React.FocusEventHandler;
+    fullWidth?: boolean;
     [key: string]: any;
 };
-export declare const DatePicker: ({ label, name, value, onChange, required, format, helperText, placeholder, shortcutsItems, openPickerIcon: Icon, containerProps, error, disabled, minDate, maxDate, disablePast, disableFuture, shouldDisableDate, shouldDisableMonth, shouldDisableYear, className, onOpen, onClose, ...rest }: DatePickerProps) => import("react/jsx-runtime").JSX.Element;
+export declare const DatePicker: ({ label, name, value, onChange, required, format, helperText, placeholder, shortcutsItems, openPickerIcon: Icon, containerProps, error, disabled, minDate, maxDate, disablePast, disableFuture, shouldDisableDate, shouldDisableMonth, shouldDisableYear, className, onOpen, onClose, fullWidth, ...rest }: DatePickerProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/esm/types/src/components/Input/DateTimePicker/DateTimePicker.d.ts

@@ -1,4 +1,3 @@
-import * as React from 'react';
 type DateTimePickerViews = 'year' | 'month' | 'day' | 'hours' | 'minutes' | 'seconds';
 type DateTimeFormat = 'yyyy' | 'MMMM yyyy' | 'MMM yyyy' | 'dd MMMM yyyy' | 'dd/MM/yyyy' | 'MM/dd/yyyy' | 'yyyy-MM-dd' | 'yyyy-MM-dd hh:mm a' | 'dd MMM yyyy hh:mm a' | 'dd/MM/yyyy hh:mm a' | 'yyyy-MM-dd hh:mm:ss a' | 'dd MMM yyyy hh:mm:ss a' | 'dd/MM/yyyy hh:mm:ss a' | 'hh:mm a' | 'hh:mm:ss a' | 'MMM dd, yyyy hh:mm a' | 'MMM dd, yyyy hh:mm:ss a' | 'EEE, MMM dd yyyy' | 'EEEE, MMMM dd, yyyy';
 export type DateTimePickerProps = {
@@ -30,7 +29,8 @@ export type DateTimePickerProps = {
     onOpen?: () => void;
     onClose?: () => void;
     onBlur?: React.FocusEventHandler;
+    fullWidth?: boolean;
     [key: string]: any;
 };
-export declare const DateTimePicker: ({ label, name, value, onChange, required, format, views, helperText, placeholder, shortcutsItems, openPickerIcon: Icon, containerProps, error, disabled, minDate, maxDate, disablePast, disableFuture, shouldDisableDate, shouldDisableMonth, shouldDisableYear, className, onOpen, onClose, ...rest }: DateTimePickerProps) => import("react/jsx-runtime").JSX.Element;
+export declare const DateTimePicker: ({ label, name, value, onChange, required, format, views, helperText, placeholder, shortcutsItems, openPickerIcon: Icon, containerProps, error, disabled, minDate, maxDate, disablePast, disableFuture, shouldDisableDate, shouldDisableMonth, shouldDisableYear, className, onOpen, onClose, fullWidth, ...rest }: DateTimePickerProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/esm/types/src/components/Input/PasswordField/PasswordField.d.ts

@@ -11,5 +11,6 @@ export type PasswordFieldProps = {
     error?: boolean;
     helperText?: string;
     className?: string;
+    fullWidth?: boolean;
 } & Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type'>;
-export declare const PasswordField: ({ name, label, value, onChange, required, containerProps, description, placeholder, disabled, error, helperText, className, ...rest }: PasswordFieldProps) => import("react/jsx-runtime").JSX.Element;
+export declare const PasswordField: ({ name, label, value, onChange, required, containerProps, description, placeholder, disabled, error, helperText, className, fullWidth, ...rest }: PasswordFieldProps) => import("react/jsx-runtime").JSX.Element;

package/dist/esm/types/src/components/Input/TextField/TextField.d.ts

@@ -7,5 +7,6 @@ export type TextFieldProps = {
     required?: boolean;
     fullWidth?: boolean;
     error?: boolean;
+    helperText?: React.ReactNode;
 } & React.ComponentProps<typeof Input>;
-export declare const TextField: ({ name, label, value, onChange, required, containerProps, description, fullWidth, className, error, ...rest }: TextFieldProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TextField: ({ name, label, value, onChange, required, containerProps, description, fullWidth, className, error, helperText, ...rest }: TextFieldProps) => import("react/jsx-runtime").JSX.Element;

package/dist/esm/types/src/components/Input/Textarea/Textarea.d.ts

@@ -0,0 +1,12 @@
+import { Textarea as ShadcnTextarea } from '@/shadcn-components/Input/Textarea/Textarea';
+import * as React from 'react';
+export type TextareaProps = {
+    containerProps?: React.HTMLAttributes<HTMLDivElement>;
+    description?: string;
+    label?: React.ReactNode | string;
+    required?: boolean;
+    fullWidth?: boolean;
+    error?: boolean;
+    helperText?: React.ReactNode;
+} & React.ComponentProps<typeof ShadcnTextarea>;
+export declare const Textarea: ({ name, label, value, onChange, required, containerProps, description, fullWidth, className, error, helperText, ...rest }: TextareaProps) => import("react/jsx-runtime").JSX.Element;

package/dist/esm/types/src/components/Input/export.d.ts

@@ -17,4 +17,5 @@ export * from './Select/Select';
 export * from './SingleCheckBox/SingleCheckBox';
 export * from './SingleSelect/SingleSelect';
 export * from './Switch/Switch';
+export * from './Textarea/Textarea';
 export * from './TextField/TextField';

package/dist/esm/types/src/components/Layout/AppLayout/index.d.ts

@@ -3,3 +3,4 @@ export type { AppLayoutProps, HelpDocsAction, HelpDocsConfig } from './types';
 export { SidebarProvider, useSidebar } from './context/SidebarContext';
 export { MenuToggleButton } from './components/MenuToggleButton';
 export { UserProfilePopup } from './components/UserProfilePopup';
+export * from './components/Sidebar/interfaces';

package/dist/esm/types/src/components/Layout/PageHeader/PageHeader.d.ts

@@ -3,7 +3,8 @@ import { SearchBarProps } from '../../Input/SearchBar/SearchBar';
 interface PageHeaderProps {
     uniqueId?: string;
     pathTrimCount: number;
-    searchButtonProps?: SearchBarProps;
+    breadcrumbAction?: ReactElement;
+    searchBarProps?: SearchBarProps;
     filterButtonProps?: {
         label?: string;
         startIcon?: ReactNode;
@@ -19,5 +20,5 @@ interface PageHeaderProps {
         }) => ReactNode[]);
     };
 }
-declare const PageHeader: ({ uniqueId, pathTrimCount, searchButtonProps, filterButtonProps, addButtonProps, actionProps, }: PageHeaderProps) => import("react/jsx-runtime").JSX.Element;
+declare const PageHeader: ({ uniqueId, pathTrimCount, breadcrumbAction, searchBarProps, filterButtonProps, addButtonProps, actionProps, }: PageHeaderProps) => import("react/jsx-runtime").JSX.Element;
 export { PageHeader, type PageHeaderProps };

package/dist/esm/types/src/components/Navigation/Breadcrumbs/Breadcrumbs.d.ts

@@ -1,5 +1,7 @@
+import { ReactElement } from 'react';
 export type BreadcrumbsProps = {
     pathTrimCount: number;
     containerClassName?: string;
+    action?: ReactElement;
 };
-export declare const Breadcrumbs: ({ pathTrimCount, containerClassName, }: BreadcrumbsProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Breadcrumbs: ({ pathTrimCount, containerClassName, action, }: BreadcrumbsProps) => import("react/jsx-runtime").JSX.Element;

package/dist/esm/types/src/shadcn-components/Input/Textarea/Textarea.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+declare function Textarea({ className, ...props }: React.ComponentProps<'textarea'>): import("react/jsx-runtime").JSX.Element;
+export { Textarea };

package/dist/index.d.ts

@@ -6,7 +6,7 @@ import { LayoutType, AnimationTiming } from 'recharts/types/util/types';
 import { CurveType } from 'recharts/types/shape/Curve';
 import * as class_variance_authority_dist_types from 'class-variance-authority/dist/types';
 import { VariantProps } from 'class-variance-authority';
-import { ColumnDef, SortingState, Row } from '@tanstack/react-table';
+import { ColumnDef, Row, SortingState } from '@tanstack/react-table';
 export { ColumnDef } from '@tanstack/react-table';
 import { Axios, AxiosInstance } from 'axios';
 import * as SeparatorPrimitive from '@radix-ui/react-separator';
@@ -437,7 +437,7 @@ interface CardProps extends Omit<React$1.ComponentProps<typeof Card$1>, 'title'
 declare const Card: React$1.ForwardRefExoticComponent<Omit<CardProps, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
 
 declare const badgeVariants: (props?: ({
-    variant?: "default" | "secondary" | "destructive" | "outline" | null | undefined;
+    variant?: "default" | "destructive" | "outline" | "secondary" | null | undefined;
 } & class_variance_authority_dist_types.ClassProp) | undefined) => string;
 declare function Badge({ className, variant, asChild, ...props }: React$1.ComponentProps<'span'> & VariantProps<typeof badgeVariants> & {
     asChild?: boolean;
@@ -488,6 +488,9 @@ type DataTableProps<TData = any> = {
     rowSelectionModel?: Record<string, boolean>;
     onRowSelectionModelChange?: (newRowSelectionModel: Record<string, boolean>) => void;
     selectionActions?: React__default.ReactNode[];
+    onRowClick?: (params: {
+        row: Row<TData>;
+    }) => void;
     enableSorting?: boolean;
     sortingState?: SortingState;
     onSortingChange?: (newSortingState: SortingState) => void;
@@ -510,7 +513,7 @@ type DataTableProps<TData = any> = {
 declare const DataTable: <TData extends Record<string, any> = any>(props: DataTableProps<TData>) => react_jsx_runtime.JSX.Element;
 
 declare const typographyVariants: (props?: ({
-    variant?: "blockquote" | "h1" | "h2" | "h3" | "h4" | "p" | "small" | "list" | "muted" | "inlineCode" | "lead" | "large" | null | undefined;
+    variant?: "blockquote" | "h1" | "h2" | "h3" | "h4" | "p" | "small" | "list" | "inlineCode" | "lead" | "large" | "muted" | null | undefined;
 } & class_variance_authority_dist_types.ClassProp) | undefined) => string;
 interface TypographyProps extends React$1.HTMLAttributes<HTMLElement>, VariantProps<typeof typographyVariants> {
     as?: React$1.ElementType;
@@ -612,7 +615,7 @@ type TooltipProps = {
 declare const Tooltip: ({ children, title, placement, open, defaultOpen, onOpenChange, delayDuration, }: TooltipProps) => react_jsx_runtime.JSX.Element;
 
 declare const buttonVariants: (props?: ({
-    variant?: "input" | "link" | "default" | "secondary" | "destructive" | "outline" | "ghost" | null | undefined;
+    variant?: "input" | "link" | "default" | "destructive" | "outline" | "secondary" | "ghost" | null | undefined;
     size?: "default" | "sm" | "lg" | "icon" | "icon-sm" | "icon-lg" | null | undefined;
 } & class_variance_authority_dist_types.ClassProp) | undefined) => string;
 
@@ -627,7 +630,7 @@ declare const Button: ({ loading, disabled, children, startIcon, endIcon, fullWi
 
 type DateFormat = 'yyyy' | 'MMMM yyyy' | 'dd MMMM yyyy' | 'dd/MM/yyyy';
 type DatePickerProps = {
-    label?: React$1.ReactNode | string;
+    label?: React.ReactNode | string;
     name?: string;
     value?: Date;
     onChange?: (date: Date | undefined) => void;
@@ -639,8 +642,8 @@ type DatePickerProps = {
         getValue: () => Date;
     }[];
     required?: boolean;
-    containerProps?: React$1.HTMLAttributes<HTMLDivElement>;
-    openPickerIcon?: React$1.ReactNode;
+    containerProps?: React.HTMLAttributes<HTMLDivElement>;
+    openPickerIcon?: React.ReactNode;
     error?: any;
     disabled?: boolean;
     minDate?: Date;
@@ -653,15 +656,16 @@ type DatePickerProps = {
     className?: string;
     onOpen?: () => void;
     onClose?: () => void;
-    onBlur?: React$1.FocusEventHandler;
+    onBlur?: React.FocusEventHandler;
+    fullWidth?: boolean;
     [key: string]: any;
 };
-declare const DatePicker: ({ label, name, value, onChange, required, format, helperText, placeholder, shortcutsItems, openPickerIcon: Icon, containerProps, error, disabled, minDate, maxDate, disablePast, disableFuture, shouldDisableDate, shouldDisableMonth, shouldDisableYear, className, onOpen, onClose, ...rest }: DatePickerProps) => react_jsx_runtime.JSX.Element;
+declare const DatePicker: ({ label, name, value, onChange, required, format, helperText, placeholder, shortcutsItems, openPickerIcon: Icon, containerProps, error, disabled, minDate, maxDate, disablePast, disableFuture, shouldDisableDate, shouldDisableMonth, shouldDisableYear, className, onOpen, onClose, fullWidth, ...rest }: DatePickerProps) => react_jsx_runtime.JSX.Element;
 
 type DateTimePickerViews = 'year' | 'month' | 'day' | 'hours' | 'minutes' | 'seconds';
 type DateTimeFormat = 'yyyy' | 'MMMM yyyy' | 'MMM yyyy' | 'dd MMMM yyyy' | 'dd/MM/yyyy' | 'MM/dd/yyyy' | 'yyyy-MM-dd' | 'yyyy-MM-dd hh:mm a' | 'dd MMM yyyy hh:mm a' | 'dd/MM/yyyy hh:mm a' | 'yyyy-MM-dd hh:mm:ss a' | 'dd MMM yyyy hh:mm:ss a' | 'dd/MM/yyyy hh:mm:ss a' | 'hh:mm a' | 'hh:mm:ss a' | 'MMM dd, yyyy hh:mm a' | 'MMM dd, yyyy hh:mm:ss a' | 'EEE, MMM dd yyyy' | 'EEEE, MMMM dd, yyyy';
 type DateTimePickerProps = {
-    label?: React$1.ReactNode | string;
+    label?: React.ReactNode | string;
     name?: string;
     value?: Date;
     onChange?: (date: Date | undefined) => void;
@@ -674,8 +678,8 @@ type DateTimePickerProps = {
         getValue: () => Date;
     }[];
     required?: boolean;
-    containerProps?: React$1.HTMLAttributes<HTMLDivElement>;
-    openPickerIcon?: React$1.ReactNode;
+    containerProps?: React.HTMLAttributes<HTMLDivElement>;
+    openPickerIcon?: React.ReactNode;
     error?: any;
     disabled?: boolean;
     minDate?: Date;
@@ -688,10 +692,11 @@ type DateTimePickerProps = {
     className?: string;
     onOpen?: () => void;
     onClose?: () => void;
-    onBlur?: React$1.FocusEventHandler;
+    onBlur?: React.FocusEventHandler;
+    fullWidth?: boolean;
     [key: string]: any;
 };
-declare const DateTimePicker: ({ label, name, value, onChange, required, format, views, helperText, placeholder, shortcutsItems, openPickerIcon: Icon, containerProps, error, disabled, minDate, maxDate, disablePast, disableFuture, shouldDisableDate, shouldDisableMonth, shouldDisableYear, className, onOpen, onClose, ...rest }: DateTimePickerProps) => react_jsx_runtime.JSX.Element;
+declare const DateTimePicker: ({ label, name, value, onChange, required, format, views, helperText, placeholder, shortcutsItems, openPickerIcon: Icon, containerProps, error, disabled, minDate, maxDate, disablePast, disableFuture, shouldDisableDate, shouldDisableMonth, shouldDisableYear, className, onOpen, onClose, fullWidth, ...rest }: DateTimePickerProps) => react_jsx_runtime.JSX.Element;
 
 type FileUploadProps = {
     label: string;
@@ -847,8 +852,9 @@ type PasswordFieldProps = {
     error?: boolean;
     helperText?: string;
     className?: string;
+    fullWidth?: boolean;
 } & Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type'>;
-declare const PasswordField: ({ name, label, value, onChange, required, containerProps, description, placeholder, disabled, error, helperText, className, ...rest }: PasswordFieldProps) => react_jsx_runtime.JSX.Element;
+declare const PasswordField: ({ name, label, value, onChange, required, containerProps, description, placeholder, disabled, error, helperText, className, fullWidth, ...rest }: PasswordFieldProps) => react_jsx_runtime.JSX.Element;
 
 type RadioGroupProps = {
     containerProps?: React.HTMLAttributes<HTMLDivElement>;
@@ -957,6 +963,19 @@ interface SwitchProps extends React$1.ComponentPropsWithoutRef<typeof Switch$1>
 }
 declare const Switch: React$1.ForwardRefExoticComponent<SwitchProps & React$1.RefAttributes<HTMLButtonElement>>;
 
+declare function Textarea$1({ className, ...props }: React$1.ComponentProps<'textarea'>): react_jsx_runtime.JSX.Element;
+
+type TextareaProps = {
+    containerProps?: React$1.HTMLAttributes<HTMLDivElement>;
+    description?: string;
+    label?: React$1.ReactNode | string;
+    required?: boolean;
+    fullWidth?: boolean;
+    error?: boolean;
+    helperText?: React$1.ReactNode;
+} & React$1.ComponentProps<typeof Textarea$1>;
+declare const Textarea: ({ name, label, value, onChange, required, containerProps, description, fullWidth, className, error, helperText, ...rest }: TextareaProps) => react_jsx_runtime.JSX.Element;
+
 declare function Input({ className, type, ...props }: React$1.ComponentProps<"input">): react_jsx_runtime.JSX.Element;
 
 type TextFieldProps = {
@@ -966,8 +985,9 @@ type TextFieldProps = {
     required?: boolean;
     fullWidth?: boolean;
     error?: boolean;
+    helperText?: React$1.ReactNode;
 } & React$1.ComponentProps<typeof Input>;
-declare const TextField: ({ name, label, value, onChange, required, containerProps, description, fullWidth, className, error, ...rest }: TextFieldProps) => react_jsx_runtime.JSX.Element;
+declare const TextField: ({ name, label, value, onChange, required, containerProps, description, fullWidth, className, error, helperText, ...rest }: TextFieldProps) => react_jsx_runtime.JSX.Element;
 
 interface SideMenuItemProps {
     name: string;
@@ -982,6 +1002,51 @@ interface SubMenuData {
     path: string;
     permissionKey?: string;
 }
+interface MenuState {
+    menu: SideMenuItemProps[];
+    title: string | null;
+    path: string | null;
+}
+interface GetActiveMenuProps {
+    menu: SideMenuItemProps[];
+    pathArray: string[];
+    previousMenuState: any;
+}
+interface InternalMenuClickHandlerProps {
+    menuTitle: string;
+    menuPath: string;
+    internalMenu: SideMenuItemProps[];
+}
+interface SidebarNavigationHook {
+    menuPosition: number;
+    currentMenuState: MenuState;
+    history: MenuState[];
+    internalMenuClickHandler: (params: InternalMenuClickHandlerProps) => void;
+    previousMenuClickHandler: () => void;
+}
+interface MenuItemProps {
+    index: number;
+    menuItem: SideMenuItemProps;
+    currentMenuPath: string | null;
+    internalMenuClickHandler: (params: InternalMenuClickHandlerProps) => void;
+    onClose?: () => void;
+    collapsed?: boolean;
+    setCollapsed?: any;
+}
+interface SubMenuItemProps {
+    index: number;
+    subMenuItem: SubMenuData;
+    subMenuButtonPath: string;
+}
+interface MenuBarProps {
+    currentMenuState: MenuState;
+    menuPosition: number;
+    internalMenuClickHandler: (params: InternalMenuClickHandlerProps) => void;
+    previousMenuClickHandler: () => void;
+    onClose?: () => void;
+    collapsed?: boolean;
+    setCollapsed?: any;
+}
 
 interface UserProfilePopupProps {
     /** User's full name */
@@ -1078,7 +1143,8 @@ declare const PageContent: ({ children, className }: PageContentProps) => react_
 interface PageHeaderProps {
     uniqueId?: string;
     pathTrimCount: number;
-    searchButtonProps?: SearchBarProps;
+    breadcrumbAction?: ReactElement;
+    searchBarProps?: SearchBarProps;
     filterButtonProps?: {
         label?: string;
         startIcon?: ReactNode;
@@ -1094,13 +1160,14 @@ interface PageHeaderProps {
         }) => ReactNode[]);
     };
 }
-declare const PageHeader: ({ uniqueId, pathTrimCount, searchButtonProps, filterButtonProps, addButtonProps, actionProps, }: PageHeaderProps) => react_jsx_runtime.JSX.Element;
+declare const PageHeader: ({ uniqueId, pathTrimCount, breadcrumbAction, searchBarProps, filterButtonProps, addButtonProps, actionProps, }: PageHeaderProps) => react_jsx_runtime.JSX.Element;
 
 type BreadcrumbsProps = {
     pathTrimCount: number;
     containerClassName?: string;
+    action?: ReactElement;
 };
-declare const Breadcrumbs: ({ pathTrimCount, containerClassName, }: BreadcrumbsProps) => react_jsx_runtime.JSX.Element;
+declare const Breadcrumbs: ({ pathTrimCount, containerClassName, action, }: BreadcrumbsProps) => react_jsx_runtime.JSX.Element;
 
 interface CalendarEvent {
     id: string | number;
@@ -1497,5 +1564,5 @@ declare const splitBreadcrumbIdSlug: (param: string) => {
 declare const isLocal: boolean;
 declare const isDevelopment: boolean;
 
-export { Accordion, ActivityLogView, Alert, AnimatedGIFs, AppLayout, Breadcrumbs, Button, Calendar, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, Card$1 as CardRoot, CardTitle, Chip, Chips, CircularAvatar, ComingSoon, ConfirmDialog, DataTable, DatePicker, DateTimePicker, Dialog, DialogButton, DropDownButton, DropDownIcon, DropdownMenu, DropdownMenuItem, EmptyIllustration, FileUpload, FormActions, FormControlWrapper, FormWrapper, HorizontalBarChart, HorizontalStepper, IconButtons, Icons, InternalServerError, LabelWrapper, LineChart, MenuToggleButton, MultiCheckBox, MultiSelect, NoInterneConnection, NoItemFound, OtpInput, PageContent, PageHeader, PageNotFound, PasswordField, PieChart, PreviewFiles, RadioGroup, ReactJoyRide, ResourceNotFound, SearchBar, Select, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, SidebarProvider, SingleCheckBox, SingleSelect, Skeleton, Snackbar, Spinner, StatusCard, Stepper, Svgs, Switch, TablePagination, TabsContainer, TextField, Timeline, Tooltip, Typography, UnAuthorized, UploadDialog, UserProfilePopup, VerticalBarChart, VerticalStepper, buttonVariants, calculateEventStats, cn, createBreadcrumbIdSlug, exportEventsToCSV, filterEventsByDateRange, generateBusinessEvents, generateRecurringEvents, getBreadcrumbsCharacter, groupEventsByDate, isDevelopment, isLocal, reactBlueprintReducers, splitBreadcrumbIdSlug, typographyVariants, useMediaQuery, usePageHeader, useParams, useSidebar, useUrlParams, validateEvent };
-export type { AccordionItemProps, Activity, ActivityAction, AlertProps, AppLayoutProps, BarChartData, BarChartProps, BarChartVariant, BreadcrumbsProps, ButtonConfig, ButtonProps, CalendarDateClickInfo, CalendarDateSelectInfo, CalendarEvent, CalendarEventClickInfo, CalendarEventDropInfo, CalendarEventResizeInfo, CalendarHeaderToolbar, CalendarProps, CalendarView, CardProps, ChartConfig, CheckboxProps, ChipProps, CircularAvatarProps, ConfirmDialogProps, ConfirmDialogType, DataTableProps, DatePickerProps, DateTimePickerProps, DialogButtonProps, DialogProps, DropdownMenuItemProps, DropdownMenuProps, EventStats, FileUploadProps, FormActionsProps, HelpDocsAction, HelpDocsConfig, HorizontalBarChartProps, IconComponent, IconProps, IconsType, LabelWrapperProps, LineChartProps, MaxWidthSize$1 as MaxWidthSize, MultiCheckboxProps, MultiSelectProps, OtpInputProps, PageHeaderProps, PaginationProps, PasswordFieldProps, PieChartProps, PreviewFilesProps, RadioGroupProps, RecurringEventConfig, SearchBarProps, SelectProps, Severity, SingleSelectProps, SnackbarPosition, SnackbarProps, StatusCardProps, StepItem, StepperProps, StepperVariantProps, SwitchProps, TabsContainerProps, TextFieldProps, TimelineItems, TimelineProps, TooltipProps, TreeMapProps, TypographyProps, UploadDialogProps, VerticalBarChartProps };
+export { Accordion, ActivityLogView, Alert, AnimatedGIFs, AppLayout, Breadcrumbs, Button, Calendar, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, Card$1 as CardRoot, CardTitle, Chip, Chips, CircularAvatar, ComingSoon, ConfirmDialog, DataTable, DatePicker, DateTimePicker, Dialog, DialogButton, DropDownButton, DropDownIcon, DropdownMenu, DropdownMenuItem, EmptyIllustration, FileUpload, FormActions, FormControlWrapper, FormWrapper, HorizontalBarChart, HorizontalStepper, IconButtons, Icons, InternalServerError, LabelWrapper, LineChart, MenuToggleButton, MultiCheckBox, MultiSelect, NoInterneConnection, NoItemFound, OtpInput, PageContent, PageHeader, PageNotFound, PasswordField, PieChart, PreviewFiles, RadioGroup, ReactJoyRide, ResourceNotFound, SearchBar, Select, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, SidebarProvider, SingleCheckBox, SingleSelect, Skeleton, Snackbar, Spinner, StatusCard, Stepper, Svgs, Switch, TablePagination, TabsContainer, TextField, Textarea, Timeline, Tooltip, Typography, UnAuthorized, UploadDialog, UserProfilePopup, VerticalBarChart, VerticalStepper, buttonVariants, calculateEventStats, cn, createBreadcrumbIdSlug, exportEventsToCSV, filterEventsByDateRange, generateBusinessEvents, generateRecurringEvents, getBreadcrumbsCharacter, groupEventsByDate, isDevelopment, isLocal, reactBlueprintReducers, splitBreadcrumbIdSlug, typographyVariants, useMediaQuery, usePageHeader, useParams, useSidebar, useUrlParams, validateEvent };
+export type { AccordionItemProps, Activity, ActivityAction, AlertProps, AppLayoutProps, BarChartData, BarChartProps, BarChartVariant, BreadcrumbsProps, ButtonConfig, ButtonProps, CalendarDateClickInfo, CalendarDateSelectInfo, CalendarEvent, CalendarEventClickInfo, CalendarEventDropInfo, CalendarEventResizeInfo, CalendarHeaderToolbar, CalendarProps, CalendarView, CardProps, ChartConfig, CheckboxProps, ChipProps, CircularAvatarProps, ConfirmDialogProps, ConfirmDialogType, DataTableProps, DatePickerProps, DateTimePickerProps, DialogButtonProps, DialogProps, DropdownMenuItemProps, DropdownMenuProps, EventStats, FileUploadProps, FormActionsProps, GetActiveMenuProps, HelpDocsAction, HelpDocsConfig, HorizontalBarChartProps, IconComponent, IconProps, IconsType, InternalMenuClickHandlerProps, LabelWrapperProps, LineChartProps, MaxWidthSize$1 as MaxWidthSize, MenuBarProps, MenuItemProps, MenuState, MultiCheckboxProps, MultiSelectProps, OtpInputProps, PageHeaderProps, PaginationProps, PasswordFieldProps, PieChartProps, PreviewFilesProps, RadioGroupProps, RecurringEventConfig, SearchBarProps, SelectProps, Severity, SideMenuItemProps, SidebarNavigationHook, SingleSelectProps, SnackbarPosition, SnackbarProps, StatusCardProps, StepItem, StepperProps, StepperVariantProps, SubMenuData, SubMenuItemProps, SwitchProps, TabsContainerProps, TextFieldProps, TextareaProps, TimelineItems, TimelineProps, TooltipProps, TreeMapProps, TypographyProps, UploadDialogProps, VerticalBarChartProps };

package/dist/styles.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */
 @import url('https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700&display=swap');
 @layer properties;
 @layer theme, base, components, utilities;
@@ -495,9 +495,6 @@
   .my-6 {
     margin-block: calc(var(--spacing) * 6);
   }
-  .mt-0 {
-    margin-top: calc(var(--spacing) * 0);
-  }
   .mt-0\.5 {
     margin-top: calc(var(--spacing) * 0.5);
   }
@@ -603,6 +600,9 @@
   .table-row {
     display: table-row;
   }
+  .field-sizing-content {
+    field-sizing: content;
+  }
   .aspect-square {
     aspect-ratio: 1 / 1;
   }
@@ -629,6 +629,10 @@
     width: calc(var(--spacing) * 4);
     height: calc(var(--spacing) * 4);
   }
+  .size-5 {
+    width: calc(var(--spacing) * 5);
+    height: calc(var(--spacing) * 5);
+  }
   .size-8 {
     width: calc(var(--spacing) * 8);
     height: calc(var(--spacing) * 8);
@@ -790,6 +794,9 @@
   .min-h-4 {
     min-height: calc(var(--spacing) * 4);
   }
+  .min-h-16 {
+    min-height: calc(var(--spacing) * 16);
+  }
   .min-h-\[2rem\] {
     min-height: 2rem;
   }
@@ -3100,11 +3107,6 @@
       margin-inline: calc(var(--spacing) * 0);
     }
   }
-  .md\:mt-2 {
-    @media (width >= 48rem) {
-      margin-top: calc(var(--spacing) * 2);
-    }
-  }
   .md\:block {
     @media (width >= 48rem) {
       display: block;
@@ -3652,11 +3654,6 @@
       border-bottom-right-radius: calc(var(--radius) - 2px);
     }
   }
-  .\[\&\:not\(\:first-child\)\]\:mt-6 {
-    &:not(:first-child) {
-      margin-top: calc(var(--spacing) * 6);
-    }
-  }
   .\[\&\:nth-child\(2\)\[data-selected\=true\]_button\]\:rounded-l-md {
     &:nth-child(2)[data-selected=true] button {
       border-top-left-radius: calc(var(--radius) - 2px);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@campxdev/react-blueprint",
-  "version": "3.0.0-alpha.1",
+  "version": "3.0.0-alpha.3",
   "description": "React UI component library for CampX applications",
   "author": "CampX",
   "license": "MIT",

package/src/components/DataDisplay/DataTable/DataTable.tsx

@@ -51,6 +51,9 @@ type DataTableProps<TData = any> = {
   ) => void;
   selectionActions?: React.ReactNode[];
 
+  // Row click handler
+  onRowClick?: (params: { row: Row<TData> }) => void;
+
   // Sorting props
   enableSorting?: boolean;
   sortingState?: SortingState;
@@ -106,6 +109,7 @@ const DataTable = <TData extends Record<string, any> = any>(
     cellClassName,
     isLoading = false,
     columnVisibilityModel,
+    onRowClick,
   } = props;
 
   // Get layout mode and column visibility from Redux if tableActionProps is provided
@@ -290,6 +294,7 @@ const DataTable = <TData extends Record<string, any> = any>(
           totalCount={totalCount}
           onPageChange={onPageChange}
           onLimitChange={onLimitChange}
+          onRowClick={onRowClick}
         />
       )}
     </div>

package/src/components/DataDisplay/DataTable/components/TableHeaders/TableActionHeader.tsx

@@ -33,7 +33,7 @@ const TableActionHeader = ({
     viewsProps.type,
     async (): Promise<View[]> => {
       return viewsProps.axios
-        .get(`admin/views/user-views/${viewsProps.type}`)
+        .get(`/admin/views/user-views/${viewsProps.type}`)
         .then((data) => data.data);
     },
   );

package/src/components/DataDisplay/DataTable/components/TableView.tsx

@@ -29,6 +29,7 @@ interface TableViewProps<TData = any> {
   totalCount?: number;
   onPageChange?: (page: number) => void;
   onLimitChange?: (limit: number) => void;
+  onRowClick?: (params: { row: Row<TData> }) => void;
 }
 
 const TableView = React.forwardRef<HTMLDivElement, TableViewProps>(
@@ -48,6 +49,7 @@ const TableView = React.forwardRef<HTMLDivElement, TableViewProps>(
       totalCount,
       onPageChange,
       onLimitChange,
+      onRowClick,
     },
     ref,
   ) => {
@@ -131,14 +133,16 @@ const TableView = React.forwardRef<HTMLDivElement, TableViewProps>(
                   className={rowHeightClass}
                 >
                   {/* Use visible header columns count to render correct number of skeleton cells */}
-                  {table.getHeaderGroups()[0]?.headers.map((_: any, cellIndex: number) => (
-                    <TableCell
-                      key={`skeleton-cell-${rowIndex}-${cellIndex}`}
-                      className={cn(cellIndex === 0 && 'pl-4', cellClassName)}
-                    >
-                      <Skeleton className="h-4 w-full" />
-                    </TableCell>
-                  ))}
+                  {table
+                    .getHeaderGroups()[0]
+                    ?.headers.map((_: any, cellIndex: number) => (
+                      <TableCell
+                        key={`skeleton-cell-${rowIndex}-${cellIndex}`}
+                        className={cn(cellIndex === 0 && 'pl-4', cellClassName)}
+                      >
+                        <Skeleton className="h-4 w-full" />
+                      </TableCell>
+                    ))}
                 </TableRow>
               ))
             ) : table.getRowModel().rows?.length ? (
@@ -153,6 +157,7 @@ const TableView = React.forwardRef<HTMLDivElement, TableViewProps>(
                     key={row.id}
                     data-state={row.getIsSelected() && 'selected'}
                     className={cn(rowHeightClass, customRowClassName)}
+                    onClick={() => onRowClick?.({ row })}
                   >
                     {row.getVisibleCells().map((cell: any, index: number) => (
                       <TableCell

package/src/components/DataDisplay/DataTable/components/ViewList/ViewButton.tsx

@@ -103,7 +103,7 @@ export const ViewButton = ({
         />
 
         <ConfirmDialog
-          message="Do you really want to delete the selected leads? This action cannot be undone."
+          message="Do you really want to delete this view? This action cannot be undone."
           isOpen={dialogOpen}
           onCancel={() => {
             setDialogOpen(false);

package/src/components/Feedback/Snackbar/Snackbar.tsx

@@ -5,7 +5,7 @@ import {
   TriangleAlertIcon,
   XIcon,
 } from 'lucide-react';
-import { useEffect, useState } from 'react';
+import { useEffect } from 'react';
 import { Typography } from '../../DataDisplay/Typography/Typography';
 import { Button } from '../../Input/Button/Button';
 
@@ -33,12 +33,9 @@ export const Snackbar = ({
   anchorOrigin,
   autoHideDuration,
 }: SnackbarProps) => {
-  const [visible, setVisible] = useState(open);
-
   useEffect(() => {
     if (open && autoHideDuration) {
       const timer = setTimeout(() => {
-        setVisible(false);
         if (onClose) {
           onClose('timeout');
         }
@@ -61,13 +58,12 @@ export const Snackbar = ({
   };
 
   const handleClose = () => {
-    setVisible(false);
     if (onClose) {
       onClose('clickaway');
     }
   };
 
-  if (!visible) return null;
+  if (!open) return null;
 
   const vertical = anchorOrigin?.vertical || 'top';
   const horizontal = anchorOrigin?.horizontal || 'center';
@@ -83,12 +79,13 @@ export const Snackbar = ({
 
   return (
     <div
-      className={`fixed ${positionClasses} z-[9999] pointer-events-auto`}
+      className={`fixed ${positionClasses} z-[9999] pointer-events-auto w-fit max-w-lg`}
       role="alert"
       aria-live="polite"
     >
       <div
-        className={`group pointer-events-auto relative flex w-full max-w-md items-center justify-between space-x-4 overflow-hidden rounded-md border p-6 pr-8 shadow-lg transition-all`}
+        className={`group pointer-events-auto relative flex bg-background items-center justify-between space-x-4 overflow-hidden rounded-md border p-6 pr-8 shadow-lg transition-all`}
+        style={{ minWidth: '350px' }}
         data-sonner-toast=""
       >
         <div className="flex items-start gap-3 flex-1">