mautourco-components 0.2.13 → 0.2.15

package/dist/components/atoms/Icon/icons/PlusCircleIcon.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+interface PlusCircleIconProps {
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    className?: string;
+    color?: string;
+    /**
+     * Couleur par défaut si aucune couleur n'est spécifiée
+     */
+    defaultColor?: string;
+}
+declare const PlusCircleIcon: React.FC<PlusCircleIconProps>;
+export default PlusCircleIcon;

package/dist/components/atoms/Icon/icons/PlusCircleIcon.js

@@ -0,0 +1,36 @@
+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";
+var PlusCircleIcon = function (_a) {
+    var _b = _a.size, size = _b === void 0 ? 'md' : _b, _c = _a.className, className = _c === void 0 ? '' : _c, color = _a.color;
+    var getSizeClasses = function () {
+        switch (size) {
+            case 'xs':
+                return 'w-3 h-3';
+            case 'sm':
+                return 'w-4 h-4';
+            case 'md':
+                return 'w-5 h-5';
+            case 'lg':
+                return 'w-6 h-6';
+            case 'xl':
+                return 'w-8 h-8';
+            default:
+                return 'w-5 h-5';
+        }
+    };
+    var sizeClasses = getSizeClasses();
+    var colorClass = color ? "text-".concat(color) : 'text-current';
+    var classes = "".concat(sizeClasses, " ").concat(colorClass, " ").concat(className);
+    return (_jsxs("svg", __assign({ className: classes, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: [_jsx("g", __assign({ "clip-path": "url(#clip0_7074_66340)" }, { children: _jsx("path", { d: "M13.915 8.00098C13.915 4.7334 11.2666 2.08416 7.99902 2.08398C4.73134 2.08398 2.08203 4.73329 2.08203 8.00098C2.08221 11.2685 4.73145 13.917 7.99902 13.917C11.2664 13.9168 13.9149 11.2684 13.915 8.00098ZM7.24902 10.667V8.75098H5.33203C4.91793 8.75098 4.58221 8.41504 4.58203 8.00098C4.58203 7.58676 4.91782 7.25098 5.33203 7.25098H7.24902V5.33398C7.24902 4.91977 7.58481 4.58398 7.99902 4.58398C8.41309 4.58416 8.74902 4.91988 8.74902 5.33398V7.25098H10.665L10.7422 7.25488C11.1203 7.29337 11.415 7.61271 11.415 8.00098C11.4149 8.38912 11.1202 8.70862 10.7422 8.74707L10.665 8.75098H8.74902V10.667C8.74902 11.0811 8.41309 11.4168 7.99902 11.417C7.58481 11.417 7.24902 11.0812 7.24902 10.667ZM15.415 8.00098C15.4149 12.0968 12.0949 15.4168 7.99902 15.417C3.90302 15.417 0.582208 12.0969 0.582031 8.00098C0.582031 3.90487 3.90291 0.583984 7.99902 0.583984C12.095 0.584161 15.415 3.90497 15.415 8.00098Z", fill: "white" }) })), _jsx("defs", { children: _jsx("clipPath", __assign({ id: "clip0_7074_66340" }, { children: _jsx("rect", { width: "16", height: "16", fill: "white" }) })) })] })));
+};
+export default PlusCircleIcon;

package/dist/components/atoms/Icon/icons/QuotationIcon.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+interface QuotationIconProps {
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    className?: string;
+    color?: string;
+}
+declare const QuotationIcon: React.FC<QuotationIconProps>;
+export default QuotationIcon;

package/dist/components/atoms/Icon/icons/QuotationIcon.js

@@ -0,0 +1,36 @@
+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";
+var QuotationIcon = function (_a) {
+    var _b = _a.size, size = _b === void 0 ? 'md' : _b, _c = _a.className, className = _c === void 0 ? '' : _c, color = _a.color;
+    var getSizeClasses = function () {
+        switch (size) {
+            case 'xs':
+                return 'w-3 h-3';
+            case 'sm':
+                return 'w-4 h-4';
+            case 'md':
+                return 'w-5 h-5';
+            case 'lg':
+                return 'w-6 h-6';
+            case 'xl':
+                return 'w-8 h-8';
+            default:
+                return 'w-5 h-5';
+        }
+    };
+    var sizeClasses = getSizeClasses();
+    var colorClass = color ? "text-".concat(color) : 'text-current';
+    var classes = "".concat(sizeClasses, " ").concat(colorClass, " ").concat(className);
+    return (_jsx("svg", __assign({ className: classes, viewBox: "0 0 22 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: _jsx("path", { d: "M10 16V17C10 17.3444 9.93703 17.6814 9.82422 18H19C19.2652 18 19.5195 17.8946 19.707 17.707C19.8946 17.5195 20 17.2652 20 17V16H10ZM14 9C14.5523 9 15 9.44771 15 10C15 10.5523 14.5523 11 14 11H9C8.44771 11 8 10.5523 8 10C8 9.44771 8.44771 9 9 9H14ZM14 5C14.5523 5 15 5.44772 15 6C15 6.55228 14.5523 7 14 7H9C8.44771 7 8 6.55228 8 6C8 5.44772 8.44771 5 9 5H14ZM4 3C4 2.73478 3.89457 2.4805 3.70703 2.29297C3.54289 2.12883 3.32763 2.02757 3.09863 2.00488L3 2C2.73478 2 2.4805 2.10543 2.29297 2.29297C2.10543 2.4805 2 2.73478 2 3V5H4V3ZM6 17L6.00488 17.0986C6.02757 17.3276 6.12883 17.5429 6.29297 17.707C6.48051 17.8946 6.73478 18 7 18C7.26522 18 7.51949 17.8946 7.70703 17.707C7.89457 17.5195 8 17.2652 8 17V16C8 15.4696 8.21087 14.961 8.58594 14.5859C8.96101 14.2109 9.46957 14 10 14H17V3C17 2.73478 16.8946 2.48051 16.707 2.29297C16.5195 2.10543 16.2652 2 16 2H5.82422C5.93703 2.31859 6 2.65558 6 3V17ZM19 14H20C20.5304 14 21.039 14.2109 21.4141 14.5859C21.7891 14.961 22 15.4696 22 16V17C22 17.7957 21.6837 18.5585 21.1211 19.1211C20.5585 19.6837 19.7957 20 19 20H7C6.20435 20 5.44151 19.6837 4.87891 19.1211C4.3163 18.5585 4 17.7957 4 17V7H2C1.46957 7 0.96101 6.78913 0.585938 6.41406C0.210865 6.03899 0 5.53043 0 5V3C0 2.20435 0.316297 1.44152 0.878906 0.878906C1.3711 0.386708 2.01649 0.0829076 2.70312 0.0146484L3 0H16C16.7957 0 17.5585 0.316297 18.1211 0.878906C18.6837 1.44151 19 2.20435 19 3V14Z", fill: "currentColor" }) })));
+};
+export default QuotationIcon;

package/dist/components/atoms/Icon/icons/registry.d.ts

@@ -48,6 +48,7 @@ export declare const ICONS: {
     readonly linkedin: IconComponent;
     readonly plus: IconComponent;
     readonly minus: IconComponent;
+    readonly quotation: IconComponent;
     readonly home: IconComponent;
     readonly plane: IconComponent;
     readonly ship: IconComponent;
@@ -62,5 +63,6 @@ export declare const ICONS: {
     readonly bus: IconComponent;
     readonly map: IconComponent;
     readonly wallet: IconComponent;
+    readonly 'plus-circle': IconComponent;
 };
 export type IconName = keyof typeof ICONS;

package/dist/components/atoms/Icon/icons/registry.js

@@ -45,7 +45,9 @@ import NightIcon from './NightIcon';
 import PlaneIcon from './PlaneIcon';
 import PlaneLandingOutlineIcon from './PlaneLandingOutlineIcon';
 import PlaneTakeoffOutlineIcon from './PlaneTakeoffOutlineIcon';
+import PlusCircleIcon from './PlusCircleIcon';
 import PlusIcon from './PlusIcon';
+import QuotationIcon from './QuotationIcon';
 import Search from './Search';
 import Settings from './Settings';
 import ShipIcon from './ShipIcon';
@@ -104,6 +106,7 @@ export var ICONS = {
     linkedin: LinkedInIcon,
     plus: PlusIcon,
     minus: MinusIcon,
+    quotation: QuotationIcon,
     home: HomeIcon,
     plane: PlaneIcon,
     ship: ShipIcon,
@@ -118,4 +121,5 @@ export var ICONS = {
     bus: BusIcon,
     map: MapIcon,
     wallet: WalletIcon,
+    'plus-circle': PlusCircleIcon,
 };

package/dist/components/atoms/Inputs/DropdownInput/DropdownInput.js

@@ -10,12 +10,13 @@ var __assign = (this && this.__assign) || function () {
     return __assign.apply(this, arguments);
 };
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from 'react';
+import { useEffect, useRef, useState } from 'react';
 import Icon from '../../Icon/Icon';
 import Spinner from '../../Spinner/Spinner';
 var DropdownInput = function (_a) {
     var _b = _a.placeholder, placeholder = _b === void 0 ? 'Select item name' : _b, value = _a.value, _c = _a.state, state = _c === void 0 ? 'default' : _c, onClick = _a.onClick, _d = _a.className, className = _d === void 0 ? '' : _d, _e = _a.options, options = _e === void 0 ? [] : _e, onSelect = _a.onSelect;
     var _f = useState(false), isOpen = _f[0], setIsOpen = _f[1];
+    var dropdownRef = useRef(null);
     var handleClick = function () {
         if (state === 'disabled' || state === 'loading')
             return;
@@ -47,7 +48,18 @@ var DropdownInput = function (_a) {
         }
         return (_jsx(Icon, { name: isOpen ? 'chevron-up' : 'chevron-down', size: "sm", className: "dropdown-input__icon dropdown-input__icon--chevron" }));
     };
-    var displayText = state === 'loading' ? 'Loading...' : (value || placeholder);
-    return (_jsxs("div", __assign({ className: "dropdown-container ".concat(className) }, { children: [_jsxs("div", __assign({ className: "dropdown-input ".concat(getStateClasses()), onClick: handleClick }, { children: [_jsx("span", __assign({ className: "dropdown-input__text" }, { children: displayText })), getIcon()] })), isOpen && options.length > 0 && (_jsx("div", __assign({ className: "dropdown-menu" }, { children: options.map(function (option, index) { return (_jsx("div", __assign({ className: "dropdown-option", onClick: function () { return handleOptionSelect(option); } }, { children: option }), index)); }) })))] })));
+    var displayText = state === 'loading' ? 'Loading...' : value || placeholder;
+    useEffect(function () {
+        var handleClickOutside = function (event) {
+            if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
+                setIsOpen(false);
+            }
+        };
+        document.addEventListener('mousedown', handleClickOutside);
+        return function () {
+            document.removeEventListener('mousedown', handleClickOutside);
+        };
+    }, []);
+    return (_jsxs("div", __assign({ ref: dropdownRef, className: "dropdown-container ".concat(className) }, { children: [_jsxs("div", __assign({ className: "dropdown-input ".concat(getStateClasses()), onClick: handleClick }, { children: [_jsx("span", __assign({ className: "dropdown-input__text" }, { children: displayText })), getIcon()] })), isOpen && options.length > 0 && (_jsx("div", __assign({ className: "dropdown-menu" }, { children: options.map(function (option, index) { return (_jsx("div", __assign({ className: "dropdown-option", onClick: function () { return handleOptionSelect(option); } }, { children: option }), index)); }) })))] })));
 };
 export default DropdownInput;

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

@@ -0,0 +1,64 @@
+import React from 'react';
+import { IconName } from '../../atoms/Icon/Icon';
+export type DocketServiceType = 'Accommodation' | 'Transfer' | 'Handling fee' | 'Excursion' | 'Other Services';
+export interface DocketDetailsData {
+    /** Service type */
+    type: DocketServiceType;
+    /** Service name/title */
+    serviceName?: string;
+    /** Price for this service */
+    price: string;
+    /** Currency for the price */
+    currency: string;
+    /** Start date */
+    startDate?: string;
+    /** End date */
+    endDate?: string;
+    /** Number of nights */
+    nights?: number;
+    /** Client type */
+    clientType?: string;
+    /** Adults count */
+    adults?: number;
+    /** Children details */
+    children?: Array<{
+        age: number;
+    }>;
+    /** Room type */
+    roomType?: string;
+    /** Meal plan */
+    mealPlan?: string;
+    /** Additional details to display */
+    details?: Array<{
+        icon: IconName;
+        label: string;
+        value: string;
+    }>;
+    /** Error message to display (e.g., "Please select your second room") */
+    errorMessage?: string;
+}
+export interface MultipleQuotationDocketProps {
+    /** Title of the quotation */
+    title?: string;
+    /** List of service details */
+    services: DocketDetailsData[];
+    /** Total prices in different currencies */
+    totalPrices: Array<{
+        currency: string;
+        amount: string;
+    }>;
+    /** Callback when "More options" is clicked */
+    onMoreOptionsClick?: () => void;
+    /** Callback when "Add new quote" is clicked */
+    onAddNewQuoteClick?: () => void;
+    /** Callback when "View" is clicked */
+    onViewClick?: () => void;
+    /** Callback when "Save" is clicked */
+    onSaveClick?: () => void;
+    /** Callback when "Book now" is clicked */
+    onBookNowClick?: () => void;
+    /** Additional CSS classes */
+    className?: string;
+}
+export declare const MultipleQuotationDocket: React.FC<MultipleQuotationDocketProps>;
+export default MultipleQuotationDocket;

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

@@ -0,0 +1,45 @@
+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';
+import Icon from '../../atoms/Icon/Icon';
+import { Heading, Text } from '../../atoms/Typography/Typography';
+import TextWithIcon from '../../molecules/TextWithIcon/TextWithIcon';
+import CardContainer from '../CardContainer/CardContainer';
+var getServiceIcon = function (type) {
+    switch (type) {
+        case 'Accommodation':
+            return 'accom';
+        case 'Transfer':
+            return 'bus';
+        case 'Excursion':
+            return 'map-pin';
+        case 'Handling fee':
+            return 'wallet';
+        case 'Other Services':
+            return 'more';
+        default:
+            return 'more';
+    }
+};
+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)); }) })))] })));
+};
+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" })))] }))] }))] })));
+};
+export default MultipleQuotationDocket;

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

@@ -0,0 +1,2 @@
+export { MultipleQuotationDocket, default } from './MultipleQuotationDocket';
+export type { DocketDetailsData, DocketServiceType, MultipleQuotationDocketProps, } from './MultipleQuotationDocket';

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

@@ -0,0 +1 @@
+export { MultipleQuotationDocket, default } from './MultipleQuotationDocket';