@asteby/storefront-react 0.9.0 → 0.11.0

package/dist/checkout.d.cts

@@ -0,0 +1,212 @@
+import * as react from 'react';
+import { ReactNode } from 'react';
+import { ShippingRate, PickupOption, Money } from '@asteby/storefront';
+
+type BrandMarkProps = {
+    /** Provider identifier (`fedex`, `oxxo`, `mercadopago`, `7eleven`…). Unknown keys get a neutral monogram. */
+    brand: string | null | undefined;
+    /** Licensed logo sent by the provider (`PaymentPoint.logo_url`…). Only `https:`; it wins over the bundled logo and the badge. */
+    logoUrl?: string | null;
+    /** Height in px of the box. Badges are 3:2 (width = 1.5 × height); real logos get a width that follows their shape. Default 24. */
+    size?: number;
+    /**
+     * Accessible name. Omit it when the brand name is already written next to the mark (the usual case): the mark is then
+     * decorative (`aria-hidden`).
+     */
+    title?: string;
+    className?: string;
+};
+/** What the mark ended up drawing: the provider's logo, the bundled real logo, or the typographic fallback. */
+type BrandMarkSource = 'provider' | 'logo' | 'badge';
+/**
+ * The mark of a carrier, card network, wallet or cash point. Precedence: the provider's `logoUrl` (https, lazy) > the
+ * real logo bundled with the package (inline data URI: no network request, same size on the server and in the browser)
+ * > a typographic badge in the brand color for the brands without an available logo.
+ *
+ * Logos are never recolored; they sit on a white plate with a hairline (`--sf-brand-mark-ring`, plate color
+ * `--sf-brand-mark-plate`) so they keep their contrast on light and dark themes. The element carries
+ * `data-sf-brand-mark="<key>"` and `data-sf-brand-source="provider|logo|badge"`.
+ */
+declare function BrandMark({ brand, logoUrl, size, title, className }: BrandMarkProps): react.JSX.Element;
+
+type LogoAsset = {
+    src: string;
+    ar: number;
+    mono: boolean;
+};
+
+/**
+ * Shared catalog of the brands a checkout names: parcel carriers, card networks, wallets and cash payment points.
+ *
+ * Keys are the stable identifiers the providers already send (`ShippingRate.carrier` of Skydropx / Envía, the
+ * `PaymentPoint.payment_point` or `id` of the payment addon, a `PaymentMethod.key`). Nothing here decides what a shop
+ * offers: the server lists the rates and methods; this only gives each one its commercial name and a mark.
+ *
+ * Marks are drawn by `<BrandMark>` with this precedence: the provider's `logo_url` > the real logo bundled in
+ * `brands/assets` (inline data URI, no request; provenance in `brands/LOGOS.md`) > a typographic badge (brand color +
+ * short wordmark) for the brands without an available logo. The `bg`/`fg` colors here are close approximations of each
+ * brand's public color and only paint that fallback badge.
+ */
+
+type BrandKind = 'carrier' | 'card' | 'wallet' | 'cash' | 'bank';
+type Brand = {
+    key: string;
+    /** Commercial name, as the brand writes it. */
+    name: string;
+    kind: BrandKind;
+    /** Badge background. */
+    bg: string;
+    /** Badge text color (AA on `bg`). */
+    fg: string;
+    /** Short wordmark drawn in the badge (`\n` = two lines). Default: `name`. */
+    mark?: string;
+    /** Special drawings instead of a wordmark. */
+    shape?: 'mastercard';
+};
+/** `"FedEx México"`, `"fedex_mx"` and `"FEDEX"` all become `fedex`. Lowercase ASCII letters and digits only. */
+declare function brandKey(raw: string | null | undefined): string;
+/** Catalog entry for a provider identifier, or `null` when the brand is not in the catalog. */
+declare function findBrand(raw: string | null | undefined): Brand | null;
+/**
+ * Commercial name for a provider identifier: the catalog's (`fedex` → "FedEx") or, for an unknown one, the identifier
+ * in title case (`"envios_rapidos"` → "Envios Rapidos"). `null` for an empty input.
+ */
+declare function brandName(raw: string | null | undefined): string | null;
+/** Every brand of the catalog (for docs, previews and tests). */
+declare function listBrands(kind?: BrandKind): Brand[];
+/** Real logo bundled for a provider identifier (inline data URI), or `null` when the brand only has the fallback badge. */
+declare function brandLogo(raw: string | null | undefined): (LogoAsset & {
+    key: string;
+}) | null;
+
+/**
+ * Pure helpers for the "Delivery" step: how to name a carrier rate, its arrival time, which rate is the cheapest or the
+ * fastest, and one human note for the quote deadline. No amounts are computed: `cost` is shown as the server sends it;
+ * comparing two costs to flag the cheapest is the only arithmetic.
+ */
+
+type DeliveryMessages = {
+    /** `{n}` = business days. */
+    etaOne: string;
+    etaMany: string;
+    /** `{min}` / `{max}` = business days. */
+    etaRange: string;
+    etaUpTo: string;
+    etaFrom: string;
+    cheapest: string;
+    fastest: string;
+    free: string;
+    pickupTitle: string;
+    /** Quote deadline, `{time}` = local time. */
+    quoteToday: string;
+    quoteTomorrow: string;
+    /** `{date}` = short date + time. */
+    quoteLater: string;
+    quoteSoon: string;
+    partial: string;
+    loading: string;
+    /** The quote expired or changed and the rates were reloaded. */
+    requoted: string;
+};
+/** Messages for a locale (`es*` default, `en*`), with optional overrides. */
+declare function deliveryMessages(locale?: string | null, overrides?: Partial<DeliveryMessages> | null): DeliveryMessages;
+/** Commercial carrier name of a rate (`fedex` → "FedEx"); `null` without carrier. */
+declare function rateCarrier(rate: Pick<ShippingRate, 'carrier'>): string | null;
+/**
+ * Service name without the carrier repeated: "FedEx Express Saver" with carrier `fedex` → "Express Saver". Falls back
+ * to the title when stripping would leave nothing.
+ */
+declare function rateService(rate: Pick<ShippingRate, 'title' | 'carrier'>): string;
+/** Arrival time of a rate: business days from the provider, else the server `eta` text as is. */
+declare function rateEta(rate: Pick<ShippingRate, 'eta' | 'eta_days_min' | 'eta_days_max'>, messages?: DeliveryMessages): string | null;
+type RateBadge = 'cheapest' | 'fastest';
+/**
+ * Badges per rate id. Only with two or more rates, only when one rate is strictly the cheapest (same currency) or
+ * strictly the fastest: a tie gets no badge, so the badge always tells the buyer something.
+ */
+declare function rateBadges(rates: readonly ShippingRate[]): Map<string, RateBadge[]>;
+/** Earliest `expires_at` of the rates (the deadline of the whole list), or `null`. */
+declare function quoteDeadline(rates: readonly Pick<ShippingRate, 'expires_at'>[]): Date | null;
+type QuoteNote = {
+    text: string;
+    soon: boolean;
+};
+/**
+ * One human note for the quote deadline, in the buyer's time zone (or `timeZone`): "valid until 9:39 p.m.", "until
+ * tomorrow at…", "until Oct 24, …", or "expire soon" within `soonMinutes` (default 15). `null` when already past.
+ */
+declare function quoteNote(deadline: Date | null, opts?: {
+    locale?: string;
+    now?: Date;
+    timeZone?: string;
+    soonMinutes?: number;
+    messages?: DeliveryMessages;
+}): QuoteNote | null;
+/**
+ * `true` when saving a shipping rate failed because the quote expired or the rates changed, so the shop should reload
+ * the rates (and keep the address) instead of showing a generic failure. Recognizes the explicit codes
+ * (`quote_expired`, `rate_expired`…, any status), a `409`, and the generic `422` on the rate field that older servers
+ * answer when the provider re-quoted with new ids. 5xx and other 4xx stay real failures.
+ */
+declare function isQuoteChange(err: {
+    status?: number;
+    code?: string | null;
+    field?: string | null;
+} | null | undefined): boolean;
+/**
+ * The rate of a fresh quote that matches the one the buyer had chosen (same carrier and service), so a re-quote keeps
+ * the choice even though the provider issued new ids. `null` when that service is no longer offered.
+ */
+declare function matchRate<R extends Pick<ShippingRate, 'id' | 'carrier' | 'service_code' | 'title'>>(previous: Pick<ShippingRate, 'carrier' | 'service_code' | 'title'> | null | undefined, rates: readonly R[]): R | null;
+
+type DeliveryOptionsClassNames = Partial<Record<'root' | 'option' | 'radio' | 'mark' | 'body' | 'title' | 'carrier' | 'service' | 'eta' | 'badges' | 'badge' | 'price' | 'free' | 'note' | 'partial' | 'skeleton', string>>;
+type DeliveryOptionsProps = {
+    rates: readonly ShippingRate[];
+    pickup?: readonly PickupOption[];
+    /** Radio group name. Default `delivery_choice`. */
+    name?: string;
+    /** Form value of a rate. Default `rate:<id>`. */
+    rateValue?: (rate: ShippingRate) => string;
+    /** Form value of a pickup branch. Default `pickup:<branch_id>`. */
+    pickupValue?: (branch: PickupOption) => string;
+    /** Uncontrolled preselection. Default: the first rate. `null`: nothing preselected. */
+    defaultValue?: string | null;
+    /** Controlled value (use with `onValueChange`). */
+    value?: string;
+    onValueChange?: (value: string) => void;
+    /** Some provider did not answer (`DeliveryOptions.partial`): one neutral note above the list. */
+    partial?: boolean;
+    /** The previous quote expired or changed and these rates are fresh: one status note above the list. */
+    requoted?: boolean;
+    /** Rates are being quoted again: skeleton rows (no rates yet) or the current rows dimmed, `aria-busy`. */
+    loading?: boolean;
+    /** Quote deadline note: `always` (default), only when it is `soon`, or `never`. */
+    quoteNote?: 'always' | 'soon' | 'never';
+    /** Time zone of the note. Default: the buyer's browser. */
+    timeZone?: string;
+    /** Show the carrier marks. Default true. */
+    marks?: boolean;
+    /** Cheapest / fastest badges. Default true. */
+    badges?: boolean;
+    required?: boolean;
+    locale?: string;
+    messages?: Partial<DeliveryMessages>;
+    renderAmount?: (amount: Money) => ReactNode;
+    classNames?: DeliveryOptionsClassNames;
+    /** `data-testid` of every radio. */
+    testId?: string;
+    /** Rows the shop renders before the rates (e.g. "home delivery, rates after the address"). */
+    children?: ReactNode;
+};
+/**
+ * The rates and pickup branches of "Delivery" as native radios: carrier mark and commercial name, readable service,
+ * arrival time, cheapest / fastest badges, price as the server sends it, and ONE note for the quote deadline in the
+ * buyer's time zone. Works without JavaScript (plain radios in the page form); the note appears after hydration in a
+ * reserved line, so it never shifts the layout.
+ *
+ * Wrap it in the shop's own `<fieldset><legend>`. Style it with `classNames` and/or the default sheet
+ * `@asteby/storefront-react/checkout.css`.
+ */
+declare function DeliveryOptions(props: DeliveryOptionsProps): react.JSX.Element;
+
+export { type Brand, type BrandKind, BrandMark, type BrandMarkProps, type BrandMarkSource, type DeliveryMessages, DeliveryOptions, type DeliveryOptionsClassNames, type DeliveryOptionsProps, type QuoteNote, type RateBadge, brandKey, brandLogo, brandName, deliveryMessages, findBrand, isQuoteChange, listBrands, matchRate, quoteDeadline, quoteNote, rateBadges, rateCarrier, rateEta, rateService };

package/dist/checkout.d.ts

@@ -0,0 +1,212 @@
+import * as react from 'react';
+import { ReactNode } from 'react';
+import { ShippingRate, PickupOption, Money } from '@asteby/storefront';
+
+type BrandMarkProps = {
+    /** Provider identifier (`fedex`, `oxxo`, `mercadopago`, `7eleven`…). Unknown keys get a neutral monogram. */
+    brand: string | null | undefined;
+    /** Licensed logo sent by the provider (`PaymentPoint.logo_url`…). Only `https:`; it wins over the bundled logo and the badge. */
+    logoUrl?: string | null;
+    /** Height in px of the box. Badges are 3:2 (width = 1.5 × height); real logos get a width that follows their shape. Default 24. */
+    size?: number;
+    /**
+     * Accessible name. Omit it when the brand name is already written next to the mark (the usual case): the mark is then
+     * decorative (`aria-hidden`).
+     */
+    title?: string;
+    className?: string;
+};
+/** What the mark ended up drawing: the provider's logo, the bundled real logo, or the typographic fallback. */
+type BrandMarkSource = 'provider' | 'logo' | 'badge';
+/**
+ * The mark of a carrier, card network, wallet or cash point. Precedence: the provider's `logoUrl` (https, lazy) > the
+ * real logo bundled with the package (inline data URI: no network request, same size on the server and in the browser)
+ * > a typographic badge in the brand color for the brands without an available logo.
+ *
+ * Logos are never recolored; they sit on a white plate with a hairline (`--sf-brand-mark-ring`, plate color
+ * `--sf-brand-mark-plate`) so they keep their contrast on light and dark themes. The element carries
+ * `data-sf-brand-mark="<key>"` and `data-sf-brand-source="provider|logo|badge"`.
+ */
+declare function BrandMark({ brand, logoUrl, size, title, className }: BrandMarkProps): react.JSX.Element;
+
+type LogoAsset = {
+    src: string;
+    ar: number;
+    mono: boolean;
+};
+
+/**
+ * Shared catalog of the brands a checkout names: parcel carriers, card networks, wallets and cash payment points.
+ *
+ * Keys are the stable identifiers the providers already send (`ShippingRate.carrier` of Skydropx / Envía, the
+ * `PaymentPoint.payment_point` or `id` of the payment addon, a `PaymentMethod.key`). Nothing here decides what a shop
+ * offers: the server lists the rates and methods; this only gives each one its commercial name and a mark.
+ *
+ * Marks are drawn by `<BrandMark>` with this precedence: the provider's `logo_url` > the real logo bundled in
+ * `brands/assets` (inline data URI, no request; provenance in `brands/LOGOS.md`) > a typographic badge (brand color +
+ * short wordmark) for the brands without an available logo. The `bg`/`fg` colors here are close approximations of each
+ * brand's public color and only paint that fallback badge.
+ */
+
+type BrandKind = 'carrier' | 'card' | 'wallet' | 'cash' | 'bank';
+type Brand = {
+    key: string;
+    /** Commercial name, as the brand writes it. */
+    name: string;
+    kind: BrandKind;
+    /** Badge background. */
+    bg: string;
+    /** Badge text color (AA on `bg`). */
+    fg: string;
+    /** Short wordmark drawn in the badge (`\n` = two lines). Default: `name`. */
+    mark?: string;
+    /** Special drawings instead of a wordmark. */
+    shape?: 'mastercard';
+};
+/** `"FedEx México"`, `"fedex_mx"` and `"FEDEX"` all become `fedex`. Lowercase ASCII letters and digits only. */
+declare function brandKey(raw: string | null | undefined): string;
+/** Catalog entry for a provider identifier, or `null` when the brand is not in the catalog. */
+declare function findBrand(raw: string | null | undefined): Brand | null;
+/**
+ * Commercial name for a provider identifier: the catalog's (`fedex` → "FedEx") or, for an unknown one, the identifier
+ * in title case (`"envios_rapidos"` → "Envios Rapidos"). `null` for an empty input.
+ */
+declare function brandName(raw: string | null | undefined): string | null;
+/** Every brand of the catalog (for docs, previews and tests). */
+declare function listBrands(kind?: BrandKind): Brand[];
+/** Real logo bundled for a provider identifier (inline data URI), or `null` when the brand only has the fallback badge. */
+declare function brandLogo(raw: string | null | undefined): (LogoAsset & {
+    key: string;
+}) | null;
+
+/**
+ * Pure helpers for the "Delivery" step: how to name a carrier rate, its arrival time, which rate is the cheapest or the
+ * fastest, and one human note for the quote deadline. No amounts are computed: `cost` is shown as the server sends it;
+ * comparing two costs to flag the cheapest is the only arithmetic.
+ */
+
+type DeliveryMessages = {
+    /** `{n}` = business days. */
+    etaOne: string;
+    etaMany: string;
+    /** `{min}` / `{max}` = business days. */
+    etaRange: string;
+    etaUpTo: string;
+    etaFrom: string;
+    cheapest: string;
+    fastest: string;
+    free: string;
+    pickupTitle: string;
+    /** Quote deadline, `{time}` = local time. */
+    quoteToday: string;
+    quoteTomorrow: string;
+    /** `{date}` = short date + time. */
+    quoteLater: string;
+    quoteSoon: string;
+    partial: string;
+    loading: string;
+    /** The quote expired or changed and the rates were reloaded. */
+    requoted: string;
+};
+/** Messages for a locale (`es*` default, `en*`), with optional overrides. */
+declare function deliveryMessages(locale?: string | null, overrides?: Partial<DeliveryMessages> | null): DeliveryMessages;
+/** Commercial carrier name of a rate (`fedex` → "FedEx"); `null` without carrier. */
+declare function rateCarrier(rate: Pick<ShippingRate, 'carrier'>): string | null;
+/**
+ * Service name without the carrier repeated: "FedEx Express Saver" with carrier `fedex` → "Express Saver". Falls back
+ * to the title when stripping would leave nothing.
+ */
+declare function rateService(rate: Pick<ShippingRate, 'title' | 'carrier'>): string;
+/** Arrival time of a rate: business days from the provider, else the server `eta` text as is. */
+declare function rateEta(rate: Pick<ShippingRate, 'eta' | 'eta_days_min' | 'eta_days_max'>, messages?: DeliveryMessages): string | null;
+type RateBadge = 'cheapest' | 'fastest';
+/**
+ * Badges per rate id. Only with two or more rates, only when one rate is strictly the cheapest (same currency) or
+ * strictly the fastest: a tie gets no badge, so the badge always tells the buyer something.
+ */
+declare function rateBadges(rates: readonly ShippingRate[]): Map<string, RateBadge[]>;
+/** Earliest `expires_at` of the rates (the deadline of the whole list), or `null`. */
+declare function quoteDeadline(rates: readonly Pick<ShippingRate, 'expires_at'>[]): Date | null;
+type QuoteNote = {
+    text: string;
+    soon: boolean;
+};
+/**
+ * One human note for the quote deadline, in the buyer's time zone (or `timeZone`): "valid until 9:39 p.m.", "until
+ * tomorrow at…", "until Oct 24, …", or "expire soon" within `soonMinutes` (default 15). `null` when already past.
+ */
+declare function quoteNote(deadline: Date | null, opts?: {
+    locale?: string;
+    now?: Date;
+    timeZone?: string;
+    soonMinutes?: number;
+    messages?: DeliveryMessages;
+}): QuoteNote | null;
+/**
+ * `true` when saving a shipping rate failed because the quote expired or the rates changed, so the shop should reload
+ * the rates (and keep the address) instead of showing a generic failure. Recognizes the explicit codes
+ * (`quote_expired`, `rate_expired`…, any status), a `409`, and the generic `422` on the rate field that older servers
+ * answer when the provider re-quoted with new ids. 5xx and other 4xx stay real failures.
+ */
+declare function isQuoteChange(err: {
+    status?: number;
+    code?: string | null;
+    field?: string | null;
+} | null | undefined): boolean;
+/**
+ * The rate of a fresh quote that matches the one the buyer had chosen (same carrier and service), so a re-quote keeps
+ * the choice even though the provider issued new ids. `null` when that service is no longer offered.
+ */
+declare function matchRate<R extends Pick<ShippingRate, 'id' | 'carrier' | 'service_code' | 'title'>>(previous: Pick<ShippingRate, 'carrier' | 'service_code' | 'title'> | null | undefined, rates: readonly R[]): R | null;
+
+type DeliveryOptionsClassNames = Partial<Record<'root' | 'option' | 'radio' | 'mark' | 'body' | 'title' | 'carrier' | 'service' | 'eta' | 'badges' | 'badge' | 'price' | 'free' | 'note' | 'partial' | 'skeleton', string>>;
+type DeliveryOptionsProps = {
+    rates: readonly ShippingRate[];
+    pickup?: readonly PickupOption[];
+    /** Radio group name. Default `delivery_choice`. */
+    name?: string;
+    /** Form value of a rate. Default `rate:<id>`. */
+    rateValue?: (rate: ShippingRate) => string;
+    /** Form value of a pickup branch. Default `pickup:<branch_id>`. */
+    pickupValue?: (branch: PickupOption) => string;
+    /** Uncontrolled preselection. Default: the first rate. `null`: nothing preselected. */
+    defaultValue?: string | null;
+    /** Controlled value (use with `onValueChange`). */
+    value?: string;
+    onValueChange?: (value: string) => void;
+    /** Some provider did not answer (`DeliveryOptions.partial`): one neutral note above the list. */
+    partial?: boolean;
+    /** The previous quote expired or changed and these rates are fresh: one status note above the list. */
+    requoted?: boolean;
+    /** Rates are being quoted again: skeleton rows (no rates yet) or the current rows dimmed, `aria-busy`. */
+    loading?: boolean;
+    /** Quote deadline note: `always` (default), only when it is `soon`, or `never`. */
+    quoteNote?: 'always' | 'soon' | 'never';
+    /** Time zone of the note. Default: the buyer's browser. */
+    timeZone?: string;
+    /** Show the carrier marks. Default true. */
+    marks?: boolean;
+    /** Cheapest / fastest badges. Default true. */
+    badges?: boolean;
+    required?: boolean;
+    locale?: string;
+    messages?: Partial<DeliveryMessages>;
+    renderAmount?: (amount: Money) => ReactNode;
+    classNames?: DeliveryOptionsClassNames;
+    /** `data-testid` of every radio. */
+    testId?: string;
+    /** Rows the shop renders before the rates (e.g. "home delivery, rates after the address"). */
+    children?: ReactNode;
+};
+/**
+ * The rates and pickup branches of "Delivery" as native radios: carrier mark and commercial name, readable service,
+ * arrival time, cheapest / fastest badges, price as the server sends it, and ONE note for the quote deadline in the
+ * buyer's time zone. Works without JavaScript (plain radios in the page form); the note appears after hydration in a
+ * reserved line, so it never shifts the layout.
+ *
+ * Wrap it in the shop's own `<fieldset><legend>`. Style it with `classNames` and/or the default sheet
+ * `@asteby/storefront-react/checkout.css`.
+ */
+declare function DeliveryOptions(props: DeliveryOptionsProps): react.JSX.Element;
+
+export { type Brand, type BrandKind, BrandMark, type BrandMarkProps, type BrandMarkSource, type DeliveryMessages, DeliveryOptions, type DeliveryOptionsClassNames, type DeliveryOptionsProps, type QuoteNote, type RateBadge, brandKey, brandLogo, brandName, deliveryMessages, findBrand, isQuoteChange, listBrands, matchRate, quoteDeadline, quoteNote, rateBadges, rateCarrier, rateEta, rateService };

package/dist/checkout.js

@@ -0,0 +1,243 @@
+import { brandName, BrandMark } from './chunk-3ZJTDFHE.js';
+export { BrandMark, brandKey, brandLogo, brandName, findBrand, listBrands } from './chunk-3ZJTDFHE.js';
+import { useResolvedLocale } from './chunk-T52H5HL3.js';
+import './chunk-DQBL2DFJ.js';
+import { useMemo, useSyncExternalStore } from 'react';
+import { formatMoney } from '@asteby/storefront';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+
+// src/checkout/delivery.ts
+var ES = {
+  etaOne: "Llega en 1 d\xEDa h\xE1bil",
+  etaMany: "Llega en {n} d\xEDas h\xE1biles",
+  etaRange: "Llega en {min} a {max} d\xEDas h\xE1biles",
+  etaUpTo: "Llega en m\xE1ximo {max} d\xEDas h\xE1biles",
+  etaFrom: "Llega en {min} d\xEDas h\xE1biles o m\xE1s",
+  cheapest: "M\xE1s econ\xF3mico",
+  fastest: "M\xE1s r\xE1pido",
+  free: "Gratis",
+  pickupTitle: "Recoger en {name}",
+  quoteToday: "Precios de env\xEDo vigentes hasta las {time}.",
+  quoteTomorrow: "Precios de env\xEDo vigentes hasta ma\xF1ana a las {time}.",
+  quoteLater: "Precios de env\xEDo vigentes hasta el {date}.",
+  quoteSoon: "Los precios de env\xEDo vencen pronto ({time}).",
+  partial: "No pudimos consultar todas las paqueter\xEDas. Estas son las opciones disponibles ahora.",
+  loading: "Buscando opciones de env\xEDo\u2026",
+  requoted: "Las tarifas de env\xEDo cambiaron y ya est\xE1n actualizadas. Revisa tu env\xEDo antes de pagar."
+};
+var EN = {
+  etaOne: "Arrives in 1 business day",
+  etaMany: "Arrives in {n} business days",
+  etaRange: "Arrives in {min} to {max} business days",
+  etaUpTo: "Arrives in up to {max} business days",
+  etaFrom: "Arrives in {min}+ business days",
+  cheapest: "Cheapest",
+  fastest: "Fastest",
+  free: "Free",
+  pickupTitle: "Pick up at {name}",
+  quoteToday: "Shipping prices valid until {time}.",
+  quoteTomorrow: "Shipping prices valid until tomorrow at {time}.",
+  quoteLater: "Shipping prices valid until {date}.",
+  quoteSoon: "Shipping prices expire soon ({time}).",
+  partial: "We couldn't reach every carrier. These are the options available now.",
+  loading: "Looking for delivery options\u2026",
+  requoted: "Shipping rates changed and are now up to date. Check your delivery before paying."
+};
+function deliveryMessages(locale, overrides) {
+  const base = (locale ?? "es-MX").toLowerCase().startsWith("en") ? EN : ES;
+  return overrides ? { ...base, ...overrides } : base;
+}
+var fill = (tpl, vars) => tpl.replace(/\{(\w+)\}/g, (_, k) => String(vars[k] ?? "")).replace(/\.\.$/, ".");
+function rateCarrier(rate) {
+  return brandName(rate.carrier);
+}
+function rateService(rate) {
+  const title = rate.title.trim();
+  const carrier = rateCarrier(rate);
+  if (!carrier) return title;
+  for (const prefix of [carrier, rate.carrier ?? ""]) {
+    if (!prefix) continue;
+    if (title.toLowerCase().startsWith(prefix.toLowerCase())) {
+      const rest = title.slice(prefix.length).replace(/^[\s·:|-]+/, "");
+      if (rest) return rest;
+    }
+  }
+  return title;
+}
+function rateEta(rate, messages = ES) {
+  const { eta_days_min: min, eta_days_max: max } = rate;
+  if (typeof min === "number" && typeof max === "number") {
+    if (min === max) return min === 1 ? messages.etaOne : fill(messages.etaMany, { n: min });
+    return fill(messages.etaRange, { min, max });
+  }
+  if (typeof max === "number") return max === 1 ? messages.etaOne : fill(messages.etaUpTo, { max });
+  if (typeof min === "number") return min === 1 ? messages.etaOne : fill(messages.etaFrom, { min });
+  return rate.eta ?? null;
+}
+var costOf = (r) => {
+  const n = Number(r.cost.amount);
+  return Number.isFinite(n) ? n : null;
+};
+var daysOf = (r) => r.eta_days_max ?? r.eta_days_min ?? null;
+function rateBadges(rates) {
+  const out = /* @__PURE__ */ new Map();
+  if (rates.length < 2) return out;
+  const add = (id, b) => out.set(id, [...out.get(id) ?? [], b]);
+  const unique = (values) => {
+    const known = values.filter((v) => v[1] !== null);
+    if (known.length < 2) return null;
+    const min = Math.min(...known.map((v) => v[1]));
+    const winners = known.filter((v) => v[1] === min);
+    return winners.length === 1 ? winners[0][0] : null;
+  };
+  const currencies = new Set(rates.map((r) => r.cost.currency_code));
+  if (currencies.size === 1) {
+    const id = unique(rates.map((r) => [r.id, costOf(r)]));
+    if (id) add(id, "cheapest");
+  }
+  const fast = unique(rates.map((r) => [r.id, daysOf(r)]));
+  if (fast) add(fast, "fastest");
+  return out;
+}
+function quoteDeadline(rates) {
+  let best = null;
+  for (const r of rates) {
+    if (!r.expires_at) continue;
+    const d = new Date(r.expires_at);
+    if (Number.isNaN(d.getTime())) continue;
+    if (!best || d < best) best = d;
+  }
+  return best;
+}
+function quoteNote(deadline, opts = {}) {
+  if (!deadline) return null;
+  const now = opts.now ?? /* @__PURE__ */ new Date();
+  const left = deadline.getTime() - now.getTime();
+  if (left <= 0) return null;
+  const m = opts.messages ?? ES;
+  const locale = opts.locale ?? "es-MX";
+  const tz = opts.timeZone ? { timeZone: opts.timeZone } : {};
+  const time = new Intl.DateTimeFormat(locale, { hour: "numeric", minute: "2-digit", ...tz }).format(deadline);
+  if (left <= (opts.soonMinutes ?? 15) * 6e4) return { text: fill(m.quoteSoon, { time }), soon: true };
+  const day = (d) => new Intl.DateTimeFormat("en-CA", { year: "numeric", month: "2-digit", day: "2-digit", ...tz }).format(d);
+  if (day(deadline) === day(now)) return { text: fill(m.quoteToday, { time }), soon: false };
+  if (day(deadline) === day(new Date(now.getTime() + 864e5))) return { text: fill(m.quoteTomorrow, { time }), soon: false };
+  const date = new Intl.DateTimeFormat(locale, { day: "numeric", month: "short", hour: "numeric", minute: "2-digit", ...tz }).format(deadline);
+  return { text: fill(m.quoteLater, { date }), soon: false };
+}
+var QUOTE_CODES = /* @__PURE__ */ new Set(["quote_expired", "rate_expired", "rate_changed", "rate_unavailable", "rate_not_found", "stale_rate", "invalid_rate"]);
+function isQuoteChange(err) {
+  if (!err) return false;
+  if (err.code && QUOTE_CODES.has(err.code)) return true;
+  if (err.status === 409) return true;
+  return err.status === 422 && (err.field === "rate_id" || err.field === "delivery" || err.field === "delivery.rate_id" || !err.field);
+}
+function matchRate(previous, rates) {
+  if (!previous) return null;
+  const norm = (s) => (s ?? "").trim().toLowerCase();
+  const sameCarrier = (r) => norm(r.carrier) === norm(previous.carrier);
+  if (previous.service_code) {
+    const hit = rates.find((r) => sameCarrier(r) && norm(r.service_code) === norm(previous.service_code));
+    if (hit) return hit;
+  }
+  return rates.find((r) => sameCarrier(r) && norm(r.title) === norm(previous.title)) ?? null;
+}
+var SR_ONLY = { position: "absolute", width: 1, height: 1, overflow: "hidden", clip: "rect(0 0 0 0)", whiteSpace: "nowrap" };
+var useHydrated = () => useSyncExternalStore(
+  () => () => {
+  },
+  () => true,
+  () => false
+);
+function PickupGlyph({ size = 24 }) {
+  return /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 48 32", width: Math.round(size * 1.5), height: size, "aria-hidden": "true", focusable: "false", style: { flex: "none" }, "data-sf-brand-mark": "pickup", children: [
+    /* @__PURE__ */ jsx("rect", { x: "0.5", y: "0.5", width: "47", height: "31", rx: "5", fill: "var(--sf-brand-mark-bg, #E7E9EE)", stroke: "var(--sf-brand-mark-ring, rgb(127 127 127 / 0.35))" }),
+    /* @__PURE__ */ jsx("path", { d: "M15 13.5 17 9h14l2 4.5M15 13.5h18M15 13.5V23h18v-9.5M21 23v-5h6v5", fill: "none", stroke: "var(--sf-brand-mark-fg, #2B2F38)", strokeWidth: "1.8", strokeLinejoin: "round" })
+  ] });
+}
+function DeliveryOptions(props) {
+  const {
+    rates,
+    pickup = [],
+    name = "delivery_choice",
+    rateValue = (r) => `rate:${r.id}`,
+    pickupValue = (b) => `pickup:${b.branch_id}`,
+    value,
+    onValueChange,
+    partial = false,
+    requoted = false,
+    loading = false,
+    timeZone,
+    marks = true,
+    badges: showBadges = true,
+    required = true,
+    renderAmount,
+    classNames: cx = {},
+    testId,
+    children
+  } = props;
+  const locale = useResolvedLocale(props.locale);
+  const m = useMemo(() => deliveryMessages(locale, props.messages), [locale, props.messages]);
+  const hydrated = useHydrated();
+  const badges = useMemo(() => showBadges ? rateBadges(rates) : /* @__PURE__ */ new Map(), [rates, showBadges]);
+  const firstValue = rates[0] ? rateValue(rates[0]) : null;
+  const defaultValue = props.defaultValue === void 0 ? firstValue : props.defaultValue;
+  const amount = (money) => Number(money.amount) === 0 ? /* @__PURE__ */ jsx("span", { className: cx.free, "data-sf-delivery-free": true, children: m.free }) : renderAmount ? renderAmount(money) : formatMoney(money, locale);
+  const mode = props.quoteNote ?? "always";
+  const deadline = mode === "never" ? null : quoteDeadline(rates);
+  const note = hydrated && deadline ? quoteNote(deadline, { locale, messages: m, ...timeZone ? { timeZone } : {} }) : null;
+  const shownNote = note && (mode === "always" || note.soon) ? note : null;
+  const radio = (v) => /* @__PURE__ */ jsx(
+    "input",
+    {
+      type: "radio",
+      name,
+      value: v,
+      required,
+      className: cx.radio,
+      ...value !== void 0 ? { checked: value === v, onChange: () => onValueChange?.(v) } : { defaultChecked: v === defaultValue, ...onValueChange ? { onChange: () => onValueChange(v) } : {} },
+      ...testId ? { "data-testid": testId } : {}
+    }
+  );
+  return /* @__PURE__ */ jsxs("div", { className: cx.root, "data-sf-delivery": true, "aria-busy": loading || void 0, children: [
+    partial ? /* @__PURE__ */ jsx("p", { role: "status", className: cx.partial, "data-sf-delivery-partial": true, children: m.partial }) : null,
+    requoted ? /* @__PURE__ */ jsx("p", { role: "status", className: cx.partial, "data-sf-delivery-requoted": true, children: m.requoted }) : null,
+    loading ? /* @__PURE__ */ jsx("span", { style: SR_ONLY, role: "status", "data-sf-delivery-loading": true, children: m.loading }) : null,
+    children,
+    loading && rates.length === 0 ? [0, 1, 2].map((i) => /* @__PURE__ */ jsx("div", { className: cx.skeleton, "data-sf-delivery-skeleton": true, "aria-hidden": "true" }, i)) : null,
+    rates.map((rate) => {
+      const carrier = rateCarrier(rate);
+      const service = rateService(rate);
+      const eta = rateEta(rate, m);
+      const own = badges.get(rate.id) ?? [];
+      return /* @__PURE__ */ jsxs("label", { className: cx.option, "data-sf-delivery-option": true, "data-loading": loading || void 0, children: [
+        radio(rateValue(rate)),
+        marks ? /* @__PURE__ */ jsx(BrandMark, { brand: rate.carrier ?? rate.provider ?? rate.title, size: 28, ...cx.mark ? { className: cx.mark } : {} }) : null,
+        /* @__PURE__ */ jsxs("span", { className: cx.body, "data-sf-delivery-body": true, children: [
+          /* @__PURE__ */ jsx("span", { className: cx.title, "data-sf-delivery-title": true, children: carrier ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx("span", { className: cx.carrier, "data-sf-delivery-carrier": true, children: carrier }),
+            " ",
+            /* @__PURE__ */ jsx("span", { className: cx.service, "data-sf-delivery-service": true, children: service })
+          ] }) : /* @__PURE__ */ jsx("span", { className: cx.carrier, "data-sf-delivery-carrier": true, children: service }) }),
+          eta ? /* @__PURE__ */ jsx("span", { className: cx.eta, "data-sf-delivery-eta": true, children: eta }) : null,
+          own.length ? /* @__PURE__ */ jsx("span", { className: cx.badges, "data-sf-delivery-badges": true, children: own.map((b) => /* @__PURE__ */ jsx("span", { className: cx.badge, "data-sf-delivery-badge": b, children: b === "cheapest" ? m.cheapest : m.fastest }, b)) }) : null
+        ] }),
+        /* @__PURE__ */ jsx("span", { className: cx.price, "data-sf-delivery-price": true, children: amount(rate.cost) })
+      ] }, rate.id);
+    }),
+    pickup.map((b) => /* @__PURE__ */ jsxs("label", { className: cx.option, "data-sf-delivery-option": true, "data-sf-delivery-pickup": true, children: [
+      radio(pickupValue(b)),
+      marks ? /* @__PURE__ */ jsx(PickupGlyph, { size: 28 }) : null,
+      /* @__PURE__ */ jsxs("span", { className: cx.body, "data-sf-delivery-body": true, children: [
+        /* @__PURE__ */ jsx("span", { className: cx.title, "data-sf-delivery-title": true, children: /* @__PURE__ */ jsx("span", { className: cx.carrier, "data-sf-delivery-carrier": true, children: m.pickupTitle.replace("{name}", b.name) }) }),
+        b.address || b.city ? /* @__PURE__ */ jsx("span", { className: cx.eta, "data-sf-delivery-eta": true, children: [b.address, b.city].filter(Boolean).join(", ") }) : null
+      ] }),
+      /* @__PURE__ */ jsx("span", { className: cx.price, "data-sf-delivery-price": true, children: /* @__PURE__ */ jsx("span", { className: cx.free, "data-sf-delivery-free": true, children: m.free }) })
+    ] }, b.branch_id)),
+    deadline ? /* @__PURE__ */ jsx("p", { className: cx.note, "data-sf-delivery-note": true, "data-soon": shownNote?.soon || void 0, "aria-live": "polite", children: shownNote?.text ?? "" }) : null
+  ] });
+}
+
+export { DeliveryOptions, deliveryMessages, isQuoteChange, matchRate, quoteDeadline, quoteNote, rateBadges, rateCarrier, rateEta, rateService };
+//# sourceMappingURL=checkout.js.map
+//# sourceMappingURL=checkout.js.map