mautourco-components 0.2.19 → 0.2.21

package/dist/components/molecules/BookingPax/BookingPaxLayout/BookingPaxLayout.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import { IconName } from '@/src/components/atoms/Icon/Icon';
+import './BookingPaxLayout.css';
+export interface BookingPaxLayoutProps {
+    title: React.ReactNode;
+    icon: IconName;
+    header?: React.ReactNode;
+    children?: React.ReactNode;
+    className?: string;
+}
+export declare const BookingPaxLayout: React.FC<BookingPaxLayoutProps>;

package/dist/components/molecules/BookingPax/BookingPaxLayout/BookingPaxLayout.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 './BookingPaxLayout.css';
+export var BookingPaxLayout = function (props) {
+    var title = props.title, icon = props.icon, header = props.header, children = props.children, className = props.className;
+    return (_jsxs("div", __assign({ className: cn('booking-pax-layout', className) }, { children: [_jsxs("div", __assign({ className: "booking-pax-layout__header" }, { children: [_jsx(ServiceTitle, { title: title, icon: icon }), header] })), _jsx("div", __assign({ className: "booking-pax-layout__content" }, { children: children }))] })));
+};

package/dist/components/molecules/BookingPax/BookingPaxRemarks.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+export interface BookingPaxRemarksProps {
+    onChange?: (value: string) => void;
+}
+export declare const BookingPaxRemarks: React.FC<BookingPaxRemarksProps>;

package/dist/components/molecules/BookingPax/BookingPaxRemarks.js

@@ -0,0 +1,37 @@
+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, useRef, useState } from 'react';
+import Textarea from '../../atoms/Inputs/Textarea/Textarea';
+import { Text } from '../../atoms/Typography/Typography';
+export var BookingPaxRemarks = function (_a) {
+    var onChange = _a.onChange;
+    var _b = useState(''), remarks = _b[0], setRemarks = _b[1];
+    var textareaRef = useRef(null);
+    var adjustHeight = function () {
+        var textarea = textareaRef.current;
+        if (textarea) {
+            textarea.style.height = 'auto';
+            textarea.style.height = "".concat(textarea.scrollHeight, "px");
+        }
+    };
+    useEffect(function () {
+        adjustHeight();
+    }, [remarks]);
+    var handleChange = function (e) {
+        var value = e.target.value;
+        setRemarks(value);
+        onChange === null || onChange === void 0 ? void 0 : onChange(value);
+        adjustHeight();
+    };
+    return (_jsxs("div", __assign({ className: "space-y-2" }, { children: [_jsx(Text, __assign({ size: "sm" }, { children: "Remarks" })), _jsx(Textarea, { ref: textareaRef, placeholder: "Do you have any remarks?", onInput: handleChange, className: "resize-none overflow-hidden", rows: 1, style: { minHeight: '44px', height: '44px', lineHeight: '1.5' } })] })));
+};

package/dist/components/molecules/BookingPax/BookingPaxTransfer.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+import { DateTimePickerProps } from '../../organisms/DateTimePicker/DateTimePicker';
+import { BookingPaxClientInfo, BookingPaxClientProps } from './BookingPaxClient/BookingPaxClient';
+export type ExcursionType = 'sea' | 'land' | 'catamaran';
+export interface BookingPaxTransferProps extends Pick<BookingPaxClientProps, 'selectedClientsInfoIds' | 'onPaxChange'> {
+    clientsInfo: BookingPaxClientInfo[];
+    type: 'ARV' | 'DEP' | 'INH';
+    from: string;
+    to: string;
+    isSubmitted?: boolean;
+    paxCount: number;
+    maxPaxCount?: number;
+    onRemarkChange?: (value: string) => void;
+    onFlightNumberChange?: (value: string) => void;
+    onTimeChange?: DateTimePickerProps['onValueChange'];
+    onError?: (hasError: boolean) => void;
+}
+export declare const BookingPaxTransfer: React.FC<BookingPaxTransferProps>;

package/dist/components/molecules/BookingPax/BookingPaxTransfer.js

@@ -0,0 +1,40 @@
+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, Fragment as _Fragment } from "react/jsx-runtime";
+import useBookingPax from '@/src/hooks/useBookingPax';
+import { useCallback, useEffect, useMemo } from 'react';
+import Input from '../../atoms/Inputs/Input/Input';
+import { Text } from '../../atoms/Typography/Typography';
+import DateTimePicker from '../../organisms/DateTimePicker/DateTimePicker';
+import { BookingPaxClient, } from './BookingPaxClient/BookingPaxClient';
+import { BookingPaxHeader } from './BookingPaxHeader';
+import { BookingPaxLayout } from './BookingPaxLayout/BookingPaxLayout';
+import { BookingPaxRemarks } from './BookingPaxRemarks';
+var mapType = {
+    ARV: 'Arrival',
+    DEP: 'Departure',
+    INH: 'Inter-Hotel',
+};
+export var BookingPaxTransfer = function (props) {
+    var from = props.from, to = props.to, type = props.type, clientsInfo = props.clientsInfo, paxCount = props.paxCount, selectedClientsInfoIds = props.selectedClientsInfoIds, isSubmitted = props.isSubmitted, onPaxChange = props.onPaxChange, onRemarkChange = props.onRemarkChange, onTimeChange = props.onTimeChange, onError = props.onError, onFlightNumberChange = props.onFlightNumberChange;
+    var _a = useBookingPax(selectedClientsInfoIds), changeOptions = _a.changeOptions, onPaxOptionsChange = _a.onPaxOptionsChange, onSelectedClients = _a.onSelectedClients;
+    var handleFlightNumberChange = useCallback(function (e) {
+        onFlightNumberChange === null || onFlightNumberChange === void 0 ? void 0 : onFlightNumberChange(e.target.value);
+    }, [onFlightNumberChange]);
+    var id = useMemo(function () {
+        return "transfer-".concat(type, "-").concat(Math.random().toString(36).substring(2, 15));
+    }, [type]);
+    useEffect(function () {
+        onSelectedClients(clientsInfo, onPaxChange);
+    }, [changeOptions, onPaxChange]);
+    return (_jsxs(BookingPaxLayout, __assign({ title: _jsxs(_Fragment, { children: ["Transfer", ' ', _jsxs(Text, __assign({ as: "span", color: "accent", variant: "bold", size: "xl", className: "italic" }, { children: ["(", mapType[type], ")"] }))] }), icon: "car", className: "booking-pax-accom", header: _jsx(BookingPaxHeader, { children: _jsx(BookingPaxHeader.Location, { from: from, to: to }) }) }, { children: [type === 'INH' ? (_jsx(DateTimePicker, { icon: "clock", mode: "time", onValueChange: onTimeChange, placeholder: "Time of Transfer" })) : (_jsx(Input, { icon: "arrival", iconPosition: "leading", placeholder: "Flight number", onChange: handleFlightNumberChange })), _jsx(BookingPaxClient, { id: id, clients: clientsInfo, selectedClientsInfoIds: selectedClientsInfoIds, selectedIndex: 0, paxCount: paxCount, isSubmitted: isSubmitted, onPaxChange: onPaxOptionsChange, onError: onError }), _jsx(BookingPaxRemarks, { onChange: onRemarkChange })] })));
+};

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

@@ -0,0 +1,5 @@
+export type { BookingPaxAccomProps, RoomData } from './BookingPaxAccom';
+export type { BookingPaxClientInfo, BookingPaxClientProps, } from './BookingPaxClient/BookingPaxClient';
+export type { BookingPaxExcursionProps } from './BookingPaxExcursion';
+export type { BookingPaxTransferProps } from './BookingPaxTransfer';
+export * from './BookingPax';

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

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

package/dist/components/molecules/Calendar/CalendarInput.d.ts

@@ -1,11 +1,12 @@
-import React from "react";
+import React from 'react';
+import { IconName } from '../../atoms/Icon/Icon';
 export interface CalendarInputProps {
     /** Placeholder text */
     placeholder?: string;
     /** Selected date value (formatted as string) */
     value?: string;
     /** State of the input: default, active, typing, disabled, success, error */
-    state?: "default" | "active" | "typing" | "disabled" | "success" | "error";
+    state?: 'default' | 'active' | 'typing' | 'disabled' | 'success' | 'error';
     /** Helper/support text below input */
     /** Whether the input is disabled */
     disabled?: boolean;
@@ -24,11 +25,13 @@ export interface CalendarInputProps {
     /** 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;
     /** Whether the calendar popover is open */
     isOpen?: boolean;
+    /** Icon to display on the left of the input */
+    icon?: IconName;
 }
 declare const CalendarInput: React.FC<CalendarInputProps>;
 export default CalendarInput;

package/dist/components/molecules/Calendar/CalendarInput.js

@@ -10,15 +10,15 @@ 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 Icon from "../../atoms/Icon/Icon";
+import React, { useState } from 'react';
+import Icon from '../../atoms/Icon/Icon';
 var CalendarInput = function (_a) {
-    var _b = _a.placeholder, placeholder = _b === void 0 ? "Select date" : _b, _c = _a.value, value = _c === void 0 ? "" : _c, _d = _a.state, state = _d === void 0 ? "default" : _d, _e = _a.disabled, disabled = _e === void 0 ? false : _e, onClick = _a.onClick, onCalendarClick = _a.onCalendarClick, onChange = _a.onChange, onFocus = _a.onFocus, onBlur = _a.onBlur, _f = _a.className, className = _f === void 0 ? "" : _f, _g = _a.iconBGFull, iconBGFull = _g === void 0 ? true : _g, _h = _a.iconPosition, iconPosition = _h === void 0 ? "right" : _h, _j = _a.showChevron, showChevron = _j === void 0 ? false : _j, _k = _a.isOpen, isOpen = _k === void 0 ? false : _k;
-    var _l = useState(false), isFocused = _l[0], setIsFocused = _l[1];
-    var _m = useState(value), localValue = _m[0], setLocalValue = _m[1];
-    var _o = useState(false), isTyping = _o[0], setIsTyping = _o[1];
-    var finalState = disabled ? "disabled" : state;
-    var displayState = isFocused && isTyping ? "typing" : isFocused ? "active" : finalState;
+    var _b = _a.placeholder, placeholder = _b === void 0 ? 'Select date' : _b, _c = _a.value, value = _c === void 0 ? '' : _c, _d = _a.state, state = _d === void 0 ? 'default' : _d, _e = _a.disabled, disabled = _e === void 0 ? false : _e, onClick = _a.onClick, onCalendarClick = _a.onCalendarClick, onChange = _a.onChange, onFocus = _a.onFocus, onBlur = _a.onBlur, _f = _a.className, className = _f === void 0 ? '' : _f, _g = _a.iconBGFull, iconBGFull = _g === void 0 ? true : _g, _h = _a.iconPosition, iconPosition = _h === void 0 ? 'right' : _h, _j = _a.showChevron, showChevron = _j === void 0 ? false : _j, _k = _a.isOpen, isOpen = _k === void 0 ? false : _k, _l = _a.icon, icon = _l === void 0 ? 'calendar' : _l;
+    var _m = useState(false), isFocused = _m[0], setIsFocused = _m[1];
+    var _o = useState(value), localValue = _o[0], setLocalValue = _o[1];
+    var _p = useState(false), isTyping = _p[0], setIsTyping = _p[1];
+    var finalState = disabled ? 'disabled' : state;
+    var displayState = isFocused && isTyping ? 'typing' : isFocused ? 'active' : finalState;
     var handleInputChange = function (e) {
         var newValue = e.target.value;
         setLocalValue(newValue);
@@ -43,7 +43,7 @@ var CalendarInput = function (_a) {
     React.useEffect(function () {
         setLocalValue(value);
     }, [value]);
-    var iconButton = (_jsx("button", __assign({ type: "button", className: "calendar-input__icon-button ".concat(iconBGFull ? " calendar-input__icon-button--full-bg" : "", " calendar-input__icon-button--").concat(iconPosition), onClick: handleCalendarClick, disabled: disabled, "aria-label": "Open calendar picker", title: "Select date" }, { children: _jsx(Icon, { name: "calendar", size: "sm", className: "calendar-input__icon" }) })));
-    return (_jsxs("div", __assign({ className: "calendar-input calendar-input--".concat(displayState, " calendar-input--icon-").concat(iconPosition, " ").concat(className).trim(), "data-node-id": "3425:11289", onClick: onClick }, { children: [iconPosition === "left" && iconButton, _jsxs("div", __assign({ className: "calendar-input__input-wrapper" }, { children: [_jsx("input", { type: "text", className: "calendar-input__field", placeholder: placeholder, value: localValue || placeholder, disabled: disabled, onChange: handleInputChange, onFocus: handleFocus, onBlur: handleBlur, readOnly: true, "aria-label": "Select date" }), iconPosition === "left" && showChevron && (_jsx("div", __assign({ className: "calendar-input__chevron ".concat(isOpen ? 'calendar-input__chevron--open' : '') }, { children: _jsx(Icon, { name: "chevron-down", size: "sm" }) })))] })), iconPosition === "right" && iconButton] })));
+    var iconButton = (_jsx("button", __assign({ type: "button", className: "calendar-input__icon-button ".concat(iconBGFull ? ' calendar-input__icon-button--full-bg' : '', " calendar-input__icon-button--").concat(iconPosition), onClick: handleCalendarClick, disabled: disabled, "aria-label": "Open calendar picker", title: "Select date" }, { children: _jsx(Icon, { name: icon, size: "sm", className: "calendar-input__icon" }) })));
+    return (_jsxs("div", __assign({ className: "calendar-input calendar-input--".concat(displayState, " calendar-input--icon-").concat(iconPosition, " ").concat(className).trim(), "data-node-id": "3425:11289", onClick: onClick }, { children: [iconPosition === 'left' && iconButton, _jsxs("div", __assign({ className: "calendar-input__input-wrapper" }, { children: [_jsx("input", { type: "text", className: "calendar-input__field", placeholder: placeholder, value: localValue || placeholder, disabled: disabled, onChange: handleInputChange, onFocus: handleFocus, onBlur: handleBlur, readOnly: true, "aria-label": 'Select date' }), iconPosition === 'left' && showChevron && (_jsx("div", __assign({ className: "calendar-input__chevron ".concat(isOpen ? 'calendar-input__chevron--open' : '') }, { children: _jsx(Icon, { name: 'chevron-down', size: "sm" }) })))] })), iconPosition === 'right' && iconButton] })));
 };
 export default CalendarInput;