@planetaexo/design-system 0.19.0 → 0.21.0
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 +33 -34
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +20 -2
- package/dist/index.d.ts +20 -2
- package/dist/index.js +33 -34
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -1282,7 +1282,11 @@ function Alert({ variant = "info", children, className }) {
|
|
|
1282
1282
|
}
|
|
1283
1283
|
);
|
|
1284
1284
|
}
|
|
1285
|
-
function AdventureCard({
|
|
1285
|
+
function AdventureCard({
|
|
1286
|
+
adventure,
|
|
1287
|
+
labels,
|
|
1288
|
+
interactionsDisabled
|
|
1289
|
+
}) {
|
|
1286
1290
|
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k;
|
|
1287
1291
|
const isControlled = (_b = (_a = adventure.optionals) == null ? void 0 : _a.some((o) => o.onCheckedChange !== void 0)) != null ? _b : false;
|
|
1288
1292
|
const [checkedInternal, setCheckedInternal] = React23__namespace.useState(
|
|
@@ -1351,15 +1355,19 @@ function AdventureCard({ adventure, labels }) {
|
|
|
1351
1355
|
const currentQty = (_c2 = opt.quantity) != null ? _c2 : minQty;
|
|
1352
1356
|
const canDec = currentQty > minQty;
|
|
1353
1357
|
const canInc = currentQty < maxQty;
|
|
1354
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center gap-x-3 gap-y-1.5", children: [
|
|
1355
|
-
/* @__PURE__ */ jsxRuntime.jsxs("label", { className: "flex items-center gap-3 cursor-
|
|
1358
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-wrap items-center gap-x-3 gap-y-1.5", interactionsDisabled && "opacity-60"), children: [
|
|
1359
|
+
/* @__PURE__ */ jsxRuntime.jsxs("label", { className: cn("flex items-center gap-3 group", interactionsDisabled ? "cursor-not-allowed" : "cursor-pointer"), children: [
|
|
1356
1360
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1357
1361
|
"input",
|
|
1358
1362
|
{
|
|
1359
1363
|
type: "checkbox",
|
|
1360
1364
|
checked,
|
|
1361
1365
|
onChange: () => toggleOptional(opt),
|
|
1362
|
-
|
|
1366
|
+
disabled: interactionsDisabled,
|
|
1367
|
+
className: cn(
|
|
1368
|
+
"h-4 w-4 shrink-0 rounded border-border accent-primary",
|
|
1369
|
+
interactionsDisabled ? "cursor-not-allowed" : "cursor-pointer"
|
|
1370
|
+
)
|
|
1363
1371
|
}
|
|
1364
1372
|
),
|
|
1365
1373
|
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-sm font-sans text-foreground/80 group-hover:text-foreground transition-colors leading-snug", children: [
|
|
@@ -1379,14 +1387,14 @@ function AdventureCard({ adventure, labels }) {
|
|
|
1379
1387
|
type: "button",
|
|
1380
1388
|
onClick: () => {
|
|
1381
1389
|
var _a3;
|
|
1382
|
-
return canDec && ((_a3 = opt.onQuantityChange) == null ? void 0 : _a3.call(opt, opt.id, currentQty - 1));
|
|
1390
|
+
return !interactionsDisabled && canDec && ((_a3 = opt.onQuantityChange) == null ? void 0 : _a3.call(opt, opt.id, currentQty - 1));
|
|
1383
1391
|
},
|
|
1384
|
-
disabled: !canDec,
|
|
1392
|
+
disabled: interactionsDisabled || !canDec,
|
|
1385
1393
|
"aria-label": (_d2 = opt.decreaseQuantityLabel) != null ? _d2 : "Decrease quantity",
|
|
1386
1394
|
className: cn(
|
|
1387
1395
|
"h-7 w-7 rounded border border-border flex items-center justify-center text-sm font-semibold",
|
|
1388
1396
|
"transition-colors",
|
|
1389
|
-
canDec ? "hover:bg-muted cursor-pointer text-foreground" : "opacity-40 cursor-not-allowed text-muted-foreground"
|
|
1397
|
+
interactionsDisabled ? "opacity-40 cursor-not-allowed text-muted-foreground" : canDec ? "hover:bg-muted cursor-pointer text-foreground" : "opacity-40 cursor-not-allowed text-muted-foreground"
|
|
1390
1398
|
),
|
|
1391
1399
|
children: "\u2212"
|
|
1392
1400
|
}
|
|
@@ -1398,14 +1406,14 @@ function AdventureCard({ adventure, labels }) {
|
|
|
1398
1406
|
type: "button",
|
|
1399
1407
|
onClick: () => {
|
|
1400
1408
|
var _a3;
|
|
1401
|
-
return canInc && ((_a3 = opt.onQuantityChange) == null ? void 0 : _a3.call(opt, opt.id, currentQty + 1));
|
|
1409
|
+
return !interactionsDisabled && canInc && ((_a3 = opt.onQuantityChange) == null ? void 0 : _a3.call(opt, opt.id, currentQty + 1));
|
|
1402
1410
|
},
|
|
1403
|
-
disabled: !canInc,
|
|
1411
|
+
disabled: interactionsDisabled || !canInc,
|
|
1404
1412
|
"aria-label": (_e2 = opt.increaseQuantityLabel) != null ? _e2 : "Increase quantity",
|
|
1405
1413
|
className: cn(
|
|
1406
1414
|
"h-7 w-7 rounded border border-border flex items-center justify-center text-sm font-semibold",
|
|
1407
1415
|
"transition-colors",
|
|
1408
|
-
canInc ? "hover:bg-muted cursor-pointer text-foreground" : "opacity-40 cursor-not-allowed text-muted-foreground"
|
|
1416
|
+
interactionsDisabled ? "opacity-40 cursor-not-allowed text-muted-foreground" : canInc ? "hover:bg-muted cursor-pointer text-foreground" : "opacity-40 cursor-not-allowed text-muted-foreground"
|
|
1409
1417
|
),
|
|
1410
1418
|
children: "+"
|
|
1411
1419
|
}
|
|
@@ -1477,28 +1485,16 @@ function OfferSidebar({
|
|
|
1477
1485
|
bookLabel,
|
|
1478
1486
|
bookDisabled,
|
|
1479
1487
|
labels,
|
|
1480
|
-
bookHref
|
|
1481
|
-
bookHrefLabel
|
|
1488
|
+
bookHref
|
|
1482
1489
|
}) {
|
|
1483
1490
|
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l;
|
|
1484
1491
|
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4", children: [
|
|
1485
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "hidden lg:flex rounded-2xl border border-border bg-card p-5 flex-col gap-4", children: [
|
|
1492
|
+
!bookHref && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "hidden lg:flex rounded-2xl border border-border bg-card p-5 flex-col gap-4", children: [
|
|
1486
1493
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
1487
1494
|
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs uppercase tracking-widest text-muted-foreground font-heading mb-1", children: (_a = labels == null ? void 0 : labels.bookingTotal) != null ? _a : "Booking Total" }),
|
|
1488
1495
|
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-3xl font-black text-primary font-heading leading-none", children: total })
|
|
1489
1496
|
] }),
|
|
1490
|
-
|
|
1491
|
-
"a",
|
|
1492
|
-
{
|
|
1493
|
-
href: bookHref,
|
|
1494
|
-
className: cn(
|
|
1495
|
-
"w-full inline-flex items-center justify-center rounded-full bg-primary py-3 text-sm font-bold tracking-wide uppercase",
|
|
1496
|
-
"text-primary-foreground font-heading transition-colors hover:bg-primary/90",
|
|
1497
|
-
"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
|
|
1498
|
-
),
|
|
1499
|
-
children: bookHrefLabel != null ? bookHrefLabel : bookLabel
|
|
1500
|
-
}
|
|
1501
|
-
) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
1497
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1502
1498
|
"button",
|
|
1503
1499
|
{
|
|
1504
1500
|
type: "button",
|
|
@@ -2256,6 +2252,7 @@ function Offer({
|
|
|
2256
2252
|
continueDisabled,
|
|
2257
2253
|
labels,
|
|
2258
2254
|
confirmedState,
|
|
2255
|
+
interactionsDisabled,
|
|
2259
2256
|
className
|
|
2260
2257
|
}) {
|
|
2261
2258
|
var _a, _b, _c;
|
|
@@ -2290,7 +2287,7 @@ function Offer({
|
|
|
2290
2287
|
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.MapIcon, { className: "w-5 h-5 text-primary shrink-0" }),
|
|
2291
2288
|
/* @__PURE__ */ jsxRuntime.jsx("h2", { className: "font-bold text-foreground font-heading text-base", children: (_b = labels == null ? void 0 : labels.includedAdventures) != null ? _b : "Included Adventures" })
|
|
2292
2289
|
] }),
|
|
2293
|
-
adventures.map((adventure) => /* @__PURE__ */ jsxRuntime.jsx(AdventureCard, { adventure, labels }, adventure.id))
|
|
2290
|
+
adventures.map((adventure) => /* @__PURE__ */ jsxRuntime.jsx(AdventureCard, { adventure, labels, interactionsDisabled }, adventure.id))
|
|
2294
2291
|
] }),
|
|
2295
2292
|
!isShowingCheckout && /* @__PURE__ */ jsxRuntime.jsx(
|
|
2296
2293
|
OfferSummarySection,
|
|
@@ -2327,8 +2324,7 @@ function Offer({
|
|
|
2327
2324
|
bookLabel: continueLabel,
|
|
2328
2325
|
bookDisabled: continueDisabled,
|
|
2329
2326
|
labels,
|
|
2330
|
-
bookHref: confirmedState == null ? void 0 : confirmedState.viewBookingHref
|
|
2331
|
-
bookHrefLabel: confirmedState == null ? void 0 : confirmedState.viewBookingLabel
|
|
2327
|
+
bookHref: confirmedState == null ? void 0 : confirmedState.viewBookingHref
|
|
2332
2328
|
}
|
|
2333
2329
|
) })
|
|
2334
2330
|
] }),
|
|
@@ -5185,13 +5181,14 @@ function formatDateRange(adventure, fmt) {
|
|
|
5185
5181
|
function FormSection2({
|
|
5186
5182
|
title,
|
|
5187
5183
|
children,
|
|
5188
|
-
className
|
|
5184
|
+
className,
|
|
5185
|
+
breakInside = "avoid"
|
|
5189
5186
|
}) {
|
|
5190
5187
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
5191
5188
|
"div",
|
|
5192
5189
|
{
|
|
5193
5190
|
className: cn("flex flex-col gap-5", className),
|
|
5194
|
-
style: { breakInside
|
|
5191
|
+
style: { breakInside },
|
|
5195
5192
|
children: [
|
|
5196
5193
|
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
5197
5194
|
"div",
|
|
@@ -6127,7 +6124,9 @@ function RegistrationSuccessCard({
|
|
|
6127
6124
|
density = "comfortable",
|
|
6128
6125
|
submissionTimestamps,
|
|
6129
6126
|
submissionTimestampsLabels,
|
|
6130
|
-
labels: scLabels
|
|
6127
|
+
labels: scLabels,
|
|
6128
|
+
tripInfoBreakInside = "avoid",
|
|
6129
|
+
termsTypography = "default"
|
|
6131
6130
|
}) {
|
|
6132
6131
|
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l;
|
|
6133
6132
|
const isMinimal = variant === "minimal";
|
|
@@ -6192,7 +6191,7 @@ function RegistrationSuccessCard({
|
|
|
6192
6191
|
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "tabular-nums", children: submissionTimestamps.lastUpdatedAt })
|
|
6193
6192
|
] })
|
|
6194
6193
|
] }),
|
|
6195
|
-
hasTripInfo && /* @__PURE__ */ jsxRuntime.jsx(FormSection2, { title: TL.sectionTitle, children: /* @__PURE__ */ jsxRuntime.jsxs("dl", { className: "flex flex-col gap-y-3 text-sm font-ui", children: [
|
|
6194
|
+
hasTripInfo && /* @__PURE__ */ jsxRuntime.jsx(FormSection2, { title: TL.sectionTitle, breakInside: tripInfoBreakInside, children: /* @__PURE__ */ jsxRuntime.jsxs("dl", { className: "flex flex-col gap-y-3 text-sm font-ui", children: [
|
|
6196
6195
|
adventure && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-x-4", children: [
|
|
6197
6196
|
/* @__PURE__ */ jsxRuntime.jsx("dt", { className: "w-1/2 text-muted-foreground break-words", children: TL.adventureLabel }),
|
|
6198
6197
|
/* @__PURE__ */ jsxRuntime.jsx("dd", { className: "w-1/2 text-foreground font-medium text-right min-w-0 break-words", children: adventure.name })
|
|
@@ -6244,8 +6243,8 @@ function RegistrationSuccessCard({
|
|
|
6244
6243
|
"p",
|
|
6245
6244
|
{
|
|
6246
6245
|
className: cn(
|
|
6247
|
-
"whitespace-pre-wrap break-words text-foreground
|
|
6248
|
-
isCompact ? "text-xs leading-snug" : "text-sm leading-relaxed"
|
|
6246
|
+
"whitespace-pre-wrap break-words text-foreground",
|
|
6247
|
+
termsTypography === "compact-serif" ? "font-serif text-[8pt] leading-tight" : cn("font-ui", isCompact ? "text-xs leading-snug" : "text-sm leading-relaxed")
|
|
6249
6248
|
),
|
|
6250
6249
|
children: terms.markdown
|
|
6251
6250
|
}
|