@mlw-packages/react-components 1.10.19 → 1.10.21

package/dist/index.css

@@ -558,9 +558,6 @@ body {
 .top-1\/2 {
   top: 50%;
 }
-.top-12 {
-  top: 3rem;
-}
 .top-14 {
   top: 3.5rem;
 }
@@ -1050,6 +1047,9 @@ body {
 .h-2\.5 {
   height: 0.625rem;
 }
+.h-2\/3 {
+  height: 66.666667%;
+}
 .h-20 {
   height: 5rem;
 }
@@ -1206,9 +1206,6 @@ body {
 .max-h-\[300px\] {
   max-height: 300px;
 }
-.max-h-\[460px\] {
-  max-height: 460px;
-}
 .max-h-\[95vh\] {
   max-height: 95vh;
 }
@@ -1218,6 +1215,9 @@ body {
 .max-h-\[calc\(100vh-200px\)\] {
   max-height: calc(100vh - 200px);
 }
+.max-h-\[calc\(85dvh-80px\)\] {
+  max-height: calc(85dvh - 80px);
+}
 .max-h-\[var\(--radix-context-menu-content-available-height\)\] {
   max-height: var(--radix-context-menu-content-available-height);
 }
@@ -2210,6 +2210,10 @@ body {
   border-top-left-radius: 1rem;
   border-top-right-radius: 1rem;
 }
+.rounded-t-\[10px\] {
+  border-top-left-radius: 10px;
+  border-top-right-radius: 10px;
+}
 .rounded-t-lg {
   border-top-left-radius: var(--radius);
   border-top-right-radius: var(--radius);
@@ -2871,6 +2875,9 @@ body {
 .bg-muted-foreground\/20 {
   background-color: hsl(var(--muted-foreground) / 0.2);
 }
+.bg-muted-foreground\/30 {
+  background-color: hsl(var(--muted-foreground) / 0.3);
+}
 .bg-muted\/10 {
   background-color: hsl(var(--muted) / 0.1);
 }
@@ -3127,6 +3134,9 @@ body {
 .bg-gradient-to-r {
   background-image: linear-gradient(to right, var(--tw-gradient-stops));
 }
+.bg-gradient-to-t {
+  background-image: linear-gradient(to top, var(--tw-gradient-stops));
+}
 .from-amber-400 {
   --tw-gradient-from: #fbbf24 var(--tw-gradient-from-position);
   --tw-gradient-to: rgb(251 191 36 / 0) var(--tw-gradient-to-position);
@@ -3152,6 +3162,11 @@ body {
   --tw-gradient-to: rgb(37 99 235 / 0) var(--tw-gradient-to-position);
   --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
 }
+.from-card {
+  --tw-gradient-from: hsl(var(--card)) var(--tw-gradient-from-position);
+  --tw-gradient-to: hsl(var(--card) / 0) var(--tw-gradient-to-position);
+  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
+}
 .from-cyan-400 {
   --tw-gradient-from: #22d3ee var(--tw-gradient-from-position);
   --tw-gradient-to: rgb(34 211 238 / 0) var(--tw-gradient-to-position);
@@ -3433,6 +3448,9 @@ body {
 .to-teal-500 {
   --tw-gradient-to: #14b8a6 var(--tw-gradient-to-position);
 }
+.to-transparent {
+  --tw-gradient-to: transparent var(--tw-gradient-to-position);
+}
 .to-violet-600 {
   --tw-gradient-to: #7c3aed var(--tw-gradient-to-position);
 }
@@ -3758,8 +3776,8 @@ body {
 .pt-2 {
   padding-top: 0.5rem;
 }
-.pt-2\.5 {
-  padding-top: 0.625rem;
+.pt-3 {
+  padding-top: 0.75rem;
 }
 .pt-4 {
   padding-top: 1rem;
@@ -4839,6 +4857,12 @@ body {
 .ease-out {
   animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
 }
+.\!running {
+  animation-play-state: running !important;
+}
+.running {
+  animation-play-state: running;
+}
 .\[-ms-overflow-style\:none\] {
   -ms-overflow-style: none;
 }
@@ -5578,6 +5602,9 @@ body {
 .hover\:text-primary:hover {
   color: hsl(var(--primary));
 }
+.hover\:text-primary\/80:hover {
+  color: hsl(var(--primary) / 0.8);
+}
 .hover\:text-primary\/90:hover {
   color: hsl(var(--primary) / 0.9);
 }
@@ -8027,6 +8054,9 @@ body {
 .\[\&\:\:-webkit-scrollbar-thumb\]\:bg-muted-foreground\/30::-webkit-scrollbar-thumb {
   background-color: hsl(var(--muted-foreground) / 0.3);
 }
+.\[\&\:\:-webkit-scrollbar-thumb\]\:bg-primary\/20::-webkit-scrollbar-thumb {
+  background-color: hsl(var(--primary) / 0.2);
+}
 .hover\:\[\&\:\:-webkit-scrollbar-thumb\]\:bg-muted-foreground\/40::-webkit-scrollbar-thumb:hover {
   background-color: hsl(var(--muted-foreground) / 0.4);
 }

package/dist/index.d.mts

@@ -63,13 +63,21 @@ type ThemeProviderState = {
 declare function ThemeProviderBase({ children, defaultTheme, storageKey, ...props }: ThemeProviderProps): react_jsx_runtime.JSX.Element;
 declare const useTheme: () => ThemeProviderState;
 
+type AnimationOrigin = "center" | "top-left" | "top-right" | "cursor";
 type ModeToggleBaseProps = {
     themes?: Theme[];
     className?: string;
     directToggle?: boolean;
     variant?: "default" | "outline" | "link" | "destructive" | "secondary" | "ghost";
+    showLabel?: boolean;
+    tooltip?: boolean | string;
+    animationOrigin?: AnimationOrigin;
+    transitionDuration?: number;
+    storageKey?: string;
+    defaultTheme?: Theme;
+    onThemeChange?: (theme: Theme) => void;
 };
-declare function ModeToggleBase({ themes, className, directToggle, variant, }: ModeToggleBaseProps): react_jsx_runtime.JSX.Element;
+declare function ModeToggleBase({ themes, className, directToggle, variant, showLabel, tooltip, animationOrigin, transitionDuration, storageKey, defaultTheme, onThemeChange, }: ModeToggleBaseProps): string | number | bigint | boolean | Iterable<React$1.ReactNode> | Promise<string | number | bigint | boolean | React$1.ReactPortal | React$1.ReactElement<unknown, string | React$1.JSXElementConstructor<any>> | Iterable<React$1.ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element | null | undefined;
 
 declare const AvatarBase: React$1.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarProps & React$1.RefAttributes<HTMLSpanElement>, "ref"> & React$1.RefAttributes<HTMLSpanElement>>;
 declare const AvatarImageBase: React$1.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarImageProps & React$1.RefAttributes<HTMLImageElement>, "ref"> & React$1.RefAttributes<HTMLImageElement>>;
@@ -930,6 +938,7 @@ interface AgendaViewProps$1 {
     showUndatedEvents?: boolean;
     /** When true, hides event times */
     noTime?: boolean;
+    onEventCreate?: (startTime: Date) => void;
 }
 declare function Agenda({ currentDate, events, onEventSelect, showUndatedEvents, noTime, }: AgendaViewProps$1): react_jsx_runtime.JSX.Element;
 
@@ -988,8 +997,9 @@ interface DayViewProps$1 {
     showUndatedEvents?: boolean;
     /** When true, hides event times */
     noTime?: boolean;
+    onEventCreate?: (startTime: Date) => void;
 }
-declare function DayViewAgenda({ currentDate, events, onEventSelect, showUndatedEvents, noTime, }: DayViewProps$1): react_jsx_runtime.JSX.Element;
+declare function DayViewAgenda({ currentDate, events, onEventSelect, showUndatedEvents, noTime, onEventCreate, }: DayViewProps$1): react_jsx_runtime.JSX.Element;
 
 interface DroppableCellProps$1 {
     id: string;
@@ -1015,13 +1025,14 @@ interface EventCalendarProps$1 {
     onlyWeek?: boolean;
     onlyAgenda?: boolean;
     onlyYear?: boolean;
+    allowCellClick?: boolean;
 }
 interface ModalLikeProps {
     event?: CalendarEventAgenda;
     onClose?: () => void;
     [key: string]: unknown;
 }
-declare function EventAgenda({ events, onEventUpdate, className, initialView, initialDate, onClick, showYearView, noTime, onlyDay, onlyMonth, onlyWeek, onlyAgenda, onlyYear, }: EventCalendarProps$1): react_jsx_runtime.JSX.Element;
+declare function EventAgenda({ events, onEventUpdate, className, initialView, initialDate, onClick, showYearView, noTime, onlyDay, onlyMonth, onlyWeek, onlyAgenda, onlyYear, allowCellClick, }: EventCalendarProps$1): react_jsx_runtime.JSX.Element;
 
 interface EventItemProps$1 {
     event: CalendarEventAgenda;
@@ -1080,8 +1091,9 @@ interface MonthViewProps$1 {
     onEventSelect: (event: CalendarEventAgenda, e?: React__default.MouseEvent) => void;
     showUndatedEvents?: boolean;
     noTime?: boolean;
+    onEventCreate?: (startTime: Date) => void;
 }
-declare function MonthViewAgenda({ currentDate, events, onEventSelect, showUndatedEvents, noTime, }: MonthViewProps$1): react_jsx_runtime.JSX.Element;
+declare function MonthViewAgenda({ currentDate, events, onEventSelect, showUndatedEvents, noTime, onEventCreate, }: MonthViewProps$1): react_jsx_runtime.JSX.Element;
 
 declare function startOfLocalDay(d: Date): Date;
 declare function getAutoColorAgenda(id: string): EventColorAgenda;
@@ -2595,6 +2607,8 @@ interface CommandPaletteProps {
         alt?: boolean;
     };
     maxRecentItems?: number;
+    multiSelect?: boolean;
+    onSelectMultiple?: (items: CommandItem[]) => void;
     multiSearch?: boolean;
     debounceDelay?: number;
     footer?: React$1.ReactNode;
@@ -2628,14 +2642,18 @@ declare function GroupLabel({ group }: {
 interface CommandItemRowProps {
     item: CommandItem;
     isActive: boolean;
-    onSelect: () => void;
+    isSelected?: boolean;
+    multiSelect?: boolean;
+    onSelect: (e?: React.MouseEvent | React.KeyboardEvent) => void;
+    onToggleSelection?: (e: React.MouseEvent) => void;
     onHover: () => void;
+    searchQuery?: string;
 }
-declare function CommandItemRow({ item, isActive, onSelect, onHover, }: CommandItemRowProps): react_jsx_runtime.JSX.Element;
+declare function CommandItemRow({ item, isActive, isSelected, onSelect, onHover, searchQuery, }: CommandItemRowProps): react_jsx_runtime.JSX.Element;
 
 declare function CommandPalette(props: CommandPaletteProps): react_jsx_runtime.JSX.Element;
 
-declare function useCommandPalette({ items, groups, open, onOpenChange, recentItems, onRecentItemsChange, maxRecentItems, multiSearch, }: Partial<CommandPaletteProps>): {
+declare function useCommandPalette({ items, groups, open, onOpenChange, recentItems, onRecentItemsChange, maxRecentItems, multiSearch, multiSelect, onSelectMultiple, }: Partial<CommandPaletteProps>): {
     query: string;
     setQuery: React$1.Dispatch<React$1.SetStateAction<string>>;
     activeIndex: number;
@@ -2655,7 +2673,11 @@ declare function useCommandPalette({ items, groups, open, onOpenChange, recentIt
     flatItems: CommandItem[];
     totalItems: number;
     totalPages: number;
-    handleSelect: (item?: CommandItem) => void;
+    handleSelect: (item?: CommandItem, event?: React$1.MouseEvent | React$1.KeyboardEvent | KeyboardEvent | MouseEvent) => void;
+    selectedItemIds: Set<string>;
+    toggleSelection: (id: string) => void;
+    selectedItems: CommandItem[];
+    executeBulkAction: () => void;
     isEmpty: boolean;
     showList: boolean;
 };

package/dist/index.d.ts

@@ -63,13 +63,21 @@ type ThemeProviderState = {
 declare function ThemeProviderBase({ children, defaultTheme, storageKey, ...props }: ThemeProviderProps): react_jsx_runtime.JSX.Element;
 declare const useTheme: () => ThemeProviderState;
 
+type AnimationOrigin = "center" | "top-left" | "top-right" | "cursor";
 type ModeToggleBaseProps = {
     themes?: Theme[];
     className?: string;
     directToggle?: boolean;
     variant?: "default" | "outline" | "link" | "destructive" | "secondary" | "ghost";
+    showLabel?: boolean;
+    tooltip?: boolean | string;
+    animationOrigin?: AnimationOrigin;
+    transitionDuration?: number;
+    storageKey?: string;
+    defaultTheme?: Theme;
+    onThemeChange?: (theme: Theme) => void;
 };
-declare function ModeToggleBase({ themes, className, directToggle, variant, }: ModeToggleBaseProps): react_jsx_runtime.JSX.Element;
+declare function ModeToggleBase({ themes, className, directToggle, variant, showLabel, tooltip, animationOrigin, transitionDuration, storageKey, defaultTheme, onThemeChange, }: ModeToggleBaseProps): string | number | bigint | boolean | Iterable<React$1.ReactNode> | Promise<string | number | bigint | boolean | React$1.ReactPortal | React$1.ReactElement<unknown, string | React$1.JSXElementConstructor<any>> | Iterable<React$1.ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element | null | undefined;
 
 declare const AvatarBase: React$1.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarProps & React$1.RefAttributes<HTMLSpanElement>, "ref"> & React$1.RefAttributes<HTMLSpanElement>>;
 declare const AvatarImageBase: React$1.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarImageProps & React$1.RefAttributes<HTMLImageElement>, "ref"> & React$1.RefAttributes<HTMLImageElement>>;
@@ -930,6 +938,7 @@ interface AgendaViewProps$1 {
     showUndatedEvents?: boolean;
     /** When true, hides event times */
     noTime?: boolean;
+    onEventCreate?: (startTime: Date) => void;
 }
 declare function Agenda({ currentDate, events, onEventSelect, showUndatedEvents, noTime, }: AgendaViewProps$1): react_jsx_runtime.JSX.Element;
 
@@ -988,8 +997,9 @@ interface DayViewProps$1 {
     showUndatedEvents?: boolean;
     /** When true, hides event times */
     noTime?: boolean;
+    onEventCreate?: (startTime: Date) => void;
 }
-declare function DayViewAgenda({ currentDate, events, onEventSelect, showUndatedEvents, noTime, }: DayViewProps$1): react_jsx_runtime.JSX.Element;
+declare function DayViewAgenda({ currentDate, events, onEventSelect, showUndatedEvents, noTime, onEventCreate, }: DayViewProps$1): react_jsx_runtime.JSX.Element;
 
 interface DroppableCellProps$1 {
     id: string;
@@ -1015,13 +1025,14 @@ interface EventCalendarProps$1 {
     onlyWeek?: boolean;
     onlyAgenda?: boolean;
     onlyYear?: boolean;
+    allowCellClick?: boolean;
 }
 interface ModalLikeProps {
     event?: CalendarEventAgenda;
     onClose?: () => void;
     [key: string]: unknown;
 }
-declare function EventAgenda({ events, onEventUpdate, className, initialView, initialDate, onClick, showYearView, noTime, onlyDay, onlyMonth, onlyWeek, onlyAgenda, onlyYear, }: EventCalendarProps$1): react_jsx_runtime.JSX.Element;
+declare function EventAgenda({ events, onEventUpdate, className, initialView, initialDate, onClick, showYearView, noTime, onlyDay, onlyMonth, onlyWeek, onlyAgenda, onlyYear, allowCellClick, }: EventCalendarProps$1): react_jsx_runtime.JSX.Element;
 
 interface EventItemProps$1 {
     event: CalendarEventAgenda;
@@ -1080,8 +1091,9 @@ interface MonthViewProps$1 {
     onEventSelect: (event: CalendarEventAgenda, e?: React__default.MouseEvent) => void;
     showUndatedEvents?: boolean;
     noTime?: boolean;
+    onEventCreate?: (startTime: Date) => void;
 }
-declare function MonthViewAgenda({ currentDate, events, onEventSelect, showUndatedEvents, noTime, }: MonthViewProps$1): react_jsx_runtime.JSX.Element;
+declare function MonthViewAgenda({ currentDate, events, onEventSelect, showUndatedEvents, noTime, onEventCreate, }: MonthViewProps$1): react_jsx_runtime.JSX.Element;
 
 declare function startOfLocalDay(d: Date): Date;
 declare function getAutoColorAgenda(id: string): EventColorAgenda;
@@ -2595,6 +2607,8 @@ interface CommandPaletteProps {
         alt?: boolean;
     };
     maxRecentItems?: number;
+    multiSelect?: boolean;
+    onSelectMultiple?: (items: CommandItem[]) => void;
     multiSearch?: boolean;
     debounceDelay?: number;
     footer?: React$1.ReactNode;
@@ -2628,14 +2642,18 @@ declare function GroupLabel({ group }: {
 interface CommandItemRowProps {
     item: CommandItem;
     isActive: boolean;
-    onSelect: () => void;
+    isSelected?: boolean;
+    multiSelect?: boolean;
+    onSelect: (e?: React.MouseEvent | React.KeyboardEvent) => void;
+    onToggleSelection?: (e: React.MouseEvent) => void;
     onHover: () => void;
+    searchQuery?: string;
 }
-declare function CommandItemRow({ item, isActive, onSelect, onHover, }: CommandItemRowProps): react_jsx_runtime.JSX.Element;
+declare function CommandItemRow({ item, isActive, isSelected, onSelect, onHover, searchQuery, }: CommandItemRowProps): react_jsx_runtime.JSX.Element;
 
 declare function CommandPalette(props: CommandPaletteProps): react_jsx_runtime.JSX.Element;
 
-declare function useCommandPalette({ items, groups, open, onOpenChange, recentItems, onRecentItemsChange, maxRecentItems, multiSearch, }: Partial<CommandPaletteProps>): {
+declare function useCommandPalette({ items, groups, open, onOpenChange, recentItems, onRecentItemsChange, maxRecentItems, multiSearch, multiSelect, onSelectMultiple, }: Partial<CommandPaletteProps>): {
     query: string;
     setQuery: React$1.Dispatch<React$1.SetStateAction<string>>;
     activeIndex: number;
@@ -2655,7 +2673,11 @@ declare function useCommandPalette({ items, groups, open, onOpenChange, recentIt
     flatItems: CommandItem[];
     totalItems: number;
     totalPages: number;
-    handleSelect: (item?: CommandItem) => void;
+    handleSelect: (item?: CommandItem, event?: React$1.MouseEvent | React$1.KeyboardEvent | KeyboardEvent | MouseEvent) => void;
+    selectedItemIds: Set<string>;
+    toggleSelection: (id: string) => void;
+    selectedItems: CommandItem[];
+    executeBulkAction: () => void;
     isEmpty: boolean;
     showList: boolean;
 };