@asteby/storefront-react 0.13.0 → 0.14.0

package/dist/checkout.d.cts

@@ -355,9 +355,12 @@ type DeliveryOptionsProps = {
      * `list` (default): every rate, as the server orders them. `recommended`: up to `recommendedCount` rates (cheapest,
      * fastest and the best balance, tagged) and the rest under "Show more options (N)", grouped by carrier so the carrier
      * name is not repeated on every row. Repeated services are dropped (the cheapest stays). Works without JavaScript
-     * (`<details>`); it opens by itself when the chosen rate is inside.
+     * (`<details>`); it opens by itself when the chosen rate is inside. `flat`: ONE plain list like most online shops:
+     * every service ordered from the lowest to the highest price, repeated services dropped (the cheapest stays), the
+     * cheapest / fastest / recommended tags on the rows that earn them, no `<details>` and no groups. The chosen rate is
+     * always listed, and with no explicit default the preselected row is the first one (the cheapest).
      */
-    layout?: 'list' | 'recommended';
+    layout?: 'list' | 'recommended' | 'flat';
     /** Rates recommended in `layout="recommended"`. Default 3. */
     recommendedCount?: number;
     /**
@@ -432,5 +435,19 @@ declare function dedupeRates<R extends ShippingRate>(rates: readonly R[]): R[];
  * Recommended rows come back cheapest first. Pickup is not a rate and is never hidden (the component shows it apart).
  */
 declare function recommendRates<R extends ShippingRate>(input: readonly R[], options?: RecommendRatesOptions): RecommendedRates<R>;
+type FlatRatesOptions = {
+    /** Count used to decide the `best_value` tag, as in `recommendRates` (default 3: only with more than 4 services). */
+    count?: number;
+    /** Drop repeated services keeping the cheapest. Default true. */
+    dedupe?: boolean;
+    /** Id of the chosen rate: it stays in the list even if it is a repeated service. */
+    keepId?: string | null;
+};
+/**
+ * ONE flat list for `layout="flat"`: every service (repeated ones dropped, the cheapest stays), ordered from the
+ * lowest to the highest price, with the same tags `recommendRates` assigns (cheapest, fastest and, on long quotes,
+ * best_value) on the rows that earn them. Nothing is hidden or grouped.
+ */
+declare function flatRates<R extends ShippingRate>(input: readonly R[], options?: FlatRatesOptions): RecommendedRate<R>[];
 
-export { type AddressFieldKey, AddressFields, type AddressFieldsMessages, type AddressFieldsProps, type Brand, type BrandKind, BrandMark, type BrandMarkProps, type BrandMarkSource, CheckoutFieldClassNames, type ContactFieldKey, ContactFields, type ContactFieldsProps, type DeliveryMessages, DeliveryOptions, type DeliveryOptionsClassNames, type DeliveryOptionsProps, FieldErrors, type FieldLayoutClassNames, FieldMessages, OrderSummary, type OrderSummaryClassNames, OrderSummaryDisclosure, type OrderSummaryDisclosureProps, type OrderSummaryMessages, type OrderSummaryProps, type PostalCodeInfo, type QuoteNote, type RateBadge, type RateGroup, type RateTag, type RecommendRatesOptions, type RecommendedRate, type RecommendedRates, addressFieldsMessages, brandKey, brandLogo, brandName, dedupeRates, deliveryMessages, findBrand, isQuoteChange, listBrands, matchRate, orderSummaryMessages, quoteDeadline, quoteNote, rateBadges, rateCarrier, rateEta, rateService, recommendRates };
+export { type AddressFieldKey, AddressFields, type AddressFieldsMessages, type AddressFieldsProps, type Brand, type BrandKind, BrandMark, type BrandMarkProps, type BrandMarkSource, CheckoutFieldClassNames, type ContactFieldKey, ContactFields, type ContactFieldsProps, type DeliveryMessages, DeliveryOptions, type DeliveryOptionsClassNames, type DeliveryOptionsProps, FieldErrors, type FieldLayoutClassNames, FieldMessages, type FlatRatesOptions, OrderSummary, type OrderSummaryClassNames, OrderSummaryDisclosure, type OrderSummaryDisclosureProps, type OrderSummaryMessages, type OrderSummaryProps, type PostalCodeInfo, type QuoteNote, type RateBadge, type RateGroup, type RateTag, type RecommendRatesOptions, type RecommendedRate, type RecommendedRates, addressFieldsMessages, brandKey, brandLogo, brandName, dedupeRates, deliveryMessages, findBrand, flatRates, isQuoteChange, listBrands, matchRate, orderSummaryMessages, quoteDeadline, quoteNote, rateBadges, rateCarrier, rateEta, rateService, recommendRates };

package/dist/checkout.d.ts

@@ -355,9 +355,12 @@ type DeliveryOptionsProps = {
      * `list` (default): every rate, as the server orders them. `recommended`: up to `recommendedCount` rates (cheapest,
      * fastest and the best balance, tagged) and the rest under "Show more options (N)", grouped by carrier so the carrier
      * name is not repeated on every row. Repeated services are dropped (the cheapest stays). Works without JavaScript
-     * (`<details>`); it opens by itself when the chosen rate is inside.
+     * (`<details>`); it opens by itself when the chosen rate is inside. `flat`: ONE plain list like most online shops:
+     * every service ordered from the lowest to the highest price, repeated services dropped (the cheapest stays), the
+     * cheapest / fastest / recommended tags on the rows that earn them, no `<details>` and no groups. The chosen rate is
+     * always listed, and with no explicit default the preselected row is the first one (the cheapest).
      */
-    layout?: 'list' | 'recommended';
+    layout?: 'list' | 'recommended' | 'flat';
     /** Rates recommended in `layout="recommended"`. Default 3. */
     recommendedCount?: number;
     /**
@@ -432,5 +435,19 @@ declare function dedupeRates<R extends ShippingRate>(rates: readonly R[]): R[];
  * Recommended rows come back cheapest first. Pickup is not a rate and is never hidden (the component shows it apart).
  */
 declare function recommendRates<R extends ShippingRate>(input: readonly R[], options?: RecommendRatesOptions): RecommendedRates<R>;
+type FlatRatesOptions = {
+    /** Count used to decide the `best_value` tag, as in `recommendRates` (default 3: only with more than 4 services). */
+    count?: number;
+    /** Drop repeated services keeping the cheapest. Default true. */
+    dedupe?: boolean;
+    /** Id of the chosen rate: it stays in the list even if it is a repeated service. */
+    keepId?: string | null;
+};
+/**
+ * ONE flat list for `layout="flat"`: every service (repeated ones dropped, the cheapest stays), ordered from the
+ * lowest to the highest price, with the same tags `recommendRates` assigns (cheapest, fastest and, on long quotes,
+ * best_value) on the rows that earn them. Nothing is hidden or grouped.
+ */
+declare function flatRates<R extends ShippingRate>(input: readonly R[], options?: FlatRatesOptions): RecommendedRate<R>[];
 
-export { type AddressFieldKey, AddressFields, type AddressFieldsMessages, type AddressFieldsProps, type Brand, type BrandKind, BrandMark, type BrandMarkProps, type BrandMarkSource, CheckoutFieldClassNames, type ContactFieldKey, ContactFields, type ContactFieldsProps, type DeliveryMessages, DeliveryOptions, type DeliveryOptionsClassNames, type DeliveryOptionsProps, FieldErrors, type FieldLayoutClassNames, FieldMessages, OrderSummary, type OrderSummaryClassNames, OrderSummaryDisclosure, type OrderSummaryDisclosureProps, type OrderSummaryMessages, type OrderSummaryProps, type PostalCodeInfo, type QuoteNote, type RateBadge, type RateGroup, type RateTag, type RecommendRatesOptions, type RecommendedRate, type RecommendedRates, addressFieldsMessages, brandKey, brandLogo, brandName, dedupeRates, deliveryMessages, findBrand, isQuoteChange, listBrands, matchRate, orderSummaryMessages, quoteDeadline, quoteNote, rateBadges, rateCarrier, rateEta, rateService, recommendRates };
+export { type AddressFieldKey, AddressFields, type AddressFieldsMessages, type AddressFieldsProps, type Brand, type BrandKind, BrandMark, type BrandMarkProps, type BrandMarkSource, CheckoutFieldClassNames, type ContactFieldKey, ContactFields, type ContactFieldsProps, type DeliveryMessages, DeliveryOptions, type DeliveryOptionsClassNames, type DeliveryOptionsProps, FieldErrors, type FieldLayoutClassNames, FieldMessages, type FlatRatesOptions, OrderSummary, type OrderSummaryClassNames, OrderSummaryDisclosure, type OrderSummaryDisclosureProps, type OrderSummaryMessages, type OrderSummaryProps, type PostalCodeInfo, type QuoteNote, type RateBadge, type RateGroup, type RateTag, type RecommendRatesOptions, type RecommendedRate, type RecommendedRates, addressFieldsMessages, brandKey, brandLogo, brandName, dedupeRates, deliveryMessages, findBrand, flatRates, isQuoteChange, listBrands, matchRate, orderSummaryMessages, quoteDeadline, quoteNote, rateBadges, rateCarrier, rateEta, rateService, recommendRates };

package/dist/checkout.js

@@ -1,5 +1,5 @@
-import { brandName, BrandMark, brandKey } from './chunk-5WERSSU5.js';
-export { BrandMark, brandKey, brandLogo, brandName, findBrand, listBrands } from './chunk-5WERSSU5.js';
+import { brandName, BrandMark, brandKey } from './chunk-JNUJGPJC.js';
+export { BrandMark, brandKey, brandLogo, brandName, findBrand, listBrands } from './chunk-JNUJGPJC.js';
 import { useResolvedLocale } from './chunk-T52H5HL3.js';
 import './chunk-DQBL2DFJ.js';
 import { CheckoutField } from './chunk-DFGLCIEG.js';
@@ -347,6 +347,17 @@ function recommendRates(input, options = {}) {
   const more = [...groups.values()];
   return { recommended, more, moreCount: more.reduce((n, g) => n + g.rates.length, 0) };
 }
+function flatRates(input, options = {}) {
+  const count = options.count ?? 3;
+  const rates = options.dedupe === false ? [...input] : dedupeRates(input);
+  const tags = /* @__PURE__ */ new Map();
+  for (const { rate, tags: t } of recommendRates(rates, { count, dedupe: false }).recommended) tags.set(rate, t);
+  const list = [...rates];
+  const kept = options.keepId ? input.find((r) => r.id === options.keepId) : void 0;
+  if (kept && !list.includes(kept)) list.push(kept);
+  const byCost = (a, b) => (costOf(a) ?? Infinity) - (costOf(b) ?? Infinity);
+  return list.sort(byCost).map((rate) => ({ rate, tags: tags.get(rate) ?? [] }));
+}
 
 // src/checkout/delivery.ts
 var ES3 = {
@@ -535,7 +546,13 @@ function DeliveryOptions(props) {
   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 flat = useMemo(
+    () => layout === "flat" ? flatRates(rates, { count: props.recommendedCount ?? 3, keepId: value ? rates.find((r) => rateValue(r) === value)?.id ?? null : null }) : null,
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [layout, rates, props.recommendedCount, value]
+  );
+  const firstRate = flat ? flat[0]?.rate : rates[0];
+  const firstValue = firstRate ? rateValue(firstRate) : 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";
@@ -601,7 +618,7 @@ function DeliveryOptions(props) {
     ] }) : 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,
-    plan ? plan.recommended.map(({ rate, tags }) => rateRow(rate, { tags: showBadges ? tags : [] })) : rates.map((rate) => rateRow(rate, { tags: badges.get(rate.id) ?? [] })),
+    flat ? flat.map(({ rate, tags }) => rateRow(rate, { tags: showBadges ? tags : [] })) : plan ? plan.recommended.map(({ rate, tags }) => rateRow(rate, { tags: showBadges ? tags : [] })) : rates.map((rate) => rateRow(rate, { tags: badges.get(rate.id) ?? [] })),
     plan && plan.moreCount > 0 ? /* @__PURE__ */ jsxs("details", { className: cx.more, "data-sf-delivery-more": true, ...inMore ? { open: true } : {}, children: [
       /* @__PURE__ */ jsx("summary", { className: cx.moreSummary, "data-sf-delivery-more-summary": true, children: m.moreOptions.replace("{n}", String(plan.moreCount)) }),
       /* @__PURE__ */ jsx("div", { "data-sf-delivery-groups": true, children: plan.more.map((g) => {
@@ -629,6 +646,6 @@ function DeliveryOptions(props) {
   ] });
 }
 
-export { AddressFields, ContactFields, DeliveryOptions, OrderSummary, OrderSummaryDisclosure, addressFieldsMessages, dedupeRates, deliveryMessages, isQuoteChange, matchRate, orderSummaryMessages, quoteDeadline, quoteNote, rateBadges, rateCarrier, rateEta, rateService, recommendRates };
+export { AddressFields, ContactFields, DeliveryOptions, OrderSummary, OrderSummaryDisclosure, addressFieldsMessages, dedupeRates, deliveryMessages, flatRates, isQuoteChange, matchRate, orderSummaryMessages, quoteDeadline, quoteNote, rateBadges, rateCarrier, rateEta, rateService, recommendRates };
 //# sourceMappingURL=checkout.js.map
 //# sourceMappingURL=checkout.js.map