mautourco-components 0.2.30 → 0.2.32

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

@@ -0,0 +1,24 @@
+import { DetailResumeAccommodation, DetailResumeExcursion, DetailResumeOtherService, DetailResumeTransfer } from '@/src/types/table';
+import { ColumnType } from '../Table/TableCell';
+import './DialogComparison.css';
+export type ComparisonData = DetailResumeAccommodation | DetailResumeTransfer | DetailResumeExcursion | DetailResumeOtherService;
+export interface MultiComparisonData {
+    id: string;
+    name: string;
+    data: ComparisonData[];
+}
+export interface DialogComparisonProps {
+    open: boolean;
+    setOpen: (open: boolean) => void;
+    data: MultiComparisonData[];
+    columns?: ColumnType<ComparisonData>[];
+    onBookNow: (payload: {
+        selectedValues: string[];
+        filteredData: MultiComparisonData[];
+    }) => void;
+}
+export declare const isComparisonAccommodation: (data: ComparisonData) => data is ComparisonData & DetailResumeAccommodation;
+export declare const isComparisonTransfer: (data: ComparisonData) => data is ComparisonData & DetailResumeTransfer;
+export declare const isComparisonExcursion: (data: ComparisonData) => data is ComparisonData & DetailResumeExcursion;
+export declare const isComparisonOtherService: (data: ComparisonData) => data is ComparisonData & DetailResumeOtherService;
+export declare const DialogComparison: (props: DialogComparisonProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/organisms/DialogComparison/DialogComparison.js

@@ -0,0 +1,69 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ServiceType, } from '../../../types/table/index';
+import { useEffect, useState } from 'react';
+import Button from '../../atoms/Button/Button';
+import Chip from '../../atoms/Chip/Chip';
+import MultiSelectDropdown from '../../molecules/MultiSelectDropdown/MultiSelectDropdown';
+import { DialogBookingConfirm } from '../DialogBookingConfirm';
+import { Table } from '../Table';
+import { columns as defaultColumns } from '../Table/columns';
+import './DialogComparison.css';
+export var isComparisonAccommodation = function (data) {
+    return data.Type === ServiceType.ACCOMMODATION;
+};
+export var isComparisonTransfer = function (data) {
+    return data.Type === ServiceType.TRANSFER;
+};
+export var isComparisonExcursion = function (data) {
+    return data.Type === ServiceType.EXCURSION;
+};
+export var isComparisonOtherService = function (data) {
+    return data.Type === ServiceType.OTHER_SERVICE;
+};
+export var DialogComparison = function (props) {
+    var open = props.open, data = props.data, columns = props.columns, setOpen = props.setOpen, onBookNow = props.onBookNow;
+    var _a = useState([]), selectedValues = _a[0], setSelectedValues = _a[1];
+    var _b = useState(data), filteredData = _b[0], setFilteredData = _b[1];
+    var getTotalRows = function (comparisonData) {
+        var totalMap = new Map();
+        comparisonData.forEach(function (item) {
+            if (isComparisonAccommodation(item)) {
+                var currency = item.Currency;
+                var total = parseFloat(item.Total) || 0;
+                var currentTotal = totalMap.get(currency) || 0;
+                totalMap.set(currency, currentTotal + total);
+            }
+            if (isComparisonTransfer(item) || isComparisonExcursion(item)) {
+                var currency = item.Currency;
+                var total = parseFloat(item.TotalPrice) || 0;
+                var currentTotal = totalMap.get(currency) || 0;
+                totalMap.set(currency, currentTotal + total);
+            }
+            if (isComparisonOtherService(item)) {
+                var currency = item.currency;
+                var total = parseFloat(item.total_price) || 0;
+                var currentTotal = totalMap.get(currency) || 0;
+                totalMap.set(currency, currentTotal + total);
+            }
+        });
+        return Object.fromEntries(totalMap);
+    };
+    var handleSelectionChange = function (selectedValues) {
+        if (selectedValues.length >= 1) {
+            setSelectedValues(selectedValues);
+            setFilteredData(data.filter(function (d) { return selectedValues.includes(d.id); }));
+        }
+    };
+    useEffect(function () {
+        setSelectedValues(data.map(function (d) { return d.id; }));
+    }, [data]);
+    return (_jsx(DialogBookingConfirm, { title: "Comparison of the quotations", open: open, setOpen: setOpen, className: "!max-w-[1255px]", closeOnOverlayClick: true, children: _jsxs("div", { className: "dialog-comparison", children: [_jsx("div", { className: "dialog-comparison__filter", children: _jsx(MultiSelectDropdown, { options: data.map(function (d) { return ({
+                            id: d.id,
+                            label: d.name,
+                        }); }), selectedValues: selectedValues, onSelectionChange: handleSelectionChange, maxDisplayedChips: 2, useTextForMaxDisplayedChips: true }) }), _jsx("div", { className: "dialog-comparison__list", children: filteredData.map(function (d, index) { return (_jsxs("div", { className: "dialog-comparison__item", children: [_jsx(Chip, { label: d.name, color: "brand", type: "outline", size: "lg" }), _jsx(Table, { data: d.data, columns: columns || defaultColumns.comparison(), totalRows: getTotalRows(d.data), isTotalBorderDash: false, totalSubstractedSpace: 0 })] }, "cp-".concat(index))); }) }), _jsx("div", { className: "dialog-comparison__footer", children: _jsx(Button, { variant: "secondary", onClick: function () {
+                            return onBookNow({
+                                selectedValues: selectedValues,
+                                filteredData: filteredData,
+                            });
+                        }, children: "Book now" }) })] }) }));
+};

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

@@ -0,0 +1,14 @@
+import React from 'react';
+import { ButtonProps } from '../../atoms/Button/Button';
+export interface DialogDeleteConfirmProps {
+    open: boolean;
+    setOpen: (open: boolean) => void;
+    message: string;
+    title: string;
+    cancelText?: string;
+    okText?: string;
+    okVariant?: ButtonProps['variant'];
+    onOk?: () => void;
+    onCancel?: () => void;
+}
+export declare const DialogDeleteConfirm: React.FC<DialogDeleteConfirmProps>;

package/dist/components/organisms/DialogDeleteConfirm/DialogDeleteConfirm.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import Button from '../../atoms/Button/Button';
+import { Text } from '../../atoms/Typography/Typography';
+import { DialogBookingConfirm } from '../DialogBookingConfirm';
+export var DialogDeleteConfirm = function (props) {
+    var open = props.open, setOpen = props.setOpen, message = props.message, title = props.title, _a = props.cancelText, cancelText = _a === void 0 ? 'Cancel' : _a, _b = props.okText, okText = _b === void 0 ? 'Delete' : _b, _c = props.okVariant, okVariant = _c === void 0 ? 'destructive' : _c, onOk = props.onOk, onCancel = props.onCancel;
+    return (_jsx(DialogBookingConfirm, { open: open, setOpen: setOpen, title: title, className: "!max-w-[500px]", closeOnOverlayClick: true, children: _jsxs("div", { className: "space-y-9", children: [_jsx(Text, { variant: "medium", size: "sm", leading: "4", children: _jsx("span", { dangerouslySetInnerHTML: { __html: message } }) }), _jsxs("div", { className: "grid grid-cols-2 gap-x-4", children: [_jsx(Button, { variant: "outline-secondary", onClick: function () {
+                                setOpen(false);
+                                onCancel === null || onCancel === void 0 ? void 0 : onCancel();
+                            }, children: cancelText }), _jsx(Button, { variant: okVariant, onClick: onOk, children: okText })] })] }) }));
+};

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

@@ -0,0 +1,11 @@
+import React from 'react';
+export interface DialogSendingMailProps {
+    open: boolean;
+    setOpen: (open: boolean) => void;
+    children: React.ReactNode;
+    type?: 'booking' | 'quotation';
+}
+export declare const DialogSendingMail: {
+    (props: DialogSendingMailProps): import("react/jsx-runtime").JSX.Element;
+    Content: React.FC<import("./DialogSendingMailContent").DialogSendingMailContentProps>;
+};

package/dist/components/organisms/DialogSendingMail/DialogSendingMail.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { DialogBookingConfirm } from '../DialogBookingConfirm';
+import { DialogSendingMailContent } from './DialogSendingMailContent';
+export var DialogSendingMail = function (props) {
+    var open = props.open, setOpen = props.setOpen, children = props.children, _a = props.type, type = _a === void 0 ? 'booking' : _a;
+    return (_jsx(DialogBookingConfirm, { open: open, title: "Send ".concat(type, " via mail"), setOpen: setOpen, className: "!max-w-[800px]", closeOnOverlayClick: true, children: children }));
+};
+DialogSendingMail.Content = DialogSendingMailContent;

package/dist/components/organisms/DialogSendingMail/DialogSendingMailContent.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import { SendingMailSchema } from './sending-mail-schema';
+export interface DialogSendingMailContentProps {
+    userInfo: {
+        firstName: string;
+        lastName: string;
+        email: string;
+    };
+    subject: string;
+    type: 'booking' | 'quotation';
+    onSubmit: (data: SendingMailSchema) => void;
+    onPreviewAttachment?: () => void;
+    onCancel?: () => void;
+}
+export declare const DialogSendingMailContent: React.FC<DialogSendingMailContentProps>;

package/dist/components/organisms/DialogSendingMail/DialogSendingMailContent.js

@@ -0,0 +1,49 @@
+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 { zodResolver } from '@hookform/resolvers/zod';
+import { useEffect } from 'react';
+import { useForm } from 'react-hook-form';
+import Button from '../../atoms/Button/Button';
+import Input from '../../atoms/Inputs/Input/Input';
+import Textarea from '../../atoms/Inputs/Textarea/Textarea';
+import Toast from '../../molecules/Toast/Toast';
+import { Form, FormControl, FormField, FormItem, FormMessage } from '../../ui/form';
+import { sendingMailSchema } from './sending-mail-schema';
+export var DialogSendingMailContent = function (props) {
+    var userInfo = props.userInfo, subject = props.subject, type = props.type, onSubmit = props.onSubmit, onPreviewAttachment = props.onPreviewAttachment, onCancel = props.onCancel;
+    var messageText = function () {
+        var name = "".concat(userInfo.firstName, " ").concat(userInfo.lastName);
+        return "Dear Sir/Madam, \n\nPlease find your ".concat(type, " for ").concat(name, " attached here with.\nWe remain at your disposal for any questions or further clarification.\n\nKind regards,\nThe Mautourco Team");
+    };
+    var form = useForm({
+        resolver: zodResolver(sendingMailSchema),
+        defaultValues: {
+            email: userInfo.email,
+            subject: subject,
+            message: messageText(),
+        },
+    });
+    useEffect(function () {
+        form.setValue('subject', subject);
+    }, [subject]);
+    return (_jsx(Form, __assign({}, form, { children: _jsxs("form", { onSubmit: form.handleSubmit(onSubmit), children: [_jsxs("div", { className: "space-y-6", children: [_jsx(FormField, { control: form.control, name: "email", rules: { required: true }, render: function (_a) {
+                                var field = _a.field;
+                                return (_jsx(FormItem, { children: _jsxs("div", { className: "relative", children: [_jsx(FormControl, { children: _jsx(Input, __assign({ type: "email", placeholder: "Recipient *" }, field)) }), _jsx(FormMessage, { className: "absolute bottom-0 translate-y-5" })] }) }));
+                            } }), _jsx(FormField, { control: form.control, name: "subject", render: function (_a) {
+                                var field = _a.field;
+                                return (_jsx(FormItem, { children: _jsxs("div", { className: "relative", children: [_jsx(FormControl, { children: _jsx(Input, __assign({ placeholder: "Subject" }, field)) }), _jsx(FormMessage, { className: "absolute bottom-0 translate-y-5" })] }) }));
+                            } }), _jsx(FormField, { control: form.control, name: "message", rules: { required: true }, render: function (_a) {
+                                var field = _a.field;
+                                return (_jsx(FormItem, { children: _jsxs("div", { className: "relative", children: [_jsx(FormControl, { children: _jsx(Textarea, __assign({ placeholder: "Write your email here... *" }, field)) }), _jsx(FormMessage, { className: "absolute bottom-0 translate-y-4" })] }) }));
+                            } }), _jsx(Button, { type: "button", size: "sm", onClick: onPreviewAttachment, children: "Preview Attachment" })] }), _jsx(Toast, { type: "warning", className: "mt-8", text: "Disclaimer: Email formatting may appear distorted in certain older email clients (e.g Outlook Classic ). Content will remain intact, but the visual layout may differ from the original" }), _jsxs("div", { className: "flex justify-end gap-4 [&>*]:w-[250px] pb-2 pt-9", children: [_jsx(Button, { type: "button", variant: "outline-secondary", size: "sm", onClick: onCancel, children: "Cancel" }), _jsx(Button, { type: "submit", variant: "secondary", size: "sm", children: "Send" })] })] }) })));
+};

package/dist/components/organisms/DialogSendingMail/index.d.ts

@@ -0,0 +1,4 @@
+export * from './DialogSendingMail';
+export * from './sending-mail-schema';
+export type { DialogSendingMailProps } from './DialogSendingMail';
+export type { DialogSendingMailContentProps } from './DialogSendingMailContent';

package/dist/components/organisms/DialogSendingMail/index.js

@@ -0,0 +1,2 @@
+export * from './DialogSendingMail';
+export * from './sending-mail-schema';

package/dist/components/organisms/DialogSendingMail/sending-mail-schema.d.ts

@@ -0,0 +1,7 @@
+import z from 'zod';
+export declare const sendingMailSchema: z.ZodObject<{
+    email: z.ZodString;
+    subject: z.ZodOptional<z.ZodString>;
+    message: z.ZodString;
+}, z.core.$strip>;
+export type SendingMailSchema = z.infer<typeof sendingMailSchema>;

package/dist/components/organisms/DialogSendingMail/sending-mail-schema.js

@@ -0,0 +1,16 @@
+import { EMAIL_REGEX } from '../../../lib/shared-constant';
+import z from 'zod';
+export var sendingMailSchema = z.object({
+    email: z
+        .string()
+        .regex(EMAIL_REGEX, {
+        message: 'Please enter a valid email',
+    })
+        .refine(function (v) { return v !== ''; }, {
+        error: 'Email is required',
+    }),
+    subject: z.string().optional(),
+    message: z.string().refine(function (v) { return v !== ''; }, {
+        error: 'Message is required',
+    }),
+});

package/dist/components/organisms/Docket/Docket.js

@@ -1,14 +1,3 @@
-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 { useEffect, useState } from 'react';
 import '../../../styles/components/organism/docket.css';
@@ -26,27 +15,27 @@ import { TransferDocket } from '../../molecules/TransferDocket/TransferDocket';
  */
 export var DocketCollapsedHeader = function (_a) {
     var _b = _a.title, title = _b === void 0 ? 'Your quotation' : _b, onClick = _a.onClick, _c = _a.className, className = _c === void 0 ? '' : _c;
-    return (_jsxs("div", __assign({ className: "docket__collapsed-header ".concat(className), onClick: onClick, role: "button", tabIndex: 0, onKeyDown: function (e) {
+    return (_jsxs("div", { className: "docket__collapsed-header ".concat(className), onClick: onClick, role: "button", tabIndex: 0, onKeyDown: function (e) {
             if (e.key === 'Enter' || e.key === ' ') {
                 e.preventDefault();
                 onClick === null || onClick === void 0 ? void 0 : onClick();
             }
-        } }, { children: [_jsxs("div", __assign({ className: "docket__collapsed-header-title" }, { children: [_jsx(Icon, { name: "quotation", size: "lg" }), _jsx("h2", __assign({ className: "docket__collapsed-header-title-text" }, { children: title }))] })), _jsx(Icon, { name: "eye", size: "lg" })] })));
+        }, children: [_jsxs("div", { className: "docket__collapsed-header-title", children: [_jsx(Icon, { name: "quotation", size: "lg" }), _jsx("h2", { className: "docket__collapsed-header-title-text", children: title })] }), _jsx(Icon, { name: "eye", size: "lg" })] }));
 };
 /**
  * Empty state component for docket when no content is provided
  */
 export var DocketEmptyState = function (_a) {
     var _b = _a.className, className = _b === void 0 ? '' : _b;
-    return (_jsx("div", __assign({ className: "docket__empty-state ".concat(className) }, { children: _jsxs("div", __assign({ className: "docket__empty-state-content" }, { children: [_jsx("div", __assign({ className: "docket__empty-state-illustration" }, { children: _jsx("img", { src: "/images/docket-empty-illustration.svg", alt: "Empty docket illustration", className: "docket__empty-state-image" }) })), _jsxs("p", __assign({ className: "docket__empty-state-text" }, { children: [_jsx("span", __assign({ className: "docket__empty-state-text-bold" }, { children: "Start by adding a service here\u2014" })), _jsx("span", __assign({ className: "docket__empty-state-text-regular" }, { children: "you'll be able to create and compare multiple quotations." }))] }))] })) })));
+    return (_jsx("div", { className: "docket__empty-state ".concat(className), children: _jsxs("div", { className: "docket__empty-state-content", children: [_jsx("div", { className: "docket__empty-state-illustration", children: _jsx("img", { src: "/images/docket-empty-illustration.svg", alt: "Empty docket illustration", className: "docket__empty-state-image" }) }), _jsxs("p", { className: "docket__empty-state-text", children: [_jsx("span", { className: "docket__empty-state-text-bold", children: "Start by adding a service here\u2014" }), _jsx("span", { className: "docket__empty-state-text-regular", children: "you'll be able to create and compare multiple quotations." })] })] }) }));
 };
 /**
  * DocketHeader component for the docket title and more options button
  */
 export var DocketHeader = function (_a) {
     var _b = _a.title, title = _b === void 0 ? 'Your quotation' : _b, moreOptions = _a.moreOptions, onMoreOptionsClick = _a.onMoreOptionsClick, _c = _a.className, className = _c === void 0 ? '' : _c;
-    var chipTrigger = (_jsx(Chip, __assign({ trailingIcon: "chevron-down", className: "docket__header-more-options" }, { children: "More options" })));
-    return (_jsxs("div", __assign({ className: "docket__header ".concat(className) }, { children: [_jsxs("div", __assign({ className: "docket__header-title" }, { children: [_jsx(Icon, { name: "quotation", size: "lg" }), _jsx("h2", __assign({ className: "docket__header-title-text" }, { children: title }))] })), moreOptions && moreOptions.length > 0 ? (_jsx(ActionDropdown, __assign({ data: moreOptions, maxWidth: "200px" }, { children: chipTrigger }))) : onMoreOptionsClick ? (_jsx("div", __assign({ onClick: onMoreOptionsClick }, { children: chipTrigger }))) : null] })));
+    var chipTrigger = (_jsx(Chip, { trailingIcon: "chevron-down", className: "docket__header-more-options", children: "More options" }));
+    return (_jsxs("div", { className: "docket__header ".concat(className), children: [_jsxs("div", { className: "docket__header-title", children: [_jsx(Icon, { name: "quotation", size: "lg" }), _jsx("h2", { className: "docket__header-title-text", children: title })] }), moreOptions && moreOptions.length > 0 ? (_jsx(ActionDropdown, { data: moreOptions, maxWidth: "200px", children: chipTrigger })) : onMoreOptionsClick ? (_jsx("div", { onClick: onMoreOptionsClick, children: chipTrigger })) : null] }));
 };
 /**
  * DocketFooter component for action buttons
@@ -54,7 +43,7 @@ export var DocketHeader = function (_a) {
 export var DocketFooter = function (_a) {
     var _b = _a.mode, mode = _b === void 0 ? 'multiple' : _b, onAddNewQuoteClick = _a.onAddNewQuoteClick, onViewClick = _a.onViewClick, onSaveClick = _a.onSaveClick, onBookNowClick = _a.onBookNowClick, _c = _a.className, className = _c === void 0 ? '' : _c;
     var isSingleMode = mode === 'single';
-    return (_jsxs("div", __assign({ className: "docket__footer ".concat(className) }, { children: [!isSingleMode && onAddNewQuoteClick && (_jsx(Button, __assign({ variant: "outline-secondary", size: "sm", leadingIcon: "plus", onClick: onAddNewQuoteClick, className: "docket__footer-button docket__footer-button--full" }, { children: "Add new quote" }))), _jsxs("div", __assign({ className: "docket__footer-actions" }, { children: [!isSingleMode && onViewClick && (_jsx(Button, __assign({ variant: "outline-secondary", size: "sm", onClick: onViewClick, className: "docket__footer-button" }, { children: "View" }))), onSaveClick && (_jsx(Button, __assign({ variant: "outline-secondary", size: "sm", onClick: onSaveClick, className: "docket__footer-button" }, { children: "Save" }))), onBookNowClick && (_jsx(Button, __assign({ variant: "secondary", size: "sm", onClick: onBookNowClick, className: "docket__footer-button docket__footer-button--primary" }, { children: "Book now" })))] }))] })));
+    return (_jsxs("div", { className: "docket__footer ".concat(className), children: [!isSingleMode && onAddNewQuoteClick && (_jsx(Button, { variant: "outline-secondary", size: "sm", leadingIcon: "plus", onClick: onAddNewQuoteClick, className: "docket__footer-button docket__footer-button--full", children: "Add new quote" })), _jsxs("div", { className: "docket__footer-actions", children: [!isSingleMode && onViewClick && (_jsx(Button, { variant: "outline-secondary", size: "sm", onClick: onViewClick, className: "docket__footer-button", children: "View" })), onSaveClick && (_jsx(Button, { variant: "outline-secondary", size: "sm", onClick: onSaveClick, className: "docket__footer-button", children: "Save" })), onBookNowClick && (_jsx(Button, { variant: "secondary", size: "sm", onClick: onBookNowClick, className: "docket__footer-button docket__footer-button--primary", children: "Book now" }))] })] }));
 };
 /**
  * Docket is a container component for displaying quotation/docket information.
@@ -121,13 +110,13 @@ export var Docket = function (_a) {
         if (renderedServices.length === 0) {
             return _jsx(DocketEmptyState, {});
         }
-        return _jsx("div", __assign({ className: "docket__services" }, { children: renderedServices }));
+        return _jsx("div", { className: "docket__services", children: renderedServices });
     };
     // Collect all prices from all dockets
     var allPrices = dockets ? dockets.flatMap(function (docket) { return docket.prices || []; }) : [];
     var containerClasses = containerClassName
         ? "docket__container ".concat(containerClassName)
         : 'docket__container';
-    return (_jsxs("div", __assign({ className: containerClasses }, { children: [isMobile && !isOpen && (_jsx(DocketCollapsedHeader, { title: title, onClick: handleToggle })), isMobile && isOpen && (_jsxs("div", __assign({ className: "docket__mobile-wrapper" }, { children: [_jsx("div", __assign({ className: "docket__close-header" }, { children: _jsxs("div", __assign({ className: "docket__close-header-content" }, { children: [_jsx("h2", __assign({ className: "docket__close-header-text" }, { children: "Close" })), _jsx("button", __assign({ className: "docket__close-button", onClick: handleClose, "aria-label": "Close docket" }, { children: _jsx(Icon, { name: "close", size: "lg" }) }))] })) })), _jsxs("div", __assign({ className: classes, onClick: onClick, "data-testid": testId }, { children: [showHeader && (_jsx(DocketHeader, { title: title, moreOptions: moreOptions, onMoreOptionsClick: onMoreOptionsClick })), _jsx("div", __assign({ className: "docket__content" }, { children: renderContent() })), allPrices.length > 0 && (_jsx("div", __assign({ className: "docket__prices-section" }, { children: _jsx(DocketPrices, { prices: allPrices }) }))), showFooter && (_jsx(DocketFooter, { mode: mode, onAddNewQuoteClick: onAddNewQuoteClick, onViewClick: onViewClick, onSaveClick: onSaveClick, onBookNowClick: onBookNowClick }))] }))] }))), !isMobile && (_jsxs("div", __assign({ className: classes, onClick: onClick, "data-testid": testId }, { children: [showHeader && (_jsx(DocketHeader, { title: title, moreOptions: moreOptions, onMoreOptionsClick: onMoreOptionsClick })), _jsx("div", __assign({ className: "docket__content" }, { children: renderContent() })), allPrices.length > 0 && (_jsxs("div", __assign({ className: "docket__prices-section" }, { children: [_jsx(Icon, { name: "line", size: "lg" }), _jsx(DocketPrices, { prices: allPrices }), _jsx(Icon, { name: "line", size: "lg" })] }))), showFooter && (_jsx(DocketFooter, { mode: mode, onAddNewQuoteClick: onAddNewQuoteClick, onViewClick: onViewClick, onSaveClick: onSaveClick, onBookNowClick: onBookNowClick }))] })))] })));
+    return (_jsxs("div", { className: containerClasses, children: [isMobile && !isOpen && (_jsx(DocketCollapsedHeader, { title: title, onClick: handleToggle })), isMobile && isOpen && (_jsxs("div", { className: "docket__mobile-wrapper", children: [_jsx("div", { className: "docket__close-header", children: _jsxs("div", { className: "docket__close-header-content", children: [_jsx("h2", { className: "docket__close-header-text", children: "Close" }), _jsx("button", { className: "docket__close-button", onClick: handleClose, "aria-label": "Close docket", children: _jsx(Icon, { name: "close", size: "lg" }) })] }) }), _jsxs("div", { className: classes, onClick: onClick, "data-testid": testId, children: [showHeader && (_jsx(DocketHeader, { title: title, moreOptions: moreOptions, onMoreOptionsClick: onMoreOptionsClick })), _jsx("div", { className: "docket__content", children: renderContent() }), allPrices.length > 0 && (_jsx("div", { className: "docket__prices-section", children: _jsx(DocketPrices, { prices: allPrices }) })), showFooter && (_jsx(DocketFooter, { mode: mode, onAddNewQuoteClick: onAddNewQuoteClick, onViewClick: onViewClick, onSaveClick: onSaveClick, onBookNowClick: onBookNowClick }))] })] })), !isMobile && (_jsxs("div", { className: classes, onClick: onClick, "data-testid": testId, children: [showHeader && (_jsx(DocketHeader, { title: title, moreOptions: moreOptions, onMoreOptionsClick: onMoreOptionsClick })), _jsx("div", { className: "docket__content", children: renderContent() }), allPrices.length > 0 && (_jsxs("div", { className: "docket__prices-section", children: [_jsx(Icon, { name: "line", size: "lg" }), _jsx(DocketPrices, { prices: allPrices }), _jsx(Icon, { name: "line", size: "lg" })] })), showFooter && (_jsx(DocketFooter, { mode: mode, onAddNewQuoteClick: onAddNewQuoteClick, onViewClick: onViewClick, onSaveClick: onSaveClick, onBookNowClick: onBookNowClick }))] }))] }));
 };
 export default Docket;

package/dist/components/organisms/Footer/Footer.js

@@ -1,14 +1,3 @@
-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 { Text } from "../../atoms/Typography/Typography";
@@ -22,13 +11,13 @@ export var Footer = function (_a) {
         setOpenSection(function (prev) { return (prev === id ? null : id); });
     };
     var year = new Date().getFullYear();
-    return (_jsx("footer", __assign({ className: "footer" }, { children: _jsxs("div", __assign({ className: "footer__wrapper" }, { children: [_jsxs("div", __assign({ className: "footer__desktop" }, { children: [_jsxs("div", __assign({ className: "footer__top-row" }, { children: [_jsxs("div", __assign({ className: "footer__content-left" }, { children: [columns.map(function (col) { return (_jsxs("div", __assign({ className: "footer__column" }, { children: [_jsx(Text, __assign({ as: "h4", className: "footer__column-title" }, { children: col.title })), _jsx("div", __assign({ className: "footer__column-links" }, { children: col.links.map(function (link) { return (_jsx(Link, __assign({ href: link.href, onClick: link.onClick, theme: "dark", className: "text-xs no-underline hover:opacity-80" }, { children: link.label }), link.label)); }) }))] }), col.id)); }), _jsxs("div", __assign({ className: "footer__contact" }, { children: [_jsx(Text, __assign({ as: "h4", className: "footer__column-title" }, { children: contact.title })), _jsxs("div", __assign({ className: "footer__contact-info" }, { children: [contact.addressLines.map(function (line) { return (_jsx("p", { children: line }, line)); }), contact.phone && _jsxs("p", { children: ["Tel: ", contact.phone] }), contact.fax && _jsxs("p", { children: ["Fax: ", contact.fax] }), contact.email && (_jsx(Link, __assign({ href: "mailto:".concat(contact.email), theme: "dark", className: "text-xs no-underline" }, { children: contact.email })))] }))] })), _jsxs("div", __assign({ className: "footer__socials" }, { children: [_jsx(Text, __assign({ as: "h4", className: "footer__column-title" }, { children: "Socials" })), _jsx("div", __assign({ className: "footer__socials-icons" }, { children: socials.map(function (s) { return (_jsx("a", __assign({ href: s.href, "aria-label": s.label, className: "footer__social-link" }, { children: s.icon }), s.id)); }) }))] }))] })), logo && (_jsx("div", __assign({ className: "footer__logo-section" }, { children: _jsxs("div", __assign({ className: "footer__logo-container" }, { children: [_jsx("a", __assign({ href: homeUrl !== null && homeUrl !== void 0 ? homeUrl : "/", onClick: function (e) {
+    return (_jsx("footer", { className: "footer", children: _jsxs("div", { className: "footer__wrapper", children: [_jsxs("div", { className: "footer__desktop", children: [_jsxs("div", { className: "footer__top-row", children: [_jsxs("div", { className: "footer__content-left", children: [columns.map(function (col) { return (_jsxs("div", { className: "footer__column", children: [_jsx(Text, { as: "h4", className: "footer__column-title", children: col.title }), _jsx("div", { className: "footer__column-links", children: col.links.map(function (link) { return (_jsx(Link, { href: link.href, onClick: link.onClick, theme: "dark", className: "text-xs no-underline hover:opacity-80", children: link.label }, link.label)); }) })] }, col.id)); }), _jsxs("div", { className: "footer__contact", children: [_jsx(Text, { as: "h4", className: "footer__column-title", children: contact.title }), _jsxs("div", { className: "footer__contact-info", children: [contact.addressLines.map(function (line) { return (_jsx("p", { children: line }, line)); }), contact.phone && _jsxs("p", { children: ["Tel: ", contact.phone] }), contact.fax && _jsxs("p", { children: ["Fax: ", contact.fax] }), contact.email && (_jsx(Link, { href: "mailto:".concat(contact.email), theme: "dark", className: "text-xs no-underline", children: contact.email }))] })] }), _jsxs("div", { className: "footer__socials", children: [_jsx(Text, { as: "h4", className: "footer__column-title", children: "Socials" }), _jsx("div", { className: "footer__socials-icons", children: socials.map(function (s) { return (_jsx("a", { href: s.href, "aria-label": s.label, className: "footer__social-link", children: s.icon }, s.id)); }) })] })] }), logo && (_jsx("div", { className: "footer__logo-section", children: _jsxs("div", { className: "footer__logo-container", children: [_jsx("a", { href: homeUrl !== null && homeUrl !== void 0 ? homeUrl : "/", onClick: function (e) {
                                                     e.preventDefault();
                                                     onLinkClick === null || onLinkClick === void 0 ? void 0 : onLinkClick({ label: "Home", route: homeUrl !== null && homeUrl !== void 0 ? homeUrl : "/" });
-                                                } }, { children: logo })), _jsxs(Text, __assign({ as: "p", className: "footer__copyright" }, { children: ["\u00A9 ", year, " Mautourco, All Rights Reserved"] }))] })) })))] })), !logo && (_jsxs(Text, __assign({ as: "p", className: "footer__copyright-standalone" }, { children: ["\u00A9 ", year, " Mautourco, All Rights Reserved"] })))] })), _jsxs("div", __assign({ className: "footer__mobile" }, { children: [columns.map(function (col) { return (_jsxs("div", __assign({ className: "footer__mobile-section" }, { children: [_jsxs("button", __assign({ type: "button", onClick: function () { return toggleSection(col.id); }, className: "footer__mobile-section-button" }, { children: [_jsx("span", { children: col.title }), _jsx("span", __assign({ className: "footer__mobile-section-icon ".concat(openSection === col.id ? "footer__mobile-section-icon--rotated" : "") }, { children: _jsx(Icon, { name: "chevron-down", size: "sm", color: "white" }) }))] })), openSection === col.id && (_jsx("div", __assign({ className: "footer__mobile-section-content" }, { children: col.links.map(function (link) { return (_jsx(Link, __assign({ href: link.href, onClick: link.onClick, theme: "dark", className: "text-xs no-underline" }, { children: link.label }), link.label)); }) })))] }), col.id)); }), _jsxs("div", __assign({ className: "footer__mobile-contact" }, { children: [_jsx(Text, __assign({ as: "h4", className: "footer__mobile-contact-title" }, { children: contact.title })), _jsxs("div", __assign({ className: "footer__mobile-contact-info" }, { children: [contact.addressLines.map(function (line) { return (_jsx("p", { children: line }, line)); }), contact.phone && _jsxs("p", { children: ["Tel: ", contact.phone] }), contact.fax && _jsxs("p", { children: ["Fax: ", contact.fax] }), contact.email && (_jsx(Link, __assign({ href: "mailto:".concat(contact.email), theme: "dark", className: "text-xs no-underline" }, { children: contact.email })))] }))] })), _jsxs("div", __assign({ className: "footer__mobile-footer" }, { children: [_jsx("a", __assign({ href: homeUrl !== null && homeUrl !== void 0 ? homeUrl : "/", onClick: function (e) {
+                                                }, children: logo }), _jsxs(Text, { as: "p", className: "footer__copyright", children: ["\u00A9 ", year, " Mautourco, All Rights Reserved"] })] }) }))] }), !logo && (_jsxs(Text, { as: "p", className: "footer__copyright-standalone", children: ["\u00A9 ", year, " Mautourco, All Rights Reserved"] }))] }), _jsxs("div", { className: "footer__mobile", children: [columns.map(function (col) { return (_jsxs("div", { className: "footer__mobile-section", children: [_jsxs("button", { type: "button", onClick: function () { return toggleSection(col.id); }, className: "footer__mobile-section-button", children: [_jsx("span", { children: col.title }), _jsx("span", { className: "footer__mobile-section-icon ".concat(openSection === col.id ? "footer__mobile-section-icon--rotated" : ""), children: _jsx(Icon, { name: "chevron-down", size: "sm", color: "white" }) })] }), openSection === col.id && (_jsx("div", { className: "footer__mobile-section-content", children: col.links.map(function (link) { return (_jsx(Link, { href: link.href, onClick: link.onClick, theme: "dark", className: "text-xs no-underline", children: link.label }, link.label)); }) }))] }, col.id)); }), _jsxs("div", { className: "footer__mobile-contact", children: [_jsx(Text, { as: "h4", className: "footer__mobile-contact-title", children: contact.title }), _jsxs("div", { className: "footer__mobile-contact-info", children: [contact.addressLines.map(function (line) { return (_jsx("p", { children: line }, line)); }), contact.phone && _jsxs("p", { children: ["Tel: ", contact.phone] }), contact.fax && _jsxs("p", { children: ["Fax: ", contact.fax] }), contact.email && (_jsx(Link, { href: "mailto:".concat(contact.email), theme: "dark", className: "text-xs no-underline", children: contact.email }))] })] }), _jsxs("div", { className: "footer__mobile-footer", children: [_jsx("a", { href: homeUrl !== null && homeUrl !== void 0 ? homeUrl : "/", onClick: function (e) {
                                         e.preventDefault();
                                         onLinkClick === null || onLinkClick === void 0 ? void 0 : onLinkClick({ label: "Home", route: homeUrl !== null && homeUrl !== void 0 ? homeUrl : "/" });
-                                    } }, { children: logo })), _jsxs(Text, __assign({ as: "p", className: "footer__mobile-copyright" }, { children: ["\u00A9 ", year, " Mautourco, All Rights Reserved"] }))] }))] }))] })) })));
+                                    }, children: logo }), _jsxs(Text, { as: "p", className: "footer__mobile-copyright", children: ["\u00A9 ", year, " Mautourco, All Rights Reserved"] })] })] })] }) }));
 };
 var defaultColumns = [
     {

package/dist/components/organisms/MultipleQuotationDocket/MultipleQuotationDocket.js

@@ -1,14 +1,3 @@
-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 Button from '../../atoms/Button/Button';
 import Chip from '../../atoms/Chip/Chip';
@@ -36,10 +25,10 @@ var DocketDetails = function (_a) {
     var data = _a.data;
     var type = data.type, serviceName = data.serviceName, startDate = data.startDate, endDate = data.endDate, nights = data.nights, clientType = data.clientType, adults = data.adults, children = data.children, roomType = data.roomType, mealPlan = data.mealPlan, details = data.details, errorMessage = data.errorMessage;
     var icon = getServiceIcon(type);
-    return (_jsxs("div", __assign({ className: "multiple-quotation-docket__details" }, { children: [errorMessage && (_jsx("div", __assign({ className: "multiple-quotation-docket__error" }, { children: _jsx(Text, __assign({ variant: "bold", size: "sm", color: "state-error" }, { children: errorMessage })) }))), serviceName && (_jsx("div", __assign({ className: "multiple-quotation-docket__service-name" }, { children: _jsx(Text, __assign({ variant: "bold", size: "base" }, { children: serviceName })) }))), (startDate || endDate || nights) && (_jsxs("div", __assign({ className: "multiple-quotation-docket__date-info" }, { children: [startDate && endDate && (_jsxs("div", __assign({ className: "multiple-quotation-docket__date-range" }, { children: [_jsx(TextWithIcon, __assign({ icon: "calendar-range-outline", color: "accent" }, { children: startDate })), _jsx(Icon, { name: "arrow-right-outline", size: "sm" }), _jsx(TextWithIcon, __assign({ icon: "calendar-range-outline", color: "accent" }, { children: endDate }))] }))), nights !== undefined && (_jsxs(TextWithIcon, __assign({ icon: "night", color: "subtle" }, { children: [nights, " nights"] })))] }))), (clientType || adults || children) && (_jsxs("div", __assign({ className: "multiple-quotation-docket__client-info" }, { children: [clientType && (_jsxs("div", __assign({ className: "multiple-quotation-docket__client-type" }, { children: [_jsx(Text, __assign({ variant: "bold", size: "sm", color: "subtle" }, { children: "Client type:" })), _jsx(Text, __assign({ variant: "medium", size: "sm", color: "subtle" }, { children: clientType }))] }))), _jsxs("div", __assign({ className: "multiple-quotation-docket__guests" }, { children: [adults !== undefined && (_jsxs(TextWithIcon, __assign({ icon: "user", color: "subtle" }, { children: [adults, " Adults"] }))), children && children.length > 0 && (_jsx("div", __assign({ className: "multiple-quotation-docket__children" }, { children: children.map(function (child, index) { return (_jsxs("div", __assign({ className: "multiple-quotation-docket__child" }, { children: [_jsx(TextWithIcon, __assign({ icon: "user", color: "subtle" }, { children: _jsxs("span", { children: [_jsx("span", { children: "1 Child " }), _jsxs("span", __assign({ className: "multiple-quotation-docket__child-age" }, { children: ["(", child.age, " y.o)"] }))] }) })), index < children.length - 1 && (_jsx("div", { className: "multiple-quotation-docket__divider" }))] }), index)); }) })))] }))] }))), (roomType || mealPlan) && (_jsxs("div", __assign({ className: "multiple-quotation-docket__room-info" }, { children: [roomType && (_jsx(TextWithIcon, __assign({ icon: "accom", color: "subtle" }, { children: roomType }))), mealPlan && (_jsxs("div", __assign({ className: "multiple-quotation-docket__meal-plan" }, { children: [_jsx(TextWithIcon, __assign({ icon: "utensils", color: "subtle" }, { children: "Meal-Plan" })), _jsx("div", { className: "multiple-quotation-docket__divider" }), _jsx(Text, __assign({ variant: "medium", size: "sm", color: "subtle" }, { children: mealPlan }))] })))] }))), details && details.length > 0 && (_jsx("div", __assign({ className: "multiple-quotation-docket__additional-details" }, { children: details.map(function (detail, index) { return (_jsxs(TextWithIcon, __assign({ icon: detail.icon, color: "subtle" }, { children: [detail.label, ": ", detail.value] }), index)); }) })))] })));
+    return (_jsxs("div", { className: "multiple-quotation-docket__details", children: [errorMessage && (_jsx("div", { className: "multiple-quotation-docket__error", children: _jsx(Text, { variant: "bold", size: "sm", color: "state-error", children: errorMessage }) })), serviceName && (_jsx("div", { className: "multiple-quotation-docket__service-name", children: _jsx(Text, { variant: "bold", size: "base", children: serviceName }) })), (startDate || endDate || nights) && (_jsxs("div", { className: "multiple-quotation-docket__date-info", children: [startDate && endDate && (_jsxs("div", { className: "multiple-quotation-docket__date-range", children: [_jsx(TextWithIcon, { icon: "calendar-range-outline", color: "accent", children: startDate }), _jsx(Icon, { name: "arrow-right-outline", size: "sm" }), _jsx(TextWithIcon, { icon: "calendar-range-outline", color: "accent", children: endDate })] })), nights !== undefined && (_jsxs(TextWithIcon, { icon: "night", color: "subtle", children: [nights, " nights"] }))] })), (clientType || adults || children) && (_jsxs("div", { className: "multiple-quotation-docket__client-info", children: [clientType && (_jsxs("div", { className: "multiple-quotation-docket__client-type", children: [_jsx(Text, { variant: "bold", size: "sm", color: "subtle", children: "Client type:" }), _jsx(Text, { variant: "medium", size: "sm", color: "subtle", children: clientType })] })), _jsxs("div", { className: "multiple-quotation-docket__guests", children: [adults !== undefined && (_jsxs(TextWithIcon, { icon: "user", color: "subtle", children: [adults, " Adults"] })), children && children.length > 0 && (_jsx("div", { className: "multiple-quotation-docket__children", children: children.map(function (child, index) { return (_jsxs("div", { className: "multiple-quotation-docket__child", children: [_jsx(TextWithIcon, { icon: "user", color: "subtle", children: _jsxs("span", { children: [_jsx("span", { children: "1 Child " }), _jsxs("span", { className: "multiple-quotation-docket__child-age", children: ["(", child.age, " y.o)"] })] }) }), index < children.length - 1 && (_jsx("div", { className: "multiple-quotation-docket__divider" }))] }, index)); }) }))] })] })), (roomType || mealPlan) && (_jsxs("div", { className: "multiple-quotation-docket__room-info", children: [roomType && (_jsx(TextWithIcon, { icon: "accom", color: "subtle", children: roomType })), mealPlan && (_jsxs("div", { className: "multiple-quotation-docket__meal-plan", children: [_jsx(TextWithIcon, { icon: "utensils", color: "subtle", children: "Meal-Plan" }), _jsx("div", { className: "multiple-quotation-docket__divider" }), _jsx(Text, { variant: "medium", size: "sm", color: "subtle", children: mealPlan })] }))] })), details && details.length > 0 && (_jsx("div", { className: "multiple-quotation-docket__additional-details", children: details.map(function (detail, index) { return (_jsxs(TextWithIcon, { icon: detail.icon, color: "subtle", children: [detail.label, ": ", detail.value] }, index)); }) }))] }));
 };
 export var MultipleQuotationDocket = function (_a) {
     var _b = _a.title, title = _b === void 0 ? 'Your quotation' : _b, services = _a.services, totalPrices = _a.totalPrices, onMoreOptionsClick = _a.onMoreOptionsClick, onAddNewQuoteClick = _a.onAddNewQuoteClick, onViewClick = _a.onViewClick, onSaveClick = _a.onSaveClick, onBookNowClick = _a.onBookNowClick, _c = _a.className, className = _c === void 0 ? '' : _c;
-    return (_jsxs(CardContainer, __assign({ spacing: "chill", className: "multiple-quotation-docket ".concat(className) }, { children: [_jsxs("div", __assign({ className: "multiple-quotation-docket__header" }, { children: [_jsxs("div", __assign({ className: "multiple-quotation-docket__title" }, { children: [_jsx(Icon, { name: "quotation", size: "lg" }), _jsx(Heading, __assign({ level: 4, variant: "bold", className: "multiple-quotation-docket__title-text" }, { children: title }))] })), onMoreOptionsClick && (_jsx(Chip, __assign({ type: "outline", color: "neutral", size: "sm", trailingIcon: "chevron-down", onClick: onMoreOptionsClick, className: "multiple-quotation-docket__more-options" }, { children: "More options" })))] })), _jsx("div", __assign({ className: "multiple-quotation-docket__services" }, { children: services.map(function (service, index) { return (_jsxs("div", __assign({ className: "multiple-quotation-docket__service" }, { children: [_jsxs("div", __assign({ className: "multiple-quotation-docket__service-header" }, { children: [_jsxs("div", __assign({ className: "multiple-quotation-docket__service-title" }, { children: [_jsx("div", { className: "multiple-quotation-docket__section-bar" }), _jsx(Icon, { name: getServiceIcon(service.type), size: "sm", color: "var(--color-icon-branded, #0f7173)" }), _jsx(Text, __assign({ variant: "bold", size: "sm", color: "accent" }, { children: service.type }))] })), _jsxs(Chip, __assign({ type: "filled", color: "accent", size: "sm" }, { children: [service.currency, " ", service.price] }))] })), _jsx(DocketDetails, { data: service })] }), index)); }) })), totalPrices.length > 0 && (_jsxs("div", __assign({ className: "multiple-quotation-docket__total" }, { children: [_jsx("div", { className: "multiple-quotation-docket__total-line" }), _jsxs("div", __assign({ className: "multiple-quotation-docket__total-content" }, { children: [_jsx(Text, __assign({ variant: "bold", size: "sm" }, { children: "Total :" })), _jsx("div", __assign({ className: "multiple-quotation-docket__total-prices" }, { children: totalPrices.map(function (total, index) { return (_jsxs(Text, __assign({ variant: "bold", size: "sm" }, { children: [total.currency, " ", total.amount] }), index)); }) }))] })), _jsx("div", { className: "multiple-quotation-docket__total-line" })] }))), _jsxs("div", __assign({ className: "multiple-quotation-docket__actions" }, { children: [onAddNewQuoteClick && (_jsx(Button, __assign({ variant: "outline-secondary", size: "sm", leadingIcon: "plus", onClick: onAddNewQuoteClick, className: "multiple-quotation-docket__action-button" }, { children: "Add new quote" }))), _jsxs("div", __assign({ className: "multiple-quotation-docket__action-group" }, { children: [onViewClick && (_jsx(Button, __assign({ variant: "outline-secondary", size: "sm", onClick: onViewClick, className: "multiple-quotation-docket__action-button multiple-quotation-docket__action-button--flex" }, { children: "View" }))), onSaveClick && (_jsx(Button, __assign({ variant: "outline-secondary", size: "sm", onClick: onSaveClick, className: "multiple-quotation-docket__action-button multiple-quotation-docket__action-button--flex" }, { children: "Save" }))), onBookNowClick && (_jsx(Button, __assign({ variant: "primary", size: "sm", onClick: onBookNowClick, className: "multiple-quotation-docket__action-button multiple-quotation-docket__action-button--book" }, { children: "Book now" })))] }))] }))] })));
+    return (_jsxs(CardContainer, { spacing: "chill", className: "multiple-quotation-docket ".concat(className), children: [_jsxs("div", { className: "multiple-quotation-docket__header", children: [_jsxs("div", { className: "multiple-quotation-docket__title", children: [_jsx(Icon, { name: "quotation", size: "lg" }), _jsx(Heading, { level: 4, variant: "bold", className: "multiple-quotation-docket__title-text", children: title })] }), onMoreOptionsClick && (_jsx(Chip, { type: "outline", color: "neutral", size: "sm", trailingIcon: "chevron-down", onClick: onMoreOptionsClick, className: "multiple-quotation-docket__more-options", children: "More options" }))] }), _jsx("div", { className: "multiple-quotation-docket__services", children: services.map(function (service, index) { return (_jsxs("div", { className: "multiple-quotation-docket__service", children: [_jsxs("div", { className: "multiple-quotation-docket__service-header", children: [_jsxs("div", { className: "multiple-quotation-docket__service-title", children: [_jsx("div", { className: "multiple-quotation-docket__section-bar" }), _jsx(Icon, { name: getServiceIcon(service.type), size: "sm", color: "var(--color-icon-branded, #0f7173)" }), _jsx(Text, { variant: "bold", size: "sm", color: "accent", children: service.type })] }), _jsxs(Chip, { type: "filled", color: "accent", size: "sm", children: [service.currency, " ", service.price] })] }), _jsx(DocketDetails, { data: service })] }, index)); }) }), totalPrices.length > 0 && (_jsxs("div", { className: "multiple-quotation-docket__total", children: [_jsx("div", { className: "multiple-quotation-docket__total-line" }), _jsxs("div", { className: "multiple-quotation-docket__total-content", children: [_jsx(Text, { variant: "bold", size: "sm", children: "Total :" }), _jsx("div", { className: "multiple-quotation-docket__total-prices", children: totalPrices.map(function (total, index) { return (_jsxs(Text, { variant: "bold", size: "sm", children: [total.currency, " ", total.amount] }, index)); }) })] }), _jsx("div", { className: "multiple-quotation-docket__total-line" })] })), _jsxs("div", { className: "multiple-quotation-docket__actions", children: [onAddNewQuoteClick && (_jsx(Button, { variant: "outline-secondary", size: "sm", leadingIcon: "plus", onClick: onAddNewQuoteClick, className: "multiple-quotation-docket__action-button", children: "Add new quote" })), _jsxs("div", { className: "multiple-quotation-docket__action-group", children: [onViewClick && (_jsx(Button, { variant: "outline-secondary", size: "sm", onClick: onViewClick, className: "multiple-quotation-docket__action-button multiple-quotation-docket__action-button--flex", children: "View" })), onSaveClick && (_jsx(Button, { variant: "outline-secondary", size: "sm", onClick: onSaveClick, className: "multiple-quotation-docket__action-button multiple-quotation-docket__action-button--flex", children: "Save" })), onBookNowClick && (_jsx(Button, { variant: "primary", size: "sm", onClick: onBookNowClick, className: "multiple-quotation-docket__action-button multiple-quotation-docket__action-button--book", children: "Book now" }))] })] })] }));
 };
 export default MultipleQuotationDocket;