@planetaexo/design-system 0.9.3 → 0.9.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +55 -14
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +13 -14
- package/dist/index.d.ts +13 -14
- package/dist/index.js +55 -14
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.d.cts
CHANGED
|
@@ -515,24 +515,23 @@ interface BookingConfirmationEmailProps {
|
|
|
515
515
|
}
|
|
516
516
|
declare function BookingConfirmationEmail({ recipientName, addTravellersUrl, logoUrl, bookingNumber, activity, adventure, startingDate, numberOfPeople, host, labels, className, }: BookingConfirmationEmailProps): react_jsx_runtime.JSX.Element;
|
|
517
517
|
|
|
518
|
-
interface BookingOtpEmailLabels {
|
|
519
|
-
bodyMessage: string;
|
|
520
|
-
expiryMessage: string;
|
|
521
|
-
logoAlt?: string;
|
|
522
|
-
}
|
|
523
518
|
interface BookingOtpEmailProps {
|
|
524
|
-
/**
|
|
525
|
-
|
|
526
|
-
/**
|
|
519
|
+
/** Saudação (ex.: "Hello!" / "Olá!"). */
|
|
520
|
+
greeting: string;
|
|
521
|
+
/** Intro curta com bookingId embutido (ex.: "Here is your verification code for booking #42."). */
|
|
522
|
+
intro: string;
|
|
523
|
+
/** Código OTP renderizado em destaque. Não é sanitizado — passe só dígitos. */
|
|
524
|
+
code: string;
|
|
525
|
+
/** Mensagem de expiração (ex.: "This code expires shortly."). */
|
|
527
526
|
expiryMessage: string;
|
|
528
|
-
/**
|
|
527
|
+
/** Assinatura do time (ex.: "PlanetaEXO Team"). */
|
|
528
|
+
teamSignature: string;
|
|
529
|
+
/** URL da logo. Default: data URI embutido. */
|
|
529
530
|
logoUrl?: string;
|
|
530
|
-
/**
|
|
531
|
-
labels?: Partial<BookingOtpEmailLabels>;
|
|
532
|
-
/** className extra no container (para uso no styleguide) */
|
|
531
|
+
/** className extra no container (uso no styleguide). */
|
|
533
532
|
className?: string;
|
|
534
533
|
}
|
|
535
|
-
declare function BookingOtpEmail({
|
|
534
|
+
declare function BookingOtpEmail({ greeting, intro, code, expiryMessage, teamSignature, logoUrl, className, }: BookingOtpEmailProps): react_jsx_runtime.JSX.Element;
|
|
536
535
|
|
|
537
536
|
interface TravellerFormInviteLink {
|
|
538
537
|
adventureName?: string;
|
|
@@ -1623,4 +1622,4 @@ declare function LeadCapturePopup({ config: _config, }: {
|
|
|
1623
1622
|
config: LeadCapturePopupConfig;
|
|
1624
1623
|
}): react_jsx_runtime.JSX.Element | null;
|
|
1625
1624
|
|
|
1626
|
-
export { ActivityCard, type ActivityCardProps, type ActivityCardSize, Alert, type AlertProps, type AlertVariant, BirthDateField, type BirthDateFieldProps, type BookingAdventure, BookingConfirmation, BookingConfirmationEmail, type BookingConfirmationEmailLabels, type BookingConfirmationEmailProps, type BookingConfirmationLabels, type BookingConfirmationProps, BookingConfirmedCard, type BookingConfirmedCardProps, type BookingContact, type BookingDepositInfo, BookingDetails, type BookingDetailsProps, BookingForm, type BookingFormProps, type BookingFormValues, BookingOtpEmail, type
|
|
1625
|
+
export { ActivityCard, type ActivityCardProps, type ActivityCardSize, Alert, type AlertProps, type AlertVariant, BirthDateField, type BirthDateFieldProps, type BookingAdventure, BookingConfirmation, BookingConfirmationEmail, type BookingConfirmationEmailLabels, type BookingConfirmationEmailProps, type BookingConfirmationLabels, type BookingConfirmationProps, BookingConfirmedCard, type BookingConfirmedCardProps, type BookingContact, type BookingDepositInfo, BookingDetails, type BookingDetailsProps, BookingForm, type BookingFormProps, type BookingFormValues, BookingOtpEmail, type BookingOtpEmailProps, BookingShell, type BookingShellProps, type BookingStatus, type BookingSummaryLineItem, type BookingTraveller, Button, type ButtonProps, 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, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, type EmailTokens, type FilterGroup, type FilterItem, FilterPanel, type FilterPanelProps, FloatingInput, type FloatingInputProps, FloatingSelect, type FloatingSelectProps, Itinerary, type ItineraryProps, type ItineraryRoute, type ItineraryStop, LOGO_PLANETAEXO_DATA_URI, LeadCapturePopup, type LeadCapturePopupConfig, MenuTrip, type MenuTripProps, type MenuTripSection, type MenuTripVariant, OTPCodeInput, type OTPCodeInputProps, Offer, OfferAdventureCard, type OfferAdventureItem, type OfferAgentInfo, type OfferDepositInfo, type OfferOptionalItem, type OfferProps, type OfferSummaryLineItem, PaymentAmountSelector, type PaymentAmountSelectorProps, type PaymentMethodOption, PaymentMethodSelector, type PaymentMethodSelectorProps, PaymentModalShell, type PaymentModalShellProps, PhoneCountrySelect, PhotoGallery, type PhotoGalleryPhoto, type PhotoGalleryProps, type PhotoGalleryVariant, type PricingOption, PricingTrip, type PricingTripProps, type PricingTripVariant, type RegistrationAdventure, type RegistrationBooking, type RegistrationEmergencyContactValue, type RegistrationField, type RegistrationFieldOption, type RegistrationFieldType, type RegistrationFieldValue, RegistrationForm, type RegistrationFormLabels, type RegistrationFormProps, type RegistrationFormValues, type RegistrationNameValue, type RegistrationPhoneValue, RegistrationSuccessCard, type RegistrationSuccessCardProps, type RegistrationTerms, type RegistrationTraveller, SiteHeader, type SiteHeaderLanguage, type SiteHeaderLink, type SiteHeaderProps, type SiteHeaderSubItem, type SiteHeaderVariant, type StripeAppearance, type SuggestedTraveller, TERMS_ACCEPT_KEY, TermsSection, type TermsSectionProps, ThemeToggle, Toast, type ToastProps, type ToastVariant, type TravellerFormConfig, type TravellerFormData, TravellerFormInviteEmail, type TravellerFormInviteEmailLabels, type TravellerFormInviteEmailProps, type TravellerFormInviteLink, type TravellerFormLabels, 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, buttonVariants, cn, emailTokens, getStripeAppearance, stripeAppearance, wrapEmailHtml };
|
package/dist/index.d.ts
CHANGED
|
@@ -515,24 +515,23 @@ interface BookingConfirmationEmailProps {
|
|
|
515
515
|
}
|
|
516
516
|
declare function BookingConfirmationEmail({ recipientName, addTravellersUrl, logoUrl, bookingNumber, activity, adventure, startingDate, numberOfPeople, host, labels, className, }: BookingConfirmationEmailProps): react_jsx_runtime.JSX.Element;
|
|
517
517
|
|
|
518
|
-
interface BookingOtpEmailLabels {
|
|
519
|
-
bodyMessage: string;
|
|
520
|
-
expiryMessage: string;
|
|
521
|
-
logoAlt?: string;
|
|
522
|
-
}
|
|
523
518
|
interface BookingOtpEmailProps {
|
|
524
|
-
/**
|
|
525
|
-
|
|
526
|
-
/**
|
|
519
|
+
/** Saudação (ex.: "Hello!" / "Olá!"). */
|
|
520
|
+
greeting: string;
|
|
521
|
+
/** Intro curta com bookingId embutido (ex.: "Here is your verification code for booking #42."). */
|
|
522
|
+
intro: string;
|
|
523
|
+
/** Código OTP renderizado em destaque. Não é sanitizado — passe só dígitos. */
|
|
524
|
+
code: string;
|
|
525
|
+
/** Mensagem de expiração (ex.: "This code expires shortly."). */
|
|
527
526
|
expiryMessage: string;
|
|
528
|
-
/**
|
|
527
|
+
/** Assinatura do time (ex.: "PlanetaEXO Team"). */
|
|
528
|
+
teamSignature: string;
|
|
529
|
+
/** URL da logo. Default: data URI embutido. */
|
|
529
530
|
logoUrl?: string;
|
|
530
|
-
/**
|
|
531
|
-
labels?: Partial<BookingOtpEmailLabels>;
|
|
532
|
-
/** className extra no container (para uso no styleguide) */
|
|
531
|
+
/** className extra no container (uso no styleguide). */
|
|
533
532
|
className?: string;
|
|
534
533
|
}
|
|
535
|
-
declare function BookingOtpEmail({
|
|
534
|
+
declare function BookingOtpEmail({ greeting, intro, code, expiryMessage, teamSignature, logoUrl, className, }: BookingOtpEmailProps): react_jsx_runtime.JSX.Element;
|
|
536
535
|
|
|
537
536
|
interface TravellerFormInviteLink {
|
|
538
537
|
adventureName?: string;
|
|
@@ -1623,4 +1622,4 @@ declare function LeadCapturePopup({ config: _config, }: {
|
|
|
1623
1622
|
config: LeadCapturePopupConfig;
|
|
1624
1623
|
}): react_jsx_runtime.JSX.Element | null;
|
|
1625
1624
|
|
|
1626
|
-
export { ActivityCard, type ActivityCardProps, type ActivityCardSize, Alert, type AlertProps, type AlertVariant, BirthDateField, type BirthDateFieldProps, type BookingAdventure, BookingConfirmation, BookingConfirmationEmail, type BookingConfirmationEmailLabels, type BookingConfirmationEmailProps, type BookingConfirmationLabels, type BookingConfirmationProps, BookingConfirmedCard, type BookingConfirmedCardProps, type BookingContact, type BookingDepositInfo, BookingDetails, type BookingDetailsProps, BookingForm, type BookingFormProps, type BookingFormValues, BookingOtpEmail, type
|
|
1625
|
+
export { ActivityCard, type ActivityCardProps, type ActivityCardSize, Alert, type AlertProps, type AlertVariant, BirthDateField, type BirthDateFieldProps, type BookingAdventure, BookingConfirmation, BookingConfirmationEmail, type BookingConfirmationEmailLabels, type BookingConfirmationEmailProps, type BookingConfirmationLabels, type BookingConfirmationProps, BookingConfirmedCard, type BookingConfirmedCardProps, type BookingContact, type BookingDepositInfo, BookingDetails, type BookingDetailsProps, BookingForm, type BookingFormProps, type BookingFormValues, BookingOtpEmail, type BookingOtpEmailProps, BookingShell, type BookingShellProps, type BookingStatus, type BookingSummaryLineItem, type BookingTraveller, Button, type ButtonProps, 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, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, type EmailTokens, type FilterGroup, type FilterItem, FilterPanel, type FilterPanelProps, FloatingInput, type FloatingInputProps, FloatingSelect, type FloatingSelectProps, Itinerary, type ItineraryProps, type ItineraryRoute, type ItineraryStop, LOGO_PLANETAEXO_DATA_URI, LeadCapturePopup, type LeadCapturePopupConfig, MenuTrip, type MenuTripProps, type MenuTripSection, type MenuTripVariant, OTPCodeInput, type OTPCodeInputProps, Offer, OfferAdventureCard, type OfferAdventureItem, type OfferAgentInfo, type OfferDepositInfo, type OfferOptionalItem, type OfferProps, type OfferSummaryLineItem, PaymentAmountSelector, type PaymentAmountSelectorProps, type PaymentMethodOption, PaymentMethodSelector, type PaymentMethodSelectorProps, PaymentModalShell, type PaymentModalShellProps, PhoneCountrySelect, PhotoGallery, type PhotoGalleryPhoto, type PhotoGalleryProps, type PhotoGalleryVariant, type PricingOption, PricingTrip, type PricingTripProps, type PricingTripVariant, type RegistrationAdventure, type RegistrationBooking, type RegistrationEmergencyContactValue, type RegistrationField, type RegistrationFieldOption, type RegistrationFieldType, type RegistrationFieldValue, RegistrationForm, type RegistrationFormLabels, type RegistrationFormProps, type RegistrationFormValues, type RegistrationNameValue, type RegistrationPhoneValue, RegistrationSuccessCard, type RegistrationSuccessCardProps, type RegistrationTerms, type RegistrationTraveller, SiteHeader, type SiteHeaderLanguage, type SiteHeaderLink, type SiteHeaderProps, type SiteHeaderSubItem, type SiteHeaderVariant, type StripeAppearance, type SuggestedTraveller, TERMS_ACCEPT_KEY, TermsSection, type TermsSectionProps, ThemeToggle, Toast, type ToastProps, type ToastVariant, type TravellerFormConfig, type TravellerFormData, TravellerFormInviteEmail, type TravellerFormInviteEmailLabels, type TravellerFormInviteEmailProps, type TravellerFormInviteLink, type TravellerFormLabels, 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, buttonVariants, cn, emailTokens, getStripeAppearance, stripeAppearance, wrapEmailHtml };
|
package/dist/index.js
CHANGED
|
@@ -3873,8 +3873,11 @@ function BookingConfirmationEmail({
|
|
|
3873
3873
|
);
|
|
3874
3874
|
}
|
|
3875
3875
|
function BookingOtpEmail({
|
|
3876
|
-
|
|
3876
|
+
greeting,
|
|
3877
|
+
intro,
|
|
3878
|
+
code,
|
|
3877
3879
|
expiryMessage,
|
|
3880
|
+
teamSignature,
|
|
3878
3881
|
logoUrl,
|
|
3879
3882
|
className
|
|
3880
3883
|
}) {
|
|
@@ -3894,15 +3897,44 @@ function BookingOtpEmail({
|
|
|
3894
3897
|
className,
|
|
3895
3898
|
children: [
|
|
3896
3899
|
/* @__PURE__ */ jsx(EmailLogo, { src: logoUrl }),
|
|
3900
|
+
/* @__PURE__ */ jsx("p", { style: { fontSize: "16px", lineHeight: "1.5", margin: "0 0 12px" }, children: greeting }),
|
|
3901
|
+
/* @__PURE__ */ jsx("p", { style: { fontSize: "15px", lineHeight: "1.5", margin: "0 0 24px" }, children: intro }),
|
|
3897
3902
|
/* @__PURE__ */ jsx(
|
|
3898
|
-
"
|
|
3903
|
+
"table",
|
|
3899
3904
|
{
|
|
3900
|
-
|
|
3901
|
-
|
|
3902
|
-
|
|
3903
|
-
|
|
3904
|
-
},
|
|
3905
|
-
children:
|
|
3905
|
+
role: "presentation",
|
|
3906
|
+
cellPadding: 0,
|
|
3907
|
+
cellSpacing: 0,
|
|
3908
|
+
border: 0,
|
|
3909
|
+
style: { width: "100%", borderCollapse: "collapse", margin: "0 0 24px" },
|
|
3910
|
+
children: /* @__PURE__ */ jsx("tbody", { children: /* @__PURE__ */ jsx("tr", { children: /* @__PURE__ */ jsx(
|
|
3911
|
+
"td",
|
|
3912
|
+
{
|
|
3913
|
+
align: "center",
|
|
3914
|
+
style: {
|
|
3915
|
+
backgroundColor: emailTokens.primaryLight,
|
|
3916
|
+
border: `1px solid ${emailTokens.border}`,
|
|
3917
|
+
borderRadius: "12px",
|
|
3918
|
+
padding: "24px 16px"
|
|
3919
|
+
},
|
|
3920
|
+
children: /* @__PURE__ */ jsx(
|
|
3921
|
+
"div",
|
|
3922
|
+
{
|
|
3923
|
+
style: {
|
|
3924
|
+
fontFamily: emailTokens.fontFamily,
|
|
3925
|
+
fontSize: "36px",
|
|
3926
|
+
fontWeight: 700,
|
|
3927
|
+
letterSpacing: "0.3em",
|
|
3928
|
+
color: emailTokens.foreground,
|
|
3929
|
+
lineHeight: 1,
|
|
3930
|
+
// Padding esquerdo compensa letter-spacing final, mantendo visualmente centralizado.
|
|
3931
|
+
paddingLeft: "0.3em"
|
|
3932
|
+
},
|
|
3933
|
+
children: code
|
|
3934
|
+
}
|
|
3935
|
+
)
|
|
3936
|
+
}
|
|
3937
|
+
) }) })
|
|
3906
3938
|
}
|
|
3907
3939
|
),
|
|
3908
3940
|
/* @__PURE__ */ jsx(
|
|
@@ -3912,11 +3944,12 @@ function BookingOtpEmail({
|
|
|
3912
3944
|
color: emailTokens.mutedForeground,
|
|
3913
3945
|
fontSize: "14px",
|
|
3914
3946
|
lineHeight: "1.5",
|
|
3915
|
-
margin: "0"
|
|
3947
|
+
margin: "0 0 24px"
|
|
3916
3948
|
},
|
|
3917
3949
|
children: expiryMessage
|
|
3918
3950
|
}
|
|
3919
|
-
)
|
|
3951
|
+
),
|
|
3952
|
+
/* @__PURE__ */ jsx("p", { style: { fontSize: "14px", lineHeight: "1.5", margin: "0" }, children: teamSignature })
|
|
3920
3953
|
]
|
|
3921
3954
|
}
|
|
3922
3955
|
);
|
|
@@ -5662,11 +5695,19 @@ var OTPCodeInput = ({
|
|
|
5662
5695
|
const numeric = raw.replace(/\D/g, "");
|
|
5663
5696
|
if (!numeric) return;
|
|
5664
5697
|
const newDigits = [...digits];
|
|
5665
|
-
|
|
5666
|
-
|
|
5667
|
-
|
|
5668
|
-
focusSlot(index + 1);
|
|
5698
|
+
if (numeric.length === 1) {
|
|
5699
|
+
newDigits[index] = numeric;
|
|
5700
|
+
updateValue(newDigits);
|
|
5701
|
+
if (index < length - 1) focusSlot(index + 1);
|
|
5702
|
+
return;
|
|
5669
5703
|
}
|
|
5704
|
+
const toPaste = numeric.slice(0, length - index);
|
|
5705
|
+
for (let i = 0; i < toPaste.length; i++) {
|
|
5706
|
+
newDigits[index + i] = toPaste[i];
|
|
5707
|
+
}
|
|
5708
|
+
updateValue(newDigits);
|
|
5709
|
+
const lastFilled = Math.min(index + toPaste.length, length) - 1;
|
|
5710
|
+
focusSlot(lastFilled < length - 1 ? lastFilled + 1 : lastFilled);
|
|
5670
5711
|
};
|
|
5671
5712
|
const handleKeyDown = (index, e) => {
|
|
5672
5713
|
if (e.key === "Backspace") {
|