@planetaexo/design-system 0.2.13 → 0.2.15

package/dist/index.d.ts

@@ -174,30 +174,6 @@ interface BookingDetailsProps {
 }
 declare function BookingDetails({ bookingId, status, createdAt, contact, agentName, agentContactUrl, adventures, summaryLineItems, subtotal, total, depositInfo, onAddContactAsTraveller, onEditTraveller, onRemoveTraveller, onAddSuggestedTraveller, onPayBalance, onCancelRequest, className, }: BookingDetailsProps): react_jsx_runtime.JSX.Element;
 
-interface BookingConfirmationEmailProps {
-    /** Nome do destinatário (ex: "Maria") */
-    recipientName: string;
-    /** URL do link para adicionar viajantes. Se omitido, o botão é renderizado sem link. */
-    addTravellersUrl?: string;
-    /** URL da logo PlanetaEXO. Para e-mails reais, use URL absoluta. Default: /logo-planetaexo.png */
-    logoUrl?: string;
-    /** Número da reserva */
-    bookingNumber: string;
-    /** Nome da atividade */
-    activity: string;
-    /** Nome da aventura */
-    adventure: string;
-    /** Data de início (formatada) */
-    startingDate: string;
-    /** Número de pessoas */
-    numberOfPeople: number;
-    /** Nome do host/anfitrião */
-    host: string;
-    /** className adicional no container */
-    className?: string;
-}
-declare function BookingConfirmationEmail({ recipientName, addTravellersUrl, logoUrl, bookingNumber, activity, adventure, startingDate, numberOfPeople, host, className, }: BookingConfirmationEmailProps): react_jsx_runtime.JSX.Element;
-
 interface ConfirmationLineItem {
     label: string;
     price: string;
@@ -260,6 +236,63 @@ interface BookingConfirmationProps {
 }
 declare function BookingConfirmation({ recipientName, logoUrl, bookingReference, adventures, summaryLineItems, subtotal, total, depositInfo, agent, viewBookingUrl, className, }: BookingConfirmationProps): react_jsx_runtime.JSX.Element;
 
+interface BookingConfirmationEmailProps {
+    /** Nome do destinatário (ex: "Maria") */
+    recipientName: string;
+    /** URL do link para adicionar viajantes. Se omitido, o botão é renderizado sem link. */
+    addTravellersUrl?: string;
+    /** URL da logo PlanetaEXO. Para e-mails reais, use URL absoluta. Default: /logo-planetaexo.png */
+    logoUrl?: string;
+    /** Número da reserva */
+    bookingNumber: string;
+    /** Nome da atividade */
+    activity: string;
+    /** Nome da aventura */
+    adventure: string;
+    /** Data de início (formatada) */
+    startingDate: string;
+    /** Número de pessoas */
+    numberOfPeople: number;
+    /** Nome do host/anfitrião */
+    host: string;
+    /** className adicional no container */
+    className?: string;
+}
+declare function BookingConfirmationEmail({ recipientName, addTravellersUrl, logoUrl, bookingNumber, activity, adventure, startingDate, numberOfPeople, host, className, }: BookingConfirmationEmailProps): react_jsx_runtime.JSX.Element;
+
+interface BookingFormValues {
+    adults: number;
+    children: number;
+    travelDate: Date | undefined;
+    budget: string;
+    project: string;
+    civility: "ms" | "mr" | "";
+    lastName: string;
+    firstName: string;
+    country: string;
+    phoneCountry: string;
+    phone: string;
+    email: string;
+}
+interface BookingFormProps {
+    /** Initial values */
+    defaultValues?: Partial<BookingFormValues>;
+    /** Called with form values on submit */
+    onSubmit?: (values: BookingFormValues) => void;
+    /** Submit button label */
+    submitLabel?: string;
+    /** Loading state */
+    loading?: boolean;
+    /** Show the header with title and subtitle. @default true */
+    showHeader?: boolean;
+    /** Override the header title */
+    title?: string;
+    /** Override the header subtitle */
+    subtitle?: string;
+    className?: string;
+}
+declare function BookingForm({ defaultValues, onSubmit, submitLabel, loading, showHeader, title, subtitle, className, }: BookingFormProps): react_jsx_runtime.JSX.Element;
+
 interface FloatingInputProps extends React.InputHTMLAttributes<HTMLInputElement> {
     label: string;
     error?: string;
@@ -272,6 +305,418 @@ interface FloatingSelectProps extends React.SelectHTMLAttributes<HTMLSelectEleme
 }
 declare const FloatingSelect: React.ForwardRefExoticComponent<FloatingSelectProps & React.RefAttributes<HTMLSelectElement>>;
 
+interface CountryOption {
+    code: string;
+    name: string;
+}
+interface CountrySearchFieldProps {
+    value: string;
+    onChange: (code: string) => void;
+    required?: boolean;
+    label?: string;
+    countries?: CountryOption[];
+    placeholder?: string;
+    className?: string;
+}
+declare const COUNTRIES: CountryOption[];
+declare function CountrySearchField({ value, onChange, required, label, countries, placeholder, className, }: CountrySearchFieldProps): react_jsx_runtime.JSX.Element;
+
+interface PhoneCountrySelectProps {
+    value: string;
+    onChange: (code: string) => void;
+    className?: string;
+}
+declare function PhoneCountrySelect({ value, onChange, className, }: PhoneCountrySelectProps): react_jsx_runtime.JSX.Element;
+
+interface CounterFieldProps {
+    label: string;
+    sublabel?: string;
+    required?: boolean;
+    value: number;
+    min?: number;
+    max?: number;
+    onChange: (value: number) => void;
+    className?: string;
+}
+declare function CounterField({ label, sublabel, required, value, min, max, onChange, className, }: CounterFieldProps): react_jsx_runtime.JSX.Element;
+
+interface DatePickerFieldProps {
+    label: string;
+    required?: boolean;
+    value?: Date;
+    onChange?: (date: Date | undefined) => void;
+    placeholder?: string;
+    disabled?: boolean;
+    fromDate?: Date;
+    className?: string;
+}
+declare function DatePickerField({ label, required, value, onChange, placeholder, disabled, fromDate, className, }: DatePickerFieldProps): react_jsx_runtime.JSX.Element;
+
+interface FilterItem {
+    id: string;
+    label: string;
+    /** Contagem de resultados disponíveis */
+    count?: number;
+}
+interface FilterGroup {
+    id: string;
+    label: string;
+    /** Ícone SVG exibido ao lado do título */
+    icon?: React.ReactNode;
+    items: FilterItem[];
+    /** Abre este grupo por padrão */
+    defaultOpen?: boolean;
+}
+interface FilterPanelProps {
+    groups: FilterGroup[];
+    /** Estado controlado: { groupId: string[] } */
+    value?: Record<string, string[]>;
+    onChange?: (value: Record<string, string[]>) => void;
+    onClearAll?: () => void;
+    /** Exibe o link "Remove all filters" mesmo sem seleção */
+    alwaysShowClear?: boolean;
+    title?: string;
+    className?: string;
+}
+declare function FilterPanel({ groups, value, onChange, onClearAll, alwaysShowClear, title, className, }: FilterPanelProps): react_jsx_runtime.JSX.Element;
+
+interface ItineraryRoute {
+    distance: string;
+    duration: string;
+}
+interface ItineraryStop {
+    dayNumber: number;
+    title: string;
+    location?: string;
+    coverImage: string;
+    images?: string[];
+    description?: React.ReactNode;
+    route?: ItineraryRoute;
+}
+interface ItineraryProps {
+    title?: string;
+    subtitle?: string;
+    stops: ItineraryStop[];
+    className?: string;
+}
+declare function Itinerary({ title, subtitle, stops, className }: ItineraryProps): react_jsx_runtime.JSX.Element;
+
+interface MenuTripSection {
+    id: string;
+    label: string;
+}
+type MenuTripVariant = "pill" | "underline" | "outlined" | "floating";
+interface MenuTripProps {
+    sections: MenuTripSection[];
+    activeSection?: string;
+    onSelect?: (id: string) => void;
+    variant?: MenuTripVariant;
+    /** Whether labels use bold font weight. @default true */
+    bold?: boolean;
+    className?: string;
+}
+declare function MenuTrip({ sections, activeSection, onSelect, variant, bold, className, }: MenuTripProps): react_jsx_runtime.JSX.Element;
+
+type PhotoGalleryVariant = "grid" | "masonry" | "filmstrip" | "featured";
+interface PhotoGalleryPhoto {
+    src: string;
+    alt?: string;
+    /** Caption displayed in the lightbox bottom-left */
+    caption?: string;
+    /** Photo credit / author displayed in the lightbox bottom-right */
+    credit?: string;
+}
+interface PhotoGalleryProps {
+    /** Array of photo URLs or photo objects */
+    photos: (string | PhotoGalleryPhoto)[];
+    /** Visual layout variant */
+    variant?: PhotoGalleryVariant;
+    /**
+     * How many photos to show before the "See more" button.
+     * Pass `Infinity` to always show all (no toggle).
+     * @default 6
+     */
+    initialVisible?: number;
+    /** Called when a photo is clicked (in addition to opening the lightbox) */
+    onPhotoClick?: (src: string, index: number) => void;
+    className?: string;
+}
+declare function PhotoGallery({ photos, variant, initialVisible, onPhotoClick, className, }: PhotoGalleryProps): react_jsx_runtime.JSX.Element | null;
+
+interface PricingOption {
+    label: string;
+    price: string;
+    originalPrice?: string;
+    unit?: string;
+}
+type PricingTripVariant = "card" | "bar" | "compact";
+interface PricingTripProps {
+    priceFrom: string;
+    currency?: string;
+    /** e.g. "May – August · until mid-August with sufficient water levels" */
+    season?: string;
+    departureTimes?: string[];
+    pricingOptions?: PricingOption[];
+    onBook?: () => void;
+    bookLabel?: string;
+    variant?: PricingTripVariant;
+    className?: string;
+}
+declare function PricingTrip({ priceFrom, currency, season, departureTimes, pricingOptions, onBook, bookLabel, variant, className, }: PricingTripProps): react_jsx_runtime.JSX.Element;
+
+interface SiteHeaderSubItem {
+    label: string;
+    href?: string;
+}
+interface SiteHeaderLink {
+    label: string;
+    href?: string;
+    items?: SiteHeaderSubItem[];
+}
+interface SiteHeaderLanguage {
+    code: string;
+    label: string;
+}
+type SiteHeaderVariant = "transparent" | "white" | "dark";
+interface SiteHeaderProps {
+    variant?: SiteHeaderVariant;
+    links?: SiteHeaderLink[];
+    logoSrc?: string;
+    logoAlt?: string;
+    languages?: SiteHeaderLanguage[];
+    currentLanguage?: string;
+    onLanguageChange?: (code: string) => void;
+    onSearch?: () => void;
+    onAccount?: () => void;
+    /** "overlay" = absolute (inside a relative parent); "fixed" = fixed to viewport */
+    position?: "overlay" | "fixed" | "static";
+    className?: string;
+}
+declare const DEFAULT_HEADER_LINKS: SiteHeaderLink[];
+declare const DEFAULT_LANGUAGES: SiteHeaderLanguage[];
+declare function SiteHeader({ variant, links, logoSrc, logoAlt, languages, currentLanguage, onLanguageChange, onSearch, onAccount, position, className, }: SiteHeaderProps): react_jsx_runtime.JSX.Element;
+
+declare function ThemeToggle({ className }: {
+    className?: string;
+}): react_jsx_runtime.JSX.Element;
+
+type TripCardStatus = "sold-out" | "trending";
+type TripCardSize = "sm" | "md" | "lg";
+interface TripCardCta {
+    /** Texto do link (ex: "Discover this trip" ou "5 dates available") */
+    label: string;
+    onClick?: () => void;
+    href?: string;
+}
+interface TripCardProps {
+    /** URL da imagem de capa */
+    image: string;
+    imageAlt?: string;
+    /** Badge de status exibido no topo esquerdo */
+    status?: TripCardStatus;
+    /** Número de noites */
+    nights?: number;
+    /** Período (ex: "Feb - Mar") */
+    period?: string;
+    /** Título da viagem */
+    title: string;
+    /** Descrição curta */
+    description?: string;
+    /** Link/CTA de ação */
+    cta?: TripCardCta;
+    /** Preço exibido ao lado do CTA (ex: "from € 769") */
+    price?: string;
+    size?: TripCardSize;
+    className?: string;
+}
+declare function TripCard({ image, imageAlt, status, nights, period, title, description, cta, price, size, className, }: TripCardProps): react_jsx_runtime.JSX.Element;
+
+interface TripDuration {
+    /** Total number of days */
+    days: number;
+    /** Number of nights — defaults to days - 1 */
+    nights?: number;
+}
+interface TripHeaderProps {
+    /** Hero image array — shows a carousel when more than one image */
+    images: string[];
+    /** Optional video URL — plays as background instead of the image carousel */
+    videoUrl?: string;
+    /** Main trip title */
+    title: string;
+    /** Breadcrumb trail displayed above the title */
+    breadcrumb?: Array<{
+        label: string;
+        href?: string;
+    }>;
+    /** Destination name shown with a map pin icon */
+    destination?: string;
+    /** Duration shown with a moon/sun icon */
+    duration?: TripDuration;
+    /** Legacy tagline — shown only when destination/duration are not provided */
+    tagline?: string;
+    /** Pass true (or a links array) to render the transparent SiteHeader over the hero */
+    siteHeader?: boolean | SiteHeaderLink[];
+    /** Alinhado ao TripPage — reservado para densidade / hero v2 */
+    uiVariant?: "v1" | "v2";
+    className?: string;
+}
+declare function TripHeader({ images, videoUrl, title, breadcrumb, destination, duration, tagline, siteHeader, uiVariant, className, }: TripHeaderProps): react_jsx_runtime.JSX.Element;
+
+interface TripHighlight {
+    label: string;
+    icon?: React.ReactNode;
+}
+interface TripInfoGroup {
+    title: string;
+    icon?: React.ReactNode;
+    items: string[];
+}
+interface TripItineraryStep {
+    label: string;
+    duration?: string;
+    description: React.ReactNode;
+    isTransfer?: boolean;
+}
+interface TripReview {
+    author: string;
+    text: string;
+    rating?: number;
+}
+interface TripPricingOption {
+    label: string;
+    originalPrice?: string;
+    price: string;
+    unit?: string;
+}
+interface TripMeetingPoint {
+    name: string;
+    address: string;
+    type?: "start" | "alternative" | "activity";
+}
+interface TripFaq {
+    question: string;
+    answer: React.ReactNode;
+}
+
+interface TripPageProps {
+    title: string;
+    /** Legacy tagline — shown only when destination/duration are not provided */
+    tagline?: string;
+    /** Destination name shown with a map-pin icon in the hero */
+    destination?: string;
+    /** Duration shown with moon/sun icons in the hero */
+    duration?: TripDuration;
+    images: string[];
+    /** Optional video URL — plays as background instead of the image carousel */
+    videoUrl?: string;
+    /** Breadcrumb trail displayed above the title */
+    breadcrumb?: Array<{
+        label: string;
+        href?: string;
+    }>;
+    highlights?: TripHighlight[];
+    infoGroups?: TripInfoGroup[];
+    recommendedFor?: string;
+    overview?: React.ReactNode;
+    itinerary?: TripItineraryStep[];
+    gallery?: (string | PhotoGalleryPhoto)[];
+    included?: string[];
+    whatToBring?: string[];
+    weather?: React.ReactNode;
+    meetingPoints?: TripMeetingPoint[];
+    faqs?: TripFaq[];
+    reviews?: TripReview[];
+    priceFrom: string;
+    currency?: string;
+    season?: string;
+    departureTimes?: string[];
+    pricingOptions?: TripPricingOption[];
+    onBook?: () => void;
+    bookLabel?: string;
+    /** Pass true (or a links array) to render the transparent SiteHeader over the hero */
+    siteHeader?: boolean | SiteHeaderLink[];
+    /** Preset de layout (ilha WP / styleguide). @default v1 */
+    uiVariant?: "v1" | "v2";
+    /** Feature flags para ramos de UI sem duplicar componentes. */
+    features?: Record<string, boolean>;
+    className?: string;
+}
+declare function TripPage({ title, tagline, destination, duration, images, videoUrl, breadcrumb, highlights, infoGroups, recommendedFor, overview, itinerary, gallery, included, whatToBring, weather, meetingPoints, faqs, reviews, priceFrom, currency, season, departureTimes, pricingOptions, onBook, bookLabel, siteHeader, uiVariant, features, className, }: TripPageProps): react_jsx_runtime.JSX.Element;
+
+type ActivityCardSize = "sm" | "md" | "lg";
+interface ActivityCardProps {
+    /** URL da imagem de capa */
+    image: string;
+    imageAlt?: string;
+    /** Texto do badge sobreposto na imagem (ex: "Activity", "Tour") */
+    badge?: string;
+    /** Ícone sobreposto no canto superior esquerdo da imagem */
+    icon?: React.ReactNode;
+    /** Título principal do card */
+    title: string;
+    /** Descrição curta */
+    description?: string;
+    /** Texto do botão de preço (ex: "From CHF 63 .-") */
+    price?: string;
+    /** Callback ao clicar no card */
+    onClick?: () => void;
+    /** Tamanho do card */
+    size?: ActivityCardSize;
+    className?: string;
+}
+declare function ActivityCard({ image, imageAlt, badge, icon, title, description, price, onClick, size, className, }: ActivityCardProps): react_jsx_runtime.JSX.Element;
+
 declare function cn(...inputs: ClassValue[]): string;
 
-export { type BookingAdventure, BookingConfirmation, BookingConfirmationEmail, type BookingConfirmationEmailProps, type BookingConfirmationProps, type BookingContact, type BookingDepositInfo, BookingDetails, type BookingDetailsProps, type BookingStatus, type BookingSummaryLineItem, type BookingTraveller, type ConfirmationAdventure, type ConfirmationDepositInfo, type ConfirmationLineItem, type ConfirmationTraveller, FloatingInput, type FloatingInputProps, FloatingSelect, type FloatingSelectProps, Offer, OfferAdventureCard, type OfferAdventureItem, type OfferAgentInfo, type OfferDepositInfo, type OfferOptionalItem, type OfferProps, type OfferSummaryLineItem, type SuggestedTraveller, cn };
+interface LeadCapturePopupConfig {
+    /** Hero image URL displayed at the top of the popup */
+    imageUrl?: string;
+    /** Main heading text */
+    heading?: string;
+    /** Subtitle / supporting text below the heading */
+    subtitle?: string;
+    /** Label for the name field */
+    nameLabel?: string;
+    /** Placeholder for the name field */
+    namePlaceholder?: string;
+    /** Label for the email field */
+    emailLabel?: string;
+    /** Placeholder for the email field */
+    emailPlaceholder?: string;
+    /** Label for the travel date question */
+    travelDateLabel?: string;
+    /** Options for the travel date dropdown */
+    travelDateOptions?: string[];
+    /** Submit button text */
+    submitLabel?: string;
+    /** Success heading after submission */
+    successHeading?: string;
+    /** Success message after submission */
+    successMessage?: string;
+    /** Privacy disclaimer text (supports basic HTML) */
+    privacyText?: string;
+    /** Trigger type: "delay" | "exit_intent" | "scroll" */
+    trigger?: "delay" | "exit_intent" | "scroll";
+    /** Delay in seconds before showing (for "delay" trigger) */
+    delaySeconds?: number;
+    /** Scroll percentage to trigger (for "scroll" trigger) */
+    scrollPercent?: number;
+    /** Days to suppress popup after dismissal (cookie) */
+    dismissDays?: number;
+    /** Accent color override (hex or CSS color) */
+    accentColor?: string;
+    /** Overlay opacity 0-100 */
+    overlayOpacity?: number;
+    /** Position: "center" | "bottom-right" */
+    position?: "center" | "bottom-right";
+    /** REST endpoint to POST form data to */
+    ajaxUrl?: string;
+    /** WordPress nonce for the AJAX request */
+    nonce?: string;
+}
+declare function LeadCapturePopup({ config: _config, }: {
+    config: LeadCapturePopupConfig;
+}): react_jsx_runtime.JSX.Element | null;
+
+export { ActivityCard, type ActivityCardProps, type ActivityCardSize, type BookingAdventure, BookingConfirmation, BookingConfirmationEmail, type BookingConfirmationEmailProps, type BookingConfirmationProps, type BookingContact, type BookingDepositInfo, BookingDetails, type BookingDetailsProps, BookingForm, type BookingFormProps, type BookingFormValues, type BookingStatus, type BookingSummaryLineItem, type BookingTraveller, COUNTRIES, type ConfirmationAdventure, type ConfirmationDepositInfo, type ConfirmationLineItem, type ConfirmationTraveller, CounterField, type CounterFieldProps, type CountryOption, CountrySearchField, type CountrySearchFieldProps, DEFAULT_HEADER_LINKS, DEFAULT_LANGUAGES, DatePickerField, type DatePickerFieldProps, type FilterGroup, type FilterItem, FilterPanel, type FilterPanelProps, FloatingInput, type FloatingInputProps, FloatingSelect, type FloatingSelectProps, Itinerary, type ItineraryProps, type ItineraryRoute, type ItineraryStop, LeadCapturePopup, type LeadCapturePopupConfig, MenuTrip, type MenuTripProps, type MenuTripSection, type MenuTripVariant, Offer, OfferAdventureCard, type OfferAdventureItem, type OfferAgentInfo, type OfferDepositInfo, type OfferOptionalItem, type OfferProps, type OfferSummaryLineItem, PhoneCountrySelect, PhotoGallery, type PhotoGalleryPhoto, type PhotoGalleryProps, type PhotoGalleryVariant, type PricingOption, PricingTrip, type PricingTripProps, type PricingTripVariant, SiteHeader, type SiteHeaderLanguage, type SiteHeaderLink, type SiteHeaderProps, type SiteHeaderSubItem, type SiteHeaderVariant, type SuggestedTraveller, ThemeToggle, TripCard, type TripCardCta, type TripCardProps, type TripCardSize, type TripCardStatus, type TripDuration, type TripFaq, TripHeader, type TripHeaderProps, type TripHighlight, type TripInfoGroup, type TripItineraryStep, type TripMeetingPoint, TripPage, type TripPageProps, type TripPricingOption, type TripReview, cn };