allaw-ui 4.0.2 → 4.0.4

package/dist/components/molecules/contactCard/ContactCardEdit.d.ts

@@ -10,6 +10,10 @@ export interface ContactCardEditProps {
     hideActions?: boolean;
     controlled?: boolean;
     hasExternalChanges?: boolean;
+    clientTypeOptions?: {
+        label: string;
+        value: string;
+    }[];
     datepickerYearDropdownItemNumber?: number;
     datepickerMaxDaysInPast?: number;
     datepickerMinDate?: Date;

package/dist/components/molecules/contactCard/ContactCardEdit.js

@@ -16,7 +16,7 @@ import Select from "../../atoms/selects/Select";
 import Datepicker from "../../atoms/datepickers/Datepicker";
 import IconButton from "../../atoms/buttons/IconButton";
 var ContactCardEdit = function (_a) {
-    var name = _a.name, status = _a.status, phone = _a.phone, email = _a.email, _b = _a.clientOfStudy, clientOfStudy = _b === void 0 ? false : _b, _c = _a.officeName, officeName = _c === void 0 ? "du cabinet" : _c, birthDate = _a.birthDate, _d = _a.hideActions, hideActions = _d === void 0 ? false : _d, _e = _a.controlled, controlled = _e === void 0 ? false : _e, _f = _a.hasExternalChanges, hasExternalChanges = _f === void 0 ? false : _f, _g = _a.datepickerYearDropdownItemNumber, datepickerYearDropdownItemNumber = _g === void 0 ? 10 : _g, datepickerMaxDaysInPast = _a.datepickerMaxDaysInPast, datepickerMinDate = _a.datepickerMinDate, datepickerMaxDate = _a.datepickerMaxDate, _h = _a.datepickerDisableFutur, datepickerDisableFutur = _h === void 0 ? true : _h, externalEditData = _a.editData, onEditDataChange = _a.onEditDataChange, onSave = _a.onSave, onCancel = _a.onCancel;
+    var name = _a.name, status = _a.status, phone = _a.phone, email = _a.email, _b = _a.clientOfStudy, clientOfStudy = _b === void 0 ? false : _b, _c = _a.officeName, officeName = _c === void 0 ? "du cabinet" : _c, birthDate = _a.birthDate, _d = _a.hideActions, hideActions = _d === void 0 ? false : _d, _e = _a.controlled, controlled = _e === void 0 ? false : _e, _f = _a.hasExternalChanges, hasExternalChanges = _f === void 0 ? false : _f, clientTypeOptions = _a.clientTypeOptions, _g = _a.datepickerYearDropdownItemNumber, datepickerYearDropdownItemNumber = _g === void 0 ? 10 : _g, datepickerMaxDaysInPast = _a.datepickerMaxDaysInPast, datepickerMinDate = _a.datepickerMinDate, datepickerMaxDate = _a.datepickerMaxDate, _h = _a.datepickerDisableFutur, datepickerDisableFutur = _h === void 0 ? true : _h, externalEditData = _a.editData, onEditDataChange = _a.onEditDataChange, onSave = _a.onSave, onCancel = _a.onCancel;
     var _j = useState({
         firstName: "",
         lastName: "",
@@ -39,12 +39,13 @@ var ContactCardEdit = function (_a) {
             setInternalEditData(updater);
         }
     };
-    // Options pour les selects
-    var clientTypeOptions = [
+    // Options par défaut si non fournies
+    var defaultClientTypeOptions = [
         { label: "Client du cabinet", value: "Client du cabinet" },
         { label: "Client de l'étude", value: "Client de l'étude" },
         { label: "Contact", value: "Contact" },
     ];
+    var finalClientTypeOptions = clientTypeOptions || defaultClientTypeOptions;
     // Initialisation des données d'édition
     useEffect(function () {
         if (name && !controlled) {
@@ -129,7 +130,7 @@ var ContactCardEdit = function (_a) {
                 React.createElement("div", { className: styles.infoItem },
                     React.createElement("i", { className: "allaw-icon-user ".concat(styles.infoIcon) }),
                     React.createElement("div", { className: styles.clientTypeSelectContainer },
-                        React.createElement(Select, { items: clientTypeOptions, selectedItem: editData.clientType, placeholder: "Type de client", onChange: function (value) {
+                        React.createElement(Select, { items: finalClientTypeOptions, selectedItem: editData.clientType, placeholder: "Type de client", onChange: function (value) {
                                 return updateEditData(function (prev) { return (__assign(__assign({}, prev), { clientType: value })); });
                             } }))),
                 React.createElement("div", { className: styles.telephoneEmailItems },
@@ -141,9 +142,10 @@ var ContactCardEdit = function (_a) {
                                 }, disableAutofill: true }))),
                     React.createElement("div", { className: styles.infoItem },
                         React.createElement("i", { className: "allaw-icon-mail ".concat(styles.infoIcon) }),
-                        React.createElement(Input, { title: "", placeholder: "Email", type: "email", value: editData.email, onChange: function (value) {
-                                return updateEditData(function (prev) { return (__assign(__assign({}, prev), { email: value })); });
-                            }, disableAutofill: true })),
+                        React.createElement("div", { className: styles.emailInputContainer },
+                            React.createElement(Input, { title: "", placeholder: "Email", type: "email", value: editData.email, onChange: function (value) {
+                                    return updateEditData(function (prev) { return (__assign(__assign({}, prev), { email: value })); });
+                                }, disableAutofill: true }))),
                     birthDate && (React.createElement("div", { className: styles.infoItem },
                         React.createElement("i", { className: "allaw-icon-user ".concat(styles.infoIcon) }),
                         React.createElement(Datepicker, { value: editData.birthDate, onChange: function (date) {

package/dist/components/molecules/contactCard/contactCardEdit.module.css

@@ -107,17 +107,47 @@
   max-width: 160px;
 }
 
+.emailInputContainer {
+  width: 160px;
+  min-width: 160px;
+  max-width: 160px;
+}
+
 .clientTypeSelectContainer {
   padding-left: 0px;
   max-width: 160px;
   min-width: 160px;
 }
 
+/* Media queries pour les largeurs en fonction du viewport */
+@media (min-width: 1152px) {
+  .phoneInputContainer {
+    width: 190px;
+    min-width: 190px;
+    max-width: 190px;
+  }
+
+  .emailInputContainer {
+    width: 200px;
+    min-width: 200px;
+    max-width: 200px;
+  }
+
+  .clientTypeSelectContainer {
+    max-width: 190px;
+    min-width: 190px;
+  }
+}
+
 /* Media queries responsive */
 @media (max-width: 1000px) {
   .phoneInputContainer {
     max-width: 100%;
   }
+
+  .emailInputContainer {
+    max-width: 100%;
+  }
 }
 
 @media (max-width: 900px) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "allaw-ui",
-  "version": "4.0.2",
+  "version": "4.0.4",
   "description": "Composants UI pour l'application Allaw",
   "main": "dist/index.js",
   "module": "dist/index.esm.js",