@vtex/faststore 0.0.10 → 0.0.11

package/dist/matter/order-cancel/order-cancel.js

@@ -2,9 +2,10 @@
 import { defineComponent } from "../../core/dist/define-component.js";
 import { defineContentType } from "../../core/dist/define-content-type.js";
 import "../../core/dist/index.js";
-import { useIntl } from "../../sdk/i18n/client.js";
+import { useMessageFormatter } from "../../sdk/i18n/use-message-formatter.js";
 import { useStorefrontNavigation } from "../../sdk/navigation/use-storefront-navigation.js";
 import { useActionsOverride } from "../../sdk/actions/actions-override-context.js";
+import { formatErrorCode } from "../../sdk/i18n/format-error-code.js";
 import { Button } from "../../particles/button/button.js";
 import { AlertDialogBackdrop, AlertDialogClose, AlertDialogDescription, AlertDialogPopup, AlertDialogPortal, AlertDialogRoot, AlertDialogTitle, AlertDialogTrigger, AlertDialogViewport } from "../../particles/alert-dialog/alert-dialog.js";
 import { Radio } from "../../particles/radio/radio.js";
@@ -36,12 +37,6 @@ const HIDDEN_STATUSES = /* @__PURE__ */ new Set([
 const OTHER = "other";
 /** Matches `CUSTOMER_ORDER_CANCEL_REASON_MAX_LENGTH` in the orders module. */
 const REASON_MAX_LENGTH = 500;
-const REASON_IDS = [
-	"fs/order-cancel.reason.changed-mind",
-	"fs/order-cancel.reason.bought-by-mistake",
-	"fs/order-cancel.reason.better-price",
-	"fs/order-cancel.reason.slow-delivery"
-];
 const OrderCancelContent = defineContentType({
 	id: "order-cancel",
 	title: "Order Cancel",
@@ -52,53 +47,105 @@ const OrderCancelContent = defineContentType({
 		properties: {
 			trigger: {
 				type: "string",
-				default: "Cancel order",
-				title: "Trigger"
+				title: "Trigger",
+				format: "icu-message",
+				messageSource: "Cancel order"
 			},
 			title: {
 				type: "string",
-				default: "Cancel this order?",
-				title: "Title"
+				title: "Title",
+				format: "icu-message",
+				messageSource: "Cancel this order?"
 			},
 			description: {
 				type: "string",
-				default: "This cannot be undone.",
-				title: "Description"
+				title: "Description",
+				format: "icu-message",
+				messageSource: "This cannot be undone."
 			},
 			confirm: {
 				type: "string",
-				default: "Cancel order",
-				title: "Confirm"
+				title: "Confirm",
+				format: "icu-message",
+				messageSource: "Cancel order"
 			},
 			dismiss: {
 				type: "string",
-				default: "Keep order",
-				title: "Dismiss"
+				title: "Dismiss",
+				format: "icu-message",
+				messageSource: "Keep order"
 			},
 			other: {
 				type: "string",
-				default: "Other",
-				title: "Other"
+				title: "Other",
+				format: "icu-message",
+				messageSource: "Other"
 			},
 			otherField: {
 				type: "string",
-				default: "Reason",
-				title: "Other field"
+				title: "Other field",
+				format: "icu-message",
+				messageSource: "Reason"
 			},
 			success: {
 				type: "string",
-				default: "Your order was cancelled.",
-				title: "Success"
+				title: "Success",
+				format: "icu-message",
+				messageSource: "Your order was cancelled."
 			},
 			failure: {
 				type: "string",
-				default: "Unable to cancel the order. Please try again.",
-				title: "Failure"
+				title: "Failure",
+				format: "icu-message",
+				messageSource: "Unable to cancel the order. Please try again."
+			},
+			notCancellableMessage: {
+				type: "string",
+				title: "Not cancellable message",
+				description: "Shown when the order is past the point where it can be cancelled.",
+				format: "icu-message",
+				messageSource: "This order can no longer be cancelled."
+			},
+			notFoundMessage: {
+				type: "string",
+				title: "Order not found message",
+				description: "Shown when the order is not one the signed-in shopper can see.",
+				format: "icu-message",
+				messageSource: "We could not find this order."
 			},
 			dismissMessage: {
 				type: "string",
-				default: "Dismiss",
-				title: "Dismiss message"
+				title: "Dismiss message",
+				format: "icu-message",
+				messageSource: "Dismiss"
+			},
+			reasonChangedMind: {
+				type: "string",
+				title: "Reason: changed mind",
+				description: "Default reason option.",
+				format: "icu-message",
+				messageSource: "Changed my mind"
+			},
+			reasonBoughtByMistake: {
+				type: "string",
+				title: "Reason: bought by mistake",
+				description: "Default reason option.",
+				format: "icu-message",
+				messageSource: "Bought by mistake"
+			},
+			reasonBetterPrice: {
+				type: "string",
+				title: "Reason: better price",
+				description: "Default reason option.",
+				format: "icu-message",
+				messageSource: "Found a better price"
+			},
+			reasonSlowDelivery: {
+				type: "string",
+				title: "Reason: slow delivery",
+				description: "Default reason option.",
+				format: "icu-message",
+				messageSource: "Delivery is too slow"
 			},
 			reasons: {
 				type: "array",
@@ -117,6 +164,13 @@ const OrderCancelContent = defineContentType({
 		}
 	}
 });
+/** The default reasons, in display order, offered when the content authors no `reasons`. */
+const DEFAULT_REASONS = [
+	"reasonChangedMind",
+	"reasonBoughtByMistake",
+	"reasonBetterPrice",
+	"reasonSlowDelivery"
+];
 const OrderCancelDefinition = defineComponent({
 	name: "OrderCancel",
 	importPath: "@vtex/faststore/components",
@@ -130,7 +184,7 @@ const OrderCancelDefinition = defineComponent({
 		category: "action"
 	},
 	schema: {},
-	guideline: "Cancels one eligible order after the shopper confirms in an alert dialog. Place it on the order page. It hides when the order cannot be cancelled or a cancellation is already requested. Reasons and the dialog copy are content; a blank field uses the message catalog. Other is always offered. See order-cancel.md."
+	guideline: "Cancels one eligible order after the shopper confirms in an alert dialog. Place it on the order page. It hides when the order cannot be cancelled or a cancellation is already requested. Reasons and the dialog copy are content. Other is always offered. See order-cancel.md."
 });
 function OrderCancelSkeleton({ className }) {
 	return /* @__PURE__ */ jsx("div", {
@@ -139,28 +193,37 @@ function OrderCancelSkeleton({ className }) {
 		"aria-hidden": "true"
 	});
 }
-function text(value, fallback) {
-	return value?.trim() || fallback;
-}
-function copyOf(content, intl) {
-	const authored = content?.reasons?.flatMap((item) => {
+function reasonsOf(content, format) {
+	if (content?.reasons == null) return DEFAULT_REASONS.map((field) => format(field));
+	return content.reasons.flatMap((item) => {
 		const label = item.label.trim();
 		return label ? [label] : [];
 	});
+}
+function copyOf(content, { format }) {
 	return {
-		trigger: text(content?.trigger, intl.formatMessage({ id: "fs/order-cancel.trigger" })),
-		title: text(content?.title, intl.formatMessage({ id: "fs/order-cancel.title" })),
-		description: text(content?.description, intl.formatMessage({ id: "fs/order-cancel.description" })),
-		confirm: text(content?.confirm, intl.formatMessage({ id: "fs/order-cancel.confirm" })),
-		dismiss: text(content?.dismiss, intl.formatMessage({ id: "fs/order-cancel.dismiss" })),
-		other: text(content?.other, intl.formatMessage({ id: "fs/order-cancel.other" })),
-		otherField: text(content?.otherField, intl.formatMessage({ id: "fs/order-cancel.other-field" })),
-		success: text(content?.success, intl.formatMessage({ id: "fs/order-cancel.success" })),
-		failure: text(content?.failure, intl.formatMessage({ id: "fs/order-cancel.failure" })),
-		dismissMessage: text(content?.dismissMessage, intl.formatMessage({ id: "fs/order-cancel.dismiss-message" })),
-		reasons: content?.reasons == null ? REASON_IDS.map((id) => intl.formatMessage({ id })) : authored ?? []
+		trigger: format("trigger"),
+		title: format("title"),
+		description: format("description"),
+		confirm: format("confirm"),
+		dismiss: format("dismiss"),
+		other: format("other"),
+		otherField: format("otherField"),
+		success: format("success"),
+		failure: format("failure"),
+		dismissMessage: format("dismissMessage"),
+		reasons: reasonsOf(content, format)
 	};
 }
+/**
+* The message for each cancellation refusal: the server's `CustomerOrderCancelErrorCode` values plus
+* the client-minted transport failure. A code this map does not know shows `failure`.
+*/
+const ORDER_CANCEL_ERROR_FIELDS = {
+	ORDER_NOT_CANCELLABLE: "notCancellableMessage",
+	NOT_FOUND: "notFoundMessage",
+	NETWORK_ERROR: "failure"
+};
 function chosenReason(selected, reasons, otherText) {
 	if (selected == null) return void 0;
 	if (selected === OTHER) return otherText.trim() || void 0;
@@ -168,16 +231,16 @@ function chosenReason(selected, reasons, otherText) {
 }
 function OrderCancel({ $data, $actions: $actionsProp, $content, className, ref }) {
 	const $actions = useActionsOverride($actionsProp);
-	const intl = useIntl();
+	const messages = useMessageFormatter(OrderCancelContent, $content);
 	const { refresh } = useStorefrontNavigation();
-	const copy = copyOf($content, intl);
+	const copy = copyOf($content, messages);
 	const [open, setOpen] = useState(false);
 	const [selected, setSelected] = useState(null);
 	const [otherText, setOtherText] = useState("");
 	const [pending, setPending] = useState(false);
 	const [succeeded, setSucceeded] = useState(false);
 	const [outcome, setOutcome] = useState("idle");
-	const [failureMessage, setFailureMessage] = useState(copy.failure);
+	const [failure, setFailure] = useState(null);
 	const pendingRef = useRef(false);
 	const requestRef = useRef(0);
 	const messageRef = useRef(null);
@@ -200,7 +263,7 @@ function OrderCancel({ $data, $actions: $actionsProp, $content, className, ref }
 		if (pendingRef.current || !$data) return;
 		const cancel = $actions?.order?.cancel;
 		if (!cancel) {
-			setFailureMessage(copy.failure);
+			setFailure(null);
 			setOutcome("failure");
 			return;
 		}
@@ -222,13 +285,17 @@ function OrderCancel({ $data, $actions: $actionsProp, $content, className, ref }
 				refresh();
 				return;
 			}
-			setFailureMessage(result.userErrors[0]?.message ?? copy.failure);
+			setFailure(result.userErrors[0] ?? null);
 			setOutcome("failure");
 		} finally {
 			pendingRef.current = false;
 			setPending(false);
 		}
 	}
+	function failureMessage() {
+		if (!failure) return copy.failure;
+		return formatErrorCode(OrderCancelContent, ORDER_CANCEL_ERROR_FIELDS, failure, messages.format, "failure");
+	}
 	function dismissMessage() {
 		setOutcome("idle");
 	}
@@ -303,7 +370,7 @@ function OrderCancel({ $data, $actions: $actionsProp, $content, className, ref }
 					}) : null,
 					outcome === "failure" ? /* @__PURE__ */ jsx(Acknowledgement, {
 						ref: messageRef,
-						message: failureMessage,
+						message: failureMessage(),
 						dismissLabel: copy.dismissMessage,
 						onDismiss: dismissMessage
 					}) : null,
@@ -339,6 +406,6 @@ function Acknowledgement({ ref, message, dismissLabel, onDismiss }) {
 	});
 }
 //#endregion
-export { OrderCancel, OrderCancelContent, OrderCancelDefinition, OrderCancelSkeleton };
+export { ORDER_CANCEL_ERROR_FIELDS, OrderCancel, OrderCancelContent, OrderCancelDefinition, OrderCancelSkeleton };
 
 //# sourceMappingURL=order-cancel.js.map

package/dist/matter/order-cancel/order-cancel.js.map

@@ -1 +1 @@
-{"version":3,"file":"order-cancel.js","names":[],"sources":["../../../src/matter/order-cancel/order-cancel.tsx"],"sourcesContent":["'use client';\n\nimport { type ContentValue, defineComponent, defineContentType } from '@vtex/fs-core';\nimport type { Ref } from 'react';\nimport { useEffect, useRef, useState } from 'react';\nimport {\n  AlertDialogBackdrop,\n  AlertDialogClose,\n  AlertDialogDescription,\n  AlertDialogPopup,\n  AlertDialogPortal,\n  AlertDialogRoot,\n  AlertDialogTitle,\n  AlertDialogTrigger,\n  AlertDialogViewport,\n} from '../../particles/alert-dialog/alert-dialog.js';\nimport { Button } from '../../particles/button/button.js';\nimport { Input } from '../../particles/input/input.js';\nimport { Radio } from '../../particles/radio/radio.js';\nimport { useActionsOverride } from '../../sdk/actions/actions-override-context.js';\nimport type { ComponentActions } from '../../sdk/actions/types.js';\nimport { useIntl } from '../../sdk/i18n/client.js';\nimport type { MessageId } from '../../sdk/i18n/locales.js';\nimport { useStorefrontNavigation } from '../../sdk/navigation/use-storefront-navigation.js';\n\nconst fragment = /* GraphQL */ `\n  fragment OrderCancelData on Query {\n    customerOrder(id: $orderId) {\n      id\n      status\n      allowCancellation\n    }\n  }\n`;\n\n/**\n * OMS statuses that already mean a cancellation was requested or finished.\n * `allowCancellation` can stay true in the intermediate ones, so the flag alone\n * would show the button again.\n */\nconst HIDDEN_STATUSES = new Set([\n  'request-cancel',\n  'cancellation-requested',\n  'cancellation-requested-with-ack',\n  'cancel',\n  'canceled',\n]);\n\nconst OTHER = 'other';\n\n/** Matches `CUSTOMER_ORDER_CANCEL_REASON_MAX_LENGTH` in the orders module. */\nconst REASON_MAX_LENGTH = 500;\n\nconst REASON_IDS = [\n  'fs/order-cancel.reason.changed-mind',\n  'fs/order-cancel.reason.bought-by-mistake',\n  'fs/order-cancel.reason.better-price',\n  'fs/order-cancel.reason.slow-delivery',\n] as const satisfies readonly MessageId[];\n\nexport const OrderCancelContent = defineContentType({\n  id: 'order-cancel',\n  title: 'Order Cancel',\n  description: 'Confirmation copy and the optional cancellation reasons for one order.',\n  schema: {\n    type: 'object',\n    additionalProperties: false,\n    // Literals, not `COPY.*`: the catalog scanner only evaluates values it can see in the call.\n    properties: {\n      trigger: { type: 'string', default: 'Cancel order', title: 'Trigger' },\n      title: { type: 'string', default: 'Cancel this order?', title: 'Title' },\n      description: { type: 'string', default: 'This cannot be undone.', title: 'Description' },\n      confirm: { type: 'string', default: 'Cancel order', title: 'Confirm' },\n      dismiss: { type: 'string', default: 'Keep order', title: 'Dismiss' },\n      other: { type: 'string', default: 'Other', title: 'Other' },\n      otherField: { type: 'string', default: 'Reason', title: 'Other field' },\n      success: { type: 'string', default: 'Your order was cancelled.', title: 'Success' },\n      failure: { type: 'string', default: 'Unable to cancel the order. Please try again.', title: 'Failure' },\n      dismissMessage: { type: 'string', default: 'Dismiss', title: 'Dismiss message' },\n      reasons: {\n        type: 'array',\n        title: 'Reasons',\n        items: {\n          type: 'object',\n          additionalProperties: false,\n          required: ['label'],\n          properties: {\n            label: { type: 'string', minLength: 1, title: 'Label' },\n          },\n        },\n      },\n    },\n  },\n});\n\nexport type OrderCancelContentValue = ContentValue<typeof OrderCancelContent>;\n\n/** Unwrapped `customerOrder`. A single-root fragment binds `$data` to that field. */\nexport type OrderCancelData = {\n  id: string;\n  status: string;\n  allowCancellation: boolean;\n};\n\nexport type OrderCancelProps = Readonly<{\n  $data?: OrderCancelData | null;\n  $actions?: ComponentActions;\n  $content?: OrderCancelContentValue;\n  className?: string;\n  ref?: Ref<HTMLDivElement>;\n}>;\n\ntype OrderCancelCopy = {\n  trigger: string;\n  title: string;\n  description: string;\n  confirm: string;\n  dismiss: string;\n  other: string;\n  otherField: string;\n  success: string;\n  failure: string;\n  dismissMessage: string;\n  reasons: readonly string[];\n};\n\nexport const OrderCancelDefinition = defineComponent<OrderCancelProps>({\n  name: 'OrderCancel',\n  importPath: '@vtex/faststore/components',\n  component: OrderCancel,\n  fragment,\n  skeleton: OrderCancelSkeleton,\n  actions: { order: ['cancel'] },\n  content: OrderCancelContent,\n  editor: { label: 'Order Cancel', category: 'action' },\n  schema: {},\n  guideline:\n    'Cancels one eligible order after the shopper confirms in an alert dialog. Place it on the order page. It hides when the order cannot be cancelled or a cancellation is already requested. Reasons and the dialog copy are content; a blank field uses the message catalog. Other is always offered. See order-cancel.md.',\n});\n\nexport function OrderCancelSkeleton({ className }: Readonly<{ className?: string }>) {\n  return <div className={className} data-fs-order-cancel-skeleton=\"\" aria-hidden=\"true\" />;\n}\n\nfunction text(value: string | undefined, fallback: string): string {\n  const trimmed = value?.trim();\n  return trimmed || fallback;\n}\n\nfunction copyOf(content: OrderCancelContentValue | undefined, intl: ReturnType<typeof useIntl>): OrderCancelCopy {\n  const authored = content?.reasons?.flatMap((item) => {\n    const label = item.label.trim();\n    return label ? [label] : [];\n  });\n  return {\n    trigger: text(content?.trigger, intl.formatMessage({ id: 'fs/order-cancel.trigger' })),\n    title: text(content?.title, intl.formatMessage({ id: 'fs/order-cancel.title' })),\n    description: text(content?.description, intl.formatMessage({ id: 'fs/order-cancel.description' })),\n    confirm: text(content?.confirm, intl.formatMessage({ id: 'fs/order-cancel.confirm' })),\n    dismiss: text(content?.dismiss, intl.formatMessage({ id: 'fs/order-cancel.dismiss' })),\n    other: text(content?.other, intl.formatMessage({ id: 'fs/order-cancel.other' })),\n    otherField: text(content?.otherField, intl.formatMessage({ id: 'fs/order-cancel.other-field' })),\n    success: text(content?.success, intl.formatMessage({ id: 'fs/order-cancel.success' })),\n    failure: text(content?.failure, intl.formatMessage({ id: 'fs/order-cancel.failure' })),\n    dismissMessage: text(content?.dismissMessage, intl.formatMessage({ id: 'fs/order-cancel.dismiss-message' })),\n    reasons: content?.reasons == null ? REASON_IDS.map((id) => intl.formatMessage({ id })) : (authored ?? []),\n  };\n}\n\nfunction chosenReason(selected: string | null, reasons: readonly string[], otherText: string): string | undefined {\n  if (selected == null) return undefined;\n  if (selected === OTHER) {\n    const trimmed = otherText.trim();\n    return trimmed || undefined;\n  }\n  const label = reasons[Number(selected)]?.trim();\n  return label || undefined;\n}\n\nexport function OrderCancel({ $data, $actions: $actionsProp, $content, className, ref }: OrderCancelProps) {\n  const $actions = useActionsOverride($actionsProp);\n  const intl = useIntl();\n  const { refresh } = useStorefrontNavigation();\n  const copy = copyOf($content, intl);\n  const [open, setOpen] = useState(false);\n  const [selected, setSelected] = useState<string | null>(null);\n  const [otherText, setOtherText] = useState('');\n  const [pending, setPending] = useState(false);\n  const [succeeded, setSucceeded] = useState(false);\n  const [outcome, setOutcome] = useState<'idle' | 'success' | 'failure'>('idle');\n  const [failureMessage, setFailureMessage] = useState(copy.failure);\n  const pendingRef = useRef(false);\n  const requestRef = useRef(0);\n  const messageRef = useRef<HTMLButtonElement>(null);\n  const portalRoot = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    if (outcome === 'success' || outcome === 'failure') {\n      messageRef.current?.focus();\n    }\n  }, [outcome]);\n\n  const ineligible = !$data?.allowCancellation || ($data != null && HIDDEN_STATUSES.has($data.status));\n\n  function onOpenChange(next: boolean) {\n    if (!next && pendingRef.current) return;\n    setOpen(next);\n    if (!next) {\n      requestRef.current += 1;\n      setSelected(null);\n      setOtherText('');\n      setOutcome((current) => (current === 'failure' ? 'idle' : current));\n    }\n  }\n\n  async function confirm() {\n    if (pendingRef.current || !$data) return;\n    const cancel = $actions?.order?.cancel;\n    if (!cancel) {\n      setFailureMessage(copy.failure);\n      setOutcome('failure');\n      return;\n    }\n\n    const request = requestRef.current + 1;\n    requestRef.current = request;\n    pendingRef.current = true;\n    setPending(true);\n    try {\n      const reason = chosenReason(selected, copy.reasons, otherText);\n      const result = await cancel(reason == null ? { id: $data.id } : { id: $data.id, reason });\n      if (request !== requestRef.current) return;\n      if (result.userErrors.length === 0) {\n        setSucceeded(true);\n        setOutcome('success');\n        setOpen(false);\n        refresh();\n        return;\n      }\n\n      setFailureMessage(result.userErrors[0]?.message ?? copy.failure);\n      setOutcome('failure');\n    } finally {\n      pendingRef.current = false;\n      setPending(false);\n    }\n  }\n\n  function dismissMessage() {\n    setOutcome('idle');\n  }\n\n  function setRoot(node: HTMLDivElement | null) {\n    portalRoot.current = node;\n    if (typeof ref === 'function') {\n      ref(node);\n      return;\n    }\n    if (ref) {\n      ref.current = node;\n    }\n  }\n\n  if (ineligible || (succeeded && outcome !== 'success')) return null;\n\n  if (succeeded) {\n    return (\n      <div ref={ref} className={className} data-fs-order-cancel=\"\" data-fs-order-cancel-outcome=\"success\">\n        <Acknowledgement\n          ref={messageRef}\n          message={copy.success}\n          dismissLabel={copy.dismissMessage}\n          onDismiss={dismissMessage}\n        />\n      </div>\n    );\n  }\n\n  return (\n    <div ref={setRoot} className={className} data-fs-order-cancel=\"\" data-fs-order-cancel-outcome={outcome}>\n      <AlertDialogRoot open={open} onOpenChange={onOpenChange}>\n        <AlertDialogTrigger data-fs-order-cancel-action=\"\">{copy.trigger}</AlertDialogTrigger>\n        <AlertDialogPortal container={portalRoot}>\n          <AlertDialogBackdrop />\n          <AlertDialogViewport>\n            <AlertDialogPopup>\n              <AlertDialogTitle>{copy.title}</AlertDialogTitle>\n              <AlertDialogDescription>{copy.description}</AlertDialogDescription>\n              <Radio.Group\n                value={selected ?? ''}\n                onValueChange={setSelected}\n                data-fs-order-cancel-reasons=\"\"\n                disabled={pending}\n              >\n                {copy.reasons.map((label, index) => (\n                  <Radio.Root key={label} value={String(index)}>\n                    <Radio.Indicator keepMounted>\n                      <span data-fs-order-cancel-mark=\"\" />\n                    </Radio.Indicator>\n                    {label}\n                  </Radio.Root>\n                ))}\n                <Radio.Root value={OTHER}>\n                  <Radio.Indicator keepMounted>\n                    <span data-fs-order-cancel-mark=\"\" />\n                  </Radio.Indicator>\n                  {copy.other}\n                </Radio.Root>\n              </Radio.Group>\n              {selected === OTHER ? (\n                <label htmlFor=\"order-cancel-other\" data-fs-order-cancel-other=\"\">\n                  <span>{copy.otherField}</span>\n                  <Input\n                    id=\"order-cancel-other\"\n                    value={otherText}\n                    disabled={pending}\n                    maxLength={REASON_MAX_LENGTH}\n                    onChange={(event) => {\n                      setOtherText(event.target.value.slice(0, REASON_MAX_LENGTH));\n                    }}\n                  />\n                </label>\n              ) : null}\n              {outcome === 'failure' ? (\n                <Acknowledgement\n                  ref={messageRef}\n                  message={failureMessage}\n                  dismissLabel={copy.dismissMessage}\n                  onDismiss={dismissMessage}\n                />\n              ) : null}\n              <div data-fs-order-cancel-actions=\"\">\n                <Button type=\"button\" data-fs-order-cancel-confirm=\"\" disabled={pending} onClick={() => void confirm()}>\n                  {copy.confirm}\n                </Button>\n                <AlertDialogClose data-fs-order-cancel-dismiss=\"\" disabled={pending}>\n                  {copy.dismiss}\n                </AlertDialogClose>\n              </div>\n            </AlertDialogPopup>\n          </AlertDialogViewport>\n        </AlertDialogPortal>\n      </AlertDialogRoot>\n    </div>\n  );\n}\n\nfunction Acknowledgement({\n  ref,\n  message,\n  dismissLabel,\n  onDismiss,\n}: Readonly<{\n  ref: Ref<HTMLButtonElement>;\n  message: string;\n  dismissLabel: string;\n  onDismiss: () => void;\n}>) {\n  return (\n    <output data-fs-order-cancel-message=\"\">\n      {message}\n      <Button ref={ref} type=\"button\" aria-label={dismissLabel} onClick={onDismiss}>\n        {dismissLabel}\n      </Button>\n    </output>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"order-cancel.js","names":[],"sources":["../../../src/matter/order-cancel/order-cancel.tsx"],"sourcesContent":["'use client';\n\nimport {\n  type ContentValue,\n  defineComponent,\n  defineContentType,\n  type MessageFieldName,\n  type MessageLocaleProp,\n} from '@vtex/fs-core';\nimport type { Ref } from 'react';\nimport { useEffect, useRef, useState } from 'react';\nimport {\n  AlertDialogBackdrop,\n  AlertDialogClose,\n  AlertDialogDescription,\n  AlertDialogPopup,\n  AlertDialogPortal,\n  AlertDialogRoot,\n  AlertDialogTitle,\n  AlertDialogTrigger,\n  AlertDialogViewport,\n} from '../../particles/alert-dialog/alert-dialog.js';\nimport { Button } from '../../particles/button/button.js';\nimport { Input } from '../../particles/input/input.js';\nimport { Radio } from '../../particles/radio/radio.js';\nimport { useActionsOverride } from '../../sdk/actions/actions-override-context.js';\nimport type { ComponentActions } from '../../sdk/actions/types.js';\nimport { formatErrorCode } from '../../sdk/i18n/format-error-code.js';\nimport type { MessageFormatter } from '../../sdk/i18n/message-formatter.js';\nimport { useMessageFormatter } from '../../sdk/i18n/use-message-formatter.js';\nimport { useStorefrontNavigation } from '../../sdk/navigation/use-storefront-navigation.js';\nimport type { OrderCancelUserError } from '../../sdk/orders/order-operations.js';\n\nconst fragment = /* GraphQL */ `\n  fragment OrderCancelData on Query {\n    customerOrder(id: $orderId) {\n      id\n      status\n      allowCancellation\n    }\n  }\n`;\n\n/**\n * OMS statuses that already mean a cancellation was requested or finished.\n * `allowCancellation` can stay true in the intermediate ones, so the flag alone\n * would show the button again.\n */\nconst HIDDEN_STATUSES = new Set([\n  'request-cancel',\n  'cancellation-requested',\n  'cancellation-requested-with-ack',\n  'cancel',\n  'canceled',\n]);\n\nconst OTHER = 'other';\n\n/** Matches `CUSTOMER_ORDER_CANCEL_REASON_MAX_LENGTH` in the orders module. */\nconst REASON_MAX_LENGTH = 500;\n\nexport const OrderCancelContent = defineContentType({\n  id: 'order-cancel',\n  title: 'Order Cancel',\n  description: 'Confirmation copy and the optional cancellation reasons for one order.',\n  schema: {\n    type: 'object',\n    additionalProperties: false,\n    // Literals, not `COPY.*`: the catalog scanner only evaluates values it can see in the call.\n    properties: {\n      trigger: {\n        type: 'string',\n        title: 'Trigger',\n        format: 'icu-message',\n        messageSource: 'Cancel order',\n      },\n      title: {\n        type: 'string',\n        title: 'Title',\n        format: 'icu-message',\n        messageSource: 'Cancel this order?',\n      },\n      description: {\n        type: 'string',\n        title: 'Description',\n        format: 'icu-message',\n        messageSource: 'This cannot be undone.',\n      },\n      confirm: {\n        type: 'string',\n        title: 'Confirm',\n        format: 'icu-message',\n        messageSource: 'Cancel order',\n      },\n      dismiss: {\n        type: 'string',\n        title: 'Dismiss',\n        format: 'icu-message',\n        messageSource: 'Keep order',\n      },\n      other: { type: 'string', title: 'Other', format: 'icu-message', messageSource: 'Other' },\n      otherField: {\n        type: 'string',\n        title: 'Other field',\n        format: 'icu-message',\n        messageSource: 'Reason',\n      },\n      success: {\n        type: 'string',\n        title: 'Success',\n        format: 'icu-message',\n        messageSource: 'Your order was cancelled.',\n      },\n      failure: {\n        type: 'string',\n        title: 'Failure',\n        format: 'icu-message',\n        messageSource: 'Unable to cancel the order. Please try again.',\n      },\n      notCancellableMessage: {\n        type: 'string',\n        title: 'Not cancellable message',\n        description: 'Shown when the order is past the point where it can be cancelled.',\n        format: 'icu-message',\n        messageSource: 'This order can no longer be cancelled.',\n      },\n      notFoundMessage: {\n        type: 'string',\n        title: 'Order not found message',\n        description: 'Shown when the order is not one the signed-in shopper can see.',\n        format: 'icu-message',\n        messageSource: 'We could not find this order.',\n      },\n      dismissMessage: {\n        type: 'string',\n        title: 'Dismiss message',\n        format: 'icu-message',\n        messageSource: 'Dismiss',\n      },\n      reasonChangedMind: {\n        type: 'string',\n        title: 'Reason: changed mind',\n        description: 'Default reason option.',\n        format: 'icu-message',\n        messageSource: 'Changed my mind',\n      },\n      reasonBoughtByMistake: {\n        type: 'string',\n        title: 'Reason: bought by mistake',\n        description: 'Default reason option.',\n        format: 'icu-message',\n        messageSource: 'Bought by mistake',\n      },\n      reasonBetterPrice: {\n        type: 'string',\n        title: 'Reason: better price',\n        description: 'Default reason option.',\n        format: 'icu-message',\n        messageSource: 'Found a better price',\n      },\n      reasonSlowDelivery: {\n        type: 'string',\n        title: 'Reason: slow delivery',\n        description: 'Default reason option.',\n        format: 'icu-message',\n        messageSource: 'Delivery is too slow',\n      },\n      reasons: {\n        type: 'array',\n        title: 'Reasons',\n        items: {\n          type: 'object',\n          additionalProperties: false,\n          required: ['label'],\n          properties: {\n            label: { type: 'string', minLength: 1, title: 'Label' },\n          },\n        },\n      },\n    },\n  },\n});\n\nexport type OrderCancelContentValue = ContentValue<typeof OrderCancelContent>;\n\n/** The default reasons, in display order, offered when the content authors no `reasons`. */\nconst DEFAULT_REASONS = [\n  'reasonChangedMind',\n  'reasonBoughtByMistake',\n  'reasonBetterPrice',\n  'reasonSlowDelivery',\n] as const satisfies readonly MessageFieldName<typeof OrderCancelContent>[];\n\n/** Unwrapped `customerOrder`. A single-root fragment binds `$data` to that field. */\nexport type OrderCancelData = {\n  id: string;\n  status: string;\n  allowCancellation: boolean;\n};\n\nexport type OrderCancelProps = MessageLocaleProp &\n  Readonly<{\n    $data?: OrderCancelData | null;\n    $actions?: ComponentActions;\n    $content?: OrderCancelContentValue;\n    className?: string;\n    ref?: Ref<HTMLDivElement>;\n  }>;\n\ntype OrderCancelCopy = {\n  trigger: string;\n  title: string;\n  description: string;\n  confirm: string;\n  dismiss: string;\n  other: string;\n  otherField: string;\n  success: string;\n  failure: string;\n  dismissMessage: string;\n  reasons: readonly string[];\n};\n\nexport const OrderCancelDefinition = defineComponent<OrderCancelProps>({\n  name: 'OrderCancel',\n  importPath: '@vtex/faststore/components',\n  component: OrderCancel,\n  fragment,\n  skeleton: OrderCancelSkeleton,\n  actions: { order: ['cancel'] },\n  content: OrderCancelContent,\n  editor: { label: 'Order Cancel', category: 'action' },\n  schema: {},\n  guideline:\n    'Cancels one eligible order after the shopper confirms in an alert dialog. Place it on the order page. It hides when the order cannot be cancelled or a cancellation is already requested. Reasons and the dialog copy are content. Other is always offered. See order-cancel.md.',\n});\n\nexport function OrderCancelSkeleton({ className }: Readonly<{ className?: string }>) {\n  return <div className={className} data-fs-order-cancel-skeleton=\"\" aria-hidden=\"true\" />;\n}\n\nfunction reasonsOf(\n  content: OrderCancelContentValue | undefined,\n  format: MessageFormatter<typeof OrderCancelContent>['format'],\n): readonly string[] {\n  if (content?.reasons == null) {\n    return DEFAULT_REASONS.map((field) => format(field));\n  }\n  return content.reasons.flatMap((item) => {\n    const label = item.label.trim();\n    return label ? [label] : [];\n  });\n}\n\nfunction copyOf(\n  content: OrderCancelContentValue | undefined,\n  { format }: MessageFormatter<typeof OrderCancelContent>,\n): OrderCancelCopy {\n  return {\n    trigger: format('trigger'),\n    title: format('title'),\n    description: format('description'),\n    confirm: format('confirm'),\n    dismiss: format('dismiss'),\n    other: format('other'),\n    otherField: format('otherField'),\n    success: format('success'),\n    failure: format('failure'),\n    dismissMessage: format('dismissMessage'),\n    reasons: reasonsOf(content, format),\n  };\n}\n\n/**\n * The message for each cancellation refusal: the server's `CustomerOrderCancelErrorCode` values plus\n * the client-minted transport failure. A code this map does not know shows `failure`.\n */\nexport const ORDER_CANCEL_ERROR_FIELDS = {\n  ORDER_NOT_CANCELLABLE: 'notCancellableMessage',\n  NOT_FOUND: 'notFoundMessage',\n  NETWORK_ERROR: 'failure',\n} as const satisfies Record<\n  'ORDER_NOT_CANCELLABLE' | 'NOT_FOUND' | 'NETWORK_ERROR',\n  MessageFieldName<typeof OrderCancelContent>\n>;\n\nfunction chosenReason(selected: string | null, reasons: readonly string[], otherText: string): string | undefined {\n  if (selected == null) return undefined;\n  if (selected === OTHER) {\n    const trimmed = otherText.trim();\n    return trimmed || undefined;\n  }\n  const label = reasons[Number(selected)]?.trim();\n  return label || undefined;\n}\n\nexport function OrderCancel({ $data, $actions: $actionsProp, $content, className, ref }: OrderCancelProps) {\n  const $actions = useActionsOverride($actionsProp);\n  const messages = useMessageFormatter(OrderCancelContent, $content);\n  const { refresh } = useStorefrontNavigation();\n  const copy = copyOf($content, messages);\n  const [open, setOpen] = useState(false);\n  const [selected, setSelected] = useState<string | null>(null);\n  const [otherText, setOtherText] = useState('');\n  const [pending, setPending] = useState(false);\n  const [succeeded, setSucceeded] = useState(false);\n  const [outcome, setOutcome] = useState<'idle' | 'success' | 'failure'>('idle');\n  const [failure, setFailure] = useState<OrderCancelUserError | null>(null);\n  const pendingRef = useRef(false);\n  const requestRef = useRef(0);\n  const messageRef = useRef<HTMLButtonElement>(null);\n  const portalRoot = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    if (outcome === 'success' || outcome === 'failure') {\n      messageRef.current?.focus();\n    }\n  }, [outcome]);\n\n  const ineligible = !$data?.allowCancellation || ($data != null && HIDDEN_STATUSES.has($data.status));\n\n  function onOpenChange(next: boolean) {\n    if (!next && pendingRef.current) return;\n    setOpen(next);\n    if (!next) {\n      requestRef.current += 1;\n      setSelected(null);\n      setOtherText('');\n      setOutcome((current) => (current === 'failure' ? 'idle' : current));\n    }\n  }\n\n  async function confirm() {\n    if (pendingRef.current || !$data) return;\n    const cancel = $actions?.order?.cancel;\n    if (!cancel) {\n      setFailure(null);\n      setOutcome('failure');\n      return;\n    }\n\n    const request = requestRef.current + 1;\n    requestRef.current = request;\n    pendingRef.current = true;\n    setPending(true);\n    try {\n      const reason = chosenReason(selected, copy.reasons, otherText);\n      const result = await cancel(reason == null ? { id: $data.id } : { id: $data.id, reason });\n      if (request !== requestRef.current) return;\n      if (result.userErrors.length === 0) {\n        setSucceeded(true);\n        setOutcome('success');\n        setOpen(false);\n        refresh();\n        return;\n      }\n\n      setFailure(result.userErrors[0] ?? null);\n      setOutcome('failure');\n    } finally {\n      pendingRef.current = false;\n      setPending(false);\n    }\n  }\n\n  function failureMessage(): string {\n    if (!failure) return copy.failure;\n    return formatErrorCode(OrderCancelContent, ORDER_CANCEL_ERROR_FIELDS, failure, messages.format, 'failure');\n  }\n\n  function dismissMessage() {\n    setOutcome('idle');\n  }\n\n  function setRoot(node: HTMLDivElement | null) {\n    portalRoot.current = node;\n    if (typeof ref === 'function') {\n      ref(node);\n      return;\n    }\n    if (ref) {\n      ref.current = node;\n    }\n  }\n\n  if (ineligible || (succeeded && outcome !== 'success')) return null;\n\n  if (succeeded) {\n    return (\n      <div ref={ref} className={className} data-fs-order-cancel=\"\" data-fs-order-cancel-outcome=\"success\">\n        <Acknowledgement\n          ref={messageRef}\n          message={copy.success}\n          dismissLabel={copy.dismissMessage}\n          onDismiss={dismissMessage}\n        />\n      </div>\n    );\n  }\n\n  return (\n    <div ref={setRoot} className={className} data-fs-order-cancel=\"\" data-fs-order-cancel-outcome={outcome}>\n      <AlertDialogRoot open={open} onOpenChange={onOpenChange}>\n        <AlertDialogTrigger data-fs-order-cancel-action=\"\">{copy.trigger}</AlertDialogTrigger>\n        <AlertDialogPortal container={portalRoot}>\n          <AlertDialogBackdrop />\n          <AlertDialogViewport>\n            <AlertDialogPopup>\n              <AlertDialogTitle>{copy.title}</AlertDialogTitle>\n              <AlertDialogDescription>{copy.description}</AlertDialogDescription>\n              <Radio.Group\n                value={selected ?? ''}\n                onValueChange={setSelected}\n                data-fs-order-cancel-reasons=\"\"\n                disabled={pending}\n              >\n                {copy.reasons.map((label, index) => (\n                  <Radio.Root key={label} value={String(index)}>\n                    <Radio.Indicator keepMounted>\n                      <span data-fs-order-cancel-mark=\"\" />\n                    </Radio.Indicator>\n                    {label}\n                  </Radio.Root>\n                ))}\n                <Radio.Root value={OTHER}>\n                  <Radio.Indicator keepMounted>\n                    <span data-fs-order-cancel-mark=\"\" />\n                  </Radio.Indicator>\n                  {copy.other}\n                </Radio.Root>\n              </Radio.Group>\n              {selected === OTHER ? (\n                <label htmlFor=\"order-cancel-other\" data-fs-order-cancel-other=\"\">\n                  <span>{copy.otherField}</span>\n                  <Input\n                    id=\"order-cancel-other\"\n                    value={otherText}\n                    disabled={pending}\n                    maxLength={REASON_MAX_LENGTH}\n                    onChange={(event) => {\n                      setOtherText(event.target.value.slice(0, REASON_MAX_LENGTH));\n                    }}\n                  />\n                </label>\n              ) : null}\n              {outcome === 'failure' ? (\n                <Acknowledgement\n                  ref={messageRef}\n                  message={failureMessage()}\n                  dismissLabel={copy.dismissMessage}\n                  onDismiss={dismissMessage}\n                />\n              ) : null}\n              <div data-fs-order-cancel-actions=\"\">\n                <Button type=\"button\" data-fs-order-cancel-confirm=\"\" disabled={pending} onClick={() => void confirm()}>\n                  {copy.confirm}\n                </Button>\n                <AlertDialogClose data-fs-order-cancel-dismiss=\"\" disabled={pending}>\n                  {copy.dismiss}\n                </AlertDialogClose>\n              </div>\n            </AlertDialogPopup>\n          </AlertDialogViewport>\n        </AlertDialogPortal>\n      </AlertDialogRoot>\n    </div>\n  );\n}\n\nfunction Acknowledgement({\n  ref,\n  message,\n  dismissLabel,\n  onDismiss,\n}: Readonly<{\n  ref: Ref<HTMLButtonElement>;\n  message: string;\n  dismissLabel: string;\n  onDismiss: () => void;\n}>) {\n  return (\n    <output data-fs-order-cancel-message=\"\">\n      {message}\n      <Button ref={ref} type=\"button\" aria-label={dismissLabel} onClick={onDismiss}>\n        {dismissLabel}\n      </Button>\n    </output>\n  );\n}\n"],"mappings":"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"}

package/dist/matter/order-delivery-address/order-delivery-address.d.ts

@@ -1,4 +1,4 @@
-import { ContentValue } from "../../core/dist/define-content-type.js";
+import { ContentValue, MessageLocaleProp } from "../../core/dist/define-content-type.js";
 import { ComponentDefinition } from "../../core/dist/define-component.js";
 import "../../core/dist/index.js";
 import { ComponentPropsWithRef, Ref } from "react";
@@ -14,10 +14,14 @@ export declare const OrderDeliveryAddressContent: {
       readonly deliveryLabel: {
         readonly type: "string";
         readonly title: "Delivery address label";
+        readonly format: "icu-message";
+        readonly messageSource: "Delivery address";
       };
       readonly storeLabel: {
         readonly type: "string";
         readonly title: "Store address label";
+        readonly format: "icu-message";
+        readonly messageSource: "Store address";
       };
     };
   };
@@ -45,29 +49,15 @@ export type OrderDeliveryAddressOptionData = {
 export type OrderDeliveryAddressData = {
   deliveryOptions: OrderDeliveryAddressOptionData[];
 } | null;
-export type OrderDeliveryAddressProps = Readonly<{
-  /** Label above a delivery address. Content wins, then this prop, then the catalogue. */
-  deliveryLabel?: string;
-  /** Label above a pickup store address. Content wins, then this prop, then the catalogue. */
-  storeLabel?: string;
+export type OrderDeliveryAddressProps = MessageLocaleProp & Readonly<{
   /** Injected by the compiler from the page content entry. */
   $content?: OrderDeliveryAddressContentValue;
   $data?: OrderDeliveryAddressData;
   className?: string;
   ref?: Ref<HTMLElement>;
 }>;
-export declare const OrderDeliveryAddressDefinition: ComponentDefinition<Readonly<{
-  /** Label above a delivery address. Content wins, then this prop, then the catalogue. */
-  deliveryLabel?: string;
-  /** Label above a pickup store address. Content wins, then this prop, then the catalogue. */
-  storeLabel?: string;
-  /** Injected by the compiler from the page content entry. */
-  $content?: OrderDeliveryAddressContentValue;
-  $data?: OrderDeliveryAddressData;
-  className?: string;
-  ref?: Ref<HTMLElement>;
-}>>;
+export declare const OrderDeliveryAddressDefinition: ComponentDefinition<OrderDeliveryAddressProps>;
 export declare function OrderDeliveryAddressSkeleton({ className, ...props }: ComponentPropsWithRef<'div'>): import("react/jsx-runtime").JSX.Element;
-export declare function OrderDeliveryAddress({ deliveryLabel, storeLabel, $content, $data, className, ref }: OrderDeliveryAddressProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function OrderDeliveryAddress({ $content, $data, className, ref }: OrderDeliveryAddressProps): import("react/jsx-runtime").JSX.Element | null;
 //#endregion
 //# sourceMappingURL=order-delivery-address.d.ts.map

package/dist/matter/order-delivery-address/order-delivery-address.js

@@ -2,7 +2,7 @@
 import { defineComponent } from "../../core/dist/define-component.js";
 import { defineContentType } from "../../core/dist/define-content-type.js";
 import "../../core/dist/index.js";
-import { useIntl } from "../../sdk/i18n/client.js";
+import { useMessageFormatter } from "../../sdk/i18n/use-message-formatter.js";
 import { useOrderDeliveryOption } from "../order-delivery-group/order-delivery-group.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/matter/order-delivery-address/order-delivery-address.tsx
@@ -38,11 +38,15 @@ const OrderDeliveryAddressContent = defineContentType({
 		properties: {
 			deliveryLabel: {
 				type: "string",
-				title: "Delivery address label"
+				title: "Delivery address label",
+				format: "icu-message",
+				messageSource: "Delivery address"
 			},
 			storeLabel: {
 				type: "string",
-				title: "Store address label"
+				title: "Store address label",
+				format: "icu-message",
+				messageSource: "Store address"
 			}
 		}
 	}
@@ -60,16 +64,7 @@ const OrderDeliveryAddressDefinition = defineComponent({
 		label: "Order Delivery Address",
 		category: "content"
 	},
-	schema: {
-		deliveryLabel: {
-			type: "string",
-			label: "Delivery address label"
-		},
-		storeLabel: {
-			type: "string",
-			label: "Store address label"
-		}
-	},
+	schema: {},
 	guideline: "The address the order recorded for one delivery option: the recipient and the delivery-address label for a delivery, the store-address label for a pickup, and every non-empty address field. Place it inside OrderDeliveryGroup, after the rows; it renders the address of the option it sits in."
 });
 const PICKUP_CHANNEL = "pickup-in-point";
@@ -106,14 +101,10 @@ function OrderDeliveryAddressSkeleton({ className, ...props }) {
 		children: /* @__PURE__ */ jsx("span", { "data-fs-order-delivery-address-skeleton-line": "" })
 	});
 }
-function OrderDeliveryAddress({ deliveryLabel, storeLabel, $content, $data, className, ref }) {
-	const intl = useIntl();
+function OrderDeliveryAddress({ $content, $data, className, ref }) {
+	const messages = useMessageFormatter(OrderDeliveryAddressContent, $content);
 	const inGroup = useOrderDeliveryOption();
 	const options = $data?.deliveryOptions ?? [];
-	const labels = {
-		delivery: text($content?.deliveryLabel) ?? text(deliveryLabel) ?? intl.formatMessage({ id: "fs/order-delivery-address.delivery" }),
-		store: text($content?.storeLabel) ?? text(storeLabel) ?? intl.formatMessage({ id: "fs/order-delivery-address.store" })
-	};
 	if (inGroup) {
 		const option = options[inGroup.index];
 		if (!option?.address) return null;
@@ -122,13 +113,13 @@ function OrderDeliveryAddress({ deliveryLabel, storeLabel, $content, $data, clas
 			className,
 			index: inGroup.index,
 			option,
-			labels
+			messages
 		});
 	}
 	const blocks = options.flatMap((option, index) => option.address ? [/* @__PURE__ */ jsx(AddressBlock, {
 		index,
 		option,
-		labels
+		messages
 	}, `${index}:${optionKey(option)}`)] : []);
 	if (blocks.length === 0) return null;
 	return /* @__PURE__ */ jsx("div", {
@@ -138,7 +129,7 @@ function OrderDeliveryAddress({ deliveryLabel, storeLabel, $content, $data, clas
 		children: blocks
 	});
 }
-function AddressBlock({ index, option, labels, className, ref }) {
+function AddressBlock({ index, option, messages, className, ref }) {
 	const pickup = option.deliveryChannel === PICKUP_CHANNEL;
 	const recipient = pickup ? null : text(option.address?.receiverName);
 	return /* @__PURE__ */ jsxs("address", {
@@ -150,7 +141,7 @@ function AddressBlock({ index, option, labels, className, ref }) {
 		children: [
 			/* @__PURE__ */ jsx("span", {
 				"data-fs-order-delivery-address-label": "",
-				children: pickup ? labels.store : labels.delivery
+				children: messages.format(pickup ? "storeLabel" : "deliveryLabel")
 			}),
 			recipient ? /* @__PURE__ */ jsx("span", {
 				"data-fs-order-delivery-address-recipient": "",

package/dist/matter/order-delivery-address/order-delivery-address.js.map

@@ -1 +1 @@
-{"version":3,"file":"order-delivery-address.js","names":[],"sources":["../../../src/matter/order-delivery-address/order-delivery-address.tsx"],"sourcesContent":["'use client';\n\nimport { type ContentValue, defineComponent, defineContentType } from '@vtex/fs-core';\nimport type { ComponentPropsWithRef, Ref } from 'react';\nimport { useIntl } from '../../sdk/i18n/client.js';\nimport { useOrderDeliveryOption } from '../order-delivery-group/order-delivery-group.js';\n\nconst fragment = /* GraphQL */ `\n  fragment OrderDeliveryAddressData on Query {\n    customerOrder(id: $orderId) {\n      deliveryOptions {\n        addressId\n        deliveryChannel\n        address {\n          receiverName\n          street\n          number\n          complement\n          neighborhood\n          reference\n          city\n          state\n          postalCode\n          country\n        }\n      }\n    }\n  }\n`;\n\nexport const OrderDeliveryAddressContent = defineContentType({\n  id: 'order-delivery-address',\n  title: 'Order Delivery Address',\n  description: 'The labels above a delivery address and above a pickup store address.',\n  schema: {\n    type: 'object',\n    additionalProperties: false,\n    properties: {\n      deliveryLabel: { type: 'string', title: 'Delivery address label' },\n      storeLabel: { type: 'string', title: 'Store address label' },\n    },\n  },\n});\n\nexport type OrderDeliveryAddressContentValue = ContentValue<typeof OrderDeliveryAddressContent>;\n\n/** The historical address OMS recorded on one delivery option. */\nexport type OrderDeliveryAddressRecord = {\n  receiverName: string | null;\n  street: string | null;\n  number: string | null;\n  complement: string | null;\n  neighborhood: string | null;\n  reference: string | null;\n  city: string | null;\n  state: string | null;\n  postalCode: string | null;\n  country: string | null;\n};\n\nexport type OrderDeliveryAddressOptionData = {\n  addressId: string | null;\n  deliveryChannel: string | null;\n  address: OrderDeliveryAddressRecord | null;\n};\n\n/** Unwrapped `CustomerOrder` slice. Null when the id does not resolve to the shopper's order. */\nexport type OrderDeliveryAddressData = {\n  deliveryOptions: OrderDeliveryAddressOptionData[];\n} | null;\n\nexport type OrderDeliveryAddressProps = Readonly<{\n  /** Label above a delivery address. Content wins, then this prop, then the catalogue. */\n  deliveryLabel?: string;\n  /** Label above a pickup store address. Content wins, then this prop, then the catalogue. */\n  storeLabel?: string;\n  /** Injected by the compiler from the page content entry. */\n  $content?: OrderDeliveryAddressContentValue;\n  $data?: OrderDeliveryAddressData;\n  className?: string;\n  ref?: Ref<HTMLElement>;\n}>;\n\nexport const OrderDeliveryAddressDefinition = defineComponent<OrderDeliveryAddressProps>({\n  name: 'OrderDeliveryAddress',\n  importPath: '@vtex/faststore/components',\n  component: OrderDeliveryAddress,\n  content: OrderDeliveryAddressContent,\n  fragment,\n  fetchStrategy: 'static',\n  skeleton: OrderDeliveryAddressSkeleton,\n  requiresContext: 'order-delivery-option',\n  editor: { label: 'Order Delivery Address', category: 'content' },\n  schema: {\n    deliveryLabel: { type: 'string', label: 'Delivery address label' },\n    storeLabel: { type: 'string', label: 'Store address label' },\n  },\n  guideline:\n    'The address the order recorded for one delivery option: the recipient and the delivery-address label for a delivery, the store-address label for a pickup, and every non-empty address field. Place it inside OrderDeliveryGroup, after the rows; it renders the address of the option it sits in.',\n});\n\nconst PICKUP_CHANNEL = 'pickup-in-point';\n\nconst FIELDS = [\n  ['street', { 'data-fs-order-delivery-address-street': '' }],\n  ['number', { 'data-fs-order-delivery-address-number': '' }],\n  ['complement', { 'data-fs-order-delivery-address-complement': '' }],\n  ['neighborhood', { 'data-fs-order-delivery-address-neighborhood': '' }],\n  ['reference', { 'data-fs-order-delivery-address-reference': '' }],\n  ['city', { 'data-fs-order-delivery-address-city': '' }],\n  ['state', { 'data-fs-order-delivery-address-state': '' }],\n  ['postalCode', { 'data-fs-order-delivery-address-postal-code': '' }],\n  ['country', { 'data-fs-order-delivery-address-country': '' }],\n] as const satisfies ReadonlyArray<readonly [keyof OrderDeliveryAddressRecord, object]>;\n\nfunction text(value: string | null | undefined): string | null {\n  const trimmed = value?.trim();\n  return trimmed || null;\n}\n\nfunction optionKey(option: OrderDeliveryAddressOptionData): string {\n  const address = option.address;\n  const key = [option.addressId, option.deliveryChannel, address?.postalCode, address?.street, address?.number]\n    .filter(Boolean)\n    .join('-');\n  return key || 'address';\n}\n\nexport function OrderDeliveryAddressSkeleton({ className, ...props }: ComponentPropsWithRef<'div'>) {\n  return (\n    <div {...props} className={className} data-fs-order-delivery-address-skeleton=\"\" aria-hidden=\"true\">\n      <span data-fs-order-delivery-address-skeleton-line=\"\" />\n    </div>\n  );\n}\n\nexport function OrderDeliveryAddress({\n  deliveryLabel,\n  storeLabel,\n  $content,\n  $data,\n  className,\n  ref,\n}: OrderDeliveryAddressProps) {\n  const intl = useIntl();\n  const inGroup = useOrderDeliveryOption();\n  const options = $data?.deliveryOptions ?? [];\n  const labels = {\n    delivery:\n      text($content?.deliveryLabel) ??\n      text(deliveryLabel) ??\n      intl.formatMessage({ id: 'fs/order-delivery-address.delivery' }),\n    store:\n      text($content?.storeLabel) ?? text(storeLabel) ?? intl.formatMessage({ id: 'fs/order-delivery-address.store' }),\n  };\n\n  if (inGroup) {\n    const option = options[inGroup.index];\n    if (!option?.address) {\n      return null;\n    }\n    return <AddressBlock ref={ref} className={className} index={inGroup.index} option={option} labels={labels} />;\n  }\n\n  const blocks = options.flatMap((option, index) =>\n    option.address\n      ? [<AddressBlock key={`${index}:${optionKey(option)}`} index={index} option={option} labels={labels} />]\n      : [],\n  );\n  if (blocks.length === 0) {\n    return null;\n  }\n\n  return (\n    <div ref={ref as Ref<HTMLDivElement>} className={className} data-fs-order-delivery-address-list=\"\">\n      {blocks}\n    </div>\n  );\n}\n\ntype AddressBlockProps = Readonly<{\n  index: number;\n  option: OrderDeliveryAddressOptionData;\n  labels: Readonly<{ delivery: string; store: string }>;\n  className?: string;\n  ref?: Ref<HTMLElement>;\n}>;\n\nfunction AddressBlock({ index, option, labels, className, ref }: AddressBlockProps) {\n  const pickup = option.deliveryChannel === PICKUP_CHANNEL;\n  const recipient = pickup ? null : text(option.address?.receiverName);\n\n  return (\n    <address\n      ref={ref}\n      className={className}\n      data-fs-order-delivery-address=\"\"\n      data-fs-order-delivery-address-channel={pickup ? PICKUP_CHANNEL : 'delivery'}\n      data-fs-order-delivery-address-option={index}\n    >\n      <span data-fs-order-delivery-address-label=\"\">{pickup ? labels.store : labels.delivery}</span>\n      {recipient ? <span data-fs-order-delivery-address-recipient=\"\">{recipient}</span> : null}\n      {FIELDS.map(([name, hook]) => {\n        const value = text(option.address?.[name]);\n        return value ? (\n          <span key={name} {...hook}>\n            {value}\n          </span>\n        ) : null;\n      })}\n    </address>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"order-delivery-address.js","names":[],"sources":["../../../src/matter/order-delivery-address/order-delivery-address.tsx"],"sourcesContent":["'use client';\n\nimport { type ContentValue, defineComponent, defineContentType, type MessageLocaleProp } from '@vtex/fs-core';\nimport type { ComponentPropsWithRef, Ref } from 'react';\nimport type { MessageFormatter } from '../../sdk/i18n/message-formatter.js';\nimport { useMessageFormatter } from '../../sdk/i18n/use-message-formatter.js';\nimport { useOrderDeliveryOption } from '../order-delivery-group/order-delivery-group.js';\n\nconst fragment = /* GraphQL */ `\n  fragment OrderDeliveryAddressData on Query {\n    customerOrder(id: $orderId) {\n      deliveryOptions {\n        addressId\n        deliveryChannel\n        address {\n          receiverName\n          street\n          number\n          complement\n          neighborhood\n          reference\n          city\n          state\n          postalCode\n          country\n        }\n      }\n    }\n  }\n`;\n\nexport const OrderDeliveryAddressContent = defineContentType({\n  id: 'order-delivery-address',\n  title: 'Order Delivery Address',\n  description: 'The labels above a delivery address and above a pickup store address.',\n  schema: {\n    type: 'object',\n    additionalProperties: false,\n    properties: {\n      deliveryLabel: {\n        type: 'string',\n        title: 'Delivery address label',\n        format: 'icu-message',\n        messageSource: 'Delivery address',\n      },\n      storeLabel: {\n        type: 'string',\n        title: 'Store address label',\n        format: 'icu-message',\n        messageSource: 'Store address',\n      },\n    },\n  },\n});\n\nexport type OrderDeliveryAddressContentValue = ContentValue<typeof OrderDeliveryAddressContent>;\n\n/** The historical address OMS recorded on one delivery option. */\nexport type OrderDeliveryAddressRecord = {\n  receiverName: string | null;\n  street: string | null;\n  number: string | null;\n  complement: string | null;\n  neighborhood: string | null;\n  reference: string | null;\n  city: string | null;\n  state: string | null;\n  postalCode: string | null;\n  country: string | null;\n};\n\nexport type OrderDeliveryAddressOptionData = {\n  addressId: string | null;\n  deliveryChannel: string | null;\n  address: OrderDeliveryAddressRecord | null;\n};\n\n/** Unwrapped `CustomerOrder` slice. Null when the id does not resolve to the shopper's order. */\nexport type OrderDeliveryAddressData = {\n  deliveryOptions: OrderDeliveryAddressOptionData[];\n} | null;\n\nexport type OrderDeliveryAddressProps = MessageLocaleProp &\n  Readonly<{\n    /** Injected by the compiler from the page content entry. */\n    $content?: OrderDeliveryAddressContentValue;\n    $data?: OrderDeliveryAddressData;\n    className?: string;\n    ref?: Ref<HTMLElement>;\n  }>;\n\nexport const OrderDeliveryAddressDefinition = defineComponent<OrderDeliveryAddressProps>({\n  name: 'OrderDeliveryAddress',\n  importPath: '@vtex/faststore/components',\n  component: OrderDeliveryAddress,\n  content: OrderDeliveryAddressContent,\n  fragment,\n  fetchStrategy: 'static',\n  skeleton: OrderDeliveryAddressSkeleton,\n  requiresContext: 'order-delivery-option',\n  editor: { label: 'Order Delivery Address', category: 'content' },\n  schema: {},\n  guideline:\n    'The address the order recorded for one delivery option: the recipient and the delivery-address label for a delivery, the store-address label for a pickup, and every non-empty address field. Place it inside OrderDeliveryGroup, after the rows; it renders the address of the option it sits in.',\n});\n\nconst PICKUP_CHANNEL = 'pickup-in-point';\n\nconst FIELDS = [\n  ['street', { 'data-fs-order-delivery-address-street': '' }],\n  ['number', { 'data-fs-order-delivery-address-number': '' }],\n  ['complement', { 'data-fs-order-delivery-address-complement': '' }],\n  ['neighborhood', { 'data-fs-order-delivery-address-neighborhood': '' }],\n  ['reference', { 'data-fs-order-delivery-address-reference': '' }],\n  ['city', { 'data-fs-order-delivery-address-city': '' }],\n  ['state', { 'data-fs-order-delivery-address-state': '' }],\n  ['postalCode', { 'data-fs-order-delivery-address-postal-code': '' }],\n  ['country', { 'data-fs-order-delivery-address-country': '' }],\n] as const satisfies ReadonlyArray<readonly [keyof OrderDeliveryAddressRecord, object]>;\n\nfunction text(value: string | null | undefined): string | null {\n  const trimmed = value?.trim();\n  return trimmed || null;\n}\n\nfunction optionKey(option: OrderDeliveryAddressOptionData): string {\n  const address = option.address;\n  const key = [option.addressId, option.deliveryChannel, address?.postalCode, address?.street, address?.number]\n    .filter(Boolean)\n    .join('-');\n  return key || 'address';\n}\n\nexport function OrderDeliveryAddressSkeleton({ className, ...props }: ComponentPropsWithRef<'div'>) {\n  return (\n    <div {...props} className={className} data-fs-order-delivery-address-skeleton=\"\" aria-hidden=\"true\">\n      <span data-fs-order-delivery-address-skeleton-line=\"\" />\n    </div>\n  );\n}\n\nexport function OrderDeliveryAddress({ $content, $data, className, ref }: OrderDeliveryAddressProps) {\n  const messages = useMessageFormatter(OrderDeliveryAddressContent, $content);\n  const inGroup = useOrderDeliveryOption();\n  const options = $data?.deliveryOptions ?? [];\n\n  if (inGroup) {\n    const option = options[inGroup.index];\n    if (!option?.address) {\n      return null;\n    }\n    return <AddressBlock ref={ref} className={className} index={inGroup.index} option={option} messages={messages} />;\n  }\n\n  const blocks = options.flatMap((option, index) =>\n    option.address\n      ? [<AddressBlock key={`${index}:${optionKey(option)}`} index={index} option={option} messages={messages} />]\n      : [],\n  );\n  if (blocks.length === 0) {\n    return null;\n  }\n\n  return (\n    <div ref={ref as Ref<HTMLDivElement>} className={className} data-fs-order-delivery-address-list=\"\">\n      {blocks}\n    </div>\n  );\n}\n\ntype AddressBlockProps = Readonly<{\n  index: number;\n  option: OrderDeliveryAddressOptionData;\n  messages: MessageFormatter<typeof OrderDeliveryAddressContent>;\n  className?: string;\n  ref?: Ref<HTMLElement>;\n}>;\n\nfunction AddressBlock({ index, option, messages, className, ref }: AddressBlockProps) {\n  const pickup = option.deliveryChannel === PICKUP_CHANNEL;\n  const recipient = pickup ? null : text(option.address?.receiverName);\n\n  return (\n    <address\n      ref={ref}\n      className={className}\n      data-fs-order-delivery-address=\"\"\n      data-fs-order-delivery-address-channel={pickup ? PICKUP_CHANNEL : 'delivery'}\n      data-fs-order-delivery-address-option={index}\n    >\n      <span data-fs-order-delivery-address-label=\"\">{messages.format(pickup ? 'storeLabel' : 'deliveryLabel')}</span>\n      {recipient ? <span data-fs-order-delivery-address-recipient=\"\">{recipient}</span> : null}\n      {FIELDS.map(([name, hook]) => {\n        const value = text(option.address?.[name]);\n        return value ? (\n          <span key={name} {...hook}>\n            {value}\n          </span>\n        ) : null;\n      })}\n    </address>\n  );\n}\n"],"mappings":"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"}