kelt-ui-kit-react 1.8.9 → 1.9.0

package/dist/button/Button.js

@@ -0,0 +1,25 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Badge } from "../badge/Badge";
+import { Icon } from "../icon/Icon";
+import "./button.css";
+export var Button = function (_a) {
+    var className = _a.className, onClick = _a.onClick, badge = _a.badge, title = _a.title, sizeIcon = _a.sizeIcon, id = _a.id, classIcon = _a.classIcon, _b = _a.positionicon, positionicon = _b === void 0 ? 1 : _b, _c = _a.disabled, disabled = _c === void 0 ? false : _c;
+    var handleClick = function (e) {
+        e.stopPropagation();
+        if (onClick) {
+            onClick(e);
+        }
+    };
+    return (_jsxs("button", __assign({ id: id !== null && id !== void 0 ? id : "", disabled: disabled, type: "submit", onClick: function (e) { return handleClick(e); }, className: className }, { children: [badge && _jsx(Badge, __assign({}, badge)), classIcon && positionicon == 1 && (_jsx("span", __assign({ className: "".concat(title ? "mr-2" : "") }, { children: _jsx(Icon, { size: sizeIcon, classIcon: classIcon }) }))), _jsx("span", { children: title }), classIcon && positionicon == 2 && (_jsx("span", __assign({ className: "ml-2" }, { children: _jsx(Icon, { classIcon: classIcon }) })))] })));
+};

package/dist/button/Button.view.js

@@ -0,0 +1,74 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { TypeInputEnum } from "../form/form.enum";
+import { Button } from "./Button";
+import { ButtonActions, } from "./buttonActions/ButtonActions";
+import { ButtonFilters } from "./buttonFilters/ButtonFilters";
+export var ButtonView = function () {
+    var initialValues = [
+        {
+            value: false,
+            name: "test1",
+            label: "test 1",
+            type: TypeInputEnum.CHECKBOX,
+        },
+        {
+            value: false,
+            name: "test2",
+            label: "test 2",
+            type: TypeInputEnum.CHECKBOX,
+        },
+    ];
+    var mockButtonItems = [
+        {
+            title: "Envoyer",
+            onClick: function () { return console.log("Envoyer"); },
+            classIcon: "bi-send",
+            disabled: true,
+            positionicon: 1,
+            badge: {
+                className: "badge--primary",
+                title: "Badge",
+                sizeIcon: undefined,
+                classIcon: "bi-check-circle",
+                onClick: function () { return console.log("Badge clicked"); },
+            },
+        },
+        {
+            title: "Annuler",
+            onClick: function () { return console.log("Envoyer"); },
+            className: "button--secondary",
+        },
+    ];
+    var mockButtonAction = useMemo(function () {
+        return {
+            title: "Supprimer",
+            onClick: function () { return console.log("Supprimer"); },
+            className: "button--secondary",
+            actions: [
+                {
+                    id: "1",
+                    label: "Supprimer",
+                    onClick: function () { return console.log("Supprimer action"); },
+                },
+                {
+                    id: "2",
+                    label: "Supprimer définitivement",
+                    onClick: function () { return console.log("Supprimer définitivement"); },
+                },
+            ],
+        };
+    }, []);
+    return (_jsxs("div", __assign({ className: "d-flex" }, { children: [mockButtonItems.map(function (item, index) { return (_jsx("div", __assign({ className: "mr-2" }, { children: _jsx(Button, __assign({}, item)) }), index)); }), _jsx(ButtonActions, __assign({}, mockButtonAction)), _jsx("div", __assign({ className: "ml-2" }, { children: _jsx(ButtonFilters, __assign({ classIcon: "bi-send" }, mockButtonAction, { dataForm: initialValues })) }))] })));
+};

package/dist/button/button.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/button/buttonActions/ButtonActions.js

@@ -0,0 +1,55 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useCallback, useMemo, useRef, useState } from "react";
+import { Icon } from "../../icon/Icon";
+import { IconSizeEnum } from "../../icon/iconSize.enum";
+import { Menus } from "../../menus/Menus";
+import { OverlayPanel } from "../../overlayPanel/OverlayPanel";
+import { Button } from "../Button";
+export var ButtonActions = function (_a) {
+    var className = _a.className, onClick = _a.onClick, title = _a.title, actions = _a.actions, _b = _a.positionActions, positionActions = _b === void 0 ? "topRight" : _b, _c = _a.disabled, disabled = _c === void 0 ? false : _c, id = _a.id;
+    var handleClick = function (e) {
+        e.preventDefault();
+        if (onClick) {
+            onClick(e);
+        }
+    };
+    var refButton = useRef(null);
+    var _d = useState(false), openOverlay = _d[0], setOpenOverlay = _d[1];
+    var onClickActions = useCallback(function (e) {
+        e.stopPropagation();
+        if (actions)
+            setOpenOverlay(!openOverlay);
+    }, [openOverlay, setOpenOverlay]);
+    var overlayMenu = useMemo(function () {
+        if (!actions)
+            return [];
+        return actions.map(function (a, index) {
+            var _a;
+            return {
+                id: (_a = a.id) !== null && _a !== void 0 ? _a : index,
+                icon: a.icon,
+                name: a.label,
+                children: (_jsx(Button, { classIcon: a.icon, sizeIcon: IconSizeEnum.LARGE, onClick: function (e) {
+                        e.stopPropagation();
+                        closeOverlay();
+                        a.onClick && a.onClick(a);
+                    }, title: a.label || "" }, index)),
+            };
+        });
+    }, [actions]);
+    var closeOverlay = useCallback(function () {
+        setOpenOverlay(false);
+    }, [setOpenOverlay]);
+    return (_jsxs(_Fragment, { children: [_jsxs("button", __assign({ id: id !== null && id !== void 0 ? id : "", disabled: disabled, type: "submit", onClick: function (e) { return handleClick(e); }, className: " ".concat(className, " button-actions") }, { children: [_jsx("span", __assign({ className: "mr-2 flex-1" }, { children: title })), _jsx("span", __assign({ className: "ml-2", ref: refButton, onClick: function (e) { return onClickActions(e); } }, { children: _jsx(Icon, { classIcon: "bi-chevron-up" }) }))] })), actions && openOverlay && refButton.current && (_jsx(OverlayPanel, { show: openOverlay, position: positionActions, closeOverlay: setOpenOverlay, referenceElement: refButton.current, children: _jsx("div", { children: _jsx(Menus, { className: "card-action-menu", items: overlayMenu }) }) }))] }));
+};

package/dist/button/buttonFile/ButtonFile.js

@@ -0,0 +1,37 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useRef } from "react";
+import { Button } from "../Button";
+export var ButtonFile = function (_a) {
+    var onFileSelected = _a.onFileSelected, _b = _a.accept, accept = _b === void 0 ? "*" : _b, _c = _a.buttonText, buttonText = _c === void 0 ? "Choisir un fichier" : _c, buttonClassName = _a.buttonClassName, containerClassName = _a.containerClassName;
+    var fileInputRef = useRef(null);
+    var handleFileChange = function (e) {
+        var _a;
+        var file = (_a = e.target.files) === null || _a === void 0 ? void 0 : _a[0];
+        if (file && onFileSelected) {
+            var reader = new FileReader();
+            reader.onload = function (event) {
+                var _a;
+                var buffer = (_a = event.target) === null || _a === void 0 ? void 0 : _a.result;
+                onFileSelected(file, buffer);
+            };
+            reader.readAsArrayBuffer(file);
+        }
+    };
+    var handleButtonClick = function () {
+        var _a;
+        (_a = fileInputRef.current) === null || _a === void 0 ? void 0 : _a.click();
+    };
+    return (_jsxs("div", __assign({ className: containerClassName }, { children: [_jsx("input", { type: "file", ref: fileInputRef, onChange: handleFileChange, className: "hidden", accept: accept }), _jsx(Button, { onClick: handleButtonClick, className: buttonClassName ||
+                    "bg-green-500 hover:bg-green-600 text-white font-medium py-3 px-6 rounded-lg transition-colors duration-200", title: buttonText || "Choisir un fichier" })] })));
+};

package/dist/button/buttonFile/ButtonFile.view.js

@@ -0,0 +1,35 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ButtonFile } from "./ButtonFile";
+export var ButtonFileView = function () {
+    var handleZipFile = function (file, buffer) {
+        console.log("Fichier sélectionné:", file.name);
+        console.log("Type:", file.type);
+        console.log("Taille:", file.size);
+        console.log("Buffer:", buffer);
+        console.log("Taille du buffer:", buffer.byteLength);
+        // Convertir en Uint8Array si nécessaire
+        var uint8Array = new Uint8Array(buffer);
+        console.log("Uint8Array:", uint8Array);
+        // Faites ce que vous voulez avec le buffer ici
+    };
+    return (_jsx("div", __assign({ className: "min-h-screen bg-gray-50 p-8" }, { children: _jsxs("div", __assign({ className: "max-w-2xl mx-auto space-y-6" }, { children: [_jsxs("div", __assign({ className: "border-2 border-dashed border-gray-300 rounded-lg p-8 text-center bg-white" }, { children: [_jsx("h2", __assign({ className: "text-2xl font-semibold mb-6 text-gray-800" }, { children: "Exemple 1 : Fichier ZIP" })), _jsx(ButtonFile, { onFileSelected: handleZipFile, accept: ".zip", buttonText: "S\u00E9lectionner un ZIP" })] })), _jsxs("div", __assign({ className: "border-2 border-dashed border-gray-300 rounded-lg p-8 text-center bg-white" }, { children: [_jsx("h2", __assign({ className: "text-2xl font-semibold mb-6 text-gray-800" }, { children: "Exemple 2 : Tout type de fichier" })), _jsx(ButtonFile, { onFileSelected: function (file, buffer) {
+                                console.log("Fichier:", file.name, "Buffer size:", buffer.byteLength);
+                            }, buttonText: "S\u00E9lectionner n'importe quel fichier", buttonClassName: "bg-blue-500 hover:bg-blue-600 text-white font-medium py-2 px-4 rounded" })] })), _jsxs("div", __assign({ className: "border-2 border-dashed border-gray-300 rounded-lg p-8 text-center bg-white" }, { children: [_jsx("h2", __assign({ className: "text-2xl font-semibold mb-6 text-gray-800" }, { children: "Exemple 3 : Images uniquement" })), _jsx(ButtonFile, { onFileSelected: function (file, buffer) {
+                                console.log("Image:", file.name);
+                                // Créer une URL pour prévisualiser l'image
+                                var blob = new Blob([buffer], { type: file.type });
+                                var url = URL.createObjectURL(blob);
+                                console.log("URL de prévisualisation:", url);
+                            }, accept: "image/*", buttonText: "S\u00E9lectionner une image", buttonClassName: "bg-purple-500 hover:bg-purple-600 text-white font-medium py-3 px-6 rounded-lg" })] }))] })) })));
+};

package/dist/button/buttonFilters/ButtonFilters.js

@@ -0,0 +1,47 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useCallback, useEffect, useRef, useState } from "react";
+import { DynamicForm } from "../../form/Form";
+import { Icon } from "../../icon/Icon";
+import { IconSizeEnum } from "../../icon/iconSize.enum";
+import "./buttonFilters.css";
+export var ButtonFilters = function (_a) {
+    var className = _a.className, onClick = _a.onClick, title = _a.title, classIcon = _a.classIcon, sizeIcon = _a.sizeIcon, _b = _a.disabled, disabled = _b === void 0 ? false : _b, id = _a.id, dataForm = _a.dataForm, onChange = _a.onChange;
+    var buttonRef = useRef(null);
+    var _c = useState(false), openFilters = _c[0], setOpenFilters = _c[1];
+    var handleClick = function (e) {
+        e.preventDefault();
+        setOpenFilters(!openFilters);
+        if (onClick) {
+            onClick(e);
+        }
+    };
+    var handleClickOutside = useCallback(function (event) {
+        if (buttonRef.current &&
+            !buttonRef.current.contains(event.target)) {
+            setOpenFilters(false);
+        }
+    }, [setOpenFilters]);
+    useEffect(function () {
+        if (openFilters) {
+            document.addEventListener("mousedown", handleClickOutside);
+        }
+        else {
+            document.removeEventListener("mousedown", handleClickOutside);
+        }
+        return function () {
+            document.removeEventListener("mousedown", handleClickOutside);
+        };
+    }, [openFilters, handleClickOutside]);
+    return (_jsx(_Fragment, { children: _jsxs("button", __assign({ ref: buttonRef, id: id !== null && id !== void 0 ? id : "", disabled: disabled, type: "button", onClick: function (e) { return handleClick(e); }, className: " ".concat(className, " button--filters button--transparent ") }, { children: [classIcon && (_jsx("span", { children: _jsx(Icon, { classIcon: classIcon, size: sizeIcon || IconSizeEnum.EXTRA_SMALL }) })), _jsx("span", __assign({ className: " flex-1" }, { children: title })), openFilters && (_jsx("div", __assign({ className: "button--filters-overlay", onClick: function (e) { return e.stopPropagation(); } }, { children: _jsx("div", __assign({ className: "button--filters-overlay-content" }, { children: _jsx(DynamicForm, { onChange: onChange, initialForm: dataForm, hideSubmit: true }) })) })))] })) }));
+};

package/dist/card/Card.js

@@ -0,0 +1,57 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useCallback, useState } from "react";
+import { Icon } from "../icon/Icon";
+import "./card.css";
+import { CardAction } from "./cardAction/CardAction";
+// Composant Card modifié
+export var Card = function (_a) {
+    var item = _a.item, actions = _a.actions, className = _a.className, handleClick = _a.handleClick, onClose = _a.onClose, customAction = _a.customAction, positionOverlay = _a.positionOverlay, children = _a.children;
+    var _b = useState(false), cliqueAction = _b[0], setCliqueAction = _b[1];
+    var _c = useState(false), openActions = _c[0], setOpenActions = _c[1];
+    var _d = useState(), positions = _d[0], setPositions = _d[1];
+    var onClickClose = function (e, item) {
+        e.stopPropagation();
+        if (onClose) {
+            onClose(item);
+        }
+    };
+    var onClickCard = useCallback(function (e, item) {
+        e.stopPropagation();
+        if (openActions) {
+            setPositions(undefined);
+            return setOpenActions(false);
+        }
+        if (e.target.closest(".qte") ||
+            e.target.closest(".card-action-menu button") ||
+            e.target.closest(".card-actions")) {
+            return; // Ne propage pas l'événement si le clic est dans Quantity
+        }
+        setCliqueAction(!cliqueAction);
+        if (handleClick && e.button !== 2) {
+            handleClick(item);
+        }
+        else {
+            setPositions({ top: e.clientY, left: e.clientX });
+            setOpenActions(true);
+        }
+    }, [
+        setCliqueAction,
+        setPositions,
+        handleClick,
+        openActions,
+        setOpenActions,
+        cliqueAction,
+    ]);
+    return (_jsxs("div", __assign({ onContextMenu: function (e) { return e.preventDefault(); }, onMouseDown: function (e) { return onClickCard(e, item); }, className: "card ".concat(className !== null && className !== void 0 ? className : "", " ").concat(cliqueAction ? "card--active" : "", " ") }, { children: [children, !children && (_jsxs(_Fragment, { children: [_jsxs("div", __assign({ className: "card-text d-flex" }, { children: [item.image && (_jsx("div", __assign({ className: "card-img" }, { children: _jsx("img", { src: item.image, alt: "card-image" }) }))), item.title && _jsx("div", __assign({ className: "card-title" }, { children: item.title })), item.description && (_jsx("div", __assign({ className: "card-content" }, { children: item.description })))] })), _jsxs("div", __assign({ className: "card-footer" }, { children: [customAction && (_jsx("div", __assign({ className: "card-custom-action" }, { children: customAction }))), _jsx("div", __assign({ className: "d-flex flex-1 align-items-center" }, { children: item.prix && _jsx("div", __assign({ className: "card-prix" }, { children: item.prix })) }))] })), onClose && (_jsx("div", __assign({ className: "ml-2 cursor-pointer", onClick: function (e) { return onClickClose(e, item); } }, { children: _jsx(Icon, { classIcon: "bi-trash3" }) }))), actions && (_jsx(CardAction, { openActions: openActions, setOpenActions: setOpenActions, actions: actions, item: item, positions: positions, positionOverlay: positionOverlay }))] }))] })));
+};

package/dist/card/Card.view.js

@@ -0,0 +1,60 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useCallback, useEffect, useMemo, useState } from "react";
+import { Grid } from "../grid/Grid";
+import { Quantity } from "../quantity/Quantity";
+import { Card } from "./Card";
+export var CardView = function () {
+    var _a = useState([]), actions = _a[0], setActions = _a[1];
+    var mockItems = [
+        {
+            title: "Client",
+            image: "https://www.papapiqueetmamancoud.fr/media/cache/app_product_small_thumbnail_listing_cropped/41/a2/e90184ab12b765859580b529d2ec.jpg",
+            description: "Description 1",
+            prix: "59.18 €",
+            quantity: 12,
+        },
+        {
+            title: "Produits",
+            prix: "59.18 €",
+            quantity: 1,
+        },
+        {
+            title: "Total",
+            description: "Description 3",
+            quantity: 1,
+        },
+    ];
+    var actionsCard = useMemo(function () {
+        return [
+            {
+                icon: "bi-trash3",
+                label: "Supprimer la transaction",
+                type: "menu",
+                onClick: function (item) { return console.log(item); },
+            },
+            {
+                icon: "bi-trash3",
+                label: "Editer la transaction",
+                type: "menu",
+                onClick: function (item) { return console.log(item); },
+            },
+            {
+                icon: "bi-pencil",
+                label: "Editer",
+                onClick: function (item) { return console.log(item); },
+            },
+        ];
+    }, []);
+    var setQuantity = useCallback(function (item, qte) {
+        console.log(qte, item);
+    }, []);
+    useEffect(function () {
+        var initActions = mockItems.map(function (item) {
+            return {
+                children: (_jsx(Card, { className: "card--horizontal", item: item, actions: actionsCard, customAction: _jsx(Quantity, { pas: 1, item: item, setQuantity: setQuantity }) })),
+            };
+        });
+        setActions(initActions);
+    }, [setActions, setQuantity]);
+    return _jsx(Grid, { items: actions });
+};

package/dist/card/card.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/card/cardAction/CardAction.js

@@ -0,0 +1,66 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { Button } from "../../button/Button";
+import { Icon } from "../../icon/Icon";
+import { IconSizeEnum } from "../../icon/iconSize.enum";
+import { Menus } from "../../menus/Menus";
+import { OverlayPanel } from "../../overlayPanel/OverlayPanel";
+import "./cardAction.css";
+export var CardAction = function (_a) {
+    var actions = _a.actions, openActions = _a.openActions, item = _a.item, positions = _a.positions, positionOverlay = _a.positionOverlay, setOpenActions = _a.setOpenActions;
+    var overlaypanelRef = useRef(null);
+    var _b = useState(positionOverlay), position = _b[0], setPosition = _b[1];
+    var refButton = useRef(null);
+    var _c = useState(openActions !== null && openActions !== void 0 ? openActions : false), openOverlay = _c[0], setOpenOverlay = _c[1];
+    useEffect(function () {
+        if (openActions) {
+            setOpenOverlay(openActions);
+        }
+    }, [openActions]);
+    var handleChangeOverlay = useCallback(function (e, openOverlay) {
+        if (actions.length === 0)
+            return;
+        e.preventDefault();
+        setPosition("bottomRight");
+        if (setOpenActions) {
+            setOpenActions(openOverlay);
+        }
+    }, [setPosition, setOpenActions]);
+    var closeOverlay = useCallback(function () {
+        setPosition(undefined);
+        setOpenOverlay(false);
+        if (setOpenActions) {
+            setOpenActions(false);
+        }
+    }, [setOpenOverlay, setPosition, setOpenActions]);
+    var overlayMenu = useMemo(function () {
+        return actions === null || actions === void 0 ? void 0 : actions.filter(function (a) { return a.type === "menu"; }).map(function (a, index) {
+            var label = a.label || "";
+            if (a.setLabel && item) {
+                label = a.setLabel(item);
+            }
+            return {
+                id: index,
+                icon: a.icon,
+                name: a.label,
+                children: (_jsx(Button, { classIcon: a.icon, disabled: item && a.disabled ? a.disabled(item) : false, sizeIcon: IconSizeEnum.LARGE, onClick: function (e) {
+                        e.stopPropagation();
+                        closeOverlay();
+                        a.onClick && item && a.onClick(item);
+                    }, title: label }, index)),
+            };
+        });
+    }, [actions]);
+    return (_jsxs("div", __assign({ className: "card-actions" }, { children: [_jsxs("div", __assign({ ref: refButton, className: "card-action ".concat(actions.filter(function (a) { return a.type === "menu"; }).length ? "visible" : "hidden"), onClick: function (e) { return handleChangeOverlay(e, !openOverlay); } }, { children: [_jsx(Icon, { size: IconSizeEnum.MEDIUM, classIcon: "bi-three-dots-vertical cursor-pointer" }), _jsx(Icon, { size: IconSizeEnum.MEDIUM, classIcon: "bi-three-dots cursor-pointer" })] })), openOverlay && refButton.current && (_jsx(OverlayPanel, { position: position, show: openOverlay, ref: overlaypanelRef, closeOverlay: closeOverlay, coordonnees: positions, referenceElement: refButton.current, children: _jsx("div", { children: _jsx(Menus, { className: "card-action-menu", items: overlayMenu }) }) }))] })));
+};

package/dist/card/cardAction.interface.js

@@ -0,0 +1 @@
+export {};

package/dist/card/hook/useCardInteractions.js

@@ -0,0 +1,25 @@
+import { useEffect, useRef, useState } from "react";
+// Hook personnalisé pour détecter les clics en dehors et le survol
+export var useCardInteractions = function (callback) {
+    var ref = useRef(null);
+    var _a = useState(false), isHovered = _a[0], setIsHovered = _a[1];
+    useEffect(function () {
+        var handleClickOutside = function (event) {
+            if (ref.current && !ref.current.contains(event.target)) {
+                callback();
+            }
+        };
+        document.addEventListener("mousedown", handleClickOutside);
+        return function () {
+            document.removeEventListener("mousedown", handleClickOutside);
+        };
+    }, [callback]);
+    var mouseHandlers = {
+        onMouseEnter: function () { return setIsHovered(true); },
+        onMouseLeave: function () {
+            setIsHovered(false);
+            callback(); // Déclenche le callback quand la souris quitte la carte
+        },
+    };
+    return { ref: ref, isHovered: isHovered, mouseHandlers: mouseHandlers };
+};

package/dist/carousel/Carousel.js

@@ -0,0 +1,67 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React, { useCallback, useEffect, useState } from "react";
+import { Icon } from "../icon/Icon";
+import "./Carousel.css";
+export var Carousel = function (_a) {
+    var children = _a.children, _b = _a.showControls, showControls = _b === void 0 ? true : _b, _c = _a.itemsToScroll, itemsToScroll = _c === void 0 ? 1 : _c, _d = _a.breakpoints, breakpoints = _d === void 0 ? {
+        sm: 2,
+        md: 3,
+        lg: 4,
+        xl: 5,
+    } : _d;
+    var _e = useState(0), currentIndex = _e[0], setCurrentIndex = _e[1];
+    var totalItems = children.length;
+    var _f = useState(1), itemsToShow = _f[0], setItemsToShow = _f[1];
+    useEffect(function () {
+        var updateItemsToShow = function () {
+            var width = window.innerWidth;
+            if (breakpoints.xl && width >= 1200) {
+                return setItemsToShow(breakpoints.xl);
+            }
+            if (breakpoints.lg && width >= 992) {
+                return setItemsToShow(breakpoints.lg);
+            }
+            if (breakpoints.md && width >= 768) {
+                return setItemsToShow(breakpoints.md);
+            }
+            if (breakpoints.sm && width >= 576) {
+                return setItemsToShow(breakpoints.sm);
+            }
+        };
+        updateItemsToShow();
+        window.addEventListener("resize", updateItemsToShow);
+        return function () { return window.removeEventListener("resize", updateItemsToShow); };
+    }, [breakpoints]);
+    var nextSlide = useCallback(function (e) {
+        e.preventDefault();
+        setCurrentIndex(function (prevIndex) {
+            return Math.min(prevIndex + itemsToScroll, totalItems - itemsToShow);
+        });
+    }, [setCurrentIndex]);
+    var prevSlide = useCallback(function (e) {
+        e.preventDefault();
+        setCurrentIndex(function (prevIndex) { return Math.max(prevIndex - itemsToScroll, 0); });
+    }, [setCurrentIndex]);
+    var isNextDisabled = currentIndex + itemsToScroll >= totalItems - itemsToShow + 1;
+    var allItemsVisible = totalItems <= itemsToShow;
+    var isPrevDisabled = currentIndex <= 0;
+    return (_jsxs("div", __assign({ className: "carousel" }, { children: [showControls && !allItemsVisible && (_jsx("div", __assign({ className: "carousel-control prev ".concat(isPrevDisabled && "disabled"), onClick: prevSlide }, { children: _jsx(Icon, { classIcon: "bi-chevron-left" }) }))), _jsx("div", __assign({ className: "carousel-container" }, { children: _jsx("div", __assign({ className: "carousel-slides-wrapper", style: {
+                        display: "flex",
+                        transform: "translateX(-".concat((currentIndex * 100) / itemsToShow, "%)"),
+                        transition: "transform 0.5s ease-in-out",
+                    } }, { children: React.Children.map(children, function (child) { return (_jsx("div", __assign({ className: "carousel-slide", style: {
+                            minWidth: "".concat(100 / itemsToShow, "%"),
+                            boxSizing: "border-box",
+                        } }, { children: child }))); }) })) })), showControls && !allItemsVisible && (_jsx("div", __assign({ className: "carousel-control next ".concat(isNextDisabled && "disabled"), onClick: nextSlide }, { children: _jsx(Icon, { classIcon: "bi-chevron-right" }) })))] })));
+};

package/dist/carousel/Carousel.view.js

@@ -0,0 +1,16 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Carousel } from "./Carousel";
+export var CarouselView = function () {
+    return (_jsxs(Carousel, __assign({ showControls: true }, { children: [_jsx("div", __assign({ style: { background: "red" } }, { children: "Slide 1" })), _jsx("div", __assign({ style: { background: "blue" } }, { children: "Slide 2" })), _jsx("div", __assign({ style: { background: "green" } }, { children: "Slide 3" })), _jsx("div", __assign({ style: { background: "orange" } }, { children: "Slide 4" })), _jsx("div", __assign({ style: { background: "purple" } }, { children: "Slide 5" }))] })));
+};

package/dist/damier/Damier.js

@@ -0,0 +1,48 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useMemo, useState } from "react";
+import "./damier.css";
+import { DamierCell } from "./damierCell/DamierCell";
+export var Damier = function (_a) {
+    var cols = _a.cols, rows = _a.rows, _b = _a.damierCells, damierCells = _b === void 0 ? [] : _b, _c = _a.page, page = _c === void 0 ? 1 : _c, onClick = _a.onClick;
+    var nbCols = useMemo(function () { return cols !== null && cols !== void 0 ? cols : 9; }, [cols]);
+    var nbRows = useMemo(function () { return Math.max(1, rows !== null && rows !== void 0 ? rows : 9); }, [rows]);
+    var _d = useState(1), currentPage = _d[0], setCurrentPage = _d[1];
+    useEffect(function () {
+        setCurrentPage(page);
+    }, [page]);
+    // Génération des cases du damier
+    var grid = useMemo(function () {
+        var rowsArray = [];
+        for (var row = 0; row < nbRows; row++) {
+            var colsArray = [];
+            var _loop_1 = function (col) {
+                var position = col + row * nbCols;
+                var cell = damierCells === null || damierCells === void 0 ? void 0 : damierCells.find(function (cell) { return cell.position === position + 1; });
+                if (!cell) {
+                    colsArray.push(_jsx("div", { className: "cell cell--empty" }, "".concat(row, "-").concat(col)));
+                }
+                else {
+                    colsArray.push(_jsx(DamierCell, { onClick: onClick, cell: cell }, "".concat(row, "-").concat(col)));
+                }
+            };
+            for (var col = 0; col < nbCols; col++) {
+                _loop_1(col);
+            }
+            rowsArray.push(_jsx("div", __assign({ className: "row" }, { children: colsArray }), row));
+        }
+        return rowsArray;
+    }, [nbCols, nbRows, currentPage]);
+    var damierStyle = useMemo(function () { return ({ "--rows": String(nbRows) }); }, [nbRows]);
+    return (_jsx("div", __assign({ className: "damier", style: damierStyle }, { children: grid })));
+};