mautourco-components 0.2.11 → 0.2.12

package/dist/components/organisms/DateTimePicker/DateTimePicker.d.ts

@@ -4,6 +4,8 @@ export interface DateTimePickerProps extends Partial<DateTimeProps> {
     placeholder?: string;
     disabled?: boolean;
     onValueChange?: (value: string | string[]) => void;
+    /** Default value for the date picker (format: "yyyy-MM-dd" for single, ["yyyy-MM-dd", "yyyy-MM-dd"] for range) */
+    defaultValue?: string | string[];
     /** Whether the calendar icon has full bg*/
     iconBGFull?: boolean;
     /** Position of the calendar icon: left or right */

package/dist/components/organisms/DateTimePicker/DateTimePicker.js

@@ -26,9 +26,37 @@ var formatDateRange = function (dateRange) {
     return "".concat(format(from, "dd/MM/yyyy"), " - ").concat(format(to, "dd/MM/yyyy"));
 };
 var DateTimePicker = function (_a) {
-    var _b = _a.placeholder, placeholder = _b === void 0 ? "Select date" : _b, _c = _a.disabled, disabled = _c === void 0 ? false : _c, _d = _a.mode, mode = _d === void 0 ? "both" : _d, _e = _a.selectionMode, selectionMode = _e === void 0 ? "range" : _e, _f = _a.numberOfMonths, numberOfMonths = _f === void 0 ? 2 : _f, _g = _a.disableBeforeToday, disableBeforeToday = _g === void 0 ? true : _g, _h = _a.disableToday, disableToday = _h === void 0 ? false : _h, onValueChange = _a.onValueChange, _j = _a.iconBGFull, iconBGFull = _j === void 0 ? true : _j, _k = _a.iconPosition, iconPosition = _k === void 0 ? "right" : _k, _l = _a.showChevron, showChevron = _l === void 0 ? false : _l;
-    var _m = useState(""), value = _m[0], setValue = _m[1];
-    var _o = useState(undefined), selectedDateRange = _o[0], setSelectedDateRange = _o[1];
+    var _b = _a.placeholder, placeholder = _b === void 0 ? "Select date" : _b, _c = _a.disabled, disabled = _c === void 0 ? false : _c, _d = _a.mode, mode = _d === void 0 ? "both" : _d, _e = _a.selectionMode, selectionMode = _e === void 0 ? "range" : _e, _f = _a.numberOfMonths, numberOfMonths = _f === void 0 ? 2 : _f, _g = _a.disableBeforeToday, disableBeforeToday = _g === void 0 ? true : _g, _h = _a.disableToday, disableToday = _h === void 0 ? false : _h, onValueChange = _a.onValueChange, defaultValue = _a.defaultValue, _j = _a.iconBGFull, iconBGFull = _j === void 0 ? true : _j, _k = _a.iconPosition, iconPosition = _k === void 0 ? "right" : _k, _l = _a.showChevron, showChevron = _l === void 0 ? false : _l;
+    // Parse default value and set initial state
+    var parseDefaultValue = function () {
+        if (!defaultValue)
+            return { value: "", dateRange: undefined };
+        try {
+            if (selectionMode === "range" && Array.isArray(defaultValue)) {
+                // Handle range: ["yyyy-MM-dd", "yyyy-MM-dd"]
+                var fromStr = defaultValue[0], toStr = defaultValue[1];
+                var from = new Date(fromStr);
+                var to = toStr ? new Date(toStr) : from;
+                var dateRange = { from: from, to: to };
+                var displayValue = formatDateRange(dateRange);
+                return { value: displayValue, dateRange: dateRange };
+            }
+            else if (selectionMode === "single" && typeof defaultValue === "string") {
+                // Handle single: "yyyy-MM-dd"
+                var date = new Date(defaultValue);
+                var dateRange = { from: date, to: date };
+                var displayValue = format(date, "dd/MM/yyyy");
+                return { value: displayValue, dateRange: dateRange };
+            }
+        }
+        catch (error) {
+            console.error("Error parsing default date value:", error);
+        }
+        return { value: "", dateRange: undefined };
+    };
+    var initialState = parseDefaultValue();
+    var _m = useState(initialState.value), value = _m[0], setValue = _m[1];
+    var _o = useState(initialState.dateRange), selectedDateRange = _o[0], setSelectedDateRange = _o[1];
     var _p = useState(undefined), selectedTime = _p[0], setSelectedTime = _p[1];
     var _q = useState(false), isOpen = _q[0], setIsOpen = _q[1];
     var handleDtChange = React.useCallback(function (payload) {

package/dist/components/organisms/RoundTrip/RoundTrip.js

@@ -174,6 +174,6 @@ var RoundTrip = function (_a) {
     };
     var pickupDropoffOptions = getPickupDropoffOptions();
     var accommodationOptions = getAccommodationOptions();
-    return (_jsx("div", __assign({ className: "round-trip ".concat(className), "data-round-trip-id": id }, { children: _jsxs("div", __assign({ className: "round-trip__content" }, { children: [_jsx("div", __assign({ className: "round-trip__field round-trip__field--pax" }, { children: _jsx(PaxSelector, { label: "Number of pax", value: internalPaxData, onChange: handlePaxChange, placeholder: "2 pax" }) })), _jsxs("div", __assign({ className: "round-trip__field round-trip__field--dates" }, { children: [_jsx(Text, __assign({ size: "sm", variant: "regular", className: "round-trip__field-label" }, { children: "Arrival date - Departure date" })), _jsx(DateTimePicker, { placeholder: "DD/MM/YYYY - DD/MM/YYYY", mode: "calendar", iconPosition: "left", numberOfMonths: 2, iconBGFull: false, showChevron: true, onValueChange: handleDateRangeChange, selectionMode: "range" })] })), _jsx("div", __assign({ className: "round-trip__field round-trip__field--pickup-dropoff" }, { children: _jsx(LocationDropdown, { label: "Pick up / Drop-off point", options: pickupDropoffOptions.options, groups: pickupDropoffOptions.groups, selectedValue: (internalPickupDropoffPoint === null || internalPickupDropoffPoint === void 0 ? void 0 : internalPickupDropoffPoint.id) || null, onSelectionChange: handlePickupDropoffChange, placeholder: "Select pick-up / drop-off point", direction: undefined, type: "airport-port", showGroupTitles: true }) })), _jsx("div", __assign({ className: "round-trip__field round-trip__field--accommodation" }, { children: _jsx(LocationDropdown, { label: "Accommodation", options: accommodationOptions.options, groups: accommodationOptions.groups, selectedValue: (internalAccommodation === null || internalAccommodation === void 0 ? void 0 : internalAccommodation.id) || null, onSelectionChange: handleAccommodationChange, placeholder: "Select accommodation", direction: "dropoff", type: "accommodation", showGroupTitles: false }) }))] })) })));
+    return (_jsx("div", __assign({ className: "round-trip ".concat(className), "data-round-trip-id": id }, { children: _jsxs("div", __assign({ className: "round-trip__content" }, { children: [_jsx("div", __assign({ className: "round-trip__field round-trip__field--pax" }, { children: _jsx(PaxSelector, { label: "Number of pax", value: internalPaxData, onChange: handlePaxChange, placeholder: "2 pax" }) })), _jsxs("div", __assign({ className: "round-trip__field round-trip__field--dates" }, { children: [_jsx(Text, __assign({ size: "sm", variant: "regular", className: "round-trip__field-label" }, { children: "Arrival date - Departure date" })), _jsx(DateTimePicker, { placeholder: "DD/MM/YYYY - DD/MM/YYYY", mode: "calendar", iconPosition: "left", numberOfMonths: 2, iconBGFull: false, showChevron: true, onValueChange: handleDateRangeChange, selectionMode: "range", defaultValue: arrivalDate && departureDate ? [arrivalDate, departureDate] : undefined })] })), _jsx("div", __assign({ className: "round-trip__field round-trip__field--pickup-dropoff" }, { children: _jsx(LocationDropdown, { label: "Pick up / Drop-off point", options: pickupDropoffOptions.options, groups: pickupDropoffOptions.groups, selectedValue: (internalPickupDropoffPoint === null || internalPickupDropoffPoint === void 0 ? void 0 : internalPickupDropoffPoint.id) || null, onSelectionChange: handlePickupDropoffChange, placeholder: "Select pick-up / drop-off point", direction: undefined, type: "airport-port", showGroupTitles: true }) })), _jsx("div", __assign({ className: "round-trip__field round-trip__field--accommodation" }, { children: _jsx(LocationDropdown, { label: "Accommodation", options: accommodationOptions.options, groups: accommodationOptions.groups, selectedValue: (internalAccommodation === null || internalAccommodation === void 0 ? void 0 : internalAccommodation.id) || null, onSelectionChange: handleAccommodationChange, placeholder: "Select accommodation", direction: "dropoff", type: "accommodation", showGroupTitles: false }) }))] })) })));
 };
 export default RoundTrip;

package/dist/components/organisms/TransferLine/TransferLine.js

@@ -174,6 +174,6 @@ var TransferLine = function (_a) {
         setInternalDropoffPoint(location);
         onDropoffChange === null || onDropoffChange === void 0 ? void 0 : onDropoffChange(location);
     };
-    return (_jsxs("div", __assign({ className: "transfer-line transfer-line--".concat(type, " ").concat(className), "data-transfer-id": id }, { children: [showTitle && (_jsxs("div", __assign({ className: "transfer-line__header" }, { children: [_jsx(Icon, { name: getTypeIcon(), size: "sm", className: "transfer-line__header-icon" }), _jsx(Text, __assign({ size: "sm", variant: "medium", className: "transfer-line__header-label" }, { children: getTypeLabel() }))] }))), _jsxs("div", __assign({ className: "transfer-line__content-container" }, { children: [_jsxs("div", __assign({ className: "transfer-line__content" }, { children: [_jsx("div", __assign({ className: "transfer-line__field transfer-line__field--pax" }, { children: _jsx(PaxSelector, { label: "Number of pax", value: internalPaxData, onChange: handlePaxChange, placeholder: "2 pax" }) })), _jsxs("div", __assign({ className: "transfer-line__field transfer-line__field--date" }, { children: [_jsx(Text, __assign({ size: "sm", variant: "regular", className: "transfer-line__field-label" }, { children: "Transfer date" })), _jsx(DateTimePicker, { placeholder: "DD/MM/YYYY", mode: "calendar", iconPosition: "left", numberOfMonths: 1, iconBGFull: false, showChevron: true, onValueChange: handleDateChange, selectionMode: "single" })] })), _jsx("div", __assign({ className: "transfer-line__field transfer-line__field--pickup" }, { children: _jsx(LocationDropdown, { label: "Pick-up point", options: filterLocations('pickup').options, groups: filterLocations('pickup').groups, selectedValue: (internalPickupPoint === null || internalPickupPoint === void 0 ? void 0 : internalPickupPoint.id) || null, onSelectionChange: handlePickupChange, placeholder: "Select a pick-up point", direction: "pickup", type: type === 'inter-hotel' ? 'accommodation' : type === 'arrival' ? 'airport-port' : 'accommodation', showGroupTitles: false }) })), _jsx("div", __assign({ className: "transfer-line__field transfer-line__field--dropoff" }, { children: _jsx(LocationDropdown, { label: "Drop-off point", options: filterLocations('dropoff').options, groups: filterLocations('dropoff').groups, selectedValue: (internalDropoffPoint === null || internalDropoffPoint === void 0 ? void 0 : internalDropoffPoint.id) || null, onSelectionChange: handleDropoffChange, placeholder: "Select a drop-off point", direction: "dropoff", type: type === 'inter-hotel' ? 'accommodation' : type === 'departure' ? 'airport-port' : 'accommodation', showGroupTitles: false }) }))] })), showDelete && (_jsx("div", __assign({ className: "transfer-line__delete" }, { children: _jsx("button", __assign({ type: "button", className: "transfer-line__delete-btn", onClick: onDelete, "aria-label": "Delete transfer line" }, { children: _jsx(Icon, { name: "delete", size: "sm", className: "transfer-line__delete-icon" }) })) })))] }))] })));
+    return (_jsxs("div", __assign({ className: "transfer-line transfer-line--".concat(type, " ").concat(className), "data-transfer-id": id }, { children: [showTitle && (_jsxs("div", __assign({ className: "transfer-line__header" }, { children: [_jsx(Icon, { name: getTypeIcon(), size: "sm", className: "transfer-line__header-icon" }), _jsx(Text, __assign({ size: "sm", variant: "medium", className: "transfer-line__header-label" }, { children: getTypeLabel() }))] }))), _jsxs("div", __assign({ className: "transfer-line__content-container" }, { children: [_jsxs("div", __assign({ className: "transfer-line__content" }, { children: [_jsx("div", __assign({ className: "transfer-line__field transfer-line__field--pax" }, { children: _jsx(PaxSelector, { label: "Number of pax", value: internalPaxData, onChange: handlePaxChange, placeholder: "2 pax" }) })), _jsxs("div", __assign({ className: "transfer-line__field transfer-line__field--date" }, { children: [_jsx(Text, __assign({ size: "sm", variant: "regular", className: "transfer-line__field-label" }, { children: "Transfer date" })), _jsx(DateTimePicker, { placeholder: "DD/MM/YYYY", mode: "calendar", iconPosition: "left", numberOfMonths: 1, iconBGFull: false, showChevron: true, onValueChange: handleDateChange, selectionMode: "single", defaultValue: transferDate })] })), _jsx("div", __assign({ className: "transfer-line__field transfer-line__field--pickup" }, { children: _jsx(LocationDropdown, { label: "Pick-up point", options: filterLocations('pickup').options, groups: filterLocations('pickup').groups, selectedValue: (internalPickupPoint === null || internalPickupPoint === void 0 ? void 0 : internalPickupPoint.id) || null, onSelectionChange: handlePickupChange, placeholder: "Select a pick-up point", direction: "pickup", type: type === 'inter-hotel' ? 'accommodation' : type === 'arrival' ? 'airport-port' : 'accommodation', showGroupTitles: false }) })), _jsx("div", __assign({ className: "transfer-line__field transfer-line__field--dropoff" }, { children: _jsx(LocationDropdown, { label: "Drop-off point", options: filterLocations('dropoff').options, groups: filterLocations('dropoff').groups, selectedValue: (internalDropoffPoint === null || internalDropoffPoint === void 0 ? void 0 : internalDropoffPoint.id) || null, onSelectionChange: handleDropoffChange, placeholder: "Select a drop-off point", direction: "dropoff", type: type === 'inter-hotel' ? 'accommodation' : type === 'departure' ? 'airport-port' : 'accommodation', showGroupTitles: false }) }))] })), showDelete && (_jsx("div", __assign({ className: "transfer-line__delete" }, { children: _jsx("button", __assign({ type: "button", className: "transfer-line__delete-btn", onClick: onDelete, "aria-label": "Delete transfer line" }, { children: _jsx(Icon, { name: "delete", size: "sm", className: "transfer-line__delete-icon" }) })) })))] }))] })));
 };
 export default TransferLine;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mautourco-components",
-  "version": "0.2.11",
+  "version": "0.2.12",
   "private": false,
   "description": "Bibliothèque de composants Motorco pour le redesign",
   "main": "dist/index.js",

package/src/components/organisms/DateTimePicker/DateTimePicker.tsx

@@ -9,6 +9,8 @@ export interface DateTimePickerProps extends Partial<DateTimeProps> {
   placeholder?: string;
   disabled?: boolean;
   onValueChange?: (value: string | string[]) => void;
+  /** Default value for the date picker (format: "yyyy-MM-dd" for single, ["yyyy-MM-dd", "yyyy-MM-dd"] for range) */
+  defaultValue?: string | string[];
   /** Whether the calendar icon has full bg*/
   iconBGFull?: boolean;
   /** Position of the calendar icon: left or right */
@@ -35,12 +37,41 @@ const DateTimePicker: React.FC<DateTimePickerProps> = ({
   disableBeforeToday = true,
   disableToday = false,
   onValueChange,
+  defaultValue,
   iconBGFull = true,
   iconPosition = "right",
   showChevron = false,
 }) => {
-  const [value, setValue] = useState<string>("");
-  const [selectedDateRange, setSelectedDateRange] = useState<any>(undefined);
+  // Parse default value and set initial state
+  const parseDefaultValue = () => {
+    if (!defaultValue) return { value: "", dateRange: undefined };
+
+    try {
+      if (selectionMode === "range" && Array.isArray(defaultValue)) {
+        // Handle range: ["yyyy-MM-dd", "yyyy-MM-dd"]
+        const [fromStr, toStr] = defaultValue;
+        const from = new Date(fromStr);
+        const to = toStr ? new Date(toStr) : from;
+        const dateRange = { from, to };
+        const displayValue = formatDateRange(dateRange);
+        return { value: displayValue, dateRange };
+      } else if (selectionMode === "single" && typeof defaultValue === "string") {
+        // Handle single: "yyyy-MM-dd"
+        const date = new Date(defaultValue);
+        const dateRange = { from: date, to: date };
+        const displayValue = format(date, "dd/MM/yyyy");
+        return { value: displayValue, dateRange };
+      }
+    } catch (error) {
+      console.error("Error parsing default date value:", error);
+    }
+
+    return { value: "", dateRange: undefined };
+  };
+
+  const initialState = parseDefaultValue();
+  const [value, setValue] = useState<string>(initialState.value);
+  const [selectedDateRange, setSelectedDateRange] = useState<any>(initialState.dateRange);
   const [selectedTime, setSelectedTime] = useState<{ hour: string; minute: string; meridiem: "AM" | "PM" } | undefined>(undefined);
   const [isOpen, setIsOpen] = useState(false);
 

package/src/components/organisms/RoundTrip/RoundTrip.tsx

@@ -298,6 +298,7 @@ const RoundTrip: React.FC<RoundTripProps> = ({
             showChevron={true}
             onValueChange={handleDateRangeChange}
             selectionMode="range"
+            defaultValue={arrivalDate && departureDate ? [arrivalDate, departureDate] : undefined}
           />
         </div>
         <div className="round-trip__field round-trip__field--pickup-dropoff">

package/src/components/organisms/SearchBarTransfer/index.ts

@@ -1,2 +1,3 @@
 export { default } from './SearchBarTransfer';
 export type { SearchBarTransferProps, SearchBarTransferData, TransferMode } from './SearchBarTransfer';
+

package/src/components/organisms/TransferLine/TransferLine.tsx

@@ -311,6 +311,7 @@ const TransferLine: React.FC<TransferLineProps> = ({
               showChevron={true}
               onValueChange={handleDateChange}
               selectionMode="single"
+              defaultValue={transferDate}
             />
           </div>