@vtex/faststore 0.0.7 → 0.0.10

package/dist/matter/cart-totalizer/cart-totalizer.js.map

@@ -1 +1 @@
-{"version":3,"file":"cart-totalizer.js","names":[],"sources":["../../../src/matter/cart-totalizer/cart-totalizer.tsx"],"sourcesContent":["'use client';\n\nimport { defineComponent } from '@vtex/fs-core';\nimport { type ComponentPropsWithRef, createContext, useContext, useMemo } from 'react';\nimport type { Money, CartTotalizer as Totalizer } from '../../sdk/cart/operations.js';\nimport { useStorefrontContext } from '../../sdk/context/storefront-context.js';\nimport { useDataOverride } from '../../sdk/data/data-override-context.js';\nimport { graphql } from '../../sdk/generated/gql.js';\nimport { CartTotalValueContext, formatPrice } from '../cart/cart.js';\n\n// ---------------------------------------------------------------------------\n// GraphQL Fragment — narrow cart slice (totalizers + total)\n// ---------------------------------------------------------------------------\n\nconst fragment = graphql(`\n  fragment CartTotalizerData on Query {\n    cart {\n      __typename\n      id\n      totalizers {\n        __typename\n        id\n        name\n        value {\n          ...MoneyFragment\n        }\n      }\n      total {\n        ...MoneyFragment\n      }\n    }\n  }\n`);\n\n// ---------------------------------------------------------------------------\n// Context — totalizers list, provided by CartTotalizerRoot for CartTotalizerLine\n// ---------------------------------------------------------------------------\n\ntype CartTotalizerContextValue = Readonly<{\n  totalizers: readonly Totalizer[];\n}>;\n\nconst CART_TOTALIZER_UNSET = Symbol('CartTotalizerContextUnset');\n\nconst CartTotalizerContextInternal = createContext<CartTotalizerContextValue | typeof CART_TOTALIZER_UNSET>(\n  CART_TOTALIZER_UNSET,\n);\n\nexport function useCartTotalizers(): CartTotalizerContextValue {\n  const ctx = useContext(CartTotalizerContextInternal);\n  if (ctx === CART_TOTALIZER_UNSET) {\n    throw new Error('useCartTotalizers() must be used inside a <CartTotalizerRoot> subtree.');\n  }\n  return ctx;\n}\n\n// ---------------------------------------------------------------------------\n// Types\n// ---------------------------------------------------------------------------\n\nexport type CartTotalizerRootProps = ComponentPropsWithRef<'div'> & {\n  /**\n   * Cart totalizer slice forwarded by the reactive runtime (`ReactiveDataProvider`) — it is the\n   * value of the `cart` top-level field on `CartTotalizerData on Query`, not the wrapping\n   * `{ cart: … }` shape. Receives `null` when the cart has not yet resolved.\n   */\n  $data?: { totalizers: readonly Totalizer[]; total: Money } | null;\n};\n\nexport type CartTotalizerLineProps = ComponentPropsWithRef<'div'> & {\n  /** Which `cart.totalizers` entry to render, selected by `id` (e.g. \"Items\", \"Shipping\", \"Discounts\"). */\n  totalizerId: string;\n  /** Optional label override; defaults to the totalizer's `name`. */\n  label?: string;\n  /** Styling hook → `data-fs-cart-totalizer-line-variant`. The F9 discounts line uses `'discount'`. */\n  variant?: 'default' | 'discount';\n  /** Text rendered in place of the value when the amount is exactly zero (e.g. \"Free\" for shipping — Decision 5). */\n  zeroLabel?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Definitions\n// ---------------------------------------------------------------------------\n\nexport const CartTotalizerRootDefinition = defineComponent<CartTotalizerRootProps>({\n  name: 'CartTotalizerRoot',\n  importPath: '@vtex/faststore/components',\n  component: CartTotalizerRoot,\n  fragment,\n  fetchStrategy: 'reactive',\n  editor: { label: 'Cart Totalizer Root', category: 'commerce' },\n  schema: {},\n  guideline:\n    'Focused reactive provider for cart totalizers + total (narrower than CartRoot); merges with CartRoot into one cart query when both are present on the page (e.g. CartRoot wrapping the mini-cart drawer, CartTotalizerRoot composing its footer). Use it to compose an order summary — in a mini-cart drawer footer or a checkout summary panel: wrap a CartTotalizerLine totalizerId=\"Items\" (subtotal), a CartTotalizerLine totalizerId=\"Discounts\" variant=\"discount\" (auto-hides at zero), a CartTotalizerLine totalizerId=\"Shipping\" zeroLabel=\"Grátis\", and a CartTotal for the grand total (set CartTotal label for a labeled total row). CartTotal is root-agnostic and reads the total from this root — there is no CartTotalizerTotal.',\n});\n\nexport const CartTotalizerLineDefinition = defineComponent<CartTotalizerLineProps>({\n  name: 'CartTotalizerLine',\n  importPath: '@vtex/faststore/components',\n  component: CartTotalizerLine,\n  editor: { label: 'Cart Totalizer Line', category: 'commerce' },\n  schema: {\n    totalizerId: { type: 'string', label: 'Totalizer Id' },\n    label: { type: 'string', label: 'Label' },\n    variant: { type: ['default', 'discount'] as const, default: 'default', label: 'Variant' },\n    zeroLabel: { type: 'string', label: 'Zero Label' },\n  },\n  guideline:\n    'Renders one cart totalizer row (label + value) selected by totalizerId. The canonical order-summary lines are totalizerId=\"Items\" (the subtotal), totalizerId=\"Discounts\" (the discount), and totalizerId=\"Shipping\" (the shipping cost). For the discounts line set variant=\"discount\" — it hides itself when the value is zero (no active discount). The Core API returns a negative amount for discounts; the formatted value displays as-is (e.g. \"-R$ 40,00\"). Set zeroLabel=\"Grátis\" for the shipping line so a zero amount renders the label instead of R$ 0,00. A line whose totalizerId is absent from the cart renders nothing (no empty row). Must be inside CartTotalizerRoot.',\n});\n\n// ---------------------------------------------------------------------------\n// Implementations\n// ---------------------------------------------------------------------------\n\nexport function CartTotalizerRoot({ $data: $dataProp, className, children, ...props }: CartTotalizerRootProps) {\n  const $data = useDataOverride($dataProp);\n\n  const totalizerValue: CartTotalizerContextValue = useMemo(\n    () => ({ totalizers: $data?.totalizers ?? [] }),\n    [$data?.totalizers],\n  );\n\n  return (\n    <CartTotalValueContext value={$data?.total ?? null}>\n      <CartTotalizerContextInternal value={totalizerValue}>\n        <div {...props} className={className} data-fs-cart-totalizer-root=\"\">\n          {children}\n        </div>\n      </CartTotalizerContextInternal>\n    </CartTotalValueContext>\n  );\n}\n\nexport function CartTotalizerLine({\n  totalizerId,\n  label,\n  variant = 'default',\n  zeroLabel,\n  className,\n  children,\n  ...props\n}: CartTotalizerLineProps) {\n  const { totalizers } = useCartTotalizers();\n  const { locale, currency } = useStorefrontContext();\n  const totalizer = totalizers.find((t) => t.id === totalizerId);\n\n  if (!totalizer) return null;\n\n  const amount = totalizer.value.amount;\n\n  if (variant === 'discount' && amount === 0) return null;\n\n  const valueContent = amount === 0 && zeroLabel != null ? zeroLabel : formatPrice(amount, locale, currency);\n\n  return (\n    <div {...props} className={className} data-fs-cart-totalizer-line=\"\" data-fs-cart-totalizer-line-variant={variant}>\n      <span>{label ?? totalizer.name}</span>\n      <span>{children ?? valueContent}</span>\n    </div>\n  );\n}\n\n// ---------------------------------------------------------------------------\n// CartDiscountLine — itemized discount breakdown (F11)\n// ---------------------------------------------------------------------------\n\n// Owns its own `Cart.discounts` slice (ADR-0011 data ownership): the field is fetched only when this\n// leaf is placed and merges with any CartTotalizerRoot / CartRoot cart selection into one query. The\n// entries are the itemized companion to the aggregate \"Discounts\" totalizer and sum to it, so a store\n// composes this OR CartTotalizerLine totalizerId=\"Discounts\", never both.\nconst cartDiscountLinesFragment = graphql(`\n  fragment CartDiscountLinesData on Query {\n    cart {\n      __typename\n      id\n      discounts {\n        name\n        value {\n          ...MoneyFragment\n        }\n        kind\n      }\n    }\n  }\n`);\n\nexport type CartDiscountKind = 'PROMOTION' | 'COUPON' | 'OTHER';\n\n/**\n * One cart-level discount line from `Cart.discounts`. `value` is the absolute amount discounted\n * (a positive `Money`); the negative sign is applied on render by the locale's currency format.\n * `amount` is typed `number` but is a string at runtime, so it is `Number()`-coerced before formatting.\n * `name` is null for the OTHER residual and for an unnamed promotion — the `otherLabel` prop names those.\n */\nexport type CartDiscountEntry = {\n  name: string | null;\n  value: { amount: number; currencyCode: string };\n  kind: CartDiscountKind;\n};\n\n/** Cart slice forwarded by the reactive runtime — the value of the top-level `cart` field. */\ntype CartDiscountLinesSlice = { discounts: CartDiscountEntry[] };\n\nexport type CartDiscountLineProps = ComponentPropsWithRef<'div'> & {\n  /** Label for lines the API cannot name: the OTHER residual and an unnamed featured promotion. */\n  otherLabel?: string;\n  /** Cart discount slice forwarded by the reactive runtime; injected/overridden by the runtime or in tests. */\n  $data?: CartDiscountLinesSlice | null;\n};\n\nexport const CartDiscountLineDefinition = defineComponent<CartDiscountLineProps>({\n  name: 'CartDiscountLine',\n  importPath: '@vtex/faststore/components',\n  component: CartDiscountLine,\n  fragment: cartDiscountLinesFragment,\n  fetchStrategy: 'reactive',\n  editor: { label: 'Cart Discount Line', category: 'commerce' },\n  schema: {\n    otherLabel: { type: 'string', default: 'Other discounts', label: 'Unnamed discount label' },\n  },\n  guideline:\n    'Itemized order-summary discounts: renders one line per entry in cart.discounts (one per promotion ' +\n    'and per coupon, plus a residual \"other\" line), each as label + negative amount. Renders nothing ' +\n    'when the cart has no discounts. This is the itemized alternative to CartTotalizerLine ' +\n    'totalizerId=\"Discounts\": the entries sum to that same aggregate, so compose this OR that line, ' +\n    'never both (both would double-count the same money). Place it in the order summary, typically ' +\n    'inside CartTotalizerRoot. Set otherLabel for the residual and any unnamed promotion. See cart-totalizer.md.',\n});\n\nexport function CartDiscountLine({\n  otherLabel = 'Other discounts',\n  className,\n  $data: $dataProp,\n  ...props\n}: CartDiscountLineProps) {\n  const slice = useDataOverride<CartDiscountLinesSlice | null | undefined>($dataProp);\n  const { locale, currency } = useStorefrontContext();\n  const discounts = slice?.discounts;\n\n  if (!discounts || discounts.length === 0) {\n    return null;\n  }\n\n  return (\n    <div {...props} className={className} data-fs-cart-discount-lines=\"\">\n      {discounts.map((discount, index) => {\n        const amount = Number(discount.value.amount);\n        const label = discount.name ?? otherLabel;\n\n        return (\n          <div\n            key={`${discount.kind}-${discount.name}-${index}`}\n            data-fs-cart-discount-line=\"\"\n            data-fs-cart-discount-line-kind={discount.kind.toLowerCase()}\n            data-fs-text=\"\"\n          >\n            <span data-fs-cart-discount-line-label=\"\">{label}</span>\n            {/* Negate the positive magnitude and let the currency format sign it — no hardcoded glyph. */}\n            <span data-fs-cart-discount-line-value=\"\">{formatPrice(-amount, locale, currency)}</span>\n          </div>\n        );\n      })}\n    </div>\n  );\n}\n\n// ---------------------------------------------------------------------------\n// CartMarkdownLine — aggregate item-level catalog markdown (F11 scenario 1)\n// ---------------------------------------------------------------------------\n\n// Renders Cart.itemMarkdownTotal — Σ(listPrice − price) × qty across non-gift lines, computed\n// server-side — as one negative summary line, self-hiding when zero. This is the catalog \"de/por\"\n// markdown that sits ABOVE the Items subtotal, so it is DISTINCT money from the cart-level promotions\n// on the Discounts totalizer / CartDiscountLine (price − sellingPrice): the two coexist in a summary,\n// they do not substitute. Owns its own slice (ADR-0011): the field is fetched only when this leaf is\n// placed and merges with any CartTotalizerRoot / CartRoot cart selection into one query.\nconst cartMarkdownFragment = graphql(`\n  fragment CartMarkdownData on Query {\n    cart {\n      __typename\n      id\n      itemMarkdownTotal {\n        ...MoneyFragment\n      }\n    }\n  }\n`);\n\n/** Cart slice forwarded by the reactive runtime — the value of the top-level `cart` field. */\ntype CartMarkdownSlice = { itemMarkdownTotal: { amount: number; currencyCode: string } };\n\nexport type CartMarkdownLineProps = ComponentPropsWithRef<'div'> & {\n  /** Row label for the aggregate item-level markdown. Interim operational default until the i18n catalog lands. */\n  label?: string;\n  /** Cart markdown slice forwarded by the reactive runtime; injected/overridden by the runtime or in tests. */\n  $data?: CartMarkdownSlice | null;\n};\n\nexport const CartMarkdownLineDefinition = defineComponent<CartMarkdownLineProps>({\n  name: 'CartMarkdownLine',\n  importPath: '@vtex/faststore/components',\n  component: CartMarkdownLine,\n  fragment: cartMarkdownFragment,\n  fetchStrategy: 'reactive',\n  editor: { label: 'Cart Markdown Line', category: 'commerce' },\n  schema: {\n    label: { type: 'string', default: 'Item discounts', label: 'Markdown label' },\n  },\n  guideline:\n    'Aggregate item-level catalog markdown: renders Cart.itemMarkdownTotal (the sum of listPrice − price ' +\n    'across the cart, the \"de/por\" catalog savings) as a single negative line. Renders nothing when the ' +\n    'cart has no markdown. This is DISTINCT money from CartDiscountLine and CartTotalizerLine ' +\n    'totalizerId=\"Discounts\" (those are cart-level promotions/coupons, price − sellingPrice) — it may be ' +\n    'shown ALONGSIDE them, not instead of them, and does not double-count. Place it in the order summary, ' +\n    'typically inside CartTotalizerRoot. Set label to word the row. See cart-totalizer.md.',\n});\n\nexport function CartMarkdownLine({\n  label = 'Item discounts',\n  className,\n  $data: $dataProp,\n  ...props\n}: CartMarkdownLineProps) {\n  const slice = useDataOverride<CartMarkdownSlice | null | undefined>($dataProp);\n  const { locale, currency } = useStorefrontContext();\n  // `amount` is a string at runtime; coerce before checking/formatting. A zero markdown self-hides.\n  const amount = Number(slice?.itemMarkdownTotal?.amount ?? 0);\n\n  if (!amount) {\n    return null;\n  }\n\n  return (\n    <div {...props} className={className} data-fs-cart-markdown-line=\"\" data-fs-text=\"\">\n      <span data-fs-cart-markdown-line-label=\"\">{label}</span>\n      {/* Negate the positive magnitude and let the currency format sign it — no hardcoded glyph. */}\n      <span data-fs-cart-markdown-line-value=\"\">{formatPrice(-amount, locale, currency)}</span>\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"cart-totalizer.js","names":[],"sources":["../../../src/matter/cart-totalizer/cart-totalizer.tsx"],"sourcesContent":["'use client';\n\nimport { defineComponent } from '@vtex/fs-core';\nimport { type ComponentPropsWithRef, createContext, useContext, useMemo } from 'react';\nimport type { Money, CartTotalizer as Totalizer } from '../../sdk/cart/operations.js';\nimport { useStorefrontContext } from '../../sdk/context/storefront-context.js';\nimport { useDataOverride } from '../../sdk/data/data-override-context.js';\nimport { graphql } from '../../sdk/generated/gql.js';\nimport { CartTotalValueContext, formatPrice, isFiniteAmount } from '../cart/cart.js';\n\n// ---------------------------------------------------------------------------\n// GraphQL Fragment — narrow cart slice (totalizers + total)\n// ---------------------------------------------------------------------------\n\nconst fragment = graphql(`\n  fragment CartTotalizerData on Query {\n    cart {\n      __typename\n      id\n      totalizers {\n        __typename\n        id\n        name\n        value {\n          ...MoneyFragment\n        }\n      }\n      total {\n        ...MoneyFragment\n      }\n    }\n  }\n`);\n\n// ---------------------------------------------------------------------------\n// Context — totalizers list, provided by CartTotalizerRoot for CartTotalizerLine\n// ---------------------------------------------------------------------------\n\ntype CartTotalizerContextValue = Readonly<{\n  totalizers: readonly Totalizer[];\n}>;\n\nconst CART_TOTALIZER_UNSET = Symbol('CartTotalizerContextUnset');\n\nconst CartTotalizerContextInternal = createContext<CartTotalizerContextValue | typeof CART_TOTALIZER_UNSET>(\n  CART_TOTALIZER_UNSET,\n);\n\nexport function useCartTotalizers(): CartTotalizerContextValue {\n  const ctx = useContext(CartTotalizerContextInternal);\n  if (ctx === CART_TOTALIZER_UNSET) {\n    throw new Error('useCartTotalizers() must be used inside a <CartTotalizerRoot> subtree.');\n  }\n  return ctx;\n}\n\n// ---------------------------------------------------------------------------\n// Types\n// ---------------------------------------------------------------------------\n\nexport type CartTotalizerRootProps = ComponentPropsWithRef<'div'> & {\n  /**\n   * Cart totalizer slice forwarded by the reactive runtime (`ReactiveDataProvider`) — it is the\n   * value of the `cart` top-level field on `CartTotalizerData on Query`, not the wrapping\n   * `{ cart: … }` shape. Receives `null` when the cart has not yet resolved.\n   */\n  $data?: { totalizers: readonly Totalizer[]; total: Money } | null;\n};\n\nexport type CartTotalizerLineProps = ComponentPropsWithRef<'div'> & {\n  /** Which `cart.totalizers` entry to render, selected by `id` (e.g. \"Items\", \"Shipping\", \"Discounts\"). */\n  totalizerId: string;\n  /** Optional label override; defaults to the totalizer's `name`. */\n  label?: string;\n  /** Styling hook → `data-fs-cart-totalizer-line-variant`. The F9 discounts line uses `'discount'`. */\n  variant?: 'default' | 'discount';\n  /** Text rendered in place of the value when the amount is exactly zero (e.g. \"Free\" for shipping — Decision 5). */\n  zeroLabel?: string;\n};\n\n// ---------------------------------------------------------------------------\n// Definitions\n// ---------------------------------------------------------------------------\n\nexport const CartTotalizerRootDefinition = defineComponent<CartTotalizerRootProps>({\n  name: 'CartTotalizerRoot',\n  importPath: '@vtex/faststore/components',\n  component: CartTotalizerRoot,\n  fragment,\n  fetchStrategy: 'reactive',\n  editor: { label: 'Cart Totalizer Root', category: 'commerce' },\n  schema: {},\n  guideline:\n    'Focused reactive provider for cart totalizers + total (narrower than CartRoot); merges with CartRoot into one cart query when both are present on the page (e.g. CartRoot wrapping the mini-cart drawer, CartTotalizerRoot composing its footer). Use it to compose an order summary — in a mini-cart drawer footer or a checkout summary panel: wrap a CartTotalizerLine totalizerId=\"Items\" (subtotal), a CartTotalizerLine totalizerId=\"Discounts\" variant=\"discount\" (auto-hides at zero), a CartTotalizerLine totalizerId=\"Shipping\" zeroLabel=\"Grátis\", and a CartTotal for the grand total (set CartTotal label for a labeled total row). CartTotal is root-agnostic and reads the total from this root — there is no CartTotalizerTotal.',\n});\n\nexport const CartTotalizerLineDefinition = defineComponent<CartTotalizerLineProps>({\n  name: 'CartTotalizerLine',\n  importPath: '@vtex/faststore/components',\n  component: CartTotalizerLine,\n  editor: { label: 'Cart Totalizer Line', category: 'commerce' },\n  schema: {\n    totalizerId: { type: 'string', label: 'Totalizer Id' },\n    label: { type: 'string', label: 'Label' },\n    variant: { type: ['default', 'discount'] as const, default: 'default', label: 'Variant' },\n    zeroLabel: { type: 'string', label: 'Zero Label' },\n  },\n  guideline:\n    'Renders one cart totalizer row (label + value) selected by totalizerId. The canonical order-summary lines are totalizerId=\"Items\" (the subtotal), totalizerId=\"Discounts\" (the discount), and totalizerId=\"Shipping\" (the shipping cost). For the discounts line set variant=\"discount\" — it hides itself when the value is zero (no active discount). The Core API returns a negative amount for discounts; the formatted value displays as-is (e.g. \"-R$ 40,00\"). Set zeroLabel=\"Grátis\" for the shipping line so a zero amount renders the label instead of R$ 0,00. A line whose totalizerId is absent from the cart renders nothing (no empty row). Must be inside CartTotalizerRoot.',\n});\n\n// ---------------------------------------------------------------------------\n// Implementations\n// ---------------------------------------------------------------------------\n\nexport function CartTotalizerRoot({ $data: $dataProp, className, children, ...props }: CartTotalizerRootProps) {\n  const $data = useDataOverride($dataProp);\n\n  const totalizerValue: CartTotalizerContextValue = useMemo(\n    () => ({ totalizers: $data?.totalizers ?? [] }),\n    [$data?.totalizers],\n  );\n\n  return (\n    <CartTotalValueContext value={$data?.total ?? null}>\n      <CartTotalizerContextInternal value={totalizerValue}>\n        <div {...props} className={className} data-fs-cart-totalizer-root=\"\">\n          {children}\n        </div>\n      </CartTotalizerContextInternal>\n    </CartTotalValueContext>\n  );\n}\n\nexport function CartTotalizerLine({\n  totalizerId,\n  label,\n  variant = 'default',\n  zeroLabel,\n  className,\n  children,\n  ...props\n}: CartTotalizerLineProps) {\n  const { totalizers } = useCartTotalizers();\n  const { locale, currency } = useStorefrontContext();\n  const totalizer = totalizers.find((t) => t.id === totalizerId);\n\n  if (!totalizer) return null;\n\n  if (!isFiniteAmount(totalizer.value.amount)) return null;\n\n  const amount = Number(totalizer.value.amount);\n\n  if (variant === 'discount' && amount === 0) return null;\n\n  const valueContent = amount === 0 && zeroLabel != null ? zeroLabel : formatPrice(amount, locale, currency);\n\n  return (\n    <div {...props} className={className} data-fs-cart-totalizer-line=\"\" data-fs-cart-totalizer-line-variant={variant}>\n      <span>{label ?? totalizer.name}</span>\n      <span>{children ?? valueContent}</span>\n    </div>\n  );\n}\n\n// ---------------------------------------------------------------------------\n// CartDiscountLine — itemized discount breakdown (F11)\n// ---------------------------------------------------------------------------\n\n// Owns its own `Cart.discounts` slice (ADR-0011 data ownership): the field is fetched only when this\n// leaf is placed and merges with any CartTotalizerRoot / CartRoot cart selection into one query. The\n// entries are the itemized companion to the aggregate \"Discounts\" totalizer and sum to it, so a store\n// composes this OR CartTotalizerLine totalizerId=\"Discounts\", never both.\nconst cartDiscountLinesFragment = graphql(`\n  fragment CartDiscountLinesData on Query {\n    cart {\n      __typename\n      id\n      discounts {\n        name\n        value {\n          ...MoneyFragment\n        }\n        kind\n      }\n    }\n  }\n`);\n\nexport type CartDiscountKind = 'PROMOTION' | 'COUPON' | 'OTHER';\n\n/**\n * One cart-level discount line from `Cart.discounts`. `value` is the absolute amount discounted\n * (a positive `Money`); the negative sign is applied on render by the locale's currency format.\n * `amount` is typed `number` but is a string at runtime, so it is `Number()`-coerced before formatting.\n * `name` is null for the OTHER residual and for an unnamed promotion — the `otherLabel` prop names those.\n */\nexport type CartDiscountEntry = {\n  name: string | null;\n  value: { amount: number; currencyCode: string };\n  kind: CartDiscountKind;\n};\n\n/** Cart slice forwarded by the reactive runtime — the value of the top-level `cart` field. */\ntype CartDiscountLinesSlice = { discounts: CartDiscountEntry[] };\n\nexport type CartDiscountLineProps = ComponentPropsWithRef<'div'> & {\n  /** Label for lines the API cannot name: the OTHER residual and an unnamed featured promotion. */\n  otherLabel?: string;\n  /** Cart discount slice forwarded by the reactive runtime; injected/overridden by the runtime or in tests. */\n  $data?: CartDiscountLinesSlice | null;\n};\n\nexport const CartDiscountLineDefinition = defineComponent<CartDiscountLineProps>({\n  name: 'CartDiscountLine',\n  importPath: '@vtex/faststore/components',\n  component: CartDiscountLine,\n  fragment: cartDiscountLinesFragment,\n  fetchStrategy: 'reactive',\n  editor: { label: 'Cart Discount Line', category: 'commerce' },\n  schema: {\n    otherLabel: { type: 'string', default: 'Other discounts', label: 'Unnamed discount label' },\n  },\n  guideline:\n    'Itemized order-summary discounts: renders one line per entry in cart.discounts (one per promotion ' +\n    'and per coupon, plus a residual \"other\" line), each as label + negative amount. Renders nothing ' +\n    'when the cart has no discounts. This is the itemized alternative to CartTotalizerLine ' +\n    'totalizerId=\"Discounts\": the entries sum to that same aggregate, so compose this OR that line, ' +\n    'never both (both would double-count the same money). Place it in the order summary, typically ' +\n    'inside CartTotalizerRoot. Set otherLabel for the residual and any unnamed promotion. See cart-totalizer.md.',\n});\n\nexport function CartDiscountLine({\n  otherLabel = 'Other discounts',\n  className,\n  $data: $dataProp,\n  ...props\n}: CartDiscountLineProps) {\n  const slice = useDataOverride<CartDiscountLinesSlice | null | undefined>($dataProp);\n  const { locale, currency } = useStorefrontContext();\n  const discounts = slice?.discounts;\n\n  if (!discounts || discounts.length === 0) {\n    return null;\n  }\n\n  return (\n    <div {...props} className={className} data-fs-cart-discount-lines=\"\">\n      {discounts.map((discount, index) => {\n        const amount = Number(discount.value.amount);\n        const label = discount.name ?? otherLabel;\n\n        return (\n          <div\n            key={`${discount.kind}-${discount.name}-${index}`}\n            data-fs-cart-discount-line=\"\"\n            data-fs-cart-discount-line-kind={discount.kind.toLowerCase()}\n            data-fs-text=\"\"\n          >\n            <span data-fs-cart-discount-line-label=\"\">{label}</span>\n            {/* Negate the positive magnitude and let the currency format sign it — no hardcoded glyph. */}\n            <span data-fs-cart-discount-line-value=\"\">{formatPrice(-amount, locale, currency)}</span>\n          </div>\n        );\n      })}\n    </div>\n  );\n}\n\n// ---------------------------------------------------------------------------\n// CartMarkdownLine — aggregate item-level catalog markdown (F11 scenario 1)\n// ---------------------------------------------------------------------------\n\n// Renders Cart.itemMarkdownTotal — Σ(listPrice − price) × qty across non-gift lines, computed\n// server-side — as one negative summary line, self-hiding when zero. This is the catalog \"de/por\"\n// markdown that sits ABOVE the Items subtotal, so it is DISTINCT money from the cart-level promotions\n// on the Discounts totalizer / CartDiscountLine (price − sellingPrice): the two coexist in a summary,\n// they do not substitute. Owns its own slice (ADR-0011): the field is fetched only when this leaf is\n// placed and merges with any CartTotalizerRoot / CartRoot cart selection into one query.\nconst cartMarkdownFragment = graphql(`\n  fragment CartMarkdownData on Query {\n    cart {\n      __typename\n      id\n      itemMarkdownTotal {\n        ...MoneyFragment\n      }\n    }\n  }\n`);\n\n/** Cart slice forwarded by the reactive runtime — the value of the top-level `cart` field. */\ntype CartMarkdownSlice = { itemMarkdownTotal: { amount: number; currencyCode: string } };\n\nexport type CartMarkdownLineProps = ComponentPropsWithRef<'div'> & {\n  /** Row label for the aggregate item-level markdown. Interim operational default until the i18n catalog lands. */\n  label?: string;\n  /** Cart markdown slice forwarded by the reactive runtime; injected/overridden by the runtime or in tests. */\n  $data?: CartMarkdownSlice | null;\n};\n\nexport const CartMarkdownLineDefinition = defineComponent<CartMarkdownLineProps>({\n  name: 'CartMarkdownLine',\n  importPath: '@vtex/faststore/components',\n  component: CartMarkdownLine,\n  fragment: cartMarkdownFragment,\n  fetchStrategy: 'reactive',\n  editor: { label: 'Cart Markdown Line', category: 'commerce' },\n  schema: {\n    label: { type: 'string', default: 'Item discounts', label: 'Markdown label' },\n  },\n  guideline:\n    'Aggregate item-level catalog markdown: renders Cart.itemMarkdownTotal (the sum of listPrice − price ' +\n    'across the cart, the \"de/por\" catalog savings) as a single negative line. Renders nothing when the ' +\n    'cart has no markdown. This is DISTINCT money from CartDiscountLine and CartTotalizerLine ' +\n    'totalizerId=\"Discounts\" (those are cart-level promotions/coupons, price − sellingPrice) — it may be ' +\n    'shown ALONGSIDE them, not instead of them, and does not double-count. Place it in the order summary, ' +\n    'typically inside CartTotalizerRoot. Set label to word the row. See cart-totalizer.md.',\n});\n\nexport function CartMarkdownLine({\n  label = 'Item discounts',\n  className,\n  $data: $dataProp,\n  ...props\n}: CartMarkdownLineProps) {\n  const slice = useDataOverride<CartMarkdownSlice | null | undefined>($dataProp);\n  const { locale, currency } = useStorefrontContext();\n  // `amount` is a string at runtime; coerce before checking/formatting. A zero markdown self-hides.\n  const amount = Number(slice?.itemMarkdownTotal?.amount ?? 0);\n\n  if (!amount) {\n    return null;\n  }\n\n  return (\n    <div {...props} className={className} data-fs-cart-markdown-line=\"\" data-fs-text=\"\">\n      <span data-fs-cart-markdown-line-label=\"\">{label}</span>\n      {/* Negate the positive magnitude and let the currency format sign it — no hardcoded glyph. */}\n      <span data-fs-cart-markdown-line-value=\"\">{formatPrice(-amount, locale, currency)}</span>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/matter/client-preferences/client-preferences-fieldset.js

@@ -6,11 +6,11 @@ import { Field, FieldBinding, FieldsetFieldContext, useFieldsetField, useFieldse
 import { useActionsOverride } from "../../sdk/actions/actions-override-context.js";
 import { useDataOverride } from "../../sdk/data/data-override-context.js";
 import { useSession } from "../session/session.js";
+import { useFormRegistry } from "../../particles/form/form.js";
 import { Icon } from "../../particles/icon/icon.js";
 import { useEntityDataResolved } from "../../sdk/data/entity-resolution-context.js";
 import { useReactiveDataSettled } from "../../sdk/data/use-reactive-data-settled.js";
 import { Fieldset } from "../../particles/fieldset/fieldset.js";
-import { useFormRegistry } from "../../particles/form/form.js";
 import { createContext, useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useFormContext } from "react-hook-form";

package/dist/matter/client-profile-form/client-profile-fieldset.js

@@ -5,14 +5,14 @@ import { Field, FieldBinding, FieldsetFieldContext, useFieldsetField, useFieldse
 import { useActionsOverride } from "../../sdk/actions/actions-override-context.js";
 import { useDataOverride } from "../../sdk/data/data-override-context.js";
 import { useSession } from "../session/session.js";
+import { useFormRegistry } from "../../particles/form/form.js";
 import { useEntityDataResolved } from "../../sdk/data/entity-resolution-context.js";
 import { useReactiveDataSettled } from "../../sdk/data/use-reactive-data-settled.js";
 import { Fieldset } from "../../particles/fieldset/fieldset.js";
 import { DOCUMENTS, DocumentField, isSupportedDocumentType } from "../../particles/document-field/document-field.js";
-import { useFormRegistry } from "../../particles/form/form.js";
 import { PhoneField, toE164 } from "../../particles/phone-field/phone-field.js";
 import { createContext, useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { useFormContext } from "react-hook-form";
 //#region src/matter/client-profile-form/client-profile-fieldset.tsx
 /**
@@ -284,7 +284,7 @@ function ClientProfileFieldset({ country = "US", documentType, skeletonCount = C
 		return update(payload);
 	}, []);
 	const toPayload = useCallback((values) => {
-		const { country: activeCountry, getFieldState } = latest.current;
+		const { country: activeCountry, documentType: activeDocumentType, getFieldState } = latest.current;
 		const isDirty = (key) => getFieldState(`clientProfile.${key}`).isDirty;
 		const payload = {};
 		if ("firstName" in values && isDirty("firstName")) payload.firstName = String(values.firstName ?? "").trim();
@@ -293,7 +293,10 @@ function ClientProfileFieldset({ country = "US", documentType, skeletonCount = C
 			const raw = String(values.phone ?? "").trim();
 			payload.phone = raw ? toE164(raw, activeCountry) : "";
 		}
-		if ("document" in values && isDirty("document")) payload.document = String(values.document ?? "").replace(/\D/g, "");
+		if ("document" in values && isDirty("document") && isSupportedDocumentType(activeDocumentType)) {
+			const rawDocument = typeof values.document === "string" ? values.document : "";
+			payload.document = DOCUMENTS[activeDocumentType].sanitize(rawDocument);
+		}
 		return payload;
 	}, []);
 	useEffect(() => registerFieldset({
@@ -382,7 +385,7 @@ function ProfileTextControl({ fieldKey, attr, autoComplete, defaultLabel, label,
 		children: /* @__PURE__ */ jsx(Field.Root, {
 			className,
 			"data-fs-client-profile-fieldset-field": attr,
-			children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
+			children: children ?? /* @__PURE__ */ jsxs(Fragment$1, { children: [
 				/* @__PURE__ */ jsx(Field.Label, {}),
 				/* @__PURE__ */ jsx(Field.Control, {}),
 				/* @__PURE__ */ jsx(Field.Error, {})

package/dist/matter/client-profile-form/client-profile-fieldset.js.map

@@ -1 +1 @@
-{"version":3,"file":"client-profile-fieldset.js","names":[],"sources":["../../../src/matter/client-profile-form/client-profile-fieldset.tsx"],"sourcesContent":["'use client';\n\nimport { defineComponent } from '@vtex/fs-core';\nimport {\n  type ComponentPropsWithRef,\n  createContext,\n  type ReactNode,\n  useCallback,\n  useContext,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { useFormContext } from 'react-hook-form';\nimport type { DocumentType } from '../../particles/document-field/document-field.js';\nimport { DOCUMENTS, DocumentField, isSupportedDocumentType } from '../../particles/document-field/document-field.js';\nimport type { FieldRule } from '../../particles/field/field.js';\nimport {\n  Field,\n  FieldBinding,\n  FieldsetFieldContext,\n  useFieldsetField,\n  useFieldsetFieldNames,\n  useNoAncestorFieldset,\n} from '../../particles/field/field.js';\nimport { Fieldset } from '../../particles/fieldset/fieldset.js';\nimport { useFormRegistry } from '../../particles/form/form.js';\nimport type { PhoneCountry } from '../../particles/phone-field/phone-field.js';\nimport { PhoneField, toE164 } from '../../particles/phone-field/phone-field.js';\nimport { useActionsOverride } from '../../sdk/actions/actions-override-context.js';\nimport type { ComponentActions } from '../../sdk/actions/types.js';\nimport { useDataOverride } from '../../sdk/data/data-override-context.js';\nimport { useEntityDataResolved } from '../../sdk/data/entity-resolution-context.js';\nimport { useReactiveDataSettled } from '../../sdk/data/use-reactive-data-settled.js';\nimport type { ClientProfileUpdateInput } from '../../sdk/identity/operations.js';\nimport { useSession } from '../session/session.js';\n\n/**\n * `ClientProfileFieldset` — the composable, one-Save write of the `ClientProfile` sibling entity\n * (RFC: Composable Entity Forms, `Proposal > Design > The fieldset`). It registers itself with the\n * enclosing `FormRoot` under the `clientProfile` namespace and dispatches\n * `$actions.identity.clientProfileUpdate` for its own submit slot; it renders no `<form>` of its own.\n *\n * The four controls below are the smallest placeable unit: each calls `useFieldsetField` for its full\n * field name, renders a `FieldBinding` carrying the field's static facts, and — inside it — either the\n * default anatomy or the author's own children. No control's field contract carries a blocking\n * `RegisterOptions` key (no `required`, `min`, `max`, `minLength`, `maxLength`, `pattern`); requiredness\n * on the phone control rides on its own `requirement` prop instead, which only ever gates required\n * validation — a field the store does not want is omitted from the page, not switched off by a prop.\n *\n * The fieldset's context name is `client-profile-fieldset`, not `client-profile`: the shipped\n * `ClientProfilePhoneControl` (`matter/client-profile/client-profile.tsx`) already requires\n * `client-profile` and writes on blur, so reusing that name here would let an on-blur control compile\n * inside this batched fieldset and write immediately. `ClientProfileFieldsetPhoneControl` carries the\n * same container prefix as the context it requires, naming the collision rather than hiding it.\n */\n\n// ---------------------------------------------------------------------------\n// GraphQL Fragment — colocated on the fieldset, its own data root\n// ---------------------------------------------------------------------------\n\nconst fragment = /* GraphQL */ `\n  fragment ClientProfileFieldsetData on Query {\n    clientProfile {\n      __typename\n      id\n      firstName\n      lastName\n      phone\n      document\n    }\n  }\n`;\n\n// ---------------------------------------------------------------------------\n// Types\n// ---------------------------------------------------------------------------\n\n/** The `$data` slice forwarded by the reactive runtime — the ClientProfile sibling entity, unwrapped. */\nexport type ClientProfileFieldsetData = {\n  firstName?: string | null;\n  lastName?: string | null;\n  phone?: string | null;\n  document?: string | null;\n} | null;\n\n/** The four keys this fieldset registers under its namespace. */\ntype ProfileFieldKey = 'firstName' | 'lastName' | 'phone' | 'document';\n\n/** What the fieldset publishes to its controls. Carries no live value — react-hook-form owns those. */\ntype ClientProfileFieldsetContextValue = Readonly<{\n  namespace: 'clientProfile';\n  /** Seeds, resolved from `$data`. Empty string, never null, so a control never seeds `undefined`. */\n  saved: Readonly<Record<ProfileFieldKey, string>>;\n  /** True when the session reports `canEditData: false`. */\n  readOnly: boolean;\n  /** Phone mask/validation country, from the fieldset's own prop. */\n  country: PhoneCountry;\n  /** Locale document type; the document control renders only when supported. */\n  documentType: string | undefined;\n  /** The fieldset's own validation rules, per key. Present and empty today (Decision 6). */\n  rules: Readonly<Partial<Record<ProfileFieldKey, FieldRule>>>;\n}>;\n\n/** No control publishes a rule today — a blocking `RegisterOptions` key would reopen the same submit\n * block for a read-only session (Decision 6): `readOnly` disables a control's rendered `<input>` via a\n * plain HTML attribute, never react-hook-form's own `disabled` registration option (`field.tsx`'s\n * `useController` call takes no `disabled`), so a required field would stay fully registered and\n * validated while the shopper has no way to focus or edit it. Kept as a stable empty object so the\n * context value's identity does not churn on every render. */\nconst NO_RULES: Readonly<Partial<Record<ProfileFieldKey, FieldRule>>> = {};\n\n/**\n * Rows `ClientProfileFieldsetSkeleton` draws when nobody says otherwise: one per control in the full\n * anatomy — first name, last name, phone, document. It is a default and not a derivation, because\n * the composed children are opaque here. A page that composes fewer sets `skeletonCount` to what it\n * composed, or the form jumps by the difference when the controls take the skeleton's place.\n */\nconst CLIENT_PROFILE_SKELETON_ROWS = 4;\n\nconst CLIENT_PROFILE_FIELDSET_UNSET = Symbol('ClientProfileFieldsetContextUnset');\n\nconst ClientProfileFieldsetContext = createContext<\n  ClientProfileFieldsetContextValue | typeof CLIENT_PROFILE_FIELDSET_UNSET\n>(CLIENT_PROFILE_FIELDSET_UNSET);\n\nfunction useClientProfileFieldsetContext(): ClientProfileFieldsetContextValue {\n  const ctx = useContext(ClientProfileFieldsetContext);\n  if (ctx === CLIENT_PROFILE_FIELDSET_UNSET) {\n    throw new Error('ClientProfileFieldset controls must be used inside ClientProfileFieldset.');\n  }\n  return ctx;\n}\n\n// ---------------------------------------------------------------------------\n// Props\n// ---------------------------------------------------------------------------\n\nexport type ClientProfileFieldsetProps = {\n  /** Phone mask/validation country, provided to the phone control via context. */\n  country?: PhoneCountry;\n  /** Locale document type; the document control renders only when supported. */\n  documentType?: string;\n  /** Placeholder rows the loading skeleton draws. Set it to the number of controls composed here. */\n  skeletonCount?: number;\n  /** Announced politely while the profile resolves. Blank means no announcement. */\n  loadingLabel?: string;\n  /** Announced politely once the controls mount. Blank means no announcement. */\n  loadedLabel?: string;\n  /** Accessible name of the `<fieldset>` group. Blank means no name is exposed. */\n  groupLabel?: string;\n  className?: string;\n  children?: ReactNode;\n  /** `ClientProfileFieldsetData` slice forwarded by the reactive runtime. */\n  $data?: ClientProfileFieldsetData;\n  /** Compiler-injected; carries `identity.clientProfileUpdate`. */\n  $actions?: ComponentActions;\n};\n\ntype ProfileTextControlProps = { label?: string; placeholder?: string; className?: string; children?: ReactNode };\n\nexport type ClientProfileFirstNameControlProps = ProfileTextControlProps;\nexport type ClientProfileLastNameControlProps = ProfileTextControlProps;\n\nexport type ClientProfileFieldsetPhoneControlProps = {\n  label?: string;\n  placeholder?: string;\n  /**\n   * Raises the field to required. The composite owns it; the contract carries no rule (Decision 6),\n   * so here the raise is the whole of the resolution. Unset is no opinion, which leaves the phone\n   * optional.\n   */\n  requirement?: 'mandatory' | 'optional';\n  errorInvalid?: string;\n  errorRequired?: string;\n  className?: string;\n  /** Given, replaces PhoneField's default Field.Label + PhoneFieldInput + Field.Error anatomy. */\n  children?: ReactNode;\n};\n\nexport type ClientProfileDocumentControlProps = {\n  label?: string;\n  placeholder?: string;\n  errorMessage?: string;\n  className?: string;\n  /** Given, replaces DocumentField's default Field.Label + DocumentFieldInput + Field.Error anatomy. */\n  children?: ReactNode;\n};\n\n// ---------------------------------------------------------------------------\n// Definitions\n// ---------------------------------------------------------------------------\n\nexport const ClientProfileFieldsetDefinition = defineComponent<ClientProfileFieldsetProps>({\n  name: 'ClientProfileFieldset',\n  importPath: '@vtex/faststore/components',\n  component: ClientProfileFieldset,\n  fragment,\n  fetchStrategy: 'reactive',\n  skeleton: ClientProfileFieldsetSkeleton,\n  requiresContext: ['form', 'session'],\n  providesContext: 'client-profile-fieldset',\n  actions: { identity: ['clientProfileUpdate'] },\n  editor: { label: 'Client Profile Fieldset', category: 'identity' },\n  schema: {\n    country: { type: 'string', default: 'US', label: 'Phone country (US or BR)' },\n    documentType: { type: 'string', label: 'Document type (e.g. CPF)' },\n    skeletonCount: { type: 'number', default: 4, label: 'Skeleton rows' },\n    loadingLabel: { type: 'string', default: 'Loading your details', label: 'Loading announcement' },\n    loadedLabel: { type: 'string', default: 'Your details are ready', label: 'Loaded announcement' },\n    groupLabel: { type: 'string', default: 'Your details', label: 'Accessible group name' },\n  },\n  guideline:\n    'Registers a batched write of the ClientProfile entity with the enclosing FormRoot; renders one Fieldset.Root and no <form>. Must be inside a FormRoot with a SessionRoot ancestor. Compose ClientProfileFirstNameControl / ClientProfileLastNameControl / ClientProfileFieldsetPhoneControl / ClientProfileDocumentControl as children, in any order. The controls mount only once the profile has resolved, with skeletonCount placeholder rows in their place until then — set it to the number of controls composed, or the form jumps by the difference. Style the announcement sr-only. Dispatches only the fields the shopper changed. groupLabel names the group as its accessible name; blank emits no aria-label, and a composed FieldsetLegend wins over it.',\n});\n\nexport const ClientProfileFirstNameControlDefinition = defineComponent<ClientProfileFirstNameControlProps>({\n  name: 'ClientProfileFirstNameControl',\n  importPath: '@vtex/faststore/components',\n  component: ClientProfileFirstNameControl,\n  requiresContext: 'client-profile-fieldset',\n  providesContext: 'field',\n  editor: { label: 'Client Profile First Name Control', category: 'identity' },\n  schema: {\n    // No default (Decision 1): absence means the platform's value, applied at render time by\n    // the control itself, not baked into the schema.\n    label: { type: 'string', label: 'Label' },\n    placeholder: { type: 'string', label: 'Placeholder' },\n  },\n  guideline:\n    \"The bound first-name control; must be a descendant of ClientProfileFieldset. Renders Field.Root > Field.Label + Field.Control + Field.Error by default, or the composed children in the author's own order.\",\n});\n\nexport const ClientProfileLastNameControlDefinition = defineComponent<ClientProfileLastNameControlProps>({\n  name: 'ClientProfileLastNameControl',\n  importPath: '@vtex/faststore/components',\n  component: ClientProfileLastNameControl,\n  requiresContext: 'client-profile-fieldset',\n  providesContext: 'field',\n  editor: { label: 'Client Profile Last Name Control', category: 'identity' },\n  schema: {\n    // No default (Decision 1): absence means the platform's value, applied at render time by\n    // the control itself, not baked into the schema.\n    label: { type: 'string', label: 'Label' },\n    placeholder: { type: 'string', label: 'Placeholder' },\n  },\n  guideline:\n    \"The bound last-name control; must be a descendant of ClientProfileFieldset. Renders Field.Root > Field.Label + Field.Control + Field.Error by default, or the composed children in the author's own order.\",\n});\n\nexport const ClientProfileFieldsetPhoneControlDefinition = defineComponent<ClientProfileFieldsetPhoneControlProps>({\n  name: 'ClientProfileFieldsetPhoneControl',\n  importPath: '@vtex/faststore/components',\n  component: ClientProfileFieldsetPhoneControl,\n  requiresContext: 'client-profile-fieldset',\n  // Provides both names (mirrors shipping-address.tsx:595's Decision 7): 'field' is what every\n  // fieldset Control declares (RFC:503), but this control also composes PhoneField, whose\n  // PhoneFieldInput part requires 'phone-field' — a page composing\n  // ClientProfileFieldsetPhoneControl > PhoneFieldInput would otherwise fail the build with a\n  // context-constraint violation, since PhoneField itself (the only 'phone-field' provider) never\n  // appears in the page schema (finding F1).\n  providesContext: ['field', 'phone-field'],\n  editor: { label: 'Client Profile Fieldset Phone Control', category: 'identity' },\n  schema: {\n    // No default (Decision 1): absence means the platform's value, applied at render time by\n    // the control itself, not baked into the schema.\n    label: { type: 'string', label: 'Label' },\n    placeholder: { type: 'string', label: 'Placeholder' },\n    // No default: an unset requirement is no opinion, not a raise to mandatory.\n    requirement: { type: ['mandatory', 'optional'] as const, label: 'Requirement' },\n    // No default (Decision 1): absence means the platform's value, applied at render time by\n    // the control itself, not baked into the schema.\n    errorInvalid: { type: 'string', label: 'Invalid error message' },\n    errorRequired: { type: 'string', label: 'Required error message' },\n  },\n  guideline:\n    \"The bound phone control; must be a descendant of ClientProfileFieldset. Distinct from ClientProfilePhoneControl (matter/client-profile), which writes on blur and requires the client-profile context — the two cannot compile into each other's container. Composes the PhoneField particle: recomposable (RFC:503) — given children, they replace PhoneField's default Field.Label + PhoneFieldInput + Field.Error anatomy, in any order; childless keeps today's order. Its className styles PhoneField's own root, the node that lays out label, input and error — not the wrapper, which carries only the data-fs-client-profile-fieldset-field=\\\"phone\\\" styling hook. A store that does not want a phone field omits this element from the page: requirement only governs required validation, never visibility.\",\n});\n\nexport const ClientProfileDocumentControlDefinition = defineComponent<ClientProfileDocumentControlProps>({\n  name: 'ClientProfileDocumentControl',\n  importPath: '@vtex/faststore/components',\n  component: ClientProfileDocumentControl,\n  requiresContext: 'client-profile-fieldset',\n  // Provides both names, same reasoning as ClientProfileFieldsetPhoneControlDefinition above: this\n  // control composes DocumentField, whose DocumentFieldInput part requires 'document-field' — a page\n  // composing ClientProfileDocumentControl > DocumentFieldInput would otherwise fail the build\n  // (finding F1).\n  providesContext: ['field', 'document-field'],\n  editor: { label: 'Client Profile Document Control', category: 'identity' },\n  schema: {\n    // No default (Decision 1): absence means the platform's value, applied at render time by\n    // the control itself, not baked into the schema.\n    label: { type: 'string', label: 'Label' },\n    placeholder: { type: 'string', label: 'Placeholder' },\n    errorMessage: { type: 'string', label: 'Error message' },\n  },\n  guideline:\n    \"The bound tax-document control; must be a descendant of ClientProfileFieldset. Renders nothing, and registers no field name, when the fieldset's documentType is unsupported. Composes the DocumentField particle: recomposable (RFC:503) — given children, they replace DocumentField's default Field.Label + DocumentFieldInput + Field.Error anatomy, in any order; childless keeps today's order.\",\n});\n\n// ---------------------------------------------------------------------------\n// Fieldset root\n// ---------------------------------------------------------------------------\n\n/**\n * Registers a batched write of the `ClientProfile` entity with the enclosing `FormRoot`\n * (`registerFieldset`, namespace `clientProfile`) on mount, unconditionally — so this fieldset keeps its\n * original dispatch slot even while its own query is still resolving. Its children — the seed values and\n * the field-name registry its controls need — render only once the entity has resolved; until then the\n * `Fieldset.Root` carries `-pending` and renders `ClientProfileFieldsetSkeleton` (Decision 5).\n * `dispatch` and `toPayload` are `useCallback([])`-stable and read `$actions`/`country`/`documentType`\n * through a ref, so the registration effect runs exactly once per mount regardless of how often the\n * parent re-renders.\n *\n * \"Resolved\" is two conditions, because `$data` alone cannot answer it. Under the reactive runtime the\n * slice is defined from the first render — `useReactiveEntity` hands down `fallbackData` while the cache\n * read is incomplete — so an empty server answer looks exactly like a resolved one, and the controls\n * would mount and seed `''` before the shopper's real profile arrives. `useSeedAdoption` re-seeds a\n * clean field with `defaultValue` on every render, but once the field turns dirty no later seed\n * ever reaches it again: a shopper who starts typing before the real profile arrives locks that\n * empty seed in for good, and even a shopper who does not type sees the field flash from `''` to\n * the real data. `useReactiveDataSettled` supplies the missing half: the page query's own\n * in-flight state, latched so it only ever goes pending → settled. The `$data === undefined` half still\n * carries trees with no reactive root above them, where the slice arrives as a plain prop.\n *\n * Both ends of that wait are spoken: the fieldset carries `aria-busy` while it lasts and holds a polite\n * live region that announces `loadingLabel` and then `loadedLabel`. Style the region `sr-only` — it is\n * text meant for a screen reader, not for the page.\n */\nexport function ClientProfileFieldset({\n  country = 'US',\n  documentType,\n  skeletonCount = CLIENT_PROFILE_SKELETON_ROWS,\n  loadingLabel = 'Loading your details',\n  loadedLabel = 'Your details are ready',\n  groupLabel = 'Your details',\n  className,\n  children,\n  $data: $dataProp,\n  $actions: $actionsProp,\n}: ClientProfileFieldsetProps) {\n  // Nesting fieldsets has no legitimate use: useFieldsetField resolves the *nearest*\n  // FieldsetFieldContext, not the one owning a control's actual namespace, so a control nested two\n  // fieldsets deep would silently register under the wrong one and its write would be discarded on\n  // submit. Runtime registry integrity, mirroring the namespace-collision throw FormRoot already ships\n  // (form.tsx:280-288).\n  useNoAncestorFieldset('ClientProfileFieldset');\n\n  const $data = useDataOverride($dataProp);\n\n  const $actions = useActionsOverride($actionsProp);\n  // Three conditions, not two. `useReactiveDataSettled` latches one way and never re-arms, so on its\n  // own it answers \"has this page ever resolved\", not \"is what I am holding right now the server's\n  // answer\" — after the page query's entity ref moves to one this cache never stored, or its root is\n  // skipped for want of a variable, the slice silently regresses to `fallbackData` while the latch\n  // still reads settled. `useEntityDataResolved` is the per-entity half: unlatched, so it follows the\n  // slice back down and returns this fieldset to its skeleton instead of leaving live controls seeded\n  // from a placeholder.\n  const settled = useReactiveDataSettled();\n  const sliceResolved = useEntityDataResolved();\n  const resolved = settled && sliceResolved && $data !== undefined;\n  // Also enforces the SessionRoot ancestor: useSession() throws when rendered outside one.\n  const { canEditData } = useSession();\n  const readOnly = !canEditData;\n\n  // Runs before useFormContext() below: useFormRegistry() throws the friendly \"Form parts must be used\n  // inside FormRoot.\" error when no FormRoot is above, so a FormRoot-less render fails there rather than\n  // reaching the getFieldState destructure, which throws an unhelpful TypeError instead (useFormContext()\n  // resolves to null outside a FormRoot, and destructuring null throws).\n  const { registerFieldset } = useFormRegistry();\n\n  // Decision 3, as later narrowed: this fieldset still reads dirtiness imperatively, but the rule is no\n  // longer the form's. `FormRoot` subscribes `dirtyFields` in render and decides which fieldsets to\n  // dispatch from it, by the fields each one has mounted, on react-hook-form's documented contract.\n  //\n  // The imperative read survives here because it asks a different question in a different place: which\n  // of *this* fieldset's own fields changed, resolved inside `toPayload` at submit time, by full\n  // registered field name — the shape `getFieldState` documents. `useFormContext()` adds no\n  // `formState` subscription of its own; one is created only when a caller reads a formState key off\n  // the `useForm`/`useFormState` proxy (or hands that already-subscribed object to `getFieldState`'s\n  // second argument). Calling `getFieldState(name)` with no second argument reads the current internal\n  // state directly, so this fieldset root still does not re-render on a keystroke.\n  const { getFieldState } = useFormContext();\n\n  const latest = useRef({ $actions, country, documentType, readOnly, getFieldState });\n  useEffect(() => {\n    latest.current = { $actions, country, documentType, readOnly, getFieldState };\n  }, [$actions, country, documentType, readOnly, getFieldState]);\n\n  const { registry: fieldsetRegistry, getFieldNames } = useFieldsetFieldNames('clientProfile');\n\n  const dispatch = useCallback(async (payload: Record<string, unknown>) => {\n    // Defence-in-depth: the UI disables every input while read-only, but `FormClear` sets values (and\n    // marks them dirty) on every registered field regardless of that disabled attribute — react-hook-\n    // form's own `useController` calls never receive a `disabled` registration option, so it has no\n    // notion of \"disabled\" of its own. Guarding here keeps the write from reaching the network even if\n    // some other composition dirties this fieldset while canEditData is false (the server also refuses,\n    // but a client-side guard should not depend on that).\n    if (latest.current.readOnly) {\n      throw new Error('ClientProfileFieldset cannot dispatch while the session is read-only.');\n    }\n    const update = latest.current.$actions?.identity?.clientProfileUpdate;\n    // Throwing is the contract's failure path: FormRoot catches it and records this fieldset's failure\n    // (form.tsx:264-266). Returning [] would report an unqualified success for a write that never\n    // happened.\n    if (!update) throw new Error('ClientProfileFieldset requires $actions.identity.clientProfileUpdate.');\n    return update(payload as ClientProfileUpdateInput);\n  }, []);\n\n  const toPayload = useCallback((values: Record<string, unknown>): Record<string, unknown> => {\n    const { country: activeCountry, getFieldState } = latest.current;\n    // FR-5: a key is emitted only when the shopper actually changed it — presence in `values` alone\n    // (every registered field is always present) is not enough. `dirtyFields` is not read directly;\n    // `getFieldState` is called with no second argument, which reads react-hook-form's current\n    // internal state without subscribing to it (Decision 3).\n    const isDirty = (key: ProfileFieldKey) => getFieldState(`clientProfile.${key}`).isDirty;\n    const payload: Record<string, string> = {};\n    if ('firstName' in values && isDirty('firstName')) payload.firstName = String(values.firstName ?? '').trim();\n    if ('lastName' in values && isDirty('lastName')) payload.lastName = String(values.lastName ?? '').trim();\n    if ('phone' in values && isDirty('phone')) {\n      const raw = String(values.phone ?? '').trim();\n      // toE164 on a blank value returns the bare country code, which would write \"+55\" over the\n      // shopper's number and fail every later save.\n      payload.phone = raw ? toE164(raw, activeCountry) : '';\n    }\n    if ('document' in values && isDirty('document')) {\n      payload.document = String(values.document ?? '').replace(/\\D/g, '');\n    }\n    return payload;\n  }, []);\n\n  useEffect(\n    () =>\n      registerFieldset({\n        namespace: 'clientProfile',\n        getFieldNames,\n        dispatch,\n        toPayload,\n        // Decision 1: the register is a machine identifier, the kebab-case ASCII rendering of this\n        // registration's own `namespace` (`clientProfile` → `client-profile`) — not authored per\n        // page (Decision 2).\n        label: 'client-profile',\n      }),\n    [registerFieldset, getFieldNames, dispatch, toPayload],\n  );\n\n  const saved = useMemo<Readonly<Record<ProfileFieldKey, string>>>(\n    () => ({\n      firstName: $data?.firstName ?? '',\n      lastName: $data?.lastName ?? '',\n      phone: $data?.phone ?? '',\n      document: $data?.document ?? '',\n    }),\n    [$data],\n  );\n\n  const contextValue = useMemo<ClientProfileFieldsetContextValue>(\n    () => ({ namespace: 'clientProfile', saved, readOnly, country, documentType, rules: NO_RULES }),\n    [saved, readOnly, country, documentType],\n  );\n\n  // Assistive technology only reports a change inside a region that was already in the tree, so a\n  // region mounted together with its text announces nothing. The region therefore sits in both\n  // branches and starts empty, with the wait written on the pass after mount and replaced — not\n  // cleared — once the controls are up: the skeleton is `aria-hidden`, so without this second\n  // message the form would materialise in silence (WCAG 2.1 SC 4.1.3).\n  const [announcement, setAnnouncement] = useState('');\n  const announced = resolved ? loadedLabel : loadingLabel;\n  useEffect(() => {\n    setAnnouncement(announced);\n  }, [announced]);\n\n  return (\n    <Fieldset.Root\n      className={className}\n      disabled={readOnly}\n      aria-busy={resolved ? undefined : true}\n      // FR-12: blank (or whitespace-only) means no name is exposed, mirroring the loadingLabel/\n      // loadedLabel convention. On the root itself (FR-13), so it is identical whether the fieldset\n      // is pending or resolved; a page-composed FieldsetLegend still wins via aria-labelledby.\n      {...(groupLabel?.trim() ? { 'aria-label': groupLabel } : {})}\n      data-fs-client-profile-fieldset=\"\"\n      {...(resolved ? {} : { 'data-fs-client-profile-fieldset-pending': '' })}\n      {...(readOnly ? { 'data-fs-client-profile-fieldset-readonly': '' } : {})}\n    >\n      {resolved ? (\n        <FieldsetFieldContext.Provider value={fieldsetRegistry}>\n          <ClientProfileFieldsetContext.Provider value={contextValue}>{children}</ClientProfileFieldsetContext.Provider>\n        </FieldsetFieldContext.Provider>\n      ) : (\n        <ClientProfileFieldsetSkeleton count={skeletonCount} />\n      )}\n      <output aria-live=\"polite\" data-fs-client-profile-fieldset-announcement=\"\">\n        {announcement}\n      </output>\n    </Fieldset.Root>\n  );\n}\n\n/**\n * The loading state of the fieldset, rendered in place of the controls until the entity resolves and\n * declared as the definition's `skeleton`. Purely visual: the wait is spoken by the fieldset's own live\n * region, so this is hidden from assistive technology rather than announced twice.\n */\nexport function ClientProfileFieldsetSkeleton({\n  count = CLIENT_PROFILE_SKELETON_ROWS,\n  className,\n  ...props\n}: ComponentPropsWithRef<'div'> & { count?: number }) {\n  return (\n    <div {...props} className={className} data-fs-client-profile-fieldset-skeleton=\"\" aria-hidden=\"true\">\n      {Array.from({ length: count }, (_, i) => (\n        <span key={i} data-fs-client-profile-fieldset-skeleton-field=\"\" />\n      ))}\n    </div>\n  );\n}\n\nClientProfileFieldset.Skeleton = ClientProfileFieldsetSkeleton;\n\n// ---------------------------------------------------------------------------\n// Text controls — first name, last name\n// ---------------------------------------------------------------------------\n\nfunction ProfileTextControl({\n  fieldKey,\n  attr,\n  autoComplete,\n  defaultLabel,\n  label,\n  placeholder,\n  className,\n  children,\n}: {\n  fieldKey: 'firstName' | 'lastName';\n  attr: string;\n  autoComplete: string;\n  defaultLabel: string;\n  label?: string;\n  placeholder?: string;\n  className?: string;\n  children?: ReactNode;\n}) {\n  const { namespace, saved, readOnly, rules } = useClientProfileFieldsetContext();\n  const name = useFieldsetField(namespace, fieldKey);\n\n  return (\n    <FieldBinding\n      name={name}\n      label={label ?? defaultLabel}\n      placeholder={placeholder}\n      defaultValue={saved[fieldKey]}\n      rule={rules[fieldKey]}\n      disabled={readOnly}\n      autoComplete={autoComplete}\n    >\n      <Field.Root className={className} data-fs-client-profile-fieldset-field={attr}>\n        {children ?? (\n          <>\n            <Field.Label />\n            <Field.Control />\n            <Field.Error />\n          </>\n        )}\n      </Field.Root>\n    </FieldBinding>\n  );\n}\n\nexport function ClientProfileFirstNameControl({\n  label,\n  placeholder,\n  className,\n  children,\n}: ClientProfileFirstNameControlProps) {\n  return (\n    <ProfileTextControl\n      fieldKey=\"firstName\"\n      attr=\"first-name\"\n      autoComplete=\"given-name\"\n      defaultLabel=\"First name\"\n      label={label}\n      placeholder={placeholder}\n      className={className}\n    >\n      {children}\n    </ProfileTextControl>\n  );\n}\n\nexport function ClientProfileLastNameControl({\n  label,\n  placeholder,\n  className,\n  children,\n}: ClientProfileLastNameControlProps) {\n  return (\n    <ProfileTextControl\n      fieldKey=\"lastName\"\n      attr=\"last-name\"\n      autoComplete=\"family-name\"\n      defaultLabel=\"Last name\"\n      label={label}\n      placeholder={placeholder}\n      className={className}\n    >\n      {children}\n    </ProfileTextControl>\n  );\n}\n\n// ---------------------------------------------------------------------------\n// Phone control — the fieldset-bound counterpart of ClientProfilePhoneControl\n// ---------------------------------------------------------------------------\n\n/**\n * Composes `PhoneField` inside a `FieldBinding`, wrapped in a `data-fs-client-profile-fieldset-field=\"phone\"`\n * node — the same styling hook attribute the text controls carry on their own `Field.Root`.\n * `useFieldsetField` runs unconditionally, before `requirement` is even read — there is no suppressed\n * state for this control to second-guess; `requirement` only ever raises the field to required,\n * and left unset it raises nothing.\n */\nexport function ClientProfileFieldsetPhoneControl({\n  label,\n  placeholder,\n  requirement,\n  errorInvalid,\n  errorRequired,\n  className,\n  children,\n}: ClientProfileFieldsetPhoneControlProps) {\n  const { namespace, saved, readOnly, rules, country } = useClientProfileFieldsetContext();\n  const name = useFieldsetField(namespace, 'phone');\n\n  const binding = (\n    <FieldBinding\n      name={name}\n      label={label}\n      placeholder={placeholder}\n      defaultValue={saved.phone}\n      rule={rules.phone}\n      disabled={readOnly}\n    >\n      <PhoneField\n        country={country}\n        requirement={requirement}\n        errorInvalid={errorInvalid}\n        errorRequired={errorRequired}\n        className={className}\n      >\n        {children}\n      </PhoneField>\n    </FieldBinding>\n  );\n\n  // The wrapper carries no className of its own (Decision 1): className lands on PhoneField's own\n  // Field.Root, the node that actually stacks label, input and error, so it needs no flex slot here.\n  return <div data-fs-client-profile-fieldset-field=\"phone\">{binding}</div>;\n}\n\n// ---------------------------------------------------------------------------\n// Document control — self-gates on documentType, through an inner component\n// ---------------------------------------------------------------------------\n\ntype ClientProfileDocumentControlInnerProps = ClientProfileDocumentControlProps & { documentType: DocumentType };\n\n/**\n * `useFieldsetField` (through `useClientProfileFieldsetContext`'s namespace) lives only in this inner\n * component, mounted only once `ClientProfileDocumentControl` has already decided the document type is\n * supported. Splitting the decision from the registration this way (Decision 8) keeps a control that\n * renders nothing from registering a field name `FormClear` would otherwise dirty and dispatch.\n */\nfunction ClientProfileDocumentControlInner({\n  documentType,\n  label,\n  placeholder,\n  errorMessage,\n  className,\n  children,\n}: ClientProfileDocumentControlInnerProps) {\n  const { namespace, saved, readOnly, rules } = useClientProfileFieldsetContext();\n  const name = useFieldsetField(namespace, 'document');\n\n  return (\n    <FieldBinding\n      name={name}\n      label={label ?? DOCUMENTS[documentType].name}\n      placeholder={placeholder}\n      defaultValue={saved.document}\n      rule={rules.document}\n      disabled={readOnly}\n    >\n      <DocumentField\n        documentType={documentType}\n        errorMessage={errorMessage}\n        className={className}\n        data-fs-client-profile-fieldset-field=\"document\"\n      >\n        {children}\n      </DocumentField>\n    </FieldBinding>\n  );\n}\n\nexport function ClientProfileDocumentControl({\n  label,\n  placeholder,\n  errorMessage,\n  className,\n  children,\n}: ClientProfileDocumentControlProps) {\n  const { documentType } = useClientProfileFieldsetContext();\n  if (!isSupportedDocumentType(documentType)) return null;\n\n  return (\n    <ClientProfileDocumentControlInner\n      documentType={documentType}\n      label={label}\n      placeholder={placeholder}\n      errorMessage={errorMessage}\n      className={className}\n    >\n      {children}\n    </ClientProfileDocumentControlInner>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"client-profile-fieldset.js","names":[],"sources":["../../../src/matter/client-profile-form/client-profile-fieldset.tsx"],"sourcesContent":["'use client';\n\nimport { defineComponent } from '@vtex/fs-core';\nimport {\n  type ComponentPropsWithRef,\n  createContext,\n  type ReactNode,\n  useCallback,\n  useContext,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { useFormContext } from 'react-hook-form';\nimport type { DocumentType } from '../../particles/document-field/document-field.js';\nimport { DOCUMENTS, DocumentField, isSupportedDocumentType } from '../../particles/document-field/document-field.js';\nimport type { FieldRule } from '../../particles/field/field.js';\nimport {\n  Field,\n  FieldBinding,\n  FieldsetFieldContext,\n  useFieldsetField,\n  useFieldsetFieldNames,\n  useNoAncestorFieldset,\n} from '../../particles/field/field.js';\nimport { Fieldset } from '../../particles/fieldset/fieldset.js';\nimport { useFormRegistry } from '../../particles/form/form.js';\nimport type { PhoneCountry } from '../../particles/phone-field/phone-field.js';\nimport { PhoneField, toE164 } from '../../particles/phone-field/phone-field.js';\nimport { useActionsOverride } from '../../sdk/actions/actions-override-context.js';\nimport type { ComponentActions } from '../../sdk/actions/types.js';\nimport { useDataOverride } from '../../sdk/data/data-override-context.js';\nimport { useEntityDataResolved } from '../../sdk/data/entity-resolution-context.js';\nimport { useReactiveDataSettled } from '../../sdk/data/use-reactive-data-settled.js';\nimport type { ClientProfileUpdateInput } from '../../sdk/identity/operations.js';\nimport { useSession } from '../session/session.js';\n\n/**\n * `ClientProfileFieldset` — the composable, one-Save write of the `ClientProfile` sibling entity\n * (RFC: Composable Entity Forms, `Proposal > Design > The fieldset`). It registers itself with the\n * enclosing `FormRoot` under the `clientProfile` namespace and dispatches\n * `$actions.identity.clientProfileUpdate` for its own submit slot; it renders no `<form>` of its own.\n *\n * The four controls below are the smallest placeable unit: each calls `useFieldsetField` for its full\n * field name, renders a `FieldBinding` carrying the field's static facts, and — inside it — either the\n * default anatomy or the author's own children. No control's field contract carries a blocking\n * `RegisterOptions` key (no `required`, `min`, `max`, `minLength`, `maxLength`, `pattern`); requiredness\n * on the phone control rides on its own `requirement` prop instead, which only ever gates required\n * validation — a field the store does not want is omitted from the page, not switched off by a prop.\n *\n * The fieldset's context name is `client-profile-fieldset`, not `client-profile`: the shipped\n * `ClientProfilePhoneControl` (`matter/client-profile/client-profile.tsx`) already requires\n * `client-profile` and writes on blur, so reusing that name here would let an on-blur control compile\n * inside this batched fieldset and write immediately. `ClientProfileFieldsetPhoneControl` carries the\n * same container prefix as the context it requires, naming the collision rather than hiding it.\n */\n\n// ---------------------------------------------------------------------------\n// GraphQL Fragment — colocated on the fieldset, its own data root\n// ---------------------------------------------------------------------------\n\nconst fragment = /* GraphQL */ `\n  fragment ClientProfileFieldsetData on Query {\n    clientProfile {\n      __typename\n      id\n      firstName\n      lastName\n      phone\n      document\n    }\n  }\n`;\n\n// ---------------------------------------------------------------------------\n// Types\n// ---------------------------------------------------------------------------\n\n/** The `$data` slice forwarded by the reactive runtime — the ClientProfile sibling entity, unwrapped. */\nexport type ClientProfileFieldsetData = {\n  firstName?: string | null;\n  lastName?: string | null;\n  phone?: string | null;\n  document?: string | null;\n} | null;\n\n/** The four keys this fieldset registers under its namespace. */\ntype ProfileFieldKey = 'firstName' | 'lastName' | 'phone' | 'document';\n\n/** What the fieldset publishes to its controls. Carries no live value — react-hook-form owns those. */\ntype ClientProfileFieldsetContextValue = Readonly<{\n  namespace: 'clientProfile';\n  /** Seeds, resolved from `$data`. Empty string, never null, so a control never seeds `undefined`. */\n  saved: Readonly<Record<ProfileFieldKey, string>>;\n  /** True when the session reports `canEditData: false`. */\n  readOnly: boolean;\n  /** Phone mask/validation country, from the fieldset's own prop. */\n  country: PhoneCountry;\n  /** Locale document type; the document control renders only when supported. */\n  documentType: string | undefined;\n  /** The fieldset's own validation rules, per key. Present and empty today (Decision 6). */\n  rules: Readonly<Partial<Record<ProfileFieldKey, FieldRule>>>;\n}>;\n\n/** No control publishes a rule today — a blocking `RegisterOptions` key would reopen the same submit\n * block for a read-only session (Decision 6): `readOnly` disables a control's rendered `<input>` via a\n * plain HTML attribute, never react-hook-form's own `disabled` registration option (`field.tsx`'s\n * `useController` call takes no `disabled`), so a required field would stay fully registered and\n * validated while the shopper has no way to focus or edit it. Kept as a stable empty object so the\n * context value's identity does not churn on every render. */\nconst NO_RULES: Readonly<Partial<Record<ProfileFieldKey, FieldRule>>> = {};\n\n/**\n * Rows `ClientProfileFieldsetSkeleton` draws when nobody says otherwise: one per control in the full\n * anatomy — first name, last name, phone, document. It is a default and not a derivation, because\n * the composed children are opaque here. A page that composes fewer sets `skeletonCount` to what it\n * composed, or the form jumps by the difference when the controls take the skeleton's place.\n */\nconst CLIENT_PROFILE_SKELETON_ROWS = 4;\n\nconst CLIENT_PROFILE_FIELDSET_UNSET = Symbol('ClientProfileFieldsetContextUnset');\n\nconst ClientProfileFieldsetContext = createContext<\n  ClientProfileFieldsetContextValue | typeof CLIENT_PROFILE_FIELDSET_UNSET\n>(CLIENT_PROFILE_FIELDSET_UNSET);\n\nfunction useClientProfileFieldsetContext(): ClientProfileFieldsetContextValue {\n  const ctx = useContext(ClientProfileFieldsetContext);\n  if (ctx === CLIENT_PROFILE_FIELDSET_UNSET) {\n    throw new Error('ClientProfileFieldset controls must be used inside ClientProfileFieldset.');\n  }\n  return ctx;\n}\n\n// ---------------------------------------------------------------------------\n// Props\n// ---------------------------------------------------------------------------\n\nexport type ClientProfileFieldsetProps = {\n  /** Phone mask/validation country, provided to the phone control via context. */\n  country?: PhoneCountry;\n  /** Locale document type; the document control renders only when supported. */\n  documentType?: string;\n  /** Placeholder rows the loading skeleton draws. Set it to the number of controls composed here. */\n  skeletonCount?: number;\n  /** Announced politely while the profile resolves. Blank means no announcement. */\n  loadingLabel?: string;\n  /** Announced politely once the controls mount. Blank means no announcement. */\n  loadedLabel?: string;\n  /** Accessible name of the `<fieldset>` group. Blank means no name is exposed. */\n  groupLabel?: string;\n  className?: string;\n  children?: ReactNode;\n  /** `ClientProfileFieldsetData` slice forwarded by the reactive runtime. */\n  $data?: ClientProfileFieldsetData;\n  /** Compiler-injected; carries `identity.clientProfileUpdate`. */\n  $actions?: ComponentActions;\n};\n\ntype ProfileTextControlProps = { label?: string; placeholder?: string; className?: string; children?: ReactNode };\n\nexport type ClientProfileFirstNameControlProps = ProfileTextControlProps;\nexport type ClientProfileLastNameControlProps = ProfileTextControlProps;\n\nexport type ClientProfileFieldsetPhoneControlProps = {\n  label?: string;\n  placeholder?: string;\n  /**\n   * Raises the field to required. The composite owns it; the contract carries no rule (Decision 6),\n   * so here the raise is the whole of the resolution. Unset is no opinion, which leaves the phone\n   * optional.\n   */\n  requirement?: 'mandatory' | 'optional';\n  errorInvalid?: string;\n  errorRequired?: string;\n  className?: string;\n  /** Given, replaces PhoneField's default Field.Label + PhoneFieldInput + Field.Error anatomy. */\n  children?: ReactNode;\n};\n\nexport type ClientProfileDocumentControlProps = {\n  label?: string;\n  placeholder?: string;\n  errorMessage?: string;\n  className?: string;\n  /** Given, replaces DocumentField's default Field.Label + DocumentFieldInput + Field.Error anatomy. */\n  children?: ReactNode;\n};\n\n// ---------------------------------------------------------------------------\n// Definitions\n// ---------------------------------------------------------------------------\n\nexport const ClientProfileFieldsetDefinition = defineComponent<ClientProfileFieldsetProps>({\n  name: 'ClientProfileFieldset',\n  importPath: '@vtex/faststore/components',\n  component: ClientProfileFieldset,\n  fragment,\n  fetchStrategy: 'reactive',\n  skeleton: ClientProfileFieldsetSkeleton,\n  requiresContext: ['form', 'session'],\n  providesContext: 'client-profile-fieldset',\n  actions: { identity: ['clientProfileUpdate'] },\n  editor: { label: 'Client Profile Fieldset', category: 'identity' },\n  schema: {\n    country: { type: 'string', default: 'US', label: 'Phone country (US or BR)' },\n    documentType: { type: 'string', label: 'Document type (e.g. CPF)' },\n    skeletonCount: { type: 'number', default: 4, label: 'Skeleton rows' },\n    loadingLabel: { type: 'string', default: 'Loading your details', label: 'Loading announcement' },\n    loadedLabel: { type: 'string', default: 'Your details are ready', label: 'Loaded announcement' },\n    groupLabel: { type: 'string', default: 'Your details', label: 'Accessible group name' },\n  },\n  guideline:\n    'Registers a batched write of the ClientProfile entity with the enclosing FormRoot; renders one Fieldset.Root and no <form>. Must be inside a FormRoot with a SessionRoot ancestor. Compose ClientProfileFirstNameControl / ClientProfileLastNameControl / ClientProfileFieldsetPhoneControl / ClientProfileDocumentControl as children, in any order. The controls mount only once the profile has resolved, with skeletonCount placeholder rows in their place until then — set it to the number of controls composed, or the form jumps by the difference. Style the announcement sr-only. Dispatches only the fields the shopper changed. groupLabel names the group as its accessible name; blank emits no aria-label, and a composed FieldsetLegend wins over it.',\n});\n\nexport const ClientProfileFirstNameControlDefinition = defineComponent<ClientProfileFirstNameControlProps>({\n  name: 'ClientProfileFirstNameControl',\n  importPath: '@vtex/faststore/components',\n  component: ClientProfileFirstNameControl,\n  requiresContext: 'client-profile-fieldset',\n  providesContext: 'field',\n  editor: { label: 'Client Profile First Name Control', category: 'identity' },\n  schema: {\n    // No default (Decision 1): absence means the platform's value, applied at render time by\n    // the control itself, not baked into the schema.\n    label: { type: 'string', label: 'Label' },\n    placeholder: { type: 'string', label: 'Placeholder' },\n  },\n  guideline:\n    \"The bound first-name control; must be a descendant of ClientProfileFieldset. Renders Field.Root > Field.Label + Field.Control + Field.Error by default, or the composed children in the author's own order.\",\n});\n\nexport const ClientProfileLastNameControlDefinition = defineComponent<ClientProfileLastNameControlProps>({\n  name: 'ClientProfileLastNameControl',\n  importPath: '@vtex/faststore/components',\n  component: ClientProfileLastNameControl,\n  requiresContext: 'client-profile-fieldset',\n  providesContext: 'field',\n  editor: { label: 'Client Profile Last Name Control', category: 'identity' },\n  schema: {\n    // No default (Decision 1): absence means the platform's value, applied at render time by\n    // the control itself, not baked into the schema.\n    label: { type: 'string', label: 'Label' },\n    placeholder: { type: 'string', label: 'Placeholder' },\n  },\n  guideline:\n    \"The bound last-name control; must be a descendant of ClientProfileFieldset. Renders Field.Root > Field.Label + Field.Control + Field.Error by default, or the composed children in the author's own order.\",\n});\n\nexport const ClientProfileFieldsetPhoneControlDefinition = defineComponent<ClientProfileFieldsetPhoneControlProps>({\n  name: 'ClientProfileFieldsetPhoneControl',\n  importPath: '@vtex/faststore/components',\n  component: ClientProfileFieldsetPhoneControl,\n  requiresContext: 'client-profile-fieldset',\n  // Provides both names (mirrors shipping-address.tsx:595's Decision 7): 'field' is what every\n  // fieldset Control declares (RFC:503), but this control also composes PhoneField, whose\n  // PhoneFieldInput part requires 'phone-field' — a page composing\n  // ClientProfileFieldsetPhoneControl > PhoneFieldInput would otherwise fail the build with a\n  // context-constraint violation, since PhoneField itself (the only 'phone-field' provider) never\n  // appears in the page schema (finding F1).\n  providesContext: ['field', 'phone-field'],\n  editor: { label: 'Client Profile Fieldset Phone Control', category: 'identity' },\n  schema: {\n    // No default (Decision 1): absence means the platform's value, applied at render time by\n    // the control itself, not baked into the schema.\n    label: { type: 'string', label: 'Label' },\n    placeholder: { type: 'string', label: 'Placeholder' },\n    // No default: an unset requirement is no opinion, not a raise to mandatory.\n    requirement: { type: ['mandatory', 'optional'] as const, label: 'Requirement' },\n    // No default (Decision 1): absence means the platform's value, applied at render time by\n    // the control itself, not baked into the schema.\n    errorInvalid: { type: 'string', label: 'Invalid error message' },\n    errorRequired: { type: 'string', label: 'Required error message' },\n  },\n  guideline:\n    \"The bound phone control; must be a descendant of ClientProfileFieldset. Distinct from ClientProfilePhoneControl (matter/client-profile), which writes on blur and requires the client-profile context — the two cannot compile into each other's container. Composes the PhoneField particle: recomposable (RFC:503) — given children, they replace PhoneField's default Field.Label + PhoneFieldInput + Field.Error anatomy, in any order; childless keeps today's order. Its className styles PhoneField's own root, the node that lays out label, input and error — not the wrapper, which carries only the data-fs-client-profile-fieldset-field=\\\"phone\\\" styling hook. A store that does not want a phone field omits this element from the page: requirement only governs required validation, never visibility.\",\n});\n\nexport const ClientProfileDocumentControlDefinition = defineComponent<ClientProfileDocumentControlProps>({\n  name: 'ClientProfileDocumentControl',\n  importPath: '@vtex/faststore/components',\n  component: ClientProfileDocumentControl,\n  requiresContext: 'client-profile-fieldset',\n  // Provides both names, same reasoning as ClientProfileFieldsetPhoneControlDefinition above: this\n  // control composes DocumentField, whose DocumentFieldInput part requires 'document-field' — a page\n  // composing ClientProfileDocumentControl > DocumentFieldInput would otherwise fail the build\n  // (finding F1).\n  providesContext: ['field', 'document-field'],\n  editor: { label: 'Client Profile Document Control', category: 'identity' },\n  schema: {\n    // No default (Decision 1): absence means the platform's value, applied at render time by\n    // the control itself, not baked into the schema.\n    label: { type: 'string', label: 'Label' },\n    placeholder: { type: 'string', label: 'Placeholder' },\n    errorMessage: { type: 'string', label: 'Error message' },\n  },\n  guideline:\n    \"The bound tax-document control; must be a descendant of ClientProfileFieldset. Renders nothing, and registers no field name, when the fieldset's documentType is unsupported. Composes the DocumentField particle: recomposable (RFC:503) — given children, they replace DocumentField's default Field.Label + DocumentFieldInput + Field.Error anatomy, in any order; childless keeps today's order.\",\n});\n\n// ---------------------------------------------------------------------------\n// Fieldset root\n// ---------------------------------------------------------------------------\n\n/**\n * Registers a batched write of the `ClientProfile` entity with the enclosing `FormRoot`\n * (`registerFieldset`, namespace `clientProfile`) on mount, unconditionally — so this fieldset keeps its\n * original dispatch slot even while its own query is still resolving. Its children — the seed values and\n * the field-name registry its controls need — render only once the entity has resolved; until then the\n * `Fieldset.Root` carries `-pending` and renders `ClientProfileFieldsetSkeleton` (Decision 5).\n * `dispatch` and `toPayload` are `useCallback([])`-stable and read `$actions`/`country`/`documentType`\n * through a ref, so the registration effect runs exactly once per mount regardless of how often the\n * parent re-renders.\n *\n * \"Resolved\" is two conditions, because `$data` alone cannot answer it. Under the reactive runtime the\n * slice is defined from the first render — `useReactiveEntity` hands down `fallbackData` while the cache\n * read is incomplete — so an empty server answer looks exactly like a resolved one, and the controls\n * would mount and seed `''` before the shopper's real profile arrives. `useSeedAdoption` re-seeds a\n * clean field with `defaultValue` on every render, but once the field turns dirty no later seed\n * ever reaches it again: a shopper who starts typing before the real profile arrives locks that\n * empty seed in for good, and even a shopper who does not type sees the field flash from `''` to\n * the real data. `useReactiveDataSettled` supplies the missing half: the page query's own\n * in-flight state, latched so it only ever goes pending → settled. The `$data === undefined` half still\n * carries trees with no reactive root above them, where the slice arrives as a plain prop.\n *\n * Both ends of that wait are spoken: the fieldset carries `aria-busy` while it lasts and holds a polite\n * live region that announces `loadingLabel` and then `loadedLabel`. Style the region `sr-only` — it is\n * text meant for a screen reader, not for the page.\n */\nexport function ClientProfileFieldset({\n  country = 'US',\n  documentType,\n  skeletonCount = CLIENT_PROFILE_SKELETON_ROWS,\n  loadingLabel = 'Loading your details',\n  loadedLabel = 'Your details are ready',\n  groupLabel = 'Your details',\n  className,\n  children,\n  $data: $dataProp,\n  $actions: $actionsProp,\n}: ClientProfileFieldsetProps) {\n  // Nesting fieldsets has no legitimate use: useFieldsetField resolves the *nearest*\n  // FieldsetFieldContext, not the one owning a control's actual namespace, so a control nested two\n  // fieldsets deep would silently register under the wrong one and its write would be discarded on\n  // submit. Runtime registry integrity, mirroring the namespace-collision throw FormRoot already ships\n  // (form.tsx:280-288).\n  useNoAncestorFieldset('ClientProfileFieldset');\n\n  const $data = useDataOverride($dataProp);\n\n  const $actions = useActionsOverride($actionsProp);\n  // Three conditions, not two. `useReactiveDataSettled` latches one way and never re-arms, so on its\n  // own it answers \"has this page ever resolved\", not \"is what I am holding right now the server's\n  // answer\" — after the page query's entity ref moves to one this cache never stored, or its root is\n  // skipped for want of a variable, the slice silently regresses to `fallbackData` while the latch\n  // still reads settled. `useEntityDataResolved` is the per-entity half: unlatched, so it follows the\n  // slice back down and returns this fieldset to its skeleton instead of leaving live controls seeded\n  // from a placeholder.\n  const settled = useReactiveDataSettled();\n  const sliceResolved = useEntityDataResolved();\n  const resolved = settled && sliceResolved && $data !== undefined;\n  // Also enforces the SessionRoot ancestor: useSession() throws when rendered outside one.\n  const { canEditData } = useSession();\n  const readOnly = !canEditData;\n\n  // Runs before useFormContext() below: useFormRegistry() throws the friendly \"Form parts must be used\n  // inside FormRoot.\" error when no FormRoot is above, so a FormRoot-less render fails there rather than\n  // reaching the getFieldState destructure, which throws an unhelpful TypeError instead (useFormContext()\n  // resolves to null outside a FormRoot, and destructuring null throws).\n  const { registerFieldset } = useFormRegistry();\n\n  // Decision 3, as later narrowed: this fieldset still reads dirtiness imperatively, but the rule is no\n  // longer the form's. `FormRoot` subscribes `dirtyFields` in render and decides which fieldsets to\n  // dispatch from it, by the fields each one has mounted, on react-hook-form's documented contract.\n  //\n  // The imperative read survives here because it asks a different question in a different place: which\n  // of *this* fieldset's own fields changed, resolved inside `toPayload` at submit time, by full\n  // registered field name — the shape `getFieldState` documents. `useFormContext()` adds no\n  // `formState` subscription of its own; one is created only when a caller reads a formState key off\n  // the `useForm`/`useFormState` proxy (or hands that already-subscribed object to `getFieldState`'s\n  // second argument). Calling `getFieldState(name)` with no second argument reads the current internal\n  // state directly, so this fieldset root still does not re-render on a keystroke.\n  const { getFieldState } = useFormContext();\n\n  const latest = useRef({ $actions, country, documentType, readOnly, getFieldState });\n  useEffect(() => {\n    latest.current = { $actions, country, documentType, readOnly, getFieldState };\n  }, [$actions, country, documentType, readOnly, getFieldState]);\n\n  const { registry: fieldsetRegistry, getFieldNames } = useFieldsetFieldNames('clientProfile');\n\n  const dispatch = useCallback(async (payload: Record<string, unknown>) => {\n    // Defence-in-depth: the UI disables every input while read-only, but `FormClear` sets values (and\n    // marks them dirty) on every registered field regardless of that disabled attribute — react-hook-\n    // form's own `useController` calls never receive a `disabled` registration option, so it has no\n    // notion of \"disabled\" of its own. Guarding here keeps the write from reaching the network even if\n    // some other composition dirties this fieldset while canEditData is false (the server also refuses,\n    // but a client-side guard should not depend on that).\n    if (latest.current.readOnly) {\n      throw new Error('ClientProfileFieldset cannot dispatch while the session is read-only.');\n    }\n    const update = latest.current.$actions?.identity?.clientProfileUpdate;\n    // Throwing is the contract's failure path: FormRoot catches it and records this fieldset's failure\n    // (form.tsx:264-266). Returning [] would report an unqualified success for a write that never\n    // happened.\n    if (!update) throw new Error('ClientProfileFieldset requires $actions.identity.clientProfileUpdate.');\n    return update(payload as ClientProfileUpdateInput);\n  }, []);\n\n  const toPayload = useCallback((values: Record<string, unknown>): Record<string, unknown> => {\n    const { country: activeCountry, documentType: activeDocumentType, getFieldState } = latest.current;\n    // FR-5: a key is emitted only when the shopper actually changed it — presence in `values` alone\n    // (every registered field is always present) is not enough. `dirtyFields` is not read directly;\n    // `getFieldState` is called with no second argument, which reads react-hook-form's current\n    // internal state without subscribing to it (Decision 3).\n    const isDirty = (key: ProfileFieldKey) => getFieldState(`clientProfile.${key}`).isDirty;\n    const payload: Record<string, string> = {};\n    if ('firstName' in values && isDirty('firstName')) payload.firstName = String(values.firstName ?? '').trim();\n    if ('lastName' in values && isDirty('lastName')) payload.lastName = String(values.lastName ?? '').trim();\n    if ('phone' in values && isDirty('phone')) {\n      const raw = String(values.phone ?? '').trim();\n      // toE164 on a blank value returns the bare country code, which would write \"+55\" over the\n      // shopper's number and fail every later save.\n      payload.phone = raw ? toE164(raw, activeCountry) : '';\n    }\n    // The type's own sanitiser (digits for CPF, SSN and SIN, letters kept for RFC). Omitted when the type is\n    // not supported: a value for a control that is no longer shown is never sent.\n    if ('document' in values && isDirty('document') && isSupportedDocumentType(activeDocumentType)) {\n      // The control only ever writes a string (the masked input's own value); `values` is typed `unknown`\n      // because the fieldset contract carries every field's value, so it is narrowed here, not stringified.\n      const rawDocument = typeof values.document === 'string' ? values.document : '';\n      payload.document = DOCUMENTS[activeDocumentType].sanitize(rawDocument);\n    }\n    return payload;\n  }, []);\n\n  useEffect(\n    () =>\n      registerFieldset({\n        namespace: 'clientProfile',\n        getFieldNames,\n        dispatch,\n        toPayload,\n        // Decision 1: the register is a machine identifier, the kebab-case ASCII rendering of this\n        // registration's own `namespace` (`clientProfile` → `client-profile`) — not authored per\n        // page (Decision 2).\n        label: 'client-profile',\n      }),\n    [registerFieldset, getFieldNames, dispatch, toPayload],\n  );\n\n  const saved = useMemo<Readonly<Record<ProfileFieldKey, string>>>(\n    () => ({\n      firstName: $data?.firstName ?? '',\n      lastName: $data?.lastName ?? '',\n      phone: $data?.phone ?? '',\n      document: $data?.document ?? '',\n    }),\n    [$data],\n  );\n\n  const contextValue = useMemo<ClientProfileFieldsetContextValue>(\n    () => ({ namespace: 'clientProfile', saved, readOnly, country, documentType, rules: NO_RULES }),\n    [saved, readOnly, country, documentType],\n  );\n\n  // Assistive technology only reports a change inside a region that was already in the tree, so a\n  // region mounted together with its text announces nothing. The region therefore sits in both\n  // branches and starts empty, with the wait written on the pass after mount and replaced — not\n  // cleared — once the controls are up: the skeleton is `aria-hidden`, so without this second\n  // message the form would materialise in silence (WCAG 2.1 SC 4.1.3).\n  const [announcement, setAnnouncement] = useState('');\n  const announced = resolved ? loadedLabel : loadingLabel;\n  useEffect(() => {\n    setAnnouncement(announced);\n  }, [announced]);\n\n  return (\n    <Fieldset.Root\n      className={className}\n      disabled={readOnly}\n      aria-busy={resolved ? undefined : true}\n      // FR-12: blank (or whitespace-only) means no name is exposed, mirroring the loadingLabel/\n      // loadedLabel convention. On the root itself (FR-13), so it is identical whether the fieldset\n      // is pending or resolved; a page-composed FieldsetLegend still wins via aria-labelledby.\n      {...(groupLabel?.trim() ? { 'aria-label': groupLabel } : {})}\n      data-fs-client-profile-fieldset=\"\"\n      {...(resolved ? {} : { 'data-fs-client-profile-fieldset-pending': '' })}\n      {...(readOnly ? { 'data-fs-client-profile-fieldset-readonly': '' } : {})}\n    >\n      {resolved ? (\n        <FieldsetFieldContext.Provider value={fieldsetRegistry}>\n          <ClientProfileFieldsetContext.Provider value={contextValue}>{children}</ClientProfileFieldsetContext.Provider>\n        </FieldsetFieldContext.Provider>\n      ) : (\n        <ClientProfileFieldsetSkeleton count={skeletonCount} />\n      )}\n      <output aria-live=\"polite\" data-fs-client-profile-fieldset-announcement=\"\">\n        {announcement}\n      </output>\n    </Fieldset.Root>\n  );\n}\n\n/**\n * The loading state of the fieldset, rendered in place of the controls until the entity resolves and\n * declared as the definition's `skeleton`. Purely visual: the wait is spoken by the fieldset's own live\n * region, so this is hidden from assistive technology rather than announced twice.\n */\nexport function ClientProfileFieldsetSkeleton({\n  count = CLIENT_PROFILE_SKELETON_ROWS,\n  className,\n  ...props\n}: ComponentPropsWithRef<'div'> & { count?: number }) {\n  return (\n    <div {...props} className={className} data-fs-client-profile-fieldset-skeleton=\"\" aria-hidden=\"true\">\n      {Array.from({ length: count }, (_, i) => (\n        <span key={i} data-fs-client-profile-fieldset-skeleton-field=\"\" />\n      ))}\n    </div>\n  );\n}\n\nClientProfileFieldset.Skeleton = ClientProfileFieldsetSkeleton;\n\n// ---------------------------------------------------------------------------\n// Text controls — first name, last name\n// ---------------------------------------------------------------------------\n\nfunction ProfileTextControl({\n  fieldKey,\n  attr,\n  autoComplete,\n  defaultLabel,\n  label,\n  placeholder,\n  className,\n  children,\n}: {\n  fieldKey: 'firstName' | 'lastName';\n  attr: string;\n  autoComplete: string;\n  defaultLabel: string;\n  label?: string;\n  placeholder?: string;\n  className?: string;\n  children?: ReactNode;\n}) {\n  const { namespace, saved, readOnly, rules } = useClientProfileFieldsetContext();\n  const name = useFieldsetField(namespace, fieldKey);\n\n  return (\n    <FieldBinding\n      name={name}\n      label={label ?? defaultLabel}\n      placeholder={placeholder}\n      defaultValue={saved[fieldKey]}\n      rule={rules[fieldKey]}\n      disabled={readOnly}\n      autoComplete={autoComplete}\n    >\n      <Field.Root className={className} data-fs-client-profile-fieldset-field={attr}>\n        {children ?? (\n          <>\n            <Field.Label />\n            <Field.Control />\n            <Field.Error />\n          </>\n        )}\n      </Field.Root>\n    </FieldBinding>\n  );\n}\n\nexport function ClientProfileFirstNameControl({\n  label,\n  placeholder,\n  className,\n  children,\n}: ClientProfileFirstNameControlProps) {\n  return (\n    <ProfileTextControl\n      fieldKey=\"firstName\"\n      attr=\"first-name\"\n      autoComplete=\"given-name\"\n      defaultLabel=\"First name\"\n      label={label}\n      placeholder={placeholder}\n      className={className}\n    >\n      {children}\n    </ProfileTextControl>\n  );\n}\n\nexport function ClientProfileLastNameControl({\n  label,\n  placeholder,\n  className,\n  children,\n}: ClientProfileLastNameControlProps) {\n  return (\n    <ProfileTextControl\n      fieldKey=\"lastName\"\n      attr=\"last-name\"\n      autoComplete=\"family-name\"\n      defaultLabel=\"Last name\"\n      label={label}\n      placeholder={placeholder}\n      className={className}\n    >\n      {children}\n    </ProfileTextControl>\n  );\n}\n\n// ---------------------------------------------------------------------------\n// Phone control — the fieldset-bound counterpart of ClientProfilePhoneControl\n// ---------------------------------------------------------------------------\n\n/**\n * Composes `PhoneField` inside a `FieldBinding`, wrapped in a `data-fs-client-profile-fieldset-field=\"phone\"`\n * node — the same styling hook attribute the text controls carry on their own `Field.Root`.\n * `useFieldsetField` runs unconditionally, before `requirement` is even read — there is no suppressed\n * state for this control to second-guess; `requirement` only ever raises the field to required,\n * and left unset it raises nothing.\n */\nexport function ClientProfileFieldsetPhoneControl({\n  label,\n  placeholder,\n  requirement,\n  errorInvalid,\n  errorRequired,\n  className,\n  children,\n}: ClientProfileFieldsetPhoneControlProps) {\n  const { namespace, saved, readOnly, rules, country } = useClientProfileFieldsetContext();\n  const name = useFieldsetField(namespace, 'phone');\n\n  const binding = (\n    <FieldBinding\n      name={name}\n      label={label}\n      placeholder={placeholder}\n      defaultValue={saved.phone}\n      rule={rules.phone}\n      disabled={readOnly}\n    >\n      <PhoneField\n        country={country}\n        requirement={requirement}\n        errorInvalid={errorInvalid}\n        errorRequired={errorRequired}\n        className={className}\n      >\n        {children}\n      </PhoneField>\n    </FieldBinding>\n  );\n\n  // The wrapper carries no className of its own (Decision 1): className lands on PhoneField's own\n  // Field.Root, the node that actually stacks label, input and error, so it needs no flex slot here.\n  return <div data-fs-client-profile-fieldset-field=\"phone\">{binding}</div>;\n}\n\n// ---------------------------------------------------------------------------\n// Document control — self-gates on documentType, through an inner component\n// ---------------------------------------------------------------------------\n\ntype ClientProfileDocumentControlInnerProps = ClientProfileDocumentControlProps & { documentType: DocumentType };\n\n/**\n * `useFieldsetField` (through `useClientProfileFieldsetContext`'s namespace) lives only in this inner\n * component, mounted only once `ClientProfileDocumentControl` has already decided the document type is\n * supported. Splitting the decision from the registration this way (Decision 8) keeps a control that\n * renders nothing from registering a field name `FormClear` would otherwise dirty and dispatch.\n */\nfunction ClientProfileDocumentControlInner({\n  documentType,\n  label,\n  placeholder,\n  errorMessage,\n  className,\n  children,\n}: ClientProfileDocumentControlInnerProps) {\n  const { namespace, saved, readOnly, rules } = useClientProfileFieldsetContext();\n  const name = useFieldsetField(namespace, 'document');\n\n  return (\n    <FieldBinding\n      name={name}\n      label={label ?? DOCUMENTS[documentType].name}\n      placeholder={placeholder}\n      defaultValue={saved.document}\n      rule={rules.document}\n      disabled={readOnly}\n    >\n      <DocumentField\n        documentType={documentType}\n        errorMessage={errorMessage}\n        className={className}\n        data-fs-client-profile-fieldset-field=\"document\"\n      >\n        {children}\n      </DocumentField>\n    </FieldBinding>\n  );\n}\n\nexport function ClientProfileDocumentControl({\n  label,\n  placeholder,\n  errorMessage,\n  className,\n  children,\n}: ClientProfileDocumentControlProps) {\n  const { documentType } = useClientProfileFieldsetContext();\n  if (!isSupportedDocumentType(documentType)) return null;\n\n  return (\n    <ClientProfileDocumentControlInner\n      documentType={documentType}\n      label={label}\n      placeholder={placeholder}\n      errorMessage={errorMessage}\n      className={className}\n    >\n      {children}\n    </ClientProfileDocumentControlInner>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8DA,MAAM,WAAyB;;;;;;;;;;;;;;;;;;AAiD/B,MAAM,WAAkE,CAAC;;;;;;;AAQzE,MAAM,+BAA+B;AAErC,MAAM,gCAAgC,OAAO,mCAAmC;AAEhF,MAAM,+BAA+B,cAEnC,6BAA6B;AAE/B,SAAS,kCAAqE;CAC5E,MAAM,MAAM,WAAW,4BAA4B;CACnD,IAAI,QAAQ,+BACV,MAAM,IAAI,MAAM,2EAA2E;CAE7F,OAAO;AACT;AA6DA,MAAa,kCAAkC,gBAA4C;CACzF,MAAM;CACN,YAAY;CACZ,WAAW;CACX;CACA,eAAe;CACf,UAAU;CACV,iBAAiB,CAAC,QAAQ,SAAS;CACnC,iBAAiB;CACjB,SAAS,EAAE,UAAU,CAAC,qBAAqB,EAAE;CAC7C,QAAQ;EAAE,OAAO;EAA2B,UAAU;CAAW;CACjE,QAAQ;EACN,SAAS;GAAE,MAAM;GAAU,SAAS;GAAM,OAAO;EAA2B;EAC5E,cAAc;GAAE,MAAM;GAAU,OAAO;EAA2B;EAClE,eAAe;GAAE,MAAM;GAAU,SAAS;GAAG,OAAO;EAAgB;EACpE,cAAc;GAAE,MAAM;GAAU,SAAS;GAAwB,OAAO;EAAuB;EAC/F,aAAa;GAAE,MAAM;GAAU,SAAS;GAA0B,OAAO;EAAsB;EAC/F,YAAY;GAAE,MAAM;GAAU,SAAS;GAAgB,OAAO;EAAwB;CACxF;CACA,WACE;AACJ,CAAC;AAED,MAAa,0CAA0C,gBAAoD;CACzG,MAAM;CACN,YAAY;CACZ,WAAW;CACX,iBAAiB;CACjB,iBAAiB;CACjB,QAAQ;EAAE,OAAO;EAAqC,UAAU;CAAW;CAC3E,QAAQ;EAGN,OAAO;GAAE,MAAM;GAAU,OAAO;EAAQ;EACxC,aAAa;GAAE,MAAM;GAAU,OAAO;EAAc;CACtD;CACA,WACE;AACJ,CAAC;AAED,MAAa,yCAAyC,gBAAmD;CACvG,MAAM;CACN,YAAY;CACZ,WAAW;CACX,iBAAiB;CACjB,iBAAiB;CACjB,QAAQ;EAAE,OAAO;EAAoC,UAAU;CAAW;CAC1E,QAAQ;EAGN,OAAO;GAAE,MAAM;GAAU,OAAO;EAAQ;EACxC,aAAa;GAAE,MAAM;GAAU,OAAO;EAAc;CACtD;CACA,WACE;AACJ,CAAC;AAED,MAAa,8CAA8C,gBAAwD;CACjH,MAAM;CACN,YAAY;CACZ,WAAW;CACX,iBAAiB;CAOjB,iBAAiB,CAAC,SAAS,aAAa;CACxC,QAAQ;EAAE,OAAO;EAAyC,UAAU;CAAW;CAC/E,QAAQ;EAGN,OAAO;GAAE,MAAM;GAAU,OAAO;EAAQ;EACxC,aAAa;GAAE,MAAM;GAAU,OAAO;EAAc;EAEpD,aAAa;GAAE,MAAM,CAAC,aAAa,UAAU;GAAY,OAAO;EAAc;EAG9E,cAAc;GAAE,MAAM;GAAU,OAAO;EAAwB;EAC/D,eAAe;GAAE,MAAM;GAAU,OAAO;EAAyB;CACnE;CACA,WACE;AACJ,CAAC;AAED,MAAa,yCAAyC,gBAAmD;CACvG,MAAM;CACN,YAAY;CACZ,WAAW;CACX,iBAAiB;CAKjB,iBAAiB,CAAC,SAAS,gBAAgB;CAC3C,QAAQ;EAAE,OAAO;EAAmC,UAAU;CAAW;CACzE,QAAQ;EAGN,OAAO;GAAE,MAAM;GAAU,OAAO;EAAQ;EACxC,aAAa;GAAE,MAAM;GAAU,OAAO;EAAc;EACpD,cAAc;GAAE,MAAM;GAAU,OAAO;EAAgB;CACzD;CACA,WACE;AACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;AA+BD,SAAgB,sBAAsB,EACpC,UAAU,MACV,cACA,gBAAgB,8BAChB,eAAe,wBACf,cAAc,0BACd,aAAa,gBACb,WACA,UACA,OAAO,WACP,UAAU,gBACmB;CAM7B,sBAAsB,uBAAuB;CAE7C,MAAM,QAAQ,gBAAgB,SAAS;CAEvC,MAAM,WAAW,mBAAmB,YAAY;CAQhD,MAAM,UAAU,uBAAuB;CACvC,MAAM,gBAAgB,sBAAsB;CAC5C,MAAM,WAAW,WAAW,iBAAiB,UAAU,KAAA;CAEvD,MAAM,EAAE,gBAAgB,WAAW;CACnC,MAAM,WAAW,CAAC;CAMlB,MAAM,EAAE,qBAAqB,gBAAgB;CAa7C,MAAM,EAAE,kBAAkB,eAAe;CAEzC,MAAM,SAAS,OAAO;EAAE;EAAU;EAAS;EAAc;EAAU;CAAc,CAAC;CAClF,gBAAgB;EACd,OAAO,UAAU;GAAE;GAAU;GAAS;GAAc;GAAU;EAAc;CAC9E,GAAG;EAAC;EAAU;EAAS;EAAc;EAAU;CAAa,CAAC;CAE7D,MAAM,EAAE,UAAU,kBAAkB,kBAAkB,sBAAsB,eAAe;CAE3F,MAAM,WAAW,YAAY,OAAO,YAAqC;EAOvE,IAAI,OAAO,QAAQ,UACjB,MAAM,IAAI,MAAM,uEAAuE;EAEzF,MAAM,SAAS,OAAO,QAAQ,UAAU,UAAU;EAIlD,IAAI,CAAC,QAAQ,MAAM,IAAI,MAAM,uEAAuE;EACpG,OAAO,OAAO,OAAmC;CACnD,GAAG,CAAC,CAAC;CAEL,MAAM,YAAY,aAAa,WAA6D;EAC1F,MAAM,EAAE,SAAS,eAAe,cAAc,oBAAoB,kBAAkB,OAAO;EAK3F,MAAM,WAAW,QAAyB,cAAc,iBAAiB,KAAK,CAAC,CAAC;EAChF,MAAM,UAAkC,CAAC;EACzC,IAAI,eAAe,UAAU,QAAQ,WAAW,GAAG,QAAQ,YAAY,OAAO,OAAO,aAAa,EAAE,CAAC,CAAC,KAAK;EAC3G,IAAI,cAAc,UAAU,QAAQ,UAAU,GAAG,QAAQ,WAAW,OAAO,OAAO,YAAY,EAAE,CAAC,CAAC,KAAK;EACvG,IAAI,WAAW,UAAU,QAAQ,OAAO,GAAG;GACzC,MAAM,MAAM,OAAO,OAAO,SAAS,EAAE,CAAC,CAAC,KAAK;GAG5C,QAAQ,QAAQ,MAAM,OAAO,KAAK,aAAa,IAAI;EACrD;EAGA,IAAI,cAAc,UAAU,QAAQ,UAAU,KAAK,wBAAwB,kBAAkB,GAAG;GAG9F,MAAM,cAAc,OAAO,OAAO,aAAa,WAAW,OAAO,WAAW;GAC5E,QAAQ,WAAW,UAAU,mBAAmB,CAAC,SAAS,WAAW;EACvE;EACA,OAAO;CACT,GAAG,CAAC,CAAC;CAEL,gBAEI,iBAAiB;EACf,WAAW;EACX;EACA;EACA;EAIA,OAAO;CACT,CAAC,GACH;EAAC;EAAkB;EAAe;EAAU;CAAS,CACvD;CAEA,MAAM,QAAQ,eACL;EACL,WAAW,OAAO,aAAa;EAC/B,UAAU,OAAO,YAAY;EAC7B,OAAO,OAAO,SAAS;EACvB,UAAU,OAAO,YAAY;CAC/B,IACA,CAAC,KAAK,CACR;CAEA,MAAM,eAAe,eACZ;EAAE,WAAW;EAAiB;EAAO;EAAU;EAAS;EAAc,OAAO;CAAS,IAC7F;EAAC;EAAO;EAAU;EAAS;CAAY,CACzC;CAOA,MAAM,CAAC,cAAc,mBAAmB,SAAS,EAAE;CACnD,MAAM,YAAY,WAAW,cAAc;CAC3C,gBAAgB;EACd,gBAAgB,SAAS;CAC3B,GAAG,CAAC,SAAS,CAAC;CAEd,OACE,qBAAC,SAAS,MAAV;EACa;EACX,UAAU;EACV,aAAW,WAAW,KAAA,IAAY;EAIlC,GAAK,YAAY,KAAK,IAAI,EAAE,cAAc,WAAW,IAAI,CAAC;EAC1D,mCAAgC;EAChC,GAAK,WAAW,CAAC,IAAI,EAAE,2CAA2C,GAAG;EACrE,GAAK,WAAW,EAAE,4CAA4C,GAAG,IAAI,CAAC;EAVxE,UAAA,CAYG,WACC,oBAAC,qBAAqB,UAAtB;GAA+B,OAAO;GACpC,UAAA,oBAAC,6BAA6B,UAA9B;IAAuC,OAAO;IAAe;GAAgD,CAAA;EAChF,CAAA,IAE/B,oBAAC,+BAAD,EAA+B,OAAO,cAAgB,CAAA,GAExD,oBAAC,UAAD;GAAQ,aAAU;GAAS,gDAA6C;GACrE,UAAA;EACK,CAAA,CACK;;AAEnB;;;;;;AAOA,SAAgB,8BAA8B,EAC5C,QAAQ,8BACR,WACA,GAAG,SACiD;CACpD,OACE,oBAAC,OAAD;EAAK,GAAI;EAAkB;EAAW,4CAAyC;EAAG,eAAY;EAC3F,UAAA,MAAM,KAAK,EAAE,QAAQ,MAAM,IAAI,GAAG,MACjC,oBAAC,QAAD,EAAc,kDAA+C,GAAI,GAAtD,CAAsD,CAClE;CACE,CAAA;AAET;AAEA,sBAAsB,WAAW;AAMjC,SAAS,mBAAmB,EAC1B,UACA,MACA,cACA,cACA,OACA,aACA,WACA,YAUC;CACD,MAAM,EAAE,WAAW,OAAO,UAAU,UAAU,gCAAgC;CAC9E,MAAM,OAAO,iBAAiB,WAAW,QAAQ;CAEjD,OACE,oBAAC,cAAD;EACQ;EACN,OAAO,SAAS;EACH;EACb,cAAc,MAAM;EACpB,MAAM,MAAM;EACZ,UAAU;EACI;EAEd,UAAA,oBAAC,MAAM,MAAP;GAAuB;GAAW,yCAAuC;GACtE,UAAA,YACC,qBAAA,YAAA,EAAA,UAAA;IACE,oBAAC,MAAM,OAAP,CAAc,CAAA;IACd,oBAAC,MAAM,SAAP,CAAgB,CAAA;IAChB,oBAAC,MAAM,OAAP,CAAc,CAAA;GACd,EAAA,CAAA;EAEM,CAAA;CACA,CAAA;AAElB;AAEA,SAAgB,8BAA8B,EAC5C,OACA,aACA,WACA,YACqC;CACrC,OACE,oBAAC,oBAAD;EACE,UAAS;EACT,MAAK;EACL,cAAa;EACb,cAAa;EACN;EACM;EACF;EAEV;CACiB,CAAA;AAExB;AAEA,SAAgB,6BAA6B,EAC3C,OACA,aACA,WACA,YACoC;CACpC,OACE,oBAAC,oBAAD;EACE,UAAS;EACT,MAAK;EACL,cAAa;EACb,cAAa;EACN;EACM;EACF;EAEV;CACiB,CAAA;AAExB;;;;;;;;AAaA,SAAgB,kCAAkC,EAChD,OACA,aACA,aACA,cACA,eACA,WACA,YACyC;CACzC,MAAM,EAAE,WAAW,OAAO,UAAU,OAAO,YAAY,gCAAgC;CACvF,MAAM,OAAO,iBAAiB,WAAW,OAAO;CAEhD,MAAM,UACJ,oBAAC,cAAD;EACQ;EACC;EACM;EACb,cAAc,MAAM;EACpB,MAAM,MAAM;EACZ,UAAU;EAEV,UAAA,oBAAC,YAAD;GACW;GACI;GACC;GACC;GACJ;GAEV;EACS,CAAA;CACA,CAAA;CAKhB,OAAO,oBAAC,OAAD;EAAK,yCAAsC;EAAS,UAAA;CAAa,CAAA;AAC1E;;;;;;;AAcA,SAAS,kCAAkC,EACzC,cACA,OACA,aACA,cACA,WACA,YACyC;CACzC,MAAM,EAAE,WAAW,OAAO,UAAU,UAAU,gCAAgC;CAC9E,MAAM,OAAO,iBAAiB,WAAW,UAAU;CAEnD,OACE,oBAAC,cAAD;EACQ;EACN,OAAO,SAAS,UAAU,aAAa,CAAC;EAC3B;EACb,cAAc,MAAM;EACpB,MAAM,MAAM;EACZ,UAAU;EAEV,UAAA,oBAAC,eAAD;GACgB;GACA;GACH;GACX,yCAAsC;GAErC;EACY,CAAA;CACH,CAAA;AAElB;AAEA,SAAgB,6BAA6B,EAC3C,OACA,aACA,cACA,WACA,YACoC;CACpC,MAAM,EAAE,iBAAiB,gCAAgC;CACzD,IAAI,CAAC,wBAAwB,YAAY,GAAG,OAAO;CAEnD,OACE,oBAAC,mCAAD;EACgB;EACP;EACM;EACC;EACH;EAEV;CACgC,CAAA;AAEvC"}

package/dist/matter/free-shipping-progress/free-shipping-progress.d.ts

@@ -9,7 +9,10 @@ type MoneyValue = {
 type FreeShippingProgressData = {
   cart?: {
     id: string;
-    total?: MoneyValue | null;
+    totalizers?: {
+      id: string;
+      value: MoneyValue;
+    }[] | null;
     freeShippingProgress?: {
       threshold: MoneyValue | null;
       remaining: MoneyValue;
@@ -21,7 +24,7 @@ export type FreeShippingProgressRootProps = ComponentPropsWithRef<'div'> & {
   threshold?: number;
   remaining?: number;
   qualified?: boolean;
-  cartTotal?: number;
+  itemsTotal?: number;
   $data?: FreeShippingProgressData['cart'] | null;
 };
 export type FreeShippingProgressBarProps = ComponentPropsWithRef<'div'>;
@@ -32,7 +35,7 @@ export type FreeShippingProgressMessageProps = ComponentPropsWithRef<'div'> & {
 export declare const FreeShippingProgressRootDefinition: ComponentDefinition<FreeShippingProgressRootProps>;
 export declare const FreeShippingProgressBarDefinition: ComponentDefinition<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
 export declare const FreeShippingProgressMessageDefinition: ComponentDefinition<FreeShippingProgressMessageProps>;
-export declare function FreeShippingProgressRoot({ threshold, remaining, qualified, cartTotal, $data: $dataProp, className, children, ...props }: FreeShippingProgressRootProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function FreeShippingProgressRoot({ threshold, remaining, qualified, itemsTotal, $data: $dataProp, className, children, ...props }: FreeShippingProgressRootProps): import("react/jsx-runtime").JSX.Element | null;
 export declare function FreeShippingProgressBar({ className, ...props }: FreeShippingProgressBarProps): import("react/jsx-runtime").JSX.Element;
 export declare function FreeShippingProgressMessage({ label, qualifiedLabel, className, children, ...props }: FreeShippingProgressMessageProps): import("react/jsx-runtime").JSX.Element;
 export declare const FreeShippingProgress: {

package/dist/matter/free-shipping-progress/free-shipping-progress.js

@@ -3,6 +3,7 @@ import { defineComponent } from "../../core/dist/define-component.js";
 import "../../core/dist/index.js";
 import { useStorefrontContext } from "../../sdk/context/storefront-context.js";
 import { useDataOverride } from "../../sdk/data/data-override-context.js";
+import { isFiniteAmount } from "../cart/cart.js";
 import { Meter } from "../../particles/meter/meter.js";
 import { createContext, useContext } from "react";
 import { jsx } from "react/jsx-runtime";
@@ -11,9 +12,12 @@ const fragment = `
   fragment FreeShippingProgressData on Query {
     cart {
       id
-      total {
-        amount
-        currencyCode
+      totalizers {
+        id
+        value {
+          amount
+          currencyCode
+        }
       }
       freeShippingProgress {
         threshold {
@@ -45,6 +49,62 @@ function formatCurrency(value, locale, currency) {
 function clamp01(value) {
 	return Math.min(Math.max(value, 0), 1);
 }
+function previewCart({ threshold, remaining, qualified, itemsTotal }, currency) {
+	if (qualified === void 0 && threshold === void 0 && remaining === void 0 && itemsTotal === void 0) return null;
+	return {
+		id: "preview",
+		totalizers: itemsTotal === void 0 ? [] : [{
+			id: "Items",
+			value: {
+				amount: itemsTotal,
+				currencyCode: currency
+			}
+		}],
+		freeShippingProgress: {
+			threshold: threshold == null ? null : {
+				amount: threshold,
+				currencyCode: currency
+			},
+			remaining: {
+				amount: remaining ?? threshold ?? 0,
+				currencyCode: currency
+			},
+			qualified: qualified ?? false
+		}
+	};
+}
+function itemsSubtotal(cart) {
+	const itemsAmount = cart.totalizers?.find((totalizer) => totalizer.id === "Items")?.value.amount;
+	return isFiniteAmount(itemsAmount) ? Number(itemsAmount) : null;
+}
+function usableThreshold(threshold) {
+	if (threshold == null) return null;
+	const parsed = Number(threshold.amount);
+	return Number.isFinite(parsed) && parsed > 0 ? parsed : null;
+}
+function fillRatio(isQualified, thresholdAmount, covered) {
+	if (isQualified) return 1;
+	if (thresholdAmount === null) return 0;
+	return clamp01(covered / thresholdAmount);
+}
+function computeProgress(fsp, items, thresholdAmount) {
+	if (items === null) {
+		const isQualified = fsp.qualified;
+		const liveRemaining = !isQualified && isFiniteAmount(fsp.remaining.amount) ? Math.max(Number(fsp.remaining.amount), 0) : 0;
+		return {
+			isQualified,
+			fill: fillRatio(isQualified, thresholdAmount, (thresholdAmount ?? 0) - liveRemaining),
+			liveRemaining
+		};
+	}
+	const isQualified = fsp.qualified || thresholdAmount !== null && items >= thresholdAmount;
+	const liveRemaining = isQualified || thresholdAmount === null ? 0 : Math.max(thresholdAmount - items, 0);
+	return {
+		isQualified,
+		fill: fillRatio(isQualified, thresholdAmount, items),
+		liveRemaining
+	};
+}
 const FreeShippingProgressRootDefinition = defineComponent({
 	name: "FreeShippingProgressRoot",
 	importPath: "@vtex/faststore/components",
@@ -91,40 +151,23 @@ const FreeShippingProgressMessageDefinition = defineComponent({
 	},
 	guideline: "Below-threshold vs earned copy, front-formatted from the active storefront context. Must be inside FreeShippingProgressRoot. See free-shipping-progress.md."
 });
-function FreeShippingProgressRoot({ threshold, remaining, qualified, cartTotal, $data: $dataProp, className, children, ...props }) {
+function FreeShippingProgressRoot({ threshold, remaining, qualified, itemsTotal, $data: $dataProp, className, children, ...props }) {
 	const { currency } = useStorefrontContext();
-	const cart = useDataOverride($dataProp) ?? (qualified !== void 0 || threshold !== void 0 || remaining !== void 0 || cartTotal !== void 0 ? {
-		id: "preview",
-		total: {
-			amount: cartTotal ?? 0,
-			currencyCode: currency
-		},
-		freeShippingProgress: {
-			threshold: threshold != null ? {
-				amount: threshold,
-				currencyCode: currency
-			} : null,
-			remaining: {
-				amount: remaining ?? 0,
-				currencyCode: currency
-			},
-			qualified: qualified ?? false
-		}
-	} : null);
+	const cart = useDataOverride($dataProp) ?? previewCart({
+		threshold,
+		remaining,
+		qualified,
+		itemsTotal
+	}, currency);
 	const fsp = cart?.freeShippingProgress;
 	if (!cart || fsp == null) return null;
-	const parsedThreshold = fsp.threshold != null ? Number(fsp.threshold.amount) : null;
-	const cartTotalAmount = Number(cart.total?.amount ?? 0);
-	const thresholdAmount = parsedThreshold != null && Number.isFinite(parsedThreshold) && parsedThreshold > 0 ? parsedThreshold : null;
-	const isQualified = fsp.qualified || thresholdAmount != null && cartTotalAmount >= thresholdAmount;
-	const liveRemaining = isQualified || thresholdAmount == null ? 0 : Math.max(thresholdAmount - cartTotalAmount, 0);
-	const value = {
-		isQualified,
-		fill: isQualified ? 1 : thresholdAmount != null ? clamp01(cartTotalAmount / thresholdAmount) : 0,
-		liveRemaining
-	};
+	const { isQualified, fill, liveRemaining } = computeProgress(fsp, itemsSubtotal(cart), usableThreshold(fsp.threshold));
 	return /* @__PURE__ */ jsx(FreeShippingProgressContext, {
-		value,
+		value: {
+			isQualified,
+			fill,
+			liveRemaining
+		},
 		children: /* @__PURE__ */ jsx("div", {
 			...props,
 			className,

package/dist/matter/free-shipping-progress/free-shipping-progress.js.map

@@ -1 +1 @@
-{"version":3,"file":"free-shipping-progress.js","names":[],"sources":["../../../src/matter/free-shipping-progress/free-shipping-progress.tsx"],"sourcesContent":["'use client';\n\nimport { defineComponent } from '@vtex/fs-core';\nimport { type ComponentPropsWithRef, createContext, useContext } from 'react';\nimport { Meter } from '../../particles/meter/meter.js';\nimport { useStorefrontContext } from '../../sdk/context/storefront-context.js';\nimport { useDataOverride } from '../../sdk/data/data-override-context.js';\n\n// ---------------------------------------------------------------------------\n// Types\n// ---------------------------------------------------------------------------\n\ntype MoneyValue = { amount: number | string; currencyCode: string };\n\ntype FreeShippingProgressData = {\n  cart?: {\n    id: string;\n    total?: MoneyValue | null;\n    freeShippingProgress?: {\n      threshold: MoneyValue | null;\n      remaining: MoneyValue;\n      qualified: boolean;\n    } | null;\n  } | null;\n};\n\ntype FreeShippingProgressContextValue = {\n  isQualified: boolean;\n  fill: number;\n  liveRemaining: number;\n};\n\nexport type FreeShippingProgressRootProps = ComponentPropsWithRef<'div'> & {\n  threshold?: number;\n  remaining?: number;\n  qualified?: boolean;\n  cartTotal?: number;\n  $data?: FreeShippingProgressData['cart'] | null;\n};\n\nexport type FreeShippingProgressBarProps = ComponentPropsWithRef<'div'>;\nexport type FreeShippingProgressMessageProps = ComponentPropsWithRef<'div'> & {\n  label?: string;\n  qualifiedLabel?: string;\n};\n\n// ---------------------------------------------------------------------------\n// GraphQL Fragment — narrow cart slice (total + freeShippingProgress)\n// ---------------------------------------------------------------------------\n\nconst fragment = /* GraphQL */ `\n  fragment FreeShippingProgressData on Query {\n    cart {\n      id\n      total {\n        amount\n        currencyCode\n      }\n      freeShippingProgress {\n        threshold {\n          amount\n          currencyCode\n        }\n        remaining {\n          amount\n          currencyCode\n        }\n        qualified\n      }\n    }\n  }\n`;\n\n// ---------------------------------------------------------------------------\n// Context\n// ---------------------------------------------------------------------------\n\nconst FSP_CONTEXT_UNSET = Symbol('FreeShippingProgressContextUnset');\n\nconst FreeShippingProgressContext = createContext<FreeShippingProgressContextValue | typeof FSP_CONTEXT_UNSET>(\n  FSP_CONTEXT_UNSET,\n);\n\nfunction useFreeShippingProgress(): FreeShippingProgressContextValue {\n  const ctx = useContext(FreeShippingProgressContext);\n  if (ctx === FSP_CONTEXT_UNSET) {\n    throw new Error('useFreeShippingProgress() must be used inside a <FreeShippingProgressRoot> subtree.');\n  }\n  return ctx;\n}\n\n// ---------------------------------------------------------------------------\n// Helpers\n// ---------------------------------------------------------------------------\n\nfunction formatCurrency(value: number, locale: string, currency: string): string {\n  return new Intl.NumberFormat(locale, { style: 'currency', currency }).format(value);\n}\n\nfunction clamp01(value: number): number {\n  return Math.min(Math.max(value, 0), 1);\n}\n\n// ---------------------------------------------------------------------------\n// Definitions\n// ---------------------------------------------------------------------------\n\nexport const FreeShippingProgressRootDefinition = defineComponent<FreeShippingProgressRootProps>({\n  name: 'FreeShippingProgressRoot',\n  importPath: '@vtex/faststore/components',\n  component: FreeShippingProgressRoot,\n  fragment,\n  fetchStrategy: 'reactive',\n  editor: { label: 'Free Shipping Progress', category: 'commerce' },\n  schema: {},\n  guideline:\n    'Free-shipping progress bar for the top of a cart/mini-cart drawer: shows how much more to spend for free shipping and flips to an earned state when met. Renders nothing until a destination and an eligible promotion exist (self-hides on null). See free-shipping-progress.md.',\n});\n\nexport const FreeShippingProgressBarDefinition = defineComponent<FreeShippingProgressBarProps>({\n  name: 'FreeShippingProgressBar',\n  importPath: '@vtex/faststore/components',\n  component: FreeShippingProgressBar,\n  editor: { label: 'Free Shipping Progress Bar', category: 'commerce' },\n  schema: {},\n  guideline:\n    'Meter bar that fills toward the free-shipping goal, full when earned. Must be inside FreeShippingProgressRoot. See free-shipping-progress.md.',\n});\n\nexport const FreeShippingProgressMessageDefinition = defineComponent<FreeShippingProgressMessageProps>({\n  name: 'FreeShippingProgressMessage',\n  importPath: '@vtex/faststore/components',\n  component: FreeShippingProgressMessage,\n  editor: { label: 'Free Shipping Progress Message', category: 'commerce' },\n  schema: {\n    label: { type: 'string', default: 'faltam {value} para frete grátis', label: 'Below-threshold Label' },\n    qualifiedLabel: { type: 'string', default: 'você ganhou frete grátis!', label: 'Qualified Label' },\n  },\n  guideline:\n    'Below-threshold vs earned copy, front-formatted from the active storefront context. Must be inside FreeShippingProgressRoot. See free-shipping-progress.md.',\n});\n\n// ---------------------------------------------------------------------------\n// Implementations\n// ---------------------------------------------------------------------------\n\nexport function FreeShippingProgressRoot({\n  threshold,\n  remaining,\n  qualified,\n  cartTotal,\n  $data: $dataProp,\n  className,\n  children,\n  ...props\n}: FreeShippingProgressRootProps) {\n  // Only the synthesized preview cart below needs it; the leaves read the context where they format.\n  const { currency } = useStorefrontContext();\n  const $data = useDataOverride($dataProp);\n\n  // Story / presentational overrides synthesize the field when no live cart is present.\n  const cart =\n    $data ??\n    (qualified !== undefined || threshold !== undefined || remaining !== undefined || cartTotal !== undefined\n      ? {\n          id: 'preview',\n          total: { amount: cartTotal ?? 0, currencyCode: currency },\n          freeShippingProgress: {\n            threshold: threshold != null ? { amount: threshold, currencyCode: currency } : null,\n            remaining: { amount: remaining ?? 0, currencyCode: currency },\n            qualified: qualified ?? false,\n          },\n        }\n      : null);\n\n  const fsp = cart?.freeShippingProgress;\n  if (!cart || fsp == null) return null;\n\n  const parsedThreshold = fsp.threshold != null ? Number(fsp.threshold.amount) : null;\n  const cartTotalAmount = Number(cart.total?.amount ?? 0);\n  // Usable threshold: present, finite, positive. Null/NaN/zero → no fill, no remaining.\n  const thresholdAmount =\n    parsedThreshold != null && Number.isFinite(parsedThreshold) && parsedThreshold > 0 ? parsedThreshold : null;\n\n  const isQualified = fsp.qualified || (thresholdAmount != null && cartTotalAmount >= thresholdAmount);\n  const liveRemaining = isQualified || thresholdAmount == null ? 0 : Math.max(thresholdAmount - cartTotalAmount, 0);\n  const fill = isQualified ? 1 : thresholdAmount != null ? clamp01(cartTotalAmount / thresholdAmount) : 0;\n\n  const value: FreeShippingProgressContextValue = { isQualified, fill, liveRemaining };\n\n  return (\n    <FreeShippingProgressContext value={value}>\n      <div {...props} className={className} data-fs-free-shipping-progress-root=\"\">\n        {children}\n      </div>\n    </FreeShippingProgressContext>\n  );\n}\n\nexport function FreeShippingProgressBar({ className, ...props }: FreeShippingProgressBarProps) {\n  const { fill, isQualified, liveRemaining } = useFreeShippingProgress();\n  const { locale, currency } = useStorefrontContext();\n  const ariaValueText = isQualified\n    ? 'frete grátis conquistado'\n    : `${formatCurrency(liveRemaining, locale, currency)} restantes para frete grátis`;\n\n  return (\n    <Meter.Root\n      {...props}\n      value={Math.round(fill * 100)}\n      min={0}\n      max={100}\n      getAriaValueText={() => ariaValueText}\n      className={className}\n      data-fs-free-shipping-progress-bar=\"\"\n    >\n      <Meter.Track>\n        <Meter.Indicator />\n      </Meter.Track>\n    </Meter.Root>\n  );\n}\n\nexport function FreeShippingProgressMessage({\n  label = 'faltam {value} para frete grátis',\n  qualifiedLabel = 'você ganhou frete grátis!',\n  className,\n  children,\n  ...props\n}: FreeShippingProgressMessageProps) {\n  const { isQualified, liveRemaining } = useFreeShippingProgress();\n  const { locale, currency } = useStorefrontContext();\n  const text = isQualified ? qualifiedLabel : label.replace('{value}', formatCurrency(liveRemaining, locale, currency));\n\n  return (\n    <div {...props} className={className} data-fs-free-shipping-progress-message=\"\">\n      {children ?? text}\n    </div>\n  );\n}\n\nexport const FreeShippingProgress = {\n  Root: FreeShippingProgressRoot,\n  Bar: FreeShippingProgressBar,\n  Message: FreeShippingProgressMessage,\n};\n"],"mappings":";;;;;;;;;AAkDA,MAAM,WAAyB;;;;;;;;;;;;;;;;;;;;;;AA2B/B,MAAM,oBAAoB,OAAO,kCAAkC;AAEnE,MAAM,8BAA8B,cAClC,iBACF;AAEA,SAAS,0BAA4D;CACnE,MAAM,MAAM,WAAW,2BAA2B;CAClD,IAAI,QAAQ,mBACV,MAAM,IAAI,MAAM,qFAAqF;CAEvG,OAAO;AACT;AAMA,SAAS,eAAe,OAAe,QAAgB,UAA0B;CAC/E,OAAO,IAAI,KAAK,aAAa,QAAQ;EAAE,OAAO;EAAY;CAAS,CAAC,CAAC,CAAC,OAAO,KAAK;AACpF;AAEA,SAAS,QAAQ,OAAuB;CACtC,OAAO,KAAK,IAAI,KAAK,IAAI,OAAO,CAAC,GAAG,CAAC;AACvC;AAMA,MAAa,qCAAqC,gBAA+C;CAC/F,MAAM;CACN,YAAY;CACZ,WAAW;CACX;CACA,eAAe;CACf,QAAQ;EAAE,OAAO;EAA0B,UAAU;CAAW;CAChE,QAAQ,CAAC;CACT,WACE;AACJ,CAAC;AAED,MAAa,oCAAoC,gBAA8C;CAC7F,MAAM;CACN,YAAY;CACZ,WAAW;CACX,QAAQ;EAAE,OAAO;EAA8B,UAAU;CAAW;CACpE,QAAQ,CAAC;CACT,WACE;AACJ,CAAC;AAED,MAAa,wCAAwC,gBAAkD;CACrG,MAAM;CACN,YAAY;CACZ,WAAW;CACX,QAAQ;EAAE,OAAO;EAAkC,UAAU;CAAW;CACxE,QAAQ;EACN,OAAO;GAAE,MAAM;GAAU,SAAS;GAAoC,OAAO;EAAwB;EACrG,gBAAgB;GAAE,MAAM;GAAU,SAAS;GAA6B,OAAO;EAAkB;CACnG;CACA,WACE;AACJ,CAAC;AAMD,SAAgB,yBAAyB,EACvC,WACA,WACA,WACA,WACA,OAAO,WACP,WACA,UACA,GAAG,SAC6B;CAEhC,MAAM,EAAE,aAAa,qBAAqB;CAI1C,MAAM,OAHQ,gBAAgB,SAIxB,MACH,cAAc,KAAA,KAAa,cAAc,KAAA,KAAa,cAAc,KAAA,KAAa,cAAc,KAAA,IAC5F;EACE,IAAI;EACJ,OAAO;GAAE,QAAQ,aAAa;GAAG,cAAc;EAAS;EACxD,sBAAsB;GACpB,WAAW,aAAa,OAAO;IAAE,QAAQ;IAAW,cAAc;GAAS,IAAI;GAC/E,WAAW;IAAE,QAAQ,aAAa;IAAG,cAAc;GAAS;GAC5D,WAAW,aAAa;EAC1B;CACF,IACA;CAEN,MAAM,MAAM,MAAM;CAClB,IAAI,CAAC,QAAQ,OAAO,MAAM,OAAO;CAEjC,MAAM,kBAAkB,IAAI,aAAa,OAAO,OAAO,IAAI,UAAU,MAAM,IAAI;CAC/E,MAAM,kBAAkB,OAAO,KAAK,OAAO,UAAU,CAAC;CAEtD,MAAM,kBACJ,mBAAmB,QAAQ,OAAO,SAAS,eAAe,KAAK,kBAAkB,IAAI,kBAAkB;CAEzG,MAAM,cAAc,IAAI,aAAc,mBAAmB,QAAQ,mBAAmB;CACpF,MAAM,gBAAgB,eAAe,mBAAmB,OAAO,IAAI,KAAK,IAAI,kBAAkB,iBAAiB,CAAC;CAGhH,MAAM,QAA0C;EAAE;EAAa,MAFlD,cAAc,IAAI,mBAAmB,OAAO,QAAQ,kBAAkB,eAAe,IAAI;EAEjC;CAAc;CAEnF,OACE,oBAAC,6BAAD;EAAoC;EAClC,UAAA,oBAAC,OAAD;GAAK,GAAI;GAAkB;GAAW,uCAAoC;GACvE;EACE,CAAA;CACsB,CAAA;AAEjC;AAEA,SAAgB,wBAAwB,EAAE,WAAW,GAAG,SAAuC;CAC7F,MAAM,EAAE,MAAM,aAAa,kBAAkB,wBAAwB;CACrE,MAAM,EAAE,QAAQ,aAAa,qBAAqB;CAClD,MAAM,gBAAgB,cAClB,6BACA,GAAG,eAAe,eAAe,QAAQ,QAAQ,EAAE;CAEvD,OACE,oBAAC,MAAM,MAAP;EACE,GAAI;EACJ,OAAO,KAAK,MAAM,OAAO,GAAG;EAC5B,KAAK;EACL,KAAK;EACL,wBAAwB;EACb;EACX,sCAAmC;EAEnC,UAAA,oBAAC,MAAM,OAAP,EAAA,UACE,oBAAC,MAAM,WAAP,CAAkB,CAAA,EACP,CAAA;CACH,CAAA;AAEhB;AAEA,SAAgB,4BAA4B,EAC1C,QAAQ,oCACR,iBAAiB,6BACjB,WACA,UACA,GAAG,SACgC;CACnC,MAAM,EAAE,aAAa,kBAAkB,wBAAwB;CAC/D,MAAM,EAAE,QAAQ,aAAa,qBAAqB;CAClD,MAAM,OAAO,cAAc,iBAAiB,MAAM,QAAQ,WAAW,eAAe,eAAe,QAAQ,QAAQ,CAAC;CAEpH,OACE,oBAAC,OAAD;EAAK,GAAI;EAAkB;EAAW,0CAAuC;EAC1E,UAAA,YAAY;CACV,CAAA;AAET;AAEA,MAAa,uBAAuB;CAClC,MAAM;CACN,KAAK;CACL,SAAS;AACX"}
+{"version":3,"file":"free-shipping-progress.js","names":[],"sources":["../../../src/matter/free-shipping-progress/free-shipping-progress.tsx"],"sourcesContent":["'use client';\n\nimport { defineComponent } from '@vtex/fs-core';\nimport { type ComponentPropsWithRef, createContext, useContext } from 'react';\nimport { Meter } from '../../particles/meter/meter.js';\nimport { useStorefrontContext } from '../../sdk/context/storefront-context.js';\nimport { useDataOverride } from '../../sdk/data/data-override-context.js';\nimport { isFiniteAmount } from '../cart/cart.js';\n\n// ---------------------------------------------------------------------------\n// Types\n// ---------------------------------------------------------------------------\n\ntype MoneyValue = { amount: number | string; currencyCode: string };\n\ntype FreeShippingProgressData = {\n  cart?: {\n    id: string;\n    totalizers?: { id: string; value: MoneyValue }[] | null;\n    freeShippingProgress?: {\n      threshold: MoneyValue | null;\n      remaining: MoneyValue;\n      qualified: boolean;\n    } | null;\n  } | null;\n};\n\ntype FreeShippingProgressContextValue = {\n  isQualified: boolean;\n  fill: number;\n  liveRemaining: number;\n};\n\nexport type FreeShippingProgressRootProps = ComponentPropsWithRef<'div'> & {\n  threshold?: number;\n  remaining?: number;\n  qualified?: boolean;\n  itemsTotal?: number;\n  $data?: FreeShippingProgressData['cart'] | null;\n};\n\nexport type FreeShippingProgressBarProps = ComponentPropsWithRef<'div'>;\nexport type FreeShippingProgressMessageProps = ComponentPropsWithRef<'div'> & {\n  label?: string;\n  qualifiedLabel?: string;\n};\n\n// ---------------------------------------------------------------------------\n// GraphQL Fragment — narrow cart slice (Items totalizer + freeShippingProgress)\n// ---------------------------------------------------------------------------\n\nconst fragment = /* GraphQL */ `\n  fragment FreeShippingProgressData on Query {\n    cart {\n      id\n      totalizers {\n        id\n        value {\n          amount\n          currencyCode\n        }\n      }\n      freeShippingProgress {\n        threshold {\n          amount\n          currencyCode\n        }\n        remaining {\n          amount\n          currencyCode\n        }\n        qualified\n      }\n    }\n  }\n`;\n\n// ---------------------------------------------------------------------------\n// Context\n// ---------------------------------------------------------------------------\n\nconst FSP_CONTEXT_UNSET = Symbol('FreeShippingProgressContextUnset');\n\nconst FreeShippingProgressContext = createContext<FreeShippingProgressContextValue | typeof FSP_CONTEXT_UNSET>(\n  FSP_CONTEXT_UNSET,\n);\n\nfunction useFreeShippingProgress(): FreeShippingProgressContextValue {\n  const ctx = useContext(FreeShippingProgressContext);\n  if (ctx === FSP_CONTEXT_UNSET) {\n    throw new Error('useFreeShippingProgress() must be used inside a <FreeShippingProgressRoot> subtree.');\n  }\n  return ctx;\n}\n\n// ---------------------------------------------------------------------------\n// Helpers\n// ---------------------------------------------------------------------------\n\nfunction formatCurrency(value: number, locale: string, currency: string): string {\n  return new Intl.NumberFormat(locale, { style: 'currency', currency }).format(value);\n}\n\nfunction clamp01(value: number): number {\n  return Math.min(Math.max(value, 0), 1);\n}\n\ntype FreeShippingProgressCart = NonNullable<FreeShippingProgressData['cart']>;\ntype FreeShippingProgressState = NonNullable<FreeShippingProgressCart['freeShippingProgress']>;\n\nfunction previewCart(\n  {\n    threshold,\n    remaining,\n    qualified,\n    itemsTotal,\n  }: Pick<FreeShippingProgressRootProps, 'threshold' | 'remaining' | 'qualified' | 'itemsTotal'>,\n  currency: string,\n): FreeShippingProgressCart | null {\n  if (qualified === undefined && threshold === undefined && remaining === undefined && itemsTotal === undefined) {\n    return null;\n  }\n  return {\n    id: 'preview',\n    totalizers:\n      itemsTotal === undefined ? [] : [{ id: 'Items', value: { amount: itemsTotal, currencyCode: currency } }],\n    freeShippingProgress: {\n      threshold: threshold == null ? null : { amount: threshold, currencyCode: currency },\n      remaining: { amount: remaining ?? threshold ?? 0, currencyCode: currency },\n      qualified: qualified ?? false,\n    },\n  };\n}\n\n// The server measures the Items totalizer, never the grand total (shipping and discounts do not count).\nfunction itemsSubtotal(cart: FreeShippingProgressCart): number | null {\n  const itemsAmount = cart.totalizers?.find((totalizer) => totalizer.id === 'Items')?.value.amount;\n  return isFiniteAmount(itemsAmount) ? Number(itemsAmount) : null;\n}\n\n// Usable threshold: present, finite, positive. Null/NaN/zero → no fill, no remaining.\nfunction usableThreshold(threshold: MoneyValue | null): number | null {\n  if (threshold == null) return null;\n  const parsed = Number(threshold.amount);\n  return Number.isFinite(parsed) && parsed > 0 ? parsed : null;\n}\n\nfunction fillRatio(isQualified: boolean, thresholdAmount: number | null, covered: number): number {\n  if (isQualified) return 1;\n  if (thresholdAmount === null) return 0;\n  return clamp01(covered / thresholdAmount);\n}\n\nfunction computeProgress(\n  fsp: FreeShippingProgressState,\n  items: number | null,\n  thresholdAmount: number | null,\n): FreeShippingProgressContextValue {\n  if (items === null) {\n    // No usable Items amount: show the server's own answer rather than guess.\n    const isQualified = fsp.qualified;\n    const liveRemaining =\n      !isQualified && isFiniteAmount(fsp.remaining.amount) ? Math.max(Number(fsp.remaining.amount), 0) : 0;\n    const fill = fillRatio(isQualified, thresholdAmount, (thresholdAmount ?? 0) - liveRemaining);\n    return { isQualified, fill, liveRemaining };\n  }\n\n  const isQualified = fsp.qualified || (thresholdAmount !== null && items >= thresholdAmount);\n  const liveRemaining = isQualified || thresholdAmount === null ? 0 : Math.max(thresholdAmount - items, 0);\n  return { isQualified, fill: fillRatio(isQualified, thresholdAmount, items), liveRemaining };\n}\n\n// ---------------------------------------------------------------------------\n// Definitions\n// ---------------------------------------------------------------------------\n\nexport const FreeShippingProgressRootDefinition = defineComponent<FreeShippingProgressRootProps>({\n  name: 'FreeShippingProgressRoot',\n  importPath: '@vtex/faststore/components',\n  component: FreeShippingProgressRoot,\n  fragment,\n  fetchStrategy: 'reactive',\n  editor: { label: 'Free Shipping Progress', category: 'commerce' },\n  schema: {},\n  guideline:\n    'Free-shipping progress bar for the top of a cart/mini-cart drawer: shows how much more to spend for free shipping and flips to an earned state when met. Renders nothing until a destination and an eligible promotion exist (self-hides on null). See free-shipping-progress.md.',\n});\n\nexport const FreeShippingProgressBarDefinition = defineComponent<FreeShippingProgressBarProps>({\n  name: 'FreeShippingProgressBar',\n  importPath: '@vtex/faststore/components',\n  component: FreeShippingProgressBar,\n  editor: { label: 'Free Shipping Progress Bar', category: 'commerce' },\n  schema: {},\n  guideline:\n    'Meter bar that fills toward the free-shipping goal, full when earned. Must be inside FreeShippingProgressRoot. See free-shipping-progress.md.',\n});\n\nexport const FreeShippingProgressMessageDefinition = defineComponent<FreeShippingProgressMessageProps>({\n  name: 'FreeShippingProgressMessage',\n  importPath: '@vtex/faststore/components',\n  component: FreeShippingProgressMessage,\n  editor: { label: 'Free Shipping Progress Message', category: 'commerce' },\n  schema: {\n    label: { type: 'string', default: 'faltam {value} para frete grátis', label: 'Below-threshold Label' },\n    qualifiedLabel: { type: 'string', default: 'você ganhou frete grátis!', label: 'Qualified Label' },\n  },\n  guideline:\n    'Below-threshold vs earned copy, front-formatted from the active storefront context. Must be inside FreeShippingProgressRoot. See free-shipping-progress.md.',\n});\n\n// ---------------------------------------------------------------------------\n// Implementations\n// ---------------------------------------------------------------------------\n\nexport function FreeShippingProgressRoot({\n  threshold,\n  remaining,\n  qualified,\n  itemsTotal,\n  $data: $dataProp,\n  className,\n  children,\n  ...props\n}: FreeShippingProgressRootProps) {\n  // Only the synthesized preview cart below needs it; the leaves read the context where they format.\n  const { currency } = useStorefrontContext();\n  const $data = useDataOverride($dataProp);\n\n  // Story / presentational overrides synthesize the field when no live cart is present.\n  const cart = $data ?? previewCart({ threshold, remaining, qualified, itemsTotal }, currency);\n\n  const fsp = cart?.freeShippingProgress;\n  if (!cart || fsp == null) return null;\n\n  const { isQualified, fill, liveRemaining } = computeProgress(\n    fsp,\n    itemsSubtotal(cart),\n    usableThreshold(fsp.threshold),\n  );\n\n  const value: FreeShippingProgressContextValue = { isQualified, fill, liveRemaining };\n\n  return (\n    <FreeShippingProgressContext value={value}>\n      <div {...props} className={className} data-fs-free-shipping-progress-root=\"\">\n        {children}\n      </div>\n    </FreeShippingProgressContext>\n  );\n}\n\nexport function FreeShippingProgressBar({ className, ...props }: FreeShippingProgressBarProps) {\n  const { fill, isQualified, liveRemaining } = useFreeShippingProgress();\n  const { locale, currency } = useStorefrontContext();\n  const ariaValueText = isQualified\n    ? 'frete grátis conquistado'\n    : `${formatCurrency(liveRemaining, locale, currency)} restantes para frete grátis`;\n\n  return (\n    <Meter.Root\n      {...props}\n      value={Math.round(fill * 100)}\n      min={0}\n      max={100}\n      getAriaValueText={() => ariaValueText}\n      className={className}\n      data-fs-free-shipping-progress-bar=\"\"\n    >\n      <Meter.Track>\n        <Meter.Indicator />\n      </Meter.Track>\n    </Meter.Root>\n  );\n}\n\nexport function FreeShippingProgressMessage({\n  label = 'faltam {value} para frete grátis',\n  qualifiedLabel = 'você ganhou frete grátis!',\n  className,\n  children,\n  ...props\n}: FreeShippingProgressMessageProps) {\n  const { isQualified, liveRemaining } = useFreeShippingProgress();\n  const { locale, currency } = useStorefrontContext();\n  const text = isQualified ? qualifiedLabel : label.replace('{value}', formatCurrency(liveRemaining, locale, currency));\n\n  return (\n    <div {...props} className={className} data-fs-free-shipping-progress-message=\"\">\n      {children ?? text}\n    </div>\n  );\n}\n\nexport const FreeShippingProgress = {\n  Root: FreeShippingProgressRoot,\n  Bar: FreeShippingProgressBar,\n  Message: FreeShippingProgressMessage,\n};\n"],"mappings":"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"}