allaw-ui 3.9.9 → 4.0.1

package/dist/components/atoms/datepickers/Datepicker.d.ts

@@ -9,6 +9,7 @@ export interface DatepickerProps {
     yearDropdownItemNumber?: number;
     maxDaysInPast?: number;
     minDate?: Date;
+    maxDate?: Date;
     disableFutur?: Boolean;
 }
 declare const Datepicker: React.FC<DatepickerProps>;

package/dist/components/atoms/datepickers/Datepicker.js

@@ -48,7 +48,7 @@ var CustomInput = forwardRef(function (_a, ref) {
 });
 CustomInput.displayName = "CustomInput";
 var Datepicker = function (_a) {
-    var value = _a.value, onChange = _a.onChange, _b = _a.placeholder, placeholder = _b === void 0 ? "Sélectionner une date" : _b, _c = _a.yearDropdownItemNumber, yearDropdownItemNumber = _c === void 0 ? 10 : _c, maxDaysInPast = _a.maxDaysInPast, minDate = _a.minDate, _d = _a.disableFutur, disableFutur = _d === void 0 ? true : _d;
+    var value = _a.value, onChange = _a.onChange, _b = _a.placeholder, placeholder = _b === void 0 ? "Sélectionner une date" : _b, _c = _a.yearDropdownItemNumber, yearDropdownItemNumber = _c === void 0 ? 10 : _c, maxDaysInPast = _a.maxDaysInPast, minDate = _a.minDate, maxDate = _a.maxDate, _d = _a.disableFutur, disableFutur = _d === void 0 ? true : _d;
     var _e = useState(value), selectedDate = _e[0], setSelectedDate = _e[1];
     var _f = useState(false), isOpen = _f[0], setIsOpen = _f[1];
     var _g = useState({ top: 0, left: 0 }), position = _g[0], setPosition = _g[1];
@@ -146,6 +146,6 @@ var Datepicker = function (_a) {
             ReactDOM.createPortal(React.createElement("div", { ref: calendarRef, className: "datepicker-portal ".concat(placement), style: __assign({ left: "".concat(position.left, "px") }, (placement === "bottom"
                     ? { top: "".concat(position.top, "px") }
                     : { top: "".concat(position.top, "px") })) },
-                React.createElement(ReactDatePicker, { selected: selectedDate, onChange: handleDateChange, locale: fr, inline: true, dateFormat: "dd MMMM yyyy", calendarClassName: "custom-calendar", showMonthDropdown: true, showYearDropdown: true, dropdownMode: "select", maxDate: disableFutur ? new Date() : undefined, minDate: calculatedMinDate })), document.body)));
+                React.createElement(ReactDatePicker, { selected: selectedDate, onChange: handleDateChange, locale: fr, inline: true, dateFormat: "dd MMMM yyyy", calendarClassName: "custom-calendar", showMonthDropdown: true, showYearDropdown: true, dropdownMode: "select", maxDate: maxDate || (disableFutur ? new Date() : undefined), minDate: calculatedMinDate })), document.body)));
 };
 export default Datepicker;

package/dist/components/atoms/datepickers/datepicker.css

@@ -29,6 +29,12 @@
   justify-content: space-between;
 }
 
+.datepicker-content i {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
 .datepicker-text {
   color: var(--Primary-Mid-black, #171e25);
   font-family: "Open Sans";

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

@@ -9,6 +9,11 @@ export interface ContactCardEditProps {
     birthDate?: Date;
     hideActions?: boolean;
     controlled?: boolean;
+    datepickerYearDropdownItemNumber?: number;
+    datepickerMaxDaysInPast?: number;
+    datepickerMinDate?: Date;
+    datepickerMaxDate?: Date;
+    datepickerDisableFutur?: boolean;
     editData?: {
         firstName: string;
         lastName: string;

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

@@ -16,8 +16,8 @@ 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, externalEditData = _a.editData, onEditDataChange = _a.onEditDataChange, onSave = _a.onSave, onCancel = _a.onCancel;
-    var _f = useState({
+    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.datepickerYearDropdownItemNumber, datepickerYearDropdownItemNumber = _f === void 0 ? 10 : _f, datepickerMaxDaysInPast = _a.datepickerMaxDaysInPast, datepickerMinDate = _a.datepickerMinDate, datepickerMaxDate = _a.datepickerMaxDate, _g = _a.datepickerDisableFutur, datepickerDisableFutur = _g === void 0 ? true : _g, externalEditData = _a.editData, onEditDataChange = _a.onEditDataChange, onSave = _a.onSave, onCancel = _a.onCancel;
+    var _h = useState({
         firstName: "",
         lastName: "",
         status: status,
@@ -25,7 +25,7 @@ var ContactCardEdit = function (_a) {
         phone: phone,
         email: email,
         birthDate: birthDate,
-    }), internalEditData = _f[0], setInternalEditData = _f[1];
+    }), internalEditData = _h[0], setInternalEditData = _h[1];
     // Utiliser les données externes si contrôlé, sinon les données internes
     var editData = controlled && externalEditData ? externalEditData : internalEditData;
     var updateEditData = function (updater) {
@@ -111,7 +111,7 @@ var ContactCardEdit = function (_a) {
                         React.createElement("i", { className: "allaw-icon-user ".concat(styles.infoIcon) }),
                         React.createElement(Datepicker, { value: editData.birthDate, onChange: function (date) {
                                 return updateEditData(function (prev) { return (__assign(__assign({}, prev), { birthDate: date })); });
-                            }, placeholder: "Date de naissance" })))))),
+                            }, placeholder: "Date de naissance", yearDropdownItemNumber: datepickerYearDropdownItemNumber, maxDaysInPast: datepickerMaxDaysInPast, minDate: datepickerMinDate, maxDate: datepickerMaxDate, disableFutur: datepickerDisableFutur })))))),
         !hideActions && (React.createElement("div", { className: styles.actionsContainer },
             React.createElement("div", { className: styles.editActionsContainer },
                 React.createElement(IconButton, { style: "largeFilled", iconName: "allaw-icon-check", onClick: handleSave, color: "#29a36a" }),

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

@@ -33,6 +33,22 @@ declare namespace _default {
             let control_6: string;
             export { control_6 as control };
         }
+        namespace datepickerYearDropdownItemNumber {
+            let control_7: string;
+            export { control_7 as control };
+        }
+        namespace datepickerMinDate {
+            let control_8: string;
+            export { control_8 as control };
+        }
+        namespace datepickerMaxDate {
+            let control_9: string;
+            export { control_9 as control };
+        }
+        namespace datepickerDisableFutur {
+            let control_10: string;
+            export { control_10 as control };
+        }
     }
     export namespace args {
         let name_1: string;

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

@@ -29,6 +29,10 @@ export default {
             },
         },
         birthDate: { control: "date" },
+        datepickerYearDropdownItemNumber: { control: "number" },
+        datepickerMinDate: { control: "date" },
+        datepickerMaxDate: { control: "date" },
+        datepickerDisableFutur: { control: "boolean" },
     },
     args: {
         name: "Jane DOE",
@@ -63,6 +67,18 @@ export var Default = Template.bind({});
 export var WithBirthDate = Template.bind({});
 WithBirthDate.args = {
     birthDate: new Date("1990-05-15"),
+    datepickerYearDropdownItemNumber: 120,
+    datepickerMinDate: (function () {
+        var date = new Date();
+        date.setFullYear(date.getFullYear() - 120);
+        return date;
+    })(),
+    datepickerMaxDate: (function () {
+        var date = new Date();
+        date.setFullYear(date.getFullYear() - 10);
+        return date;
+    })(),
+    datepickerDisableFutur: false,
 };
 export var WithoutBirthDate = Template.bind({});
 WithoutBirthDate.args = {

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

@@ -97,15 +97,15 @@
 }
 
 .phoneInputContainer {
-  width: 140px;
-  min-width: 140px;
-  max-width: 140px;
+  width: 160px;
+  min-width: 160px;
+  max-width: 160px;
 }
 
 .clientTypeSelectContainer {
   padding-left: 0px;
-  max-width: 140px;
-  min-width: 140px;
+  max-width: 160px;
+  min-width: 160px;
 }
 
 /* Media queries responsive */

package/package.json

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