@standhigher/besttrack-page-extension 0.5.12 → 0.5.14

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.
Files changed (2) hide show
  1. package/dist/index.js +45 -22
  2. package/package.json +2 -2
package/dist/index.js CHANGED
@@ -836,12 +836,17 @@ function toEvents(details) {
836
836
  }));
837
837
  }
838
838
  function toOrderItems(items) {
839
- return (items ?? []).map((item, index) => ({
840
- id: item.variant_id || item.product_id || `item-${index}`,
841
- title: [item.title, item.variant_title].filter(Boolean).join(" - "),
842
- quantity: item.quantity,
843
- imageUrl: item.image_url || void 0
844
- }));
839
+ return (items ?? []).map((item, index) => {
840
+ const productId = (item.product_id ?? "").replace("gid://shopify/Product/", "");
841
+ const href = resolveShopifyRecommendHref(void 0, productId);
842
+ return {
843
+ id: item.variant_id || item.product_id || `item-${index}`,
844
+ title: [item.title, item.variant_title].filter(Boolean).join(" - "),
845
+ quantity: item.quantity,
846
+ imageUrl: item.image_url || void 0,
847
+ ...href ? { href } : {}
848
+ };
849
+ });
845
850
  }
846
851
  function cityRegion(milestone) {
847
852
  const records = milestone?.rawEventList?.length ? milestone.rawEventList : milestone?.nodeList ?? [];
@@ -1345,12 +1350,24 @@ var trackingProgressStyles = `
1345
1350
  .bt-progress__label { font-size: 11px; line-height: 14px; }
1346
1351
  }
1347
1352
  `;
1353
+ var packageNameStyles = `
1354
+ .bt-package-name { position: relative; width: 100%; max-width: 100%; min-width: 0; outline: none; }
1355
+ .bt-package-name__text { display: block; width: 100%; max-width: 100%; margin: 0; overflow: hidden; font-size: 14px; font-weight: 500; color: #1e293b; text-overflow: ellipsis; white-space: nowrap; }
1356
+ .bt-package-name__tooltip { position: absolute; bottom: calc(100% + 8px); left: 0; z-index: 30; width: max-content; max-width: min(320px, calc(100vw - 48px)); padding: 8px 10px; border-radius: 6px; background: #0f172a; box-shadow: 0 12px 28px rgba(15, 23, 42, 0.18); color: #fff; font-size: 12px; font-weight: 500; line-height: 1.35; opacity: 0; overflow-wrap: anywhere; pointer-events: none; transform: translateY(2px); transition: opacity 0.15s ease, transform 0.15s ease, visibility 0.15s ease; visibility: hidden; white-space: normal; }
1357
+ .bt-package-name:hover .bt-package-name__tooltip,
1358
+ .bt-package-name:focus-within .bt-package-name__tooltip { opacity: 1; transform: translateY(0); visibility: visible; }
1359
+ .bt-package-reorder { box-sizing: border-box; display: inline-flex; width: fit-content; height: 30px; flex-shrink: 0; align-items: center; justify-content: center; font-size: 13px; font-weight: 500; color: #1e293b; border: 1px solid #cbd5e1; border-radius: 6px; padding: 0 16px; background: #fff; cursor: pointer; text-decoration: none; transition: border-color 0.15s; }
1360
+ .bt-package-reorder:hover { border-color: #94a3b8; }
1361
+ `;
1348
1362
  function text(props, key, fallback = "") {
1349
1363
  return typeof props[key] === "string" ? props[key] : fallback;
1350
1364
  }
1351
1365
  function safeHref(value) {
1352
1366
  return safeTrackingPageUrl(value);
1353
1367
  }
1368
+ function packageReorderHref(href) {
1369
+ return safeHref(href) ?? resolveShopifyRecommendHref(href) ?? "/products/";
1370
+ }
1354
1371
  function safeImageUrl(value) {
1355
1372
  return safeTrackingPageUrl(value);
1356
1373
  }
@@ -1441,23 +1458,29 @@ function ShippingTimeline({ events }) {
1441
1458
  }
1442
1459
  function PackageContents({ items }) {
1443
1460
  if (!items.length) return /* @__PURE__ */ jsx2("p", { style: { margin: 0, color: "#64748b", fontSize: 14 }, children: "Package contents are not available for this shipment." });
1444
- return /* @__PURE__ */ jsx2("div", { style: { display: "flex", flexDirection: "column", gap: 12 }, children: items.map((item) => {
1445
- const title = item.title;
1446
- return /* @__PURE__ */ jsxs("article", { style: { display: "flex", alignItems: "center", gap: 12, padding: "8px 0" }, children: [
1447
- /* @__PURE__ */ jsx2(ProductImage, { src: item.imageUrl, alt: title }),
1448
- /* @__PURE__ */ jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [
1449
- /* @__PURE__ */ jsx2("p", { style: { margin: 0, fontSize: 14, fontWeight: 500, color: "#1e293b", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: title }),
1450
- item.description ? /* @__PURE__ */ jsx2("p", { style: { margin: "4px 0 0", fontSize: 13, color: "#64748b" }, children: item.description }) : null,
1451
- /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexWrap: "wrap", alignItems: "center", gap: 8, marginTop: 4 }, children: [
1452
- /* @__PURE__ */ jsxs("p", { style: { margin: 0, fontSize: 13, color: "#64748b" }, children: [
1453
- "x",
1454
- item.quantity
1461
+ return /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: 12 }, children: [
1462
+ /* @__PURE__ */ jsx2("style", { children: packageNameStyles }),
1463
+ items.map((item) => {
1464
+ const title = item.title;
1465
+ return /* @__PURE__ */ jsxs("article", { style: { display: "flex", alignItems: "center", gap: 12, padding: "8px 0", overflow: "visible" }, children: [
1466
+ /* @__PURE__ */ jsx2(ProductImage, { src: item.imageUrl, alt: title }),
1467
+ /* @__PURE__ */ jsxs("div", { style: { flex: 1, minWidth: 0, overflow: "visible" }, children: [
1468
+ /* @__PURE__ */ jsxs("div", { className: "bt-package-name", tabIndex: 0, "aria-label": title, children: [
1469
+ /* @__PURE__ */ jsx2("p", { className: "bt-package-name__text", children: title }),
1470
+ /* @__PURE__ */ jsx2("span", { className: "bt-package-name__tooltip", role: "tooltip", children: title })
1455
1471
  ] }),
1456
- safeHref(item.href) ? /* @__PURE__ */ jsx2("a", { href: safeHref(item.href), style: { display: "inline-flex", minHeight: 32, alignItems: "center", padding: "6px 16px", border: "1px solid #cbd5e1", borderRadius: 6, color: "#1e293b", fontSize: 13, fontWeight: 500, textDecoration: "none" }, children: "Reorder" }) : null
1472
+ item.description ? /* @__PURE__ */ jsx2("p", { style: { margin: "4px 0 0", fontSize: 13, color: "#64748b" }, children: item.description }) : null,
1473
+ /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexWrap: "wrap", alignItems: "center", gap: 8, marginTop: 4 }, children: [
1474
+ /* @__PURE__ */ jsxs("p", { style: { margin: 0, fontSize: 13, color: "#64748b" }, children: [
1475
+ "x",
1476
+ item.quantity
1477
+ ] }),
1478
+ /* @__PURE__ */ jsx2("a", { href: packageReorderHref(item.href), className: "bt-package-reorder", children: "Reorder" })
1479
+ ] })
1457
1480
  ] })
1458
- ] })
1459
- ] }, item.id);
1460
- }) });
1481
+ ] }, item.id);
1482
+ })
1483
+ ] });
1461
1484
  }
1462
1485
  function RecommendationCards({ items }) {
1463
1486
  const autoplay = useMemo2(() => Autoplay({ delay: 3e3, stopOnInteraction: false, stopOnMouseEnter: true }), []);
@@ -1650,7 +1673,7 @@ function TrackingLoading() {
1650
1673
  const id = useId();
1651
1674
  return /* @__PURE__ */ jsxs3(Fragment2, { children: [
1652
1675
  /* @__PURE__ */ jsx4("style", { children: loadingStyles }),
1653
- /* @__PURE__ */ jsxs3("div", { role: "status", "aria-label": "\u67E5\u8BE2\u4E2D...", "aria-live": "polite", "aria-atomic": "true", style: { display: "flex", flexDirection: "column", alignItems: "center", gap: 16, marginTop: 56, paddingBottom: 8, textAlign: "center" }, children: [
1676
+ /* @__PURE__ */ jsxs3("div", { role: "status", "aria-label": "\u67E5\u8BE2\u4E2D...", "aria-live": "polite", "aria-atomic": "true", style: { display: "flex", flexDirection: "column", alignItems: "center", gap: 16, marginTop: 45, paddingBottom: 8, textAlign: "center" }, children: [
1654
1677
  /* @__PURE__ */ jsx4("p", { style: { margin: 0, color: "var(--pb-color-muted, #64748b)", fontSize: 14, fontWeight: 400, lineHeight: "20px" }, children: "\u67E5\u8BE2\u4E2D..." }),
1655
1678
  /* @__PURE__ */ jsxs3("svg", { width: "56", height: "64", viewBox: "0 0 56 64", fill: "none", "aria-hidden": "true", focusable: "false", style: { display: "block", flexShrink: 0, overflow: "visible" }, children: [
1656
1679
  /* @__PURE__ */ jsxs3("defs", { children: [
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@standhigher/besttrack-page-extension",
3
- "version": "0.5.12",
3
+ "version": "0.5.14",
4
4
  "description": "BestTrack business extension entry point for @standhigher/puck-page-builder.",
5
5
  "type": "module",
6
6
  "files": [
@@ -22,7 +22,7 @@
22
22
  "dependencies": {
23
23
  "embla-carousel-autoplay": "^8.6.0",
24
24
  "embla-carousel-react": "^8.6.0",
25
- "@standhigher/puck-page-builder": "0.12.12"
25
+ "@standhigher/puck-page-builder": "0.12.13"
26
26
  },
27
27
  "devDependencies": {
28
28
  "tsup": "^8.5.1",