@northslopetech/altitude-ui 2.0.10 → 2.0.13

package/dist/index.d.mts

@@ -4,6 +4,8 @@ import { JSX } from 'react';
 import { VariantProps } from 'class-variance-authority';
 import * as SelectPrimitive from '@radix-ui/react-select';
 import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
 
 declare const buttonVariants: (props?: ({
     variant?: "default" | "outline" | "destructive" | "destructive-subtle" | "ghost" | "link" | null | undefined;
@@ -67,6 +69,8 @@ interface DatePickerProps {
     disabled?: boolean;
     placeholder?: string;
     className?: string;
+    minDate?: Date;
+    maxDate?: Date;
 }
 declare const DatePicker: React.ForwardRefExoticComponent<DatePickerProps & React.RefAttributes<HTMLInputElement>>;
 
@@ -75,19 +79,14 @@ declare const uploadVariants: (props?: ({
     disabled?: boolean | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface UploadProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onError"> {
-    endpoint?: string;
     onFileSelect?: (files: File[]) => void;
-    onUploadProgress?: (progress: number) => void;
-    onUploadError?: (error: string) => void;
-    onUploadComplete?: (files: File[]) => void;
-    onUploadSuccess?: (response: unknown) => void;
-    maxFileSize?: number;
     acceptedFileTypes?: string[];
     disabled?: boolean;
     state?: "default" | "dragOver" | "error" | "uploading" | "success";
     progress?: number;
     errorMessage?: string;
-    loading?: boolean;
+    selectedFiles?: File[];
+    maxFileSize?: number;
 }
 declare const Upload: React.ForwardRefExoticComponent<UploadProps & React.RefAttributes<HTMLDivElement>>;
 
@@ -152,6 +151,34 @@ interface TabsContentProps extends React.HTMLAttributes<HTMLDivElement> {
 }
 declare const TabsContent: React.ForwardRefExoticComponent<TabsContentProps & React.RefAttributes<HTMLDivElement>>;
 
+declare const DropdownMenu: React.FC<DropdownMenuPrimitive.DropdownMenuProps>;
+interface DropdownMenuTriggerProps extends React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Trigger> {
+    icon?: React.ReactNode;
+}
+declare const DropdownMenuTrigger: React.ForwardRefExoticComponent<DropdownMenuTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const DropdownMenuGroup: React.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuGroupProps & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuPortal: React.FC<DropdownMenuPrimitive.DropdownMenuPortalProps>;
+declare const DropdownMenuSub: React.FC<DropdownMenuPrimitive.DropdownMenuSubProps>;
+declare const DropdownMenuRadioGroup: React.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuRadioGroupProps & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuSubTrigger: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSubTriggerProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuSubContent: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSubContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuContent: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuItem: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuCheckboxItem: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuCheckboxItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuRadioItem: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuRadioItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuLabel: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuLabelProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuSeparator: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuShortcut: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
 type IconVariant = "dark" | "light" | "gray" | "error" | "warning";
 interface IconProps extends React.SVGProps<SVGSVGElement> {
     className?: string;
@@ -217,4 +244,4 @@ declare const Warning: React.FC<IconProps>;
 declare const Wrench: React.FC<IconProps>;
 declare const Logout: React.FC<IconProps>;
 
-export { ArrowDown, ArrowLeft, ArrowRight, ArrowUp, Badge, type BadgeProps, Bell, Bookmark, Button, type ButtonProps, Calendar, CaretDown, CaretLeft, CaretRight, CaretUp, Chat, Check, CheckIcon, Checkbox, type CheckboxProps, CheckmarkCircle, CheckmarkSquare, ChevronDown, ChevronLeft, ChevronRight, ChevronUp, Close, CloseSmall, Cog, Credentials, DatePicker, type DatePickerProps, Doc, Dollar, Edit, Envelope, Exclamation, EyeClosed, EyeOpen, Filter, FilterDescending, FormField, type FormFieldProps, GraphBar, GraphDonut, GraphLine, GraphPie, HamburgerMenu, Home, type IconProps, type IconVariant, Information, TypedInput as Input, type InputFieldProps, type InputProps, Location, Lock, Logout, MagnifyingGlass, Minus, MoreMenu, Phone, Plus, QuestionCircle, Select, SelectContent, type SelectContentProps, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, type SelectTriggerProps, SelectValue, Share, Star, Statement, Table, Tabs, TabsContent, type TabsContentProps, TabsList, type TabsListProps, type TabsProps, TabsTrigger, type TabsTriggerProps, type TextareaFieldProps, Trash, Typography, type TypographyProps, Upload, type UploadProps, User, UserMulti, Warning, Wrench, X, badgeVariants, buttonVariants, checkboxVariants, inputVariants, selectTriggerVariants, tabsVariants, typographyVariants, uploadVariants };
+export { ArrowDown, ArrowLeft, ArrowRight, ArrowUp, Badge, type BadgeProps, Bell, Bookmark, Button, type ButtonProps, Calendar, CaretDown, CaretLeft, CaretRight, CaretUp, Chat, Check, CheckIcon, Checkbox, type CheckboxProps, CheckmarkCircle, CheckmarkSquare, ChevronDown, ChevronLeft, ChevronRight, ChevronUp, Close, CloseSmall, Cog, Credentials, DatePicker, type DatePickerProps, Doc, Dollar, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, type DropdownMenuTriggerProps, Edit, Envelope, Exclamation, EyeClosed, EyeOpen, Filter, FilterDescending, FormField, type FormFieldProps, GraphBar, GraphDonut, GraphLine, GraphPie, HamburgerMenu, Home, type IconProps, type IconVariant, Information, TypedInput as Input, type InputFieldProps, type InputProps, Location, Lock, Logout, MagnifyingGlass, Minus, MoreMenu, Phone, Plus, QuestionCircle, Select, SelectContent, type SelectContentProps, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, type SelectTriggerProps, SelectValue, Share, Star, Statement, Table, Tabs, TabsContent, type TabsContentProps, TabsList, type TabsListProps, type TabsProps, TabsTrigger, type TabsTriggerProps, type TextareaFieldProps, Trash, Typography, type TypographyProps, Upload, type UploadProps, User, UserMulti, Warning, Wrench, X, badgeVariants, buttonVariants, checkboxVariants, inputVariants, selectTriggerVariants, tabsVariants, typographyVariants, uploadVariants };

package/dist/index.d.ts

@@ -4,6 +4,8 @@ import { JSX } from 'react';
 import { VariantProps } from 'class-variance-authority';
 import * as SelectPrimitive from '@radix-ui/react-select';
 import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
 
 declare const buttonVariants: (props?: ({
     variant?: "default" | "outline" | "destructive" | "destructive-subtle" | "ghost" | "link" | null | undefined;
@@ -67,6 +69,8 @@ interface DatePickerProps {
     disabled?: boolean;
     placeholder?: string;
     className?: string;
+    minDate?: Date;
+    maxDate?: Date;
 }
 declare const DatePicker: React.ForwardRefExoticComponent<DatePickerProps & React.RefAttributes<HTMLInputElement>>;
 
@@ -75,19 +79,14 @@ declare const uploadVariants: (props?: ({
     disabled?: boolean | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface UploadProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onError"> {
-    endpoint?: string;
     onFileSelect?: (files: File[]) => void;
-    onUploadProgress?: (progress: number) => void;
-    onUploadError?: (error: string) => void;
-    onUploadComplete?: (files: File[]) => void;
-    onUploadSuccess?: (response: unknown) => void;
-    maxFileSize?: number;
     acceptedFileTypes?: string[];
     disabled?: boolean;
     state?: "default" | "dragOver" | "error" | "uploading" | "success";
     progress?: number;
     errorMessage?: string;
-    loading?: boolean;
+    selectedFiles?: File[];
+    maxFileSize?: number;
 }
 declare const Upload: React.ForwardRefExoticComponent<UploadProps & React.RefAttributes<HTMLDivElement>>;
 
@@ -152,6 +151,34 @@ interface TabsContentProps extends React.HTMLAttributes<HTMLDivElement> {
 }
 declare const TabsContent: React.ForwardRefExoticComponent<TabsContentProps & React.RefAttributes<HTMLDivElement>>;
 
+declare const DropdownMenu: React.FC<DropdownMenuPrimitive.DropdownMenuProps>;
+interface DropdownMenuTriggerProps extends React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Trigger> {
+    icon?: React.ReactNode;
+}
+declare const DropdownMenuTrigger: React.ForwardRefExoticComponent<DropdownMenuTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const DropdownMenuGroup: React.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuGroupProps & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuPortal: React.FC<DropdownMenuPrimitive.DropdownMenuPortalProps>;
+declare const DropdownMenuSub: React.FC<DropdownMenuPrimitive.DropdownMenuSubProps>;
+declare const DropdownMenuRadioGroup: React.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuRadioGroupProps & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuSubTrigger: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSubTriggerProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuSubContent: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSubContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuContent: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuItem: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuCheckboxItem: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuCheckboxItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuRadioItem: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuRadioItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuLabel: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuLabelProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuSeparator: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuShortcut: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
 type IconVariant = "dark" | "light" | "gray" | "error" | "warning";
 interface IconProps extends React.SVGProps<SVGSVGElement> {
     className?: string;
@@ -217,4 +244,4 @@ declare const Warning: React.FC<IconProps>;
 declare const Wrench: React.FC<IconProps>;
 declare const Logout: React.FC<IconProps>;
 
-export { ArrowDown, ArrowLeft, ArrowRight, ArrowUp, Badge, type BadgeProps, Bell, Bookmark, Button, type ButtonProps, Calendar, CaretDown, CaretLeft, CaretRight, CaretUp, Chat, Check, CheckIcon, Checkbox, type CheckboxProps, CheckmarkCircle, CheckmarkSquare, ChevronDown, ChevronLeft, ChevronRight, ChevronUp, Close, CloseSmall, Cog, Credentials, DatePicker, type DatePickerProps, Doc, Dollar, Edit, Envelope, Exclamation, EyeClosed, EyeOpen, Filter, FilterDescending, FormField, type FormFieldProps, GraphBar, GraphDonut, GraphLine, GraphPie, HamburgerMenu, Home, type IconProps, type IconVariant, Information, TypedInput as Input, type InputFieldProps, type InputProps, Location, Lock, Logout, MagnifyingGlass, Minus, MoreMenu, Phone, Plus, QuestionCircle, Select, SelectContent, type SelectContentProps, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, type SelectTriggerProps, SelectValue, Share, Star, Statement, Table, Tabs, TabsContent, type TabsContentProps, TabsList, type TabsListProps, type TabsProps, TabsTrigger, type TabsTriggerProps, type TextareaFieldProps, Trash, Typography, type TypographyProps, Upload, type UploadProps, User, UserMulti, Warning, Wrench, X, badgeVariants, buttonVariants, checkboxVariants, inputVariants, selectTriggerVariants, tabsVariants, typographyVariants, uploadVariants };
+export { ArrowDown, ArrowLeft, ArrowRight, ArrowUp, Badge, type BadgeProps, Bell, Bookmark, Button, type ButtonProps, Calendar, CaretDown, CaretLeft, CaretRight, CaretUp, Chat, Check, CheckIcon, Checkbox, type CheckboxProps, CheckmarkCircle, CheckmarkSquare, ChevronDown, ChevronLeft, ChevronRight, ChevronUp, Close, CloseSmall, Cog, Credentials, DatePicker, type DatePickerProps, Doc, Dollar, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, type DropdownMenuTriggerProps, Edit, Envelope, Exclamation, EyeClosed, EyeOpen, Filter, FilterDescending, FormField, type FormFieldProps, GraphBar, GraphDonut, GraphLine, GraphPie, HamburgerMenu, Home, type IconProps, type IconVariant, Information, TypedInput as Input, type InputFieldProps, type InputProps, Location, Lock, Logout, MagnifyingGlass, Minus, MoreMenu, Phone, Plus, QuestionCircle, Select, SelectContent, type SelectContentProps, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, type SelectTriggerProps, SelectValue, Share, Star, Statement, Table, Tabs, TabsContent, type TabsContentProps, TabsList, type TabsListProps, type TabsProps, TabsTrigger, type TabsTriggerProps, type TextareaFieldProps, Trash, Typography, type TypographyProps, Upload, type UploadProps, User, UserMulti, Warning, Wrench, X, badgeVariants, buttonVariants, checkboxVariants, inputVariants, selectTriggerVariants, tabsVariants, typographyVariants, uploadVariants };

package/dist/index.js

@@ -60,6 +60,21 @@ __export(index_exports, {
   DatePicker: () => DatePicker,
   Doc: () => Doc,
   Dollar: () => Dollar,
+  DropdownMenu: () => DropdownMenu,
+  DropdownMenuCheckboxItem: () => DropdownMenuCheckboxItem,
+  DropdownMenuContent: () => DropdownMenuContent,
+  DropdownMenuGroup: () => DropdownMenuGroup,
+  DropdownMenuItem: () => DropdownMenuItem,
+  DropdownMenuLabel: () => DropdownMenuLabel,
+  DropdownMenuPortal: () => DropdownMenuPortal,
+  DropdownMenuRadioGroup: () => DropdownMenuRadioGroup,
+  DropdownMenuRadioItem: () => DropdownMenuRadioItem,
+  DropdownMenuSeparator: () => DropdownMenuSeparator,
+  DropdownMenuShortcut: () => DropdownMenuShortcut,
+  DropdownMenuSub: () => DropdownMenuSub,
+  DropdownMenuSubContent: () => DropdownMenuSubContent,
+  DropdownMenuSubTrigger: () => DropdownMenuSubTrigger,
+  DropdownMenuTrigger: () => DropdownMenuTrigger,
   Edit: () => Edit,
   Envelope: () => Envelope,
   Exclamation: () => Exclamation,
@@ -2227,6 +2242,8 @@ var DatePicker = React6.forwardRef(
     disabled,
     placeholder = "mm/dd/yyyy",
     className,
+    minDate,
+    maxDate,
     ...props
   }, ref) => {
     const parseDate = (dateValue) => {
@@ -2270,6 +2287,7 @@ var DatePicker = React6.forwardRef(
       setInputValue(formatDateInput(parsedDefault));
     }, [defaultValue, value]);
     const handleDateSelect = (date) => {
+      if (isDateDisabled(date)) return;
       const newDate = new Date(date);
       setSelectedDate(newDate);
       setInputValue(formatDateInput(newDate));
@@ -2301,7 +2319,7 @@ var DatePicker = React6.forwardRef(
         input.setSelectionRange(newPosition, newPosition);
       }, 0);
       const parsedDate = parseDateInput(formattedValue);
-      if (parsedDate) {
+      if (parsedDate && !isDateDisabled(parsedDate)) {
         setSelectedDate(parsedDate);
         setCurrentMonth(
           new Date(parsedDate.getFullYear(), parsedDate.getMonth())
@@ -2357,11 +2375,30 @@ var DatePicker = React6.forwardRef(
       const today = /* @__PURE__ */ new Date();
       return date.toDateString() === today.toDateString();
     };
+    const isDateDisabled = (date) => {
+      if (minDate && date < minDate) return true;
+      if (maxDate && date > maxDate) return true;
+      return false;
+    };
+    const generateYears = () => {
+      const currentYear = (/* @__PURE__ */ new Date()).getFullYear();
+      let startYear = currentYear - 50;
+      let endYear = currentYear + 50;
+      if (minDate) {
+        startYear = Math.min(startYear, minDate.getFullYear());
+      }
+      if (maxDate) {
+        endYear = Math.max(endYear, maxDate.getFullYear());
+      }
+      return Array.from(
+        { length: endYear - startYear + 1 },
+        (_, i) => startYear + i
+      );
+    };
     const days = getDaysInMonth(currentMonth);
     const months = getMonthNames();
     const dayNames = getDayNames();
-    const currentYear = (/* @__PURE__ */ new Date()).getFullYear();
-    const years = Array.from({ length: 100 }, (_, i) => currentYear - 50 + i);
+    const years = generateYears();
     return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
       PopoverPrimitive.Root,
       {
@@ -2463,19 +2500,21 @@ var DatePicker = React6.forwardRef(
                         "button",
                         {
                           onClick: () => handleDateSelect(date),
+                          disabled: isDateDisabled(date),
                           className: cn(
                             "h-8 w-8 transition-colors relative",
-                            "hover:bg-gray focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-1",
-                            isDateSelected(date) && !isToday(date) && "bg-dark text-light hover:bg-dark/90 rounded",
-                            isDateSelected(date) && isToday(date) && "bg-dark text-light hover:bg-dark/90 rounded-full",
+                            !isDateDisabled(date) && "hover:bg-gray focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-1",
+                            isDateSelected(date) && !isToday(date) && !isDateDisabled(date) && "bg-dark text-light hover:bg-dark/90 rounded",
+                            isDateSelected(date) && isToday(date) && !isDateDisabled(date) && "bg-dark text-light hover:bg-dark/90 rounded-full",
                             !isDateSelected(date) && "rounded-full",
-                            isToday(date) && !isDateSelected(date) && "text-blue-600 after:content-[''] after:absolute after:bottom-1 after:left-1/2 after:-translate-x-1/2 after:w-1 after:h-1 after:bg-blue-600 after:rounded-full"
+                            isToday(date) && !isDateSelected(date) && !isDateDisabled(date) && "text-blue-600 after:content-[''] after:absolute after:bottom-1 after:left-1/2 after:-translate-x-1/2 after:w-1 after:h-1 after:bg-blue-600 after:rounded-full",
+                            isDateDisabled(date) && "text-secondary/40 cursor-not-allowed opacity-50"
                           ),
                           children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Typography, { variant: "label-sm", as: "span", children: date.getDate() })
                         }
                       )
                     },
-                    index
+                    date ? date.getTime() : `empty-${index}`
                   )) })
                 ] })
               ] })
@@ -2518,106 +2557,18 @@ var uploadVariants = (0, import_class_variance_authority6.cva)(
 var Upload = React7.forwardRef(
   ({
     className,
-    endpoint,
     onFileSelect,
-    onUploadProgress,
-    onUploadError,
-    onUploadComplete,
-    onUploadSuccess,
     maxFileSize = DEFAULT_MAX_FILE_SIZE,
     acceptedFileTypes = ["application/pdf"],
     disabled = false,
     state = "default",
     progress = 0,
     errorMessage = "Helper text why file failed to upload",
-    loading = false,
+    selectedFiles = [],
     ...props
   }, ref) => {
-    const [currentState, setCurrentState] = React7.useState(state);
-    const [currentProgress, setCurrentProgress] = React7.useState(progress);
     const fileInputRef = React7.useRef(null);
-    const [selectedFiles, setSelectedFiles] = React7.useState([]);
-    React7.useEffect(() => {
-      if (loading) {
-        setCurrentState("uploading");
-      } else {
-        setCurrentState(state);
-      }
-    }, [state, loading]);
-    React7.useEffect(() => {
-      if (loading || progress !== void 0) {
-        setCurrentProgress(progress);
-      }
-    }, [progress, loading]);
-    const uploadFile = React7.useCallback(
-      (file) => {
-        if (!endpoint) {
-          console.warn("Upload endpoint not provided");
-          return;
-        }
-        if (!file) return;
-        if (!loading) {
-          setCurrentState("uploading");
-        }
-        setCurrentProgress(0);
-        const xhr = new XMLHttpRequest();
-        const formData = new FormData();
-        formData.append("file", file);
-        xhr.upload.onprogress = (event) => {
-          if (!event.lengthComputable || loading) return;
-          const progressPercent = Math.round(
-            event.loaded / event.total * 100
-          );
-          setCurrentProgress(progressPercent);
-          onUploadProgress?.(progressPercent);
-        };
-        xhr.onload = () => {
-          if (xhr.status < 200 || xhr.status >= 300) {
-            if (!loading) {
-              setCurrentState("error");
-            }
-            onUploadError?.(`Upload failed: ${xhr.statusText}`);
-            return;
-          }
-          if (!loading) {
-            setCurrentState("success");
-            setCurrentProgress(100);
-          }
-          try {
-            const response = JSON.parse(xhr.responseText);
-            onUploadSuccess?.(response);
-          } catch {
-            onUploadSuccess?.(xhr.responseText);
-          }
-          onUploadComplete?.([file]);
-        };
-        xhr.onerror = () => {
-          if (!loading) {
-            setCurrentState("error");
-          }
-          onUploadError?.("Network error occurred during upload");
-        };
-        xhr.open("POST", endpoint);
-        xhr.send(formData);
-      },
-      [
-        endpoint,
-        onUploadProgress,
-        onUploadSuccess,
-        onUploadComplete,
-        onUploadError,
-        loading
-      ]
-    );
-    const validateFile = (file) => {
-      if (!acceptedFileTypes.includes(file.type)) {
-        return `File type not supported. Please upload: ${acceptedFileTypes.join(", ")}`;
-      }
-      if (file.size > maxFileSize) {
-        return `File size exceeds ${Math.round(maxFileSize / 1024 / 1024)}MB limit`;
-      }
-      return null;
-    };
+    const [isDragOver, setIsDragOver] = React7.useState(false);
     const getFileTypeDisplay = () => {
       const typeMap = {
         "application/pdf": "PDF",
@@ -2639,29 +2590,20 @@ var Upload = React7.forwardRef(
       if (!files || disabled) return;
       const file = files[0];
       if (!file) return;
-      const error = validateFile(file);
-      if (error) {
-        setCurrentState("error");
-        onUploadError?.(error);
-        return;
-      }
-      setSelectedFiles([file]);
       onFileSelect?.([file]);
-      if (!endpoint) return;
-      uploadFile(file);
     };
     const handleDragEnter = (e) => {
       e.preventDefault();
       e.stopPropagation();
       if (disabled) return;
-      if (currentState === "error" || currentState === "uploading") return;
-      setCurrentState("dragOver");
+      if (state === "error" || state === "uploading") return;
+      setIsDragOver(true);
     };
     const handleDragLeave = (e) => {
       e.preventDefault();
       e.stopPropagation();
       if (disabled) return;
-      setCurrentState("default");
+      setIsDragOver(false);
     };
     const handleDragOver = (e) => {
       e.preventDefault();
@@ -2671,7 +2613,7 @@ var Upload = React7.forwardRef(
       e.preventDefault();
       e.stopPropagation();
       if (disabled) return;
-      setCurrentState("default");
+      setIsDragOver(false);
       const files = e.dataTransfer?.files;
       handleFileSelect(files);
     };
@@ -2684,12 +2626,11 @@ var Upload = React7.forwardRef(
     };
     const handleTryAgain = (e) => {
       e.stopPropagation();
-      setCurrentState("default");
-      setSelectedFiles([]);
       fileInputRef.current?.click();
     };
+    const effectiveState = isDragOver && state === "default" ? "dragOver" : state;
     const renderContent = () => {
-      switch (currentState) {
+      switch (effectiveState) {
         case "error":
           return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
             "div",
@@ -2726,8 +2667,8 @@ var Upload = React7.forwardRef(
                   /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "w-full bg-gray rounded-full h-2", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
                     "div",
                     {
-                      className: "bg-primary h-2 rounded-full transition-all duration-300 ease-in-out",
-                      style: { width: `${currentProgress}%` }
+                      className: "bg-canvas-primary h-2 rounded-full transition-all duration-300 ease-in-out",
+                      style: { width: `${progress}%` }
                     }
                   ) }),
                   /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
@@ -2736,7 +2677,7 @@ var Upload = React7.forwardRef(
                       variant: "body-sm",
                       className: "text-secondary text-center",
                       children: [
-                        currentProgress,
+                        Math.round(progress),
                         "% complete"
                       ]
                     }
@@ -2800,14 +2741,14 @@ var Upload = React7.forwardRef(
       {
         ref,
         className: cn(
-          uploadVariants({ state: currentState, disabled }),
+          uploadVariants({ state: effectiveState, disabled }),
           className
         ),
         onDragEnter: handleDragEnter,
         onDragLeave: !disabled ? handleDragLeave : void 0,
         onDragOver: !disabled ? handleDragOver : void 0,
         onDrop: !disabled ? handleDrop : void 0,
-        onClick: disabled || currentState === "uploading" ? void 0 : handleClick,
+        onClick: disabled || state === "uploading" ? void 0 : handleClick,
         style: {
           width: "960px",
           height: "540px",
@@ -2815,7 +2756,7 @@ var Upload = React7.forwardRef(
         },
         role: "button",
         tabIndex: disabled ? -1 : 0,
-        "aria-label": currentState === "uploading" ? "Uploading files" : "Upload files",
+        "aria-label": state === "uploading" ? "Uploading files" : "Upload files",
         "aria-disabled": disabled,
         ...props,
         children: [
@@ -2852,7 +2793,7 @@ var Checkbox = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__
     ref,
     className: cn(checkboxVariants(), className),
     ...props,
-    children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(CheckboxPrimitive.Indicator, { className: "flex items-center justify-center text-current", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(CheckIcon, { className: "size-3" }) })
+    children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(CheckboxPrimitive.Indicator, { className: "flex items-center justify-center text-current", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(CheckIcon, { variant: "light", className: "size-3" }) })
   }
 ));
 Checkbox.displayName = CheckboxPrimitive.Root.displayName;
@@ -2919,7 +2860,7 @@ var tabsVariants = (0, import_class_variance_authority9.cva)(
   {
     variants: {
       variant: {
-        default: "border-b-2 border-subtle hover:bg-gray data-[state=active]:border-interactive data-[state=active]:text-dark disabled:border-subtle disabled:text-muted disabled:cursor-not-allowed"
+        default: "border-b-1 border-subtle hover:bg-gray data-[state=active]:border-interactive data-[state=active]:text-dark data-[state=active]:border-b-2 disabled:border-subtle disabled:text-muted disabled:cursor-not-allowed"
       }
     },
     defaultVariants: {
@@ -3046,6 +2987,176 @@ var TabsContent = React10.forwardRef(
   }
 );
 TabsContent.displayName = "TabsContent";
+
+// src/components/ui/dropdown-menu.tsx
+var React11 = __toESM(require("react"));
+var DropdownMenuPrimitive = __toESM(require("@radix-ui/react-dropdown-menu"));
+var import_jsx_runtime12 = require("react/jsx-runtime");
+var DropdownMenu = DropdownMenuPrimitive.Root;
+var DropdownMenuTrigger = React11.forwardRef(({ className, icon, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
+  DropdownMenuPrimitive.Trigger,
+  {
+    ref,
+    className: cn(
+      "inline-flex items-center justify-center rounded bg-light p-2 transition-colors hover:bg-gray focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-interactive focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
+      className
+    ),
+    ...props,
+    children: [
+      icon || /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(MoreMenu, { className: "size-4" }),
+      children
+    ]
+  }
+));
+DropdownMenuTrigger.displayName = DropdownMenuPrimitive.Trigger.displayName;
+var DropdownMenuGroup = DropdownMenuPrimitive.Group;
+var DropdownMenuPortal = DropdownMenuPrimitive.Portal;
+var DropdownMenuSub = DropdownMenuPrimitive.Sub;
+var DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;
+var DropdownMenuSubTrigger = React11.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
+  DropdownMenuPrimitive.SubTrigger,
+  {
+    ref,
+    className: cn(
+      "flex cursor-pointer select-none items-center gap-2 px-2 py-3 outline-none transition-colors hover:bg-gray focus:bg-gray data-[state=open]:bg-gray [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
+      inset && "pl-8",
+      className
+    ),
+    style: { font: "var(--typography-label-sm-regular)" },
+    ...props,
+    children: [
+      children,
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(ChevronRight, { className: "ml-auto" })
+    ]
+  }
+));
+DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;
+var DropdownMenuSubContent = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+  DropdownMenuPrimitive.SubContent,
+  {
+    ref,
+    className: cn(
+      "z-50 min-w-[8rem] overflow-hidden rounded-md border border-subtle bg-light text-dark shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-dropdown-menu-content-transform-origin]",
+      className
+    ),
+    ...props
+  }
+));
+DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
+var DropdownMenuContent = React11.forwardRef(({ className, sideOffset = 4, align = "end", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+  DropdownMenuPrimitive.Content,
+  {
+    ref,
+    sideOffset,
+    align,
+    className: cn(
+      "z-50 min-w-50 overflow-hidden rounded-md border border-subtle bg-light shadow-lg animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95",
+      className
+    ),
+    ...props
+  }
+) }));
+DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
+var DropdownMenuItem = React11.forwardRef(({ className, inset, style, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+  DropdownMenuPrimitive.Item,
+  {
+    ref,
+    className: cn(
+      "relative flex cursor-pointer select-none items-center px-2 py-3 outline-none transition-colors hover:bg-gray focus:bg-gray data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      inset && "pl-8",
+      className
+    ),
+    style: {
+      font: "var(--typography-label-sm-regular)",
+      ...style
+    },
+    ...props
+  }
+));
+DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
+var DropdownMenuCheckboxItem = React11.forwardRef(({ className, children, style, checked, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
+  DropdownMenuPrimitive.CheckboxItem,
+  {
+    ref,
+    className: cn(
+      "relative flex cursor-pointer select-none items-center gap-2 px-2 py-3 outline-none transition-colors hover:bg-gray focus:bg-gray data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      className
+    ),
+    checked,
+    style: {
+      font: "var(--typography-label-sm-regular)",
+      ...style
+    },
+    ...props,
+    children: [
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+        Checkbox,
+        {
+          checked: checked === true,
+          className: "pointer-events-none",
+          "aria-hidden": "true"
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "flex-1", children })
+    ]
+  }
+));
+DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;
+var DropdownMenuRadioItem = React11.forwardRef(({ className, children, style, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
+  DropdownMenuPrimitive.RadioItem,
+  {
+    ref,
+    className: cn(
+      "relative flex cursor-pointer select-none items-center px-2 py-3 pl-8 outline-none transition-colors hover:bg-gray focus:bg-gray data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      className
+    ),
+    style: {
+      font: "var(--typography-label-sm-regular)",
+      ...style
+    },
+    ...props,
+    children: [
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "h-2 w-2 rounded-full bg-current" }) }) }),
+      children
+    ]
+  }
+));
+DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;
+var DropdownMenuLabel = React11.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+  DropdownMenuPrimitive.Label,
+  {
+    ref,
+    className: cn(
+      "px-2 py-1.5 text-sm font-semibold",
+      inset && "pl-8",
+      className
+    ),
+    ...props
+  }
+));
+DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
+var DropdownMenuSeparator = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+  DropdownMenuPrimitive.Separator,
+  {
+    ref,
+    className: cn("-mx-1 my-1 h-px bg-subtle", className),
+    ...props
+  }
+));
+DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;
+var DropdownMenuShortcut = ({
+  className,
+  ...props
+}) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+    "span",
+    {
+      className: cn("ml-auto text-xs tracking-widest opacity-60", className),
+      ...props
+    }
+  );
+};
+DropdownMenuShortcut.displayName = "DropdownMenuShortcut";
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   ArrowDown,
@@ -3078,6 +3189,21 @@ TabsContent.displayName = "TabsContent";
   DatePicker,
   Doc,
   Dollar,
+  DropdownMenu,
+  DropdownMenuCheckboxItem,
+  DropdownMenuContent,
+  DropdownMenuGroup,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuPortal,
+  DropdownMenuRadioGroup,
+  DropdownMenuRadioItem,
+  DropdownMenuSeparator,
+  DropdownMenuShortcut,
+  DropdownMenuSub,
+  DropdownMenuSubContent,
+  DropdownMenuSubTrigger,
+  DropdownMenuTrigger,
   Edit,
   Envelope,
   Exclamation,

package/dist/index.mjs

@@ -2103,6 +2103,8 @@ var DatePicker = React6.forwardRef(
     disabled,
     placeholder = "mm/dd/yyyy",
     className,
+    minDate,
+    maxDate,
     ...props
   }, ref) => {
     const parseDate = (dateValue) => {
@@ -2146,6 +2148,7 @@ var DatePicker = React6.forwardRef(
       setInputValue(formatDateInput(parsedDefault));
     }, [defaultValue, value]);
     const handleDateSelect = (date) => {
+      if (isDateDisabled(date)) return;
       const newDate = new Date(date);
       setSelectedDate(newDate);
       setInputValue(formatDateInput(newDate));
@@ -2177,7 +2180,7 @@ var DatePicker = React6.forwardRef(
         input.setSelectionRange(newPosition, newPosition);
       }, 0);
       const parsedDate = parseDateInput(formattedValue);
-      if (parsedDate) {
+      if (parsedDate && !isDateDisabled(parsedDate)) {
         setSelectedDate(parsedDate);
         setCurrentMonth(
           new Date(parsedDate.getFullYear(), parsedDate.getMonth())
@@ -2233,11 +2236,30 @@ var DatePicker = React6.forwardRef(
       const today = /* @__PURE__ */ new Date();
       return date.toDateString() === today.toDateString();
     };
+    const isDateDisabled = (date) => {
+      if (minDate && date < minDate) return true;
+      if (maxDate && date > maxDate) return true;
+      return false;
+    };
+    const generateYears = () => {
+      const currentYear = (/* @__PURE__ */ new Date()).getFullYear();
+      let startYear = currentYear - 50;
+      let endYear = currentYear + 50;
+      if (minDate) {
+        startYear = Math.min(startYear, minDate.getFullYear());
+      }
+      if (maxDate) {
+        endYear = Math.max(endYear, maxDate.getFullYear());
+      }
+      return Array.from(
+        { length: endYear - startYear + 1 },
+        (_, i) => startYear + i
+      );
+    };
     const days = getDaysInMonth(currentMonth);
     const months = getMonthNames();
     const dayNames = getDayNames();
-    const currentYear = (/* @__PURE__ */ new Date()).getFullYear();
-    const years = Array.from({ length: 100 }, (_, i) => currentYear - 50 + i);
+    const years = generateYears();
     return /* @__PURE__ */ jsxs6(
       PopoverPrimitive.Root,
       {
@@ -2339,19 +2361,21 @@ var DatePicker = React6.forwardRef(
                         "button",
                         {
                           onClick: () => handleDateSelect(date),
+                          disabled: isDateDisabled(date),
                           className: cn(
                             "h-8 w-8 transition-colors relative",
-                            "hover:bg-gray focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-1",
-                            isDateSelected(date) && !isToday(date) && "bg-dark text-light hover:bg-dark/90 rounded",
-                            isDateSelected(date) && isToday(date) && "bg-dark text-light hover:bg-dark/90 rounded-full",
+                            !isDateDisabled(date) && "hover:bg-gray focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-1",
+                            isDateSelected(date) && !isToday(date) && !isDateDisabled(date) && "bg-dark text-light hover:bg-dark/90 rounded",
+                            isDateSelected(date) && isToday(date) && !isDateDisabled(date) && "bg-dark text-light hover:bg-dark/90 rounded-full",
                             !isDateSelected(date) && "rounded-full",
-                            isToday(date) && !isDateSelected(date) && "text-blue-600 after:content-[''] after:absolute after:bottom-1 after:left-1/2 after:-translate-x-1/2 after:w-1 after:h-1 after:bg-blue-600 after:rounded-full"
+                            isToday(date) && !isDateSelected(date) && !isDateDisabled(date) && "text-blue-600 after:content-[''] after:absolute after:bottom-1 after:left-1/2 after:-translate-x-1/2 after:w-1 after:h-1 after:bg-blue-600 after:rounded-full",
+                            isDateDisabled(date) && "text-secondary/40 cursor-not-allowed opacity-50"
                           ),
                           children: /* @__PURE__ */ jsx6(Typography, { variant: "label-sm", as: "span", children: date.getDate() })
                         }
                       )
                     },
-                    index
+                    date ? date.getTime() : `empty-${index}`
                   )) })
                 ] })
               ] })
@@ -2394,106 +2418,18 @@ var uploadVariants = cva6(
 var Upload = React7.forwardRef(
   ({
     className,
-    endpoint,
     onFileSelect,
-    onUploadProgress,
-    onUploadError,
-    onUploadComplete,
-    onUploadSuccess,
     maxFileSize = DEFAULT_MAX_FILE_SIZE,
     acceptedFileTypes = ["application/pdf"],
     disabled = false,
     state = "default",
     progress = 0,
     errorMessage = "Helper text why file failed to upload",
-    loading = false,
+    selectedFiles = [],
     ...props
   }, ref) => {
-    const [currentState, setCurrentState] = React7.useState(state);
-    const [currentProgress, setCurrentProgress] = React7.useState(progress);
     const fileInputRef = React7.useRef(null);
-    const [selectedFiles, setSelectedFiles] = React7.useState([]);
-    React7.useEffect(() => {
-      if (loading) {
-        setCurrentState("uploading");
-      } else {
-        setCurrentState(state);
-      }
-    }, [state, loading]);
-    React7.useEffect(() => {
-      if (loading || progress !== void 0) {
-        setCurrentProgress(progress);
-      }
-    }, [progress, loading]);
-    const uploadFile = React7.useCallback(
-      (file) => {
-        if (!endpoint) {
-          console.warn("Upload endpoint not provided");
-          return;
-        }
-        if (!file) return;
-        if (!loading) {
-          setCurrentState("uploading");
-        }
-        setCurrentProgress(0);
-        const xhr = new XMLHttpRequest();
-        const formData = new FormData();
-        formData.append("file", file);
-        xhr.upload.onprogress = (event) => {
-          if (!event.lengthComputable || loading) return;
-          const progressPercent = Math.round(
-            event.loaded / event.total * 100
-          );
-          setCurrentProgress(progressPercent);
-          onUploadProgress?.(progressPercent);
-        };
-        xhr.onload = () => {
-          if (xhr.status < 200 || xhr.status >= 300) {
-            if (!loading) {
-              setCurrentState("error");
-            }
-            onUploadError?.(`Upload failed: ${xhr.statusText}`);
-            return;
-          }
-          if (!loading) {
-            setCurrentState("success");
-            setCurrentProgress(100);
-          }
-          try {
-            const response = JSON.parse(xhr.responseText);
-            onUploadSuccess?.(response);
-          } catch {
-            onUploadSuccess?.(xhr.responseText);
-          }
-          onUploadComplete?.([file]);
-        };
-        xhr.onerror = () => {
-          if (!loading) {
-            setCurrentState("error");
-          }
-          onUploadError?.("Network error occurred during upload");
-        };
-        xhr.open("POST", endpoint);
-        xhr.send(formData);
-      },
-      [
-        endpoint,
-        onUploadProgress,
-        onUploadSuccess,
-        onUploadComplete,
-        onUploadError,
-        loading
-      ]
-    );
-    const validateFile = (file) => {
-      if (!acceptedFileTypes.includes(file.type)) {
-        return `File type not supported. Please upload: ${acceptedFileTypes.join(", ")}`;
-      }
-      if (file.size > maxFileSize) {
-        return `File size exceeds ${Math.round(maxFileSize / 1024 / 1024)}MB limit`;
-      }
-      return null;
-    };
+    const [isDragOver, setIsDragOver] = React7.useState(false);
     const getFileTypeDisplay = () => {
       const typeMap = {
         "application/pdf": "PDF",
@@ -2515,29 +2451,20 @@ var Upload = React7.forwardRef(
       if (!files || disabled) return;
       const file = files[0];
       if (!file) return;
-      const error = validateFile(file);
-      if (error) {
-        setCurrentState("error");
-        onUploadError?.(error);
-        return;
-      }
-      setSelectedFiles([file]);
       onFileSelect?.([file]);
-      if (!endpoint) return;
-      uploadFile(file);
     };
     const handleDragEnter = (e) => {
       e.preventDefault();
       e.stopPropagation();
       if (disabled) return;
-      if (currentState === "error" || currentState === "uploading") return;
-      setCurrentState("dragOver");
+      if (state === "error" || state === "uploading") return;
+      setIsDragOver(true);
     };
     const handleDragLeave = (e) => {
       e.preventDefault();
       e.stopPropagation();
       if (disabled) return;
-      setCurrentState("default");
+      setIsDragOver(false);
     };
     const handleDragOver = (e) => {
       e.preventDefault();
@@ -2547,7 +2474,7 @@ var Upload = React7.forwardRef(
       e.preventDefault();
       e.stopPropagation();
       if (disabled) return;
-      setCurrentState("default");
+      setIsDragOver(false);
       const files = e.dataTransfer?.files;
       handleFileSelect(files);
     };
@@ -2560,12 +2487,11 @@ var Upload = React7.forwardRef(
     };
     const handleTryAgain = (e) => {
       e.stopPropagation();
-      setCurrentState("default");
-      setSelectedFiles([]);
       fileInputRef.current?.click();
     };
+    const effectiveState = isDragOver && state === "default" ? "dragOver" : state;
     const renderContent = () => {
-      switch (currentState) {
+      switch (effectiveState) {
         case "error":
           return /* @__PURE__ */ jsxs7(
             "div",
@@ -2602,8 +2528,8 @@ var Upload = React7.forwardRef(
                   /* @__PURE__ */ jsx7("div", { className: "w-full bg-gray rounded-full h-2", children: /* @__PURE__ */ jsx7(
                     "div",
                     {
-                      className: "bg-primary h-2 rounded-full transition-all duration-300 ease-in-out",
-                      style: { width: `${currentProgress}%` }
+                      className: "bg-canvas-primary h-2 rounded-full transition-all duration-300 ease-in-out",
+                      style: { width: `${progress}%` }
                     }
                   ) }),
                   /* @__PURE__ */ jsxs7(
@@ -2612,7 +2538,7 @@ var Upload = React7.forwardRef(
                       variant: "body-sm",
                       className: "text-secondary text-center",
                       children: [
-                        currentProgress,
+                        Math.round(progress),
                         "% complete"
                       ]
                     }
@@ -2676,14 +2602,14 @@ var Upload = React7.forwardRef(
       {
         ref,
         className: cn(
-          uploadVariants({ state: currentState, disabled }),
+          uploadVariants({ state: effectiveState, disabled }),
           className
         ),
         onDragEnter: handleDragEnter,
         onDragLeave: !disabled ? handleDragLeave : void 0,
         onDragOver: !disabled ? handleDragOver : void 0,
         onDrop: !disabled ? handleDrop : void 0,
-        onClick: disabled || currentState === "uploading" ? void 0 : handleClick,
+        onClick: disabled || state === "uploading" ? void 0 : handleClick,
         style: {
           width: "960px",
           height: "540px",
@@ -2691,7 +2617,7 @@ var Upload = React7.forwardRef(
         },
         role: "button",
         tabIndex: disabled ? -1 : 0,
-        "aria-label": currentState === "uploading" ? "Uploading files" : "Upload files",
+        "aria-label": state === "uploading" ? "Uploading files" : "Upload files",
         "aria-disabled": disabled,
         ...props,
         children: [
@@ -2728,7 +2654,7 @@ var Checkbox = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__
     ref,
     className: cn(checkboxVariants(), className),
     ...props,
-    children: /* @__PURE__ */ jsx8(CheckboxPrimitive.Indicator, { className: "flex items-center justify-center text-current", children: /* @__PURE__ */ jsx8(CheckIcon, { className: "size-3" }) })
+    children: /* @__PURE__ */ jsx8(CheckboxPrimitive.Indicator, { className: "flex items-center justify-center text-current", children: /* @__PURE__ */ jsx8(CheckIcon, { variant: "light", className: "size-3" }) })
   }
 ));
 Checkbox.displayName = CheckboxPrimitive.Root.displayName;
@@ -2795,7 +2721,7 @@ var tabsVariants = cva9(
   {
     variants: {
       variant: {
-        default: "border-b-2 border-subtle hover:bg-gray data-[state=active]:border-interactive data-[state=active]:text-dark disabled:border-subtle disabled:text-muted disabled:cursor-not-allowed"
+        default: "border-b-1 border-subtle hover:bg-gray data-[state=active]:border-interactive data-[state=active]:text-dark data-[state=active]:border-b-2 disabled:border-subtle disabled:text-muted disabled:cursor-not-allowed"
       }
     },
     defaultVariants: {
@@ -2922,6 +2848,176 @@ var TabsContent = React10.forwardRef(
   }
 );
 TabsContent.displayName = "TabsContent";
+
+// src/components/ui/dropdown-menu.tsx
+import * as React11 from "react";
+import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
+import { jsx as jsx11, jsxs as jsxs8 } from "react/jsx-runtime";
+var DropdownMenu = DropdownMenuPrimitive.Root;
+var DropdownMenuTrigger = React11.forwardRef(({ className, icon, children, ...props }, ref) => /* @__PURE__ */ jsxs8(
+  DropdownMenuPrimitive.Trigger,
+  {
+    ref,
+    className: cn(
+      "inline-flex items-center justify-center rounded bg-light p-2 transition-colors hover:bg-gray focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-interactive focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
+      className
+    ),
+    ...props,
+    children: [
+      icon || /* @__PURE__ */ jsx11(MoreMenu, { className: "size-4" }),
+      children
+    ]
+  }
+));
+DropdownMenuTrigger.displayName = DropdownMenuPrimitive.Trigger.displayName;
+var DropdownMenuGroup = DropdownMenuPrimitive.Group;
+var DropdownMenuPortal = DropdownMenuPrimitive.Portal;
+var DropdownMenuSub = DropdownMenuPrimitive.Sub;
+var DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;
+var DropdownMenuSubTrigger = React11.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs8(
+  DropdownMenuPrimitive.SubTrigger,
+  {
+    ref,
+    className: cn(
+      "flex cursor-pointer select-none items-center gap-2 px-2 py-3 outline-none transition-colors hover:bg-gray focus:bg-gray data-[state=open]:bg-gray [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
+      inset && "pl-8",
+      className
+    ),
+    style: { font: "var(--typography-label-sm-regular)" },
+    ...props,
+    children: [
+      children,
+      /* @__PURE__ */ jsx11(ChevronRight, { className: "ml-auto" })
+    ]
+  }
+));
+DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;
+var DropdownMenuSubContent = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx11(
+  DropdownMenuPrimitive.SubContent,
+  {
+    ref,
+    className: cn(
+      "z-50 min-w-[8rem] overflow-hidden rounded-md border border-subtle bg-light text-dark shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-dropdown-menu-content-transform-origin]",
+      className
+    ),
+    ...props
+  }
+));
+DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
+var DropdownMenuContent = React11.forwardRef(({ className, sideOffset = 4, align = "end", ...props }, ref) => /* @__PURE__ */ jsx11(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx11(
+  DropdownMenuPrimitive.Content,
+  {
+    ref,
+    sideOffset,
+    align,
+    className: cn(
+      "z-50 min-w-50 overflow-hidden rounded-md border border-subtle bg-light shadow-lg animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95",
+      className
+    ),
+    ...props
+  }
+) }));
+DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
+var DropdownMenuItem = React11.forwardRef(({ className, inset, style, ...props }, ref) => /* @__PURE__ */ jsx11(
+  DropdownMenuPrimitive.Item,
+  {
+    ref,
+    className: cn(
+      "relative flex cursor-pointer select-none items-center px-2 py-3 outline-none transition-colors hover:bg-gray focus:bg-gray data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      inset && "pl-8",
+      className
+    ),
+    style: {
+      font: "var(--typography-label-sm-regular)",
+      ...style
+    },
+    ...props
+  }
+));
+DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
+var DropdownMenuCheckboxItem = React11.forwardRef(({ className, children, style, checked, ...props }, ref) => /* @__PURE__ */ jsxs8(
+  DropdownMenuPrimitive.CheckboxItem,
+  {
+    ref,
+    className: cn(
+      "relative flex cursor-pointer select-none items-center gap-2 px-2 py-3 outline-none transition-colors hover:bg-gray focus:bg-gray data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      className
+    ),
+    checked,
+    style: {
+      font: "var(--typography-label-sm-regular)",
+      ...style
+    },
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx11(
+        Checkbox,
+        {
+          checked: checked === true,
+          className: "pointer-events-none",
+          "aria-hidden": "true"
+        }
+      ),
+      /* @__PURE__ */ jsx11("span", { className: "flex-1", children })
+    ]
+  }
+));
+DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;
+var DropdownMenuRadioItem = React11.forwardRef(({ className, children, style, ...props }, ref) => /* @__PURE__ */ jsxs8(
+  DropdownMenuPrimitive.RadioItem,
+  {
+    ref,
+    className: cn(
+      "relative flex cursor-pointer select-none items-center px-2 py-3 pl-8 outline-none transition-colors hover:bg-gray focus:bg-gray data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      className
+    ),
+    style: {
+      font: "var(--typography-label-sm-regular)",
+      ...style
+    },
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx11("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx11(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx11("span", { className: "h-2 w-2 rounded-full bg-current" }) }) }),
+      children
+    ]
+  }
+));
+DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;
+var DropdownMenuLabel = React11.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx11(
+  DropdownMenuPrimitive.Label,
+  {
+    ref,
+    className: cn(
+      "px-2 py-1.5 text-sm font-semibold",
+      inset && "pl-8",
+      className
+    ),
+    ...props
+  }
+));
+DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
+var DropdownMenuSeparator = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx11(
+  DropdownMenuPrimitive.Separator,
+  {
+    ref,
+    className: cn("-mx-1 my-1 h-px bg-subtle", className),
+    ...props
+  }
+));
+DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;
+var DropdownMenuShortcut = ({
+  className,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsx11(
+    "span",
+    {
+      className: cn("ml-auto text-xs tracking-widest opacity-60", className),
+      ...props
+    }
+  );
+};
+DropdownMenuShortcut.displayName = "DropdownMenuShortcut";
 export {
   ArrowDown,
   ArrowLeft,
@@ -2953,6 +3049,21 @@ export {
   DatePicker,
   Doc,
   Dollar,
+  DropdownMenu,
+  DropdownMenuCheckboxItem,
+  DropdownMenuContent,
+  DropdownMenuGroup,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuPortal,
+  DropdownMenuRadioGroup,
+  DropdownMenuRadioItem,
+  DropdownMenuSeparator,
+  DropdownMenuShortcut,
+  DropdownMenuSub,
+  DropdownMenuSubContent,
+  DropdownMenuSubTrigger,
+  DropdownMenuTrigger,
   Edit,
   Envelope,
   Exclamation,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@northslopetech/altitude-ui",
-  "version": "2.0.10",
+  "version": "2.0.13",
   "private": false,
   "description": "React UI components for the Altitude design system",
   "author": "Northslope",