@vtex/faststore 0.0.7 → 0.0.10

package/dist/matter/order-placed/order-placed-deliveries.js

@@ -0,0 +1,380 @@
+"use client";
+import { defineComponent } from "../../core/dist/define-component.js";
+import "../../core/dist/index.js";
+import { useStorefrontFormatters } from "../../sdk/format/client.js";
+import { useIntl } from "../../sdk/i18n/client.js";
+import { DataOverrideContext, useDataOverride } from "../../sdk/data/data-override-context.js";
+import { AddressSummaryRoot } from "../../particles/address-summary/address-summary.js";
+import { CartItemRoot } from "../cart-item/cart-item.js";
+import { CartItemCompositions } from "../cart-item-compositions/cart-item-compositions.js";
+import { ESTIMATE_MESSAGE } from "../shipping-simulator/shipping-simulator.js";
+import { substituteTemplate } from "../../utils/substitute-template.js";
+import { useOrderPlaced } from "./order-placed.js";
+import { createContext, useContext } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/matter/order-placed/order-placed-deliveries.tsx
+/**
+* Order Placed format A (docs/features/order-placed/rfc-particles.md, Parts, part 3): the purchase's
+* items grouped by delivery across sellers. `OrderPlacedDeliveryList` reads `Order.deliveries` through
+* its own fragment and renders its child once per delivery; `OrderPlacedDeliveryGroup` states the
+* method, the promise and the item count and hands the address to the `AddressSummary*` leaves;
+* `OrderPlacedItemRow` presents each item through the cart's own `CartItemRoot` and leaves, so the
+* item reads as it did in the cart.
+*/
+const fragment = `
+  fragment OrderPlacedDeliveryListData on Query {
+    order(orderGroup: $orderGroup) {
+      __typename
+      id
+      deliveries {
+        id
+        shippingOption {
+          id
+          name
+          channel
+          shippingEstimate {
+            value
+            unit
+          }
+        }
+        estimatedDate
+        itemCount
+        pickupPointName
+        address {
+          id
+          recipientName
+          street
+          number
+          complement
+          neighborhood
+          city
+          state
+          postalCode
+          country
+        }
+        items {
+          __typename
+          id
+          quantity
+          price {
+            amount
+            currencyCode
+          }
+          listPrice {
+            amount
+            currencyCode
+          }
+          sellingPrice {
+            amount
+            currencyCode
+          }
+          gift
+          ownTotal {
+            amount
+            currencyCode
+          }
+          total {
+            amount
+            currencyCode
+          }
+          variant {
+            __typename
+            variantId
+            sku
+            name
+            image {
+              url
+              altText
+            }
+            availability
+          }
+          product {
+            __typename
+            productId
+            title
+            detailUrl
+            categories {
+              categoryId
+              name
+            }
+            brand {
+              brandId
+              name
+            }
+          }
+          compositions {
+            id
+            name
+            quantity
+            price {
+              amount
+              currencyCode
+            }
+            availability
+            assemblyId
+            ownTotal {
+              amount
+              currencyCode
+            }
+            total {
+              amount
+              currencyCode
+            }
+            customizations {
+              id
+              entries {
+                name
+                value
+              }
+            }
+            compositions {
+              id
+              name
+              quantity
+              price {
+                amount
+                currencyCode
+              }
+              availability
+              assemblyId
+              ownTotal {
+                amount
+                currencyCode
+              }
+              total {
+                amount
+                currencyCode
+              }
+              customizations {
+                id
+                entries {
+                  name
+                  value
+                }
+              }
+              compositions {
+                id
+                name
+                quantity
+                price {
+                  amount
+                  currencyCode
+                }
+                availability
+                assemblyId
+                ownTotal {
+                  amount
+                  currencyCode
+                }
+                total {
+                  amount
+                  currencyCode
+                }
+                customizations {
+                  id
+                  entries {
+                    name
+                    value
+                  }
+                }
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+`;
+const OrderDeliveryContext = createContext(null);
+const OrderPlacedItemContext = createContext(null);
+/** The delivery the nearest OrderPlacedDeliveryList renders this subtree for. */
+function useOrderDelivery() {
+	const delivery = useContext(OrderDeliveryContext);
+	if (!delivery) throw new Error("useOrderDelivery() must be used inside an <OrderPlacedDeliveryList> subtree.");
+	return delivery;
+}
+/** The item the nearest OrderPlacedItemRow renders this subtree for. */
+function useOrderPlacedItem() {
+	const item = useContext(OrderPlacedItemContext);
+	if (!item) throw new Error("useOrderPlacedItem() must be used inside an <OrderPlacedItemRow> subtree.");
+	return item;
+}
+const OrderPlacedDeliveryListDefinition = defineComponent({
+	name: "OrderPlacedDeliveryList",
+	importPath: "@vtex/faststore/components",
+	component: OrderPlacedDeliveryList,
+	fragment,
+	fetchStrategy: "reactive",
+	requiresContext: "order-placed",
+	providesContext: "order-delivery",
+	editor: {
+		label: "Order Placed Delivery List",
+		category: "commerce"
+	},
+	schema: {},
+	guideline: "The placed order grouped by delivery: one entry per way the items arrive (shipping method, channel and estimate), across sellers. Compose exactly one OrderPlacedDeliveryGroup as its child; the list renders it once per delivery, in the order the API returns them, and renders nothing when the order has no delivery. Must be inside OrderPlacedRoot. See order-placed.md."
+});
+const OrderPlacedDeliveryGroupDefinition = defineComponent({
+	name: "OrderPlacedDeliveryGroup",
+	importPath: "@vtex/faststore/components",
+	component: OrderPlacedDeliveryGroup,
+	requiresContext: "order-delivery",
+	providesContext: "address-summary",
+	editor: {
+		label: "Order Placed Delivery Group",
+		category: "commerce"
+	},
+	schema: {
+		dateTemplate: {
+			type: "string",
+			default: "Arrives by {date}",
+			label: "Date template"
+		},
+		itemCountTemplate: {
+			type: "string",
+			default: "{count} items",
+			label: "Item count template"
+		},
+		itemCountOneTemplate: {
+			type: "string",
+			default: "{count} item",
+			label: "Single item count template"
+		},
+		pickupPointTemplate: {
+			type: "string",
+			default: "Pickup at {name}",
+			label: "Pickup point template"
+		}
+	},
+	guideline: "One delivery of the placed order: its shipping method, its promise (the date under dateTemplate once the order system set one, otherwise the relative estimate sentence the checkout's delivery step showed, e.g. \"in 2 business days\"), its item count and, for a pickup, the pickup point's name. Compose AddressSummaryRecipient, AddressSummaryStreet and AddressSummaryLocality as children for the address (the shipping address, or the pickup point's for a pickup, masked as the order system returns it; nothing when the order carries none), and one OrderPlacedItemRow for the items. Style it through data-fs-order-placed-delivery-group and switch on data-fs-order-placed-delivery-group-channel (delivery, pickup, unknown). Must be the child of OrderPlacedDeliveryList. See order-placed.md."
+});
+const OrderPlacedItemRowDefinition = defineComponent({
+	name: "OrderPlacedItemRow",
+	importPath: "@vtex/faststore/components",
+	component: OrderPlacedItemRow,
+	requiresContext: "order-placed",
+	providesContext: ["cart-item-data", "order-placed-item"],
+	editor: {
+		label: "Order Placed Item Row",
+		category: "commerce"
+	},
+	schema: {},
+	guideline: "One purchased item of the delivery, presented with the cart's own item leaves, so it reads as it did in the cart. Compose read-only cart leaves as children: CartItemImage, CartItemProductLink, CartItemName, CartItemVariant, CartItemSku, CartItemPrice, CartItemListPrice, CartItemDiscountPercentage, CartItemLineTotal, CartItemOwnTotal, CartItemAggregateTotal, CartItemQuantityValue, CartItemGift, and OrderPlacedItemCompositions for its add-ons. Never compose CartItemQuantity, CartItemRemove, CartItemVariations, CartItemAvailable or CartItemUnavailable here: they read or change the live cart, not the placed order. Renders once per item of the nearest delivery; nothing outside a delivery. Must be inside OrderPlacedDeliveryGroup. See order-placed.md."
+});
+const OrderPlacedItemCompositionsDefinition = defineComponent({
+	name: "OrderPlacedItemCompositions",
+	importPath: "@vtex/faststore/components",
+	component: OrderPlacedItemCompositions,
+	requiresContext: "order-placed-item",
+	editor: {
+		label: "Order Placed Item Compositions",
+		category: "commerce"
+	},
+	schema: {},
+	guideline: "The add-on services of a placed item, nested under it with the cart's own composition markup (data-fs-cart-item-composition*): each one's name, quantity, unit price and customizations, children nested by depth. Renders nothing when the item has none, as every item of a purchase split across sellers. Never compose CartItemCompositions on this page instead: it reads the live cart. Must be inside OrderPlacedItemRow. See order-placed.md."
+});
+/** Renders its child once per delivery of the placed order. */
+function OrderPlacedDeliveryList({ className, children, $data: $dataProp }) {
+	useOrderPlaced();
+	const deliveries = useDataOverride($dataProp)?.deliveries ?? [];
+	if (deliveries.length === 0) return null;
+	return /* @__PURE__ */ jsx("div", {
+		className,
+		"data-fs-order-placed-delivery-list": "",
+		children: deliveries.map((delivery) => /* @__PURE__ */ jsx(OrderDeliveryContext, {
+			value: delivery,
+			children
+		}, delivery.id))
+	});
+}
+const CHANNEL_ATTRIBUTE = {
+	DELIVERY: "delivery",
+	PICKUP: "pickup",
+	UNKNOWN: "unknown"
+};
+/**
+* The relative promise, as the checkout's delivery step words it: the catalog's whole sentence for the
+* unit (`ESTIMATE_MESSAGE`), and "arrives today" at zero, never a translated fragment in a wrapper.
+*/
+function useRelativePromise(estimate) {
+	const intl = useIntl();
+	if (!estimate) return null;
+	if (estimate.value === 0) return intl.formatMessage({ id: "fs/shipping.estimate.today" });
+	const { id, variable } = ESTIMATE_MESSAGE[estimate.unit];
+	return intl.formatMessage({ id }, { [variable]: estimate.value });
+}
+/**
+* One delivery: method, promise, item count and pickup point, with its address provided to the
+* `AddressSummary*` children. The dated promise wins when the order carries one; otherwise the relative
+* estimate. A delivery with neither a method nor a date still shows its items and count.
+*/
+function OrderPlacedDeliveryGroup({ className, children, dateTemplate = "Arrives by {date}", itemCountTemplate = "{count} items", itemCountOneTemplate = "{count} item", pickupPointTemplate = "Pickup at {name}" }) {
+	const delivery = useOrderDelivery();
+	const { formatDate, pluralRule } = useStorefrontFormatters();
+	const { shippingOption, estimatedDate, itemCount, pickupPointName, address } = delivery;
+	const relativePromise = useRelativePromise(shippingOption?.shippingEstimate);
+	const promise = estimatedDate ? substituteTemplate(dateTemplate, { date: formatDate(new Date(estimatedDate), { dateStyle: "medium" }) }) : relativePromise;
+	const count = substituteTemplate(pluralRule(itemCount) === "one" ? itemCountOneTemplate : itemCountTemplate, { count: String(itemCount) });
+	return /* @__PURE__ */ jsxs("div", {
+		className,
+		"data-fs-order-placed-delivery-group": "",
+		"data-fs-order-placed-delivery-group-channel": CHANNEL_ATTRIBUTE[shippingOption?.channel ?? "UNKNOWN"],
+		children: [
+			shippingOption ? /* @__PURE__ */ jsx("p", {
+				"data-fs-order-placed-delivery-group-method": "",
+				children: shippingOption.name
+			}) : null,
+			promise ? /* @__PURE__ */ jsx("p", {
+				"data-fs-order-placed-delivery-group-date": "",
+				children: promise
+			}) : null,
+			/* @__PURE__ */ jsx("p", {
+				"data-fs-order-placed-delivery-group-count": "",
+				children: count
+			}),
+			pickupPointName ? /* @__PURE__ */ jsx("p", {
+				"data-fs-order-placed-delivery-group-pickup-point": "",
+				children: substituteTemplate(pickupPointTemplate, { name: pickupPointName })
+			}) : null,
+			/* @__PURE__ */ jsx(AddressSummaryRoot, {
+				address: address ?? {},
+				children
+			})
+		]
+	});
+}
+/**
+* Each item of the nearest delivery, through the cart's own `CartItemRoot`: the row publishes the
+* order item on `DataOverrideContext`, the seam `CartItemRoot` reads before its `$data`, so the cart's
+* leaves present it unchanged (ADR-0009's substitution; `cart-item.tsx` is not edited). Outside a
+* delivery, as straight under the root, the purchase has no items of its own to show.
+*/
+function OrderPlacedItemRow({ className, children }) {
+	useOrderPlaced();
+	const delivery = useContext(OrderDeliveryContext);
+	if (!delivery) return null;
+	return delivery.items.map((item) => /* @__PURE__ */ jsx(OrderPlacedItemContext, {
+		value: item,
+		children: /* @__PURE__ */ jsx(DataOverrideContext, {
+			value: item,
+			children: /* @__PURE__ */ jsx(CartItemRoot, {
+				className,
+				"data-fs-order-placed-item-row": "",
+				children
+			})
+		})
+	}, item.id));
+}
+/**
+* The item's add-ons, through the cart's own `CartItemCompositions`, which reads the item from the
+* row's `DataOverrideContext`. Rendered as a function, never composed in the page, so its `Query.cart`
+* fragment is never collected and the page reads only the order.
+*/
+function OrderPlacedItemCompositions({ className }) {
+	useOrderPlacedItem();
+	return /* @__PURE__ */ jsx(CartItemCompositions, { className });
+}
+//#endregion
+export { OrderPlacedDeliveryGroup, OrderPlacedDeliveryGroupDefinition, OrderPlacedDeliveryList, OrderPlacedDeliveryListDefinition, OrderPlacedItemCompositions, OrderPlacedItemCompositionsDefinition, OrderPlacedItemRow, OrderPlacedItemRowDefinition, useOrderDelivery, useOrderPlacedItem };
+
+//# sourceMappingURL=order-placed-deliveries.js.map

package/dist/matter/order-placed/order-placed-deliveries.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"order-placed-deliveries.js","names":[],"sources":["../../../src/matter/order-placed/order-placed-deliveries.tsx"],"sourcesContent":["'use client';\n\nimport { defineComponent } from '@vtex/fs-core';\nimport { createContext, type ReactNode, useContext } from 'react';\nimport { type AddressSummaryFields, AddressSummaryRoot } from '../../particles/address-summary/address-summary.js';\nimport { DataOverrideContext, useDataOverride } from '../../sdk/data/data-override-context.js';\nimport { useStorefrontFormatters } from '../../sdk/format/client.js';\nimport { useIntl } from '../../sdk/i18n/client.js';\nimport { substituteTemplate } from '../../utils/substitute-template.js';\nimport { CartItemRoot } from '../cart-item/cart-item.js';\nimport { CartItemCompositions } from '../cart-item-compositions/cart-item-compositions.js';\nimport { ESTIMATE_MESSAGE, type ShippingEstimateUnit } from '../shipping-simulator/shipping-simulator.js';\nimport { type OrderPlacedMoney, useOrderPlaced } from './order-placed.js';\n\n/**\n * Order Placed format A (docs/features/order-placed/rfc-particles.md, Parts, part 3): the purchase's\n * items grouped by delivery across sellers. `OrderPlacedDeliveryList` reads `Order.deliveries` through\n * its own fragment and renders its child once per delivery; `OrderPlacedDeliveryGroup` states the\n * method, the promise and the item count and hands the address to the `AddressSummary*` leaves;\n * `OrderPlacedItemRow` presents each item through the cart's own `CartItemRoot` and leaves, so the\n * item reads as it did in the cart.\n */\n\n// ---------------------------------------------------------------------------\n// GraphQL Fragment\n// ---------------------------------------------------------------------------\n\n// The item selects what CartItemRootData selects on CartItem, and `compositions` what\n// CartItemCompositionsData selects, with every Money inlined: the row hands the item to the cart's\n// own components, which read exactly those fields. Two tests keep both selections in step.\nconst fragment = /* GraphQL */ `\n  fragment OrderPlacedDeliveryListData on Query {\n    order(orderGroup: $orderGroup) {\n      __typename\n      id\n      deliveries {\n        id\n        shippingOption {\n          id\n          name\n          channel\n          shippingEstimate {\n            value\n            unit\n          }\n        }\n        estimatedDate\n        itemCount\n        pickupPointName\n        address {\n          id\n          recipientName\n          street\n          number\n          complement\n          neighborhood\n          city\n          state\n          postalCode\n          country\n        }\n        items {\n          __typename\n          id\n          quantity\n          price {\n            amount\n            currencyCode\n          }\n          listPrice {\n            amount\n            currencyCode\n          }\n          sellingPrice {\n            amount\n            currencyCode\n          }\n          gift\n          ownTotal {\n            amount\n            currencyCode\n          }\n          total {\n            amount\n            currencyCode\n          }\n          variant {\n            __typename\n            variantId\n            sku\n            name\n            image {\n              url\n              altText\n            }\n            availability\n          }\n          product {\n            __typename\n            productId\n            title\n            detailUrl\n            categories {\n              categoryId\n              name\n            }\n            brand {\n              brandId\n              name\n            }\n          }\n          compositions {\n            id\n            name\n            quantity\n            price {\n              amount\n              currencyCode\n            }\n            availability\n            assemblyId\n            ownTotal {\n              amount\n              currencyCode\n            }\n            total {\n              amount\n              currencyCode\n            }\n            customizations {\n              id\n              entries {\n                name\n                value\n              }\n            }\n            compositions {\n              id\n              name\n              quantity\n              price {\n                amount\n                currencyCode\n              }\n              availability\n              assemblyId\n              ownTotal {\n                amount\n                currencyCode\n              }\n              total {\n                amount\n                currencyCode\n              }\n              customizations {\n                id\n                entries {\n                  name\n                  value\n                }\n              }\n              compositions {\n                id\n                name\n                quantity\n                price {\n                  amount\n                  currencyCode\n                }\n                availability\n                assemblyId\n                ownTotal {\n                  amount\n                  currencyCode\n                }\n                total {\n                  amount\n                  currencyCode\n                }\n                customizations {\n                  id\n                  entries {\n                    name\n                    value\n                  }\n                }\n              }\n            }\n          }\n        }\n      }\n    }\n  }\n`;\n\n// ---------------------------------------------------------------------------\n// Types\n// ---------------------------------------------------------------------------\n\nexport type OrderPlacedShippingEstimateUnit = ShippingEstimateUnit;\n\nexport type OrderPlacedItemComposition = {\n  id: string;\n  name: string;\n  quantity: number;\n  price: OrderPlacedMoney;\n  availability: string;\n  assemblyId: string;\n  ownTotal: OrderPlacedMoney;\n  total: OrderPlacedMoney;\n  customizations: readonly { id: string; entries: readonly { name: string; value: string }[] }[];\n  compositions?: readonly OrderPlacedItemComposition[];\n};\n\n/**\n * An `OrderItem` with `CartItemRootData`'s selection plus `compositions`. Amounts are the wire's\n * strings; it is published to `DataOverrideContext`, typed `unknown`, with no cast and no mapping.\n */\nexport type OrderPlacedItem = {\n  __typename?: string;\n  id: string;\n  quantity: number;\n  price: OrderPlacedMoney;\n  listPrice: OrderPlacedMoney;\n  sellingPrice: OrderPlacedMoney;\n  gift: boolean;\n  ownTotal: OrderPlacedMoney;\n  total: OrderPlacedMoney;\n  variant: {\n    __typename?: string;\n    variantId: string;\n    sku: string;\n    name: string;\n    image?: { url: string; altText?: string | null } | null;\n    availability: string;\n  };\n  product: {\n    __typename?: string;\n    productId: string;\n    title: string;\n    detailUrl: string;\n    categories: readonly { categoryId: string; name: string }[];\n    brand?: { brandId: string; name: string } | null;\n  };\n  compositions: readonly OrderPlacedItemComposition[];\n};\n\nexport type OrderPlacedDelivery = {\n  id: string;\n  shippingOption?: {\n    id: string;\n    name: string;\n    channel: 'DELIVERY' | 'PICKUP' | 'UNKNOWN';\n    shippingEstimate: { value: number; unit: OrderPlacedShippingEstimateUnit };\n  } | null;\n  estimatedDate?: string | null;\n  itemCount: number;\n  pickupPointName?: string | null;\n  address?: (AddressSummaryFields & { id?: string | null }) | null;\n  items: readonly OrderPlacedItem[];\n};\n\n/** `OrderPlacedDeliveryList`'s `$data`: the unwrapped `order` field of its fragment (ADR-0015). */\nexport type OrderPlacedDeliveryListData = { deliveries: readonly OrderPlacedDelivery[] } | null;\n\nexport type OrderPlacedDeliveryListProps = {\n  className?: string;\n  children?: ReactNode;\n  $data?: OrderPlacedDeliveryListData;\n};\n\nexport type OrderPlacedDeliveryGroupProps = {\n  className?: string;\n  children?: ReactNode;\n  /** The dated promise; `{date}` placeholder. */\n  dateTemplate?: string;\n  /** `{count}` placeholder, for any count but one. */\n  itemCountTemplate?: string;\n  /** `{count}` placeholder, for a count of one. */\n  itemCountOneTemplate?: string;\n  /** `{name}` placeholder, shown when the delivery is picked up. */\n  pickupPointTemplate?: string;\n};\n\nexport type OrderPlacedItemRowProps = {\n  className?: string;\n  children?: ReactNode;\n};\n\nexport type OrderPlacedItemCompositionsProps = {\n  className?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Contexts\n// ---------------------------------------------------------------------------\n\nconst OrderDeliveryContext = createContext<OrderPlacedDelivery | null>(null);\nconst OrderPlacedItemContext = createContext<OrderPlacedItem | null>(null);\n\n/** The delivery the nearest OrderPlacedDeliveryList renders this subtree for. */\nexport function useOrderDelivery(): OrderPlacedDelivery {\n  const delivery = useContext(OrderDeliveryContext);\n  if (!delivery) throw new Error('useOrderDelivery() must be used inside an <OrderPlacedDeliveryList> subtree.');\n  return delivery;\n}\n\n/** The item the nearest OrderPlacedItemRow renders this subtree for. */\nexport function useOrderPlacedItem(): OrderPlacedItem {\n  const item = useContext(OrderPlacedItemContext);\n  if (!item) throw new Error('useOrderPlacedItem() must be used inside an <OrderPlacedItemRow> subtree.');\n  return item;\n}\n\n// ---------------------------------------------------------------------------\n// Definitions\n// ---------------------------------------------------------------------------\n\nexport const OrderPlacedDeliveryListDefinition = defineComponent<OrderPlacedDeliveryListProps>({\n  name: 'OrderPlacedDeliveryList',\n  importPath: '@vtex/faststore/components',\n  component: OrderPlacedDeliveryList,\n  fragment,\n  fetchStrategy: 'reactive',\n  requiresContext: 'order-placed',\n  providesContext: 'order-delivery',\n  editor: { label: 'Order Placed Delivery List', category: 'commerce' },\n  schema: {},\n  guideline:\n    'The placed order grouped by delivery: one entry per way the items arrive (shipping method, channel and estimate), across sellers. Compose exactly one OrderPlacedDeliveryGroup as its child; the list renders it once per delivery, in the order the API returns them, and renders nothing when the order has no delivery. Must be inside OrderPlacedRoot. See order-placed.md.',\n});\n\nexport const OrderPlacedDeliveryGroupDefinition = defineComponent<OrderPlacedDeliveryGroupProps>({\n  name: 'OrderPlacedDeliveryGroup',\n  importPath: '@vtex/faststore/components',\n  component: OrderPlacedDeliveryGroup,\n  requiresContext: 'order-delivery',\n  providesContext: 'address-summary',\n  editor: { label: 'Order Placed Delivery Group', category: 'commerce' },\n  schema: {\n    dateTemplate: { type: 'string', default: 'Arrives by {date}', label: 'Date template' },\n    itemCountTemplate: { type: 'string', default: '{count} items', label: 'Item count template' },\n    itemCountOneTemplate: { type: 'string', default: '{count} item', label: 'Single item count template' },\n    pickupPointTemplate: { type: 'string', default: 'Pickup at {name}', label: 'Pickup point template' },\n  },\n  guideline:\n    \"One delivery of the placed order: its shipping method, its promise (the date under dateTemplate once the order system set one, otherwise the relative estimate sentence the checkout's delivery step showed, e.g. \\\"in 2 business days\\\"), its item count and, for a pickup, the pickup point's name. Compose AddressSummaryRecipient, AddressSummaryStreet and AddressSummaryLocality as children for the address (the shipping address, or the pickup point's for a pickup, masked as the order system returns it; nothing when the order carries none), and one OrderPlacedItemRow for the items. Style it through data-fs-order-placed-delivery-group and switch on data-fs-order-placed-delivery-group-channel (delivery, pickup, unknown). Must be the child of OrderPlacedDeliveryList. See order-placed.md.\",\n});\n\n// The row requires the root, not a delivery: formats B and D (particles RFC, Formats B, C and D) place\n// it under a seller order instead, and it reads whichever list is nearest at run time. In format A it\n// sits under OrderPlacedDeliveryGroup; placed straight under the root it renders nothing.\nexport const OrderPlacedItemRowDefinition = defineComponent<OrderPlacedItemRowProps>({\n  name: 'OrderPlacedItemRow',\n  importPath: '@vtex/faststore/components',\n  component: OrderPlacedItemRow,\n  requiresContext: 'order-placed',\n  providesContext: ['cart-item-data', 'order-placed-item'],\n  editor: { label: 'Order Placed Item Row', category: 'commerce' },\n  schema: {},\n  guideline:\n    \"One purchased item of the delivery, presented with the cart's own item leaves, so it reads as it did in the cart. Compose read-only cart leaves as children: CartItemImage, CartItemProductLink, CartItemName, CartItemVariant, CartItemSku, CartItemPrice, CartItemListPrice, CartItemDiscountPercentage, CartItemLineTotal, CartItemOwnTotal, CartItemAggregateTotal, CartItemQuantityValue, CartItemGift, and OrderPlacedItemCompositions for its add-ons. Never compose CartItemQuantity, CartItemRemove, CartItemVariations, CartItemAvailable or CartItemUnavailable here: they read or change the live cart, not the placed order. Renders once per item of the nearest delivery; nothing outside a delivery. Must be inside OrderPlacedDeliveryGroup. See order-placed.md.\",\n});\n\nexport const OrderPlacedItemCompositionsDefinition = defineComponent<OrderPlacedItemCompositionsProps>({\n  name: 'OrderPlacedItemCompositions',\n  importPath: '@vtex/faststore/components',\n  component: OrderPlacedItemCompositions,\n  requiresContext: 'order-placed-item',\n  editor: { label: 'Order Placed Item Compositions', category: 'commerce' },\n  schema: {},\n  guideline:\n    \"The add-on services of a placed item, nested under it with the cart's own composition markup (data-fs-cart-item-composition*): each one's name, quantity, unit price and customizations, children nested by depth. Renders nothing when the item has none, as every item of a purchase split across sellers. Never compose CartItemCompositions on this page instead: it reads the live cart. Must be inside OrderPlacedItemRow. See order-placed.md.\",\n});\n\n// ---------------------------------------------------------------------------\n// Implementations\n// ---------------------------------------------------------------------------\n\n/** Renders its child once per delivery of the placed order. */\nexport function OrderPlacedDeliveryList({\n  className,\n  children,\n  $data: $dataProp,\n}: Readonly<OrderPlacedDeliveryListProps>) {\n  // The call only enforces that the root is an ancestor; the root withholds its children until the\n  // order resolves. The deliveries come from this component's own fragment.\n  useOrderPlaced();\n  const deliveries = useDataOverride($dataProp)?.deliveries ?? [];\n  if (deliveries.length === 0) return null;\n\n  return (\n    <div className={className} data-fs-order-placed-delivery-list=\"\">\n      {deliveries.map((delivery) => (\n        <OrderDeliveryContext key={delivery.id} value={delivery}>\n          {children}\n        </OrderDeliveryContext>\n      ))}\n    </div>\n  );\n}\n\nconst CHANNEL_ATTRIBUTE = {\n  DELIVERY: 'delivery',\n  PICKUP: 'pickup',\n  UNKNOWN: 'unknown',\n} as const;\n\n/**\n * The relative promise, as the checkout's delivery step words it: the catalog's whole sentence for the\n * unit (`ESTIMATE_MESSAGE`), and \"arrives today\" at zero, never a translated fragment in a wrapper.\n */\nfunction useRelativePromise(estimate: { value: number; unit: OrderPlacedShippingEstimateUnit } | undefined) {\n  const intl = useIntl();\n  if (!estimate) return null;\n  if (estimate.value === 0) return intl.formatMessage({ id: 'fs/shipping.estimate.today' });\n  const { id, variable } = ESTIMATE_MESSAGE[estimate.unit];\n  return intl.formatMessage({ id }, { [variable]: estimate.value });\n}\n\n/**\n * One delivery: method, promise, item count and pickup point, with its address provided to the\n * `AddressSummary*` children. The dated promise wins when the order carries one; otherwise the relative\n * estimate. A delivery with neither a method nor a date still shows its items and count.\n */\nexport function OrderPlacedDeliveryGroup({\n  className,\n  children,\n  dateTemplate = 'Arrives by {date}',\n  itemCountTemplate = '{count} items',\n  itemCountOneTemplate = '{count} item',\n  pickupPointTemplate = 'Pickup at {name}',\n}: Readonly<OrderPlacedDeliveryGroupProps>) {\n  const delivery = useOrderDelivery();\n  const { formatDate, pluralRule } = useStorefrontFormatters();\n  const { shippingOption, estimatedDate, itemCount, pickupPointName, address } = delivery;\n  const relativePromise = useRelativePromise(shippingOption?.shippingEstimate);\n\n  // The API sends an instant; the store's day of it, in the store's timezone, is the promised one.\n  const promise = estimatedDate\n    ? substituteTemplate(dateTemplate, { date: formatDate(new Date(estimatedDate), { dateStyle: 'medium' }) })\n    : relativePromise;\n  const count = substituteTemplate(pluralRule(itemCount) === 'one' ? itemCountOneTemplate : itemCountTemplate, {\n    count: String(itemCount),\n  });\n\n  return (\n    <div\n      className={className}\n      data-fs-order-placed-delivery-group=\"\"\n      data-fs-order-placed-delivery-group-channel={CHANNEL_ATTRIBUTE[shippingOption?.channel ?? 'UNKNOWN']}\n    >\n      {shippingOption ? <p data-fs-order-placed-delivery-group-method=\"\">{shippingOption.name}</p> : null}\n      {promise ? <p data-fs-order-placed-delivery-group-date=\"\">{promise}</p> : null}\n      <p data-fs-order-placed-delivery-group-count=\"\">{count}</p>\n      {pickupPointName ? (\n        <p data-fs-order-placed-delivery-group-pickup-point=\"\">\n          {substituteTemplate(pickupPointTemplate, { name: pickupPointName })}\n        </p>\n      ) : null}\n      <AddressSummaryRoot address={address ?? {}}>{children}</AddressSummaryRoot>\n    </div>\n  );\n}\n\n/**\n * Each item of the nearest delivery, through the cart's own `CartItemRoot`: the row publishes the\n * order item on `DataOverrideContext`, the seam `CartItemRoot` reads before its `$data`, so the cart's\n * leaves present it unchanged (ADR-0009's substitution; `cart-item.tsx` is not edited). Outside a\n * delivery, as straight under the root, the purchase has no items of its own to show.\n */\nexport function OrderPlacedItemRow({ className, children }: OrderPlacedItemRowProps) {\n  useOrderPlaced();\n  const delivery = useContext(OrderDeliveryContext);\n  if (!delivery) return null;\n\n  return delivery.items.map((item) => (\n    <OrderPlacedItemContext key={item.id} value={item}>\n      <DataOverrideContext value={item}>\n        <CartItemRoot className={className} data-fs-order-placed-item-row=\"\">\n          {children}\n        </CartItemRoot>\n      </DataOverrideContext>\n    </OrderPlacedItemContext>\n  ));\n}\n\n/**\n * The item's add-ons, through the cart's own `CartItemCompositions`, which reads the item from the\n * row's `DataOverrideContext`. Rendered as a function, never composed in the page, so its `Query.cart`\n * fragment is never collected and the page reads only the order.\n */\nexport function OrderPlacedItemCompositions({ className }: Readonly<OrderPlacedItemCompositionsProps>) {\n  useOrderPlacedItem();\n  return <CartItemCompositions className={className} />;\n}\n"],"mappings":"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"}

package/dist/matter/order-placed/order-placed.d.ts

@@ -0,0 +1,122 @@
+import { ComponentDefinition } from "../../core/dist/define-component.js";
+import "../../core/dist/index.js";
+import { ReactNode } from "react";
+import { ErrorLike } from "@apollo/client";
+//#region src/matter/order-placed/order-placed.d.ts
+/** `amount` is the API's `Decimal`, a string ("12.50"). */
+export type OrderPlacedMoney = {
+  amount: string;
+  currencyCode: string;
+};
+export type OrderPlacedStatusValue = 'APPROVED' | 'PENDING' | 'DENIED' | 'UNKNOWN';
+export type OrderPlacedTotalLine = {
+  id: string;
+  name: string;
+  value: OrderPlacedMoney;
+};
+/**
+ * The `$data` slice forwarded by the reactive runtime: the unwrapped `order` field, never a
+ * `{ order: … }` wrapper (ADR-0015). `null` when the order group does not resolve.
+ */
+export type OrderPlacedData = {
+  id: string;
+  reference: string;
+  status: OrderPlacedStatusValue;
+  total?: OrderPlacedMoney | null;
+  totals: readonly OrderPlacedTotalLine[];
+} | null;
+/** `OrderPlacedCustomer`'s own `$data` slice, the unwrapped `order` field of its fragment. */
+export type OrderPlacedCustomerData = {
+  customer?: {
+    firstName?: string | null;
+    lastName?: string | null;
+    email?: string | null;
+    phone?: string | null;
+    document?: string | null;
+  } | null;
+} | null;
+export type OrderPlacedContextValue = Readonly<{
+  order: OrderPlacedData;
+  loading: boolean;
+  error: ErrorLike | null;
+}>;
+export type OrderPlacedRootProps = {
+  className?: string;
+  children?: ReactNode;
+  /** Shown in place of the order when the read is refused: after 15 minutes, or from another browser. */
+  refusedOrderLabel?: string;
+  /** Shown in place of the order when the read fails or the order group resolves to no order. */
+  unresolvedOrderLabel?: string;
+  /** Unwrapped `Order` slice forwarded by the reactive runtime. */
+  $data?: OrderPlacedData;
+};
+export type OrderPlacedStatusProps = {
+  className?: string;
+  /** An optional `Icon`, shown on every outcome. */
+  children?: ReactNode;
+  approvedTitle?: string;
+  approvedMessage?: string;
+  pendingTitle?: string;
+  pendingMessage?: string;
+  deniedTitle?: string;
+  deniedMessage?: string;
+};
+export type OrderPlacedReferenceProps = {
+  className?: string;
+  /** `{reference}` placeholder. */
+  template?: string;
+};
+export type OrderPlacedCustomerProps = {
+  className?: string;
+  nameLabel?: string;
+  emailLabel?: string;
+  phoneLabel?: string;
+  documentLabel?: string;
+  /** Unwrapped `Order` slice of this component's own fragment. */
+  $data?: OrderPlacedCustomerData;
+};
+export type OrderPlacedTotalsProps = {
+  className?: string;
+  itemsLabel?: string;
+  shippingLabel?: string;
+  discountsLabel?: string;
+  taxLabel?: string;
+  totalLabel?: string;
+  /** Shown instead of a zero shipping value. Omitted to show the formatted zero. */
+  shippingZeroLabel?: string;
+};
+/** The placed order, its loading flag and the root query's error, from the nearest OrderPlacedRoot. */
+export declare function useOrderPlaced(): OrderPlacedContextValue;
+export declare const OrderPlacedRootDefinition: ComponentDefinition<OrderPlacedRootProps>;
+export declare const OrderPlacedStatusDefinition: ComponentDefinition<OrderPlacedStatusProps>;
+export declare const OrderPlacedReferenceDefinition: ComponentDefinition<OrderPlacedReferenceProps>;
+export declare const OrderPlacedCustomerDefinition: ComponentDefinition<OrderPlacedCustomerProps>;
+export declare const OrderPlacedTotalsDefinition: ComponentDefinition<OrderPlacedTotalsProps>;
+/** Placeholder for the order's blocks while the read is in flight. */
+export declare function OrderPlacedRootSkeleton(): import("react/jsx-runtime").JSX.Element;
+/** Provides the placed order to its descendants, or a message in their place. Mirrors CartRoot's read side. */
+export declare function OrderPlacedRoot({ className, children, refusedOrderLabel, unresolvedOrderLabel, $data: $dataProp }: Readonly<OrderPlacedRootProps>): import("react/jsx-runtime").JSX.Element;
+/**
+ * The outcome banner. `UNKNOWN` (seller orders that disagree, or a state the mapping does not
+ * classify) renders nothing, so the page shows the order without asserting success or failure.
+ */
+export declare function OrderPlacedStatus({ className, children, approvedTitle, approvedMessage, pendingTitle, pendingMessage, deniedTitle, deniedMessage }: Readonly<OrderPlacedStatusProps>): import("react/jsx-runtime").JSX.Element | null;
+/**
+ * The order group, the one reference a split purchase has, so support resolves the whole purchase
+ * from it rather than one seller's order.
+ */
+export declare function OrderPlacedReference({ className, template }: Readonly<OrderPlacedReferenceProps>): import("react/jsx-runtime").JSX.Element | null;
+/**
+ * The customer as the order recorded them, never the live profile: masked values show as the order
+ * system returns them, and an empty field is left out.
+ */
+export declare function OrderPlacedCustomer({ className, nameLabel, emailLabel, phoneLabel, documentLabel, $data: $dataProp }: Readonly<OrderPlacedCustomerProps>): import("react/jsx-runtime").JSX.Element | null;
+/**
+ * The order's money lines in API order, then the total, each in its own currency. `Items`,
+ * `Shipping`, `Discounts` and `Tax` take the authored label, since the order system names them in
+ * English; any other line (a custom tax) shows its own name. The API sums lines on id and name, so
+ * two custom taxes that share an id are two rows.
+ */
+export declare function OrderPlacedTotals({ className, itemsLabel, shippingLabel, discountsLabel, taxLabel, totalLabel, shippingZeroLabel }: Readonly<OrderPlacedTotalsProps>): import("react/jsx-runtime").JSX.Element | null;
+//#endregion
+//# sourceMappingURL=order-placed.d.ts.map