kupos-ui-components-lib 10.4.64 → 10.4.65

package/dist/example.js

@@ -1,240 +0,0 @@
-import React from "react";
-import { KuposUIComponent } from "./index";
-// Sample data for demonstration
-const sampleServiceItem = {
-    id: "12345",
-    operator_details: [
-        "https://example.com/logo.png",
-        "4.5",
-        "Operator Name", // operator name
-    ],
-    travel_date: "2025-08-01T09:00:00Z",
-    arrival_date: "2025-08-01T12:00:00Z",
-    dep_time: "09:00",
-    arr_time: "12:00",
-    available_seats: 5,
-    seat_types: [
-        { label: "Salon Cama", fare: 50 },
-        { label: "Premium", fare: 75 },
-        { label: "Economy", fare: 40 },
-    ],
-    offer_text: "Limited time offer: 20% off!",
-    is_direct_trip: true,
-    icons: {
-        origin: "https://example.com/origin.png",
-        destination: "https://example.com/destination.png",
-        rating: "https://example.com/star.png",
-        hours: "https://example.com/clock.png",
-    }
-};
-// Sample data for new ServiceItem component
-const sampleNewServiceItem = {
-    id: "service123",
-    name: "Premium Car Wash",
-    description: "Complete exterior and interior cleaning with premium wax and polish",
-    price: 49.99,
-    currency: "$",
-    imageUrl: "https://example.com/carwash.jpg",
-    rating: 4.8,
-    available: true,
-    featured: true,
-    duration: "45 min",
-    location: "Downtown",
-    provider: {
-        name: "Sparkle Clean",
-        imageUrl: "https://example.com/sparkle.jpg",
-        rating: 4.9
-    }
-};
-// Sample data for PaymentSideBar
-const samplePaymentData = {
-    orderSummary: {
-        subtotal: 49.99,
-        taxes: 5.00,
-        discount: 10.00,
-        total: 44.99
-    },
-    paymentMethods: [
-        { id: "card", name: "Credit Card", icon: "💳" },
-        { id: "paypal", name: "PayPal", icon: "🅿️" },
-        { id: "apple", name: "Apple Pay", icon: "🍎" }
-    ],
-    customerDetails: {
-        name: "John Doe",
-        email: "john@example.com",
-        phone: "+1 555-123-4567"
-    },
-    orderDetails: [
-        { name: "Premium Car Wash", price: 49.99, quantity: 1 }
-    ]
-};
-// Sample data for ServiceList
-const sampleServiceList = [
-    {
-        id: "service123",
-        name: "Premium Car Wash",
-        description: "Complete exterior and interior cleaning with premium wax and polish",
-        price: 49.99,
-        currency: "$",
-        imageUrl: "https://example.com/carwash.jpg",
-        rating: 4.8,
-        available: true,
-        featured: true
-    },
-    {
-        id: "service456",
-        name: "Basic Car Wash",
-        description: "Quick exterior wash and vacuum",
-        price: 19.99,
-        currency: "$",
-        imageUrl: "https://example.com/basicwash.jpg",
-        rating: 4.2,
-        available: true,
-        featured: false
-    },
-    {
-        id: "service789",
-        name: "Interior Detailing",
-        description: "Deep cleaning of all interior surfaces",
-        price: 89.99,
-        currency: "$",
-        imageUrl: "https://example.com/detailing.jpg",
-        rating: 4.9,
-        available: false,
-        featured: false
-    }
-];
-const sampleFilters = {
-    categories: ["Wash", "Detailing", "Maintenance"],
-    priceRange: { min: 0, max: 100 },
-    sortBy: "price",
-    sortOrder: "asc"
-};
-/**
- * Example component showing how to use KuposUIComponent with different typeOfComponent values
- */
-export default function Example() {
-    return (React.createElement("div", { className: "example-container", style: { padding: "20px", maxWidth: "1200px", margin: "0 auto" } },
-        React.createElement("h1", null, "KuposUI Component Examples"),
-        React.createElement("section", { style: { marginBottom: "40px" } },
-            React.createElement("h2", null, "Service Item Example"),
-            React.createElement(KuposUIComponent, { typeOfComponent: "serviceitem", variant: "desktop", serviceItem: sampleServiceItem, onBookButtonPress: () => console.log("Book button pressed!"), colors: {
-                    kuposButtonColor: "#FF5722",
-                    priceColor: "#4CAF50",
-                    tooltipColor: "#333333",
-                    ratingBorderColor: "#FFC107",
-                    ratingBottomColor: "#FFF8E1",
-                    secondaryBgColor: "#E0E0E0",
-                    secondaryTextColor: "#757575",
-                    primaryButtonTextColor: "#FFFFFF"
-                }, translation: {
-                    buyButton: "Buy",
-                    soldOutButton: "Sold Out",
-                    hours: "hrs",
-                    petFriendly: "Pet Friendly",
-                    flexible: "Flexible",
-                    title: "Important Information",
-                    continueButton: "Continue",
-                    okContinueButton: "OK, Continue",
-                    chooseAnotherTripButton: "Choose Another Trip"
-                } })),
-        React.createElement("section", { style: { marginBottom: "40px" } },
-            React.createElement("h2", null, "Payment Sidebar Example"),
-            React.createElement("div", { style: { display: "flex", gap: "20px" } },
-                React.createElement("div", { style: { flex: 1 } },
-                    React.createElement("h3", null, "Desktop Variant"),
-                    React.createElement(KuposUIComponent, { typeOfComponent: "paymentsidebar", variant: "desktop", orderSummary: samplePaymentData.orderSummary, paymentMethods: samplePaymentData.paymentMethods, customerDetails: samplePaymentData.customerDetails, orderDetails: samplePaymentData.orderDetails, onPaymentMethodSelect: (id) => console.log(`Selected payment method: ${id}`), onPayButtonClick: () => console.log("Pay button clicked"), colors: {
-                            primaryColor: "#4CAF50",
-                            secondaryColor: "#2196F3",
-                            backgroundColor: "#f5f5f5",
-                            textColor: "#333",
-                            cardBackgroundColor: "#fff"
-                        } })),
-                React.createElement("div", { style: { flex: 1 } },
-                    React.createElement("h3", null, "Mobile Variant"),
-                    React.createElement(KuposUIComponent, { typeOfComponent: "paymentsidebar", variant: "mobile", orderSummary: samplePaymentData.orderSummary, paymentMethods: samplePaymentData.paymentMethods, customerDetails: samplePaymentData.customerDetails, orderDetails: samplePaymentData.orderDetails, onPaymentMethodSelect: (id) => console.log(`Selected payment method: ${id}`), onPayButtonClick: () => console.log("Pay button clicked"), colors: {
-                            primaryColor: "#4CAF50",
-                            secondaryColor: "#2196F3",
-                            backgroundColor: "#f5f5f5",
-                            textColor: "#333",
-                            cardBackgroundColor: "#fff"
-                        } })))),
-        React.createElement("section", { style: { marginBottom: "40px" } },
-            React.createElement("h2", null, "Service List Example"),
-            React.createElement("div", { style: { display: "flex", gap: "20px" } },
-                React.createElement("div", { style: { flex: 1 } },
-                    React.createElement("h3", null, "Desktop Variant"),
-                    React.createElement(KuposUIComponent, { typeOfComponent: "servicelist", variant: "desktop", services: sampleServiceList, onServiceSelect: (id) => console.log(`Selected service: ${id}`), onServiceView: (id) => console.log(`Viewing service: ${id}`), showFilters: true, filters: sampleFilters, onFilterChange: (filters) => console.log('Filters changed:', filters), colors: {
-                            primaryColor: "#4CAF50",
-                            secondaryColor: "#2196F3",
-                            backgroundColor: "#f5f5f5",
-                            textColor: "#333",
-                            cardBackgroundColor: "#fff",
-                            highlightColor: "#FFC107"
-                        } })),
-                React.createElement("div", { style: { flex: 1 } },
-                    React.createElement("h3", null, "Mobile Variant"),
-                    React.createElement(KuposUIComponent, { typeOfComponent: "servicelist", variant: "mobile", services: sampleServiceList, onServiceSelect: (id) => console.log(`Selected service: ${id}`), onServiceView: (id) => console.log(`Viewing service: ${id}`), showFilters: true, filters: sampleFilters, onFilterChange: (filters) => console.log('Filters changed:', filters), colors: {
-                            primaryColor: "#4CAF50",
-                            secondaryColor: "#2196F3",
-                            backgroundColor: "#f5f5f5",
-                            textColor: "#333",
-                            cardBackgroundColor: "#fff",
-                            highlightColor: "#FFC107"
-                        } })))),
-        React.createElement("section", { style: { marginBottom: "40px" } },
-            React.createElement("h2", null, "New Service Item Example"),
-            React.createElement("div", { style: { display: "flex", gap: "20px" } },
-                React.createElement("div", { style: { flex: 1 } },
-                    React.createElement("h3", null, "Desktop Variant"),
-                    React.createElement(KuposUIComponent, Object.assign({ typeOfComponent: "serviceitem", variant: "desktop" }, sampleNewServiceItem, { onBookButtonPress: () => console.log("Book button pressed!"), onViewDetails: () => console.log("View details clicked!"), colors: {
-                            primaryColor: "#FF5722",
-                            secondaryColor: "#2196F3",
-                            backgroundColor: "#f5f5f5",
-                            textColor: "#333",
-                            cardBackgroundColor: "#fff",
-                            highlightColor: "#FFC107"
-                        }, t: (key) => key }))),
-                React.createElement("div", { style: { flex: 1 } },
-                    React.createElement("h3", null, "Mobile Variant"),
-                    React.createElement(KuposUIComponent, Object.assign({ typeOfComponent: "serviceitem", variant: "mobile" }, sampleNewServiceItem, { onBookButtonPress: () => console.log("Mobile book button pressed!"), onViewDetails: () => console.log("Mobile view details clicked!"), colors: {
-                            primaryColor: "#FF5722",
-                            secondaryColor: "#2196F3",
-                            backgroundColor: "#f5f5f5",
-                            textColor: "#333",
-                            cardBackgroundColor: "#fff",
-                            highlightColor: "#FFC107"
-                        }, t: (key) => key }))))),
-        React.createElement("section", { style: { marginBottom: "40px" } },
-            React.createElement("h2", null, "Original Service Item Example"),
-            React.createElement("div", { style: { display: "flex", gap: "20px" } },
-                React.createElement("div", { style: { flex: 1 } },
-                    React.createElement("h3", null, "Desktop Variant"),
-                    React.createElement(KuposUIComponent, { typeOfComponent: "serviceitem", variant: "desktop", serviceItem: sampleServiceItem, onBookButtonPress: () => console.log("Book button pressed!"), colors: {
-                            kuposButtonColor: "#FF5722",
-                            priceColor: "#4CAF50",
-                            tooltipColor: "#333333",
-                            ratingBorderColor: "#FFC107",
-                            ratingBottomColor: "#FFF8E1",
-                            secondaryBgColor: "#E0E0E0",
-                            secondaryTextColor: "#757575",
-                            primaryButtonTextColor: "#FFFFFF"
-                        }, translation: {
-                            buyButton: "Buy",
-                            soldOutButton: "Sold Out",
-                            hours: "hrs",
-                            petFriendly: "Pet Friendly",
-                            flexible: "Flexible"
-                        } })),
-                React.createElement("div", { style: { flex: 1 } },
-                    React.createElement("h3", null, "Mobile Variant"),
-                    React.createElement(KuposUIComponent, { typeOfComponent: "serviceitem", variant: "mobile", serviceItem: sampleServiceItem, onBookButtonPress: () => console.log("Mobile book button pressed!"), colors: {
-                            kuposButtonColor: "#FF5722",
-                            priceColor: "#4CAF50",
-                            tooltipColor: "#333333"
-                        }, translation: {
-                            buyButton: "Buy",
-                            soldOutButton: "Sold Out",
-                            hours: "hrs"
-                        } }))))));
-}

package/dist/ui/ServiceType.d.ts

@@ -1,9 +0,0 @@
-import React from "react";
-declare const ServiceType: ({ serviceItem, translation, renderIcon, isSoldOut, colors, }: {
-    serviceItem: any;
-    translation: any;
-    renderIcon: any;
-    isSoldOut: any;
-    colors: any;
-}) => React.JSX.Element;
-export default ServiceType;

package/dist/ui/ServiceType.js

@@ -1,9 +0,0 @@
-import React from "react";
-const ServiceType = ({ serviceItem, translation, renderIcon, isSoldOut, colors, }) => (React.createElement("div", { className: "flex items-baseline relative whitespace-nowrap " },
-    React.createElement("div", { className: `w-[18px] mr-[4px] ${isSoldOut ? "grayscale" : ""}`, style: { opacity: isSoldOut ? 0.5 : 1 } }),
-    React.createElement("div", { className: "group text-[13.33px] cursor-pointer" },
-        React.createElement("span", { style: { opacity: isSoldOut ? 0.5 : 1 } }, serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.service_type),
-        React.createElement("div", { className: "hidden group-hover:block absolute top-[24px] left-1/2 -translate-x-1/2 text-white p-3 rounded-[14px] whitespace-normal z-10 mt-2.5 w-[188px] text-center break-normal shadow-service text-[12px]", style: { backgroundColor: colors.bottomStripColor } },
-            React.createElement("div", { className: "tooltip-arrow absolute -top-[7px] left-1/2 -translate-x-1/2 w-0 h-0 border-l-8 border-r-8 border-b-8 border-l-transparent border-r-transparent", style: { borderBottomColor: colors.bottomStripColor } }),
-            "Duraci\u00F3n estimada del viaje"))));
-export default ServiceType;

package/dist/ui/TopAmenities/PromoCountdown.d.ts

@@ -1,18 +0,0 @@
-import React from "react";
-interface PromoCountdownProps {
-    countdownSeconds: number;
-}
-interface PromoCountdownState {
-    remaining: number;
-}
-declare class PromoCountdown extends React.Component<PromoCountdownProps, PromoCountdownState> {
-    private timer;
-    constructor(props: PromoCountdownProps);
-    componentDidMount(): void;
-    componentDidUpdate(prevProps: PromoCountdownProps): void;
-    componentWillUnmount(): void;
-    private clearTimer;
-    private startTimer;
-    render(): React.JSX.Element;
-}
-export default PromoCountdown;

package/dist/ui/TopAmenities/PromoCountdown.js

@@ -1,55 +0,0 @@
-import React from "react";
-class PromoCountdown extends React.Component {
-    constructor(props) {
-        super(props);
-        this.timer = null;
-        this.state = { remaining: props.countdownSeconds };
-    }
-    componentDidMount() {
-        this.startTimer();
-    }
-    componentDidUpdate(prevProps) {
-        if (prevProps.countdownSeconds !== this.props.countdownSeconds) {
-            this.setState({ remaining: this.props.countdownSeconds }, () => {
-                this.startTimer();
-            });
-        }
-    }
-    componentWillUnmount() {
-        this.clearTimer();
-    }
-    clearTimer() {
-        if (this.timer) {
-            clearInterval(this.timer);
-            this.timer = null;
-        }
-    }
-    startTimer() {
-        this.clearTimer();
-        if (this.state.remaining <= 0)
-            return;
-        this.timer = setInterval(() => {
-            this.setState((prev) => {
-                if (prev.remaining <= 1) {
-                    this.clearTimer();
-                    return { remaining: 0 };
-                }
-                return { remaining: prev.remaining - 1 };
-            });
-        }, 1000);
-    }
-    render() {
-        const { remaining } = this.state;
-        const hrs = Math.floor(remaining / 3600);
-        const mins = Math.floor((remaining % 3600) / 60);
-        const secs = remaining % 60;
-        const pad = (n) => String(n).padStart(2, "0");
-        return (React.createElement("span", { className: "bold-text" },
-            pad(hrs),
-            ":",
-            pad(mins),
-            ":",
-            pad(secs)));
-    }
-}
-export default PromoCountdown;