mautourco-components 0.2.12 → 0.2.13

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

@@ -0,0 +1,21 @@
+/// <reference types="react" />
+import './ActionDropdown.css';
+export interface ActionDropdownItem {
+    /** Label for the action dropdown item */
+    label: string;
+    /** Callback function to be called when the action dropdown item is clicked */
+    onClick?: () => void;
+}
+export interface ActionDropdownProps {
+    /** Data for the action dropdown */
+    data: ActionDropdownItem[];
+}
+/**
+ * A dropdown component that displays a list of actions triggered by a more icon button. Uses a Popover for the dropdown menu.
+ *
+ * @example
+ * <ActionDropdown data={data} />
+ * @param ActionDropdownProps
+ * @returns
+ */
+export declare const ActionDropdown: React.FC<ActionDropdownProps>;

package/dist/components/molecules/ActionDropdown/ActionDropdown.js

@@ -0,0 +1,34 @@
+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 Icon from '../../atoms/Icon/Icon';
+import { Text } from '../../atoms/Typography/Typography';
+import { Popover, PopoverContent, PopoverTrigger } from '../../ui/popover';
+import './ActionDropdown.css';
+/**
+ * A dropdown component that displays a list of actions triggered by a more icon button. Uses a Popover for the dropdown menu.
+ *
+ * @example
+ * <ActionDropdown data={data} />
+ * @param ActionDropdownProps
+ * @returns
+ */
+export var ActionDropdown = function (_a) {
+    var data = _a.data;
+    var _b = useState(false), open = _b[0], setOpen = _b[1];
+    return (_jsxs(Popover, __assign({ open: open, onOpenChange: setOpen }, { children: [_jsx(PopoverTrigger, { children: _jsx("button", __assign({ className: "action-dropdown-trigger" }, { children: _jsx(Icon, { name: "more-vertical" }) })) }), _jsx(PopoverContent, __assign({ className: "action-dropdown", align: "end" }, { children: data.map(function (item, index) { return (_jsx("button", __assign({ onClick: function () {
+                        var _a;
+                        setOpen(false);
+                        (_a = item.onClick) === null || _a === void 0 ? void 0 : _a.call(item);
+                    } }, { children: _jsx(Text, __assign({ variant: "medium", size: "sm", as: "span" }, { children: item.label })) }), "ad-".concat(index))); }) }))] })));
+};

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

@@ -0,0 +1,14 @@
+import React from 'react';
+export interface DateDisplayProps {
+    /** Dates to display */
+    date: string[] | Date[];
+}
+/**
+ * A component for displaying a list of dates in a readable format.
+ *
+ * @example
+ * <DateDisplay date={['2025-01-01', '2025-01-02']} />
+ * @param DateDisplayProps
+ * @returns
+ */
+export declare const DateDisplay: React.FC<DateDisplayProps>;

package/dist/components/molecules/DateDisplay/DateDisplay.js

@@ -0,0 +1,39 @@
+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 { format, isValid } from 'date-fns';
+import { Fragment, useMemo } from 'react';
+import Icon from '../../atoms/Icon/Icon';
+import { Text } from '../../atoms/Typography/Typography';
+/**
+ * A component for displaying a list of dates in a readable format.
+ *
+ * @example
+ * <DateDisplay date={['2025-01-01', '2025-01-02']} />
+ * @param DateDisplayProps
+ * @returns
+ */
+export var DateDisplay = function (_a) {
+    var date = _a.date;
+    var formattedDate = useMemo(function () {
+        return date.map(function (d) {
+            var dateObj = new Date(d);
+            // Check if the date is valid then format it to dd/MM/yyyy format
+            if (isValid(dateObj)) {
+                return format(dateObj, 'dd/MM/yyyy');
+            }
+            // If the date is not valid, return the original date
+            return d;
+        });
+    }, [date]);
+    return (_jsx("div", __assign({ className: "flex items-center gap-x-3" }, { children: formattedDate.map(function (date, index) { return (_jsxs(Fragment, { children: [_jsxs("span", __assign({ className: "flex items-center gap-x-2" }, { children: [_jsx(Icon, { name: "calendar2", size: "sm" }), _jsx(Text, __assign({ variant: "medium", size: "sm" }, { children: date }))] })), formattedDate.length > 1 && index === 0 && _jsx(Icon, { name: "arrow-right-outline", size: "sm" })] }, "dd-".concat(index))); }) })));
+};

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

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+export interface FromToProps {
+    from?: string;
+    to?: string;
+    transferType?: string;
+}
+declare const FromTo: React.FC<Omit<FromToProps, 'transferType'>>;
+export default FromTo;

package/dist/components/molecules/FromTo/FromTo.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 Icon from '../../atoms/Icon/Icon';
+import { Text } from '../../atoms/Typography/Typography';
+var FromTo = function (props) {
+    var from = props.from, to = props.to;
+    var getTransferLocationName = function (location) {
+        if (!location)
+            return '';
+        return location.toLowerCase() === 'airport' ? 'Plaisance Airport' : location;
+    };
+    return (_jsxs("div", __assign({ className: "grid gap-y-1" }, { children: [_jsx(Text, __assign({ variant: "regular", size: "sm", leading: "5" }, { children: getTransferLocationName(from) })), _jsx(Icon, { name: "arrow-down-outline", size: "sm" }), _jsx(Text, __assign({ variant: "regular", size: "sm", leading: "5" }, { children: getTransferLocationName(to) }))] })));
+};
+export default FromTo;

package/dist/components/molecules/TableServiceItem/DetailsCol.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import { IconName } from '../../atoms/Icon/Icon';
+interface DetailsColData {
+    icon: IconName;
+    value: React.ReactNode;
+}
+export interface DetailsColProps {
+    data: DetailsColData[];
+    index?: number;
+}
+export declare const DetailsCol: React.FC<DetailsColProps>;
+export {};

package/dist/components/molecules/TableServiceItem/DetailsCol.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 { jsx as _jsx } from "react/jsx-runtime";
+import TextWithIcon from '../TextWithIcon/TextWithIcon';
+export var DetailsCol = function (props) {
+    var data = props.data;
+    return (_jsx("div", __assign({ className: "grid gap-y-1" }, { children: data.map(function (item) { return (_jsx(TextWithIcon, __assign({ icon: item.icon }, { children: item.value }))); }) })));
+};

package/dist/components/molecules/TableServiceItem/ItemCol.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+import { IconName } from '../../atoms/Icon/Icon';
+export interface ItemColProps {
+    serviceType: 'Accommodation' | 'Excursion' | 'Transfer' | 'Other Services';
+    serviceName?: string;
+    extraTitle?: React.ReactNode;
+    offers?: any[];
+    status?: string;
+    iconName?: IconName;
+    showName?: boolean;
+    children?: React.ReactNode;
+}
+export declare const ItemCol: React.FC<ItemColProps>;

package/dist/components/molecules/TableServiceItem/ItemCol.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 { Text } from '@/src/components/atoms/Typography/Typography';
+import { cn } from '@/src/lib/utils';
+import Chip from '../../atoms/Chip/Chip';
+import TextWithIcon from '../TextWithIcon/TextWithIcon';
+export var ItemCol = function (props) {
+    var serviceType = props.serviceType, serviceName = props.serviceName, offers = props.offers, status = props.status, _a = props.iconName, iconName = _a === void 0 ? 'accom' : _a, _b = props.showName, showName = _b === void 0 ? true : _b, extraTitle = props.extraTitle, children = props.children;
+    var isOnRequest = (status === null || status === void 0 ? void 0 : status.toLowerCase()) === 'on request';
+    return (_jsxs("div", __assign({ className: cn('grid', (offers === null || offers === void 0 ? void 0 : offers.length) && 'gap-y-3') }, { children: [_jsxs("div", { children: [serviceName && (_jsxs("div", __assign({ className: "grid gap-y-1" }, { children: [_jsxs("div", __assign({ className: "flex items-center gap-x-2" }, { children: [_jsx(TextWithIcon, __assign({ icon: iconName, color: isOnRequest ? 'yellow' : 'accent' }, { children: serviceType })), isOnRequest && _jsx(Chip, __assign({ color: "yellow" }, { children: status })), extraTitle] })), _jsx(Text, __assign({ variant: "bold", size: "sm" }, { children: showName && serviceName }))] }))), children] }), offers && offers.length > 0 && (_jsxs("div", { children: [_jsx(Text, __assign({ variant: "bold", size: "sm", leading: "5" }, { children: "Applicable offers:" })), _jsx(Text, __assign({ variant: "regular", size: "sm", leading: "5" }, { children: offers.map(function (o) {
+                            var offerValue = o.OfferType === 'GIFT' ? o.OfferName : "".concat(o.OfferValue, "%  offers applied");
+                            return _jsx("span", { children: offerValue });
+                        }) }))] }))] })));
+};

package/dist/components/molecules/TableServiceItem/RowAccommodation.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+import { ItemColProps } from './ItemCol';
+export interface RowAccommodationProps {
+    data: {
+        RoomName?: string;
+        Dates?: string[];
+        ClientCategory?: string;
+        MealPlan?: string;
+    };
+    index?: number;
+}
+export declare function RowAccommodation(): import("react/jsx-runtime").JSX.Element;
+export declare namespace RowAccommodation {
+    var FirstCol: React.FC<Omit<ItemColProps, "serviceType">>;
+    var DetailsCol: React.FC<RowAccommodationProps>;
+}

package/dist/components/molecules/TableServiceItem/RowAccommodation.js

@@ -0,0 +1,37 @@
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+import { differenceInDays } from 'date-fns';
+import { useMemo } from 'react';
+import { DetailsCol as DetailsColComponent } from './DetailsCol';
+import { ItemCol } from './ItemCol';
+var clientType = {
+    standard: 'STD',
+    honeymooners: 'HMN',
+    vip: 'VIP',
+    vvip: 'VVIP',
+};
+export function RowAccommodation() {
+    return _jsx(_Fragment, {});
+}
+var DetailsCol = function (props) {
+    var _a;
+    var data = props.data, _b = props.index, index = _b === void 0 ? 0 : _b;
+    var stay = useMemo(function () {
+        var _a;
+        if ((_a = data.Dates) === null || _a === void 0 ? void 0 : _a.length) {
+            return differenceInDays(data.Dates[1], data.Dates[0]);
+        }
+        return 0;
+    }, [data]);
+    return (_jsx(DetailsColComponent, { data: [
+            { icon: 'calendar2', value: "Room ".concat(index + 1, " : ").concat(data.RoomName) },
+            { icon: 'night', value: "".concat(stay, " Nights") },
+            { icon: 'user', value: "Client type : ".concat(clientType[(_a = data.ClientCategory) === null || _a === void 0 ? void 0 : _a.toLowerCase()]) },
+            { icon: 'utensils', value: "Meal plan : ".concat(data.MealPlan) },
+        ] }));
+};
+var FirstCol = function (props) {
+    var serviceName = props.serviceName, offers = props.offers, status = props.status;
+    return _jsx(ItemCol, { serviceType: "Accommodation", serviceName: serviceName, offers: offers, status: status });
+};
+RowAccommodation.FirstCol = FirstCol;
+RowAccommodation.DetailsCol = DetailsCol;

package/dist/components/molecules/TableServiceItem/RowExcursion.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+import { ItemColProps } from './ItemCol';
+export interface RowExcursionProps {
+    data: {
+        languages?: string[];
+        duration?: string;
+        accessibility?: string;
+        transferType?: string;
+    };
+}
+export declare function RowExcursion(): import("react/jsx-runtime").JSX.Element;
+export declare namespace RowExcursion {
+    var FirstCol: React.FC<Omit<ItemColProps, "status" | "serviceType">>;
+    var DetailsCol: React.FC<RowExcursionProps>;
+}
+export declare const DetailsCol: React.FC<RowExcursionProps>;

package/dist/components/molecules/TableServiceItem/RowExcursion.js

@@ -0,0 +1,22 @@
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+import { DetailsCol as DetailsColComponent } from './DetailsCol';
+import { ItemCol } from './ItemCol';
+export function RowExcursion() {
+    return _jsx(_Fragment, {});
+}
+export var DetailsCol = function (props) {
+    var _a;
+    var data = props.data;
+    return (_jsx(DetailsColComponent, { data: [
+            { icon: 'micro', value: "Languages: ".concat((_a = data.languages) === null || _a === void 0 ? void 0 : _a.join(' and ')) },
+            { icon: 'stopwatch', value: "Duration: ".concat(data.duration) },
+            { icon: 'user', value: "Difficulty: ".concat(data.accessibility) },
+            { icon: 'bus', value: "Type: ".concat(data.transferType) },
+        ] }));
+};
+var FirstCol = function (props) {
+    var serviceName = props.serviceName, offers = props.offers;
+    return _jsx(ItemCol, { serviceType: "Excursion", serviceName: serviceName, offers: offers, iconName: "map" });
+};
+RowExcursion.FirstCol = FirstCol;
+RowExcursion.DetailsCol = DetailsCol;

package/dist/components/molecules/TableServiceItem/RowOtherServices.d.ts

@@ -0,0 +1,9 @@
+import '@/src/index.css';
+import React from 'react';
+import { ItemColProps } from './ItemCol';
+export declare function RowOtherServices(): import("react/jsx-runtime").JSX.Element;
+export declare namespace RowOtherServices {
+    var FirstCol: React.FC<Omit<ItemColProps, "status" | "serviceType">>;
+    var DetailsCol: () => import("react/jsx-runtime").JSX.Element;
+}
+export declare const DetailsCol: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/molecules/TableServiceItem/RowOtherServices.js

@@ -0,0 +1,34 @@
+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 { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import '@/src/index.css';
+import Icon from '../../atoms/Icon/Icon';
+import { Text } from '../../atoms/Typography/Typography';
+import { TooltipDisplay } from '../TooltipDisplay/TooltipDisplay';
+import { DetailsCol as DetailsColComponent } from './DetailsCol';
+import { ItemCol } from './ItemCol';
+export function RowOtherServices() {
+    return _jsx(_Fragment, {});
+}
+export var DetailsCol = function () {
+    return (_jsx(DetailsColComponent, { data: [
+            {
+                icon: 'wallet',
+                value: (_jsxs(Text, __assign({ variant: "medium", size: "sm", leading: "5", as: "div", className: "flex items-center gap-x-2" }, { children: ["Handling Fee", _jsx(TooltipDisplay, __assign({ content: "Handling fee varies and is determined by the final number of people during booking.\u00A0" }, { children: _jsx(Icon, { name: "info", size: "sm" }) }))] }))),
+            },
+        ] }));
+};
+var FirstCol = function (props) {
+    return (_jsx(ItemCol, { serviceType: "Other Services", iconName: "more", serviceName: "Handling Fee", showName: false }));
+};
+RowOtherServices.FirstCol = FirstCol;
+RowOtherServices.DetailsCol = DetailsCol;

package/dist/components/molecules/TableServiceItem/RowTransfer.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import { FromToProps } from '../FromTo/FromTo';
+import { ItemColProps } from './ItemCol';
+export interface RowTransferProps {
+    data: {
+        carType?: string;
+        clientType?: string;
+    };
+}
+export declare function RowTransfer(): import("react/jsx-runtime").JSX.Element;
+export declare namespace RowTransfer {
+    var FirstCol: React.FC<Omit<ItemColProps, "status" | "serviceType"> & FromToProps>;
+    var DetailsCol: React.FC<RowTransferProps>;
+}
+export declare const DetailsCol: React.FC<RowTransferProps>;

package/dist/components/molecules/TableServiceItem/RowTransfer.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 { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+import { Text } from '../../atoms/Typography/Typography';
+import FromTo from '../FromTo/FromTo';
+import { DetailsCol as DetailsColComponent } from './DetailsCol';
+import { ItemCol } from './ItemCol';
+var transferTypeMap = {
+    ARV: 'Arrival',
+    DEP: 'Departure',
+    INH: 'Inter-Hotel',
+};
+export function RowTransfer() {
+    return _jsx(_Fragment, {});
+}
+export var DetailsCol = function (props) {
+    var data = props.data;
+    return (_jsx(DetailsColComponent, { data: [
+            { icon: 'car', value: data.carType },
+            { icon: 'user', value: "Client type: ".concat(data.clientType) },
+        ] }));
+};
+var FirstCol = function (props) {
+    var serviceName = props.serviceName, offers = props.offers, transferType = props.transferType, from = props.from, to = props.to;
+    return (_jsx(ItemCol, __assign({ serviceType: "Transfer", serviceName: serviceName, offers: offers, iconName: "car", showName: false, extraTitle: _jsx(Text, __assign({ variant: "bold", size: "sm", className: "italic" }, { children: transferTypeMap[transferType] })) }, { children: _jsx(FromTo, { from: from, to: to }) })));
+};
+RowTransfer.FirstCol = FirstCol;
+RowTransfer.DetailsCol = DetailsCol;

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

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+import { type DetailsColProps } from './DetailsCol';
+import { type ItemColProps } from './ItemCol';
+import { RowAccommodation, type RowAccommodationProps } from './RowAccommodation';
+import { RowExcursion, type RowExcursionProps } from './RowExcursion';
+import { RowOtherServices } from './RowOtherServices';
+import { RowTransfer, type RowTransferProps } from './RowTransfer';
+declare const TableServiceItem: {
+    DetailsCol: import("react").FC<DetailsColProps>;
+    ItemCol: import("react").FC<ItemColProps>;
+    RowAccommodation: typeof RowAccommodation;
+    RowExcursion: typeof RowExcursion;
+    RowOtherServices: typeof RowOtherServices;
+    RowTransfer: typeof RowTransfer;
+};
+export type { DetailsColProps, ItemColProps, RowAccommodationProps, RowExcursionProps, RowTransferProps, };
+export default TableServiceItem;

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

@@ -0,0 +1,15 @@
+import { DetailsCol } from './DetailsCol';
+import { ItemCol } from './ItemCol';
+import { RowAccommodation } from './RowAccommodation';
+import { RowExcursion } from './RowExcursion';
+import { RowOtherServices } from './RowOtherServices';
+import { RowTransfer } from './RowTransfer';
+var TableServiceItem = {
+    DetailsCol: DetailsCol,
+    ItemCol: ItemCol,
+    RowAccommodation: RowAccommodation,
+    RowExcursion: RowExcursion,
+    RowOtherServices: RowOtherServices,
+    RowTransfer: RowTransfer,
+};
+export default TableServiceItem;

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

@@ -0,0 +1,30 @@
+/// <reference types="react" />
+import { IconName } from '../../atoms/Icon/Icon';
+import { TextColor, TextLeading, TextVariant } from '../../atoms/Typography/Typography';
+export interface TextWithIconProps {
+    /** Icon to display */
+    icon: IconName;
+    /** Icon size */
+    iconSize?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    /** Children to display */
+    children: React.ReactNode;
+    /** Color of the text */
+    color?: TextColor;
+    /** Leading of the text */
+    textLeading?: TextLeading;
+    /** Variant of the text */
+    textVariant?: TextVariant;
+}
+/**
+ * A component that displays a text with an icon.
+ *
+ * @example
+ * <TextWithIcon icon="calendar" color="yellow">
+ *   20/12/2025
+ * </TextWithIcon>
+ *
+ * @param TextWithIconProps
+ * @returns
+ */
+declare const TextWithIcon: React.FC<TextWithIconProps>;
+export default TextWithIcon;

package/dist/components/molecules/TextWithIcon/TextWithIcon.js

@@ -0,0 +1,31 @@
+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 Icon from '../../atoms/Icon/Icon';
+import { Text } from '../../atoms/Typography/Typography';
+/**
+ * A component that displays a text with an icon.
+ *
+ * @example
+ * <TextWithIcon icon="calendar" color="yellow">
+ *   20/12/2025
+ * </TextWithIcon>
+ *
+ * @param TextWithIconProps
+ * @returns
+ */
+var TextWithIcon = function (props) {
+    var icon = props.icon, children = props.children, _a = props.iconSize, iconSize = _a === void 0 ? 'sm' : _a, _b = props.color, color = _b === void 0 ? 'default' : _b, _c = props.textLeading, textLeading = _c === void 0 ? '5' : _c, _d = props.textVariant, textVariant = _d === void 0 ? 'medium' : _d;
+    return (_jsxs("div", __assign({ className: cn('flex items-center gap-x-2', color === 'yellow' && 'text-[var(--color-yellow-600)]', color === 'accent' && 'text-[var(--color-text-accent)]') }, { children: [_jsx("span", { children: _jsx(Icon, { name: icon, size: iconSize }) }), _jsx(Text, __assign({ variant: textVariant, size: iconSize, className: "flex items-center gap-x-2", color: color, leading: textLeading, as: "div" }, { children: children }))] })));
+};
+export default TextWithIcon;

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

@@ -0,0 +1,13 @@
+import { TooltipContentProps } from '@radix-ui/react-tooltip';
+import React from 'react';
+export interface TooltipDisplayProps {
+    /** Trigger element */
+    children: React.ReactNode;
+    /** Tooltip content */
+    content: string;
+    /** Side of the tooltip */
+    side?: TooltipContentProps['side'];
+    /** Maximum width of the tooltip */
+    maxWidth?: `${number}px`;
+}
+export declare const TooltipDisplay: React.FC<TooltipDisplayProps>;

package/dist/components/molecules/TooltipDisplay/TooltipDisplay.js

@@ -0,0 +1,18 @@
+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 { Tooltip, TooltipContent, TooltipTrigger } from '../../ui/tooltip';
+export var TooltipDisplay = function (props) {
+    var children = props.children, content = props.content, _a = props.side, side = _a === void 0 ? 'right' : _a, _b = props.maxWidth, maxWidth = _b === void 0 ? '300px' : _b;
+    return (_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, __assign({ className: "text-[var(--color-icon-branded)]" }, { children: children })), _jsx(TooltipContent, __assign({ className: "max-w-[".concat(maxWidth, "]"), side: side }, { children: _jsx(Text, __assign({ variant: "medium", size: "sm", className: "!text-white" }, { children: content })) }))] }));
+};