mautourco-components 0.2.19 → 0.2.21

package/dist/components/molecules/DialogContentPolicy/CancellationLayout/CancellationLayout.d.ts

@@ -0,0 +1,11 @@
+import { IconName } from '@/src/components/atoms/Icon/Icon';
+import React from 'react';
+import './CancellationLayout.css';
+export interface CancellationLayoutProps {
+    title: React.ReactNode;
+    icon: IconName;
+    children?: React.ReactNode;
+    className?: string;
+    image: string;
+}
+export declare const CancellationLayout: React.FC<CancellationLayoutProps>;

package/dist/components/molecules/DialogContentPolicy/CancellationLayout/CancellationLayout.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, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from '@/src/lib/utils';
+import { ServiceTitle } from '../../ServiceTitle/ServiceTitle';
+import './CancellationLayout.css';
+export var CancellationLayout = function (props) {
+    var title = props.title, icon = props.icon, children = props.children, className = props.className, image = props.image;
+    return (_jsxs("div", __assign({ className: cn('cancellation-layout', className) }, { children: [_jsx(ServiceTitle, { title: title, icon: icon }), _jsxs("div", __assign({ className: "cancellation-layout__content" }, { children: [_jsx("div", __assign({ className: "cancellation-layout__content-left" }, { children: children })), _jsx("figure", __assign({ className: "cancellation-layout__content-right" }, { children: _jsx("img", { src: image, alt: (title === null || title === void 0 ? void 0 : title.toString()) || '', width: 150, height: 200 }) }))] }))] })));
+};

package/dist/components/molecules/DialogContentPolicy/DialogCancellationAccom.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { RoomItem } from '@/src/types/table';
+export interface DialogCancellationAccomProps {
+    image: string;
+    hotelName: string;
+    dates: string[];
+    rooms: RoomItem[];
+}
+export declare const DialogCancellationAccom: React.FC<DialogCancellationAccomProps>;

package/dist/components/molecules/DialogContentPolicy/DialogCancellationAccom.js

@@ -0,0 +1,24 @@
+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 useStays from '@/src/hooks/useStays';
+import { Fragment } from 'react';
+import Chip from '../../atoms/Chip/Chip';
+import { Text } from '../../atoms/Typography/Typography';
+import { DateDisplay } from '../DateDisplay/DateDisplay';
+import TextWithIcon from '../TextWithIcon/TextWithIcon';
+import { CancellationLayout } from './CancellationLayout/CancellationLayout';
+export var DialogCancellationAccom = function (props) {
+    var image = props.image, hotelName = props.hotelName, dates = props.dates, rooms = props.rooms;
+    var stay = useStays(dates);
+    return (_jsx(CancellationLayout, __assign({ title: "Accommodation", icon: "accom", image: image }, { children: _jsxs("div", __assign({ className: "space-y-6" }, { children: [_jsxs("div", __assign({ className: "space-y-1" }, { children: [_jsx(Text, __assign({ variant: "bold" }, { children: hotelName })), _jsx(DateDisplay, { dates: dates }), _jsxs(TextWithIcon, __assign({ icon: "night", textLeading: "4" }, { children: [stay, " Nights"] }))] })), _jsx("div", __assign({ className: "" }, { children: rooms.map(function (room, index) { return (_jsxs("div", __assign({ className: "space-y-4" }, { children: [_jsxs("div", __assign({ className: "space-y-1" }, { children: [_jsxs(TextWithIcon, __assign({ icon: "accom", textLeading: "4" }, { children: [index + 1, " Room"] })), _jsx(Text, __assign({ size: "sm" }, { children: room.RoomName }))] })), room.cancellation_policy.map(function (policy) { return (_jsxs(Fragment, { children: [_jsxs(Chip, __assign({ type: "outline", color: "brand", isBlackText: true }, { children: ["Policy period applies", ' ', _jsx(DateDisplay, { dates: [policy.ValidFrom, policy.ValidTo], textSize: "xs" })] })), _jsxs(Text, __assign({ variant: "bold", size: "xs", leading: "4" }, { children: [policy.Value, " % of total price"] })), _jsx(Text, __assign({ size: "xs", leading: "4" }, { children: policy.Description }))] }, "policy-".concat(index))); })] }), "rm-".concat(index))); }) }))] })) })));
+};

package/dist/components/molecules/DialogContentPolicy/DialogCancellationExcursion.d.ts

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+export interface DialogCancellationExcursionProps {
+    image: string;
+    excursionName: string;
+    date: string;
+    policy: {
+        title: string;
+        description: string;
+    };
+    details: {
+        duration: string;
+        meal: string;
+        accessibility: string;
+        transferType: string;
+    };
+}
+export declare const DialogCancellationExcursion: React.FC<DialogCancellationExcursionProps>;

package/dist/components/molecules/DialogContentPolicy/DialogCancellationExcursion.js

@@ -0,0 +1,20 @@
+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 { Text } from '../../atoms/Typography/Typography';
+import { DateDisplay } from '../DateDisplay/DateDisplay';
+import { ServiceInfo } from '../ServiceInfo/ServiceInfo';
+import { CancellationLayout } from './CancellationLayout/CancellationLayout';
+export var DialogCancellationExcursion = function (props) {
+    var image = props.image, excursionName = props.excursionName, date = props.date, details = props.details, policy = props.policy;
+    return (_jsx(CancellationLayout, __assign({ title: "Excursion", icon: "map", image: image }, { children: _jsxs("div", __assign({ className: "space-y-6" }, { children: [_jsxs("div", __assign({ className: "space-y-1" }, { children: [_jsx(Text, __assign({ variant: "bold" }, { children: excursionName })), _jsx(DateDisplay, { dates: [date] })] })), _jsxs(ServiceInfo, { children: [_jsx(ServiceInfo.Item, __assign({ icon: "stopwatch", label: "Duration" }, { children: details.duration })), _jsx(ServiceInfo.Item, __assign({ icon: "utensils", label: "Meal" }, { children: details.meal })), _jsx(ServiceInfo.Item, __assign({ icon: "bike", label: "Difficulty" }, { children: details.accessibility })), _jsx(ServiceInfo.Item, __assign({ icon: "car", label: "Transfer Type" }, { children: details.transferType }))] }), _jsxs("div", __assign({ className: "" }, { children: [_jsx(Text, __assign({ variant: "bold", size: "xs", leading: "4" }, { children: policy.title })), _jsx(Text, __assign({ size: "xs", leading: "4" }, { children: policy.description }))] }))] })) })));
+};

package/dist/components/molecules/DialogContentPolicy/DialogCancellationList.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { DialogCancellationAccomProps } from './DialogCancellationAccom';
+import { DialogCancellationExcursionProps } from './DialogCancellationExcursion';
+export interface CancellationItem {
+    type: 'accommodation' | 'excursion';
+    data: DialogCancellationAccomProps | DialogCancellationExcursionProps;
+}
+export interface DialogCancellationListProps {
+    cancellations: CancellationItem[];
+}
+export declare const DialogCancellationList: React.FC<DialogCancellationListProps>;

package/dist/components/molecules/DialogContentPolicy/DialogCancellationList.js

@@ -0,0 +1,33 @@
+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 { DialogCancellationAccom, } from './DialogCancellationAccom';
+import { DialogCancellationExcursion, } from './DialogCancellationExcursion';
+import { DialogContentPolicy } from './DialogContentPolicy';
+export var DialogCancellationList = function (props) {
+    var cancellations = props.cancellations;
+    var isAccommodation = function (data) {
+        return 'hotelName' in data;
+    };
+    var isExcursion = function (data) {
+        return 'excursionName' in data;
+    };
+    return (_jsx(DialogContentPolicy, { children: cancellations.map(function (c, index) {
+            if (c.type === 'accommodation' && isAccommodation(c.data)) {
+                return _jsx(DialogCancellationAccom, __assign({}, c.data), "acc-".concat(index));
+            }
+            if (c.type === 'excursion' && isExcursion(c.data)) {
+                return _jsx(DialogCancellationExcursion, __assign({}, c.data), "exc-".concat(index));
+            }
+            return null;
+        }) }));
+};

package/dist/components/molecules/DialogContentPolicy/DialogContentPolicy.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+export interface DialogContentPolicyProps {
+    children: React.ReactNode;
+    onSubmit?: () => void;
+}
+export declare const DialogContentPolicy: {
+    (props: DialogContentPolicyProps): import("react/jsx-runtime").JSX.Element;
+    Accommodation: React.FC<import("./DialogCancellationAccom").DialogCancellationAccomProps>;
+    Excursion: React.FC<import("./DialogCancellationExcursion").DialogCancellationExcursionProps>;
+    List: React.FC<import("./DialogCancellationList").DialogCancellationListProps>;
+};

package/dist/components/molecules/DialogContentPolicy/DialogContentPolicy.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, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import Button from '../../atoms/Button/Button';
+import { Text } from '../../atoms/Typography/Typography';
+import { Checkbox } from '../../ui/checkbox';
+import { DialogCancellationAccom } from './DialogCancellationAccom';
+import { DialogCancellationExcursion } from './DialogCancellationExcursion';
+import { DialogCancellationList } from './DialogCancellationList';
+export var DialogContentPolicy = function (props) {
+    var children = props.children, onSubmit = props.onSubmit;
+    var _a = useState(false), accepted = _a[0], setAccepted = _a[1];
+    return (_jsxs("div", __assign({ className: "cancellation-policy" }, { children: [children, _jsxs("div", __assign({ className: "flex justify-end gap-x-8 py-9" }, { children: [_jsxs("div", __assign({ className: "flex gap-x-2.5 items-center" }, { children: [_jsx("label", __assign({ htmlFor: "accept-terms" }, { children: _jsx(Text, __assign({ size: "sm", as: "span" }, { children: "I've read and accept the cancellation policy." })) })), _jsx(Checkbox, { id: "accept-terms", checked: accepted, onCheckedChange: setAccepted })] })), _jsx(Button, __assign({ className: "w-[250px]", variant: "secondary", disabled: !accepted, onClick: onSubmit }, { children: "Next" }))] }))] })));
+};
+DialogContentPolicy.Accommodation = DialogCancellationAccom;
+DialogContentPolicy.Excursion = DialogCancellationExcursion;
+DialogContentPolicy.List = DialogCancellationList;

package/dist/components/molecules/DialogContentPolicy/index.d.ts

@@ -0,0 +1,4 @@
+export * from './DialogContentPolicy';
+export type { CancellationLayoutProps } from './CancellationLayout/CancellationLayout';
+export type { DialogCancellationAccomProps } from './DialogCancellationAccom';
+export type { DialogCancellationExcursionProps } from './DialogCancellationExcursion';

package/dist/components/molecules/DialogContentPolicy/index.js

@@ -0,0 +1 @@
+export * from './DialogContentPolicy';

package/dist/components/molecules/ServiceTitle/ServiceTitle.css

@@ -2077,6 +2077,9 @@
 
 .service-title {
   position: relative;
+  display: flex;
+  align-items: center;
+  column-gap: 0.5rem;
   padding-left: 10px;
   &::before {
     content: '';

package/dist/components/molecules/ServiceTitle/ServiceTitle.d.ts

@@ -1,8 +1,14 @@
 import React from 'react';
+import { IconName } from '../../atoms/Icon/Icon';
+import { IconBaseProps } from '../../atoms/Icon/icons/registry';
 import { TextProps } from '../../atoms/Typography/Typography';
 import './ServiceTitle.css';
 export interface ServiceTitleProps {
-    title: string;
+    title: React.ReactNode;
     textSize?: TextProps['size'];
+    textLeading?: TextProps['leading'];
+    textVariant?: TextProps['variant'];
+    icon?: IconName;
+    iconSize?: IconBaseProps['size'];
 }
 export declare const ServiceTitle: React.FC<ServiceTitleProps>;

package/dist/components/molecules/ServiceTitle/ServiceTitle.js

@@ -9,10 +9,11 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import Icon from '../../atoms/Icon/Icon';
 import { Text } from '../../atoms/Typography/Typography';
 import './ServiceTitle.css';
 export var ServiceTitle = function (props) {
-    var title = props.title, _a = props.textSize, textSize = _a === void 0 ? 'md' : _a;
-    return (_jsx("div", __assign({ className: "service-title" }, { children: _jsx(Text, __assign({ variant: "bold", size: textSize, color: "accent" }, { children: title })) })));
+    var title = props.title, _a = props.textSize, textSize = _a === void 0 ? 'md' : _a, icon = props.icon, _b = props.iconSize, iconSize = _b === void 0 ? 'sm' : _b, _c = props.textLeading, textLeading = _c === void 0 ? '5' : _c, _d = props.textVariant, textVariant = _d === void 0 ? 'bold' : _d;
+    return (_jsxs(Text, __assign({ className: "service-title", size: textSize, variant: textVariant, leading: textLeading, as: "div", color: "accent" }, { children: [icon && _jsx(Icon, { name: icon, size: iconSize }), _jsx("span", { children: title })] })));
 };

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

@@ -7,5 +7,7 @@ declare function Booking(props: BookingProps): import("react/jsx-runtime").JSX.E
 declare namespace Booking {
     var Docket: React.FC<import("./BookingDocket/BookingDocket").BookingDocketProps>;
     var Step: React.FC<import("./BookingStep/BookingStep").BookingStepProps>;
+    var Header: React.FC<import("./BookingHeader").BookingHeaderProps>;
+    var PaxList: React.FC<import("./BookingPaxList").BookingPaxProps>;
 }
 export default Booking;

package/dist/components/organisms/Booking/Booking.js

@@ -24,6 +24,8 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { cn } from '@/src/lib/utils';
 import './Booking.css';
 import { BookingDocket } from './BookingDocket/BookingDocket';
+import { BookingHeader } from './BookingHeader';
+import { BookingPaxList } from './BookingPaxList';
 import { BookingStep } from './BookingStep/BookingStep';
 export default function Booking(props) {
     var children = props.children, className = props.className, restProps = __rest(props, ["children", "className"]);
@@ -31,3 +33,5 @@ export default function Booking(props) {
 }
 Booking.Docket = BookingDocket;
 Booking.Step = BookingStep;
+Booking.Header = BookingHeader;
+Booking.PaxList = BookingPaxList;

package/dist/components/organisms/Booking/BookingHeader.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+export interface BookingHeaderProps {
+    fileNumber: string | number;
+    reference: string | number;
+    location: string;
+    isBooking?: boolean;
+}
+export declare const BookingHeader: React.FC<BookingHeaderProps>;

package/dist/components/organisms/Booking/BookingHeader.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 { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { Heading, Text } from '../../atoms/Typography/Typography';
+export var BookingHeader = function (props) {
+    var fileNumber = props.fileNumber, reference = props.reference, isBooking = props.isBooking, location = props.location;
+    return (_jsxs("div", __assign({ className: "space-y-2" }, { children: [_jsxs(Text, __assign({ color: "light" }, { children: ["File number: ", fileNumber] })), _jsxs(Heading, __assign({ level: 6, as: "h1", color: "brand" }, { children: [isBooking ? 'Booking' : 'Quotation', ": N\u00B0 ", reference] })), _jsx(Text, __assign({ color: "accent", size: "xl" }, { children: location }))] })));
+};

package/dist/components/organisms/Booking/BookingPaxList.d.ts

@@ -0,0 +1,25 @@
+import React from 'react';
+import { BookingPaxAccomProps, BookingPaxExcursionProps, BookingPaxTransferProps } from '../../molecules/BookingPax';
+import { BookingPaxClientInfo, BookingPaxClientOptions } from '../../molecules/BookingPax/BookingPaxClient/BookingPaxClient';
+export interface BookingPaxData {
+    type: 'accommodation' | 'excursion' | 'transfer';
+    data: Omit<BookingPaxAccomProps, 'clientsInfo'> | Omit<BookingPaxExcursionProps, 'clientsInfo'> | Omit<BookingPaxTransferProps, 'clientsInfo'>;
+}
+export interface BookingPaxAutoFilledData {
+    type: BookingPaxData['type'];
+    parentIndex: number;
+    roomIndex?: number;
+    selectedClients: BookingPaxClientInfo[];
+}
+export interface BookingPaxProps {
+    data: BookingPaxData[];
+    clientsInfo: BookingPaxClientInfo[];
+    isSubmitted?: boolean;
+    onPaxChange?: (index: number, type: BookingPaxData['type'], options: BookingPaxClientOptions) => void;
+    onRemarkChange?: (index: number, type: BookingPaxData['type'], value: string) => void;
+    onError?: (index: number, type: BookingPaxData['type'], hasError: boolean) => void;
+    onTimeChange?: (index: number, value: string | string[]) => void;
+    onFlightNumberChange?: (index: number, value: string) => void;
+    onAutoFilled?: (data: BookingPaxAutoFilledData[]) => void;
+}
+export declare const BookingPaxList: React.FC<BookingPaxProps>;

package/dist/components/organisms/Booking/BookingPaxList.js

@@ -0,0 +1,117 @@
+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 __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useCallback, useEffect, useState } from 'react';
+import { BookingPax, } from '../../molecules/BookingPax';
+// Type guards for better type safety
+var isAccommodationData = function (data) {
+    return 'rooms' in data && 'hotelName' in data && 'roomName' in data;
+};
+var isExcursionData = function (data) {
+    return 'name' in data && 'type' in data && !('from' in data);
+};
+var isTransferData = function (data) {
+    return 'from' in data && 'to' in data && 'type' in data;
+};
+export var BookingPaxList = function (props) {
+    var data = props.data, isSubmitted = props.isSubmitted, clientsInfo = props.clientsInfo, onPaxChange = props.onPaxChange, onRemarkChange = props.onRemarkChange, onError = props.onError, onTimeChange = props.onTimeChange, onFlightNumberChange = props.onFlightNumberChange, onAutoFilled = props.onAutoFilled;
+    var _a = useState([]), autoFilledData = _a[0], setAutoFilledData = _a[1];
+    // Memoized callback handlers to reduce re-renders
+    var handlePaxChange = useCallback(function (type, index, options) {
+        onPaxChange === null || onPaxChange === void 0 ? void 0 : onPaxChange(index, type, options);
+    }, [onPaxChange]);
+    var handleRemarkChange = useCallback(function (type, index, value) {
+        onRemarkChange === null || onRemarkChange === void 0 ? void 0 : onRemarkChange(index, type, value);
+    }, [onRemarkChange]);
+    var handleError = useCallback(function (index, type, hasError) {
+        onError === null || onError === void 0 ? void 0 : onError(index, type, hasError);
+    }, [onError]);
+    var handleTimeChange = useCallback(function (value, index) {
+        // Don't need type because only transfer has this callback
+        onTimeChange === null || onTimeChange === void 0 ? void 0 : onTimeChange(index, value);
+    }, [onTimeChange]);
+    var handleFlightNumberChange = useCallback(function (value, index) {
+        // Don't need type because only transfer has this callback
+        onFlightNumberChange === null || onFlightNumberChange === void 0 ? void 0 : onFlightNumberChange(index, value);
+    }, [onFlightNumberChange]);
+    var handleAutoFilled = useCallback(function (type) {
+        return function (paxCount, index, roomIndex) {
+            if (paxCount === clientsInfo.length) {
+                setAutoFilledData(function (prev) {
+                    var findParentIndex = prev.find(function (d) { return d.parentIndex === index; });
+                    if (findParentIndex) {
+                        return prev;
+                    }
+                    return __spreadArray(__spreadArray([], prev, true), [
+                        {
+                            type: type,
+                            parentIndex: index,
+                            selectedClients: clientsInfo,
+                            roomIndex: roomIndex,
+                        },
+                    ], false);
+                });
+            }
+        };
+    }, []);
+    useEffect(function () {
+        data.forEach(function (item, index) {
+            var type = item.type, itemData = item.data;
+            if (type === 'accommodation' && isAccommodationData(itemData)) {
+                var initAccom_1 = handleAutoFilled('accommodation');
+                // if(itemData.clientsInfo.length === itemData)
+                itemData.rooms.forEach(function (room, roomIndex) {
+                    initAccom_1(room.paxCount, index, roomIndex);
+                });
+            }
+            else if (type === 'excursion' && isExcursionData(itemData)) {
+                var initExcursion = handleAutoFilled('excursion');
+                initExcursion(itemData.paxCount, index);
+            }
+            else if (type === 'transfer' && isTransferData(itemData)) {
+                var initTransfer = handleAutoFilled('transfer');
+                initTransfer(itemData.paxCount, index);
+            }
+        });
+    }, [data, handleAutoFilled]);
+    useEffect(function () {
+        onAutoFilled === null || onAutoFilled === void 0 ? void 0 : onAutoFilled(autoFilledData);
+    }, [autoFilledData, onAutoFilled]);
+    return (_jsx(BookingPax, { children: data.map(function (item, index) {
+            var type = item.type, itemData = item.data;
+            var callbacks = {
+                onPaxChange: function (options) {
+                    return handlePaxChange(type, index, options);
+                },
+                onRemarkChange: function (value) { return handleRemarkChange(type, index, value); },
+            };
+            if (type === 'accommodation' && isAccommodationData(itemData)) {
+                return (_jsx(BookingPax.Accom, __assign({}, itemData, callbacks, { clientsInfo: clientsInfo, isSubmitted: isSubmitted, onError: function (roomIndex, hasError) { return handleError(roomIndex, type, hasError); } }), "bp-accom-".concat(index)));
+            }
+            if (type === 'excursion' && isExcursionData(itemData)) {
+                return (_jsx(BookingPax.Excursion, __assign({}, itemData, { clientsInfo: clientsInfo, isSubmitted: isSubmitted, onError: function (hasError) { return handleError(index, type, hasError); } }, callbacks), "bp-excursion-".concat(index)));
+            }
+            if (type === 'transfer' && isTransferData(itemData)) {
+                return (_jsx(BookingPax.Transfer, __assign({}, itemData, { onTimeChange: function (value) { return handleTimeChange(value, index); }, onFlightNumberChange: function (value) { return handleFlightNumberChange(value, index); }, clientsInfo: clientsInfo, isSubmitted: isSubmitted, onError: function (hasError) { return handleError(index, type, hasError); } }, callbacks), "bp-transfer-".concat(index)));
+            }
+            return null;
+        }) }));
+};

package/dist/components/organisms/Booking/BookingStep/BookingStep.d.ts

@@ -3,6 +3,7 @@ import React from 'react';
 import './BookingStep.css';
 export interface BookingStepProps {
     steps: StepperTimelineItem[];
+    currentStep?: number;
     className?: string;
     nextDisabled?: boolean;
     onStepChange?: (step: StepperTimelineItem, index: number) => void;

package/dist/components/organisms/Booking/BookingStep/BookingStep.js

@@ -12,10 +12,10 @@ var __assign = (this && this.__assign) || function () {
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import Button from '@/src/components/atoms/Button/Button';
 import { StepperTimeline, } from '@/src/components/molecules/StepperTimeline/StepperTimeline';
-import { useState } from 'react';
+import { useEffect, useState } from 'react';
 import './BookingStep.css';
 export var BookingStep = function (props) {
-    var steps = props.steps, className = props.className, nextDisabled = props.nextDisabled, onStepChange = props.onStepChange, onNextClick = props.onNextClick;
+    var steps = props.steps, className = props.className, nextDisabled = props.nextDisabled, currentStep = props.currentStep, onStepChange = props.onStepChange, onNextClick = props.onNextClick;
     var _a = useState(0), currentIndex = _a[0], setCurrentIndex = _a[1];
     var handleStepChange = function (step, index) {
         setCurrentIndex(index);
@@ -26,5 +26,8 @@ export var BookingStep = function (props) {
         setCurrentIndex(currentStep);
         onNextClick === null || onNextClick === void 0 ? void 0 : onNextClick(steps[currentStep], currentStep);
     };
+    useEffect(function () {
+        setCurrentIndex(currentStep ? currentStep - 1 : 0);
+    }, [currentStep]);
     return (_jsxs("div", __assign({ className: "booking-step" }, { children: [_jsx(StepperTimeline, { steps: steps, className: className, currentIndex: currentIndex, onChange: handleStepChange }), _jsx(Button, __assign({ trailingIcon: "arrow-right-outline", variant: "secondary", className: "w-[189px]", disabled: nextDisabled, onClick: handleNextClick }, { children: currentIndex === steps.length - 1 ? 'Confirm' : 'Next' }))] })));
 };

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

@@ -1,5 +1,6 @@
-import React from "react";
-import { DateTimeProps } from "../../molecules/Calendar/DateTime";
+import React from 'react';
+import { DateTimeProps } from '../../molecules/Calendar/DateTime';
+import { IconName } from '../../atoms/Icon/Icon';
 export interface DateTimePickerProps extends Partial<DateTimeProps> {
     placeholder?: string;
     disabled?: boolean;
@@ -9,9 +10,11 @@ export interface DateTimePickerProps extends Partial<DateTimeProps> {
     /** Whether the calendar icon has full bg*/
     iconBGFull?: boolean;
     /** Position of the calendar icon: left or right */
-    iconPosition?: "left" | "right";
+    iconPosition?: 'left' | 'right';
     /** Show chevron on the right when icon is on the left */
     showChevron?: boolean;
+    /** Icon to display on the left of the input */
+    icon?: IconName;
 }
 declare const DateTimePicker: React.FC<DateTimePickerProps>;
 export default DateTimePicker;

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

@@ -10,29 +10,29 @@ var __assign = (this && this.__assign) || function () {
     return __assign.apply(this, arguments);
 };
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React, { useState } from "react";
-import CalendarInput from "../../molecules/Calendar/CalendarInput";
-import DateTime from "../../molecules/Calendar/DateTime";
-import { Popover, PopoverTrigger, PopoverContent } from "../../ui/popover";
-import { format } from "date-fns";
+import React, { useState } from 'react';
+import CalendarInput from '../../molecules/Calendar/CalendarInput';
+import DateTime from '../../molecules/Calendar/DateTime';
+import { Popover, PopoverContent, PopoverTrigger } from '../../ui/popover';
+import { format } from 'date-fns';
 var formatDateRange = function (dateRange) {
     var _a;
     if (!dateRange || !dateRange.from)
-        return "";
+        return '';
     var from = dateRange.from;
     var to = (_a = dateRange.to) !== null && _a !== void 0 ? _a : dateRange.from;
     if (+from === +to)
-        return format(from, "dd/MM/yyyy");
-    return "".concat(format(from, "dd/MM/yyyy"), " - ").concat(format(to, "dd/MM/yyyy"));
+        return format(from, 'dd/MM/yyyy');
+    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, 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;
+    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, icon = _a.icon;
     // Parse default value and set initial state
     var parseDefaultValue = function () {
         if (!defaultValue)
-            return { value: "", dateRange: undefined };
+            return { value: '', dateRange: undefined };
         try {
-            if (selectionMode === "range" && Array.isArray(defaultValue)) {
+            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);
@@ -41,18 +41,18 @@ var DateTimePicker = function (_a) {
                 var displayValue = formatDateRange(dateRange);
                 return { value: displayValue, dateRange: dateRange };
             }
-            else if (selectionMode === "single" && typeof defaultValue === "string") {
+            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");
+                var displayValue = format(date, 'dd/MM/yyyy');
                 return { value: displayValue, dateRange: dateRange };
             }
         }
         catch (error) {
-            console.error("Error parsing default date value:", error);
+            console.error('Error parsing default date value:', error);
         }
-        return { value: "", dateRange: undefined };
+        return { value: '', dateRange: undefined };
     };
     var initialState = parseDefaultValue();
     var _m = useState(initialState.value), value = _m[0], setValue = _m[1];
@@ -62,20 +62,22 @@ var DateTimePicker = function (_a) {
     var handleDtChange = React.useCallback(function (payload) {
         var _a;
         var datePart = formatDateRange(payload.dateRange);
-        var time = payload.time ? "".concat(payload.time.hour, ":").concat(payload.time.minute, " ").concat(payload.time.meridiem) : "";
-        var combined = [datePart, time].filter(Boolean).join(" ");
+        var time = payload.time
+            ? "".concat(payload.time.hour, ":").concat(payload.time.minute, " ").concat(payload.time.meridiem)
+            : '';
+        var combined = [datePart, time].filter(Boolean).join(' ');
         setValue(combined);
         setSelectedDateRange(payload.dateRange);
         setSelectedTime(payload.time);
         // Return date strings in yyyy-MM-dd format for both modes
         if (payload.dateRange) {
-            if (selectionMode === "range") {
+            if (selectionMode === 'range') {
                 // Return array of date strings for range mode
                 var from = payload.dateRange.from;
                 var to = (_a = payload.dateRange.to) !== null && _a !== void 0 ? _a : payload.dateRange.from;
                 if (from && to) {
-                    var fromStr = format(from, "yyyy-MM-dd");
-                    var toStr = format(to, "yyyy-MM-dd");
+                    var fromStr = format(from, 'yyyy-MM-dd');
+                    var toStr = format(to, 'yyyy-MM-dd');
                     onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange([fromStr, toStr]);
                 }
             }
@@ -83,12 +85,16 @@ var DateTimePicker = function (_a) {
                 // Return single date string in yyyy-MM-dd format for single mode
                 var date = payload.dateRange.from;
                 if (date) {
-                    var dateStr = format(date, "yyyy-MM-dd");
+                    var dateStr = format(date, 'yyyy-MM-dd');
                     onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(dateStr);
                 }
             }
         }
+        if (!payload.dateRange && payload.time) {
+            var timeStr = "".concat(payload.time.hour, ":").concat(payload.time.minute, " ").concat(payload.time.meridiem);
+            onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(timeStr);
+        }
     }, [onValueChange, selectionMode]);
-    return (_jsxs(Popover, __assign({ open: isOpen, onOpenChange: setIsOpen }, { children: [_jsx(PopoverTrigger, __assign({ asChild: true }, { children: _jsx("div", { children: _jsx(CalendarInput, { placeholder: placeholder, value: value, disabled: disabled, iconBGFull: iconBGFull, iconPosition: iconPosition, showChevron: showChevron, isOpen: isOpen }) }) })), _jsx(PopoverContent, __assign({ className: "w-auto p-0 border-transparent" }, { children: _jsx(DateTime, { mode: mode, selectionMode: selectionMode, numberOfMonths: numberOfMonths, disableBeforeToday: disableBeforeToday, disableToday: disableToday, onChange: handleDtChange, defaultDateRange: selectedDateRange, defaultTime: selectedTime }) }))] })));
+    return (_jsxs(Popover, __assign({ open: isOpen, onOpenChange: setIsOpen }, { children: [_jsx(PopoverTrigger, __assign({ asChild: true }, { children: _jsx("div", { children: _jsx(CalendarInput, { placeholder: placeholder, value: value, disabled: disabled, iconBGFull: iconBGFull, iconPosition: iconPosition, showChevron: showChevron, isOpen: isOpen, icon: icon }) }) })), _jsx(PopoverContent, __assign({ className: "w-auto p-0 border-transparent" }, { children: _jsx(DateTime, { mode: mode, selectionMode: selectionMode, numberOfMonths: numberOfMonths, disableBeforeToday: disableBeforeToday, disableToday: disableToday, onChange: handleDtChange, defaultDateRange: selectedDateRange, defaultTime: selectedTime }) }))] })));
 };
 export default DateTimePicker;