@ews-admin/global-design-system 1.1.20 → 1.1.21
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Modal/Modal.d.ts +5 -1
- package/dist/components/Modal/Modal.d.ts.map +1 -1
- package/dist/index.css +1 -1
- package/dist/index.d.ts +5 -1
- package/dist/index.esm.css +1 -1
- package/dist/index.esm.js +13 -2
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +13 -2
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
- package/src/components/Modal/Modal.tsx +20 -1
package/dist/index.js
CHANGED
|
@@ -1640,7 +1640,7 @@ function MultiSearchAutocomplete({ items, selectedItems, onSelectionChange, onSe
|
|
|
1640
1640
|
}) })) }))] }));
|
|
1641
1641
|
}
|
|
1642
1642
|
|
|
1643
|
-
const Modal = ({ isOpen, onClose, title, children, variant = "info", primaryAction, secondaryAction, onPrimaryAction, onSecondaryAction, isLoading = false, closeOnOverlayClick = true, className, contentClassName, error, }) => {
|
|
1643
|
+
const Modal = ({ isOpen, onClose, title, children, variant = "info", size = "md", primaryAction, secondaryAction, onPrimaryAction, onSecondaryAction, isLoading = false, closeOnOverlayClick = true, className, contentClassName, error, }) => {
|
|
1644
1644
|
// Handle escape key press
|
|
1645
1645
|
React.useEffect(() => {
|
|
1646
1646
|
const handleEscape = (event) => {
|
|
@@ -1693,12 +1693,23 @@ const Modal = ({ isOpen, onClose, title, children, variant = "info", primaryActi
|
|
|
1693
1693
|
}
|
|
1694
1694
|
};
|
|
1695
1695
|
const variantStyles = getVariantStyles();
|
|
1696
|
+
const getSizeClasses = () => {
|
|
1697
|
+
const sizeMap = {
|
|
1698
|
+
sm: "max-w-sm",
|
|
1699
|
+
md: "max-w-md",
|
|
1700
|
+
lg: "max-w-lg",
|
|
1701
|
+
xl: "max-w-xl",
|
|
1702
|
+
"2xl": "max-w-2xl",
|
|
1703
|
+
full: "max-w-full",
|
|
1704
|
+
};
|
|
1705
|
+
return sizeMap[size] || sizeMap.md;
|
|
1706
|
+
};
|
|
1696
1707
|
const handleOverlayClick = (e) => {
|
|
1697
1708
|
if (e.target === e.currentTarget && closeOnOverlayClick) {
|
|
1698
1709
|
onClose();
|
|
1699
1710
|
}
|
|
1700
1711
|
};
|
|
1701
|
-
return (jsxRuntime.jsxs("div", { className: "flex fixed inset-0 z-50 justify-center items-center", children: [jsxRuntime.jsx("div", { className: "absolute inset-0 backdrop-blur-sm bg-black/50", onClick: handleOverlayClick }), jsxRuntime.jsxs("div", { className: cn("relative
|
|
1712
|
+
return (jsxRuntime.jsxs("div", { className: "flex fixed inset-0 z-50 justify-center items-center", children: [jsxRuntime.jsx("div", { className: "absolute inset-0 backdrop-blur-sm bg-black/50", onClick: handleOverlayClick }), jsxRuntime.jsxs("div", { className: cn("relative w-full bg-white rounded-lg shadow-xl transition-all transform", "duration-200 animate-in fade-in-0 zoom-in-95", getSizeClasses(), "mx-4", className), role: "dialog", "aria-modal": "true", "aria-labelledby": "modal-title", children: [jsxRuntime.jsxs("div", { className: cn("flex items-center justify-between p-6 border-b", variantStyles.borderColor), children: [jsxRuntime.jsxs("div", { className: "flex items-center space-x-3", children: [jsxRuntime.jsx("div", { className: cn("p-2 rounded-full", variantStyles.iconBg), children: variantStyles.icon }), jsxRuntime.jsx("h2", { id: "modal-title", className: cn("text-lg font-semibold", variantStyles.titleColor), children: title })] }), jsxRuntime.jsx("button", { onClick: onClose, className: "p-1 text-gray-400 transition-colors hover:text-gray-600", "aria-label": "Close modal", children: jsxRuntime.jsx(X, { className: "w-5 h-5" }) })] }), jsxRuntime.jsx("div", { className: cn("p-6", contentClassName), children: jsxRuntime.jsx("div", { className: "leading-relaxed text-gray-700", children: error && variant === "error" ? (jsxRuntime.jsxs("div", { className: "space-y-3", children: [jsxRuntime.jsx("p", { children: error.message }), error.fields && error.fields.length > 0 && (jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx("p", { className: "font-semibold text-gray-900", children: "Erreurs de champ:" }), jsxRuntime.jsx("ul", { className: "mt-2 space-y-1", children: error.fields.map((field, index) => (jsxRuntime.jsxs("li", { className: "text-ews-error", children: ["\u2022 ", field.path, ": ", field.message] }, index))) })] }))] })) : (children) }) }), (primaryAction || secondaryAction) && (jsxRuntime.jsxs("div", { className: "flex justify-end items-center p-6 pt-0 space-x-3", children: [secondaryAction && (jsxRuntime.jsx(Button, { variant: "outline", onClick: onSecondaryAction || onClose, disabled: isLoading, children: secondaryAction })), primaryAction && (jsxRuntime.jsx(Button, { variant: variant === "error" ? "error" : "ews-primary", onClick: onPrimaryAction, loading: isLoading, children: primaryAction }))] }))] })] }));
|
|
1702
1713
|
};
|
|
1703
1714
|
|
|
1704
1715
|
const DropdownMultiSelect = ({ options, name, control, placeholder = "Select options", searchPlaceholder = "Search...", onChange, value: controlledValue, defaultValue, onValidate, disabled = false, error, label, className, }) => {
|