@planetaexo/design-system 0.4.4 → 0.4.6

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.js CHANGED
@@ -4530,7 +4530,7 @@ function RegistrationForm({
4530
4530
  {
4531
4531
  onSubmit: handleSubmit,
4532
4532
  noValidate: true,
4533
- className: cn("flex flex-col gap-10", className),
4533
+ className: cn("rounded-xl border border-border bg-card overflow-hidden", className),
4534
4534
  children: [
4535
4535
  heroImage ? (
4536
4536
  /* ── Hero image (full-width) with centered white logo ─────────── */
@@ -4559,156 +4559,161 @@ function RegistrationForm({
4559
4559
  }
4560
4560
  ) })
4561
4561
  ] })
4562
- ) : logo && /* eslint-disable-next-line @next/next/no-img-element */
4563
- /* @__PURE__ */ jsx(
4564
- "img",
4565
- {
4566
- src: logo,
4567
- alt: logoAlt,
4568
- className: "mx-auto block h-auto w-[150px] object-contain"
4569
- }
4570
- ),
4571
- /* @__PURE__ */ jsxs("div", { children: [
4572
- /* @__PURE__ */ jsx("h2", { className: "text-2xl font-black uppercase tracking-wide text-foreground font-heading leading-tight", children: title }),
4573
- /* @__PURE__ */ jsx("p", { className: "mt-1.5 text-sm text-muted-foreground font-ui", children: subtitle != null ? subtitle : L.formSubtitle })
4574
- ] }),
4575
- hasTripInfo && /* @__PURE__ */ jsx(FormSection2, { title: L.tripInfoSectionTitle, children: /* @__PURE__ */ jsxs("dl", { className: "grid grid-cols-1 gap-x-6 gap-y-3 text-sm font-ui sm:grid-cols-[max-content_1fr]", children: [
4576
- adventure && /* @__PURE__ */ jsxs(Fragment, { children: [
4577
- /* @__PURE__ */ jsx("dt", { className: "text-muted-foreground", children: L.adventureLabel }),
4578
- /* @__PURE__ */ jsx("dd", { className: "text-foreground font-medium", children: adventure.name })
4579
- ] }),
4580
- dateRange && /* @__PURE__ */ jsxs(Fragment, { children: [
4581
- /* @__PURE__ */ jsx("dt", { className: "text-muted-foreground", children: (adventure == null ? void 0 : adventure.startDate) && (adventure == null ? void 0 : adventure.endDate) ? "Dates" : "Date" }),
4582
- /* @__PURE__ */ jsx("dd", { className: "text-foreground", children: dateRange })
4583
- ] }),
4584
- (adventure == null ? void 0 : adventure.partnerName) && /* @__PURE__ */ jsxs(Fragment, { children: [
4585
- /* @__PURE__ */ jsx("dt", { className: "text-muted-foreground", children: L.partnerLabel }),
4586
- /* @__PURE__ */ jsx("dd", { className: "text-foreground", children: adventure.partnerName })
4587
- ] }),
4588
- booking && /* @__PURE__ */ jsxs(Fragment, { children: [
4589
- /* @__PURE__ */ jsx("dt", { className: "text-muted-foreground", children: L.bookingLabel }),
4590
- /* @__PURE__ */ jsx("dd", { className: "text-foreground font-mono tabular-nums", children: booking.id })
4591
- ] }),
4592
- traveller && /* @__PURE__ */ jsxs(Fragment, { children: [
4593
- /* @__PURE__ */ jsx("dt", { className: "text-muted-foreground", children: L.travellerLabel }),
4594
- /* @__PURE__ */ jsx("dd", { className: "text-foreground font-medium", children: traveller.fullName })
4595
- ] })
4596
- ] }) }),
4597
- /* @__PURE__ */ jsx(FormSection2, { title: L.detailsSectionTitle, children: sortedFields.map((field) => {
4598
- var _a2;
4599
- return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
4600
- /* @__PURE__ */ jsx(
4601
- FieldRenderer,
4602
- {
4603
- field,
4604
- value: current[field.id],
4605
- onChange: (v) => setField(field.id, v),
4606
- defaultPhoneCountry,
4607
- labels: L
4608
- }
4609
- ),
4610
- ((_a2 = field.helpText) == null ? void 0 : _a2.trim()) && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground font-ui leading-relaxed", children: field.helpText.trim() })
4611
- ] }, field.id);
4612
- }) }),
4613
- termsEnabled && terms && /* @__PURE__ */ jsxs(FormSection2, { title: L.termsSectionTitle, children: [
4614
- /* @__PURE__ */ jsx("div", { className: "max-h-72 overflow-y-auto rounded-lg border border-border bg-muted/30 p-4", children: /* @__PURE__ */ jsx("div", { className: "whitespace-pre-wrap text-sm leading-relaxed text-foreground font-ui", children: terms.markdown }) }),
4615
- acceptControl === "checkbox" ? /* @__PURE__ */ jsxs("label", { className: "flex cursor-pointer items-start gap-2.5 font-ui text-sm text-foreground", children: [
4616
- /* @__PURE__ */ jsx(
4617
- "input",
4618
- {
4619
- type: "checkbox",
4620
- checked: termsAccepted,
4621
- required: true,
4622
- onChange: (e) => setField(TERMS_ACCEPT_KEY, e.target.checked),
4623
- className: "mt-0.5 h-4 w-4 shrink-0 accent-primary cursor-pointer"
4624
- }
4625
- ),
4626
- /* @__PURE__ */ jsx("span", { children: L.termsAccept })
4627
- ] }) : /* @__PURE__ */ jsxs(
4628
- "div",
4562
+ ) : (
4563
+ /* Fallback: banner bg-primary com logo centralizado */
4564
+ /* @__PURE__ */ jsx("div", { className: "relative flex h-[190px] w-full items-center justify-center bg-primary sm:h-[220px]", children: logo && /* eslint-disable-next-line @next/next/no-img-element */
4565
+ /* @__PURE__ */ jsx(
4566
+ "img",
4629
4567
  {
4630
- role: "radiogroup",
4631
- "aria-label": L.termsSectionTitle,
4632
- className: "flex flex-wrap items-center gap-x-6 gap-y-3",
4633
- children: [
4634
- /* @__PURE__ */ jsxs("label", { className: "flex min-h-9 cursor-pointer items-center gap-2.5 font-ui text-sm text-foreground", children: [
4635
- /* @__PURE__ */ jsx(
4636
- "input",
4637
- {
4638
- type: "radio",
4639
- name: "registration-terms-accept",
4640
- checked: termsAccepted,
4641
- required: true,
4642
- onChange: () => setField(TERMS_ACCEPT_KEY, true),
4643
- className: "h-4 w-4 shrink-0 accent-primary cursor-pointer"
4644
- }
4645
- ),
4646
- L.termsAccept
4647
- ] }),
4648
- /* @__PURE__ */ jsxs("label", { className: "flex min-h-9 cursor-pointer items-center gap-2.5 font-ui text-sm text-muted-foreground", children: [
4649
- /* @__PURE__ */ jsx(
4650
- "input",
4651
- {
4652
- type: "radio",
4653
- name: "registration-terms-accept",
4654
- checked: current[TERMS_ACCEPT_KEY] === false,
4655
- onChange: () => setField(TERMS_ACCEPT_KEY, false),
4656
- className: "h-4 w-4 shrink-0 accent-primary cursor-pointer"
4657
- }
4658
- ),
4659
- L.termsDecline
4660
- ] })
4661
- ]
4568
+ src: logo,
4569
+ alt: logoAlt,
4570
+ className: "block h-auto w-[120px] object-contain brightness-0 invert"
4662
4571
  }
4663
- )
4664
- ] }),
4665
- error && /* @__PURE__ */ jsx("p", { role: "alert", className: "text-sm text-destructive font-ui", children: error }),
4666
- /* @__PURE__ */ jsx("div", { className: "flex justify-center pt-2", children: /* @__PURE__ */ jsx(
4667
- "button",
4668
- {
4669
- type: "submit",
4670
- disabled: loading,
4671
- className: cn(
4672
- "inline-flex items-center justify-center gap-2 rounded-full px-10 py-3.5",
4673
- "bg-primary text-primary-foreground font-ui font-semibold text-sm",
4674
- "transition-colors hover:bg-primary/90 focus-visible:outline-none",
4675
- "focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
4676
- "disabled:pointer-events-none disabled:opacity-60"
4677
- ),
4678
- children: loading ? /* @__PURE__ */ jsxs(Fragment, { children: [
4679
- /* @__PURE__ */ jsxs(
4680
- "svg",
4572
+ ) })
4573
+ ),
4574
+ /* @__PURE__ */ jsxs("div", { className: "px-6 sm:px-8 pt-8 pb-8 flex flex-col gap-10", children: [
4575
+ /* @__PURE__ */ jsxs("div", { children: [
4576
+ /* @__PURE__ */ jsx("h2", { className: "text-2xl font-black uppercase tracking-wide text-foreground font-heading leading-tight", children: title }),
4577
+ /* @__PURE__ */ jsx("p", { className: "mt-1.5 text-sm text-muted-foreground font-ui", children: subtitle != null ? subtitle : L.formSubtitle })
4578
+ ] }),
4579
+ hasTripInfo && /* @__PURE__ */ jsx(FormSection2, { title: L.tripInfoSectionTitle, children: /* @__PURE__ */ jsxs("dl", { className: "grid grid-cols-1 gap-x-6 gap-y-3 text-sm font-ui sm:grid-cols-[max-content_1fr]", children: [
4580
+ adventure && /* @__PURE__ */ jsxs(Fragment, { children: [
4581
+ /* @__PURE__ */ jsx("dt", { className: "text-muted-foreground", children: L.adventureLabel }),
4582
+ /* @__PURE__ */ jsx("dd", { className: "text-foreground font-medium", children: adventure.name })
4583
+ ] }),
4584
+ dateRange && /* @__PURE__ */ jsxs(Fragment, { children: [
4585
+ /* @__PURE__ */ jsx("dt", { className: "text-muted-foreground", children: (adventure == null ? void 0 : adventure.startDate) && (adventure == null ? void 0 : adventure.endDate) ? "Dates" : "Date" }),
4586
+ /* @__PURE__ */ jsx("dd", { className: "text-foreground", children: dateRange })
4587
+ ] }),
4588
+ (adventure == null ? void 0 : adventure.partnerName) && /* @__PURE__ */ jsxs(Fragment, { children: [
4589
+ /* @__PURE__ */ jsx("dt", { className: "text-muted-foreground", children: L.partnerLabel }),
4590
+ /* @__PURE__ */ jsx("dd", { className: "text-foreground", children: adventure.partnerName })
4591
+ ] }),
4592
+ booking && /* @__PURE__ */ jsxs(Fragment, { children: [
4593
+ /* @__PURE__ */ jsx("dt", { className: "text-muted-foreground", children: L.bookingLabel }),
4594
+ /* @__PURE__ */ jsx("dd", { className: "text-foreground font-mono tabular-nums", children: booking.id })
4595
+ ] }),
4596
+ traveller && /* @__PURE__ */ jsxs(Fragment, { children: [
4597
+ /* @__PURE__ */ jsx("dt", { className: "text-muted-foreground", children: L.travellerLabel }),
4598
+ /* @__PURE__ */ jsx("dd", { className: "text-foreground font-medium", children: traveller.fullName })
4599
+ ] })
4600
+ ] }) }),
4601
+ /* @__PURE__ */ jsx(FormSection2, { title: L.detailsSectionTitle, children: sortedFields.map((field) => {
4602
+ var _a2;
4603
+ return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
4604
+ /* @__PURE__ */ jsx(
4605
+ FieldRenderer,
4681
4606
  {
4682
- className: "h-4 w-4 animate-spin",
4683
- viewBox: "0 0 24 24",
4684
- fill: "none",
4685
- children: [
4607
+ field,
4608
+ value: current[field.id],
4609
+ onChange: (v) => setField(field.id, v),
4610
+ defaultPhoneCountry,
4611
+ labels: L
4612
+ }
4613
+ ),
4614
+ ((_a2 = field.helpText) == null ? void 0 : _a2.trim()) && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground font-ui leading-relaxed", children: field.helpText.trim() })
4615
+ ] }, field.id);
4616
+ }) }),
4617
+ termsEnabled && terms && /* @__PURE__ */ jsxs(FormSection2, { title: L.termsSectionTitle, children: [
4618
+ /* @__PURE__ */ jsx("div", { className: "max-h-72 overflow-y-auto rounded-lg border border-border bg-muted/30 p-4", children: /* @__PURE__ */ jsx("div", { className: "whitespace-pre-wrap text-sm leading-relaxed text-foreground font-ui", children: terms.markdown }) }),
4619
+ acceptControl === "checkbox" ? /* @__PURE__ */ jsxs("label", { className: "flex cursor-pointer items-start gap-2.5 font-ui text-sm text-foreground", children: [
4620
+ /* @__PURE__ */ jsx(
4621
+ "input",
4622
+ {
4623
+ type: "checkbox",
4624
+ checked: termsAccepted,
4625
+ required: true,
4626
+ onChange: (e) => setField(TERMS_ACCEPT_KEY, e.target.checked),
4627
+ className: "mt-0.5 h-4 w-4 shrink-0 accent-primary cursor-pointer"
4628
+ }
4629
+ ),
4630
+ /* @__PURE__ */ jsx("span", { children: L.termsAccept })
4631
+ ] }) : /* @__PURE__ */ jsxs(
4632
+ "div",
4633
+ {
4634
+ role: "radiogroup",
4635
+ "aria-label": L.termsSectionTitle,
4636
+ className: "flex flex-wrap items-center gap-x-6 gap-y-3",
4637
+ children: [
4638
+ /* @__PURE__ */ jsxs("label", { className: "flex min-h-9 cursor-pointer items-center gap-2.5 font-ui text-sm text-foreground", children: [
4686
4639
  /* @__PURE__ */ jsx(
4687
- "circle",
4640
+ "input",
4688
4641
  {
4689
- className: "opacity-25",
4690
- cx: "12",
4691
- cy: "12",
4692
- r: "10",
4693
- stroke: "currentColor",
4694
- strokeWidth: "4"
4642
+ type: "radio",
4643
+ name: "registration-terms-accept",
4644
+ checked: termsAccepted,
4645
+ required: true,
4646
+ onChange: () => setField(TERMS_ACCEPT_KEY, true),
4647
+ className: "h-4 w-4 shrink-0 accent-primary cursor-pointer"
4695
4648
  }
4696
4649
  ),
4650
+ L.termsAccept
4651
+ ] }),
4652
+ /* @__PURE__ */ jsxs("label", { className: "flex min-h-9 cursor-pointer items-center gap-2.5 font-ui text-sm text-muted-foreground", children: [
4697
4653
  /* @__PURE__ */ jsx(
4698
- "path",
4654
+ "input",
4699
4655
  {
4700
- className: "opacity-75",
4701
- fill: "currentColor",
4702
- d: "M4 12a8 8 0 018-8v4l3-3-3-3v4a8 8 0 00-8 8h4z"
4656
+ type: "radio",
4657
+ name: "registration-terms-accept",
4658
+ checked: current[TERMS_ACCEPT_KEY] === false,
4659
+ onChange: () => setField(TERMS_ACCEPT_KEY, false),
4660
+ className: "h-4 w-4 shrink-0 accent-primary cursor-pointer"
4703
4661
  }
4704
- )
4705
- ]
4706
- }
4662
+ ),
4663
+ L.termsDecline
4664
+ ] })
4665
+ ]
4666
+ }
4667
+ )
4668
+ ] }),
4669
+ error && /* @__PURE__ */ jsx("p", { role: "alert", className: "text-sm text-destructive font-ui", children: error }),
4670
+ /* @__PURE__ */ jsx("div", { className: "flex justify-center pt-2", children: /* @__PURE__ */ jsx(
4671
+ "button",
4672
+ {
4673
+ type: "submit",
4674
+ disabled: loading,
4675
+ className: cn(
4676
+ "inline-flex items-center justify-center gap-2 rounded-full px-10 py-3.5",
4677
+ "bg-primary text-primary-foreground font-ui font-semibold text-sm",
4678
+ "transition-colors hover:bg-primary/90 focus-visible:outline-none",
4679
+ "focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
4680
+ "disabled:pointer-events-none disabled:opacity-60"
4707
4681
  ),
4708
- L.submitting
4709
- ] }) : L.submitButton
4710
- }
4711
- ) })
4682
+ children: loading ? /* @__PURE__ */ jsxs(Fragment, { children: [
4683
+ /* @__PURE__ */ jsxs(
4684
+ "svg",
4685
+ {
4686
+ className: "h-4 w-4 animate-spin",
4687
+ viewBox: "0 0 24 24",
4688
+ fill: "none",
4689
+ children: [
4690
+ /* @__PURE__ */ jsx(
4691
+ "circle",
4692
+ {
4693
+ className: "opacity-25",
4694
+ cx: "12",
4695
+ cy: "12",
4696
+ r: "10",
4697
+ stroke: "currentColor",
4698
+ strokeWidth: "4"
4699
+ }
4700
+ ),
4701
+ /* @__PURE__ */ jsx(
4702
+ "path",
4703
+ {
4704
+ className: "opacity-75",
4705
+ fill: "currentColor",
4706
+ d: "M4 12a8 8 0 018-8v4l3-3-3-3v4a8 8 0 00-8 8h4z"
4707
+ }
4708
+ )
4709
+ ]
4710
+ }
4711
+ ),
4712
+ L.submitting
4713
+ ] }) : L.submitButton
4714
+ }
4715
+ ) })
4716
+ ] })
4712
4717
  ]
4713
4718
  }
4714
4719
  );
@@ -4776,7 +4781,7 @@ function RegistrationSuccessCard({
4776
4781
  var _a, _b;
4777
4782
  return ((_a = a.order) != null ? _a : 0) - ((_b = b.order) != null ? _b : 0);
4778
4783
  }).filter((f) => Object.prototype.hasOwnProperty.call(answers, f.id));
4779
- return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-10", className), children: [
4784
+ return /* @__PURE__ */ jsxs("div", { className: cn("rounded-xl border border-border bg-card p-6 sm:p-8 flex flex-col gap-10", className), children: [
4780
4785
  /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-3 text-center", children: [
4781
4786
  /* @__PURE__ */ jsx("div", { className: "inline-flex h-14 w-14 items-center justify-center rounded-full bg-primary/10 text-primary", children: /* @__PURE__ */ jsx(CircleCheckIcon, { size: 28 }) }),
4782
4787
  /* @__PURE__ */ jsx("h2", { className: "text-2xl font-black uppercase tracking-wide text-foreground font-heading leading-tight", children: title }),