kelt-ui-kit-react 1.8.5 → 1.9.0

package/dist/form/Form.js

@@ -0,0 +1,135 @@
+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 { forwardRef, useCallback, useImperativeHandle, useRef, useState, } from "react";
+import { Button } from "../button/Button";
+import { Icon } from "../icon/Icon";
+import { Select } from "../select/Select"; // <--- ton composant
+import "./form.css";
+import { Input } from "./input/Input";
+import { TextArea } from "./textArea/TextArea";
+export var DynamicForm = forwardRef(function (_a, ref) {
+    var initialForm = _a.initialForm, title = _a.title, onSubmit = _a.onSubmit, id = _a.id, children = _a.children, autoComplete = _a.autoComplete, onChange = _a.onChange, hideSubmit = _a.hideSubmit, _b = _a.disabledSubmit, disabledSubmit = _b === void 0 ? false : _b, className = _a.className;
+    var _c = useState(disabledSubmit), btnDisabledSubmit = _c[0], setBtnDisabledSubmit = _c[1];
+    var _d = useState(function () {
+        var initialValues = {};
+        initialForm.forEach(function (field) {
+            var _a;
+            initialValues[field.name] = (_a = field.value) !== null && _a !== void 0 ? _a : "";
+        });
+        return initialValues;
+    }), values = _d[0], setValues = _d[1];
+    var inputRefs = useRef({});
+    /** Gestion des <input> */
+    var handleChangeInput = useCallback(function (event, forminterface) {
+        var _a = event.target, name = _a.name, type = _a.type, checked = _a.checked, value = _a.value;
+        var newValue = type === "checkbox" ? checked : value;
+        if (forminterface.onChange) {
+            forminterface.onChange(newValue, name);
+        }
+        setValues(function (prevValues) {
+            var _a;
+            var updatedValues = __assign(__assign({}, prevValues), (_a = {}, _a[name] = newValue, _a));
+            if (onChange) {
+                onChange(updatedValues);
+            }
+            return updatedValues;
+        });
+    }, [onChange]);
+    var handleChangeTextArea = useCallback(function (name, value, forminterface) {
+        if (forminterface.onChange) {
+            forminterface.onChange(value, name);
+        }
+        setValues(function (prevValues) {
+            var _a;
+            var updatedValues = __assign(__assign({}, prevValues), (_a = {}, _a[name] = value, _a));
+            if (onChange) {
+                onChange(updatedValues);
+            }
+            return updatedValues;
+        });
+    }, [onChange]);
+    /** Gestion des <select> */
+    var handleChangeSelect = useCallback(function (newValue, name, forminterface) {
+        if (forminterface.onChange) {
+            forminterface.onChange(newValue, name);
+        }
+        setValues(function (prevValues) {
+            var _a;
+            var updatedValues = __assign(__assign({}, prevValues), (_a = {}, _a[name] = newValue, _a));
+            if (onChange)
+                onChange(updatedValues);
+            return updatedValues;
+        });
+    }, [onChange]);
+    var handleSubmit = useCallback(function (e) {
+        e.preventDefault();
+        if (onSubmit) {
+            onSubmit(values);
+        }
+    }, [onSubmit, values]);
+    var resetForm = function () {
+        setValues(function () {
+            var resetValues = {};
+            initialForm.forEach(function (field) {
+                var _a;
+                resetValues[field.name] = (_a = field.value) !== null && _a !== void 0 ? _a : "";
+            });
+            return resetValues;
+        });
+    };
+    var clearInput = useCallback(function (name) {
+        setValues(function (prevValues) {
+            var _a;
+            return (__assign(__assign({}, prevValues), (_a = {}, _a[name] = "", _a)));
+        });
+    }, []);
+    var focusInitialElement = function () {
+        var focusedField = initialForm.find(function (field) { return field.focus; });
+        if (focusedField && inputRefs.current[focusedField.name]) {
+            setTimeout(function () {
+                var _a;
+                (_a = inputRefs.current[focusedField.name]) === null || _a === void 0 ? void 0 : _a.select();
+            }, 500);
+        }
+    };
+    var getValues = function () { return values; };
+    var updateFormValue = function (values) {
+        setValues(function (prevValues) { return (__assign(__assign({}, prevValues), values)); });
+    };
+    useImperativeHandle(ref, function () { return ({
+        resetForm: resetForm,
+        clearInput: clearInput,
+        focusInitialElement: focusInitialElement,
+        getValues: getValues,
+        updateFormValue: updateFormValue,
+        setBtnDisabledSubmit: setBtnDisabledSubmit,
+    }); });
+    return (_jsxs("form", __assign({ autoComplete: autoComplete !== null && autoComplete !== void 0 ? autoComplete : "off", onSubmit: handleSubmit, className: className !== null && className !== void 0 ? className : "" }, { children: [_jsxs("div", __assign({ className: "form-content" }, { children: [initialForm.map(function (v, key) {
+                        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+                        var required = v.onRequired
+                            ? v.onRequired(v.value)
+                            : (_a = v.required) !== null && _a !== void 0 ? _a : false;
+                        var disabled = v.onDisabled
+                            ? v.onDisabled(v.value)
+                            : (_b = v.disabled) !== null && _b !== void 0 ? _b : false;
+                        return (_jsxs("div", __assign({ className: "d-flex flex-column ".concat((_c = v.className) !== null && _c !== void 0 ? _c : "", " form-group form-group-").concat(v.type) }, { children: [v.label && _jsx("label", { children: v.label }), v.icon && _jsx(Icon, { classIcon: v.icon }), v.type === "select" ? (_jsx(Select, { id: (_d = v.id) !== null && _d !== void 0 ? _d : v.name, label: undefined, name: v.name, options: (_e = v.options) !== null && _e !== void 0 ? _e : [], disabled: disabled, multiple: v.multiple, value: values[v.name], required: required, defaultValue: v.value, placeholder: v.placeholder, onChangeMultiple: function (newValue) {
+                                        return handleChangeSelect(newValue, v.name, v);
+                                    }, onChange: function (newValue) {
+                                        return handleChangeSelect(newValue, v.name, v);
+                                    } })) : v.type === "textarea" ? (_jsx(TextArea, { id: (_f = v.id) !== null && _f !== void 0 ? _f : v.name, name: v.name, className: "textarea-input", placeholder: (_g = v.placeholder) !== null && _g !== void 0 ? _g : "", disabled: disabled, required: required, value: values[v.name], onChange: function (value, name) {
+                                        return handleChangeTextArea(name, value, v);
+                                    } })) : (_jsx(Input, { id: (_h = v.id) !== null && _h !== void 0 ? _h : v.name, ref: function (el) { return (inputRefs.current[v.name] = el); }, name: v.name, type: v.type, placeholder: (_j = v.placeholder) !== null && _j !== void 0 ? _j : "", autoComplete: v.autoComplete, tabIndex: 0, disabled: disabled, autoFocus: (_k = v.focus) !== null && _k !== void 0 ? _k : false, required: required, step: (_l = v.step) !== null && _l !== void 0 ? _l : "0.01", value: values[v.name], checked: v.type === "checkbox" ? !!values[v.name] : undefined, onChange: function (e) {
+                                        return handleChangeInput(e, v);
+                                    }, onInvalid: v.onInvalid ? v.onInvalid : undefined }))] }), key));
+                    }), children] })), _jsx("div", __assign({ className: "d-flex justify-content-end form-footer" }, { children: !hideSubmit && (_jsx(Button, { id: "button-".concat(id), disabled: btnDisabledSubmit, title: title || "submit" })) }))] })));
+});

package/dist/form/Form.view.js

@@ -0,0 +1,50 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { DynamicForm } from "./Form";
+import { TypeInputEnum } from "./form.enum";
+export var FormView = function () {
+    var initialValues = [
+        {
+            value: "Alexandre",
+            label: "Nom",
+            focus: true,
+            name: "nom",
+            type: TypeInputEnum.PASSWORD,
+            required: true,
+        },
+        {
+            value: 30,
+            label: "Age",
+            name: "age",
+            type: TypeInputEnum.NUMBER,
+        },
+        {
+            value: false,
+            name: "validate",
+            label: "Validate",
+            type: TypeInputEnum.CHECKBOX,
+        },
+        {
+            value: "password",
+            name: "password",
+            label: "Password",
+            type: TypeInputEnum.PASSWORD,
+        },
+        {
+            value: "",
+            name: "selectOption",
+            label: "Select Option",
+            placeholder: "Choose an option",
+            type: TypeInputEnum.SELECT,
+            options: [
+                { value: "option1", label: "Option 1" },
+                { value: "option2", label: "Option 2" },
+                { value: "option3", label: "Option 3" },
+            ],
+        },
+    ];
+    // Fonction qui sera appelée lors de la soumission du formulaire
+    var handleSubmit = function (values) {
+        console.log("Form Submitted: ", values);
+    };
+    return _jsx(DynamicForm, { onSubmit: handleSubmit, initialForm: initialValues });
+};

package/dist/form/form.enum.js

@@ -0,0 +1,14 @@
+export var TypeInputEnum;
+(function (TypeInputEnum) {
+    TypeInputEnum["TEXT"] = "text";
+    TypeInputEnum["BUTTON"] = "button";
+    TypeInputEnum["EMAIL"] = "email";
+    TypeInputEnum["HIDDEN"] = "hidden";
+    TypeInputEnum["PASSWORD"] = "password";
+    TypeInputEnum["NUMBER"] = "number";
+    TypeInputEnum["CHECKBOX"] = "checkbox";
+    TypeInputEnum["RADIO"] = "radio";
+    TypeInputEnum["DATE"] = "date";
+    TypeInputEnum["SELECT"] = "select";
+    TypeInputEnum["TEXTAREA"] = "textarea";
+})(TypeInputEnum || (TypeInputEnum = {}));

package/dist/form/form.interface.js

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

package/dist/form/input/Input.js

@@ -0,0 +1,26 @@
+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 { forwardRef, useState } from "react";
+import { Icon } from "../../icon/Icon";
+import { TypeInputEnum } from "../form.enum";
+import "./input.css";
+export var Input = forwardRef(function (_a, ref) {
+    var id = _a.id, name = _a.name, _b = _a.type, type = _b === void 0 ? TypeInputEnum.TEXT : _b, value = _a.value, onInvalid = _a.onInvalid, placeholder = _a.placeholder, className = _a.className, inputMode = _a.inputMode, minLength = _a.minLength, maxLength = _a.maxLength, _c = _a.autoFocus, autoFocus = _c === void 0 ? false : _c, _d = _a.disabled, disabled = _d === void 0 ? false : _d, _e = _a.required, required = _e === void 0 ? false : _e, autoComplete = _a.autoComplete, _f = _a.tabIndex, tabIndex = _f === void 0 ? 0 : _f, step = _a.step, checked = _a.checked, onChange = _a.onChange, onBlur = _a.onBlur, onClick = _a.onClick, handleKeyDown = _a.handleKeyDown;
+    // Si le type est password, on utilise l'input de type password
+    var _g = useState(false), showPassword = _g[0], setShowPassword = _g[1];
+    return (_jsxs("div", __assign({ className: "input-container ".concat("input-container-".concat(type), " ") }, { children: [_jsx("input", { name: "hide-".concat(name), type: "text", style: { display: "none" } }), _jsx("input", { ref: ref, id: id, name: name, inputMode: inputMode !== null && inputMode !== void 0 ? inputMode : (type === "number" ? "numeric" : "text"), type: showPassword ? TypeInputEnum.TEXT : type, spellCheck: "false", value: value, placeholder: placeholder, disabled: disabled, required: required, autoComplete: autoComplete !== null && autoComplete !== void 0 ? autoComplete : "new-password", step: step, tabIndex: tabIndex, autoFocus: autoFocus, minLength: minLength, maxLength: maxLength, onChange: onChange, checked: checked, onKeyDown: handleKeyDown, onBlur: onBlur, onClick: function (e) {
+                    e.stopPropagation();
+                    onClick && onClick(e);
+                }, className: "input-field ".concat(className !== null && className !== void 0 ? className : ""), onInvalid: onInvalid }), type === TypeInputEnum.PASSWORD && (_jsx("div", __assign({ onClick: function () { return setShowPassword(!showPassword); }, className: "input-password-icon" }, { children: _jsx(Icon, { classIcon: showPassword ? "bi-eye-slash" : "bi-eye" }) })))] })));
+});
+Input.displayName = "Input";

package/dist/form/inputNumber/InputNumber.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 } from "react/jsx-runtime";
+import { forwardRef, useCallback } from "react";
+import { TypeInputEnum } from "../form.enum";
+import "../input/input.css";
+export var InputNumber = forwardRef(function (_a, ref) {
+    var id = _a.id, name = _a.name, _b = _a.value, value = _b === void 0 ? "" : _b, placeholder = _a.placeholder, className = _a.className, _c = _a.disabled, disabled = _c === void 0 ? false : _c, _d = _a.required, required = _d === void 0 ? false : _d, _e = _a.autoFocus, autoFocus = _e === void 0 ? false : _e, _f = _a.maxLength, maxLength = _f === void 0 ? 10 : _f, _g = _a.autoComplete, autoComplete = _g === void 0 ? "off" : _g, _h = _a.tabIndex, tabIndex = _h === void 0 ? 0 : _h, _j = _a.inputMode, inputMode = _j === void 0 ? "numeric" : _j, pattern = _a.pattern, onChange = _a.onChange, onBlur = _a.onBlur, onClick = _a.onClick, onKeyDown = _a.onKeyDown, onFocus = _a.onFocus;
+    var handleChange = useCallback(function (e) {
+        var newValue = e.target.value.replace(",", ".");
+        // ✅ Autoriser les chiffres, . , et - (mais - seulement au début)
+        if (!/^-?\d*[.,]?\d*$/.test(newValue) && newValue !== "") {
+            return; // saisie invalide → on ignore
+        }
+        // ✅ Empêcher plus de maxLength
+        if (maxLength && newValue.length > maxLength) {
+            return;
+        }
+        onChange === null || onChange === void 0 ? void 0 : onChange(e, newValue);
+    }, [onChange, maxLength]);
+    var handleKeyDown = function (e) {
+        var _a;
+        if (onKeyDown) {
+            onKeyDown(e);
+        }
+        // ✅ Autoriser chiffres, contrôle, ., , et -
+        var allowed = /[0-9]|Backspace|Delete|ArrowLeft|ArrowRight|Tab|Enter|Home|End/.test(e.key) ||
+            e.key === "." ||
+            e.key === "," ||
+            e.key === "-";
+        if (!allowed) {
+            e.preventDefault();
+            return;
+        }
+        // ❌ Interdire plusieurs "-" ou "-" ailleurs que début
+        if (e.key === "-") {
+            var cursorPos = (_a = e.target.selectionStart) !== null && _a !== void 0 ? _a : 0;
+            if (cursorPos !== 0 || value.includes("-")) {
+                e.preventDefault();
+            }
+        }
+    };
+    return (_jsx("div", __assign({ className: "input-container input-container-number" }, { children: _jsx("input", { ref: ref, id: id, name: name, type: TypeInputEnum.TEXT, value: value, placeholder: placeholder, disabled: disabled, required: required, autoFocus: autoFocus, autoComplete: autoComplete, pattern: pattern, tabIndex: tabIndex, inputMode: inputMode, spellCheck: "false", className: "input-field ".concat(className !== null && className !== void 0 ? className : ""), onChange: handleChange, onWheel: function (e) { return e.currentTarget.blur(); }, onKeyDown: handleKeyDown, onFocus: onFocus, onBlur: onBlur, onClick: function (e) {
+                e.stopPropagation();
+                onClick === null || onClick === void 0 ? void 0 : onClick(e);
+            } }) })));
+});
+InputNumber.displayName = "InputNumber";

package/dist/form/inputNumber/InputNumber.view.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useState } from "react";
+import { InputNumber } from "./InputNumber";
+export var InputNumberView = function () {
+    var _a = useState(""), value = _a[0], setValue = _a[1];
+    return (_jsx(InputNumber, { id: "input-number-example", name: "inputNumber", placeholder: "Enter a number", value: value, onChange: function (e) { return setValue(e.target.value); } }));
+};

package/dist/form/inputPrice/InputPrice.js

@@ -0,0 +1,36 @@
+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);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef, useCallback } from "react";
+import { InputNumber } from "../inputNumber/InputNumber";
+export var InputPrice = forwardRef(function (_a, ref) {
+    var _b = _a.value, value = _b === void 0 ? "" : _b, _c = _a.locale, locale = _c === void 0 ? "fr-FR" : _c, _d = _a.currency, currency = _d === void 0 ? "EUR" : _d, _e = _a.allowDecimals, allowDecimals = _e === void 0 ? true : _e, onChange = _a.onChange, props = __rest(_a, ["value", "locale", "currency", "allowDecimals", "onChange"]);
+    var handleBlur = useCallback(function () {
+        if (onChange) {
+            var newValue = value.replace(",", ".");
+            onChange(parseFloat(newValue || "0").toFixed(2));
+        }
+    }, [onChange, value]);
+    return (_jsx(InputNumber, __assign({}, props, { ref: ref, pattern: "[0-9]*[.,]?[0-9]*", inputMode: "decimal" // mobile keyboard adaptatif
+        , value: value !== null && value !== void 0 ? value : "", onChange: function (e) { return onChange === null || onChange === void 0 ? void 0 : onChange(e.target.value); }, onBlur: handleBlur })));
+});

package/dist/form/inputPrice/InputPrice.view.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useState } from "react";
+import { InputPrice } from "./InputPrice";
+export var InputPriceView = function () {
+    var _a = useState(""), value = _a[0], setValue = _a[1];
+    return (_jsx(InputPrice, { id: "input-price-example", name: "inputPrice", placeholder: "Enter a price", value: value, onChange: setValue }));
+};

package/dist/form/textArea/TextArea.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useCallback, useEffect, useState } from "react";
+import "./textArea.css";
+export var TextArea = function (_a) {
+    var name = _a.name, id = _a.id, value = _a.value, disabled = _a.disabled, width = _a.width, className = _a.className, onChange = _a.onChange, placeholder = _a.placeholder, cols = _a.cols, rows = _a.rows, _b = _a.required, required = _b === void 0 ? false : _b;
+    var _c = useState(value), textAreaValue = _c[0], setTextAreaValue = _c[1];
+    useEffect(function () {
+        setTextAreaValue(value);
+    }, [value]);
+    var handleChange = useCallback(function (e) {
+        var newValue = e.target.value;
+        setTextAreaValue(newValue);
+        if (onChange) {
+            onChange(newValue, name);
+        }
+    }, [onChange, name]);
+    return (_jsx("textarea", { id: id, style: { width: width }, className: "form-control-textarea ".concat(className !== null && className !== void 0 ? className : ""), name: name, disabled: disabled, value: textAreaValue, onChange: handleChange, placeholder: placeholder, cols: cols, rows: rows, required: required }));
+};

package/dist/form/textArea/TextArea.view.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { TextArea } from "./TextArea";
+export var TextAreaView = function () {
+    var textAreaData = useMemo(function () { return [
+        {
+            name: "textArea",
+            value: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
+            placeholder: "Enter text here...",
+            rows: 5,
+            cols: 50,
+        },
+    ]; }, []);
+    return (_jsxs("div", { children: [_jsx("h1", { children: "TextArea" }), textAreaData.map(function (textArea, index) { return (_jsx("div", { children: _jsx(TextArea, { name: textArea.name, value: textArea.value, placeholder: textArea.placeholder, rows: textArea.rows, cols: textArea.cols }) }, index)); })] }));
+};

package/dist/grid/Grid.js

@@ -0,0 +1,19 @@
+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 { Col } from "./col/Col";
+import { Container } from "./container/Container";
+import { Row } from "./row/Row";
+export var Grid = function (_a) {
+    var items = _a.items, className = _a.className, scroll = _a.scroll;
+    return (_jsx(Container, { children: _jsx(Row, __assign({ scroll: scroll, className: className }, { children: items.map(function (item, id) { return (_jsx(Col, __assign({}, item), id)); }) })) }));
+};

package/dist/grid/Grid.view.js

@@ -0,0 +1,22 @@
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+import { Grid } from "./Grid";
+export var GridView = function () {
+    var mockItems = [
+        {
+            md: 6,
+            lg: 4,
+            children: _jsx(_Fragment, { children: "test" }),
+        },
+        {
+            md: 6,
+            lg: 4,
+            children: _jsx(_Fragment, { children: "test 2 " }),
+        },
+        {
+            md: 6,
+            lg: 4,
+            children: _jsx(_Fragment, { children: "test 3 " }),
+        },
+    ];
+    return _jsx(Grid, { items: mockItems });
+};

package/dist/grid/col/Col.js

@@ -0,0 +1,17 @@
+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 { ColStyled } from "./colStyled/ColStyled";
+export var Col = function (_a) {
+    var xs = _a.xs, sm = _a.sm, md = _a.md, lg = _a.lg, children = _a.children;
+    return (_jsx(ColStyled, __assign({ "$xs": xs, "$sm": sm, "$md": md, "$lg": lg }, { children: children })));
+};

package/dist/grid/col/colStyled/ColStyled.js

@@ -0,0 +1,26 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import styled, { css } from "styled-components";
+var getColWidth = function (size) {
+    if (size === void 0) { size = 12; }
+    return "".concat((size / 12) * 100, "%");
+};
+export var ColStyled = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  padding: 0 15px;\n  flex: 0 0 ", ";\n  max-width: ", ";\n  margin-bottom: 0.5rem;\n  margin-top: 0.5rem;\n  ", "\n\n  ", "\n\n  ", "\n"], ["\n  padding: 0 15px;\n  flex: 0 0 ", ";\n  max-width: ", ";\n  margin-bottom: 0.5rem;\n  margin-top: 0.5rem;\n  ", "\n\n  ", "\n\n  ", "\n"])), function (_a) {
+    var $xs = _a.$xs;
+    return getColWidth($xs);
+}, function (_a) {
+    var $xs = _a.$xs;
+    return getColWidth($xs);
+}, function (_a) {
+    var $sm = _a.$sm;
+    return $sm && css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      @container (min-width: 576px) {\n        flex: 0 0 ", ";\n        max-width: ", ";\n      }\n    "], ["\n      @container (min-width: 576px) {\n        flex: 0 0 ", ";\n        max-width: ", ";\n      }\n    "])), getColWidth($sm), getColWidth($sm));
+}, function (_a) {
+    var $md = _a.$md;
+    return $md && css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n      @container (min-width: 768px) {\n        flex: 0 0 ", ";\n        max-width: ", ";\n      }\n    "], ["\n      @container (min-width: 768px) {\n        flex: 0 0 ", ";\n        max-width: ", ";\n      }\n    "])), getColWidth($md), getColWidth($md));
+}, function (_a) {
+    var $lg = _a.$lg;
+    return $lg && css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n      @container (min-width: 992px) {\n        flex: 0 0 ", ";\n        max-width: ", ";\n      }\n    "], ["\n      @container (min-width: 992px) {\n        flex: 0 0 ", ";\n        max-width: ", ";\n      }\n    "])), getColWidth($lg), getColWidth($lg));
+});
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4;

package/dist/grid/container/Container.js

@@ -0,0 +1,17 @@
+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 "./container.css";
+export var Container = function (_a) {
+    var children = _a.children;
+    return (_jsx("div", __assign({ className: "container" }, { children: children })));
+};

package/dist/grid/grid.interface.js

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

package/dist/grid/row/Row.js

@@ -0,0 +1,17 @@
+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 "./row.css";
+export var Row = function (_a) {
+    var children = _a.children, className = _a.className, scroll = _a.scroll;
+    return (_jsx("div", __assign({ className: "grid-row ".concat(className !== null && className !== void 0 ? className : "", " ").concat(scroll ? "scroll" : "") }, { children: children })));
+};

package/dist/header/Header.js

@@ -0,0 +1,26 @@
+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, useRef, useState } from "react";
+import { Icon } from "../icon/Icon";
+import { IconSizeEnum } from "../icon/iconSize.enum";
+import { OverlayPanel } from "../overlayPanel/OverlayPanel";
+import "./header.css";
+export var Header = function (_a) {
+    var children = _a.children, logo = _a.logo, onClickMenu = _a.onClickMenu, userChildren = _a.userChildren, positionFixed = _a.positionFixed, onClickLogo = _a.onClickLogo, showBackNavigation = _a.showBackNavigation, onClickBackNavigation = _a.onClickBackNavigation;
+    var refButton = useRef(null);
+    var _b = useState(false), openOverlay = _b[0], setOpenOverlay = _b[1];
+    var onClickUser = useCallback(function () {
+        setOpenOverlay(!openOverlay);
+    }, [openOverlay, setOpenOverlay]);
+    return (_jsxs("div", __assign({ className: "header ".concat(positionFixed ? "header--fixed" : "") }, { children: [_jsxs("div", __assign({ className: "flex-1 d-flex align-items-center" }, { children: [_jsx("span", __assign({ onClick: onClickMenu }, { children: _jsx(Icon, { size: IconSizeEnum.MEDIUM, classIcon: "bi-list" }) })), showBackNavigation && (_jsx("span", __assign({ className: "chevron-back", onClick: onClickBackNavigation }, { children: _jsx(Icon, { size: IconSizeEnum.EXTRA_SMALL, classIcon: "bi-caret-left-fill" }) }))), _jsx("span", __assign({ className: "header-logo ".concat(onClickLogo && "cursor-pointer", " "), onClick: onClickLogo }, { children: logo && _jsx("img", { src: logo, alt: "logo" }) }))] })), _jsxs("div", __assign({ className: "d-flex align-items-center" }, { children: [children, _jsx("div", __assign({ ref: refButton, onClick: onClickUser }, { children: _jsx(Icon, { size: IconSizeEnum.MEDIUM, classIcon: "bi-person-circle" }) })), openOverlay && refButton.current && (_jsx(OverlayPanel, { position: "bottomRight", show: openOverlay, closeOverlay: setOpenOverlay, referenceElement: refButton.current, children: userChildren }))] }))] })));
+};

package/dist/header/Header.view.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Header } from "./Header";
+export var HeaderView = function () {
+    return _jsx(Header, { showBackNavigation: true });
+};

package/dist/header/header.interface.js

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

package/dist/home/Home.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export var Home = function () {
+    return _jsx("h1", { children: "Home" });
+};

package/dist/icon/Icon.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import "./icon.css";
+export var Icon = function (_a) {
+    var classIcon = _a.classIcon, size = _a.size;
+    return _jsx("i", { className: "bi ".concat(classIcon, " ").concat(size !== null && size !== void 0 ? size : "sm") });
+};

package/dist/icon/Icons.view.js

@@ -0,0 +1,27 @@
+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, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Icon } from "./Icon";
+export var IconsView = function () {
+    var mockItems = [
+        {
+            classIcon: "bi-list",
+        },
+        {
+            classIcon: "bi-person-circle",
+        },
+        {
+            classIcon: "bi-volume-mute-fill",
+        },
+    ];
+    return (_jsxs(_Fragment, { children: [_jsx("p", { children: _jsx("a", __assign({ href: "https://icons.getbootstrap.com/#usage", target: "_blank" }, { children: "Liste des icons utilisables" })) }), mockItems.map(function (item, idx) { return (_jsx(Icon, { classIcon: item.classIcon }, idx)); })] }));
+};

package/dist/icon/icon.interface.js

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

package/dist/icon/iconSize.enum.js

@@ -0,0 +1,8 @@
+export var IconSizeEnum;
+(function (IconSizeEnum) {
+    IconSizeEnum["EXTRA_SMALL"] = "xs";
+    IconSizeEnum["SMALL"] = "sm";
+    IconSizeEnum["MEDIUM"] = "md";
+    IconSizeEnum["LARGE"] = "xl";
+    IconSizeEnum["EXTRA_LARGE"] = "xxl";
+})(IconSizeEnum || (IconSizeEnum = {}));