uiplex 1.4.0 → 1.5.0

package/dist/index.d.ts

@@ -20,6 +20,16 @@ import './Popover/Popover.css';
 import './Tabs/Tabs.css';
 import './Accordion/Accordion.css';
 import './Breadcrumb/Breadcrumb.css';
+import './Table/Table.css';
+import './Alert/Alert.css';
+import './Badge/Badge.css';
+import './Avatar/Avatar.css';
+import './Card/Card.css';
+import './Switch/Switch.css';
+import './DateTimePicker/DateTimePicker.css';
+import './Upload/Upload.css';
+import './Skeleton/Skeleton.css';
+import './Drawer/Drawer.css';
 import './Theme/theme.css';
 export { Button } from './Button';
 export type { ButtonProps } from './Button';
@@ -65,6 +75,26 @@ export { Accordion, AccordionItem, AccordionButton, AccordionPanel } from './Acc
 export type { AccordionProps, AccordionItemProps, AccordionButtonProps, AccordionPanelProps } from './Accordion';
 export { Breadcrumb } from './Breadcrumb';
 export type { BreadcrumbProps, BreadcrumbItem } from './Breadcrumb';
+export { Table, TableHead, TableBody, TableFooter, TableRow, TableHeader, TableCell, } from './Table';
+export type { TableProps, TableHeadProps, TableBodyProps, TableFooterProps, TableRowProps, TableHeaderProps, TableCellProps, TableSize, TableVariant, } from './Table';
+export { Alert } from './Alert';
+export type { AlertProps, AlertVariant } from './Alert';
+export { Badge } from './Badge';
+export type { BadgeProps, BadgeVariant, BadgeSize } from './Badge';
+export { Avatar } from './Avatar';
+export type { AvatarProps, AvatarSize } from './Avatar';
+export { Card, CardHeader, CardBody, CardFooter, CardImage, CardTitle, CardSubtitle, } from './Card';
+export type { CardProps, CardHeaderProps, CardBodyProps, CardFooterProps, CardImageProps, CardTitleProps, CardSubtitleProps, CardVariant, } from './Card';
+export { Switch } from './Switch';
+export type { SwitchProps, SwitchSize, SwitchLabelPosition } from './Switch';
+export { DateTimePicker } from './DateTimePicker';
+export type { DateTimePickerProps, DateTimePickerMode, DateTimePickerSize } from './DateTimePicker';
+export { Upload } from './Upload';
+export type { UploadProps } from './Upload';
+export { Skeleton } from './Skeleton';
+export type { SkeletonProps, SkeletonVariant } from './Skeleton';
+export { Drawer, DrawerHeader, DrawerBody, DrawerFooter, DrawerCloseButton, } from './Drawer';
+export type { DrawerProps, DrawerHeaderProps, DrawerBodyProps, DrawerFooterProps, DrawerCloseButtonProps, DrawerPlacement, } from './Drawer';
 export { useDisclosure } from './hooks';
 export type { UseDisclosureReturn } from './hooks';
 export { useOutsideClick } from './hooks';

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}

package/dist/index.js

@@ -1363,6 +1363,266 @@ const Breadcrumb = ({ items, separator = "/", className = "", style, ...props })
                         }, className: `ui-breadcrumb__link ${isLastItem(index) ? "ui-breadcrumb__link--current" : ""}`.trim(), "aria-current": isLastItem(index) ? "page" : undefined, children: item.label })) : (jsx("span", { className: `ui-breadcrumb__text ${isLastItem(index) ? "ui-breadcrumb__text--current" : ""}`.trim(), "aria-current": isLastItem(index) ? "page" : undefined, children: item.label })), !isLastItem(index) && (jsx("span", { className: "ui-breadcrumb__separator", "aria-hidden": "true", children: separator }))] }, index))) }) }));
 };
 
+const Table = ({ children, variant = "default", size = "md", className = "", style, ...props }) => {
+    const classes = [
+        "ui-table",
+        `ui-table--${variant}`,
+        `ui-table--${size}`,
+        className,
+    ]
+        .filter(Boolean)
+        .join(" ");
+    return (jsx("div", { className: "ui-table__wrapper", children: jsx("table", { className: classes, style: style, ...props, children: children }) }));
+};
+const TableHead = ({ children, className = "", style, ...props }) => (jsx("thead", { className: `ui-table__head ${className}`.trim(), style: style, ...props, children: children }));
+const TableBody = ({ children, className = "", style, ...props }) => (jsx("tbody", { className: `ui-table__body ${className}`.trim(), style: style, ...props, children: children }));
+const TableFooter = ({ children, className = "", style, ...props }) => (jsx("tfoot", { className: `ui-table__foot ${className}`.trim(), style: style, ...props, children: children }));
+const TableRow = ({ children, className = "", style, ...props }) => (jsx("tr", { className: `ui-table__row ${className}`.trim(), style: style, ...props, children: children }));
+const TableHeader = ({ children, className = "", style, ...props }) => (jsx("th", { className: `ui-table__header ${className}`.trim(), style: style, ...props, children: children }));
+const TableCell = ({ children, className = "", style, ...props }) => (jsx("td", { className: `ui-table__cell ${className}`.trim(), style: style, ...props, children: children }));
+
+const Alert = ({ children, variant = "info", title, onClose, className = "", style, ...props }) => {
+    const classes = [
+        "ui-alert",
+        `ui-alert--${variant}`,
+        className,
+    ]
+        .filter(Boolean)
+        .join(" ");
+    return (jsxs("div", { className: classes, style: style, role: "alert", ...props, children: [jsxs("div", { className: "ui-alert__content", children: [title && jsx("div", { className: "ui-alert__title", children: title }), jsx("div", { className: "ui-alert__message", children: children })] }), onClose && (jsx("button", { type: "button", className: "ui-alert__close", onClick: onClose, "aria-label": "Close alert", children: "\u00D7" }))] }));
+};
+
+const Badge = ({ children, variant = "default", size = "md", className = "", style, ...props }) => {
+    const classes = [
+        "ui-badge",
+        `ui-badge--${variant}`,
+        `ui-badge--${size}`,
+        className,
+    ]
+        .filter(Boolean)
+        .join(" ");
+    return (jsx("span", { className: classes, style: style, ...props, children: children }));
+};
+
+const getInitials = (name) => {
+    return name
+        .trim()
+        .split(/\s+/)
+        .map((part) => part[0])
+        .join("")
+        .toUpperCase()
+        .slice(0, 2);
+};
+const Avatar = ({ src, alt = "", name, size = "md", backgroundColor, color, className = "", style, ...props }) => {
+    const [imgError, setImgError] = useState(false);
+    const showImage = src && !imgError;
+    const initials = name ? getInitials(name) : null;
+    const classes = [
+        "ui-avatar",
+        `ui-avatar--${size}`,
+        className,
+    ]
+        .filter(Boolean)
+        .join(" ");
+    const mergedStyle = {
+        ...(backgroundColor && { backgroundColor }),
+        ...(color && { color }),
+        ...style,
+    };
+    return (jsx("div", { className: classes, style: mergedStyle, ...props, children: showImage ? (jsx("img", { src: src, alt: alt, className: "ui-avatar__img", onError: () => setImgError(true) })) : (jsx("span", { className: "ui-avatar__fallback", "aria-hidden": !!alt, children: initials || (alt ? alt[0].toUpperCase() : "?") })) }));
+};
+
+const Card = ({ children, variant = "default", className = "", style, ...props }) => {
+    const classes = [
+        "ui-card",
+        variant === "dark" && "ui-card--dark",
+        variant === "light" && "ui-card--light",
+        className,
+    ]
+        .filter(Boolean)
+        .join(" ");
+    return (jsx("div", { className: classes, style: style, ...props, children: children }));
+};
+const CardImage = ({ src, alt, className = "", style, ...props }) => {
+    return (jsx("div", { className: "ui-card__image-wrapper", children: jsx("img", { src: src, alt: alt, className: `ui-card__image ${className}`.trim(), style: style, ...props }) }));
+};
+const CardHeader = ({ children, className = "", style, ...props }) => (jsx("div", { className: `ui-card__header ${className}`.trim(), style: style, ...props, children: children }));
+const CardBody = ({ children, className = "", style, ...props }) => (jsx("div", { className: `ui-card__body ${className}`.trim(), style: style, ...props, children: children }));
+const CardFooter = ({ children, className = "", style, ...props }) => (jsx("div", { className: `ui-card__footer ${className}`.trim(), style: style, ...props, children: children }));
+const CardTitle = ({ children, className = "", style, ...props }) => (jsx("div", { className: `ui-card__title ${className}`.trim(), style: style, ...props, children: children }));
+const CardSubtitle = ({ children, className = "", style, ...props }) => (jsx("div", { className: `ui-card__subtitle ${className}`.trim(), style: style, ...props, children: children }));
+
+const Switch = ({ checked, defaultChecked = false, onChange, disabled = false, size = "md", leftLabel, rightLabel, label, labelPosition = "right", className = "", id, ...props }) => {
+    const [uncontrolledChecked, setUncontrolledChecked] = React.useState(defaultChecked);
+    const isControlled = checked !== undefined;
+    const isChecked = isControlled ? checked : uncontrolledChecked;
+    const handleChange = (e) => {
+        if (!isControlled)
+            setUncontrolledChecked(e.target.checked);
+        onChange?.(e.target.checked);
+    };
+    const switchId = id || `ui-switch-${React.useId()}`;
+    const classes = [
+        "ui-switch",
+        `ui-switch--${size}`,
+        disabled && "ui-switch--disabled",
+        isChecked && "ui-switch--checked",
+        className,
+    ]
+        .filter(Boolean)
+        .join(" ");
+    const resolvedLeft = leftLabel ?? (label && labelPosition === "left" ? label : undefined);
+    const resolvedRight = rightLabel ?? (label && labelPosition === "right" ? label : undefined);
+    const ariaLabel = [resolvedLeft, resolvedRight].filter(Boolean).join(" ") || undefined;
+    const trackAndThumb = (jsxs(Fragment, { children: [jsx("input", { type: "checkbox", id: switchId, role: "switch", checked: isChecked, disabled: disabled, onChange: handleChange, className: "ui-switch__input", "aria-checked": isChecked, "aria-label": ariaLabel, ...props }), jsx("span", { className: "ui-switch__track", children: jsx("span", { className: "ui-switch__thumb" }) })] }));
+    return (jsxs("label", { className: classes, htmlFor: switchId, children: [resolvedLeft != null && jsx("span", { className: "ui-switch__label", children: resolvedLeft }), trackAndThumb, resolvedRight != null && jsx("span", { className: "ui-switch__label", children: resolvedRight })] }));
+};
+
+const getInputType = (mode) => {
+    switch (mode) {
+        case "date":
+            return "date";
+        case "time":
+            return "time";
+        case "datetime":
+            return "datetime-local";
+        default:
+            return "date";
+    }
+};
+const DateTimePicker = ({ mode = "date", size = "md", value, defaultValue, onChange, min, max, disabled = false, className = "", id, ...props }) => {
+    const inputType = getInputType(mode);
+    const inputId = id || `ui-datetime-${React.useId()}`;
+    const classes = [
+        "ui-datetime-picker",
+        `ui-datetime-picker--${mode}`,
+        `ui-datetime-picker--${size}`,
+        disabled && "ui-datetime-picker--disabled",
+        className,
+    ]
+        .filter(Boolean)
+        .join(" ");
+    const handleChange = (e) => {
+        onChange?.(e.target.value);
+    };
+    return (jsx("div", { className: classes, children: jsx("input", { id: inputId, type: inputType, value: value, defaultValue: defaultValue, onChange: handleChange, min: min, max: max, disabled: disabled, className: "ui-datetime-picker__input", ...props }) }));
+};
+
+const defaultPlaceholder = (jsxs(Fragment, { children: [jsx("span", { className: "ui-upload__icon", children: "\u2191" }), jsx("span", { className: "ui-upload__text", children: "Drag and drop or click to upload" })] }));
+const Upload = ({ onFileSelect, onFilesChange, accept, multiple = false, disabled = false, maxSize, children = defaultPlaceholder, className = "", }) => {
+    const inputRef = useRef(null);
+    const [isDragOver, setIsDragOver] = useState(false);
+    const [error, setError] = useState(null);
+    const handleFiles = (files) => {
+        setError(null);
+        if (!files || files.length === 0) {
+            onFilesChange?.(null);
+            return;
+        }
+        const fileArray = Array.from(files);
+        if (maxSize) {
+            const oversized = fileArray.filter((f) => f.size > maxSize);
+            if (oversized.length > 0) {
+                setError(`Some files exceed ${Math.round(maxSize / 1024)}KB`);
+                return;
+            }
+        }
+        onFileSelect?.(fileArray);
+        onFilesChange?.(files);
+    };
+    const handleChange = (e) => {
+        handleFiles(e.target.files);
+        e.target.value = "";
+    };
+    const handleClick = () => {
+        if (!disabled)
+            inputRef.current?.click();
+    };
+    const handleDragOver = (e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        if (!disabled)
+            setIsDragOver(true);
+    };
+    const handleDragLeave = (e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        setIsDragOver(false);
+    };
+    const handleDrop = (e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        setIsDragOver(false);
+        if (disabled)
+            return;
+        handleFiles(e.dataTransfer.files);
+    };
+    const classes = [
+        "ui-upload",
+        disabled && "ui-upload--disabled",
+        isDragOver && "ui-upload--dragover",
+        error && "ui-upload--error",
+        className,
+    ]
+        .filter(Boolean)
+        .join(" ");
+    return (jsxs("div", { className: classes, onClick: handleClick, onDragOver: handleDragOver, onDragLeave: handleDragLeave, onDrop: handleDrop, children: [jsx("input", { ref: inputRef, type: "file", className: "ui-upload__input", accept: accept, multiple: multiple, disabled: disabled, onChange: handleChange, tabIndex: -1, "aria-label": "Upload files" }), jsx("div", { className: "ui-upload__content", children: children }), error && jsx("div", { className: "ui-upload__error", children: error })] }));
+};
+
+const Skeleton = ({ variant = "text", width, height, className = "", style, ...props }) => {
+    const classes = [
+        "ui-skeleton",
+        `ui-skeleton--${variant}`,
+        className,
+    ]
+        .filter(Boolean)
+        .join(" ");
+    const mergedStyle = {
+        ...(width !== undefined && { width: typeof width === "number" ? `${width}px` : width }),
+        ...(height !== undefined && { height: typeof height === "number" ? `${height}px` : height }),
+        ...style,
+    };
+    return jsx("div", { className: classes, style: mergedStyle, "aria-busy": "true", "aria-live": "polite", ...props });
+};
+
+const DrawerCloseButton = ({ onClose, className = "", }) => (jsx("button", { type: "button", className: `ui-drawer__close ${className}`, onClick: onClose, "aria-label": "Close drawer", children: jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: jsx("path", { d: "M12 4L4 12M4 4l8 8", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }) }));
+const DrawerHeader = ({ children, className = "", }) => jsx("div", { className: `ui-drawer__header ${className}`, children: children });
+const DrawerBody = ({ children, className = "", }) => jsx("div", { className: `ui-drawer__body ${className}`, children: children });
+const DrawerFooter = ({ children, className = "", }) => jsx("div", { className: `ui-drawer__footer ${className}`, children: children });
+const Drawer = ({ isOpen, onClose, children, placement = "right", size = "md", closeOnOverlayClick = true, closeOnEsc = true, level = 0, className = "", }) => {
+    const drawerRef = useRef(null);
+    const zIndex = 1000 + level * 10;
+    useEffect(() => {
+        if (!isOpen)
+            return;
+        const handleEsc = (e) => {
+            if (closeOnEsc && e.key === "Escape")
+                onClose();
+        };
+        document.addEventListener("keydown", handleEsc);
+        document.body.style.overflow = "hidden";
+        return () => {
+            document.removeEventListener("keydown", handleEsc);
+            document.body.style.overflow = "";
+        };
+    }, [isOpen, closeOnEsc, onClose]);
+    if (!isOpen)
+        return null;
+    const handleOverlayClick = (e) => {
+        if (closeOnOverlayClick && e.target === e.currentTarget)
+            onClose();
+    };
+    const contentClasses = [
+        "ui-drawer__content",
+        `ui-drawer__content--${placement}`,
+        `ui-drawer__content--${size}`,
+        className,
+    ]
+        .filter(Boolean)
+        .join(" ");
+    return (jsxs("div", { className: "ui-drawer", ref: drawerRef, style: { zIndex }, role: "dialog", "aria-modal": "true", children: [jsx("div", { className: "ui-drawer__overlay", onClick: handleOverlayClick, "aria-hidden": "true" }), jsx("div", { className: contentClasses, children: children })] }));
+};
+
 const useDisclosure = (defaultIsOpen = false) => {
     const [isOpen, setIsOpen] = useState(defaultIsOpen);
     const onOpen = useCallback(() => {
@@ -1574,4 +1834,4 @@ const ThemeScript = ({ storageKey = "uiplex-theme", defaultTheme = "system" }) =
         } }));
 };
 
-export { Accordion, AccordionButton, AccordionItem, AccordionPanel, Box, Breadcrumb, Button, Checkbox, CheckboxGroup, CircularProgress, CircularProgressLabel, Flex, FormControl, FormErrorMessage, FormLabel, Grid, IconButton, Input, Link, Loader, Modal, ModalBody, ModalCloseButton, ModalContent, ModalFooter, ModalHeader, ModalOverlay, Popover, PopoverBody, PopoverCloseButton, PopoverContent, PopoverFooter, PopoverHeader, Radio, RadioGroup, Select, Tab, TabList, TabPanel, TabPanels, Tabs, Text, Textarea, ThemeProvider, ThemeScript, ThemeToggle, ToastStatic as Toast, Toast as ToastComponent, ToastContainer, ToastContainerGlobal, Tooltip, useDisclosure, useOutsideClick, useTheme };
+export { Accordion, AccordionButton, AccordionItem, AccordionPanel, Alert, Avatar, Badge, Box, Breadcrumb, Button, Card, CardBody, CardFooter, CardHeader, CardImage, CardSubtitle, CardTitle, Checkbox, CheckboxGroup, CircularProgress, CircularProgressLabel, DateTimePicker, Drawer, DrawerBody, DrawerCloseButton, DrawerFooter, DrawerHeader, Flex, FormControl, FormErrorMessage, FormLabel, Grid, IconButton, Input, Link, Loader, Modal, ModalBody, ModalCloseButton, ModalContent, ModalFooter, ModalHeader, ModalOverlay, Popover, PopoverBody, PopoverCloseButton, PopoverContent, PopoverFooter, PopoverHeader, Radio, RadioGroup, Select, Skeleton, Switch, Tab, TabList, TabPanel, TabPanels, Table, TableBody, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, Text, Textarea, ThemeProvider, ThemeScript, ThemeToggle, ToastStatic as Toast, Toast as ToastComponent, ToastContainer, ToastContainerGlobal, Tooltip, Upload, useDisclosure, useOutsideClick, useTheme };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "uiplex",
-  "version": "1.4.0",
+  "version": "1.5.0",
   "description": "A modern React component library with TypeScript support, featuring Button, Loader, Radio components and a comprehensive theme system",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",