@propeller-commerce/propeller-v2-react-ui 0.4.21 → 0.4.23

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.cts CHANGED
@@ -3738,12 +3738,20 @@ interface DeliveryDateProps {
3738
3738
  containerClass?: string;
3739
3739
  /** Pre-selected date from cart (e.g. cart.postageData.requestDate: "2026-04-17T00:00:00.000Z") */
3740
3740
  initialDate?: string;
3741
+ /**
3742
+ * Active language/locale (e.g. `'NL'`). Sets the `lang` attribute on the
3743
+ * native `<input type="date">` so the browser renders its calendar chrome
3744
+ * (month name, weekday headers, Today/Clear) in that locale. Resolved from
3745
+ * `<PropellerProvider>` when omitted. The quick-pick tile text is localized
3746
+ * separately via `labels` (day_N / month_N keys).
3747
+ */
3748
+ language?: string;
3741
3749
  }
3742
3750
  /**
3743
3751
  * Delivery-date selector: quick-pick tiles for the next few days plus an
3744
3752
  * optional custom date picker, with validation against a minimum date.
3745
3753
  */
3746
- declare function DeliveryDate(props: DeliveryDateProps): React$1.JSX.Element;
3754
+ declare function DeliveryDate(rawProps: DeliveryDateProps): React$1.JSX.Element;
3747
3755
 
3748
3756
  /**
3749
3757
  * @rsc-blocked — Client-only component: JSX event handlers (onClick/onChange/etc.).
@@ -6503,8 +6511,16 @@ interface SearchBarResult {
6503
6511
  name: string;
6504
6512
  /** SKU code */
6505
6513
  sku?: string;
6506
- /** Price value */
6514
+ /**
6515
+ * Leading price value (kept for back-compat / consumer callbacks). Populated
6516
+ * with the tax-inclusive (net) or exclusive (gross) amount per the active
6517
+ * toggle — see `priceNet`/`priceGross` for both raw values.
6518
+ */
6507
6519
  price?: number;
6520
+ /** Tax-inclusive price (SDK `price.net`). */
6521
+ priceNet?: number;
6522
+ /** Tax-exclusive price (SDK `price.gross`). */
6523
+ priceGross?: number;
6508
6524
  /** Image URL */
6509
6525
  imageUrl?: string;
6510
6526
  /** URL path to navigate to */
@@ -6541,6 +6557,19 @@ interface SearchBarProps {
6541
6557
  currency?: string;
6542
6558
  /** Labels for the component */
6543
6559
  labels?: Record<string, string>;
6560
+ /**
6561
+ * When true, the tax-inclusive (net) price leads; false shows tax-exclusive
6562
+ * (gross). Note the SDK mapping: `price.net` = incl. VAT, `price.gross` =
6563
+ * excl. VAT. Resolved from `<PropellerProvider>` when omitted; defaults to
6564
+ * `false` (excl.). Mirrors ProductCard/ProductPrice so the dropdown agrees
6565
+ * with every other price surface.
6566
+ */
6567
+ includeTax?: boolean;
6568
+ /**
6569
+ * Labels for the incl./excl. price suffix. Keys: `inclTax`, `exclTax`.
6570
+ * Falls back to English 'incl. VAT' / 'excl. VAT'.
6571
+ */
6572
+ priceLabels?: Record<string, string>;
6544
6573
  /** Additional class name for the container */
6545
6574
  containerClassName?: string;
6546
6575
  /** Tax zone used for price calculation. Defaults to 'NL'. */
package/dist/index.d.ts CHANGED
@@ -3738,12 +3738,20 @@ interface DeliveryDateProps {
3738
3738
  containerClass?: string;
3739
3739
  /** Pre-selected date from cart (e.g. cart.postageData.requestDate: "2026-04-17T00:00:00.000Z") */
3740
3740
  initialDate?: string;
3741
+ /**
3742
+ * Active language/locale (e.g. `'NL'`). Sets the `lang` attribute on the
3743
+ * native `<input type="date">` so the browser renders its calendar chrome
3744
+ * (month name, weekday headers, Today/Clear) in that locale. Resolved from
3745
+ * `<PropellerProvider>` when omitted. The quick-pick tile text is localized
3746
+ * separately via `labels` (day_N / month_N keys).
3747
+ */
3748
+ language?: string;
3741
3749
  }
3742
3750
  /**
3743
3751
  * Delivery-date selector: quick-pick tiles for the next few days plus an
3744
3752
  * optional custom date picker, with validation against a minimum date.
3745
3753
  */
3746
- declare function DeliveryDate(props: DeliveryDateProps): React$1.JSX.Element;
3754
+ declare function DeliveryDate(rawProps: DeliveryDateProps): React$1.JSX.Element;
3747
3755
 
3748
3756
  /**
3749
3757
  * @rsc-blocked — Client-only component: JSX event handlers (onClick/onChange/etc.).
@@ -6503,8 +6511,16 @@ interface SearchBarResult {
6503
6511
  name: string;
6504
6512
  /** SKU code */
6505
6513
  sku?: string;
6506
- /** Price value */
6514
+ /**
6515
+ * Leading price value (kept for back-compat / consumer callbacks). Populated
6516
+ * with the tax-inclusive (net) or exclusive (gross) amount per the active
6517
+ * toggle — see `priceNet`/`priceGross` for both raw values.
6518
+ */
6507
6519
  price?: number;
6520
+ /** Tax-inclusive price (SDK `price.net`). */
6521
+ priceNet?: number;
6522
+ /** Tax-exclusive price (SDK `price.gross`). */
6523
+ priceGross?: number;
6508
6524
  /** Image URL */
6509
6525
  imageUrl?: string;
6510
6526
  /** URL path to navigate to */
@@ -6541,6 +6557,19 @@ interface SearchBarProps {
6541
6557
  currency?: string;
6542
6558
  /** Labels for the component */
6543
6559
  labels?: Record<string, string>;
6560
+ /**
6561
+ * When true, the tax-inclusive (net) price leads; false shows tax-exclusive
6562
+ * (gross). Note the SDK mapping: `price.net` = incl. VAT, `price.gross` =
6563
+ * excl. VAT. Resolved from `<PropellerProvider>` when omitted; defaults to
6564
+ * `false` (excl.). Mirrors ProductCard/ProductPrice so the dropdown agrees
6565
+ * with every other price surface.
6566
+ */
6567
+ includeTax?: boolean;
6568
+ /**
6569
+ * Labels for the incl./excl. price suffix. Keys: `inclTax`, `exclTax`.
6570
+ * Falls back to English 'incl. VAT' / 'excl. VAT'.
6571
+ */
6572
+ priceLabels?: Record<string, string>;
6544
6573
  /** Additional class name for the container */
6545
6574
  containerClassName?: string;
6546
6575
  /** Tax zone used for price calculation. Defaults to 'NL'. */
package/dist/index.js CHANGED
@@ -6705,8 +6705,9 @@ function CartIconAndSidebar(rawProps) {
6705
6705
  (sum, item) => sum + item.quantity,
6706
6706
  0
6707
6707
  );
6708
- const totalNet = props.cart?.total?.totalNet;
6709
- const totalPrice = totalNet === void 0 || totalNet === null ? money(0) : money(totalNet);
6708
+ const useTax = !!props.includeTax;
6709
+ const totalRaw = useTax ? props.cart?.total?.totalNet : props.cart?.total?.totalGross;
6710
+ const totalPrice = totalRaw === void 0 || totalRaw === null ? money(0) : money(totalRaw);
6710
6711
  const sidebarTitle = props.cartSidebarTitle || props.labels?.["cartSidebarTitle"] || "Shopping cart";
6711
6712
  const purchaserPAC = findPurchaserPAC(props.user, props.companyId);
6712
6713
  const totalGross = props.cart?.total?.totalGross ?? 0;
@@ -6916,7 +6917,7 @@ function CartIconAndSidebar(rawProps) {
6916
6917
  showCartItemNotesField: false,
6917
6918
  showCrossupsells: false,
6918
6919
  showStockComponent: false,
6919
- includeTax: false,
6920
+ includeTax: useTax,
6920
6921
  className: "propeller-cart-icon__item",
6921
6922
  children: [
6922
6923
  /* @__PURE__ */ jsx(CartItem_default.Image, { className: "w-20 h-20 flex-shrink-0 bg-surface-hover rounded-control overflow-hidden border border-border-subtle" }),
@@ -6937,7 +6938,7 @@ function CartIconAndSidebar(rawProps) {
6937
6938
  },
6938
6939
  item.itemId
6939
6940
  )) }),
6940
- /* @__PURE__ */ jsx(CartBonusItemsImpl, { cart: props.cart, includeTax: true, className: "mt-4" })
6941
+ /* @__PURE__ */ jsx(CartBonusItemsImpl, { cart: props.cart, includeTax: useTax, className: "mt-4" })
6941
6942
  ] }),
6942
6943
  " ",
6943
6944
  items.length > 0 ? /* @__PURE__ */ jsxs("div", { className: "propeller-cart-icon__sidebar-footer px-5 py-4 border-t border-border space-y-3 bg-surface-hover", children: [
@@ -8380,7 +8381,8 @@ function computeUpcomingDates(count, skipWeekends) {
8380
8381
  }
8381
8382
  return days;
8382
8383
  }
8383
- function DeliveryDate(props) {
8384
+ function DeliveryDate(rawProps) {
8385
+ const props = useInfraProps(rawProps);
8384
8386
  const [selectedDate, setSelectedDate] = useState("");
8385
8387
  const [modalOpen, setModalOpen] = useState(false);
8386
8388
  const [customDateValue, setCustomDateValue] = useState("");
@@ -8401,7 +8403,9 @@ function DeliveryDate(props) {
8401
8403
  if (!isoDate) return "";
8402
8404
  const date = new Date(isoDate);
8403
8405
  if (isNaN(date.getTime())) return "";
8404
- return `${WEEKDAYS[date.getDay()]}, ${MONTHS[date.getMonth()]} ${date.getDate()}`;
8406
+ const weekday = getLabel(props.labels, `day_${date.getDay()}`, WEEKDAYS[date.getDay()]);
8407
+ const month = getLabel(props.labels, `month_${date.getMonth()}`, MONTHS[date.getMonth()]);
8408
+ return `${weekday}, ${month} ${date.getDate()}`;
8405
8409
  }
8406
8410
  function handleSelect(isoDate) {
8407
8411
  setSelectedDate(isoDate);
@@ -8448,12 +8452,15 @@ function DeliveryDate(props) {
8448
8452
  if (props.initialDate && !selectedDate) {
8449
8453
  const dot = props.initialDate.lastIndexOf(".");
8450
8454
  const normalized = dot !== -1 ? props.initialDate.substring(0, dot) + "Z" : props.initialDate;
8451
- setSelectedDate(normalized);
8455
+ const parsed = new Date(normalized);
8456
+ const isWeekend = !isNaN(parsed.getTime()) && (parsed.getDay() === 0 || parsed.getDay() === 6);
8457
+ const adopt = skipWeekends && isWeekend && upcomingDates.length > 0 ? upcomingDates[0] : normalized;
8458
+ setSelectedDate(adopt);
8452
8459
  if (props.onDateSelect) {
8453
- props.onDateSelect(normalized);
8460
+ props.onDateSelect(adopt);
8454
8461
  }
8455
8462
  }
8456
- }, [props.initialDate, props.cart, selectedDate, props.onDateSelect, props]);
8463
+ }, [props.initialDate, props.cart, selectedDate, props.onDateSelect, props, skipWeekends, upcomingDates]);
8457
8464
  return /* @__PURE__ */ jsxs("div", { className: `propeller-delivery-date ${containerClass}`, children: [
8458
8465
  /* @__PURE__ */ jsxs("div", { className: "propeller-delivery-date__grid grid grid-cols-1 sm:grid-cols-2 md:grid-cols-4 gap-3", children: [
8459
8466
  upcomingDates.map((dateStr, index) => {
@@ -8512,6 +8519,7 @@ function DeliveryDate(props) {
8512
8519
  "input",
8513
8520
  {
8514
8521
  type: "date",
8522
+ lang: props.language ? props.language.toLowerCase() : void 0,
8515
8523
  className: `propeller-delivery-date__input w-full border rounded-control px-3 py-2 text-sm focus:outline-none focus:ring-2 ${customDateError ? "border-destructive focus:ring-destructive focus:border-destructive" : "border-input focus:ring-secondary focus:border-secondary"}`,
8516
8524
  min: minDate,
8517
8525
  value: customDateValue,
@@ -17124,11 +17132,17 @@ function mapToSearchBarResult(item) {
17124
17132
  const id = isCluster ? item.clusterId : item.productId;
17125
17133
  const slug = item.slugs?.[0]?.value || "";
17126
17134
  const url = isCluster ? "/cluster/" + id + "/" + slug : "/product/" + id + "/" + slug;
17135
+ const priceNet = displayItem?.price?.net || 0;
17136
+ const priceGross = displayItem?.price?.gross || 0;
17127
17137
  return {
17128
17138
  id,
17129
17139
  name: item.names?.[0]?.value || "Product",
17130
17140
  sku: item.sku || displayItem?.sku || "",
17131
- price: displayItem?.price?.gross || 0,
17141
+ // `price` stays the gross value for back-compat; the row picks net/gross
17142
+ // from the two explicit fields below per the toggle.
17143
+ price: priceGross,
17144
+ priceNet,
17145
+ priceGross,
17132
17146
  imageUrl: displayItem?.media?.images?.items?.[0]?.imageVariants?.[0]?.url || "",
17133
17147
  url,
17134
17148
  isCluster
@@ -17157,6 +17171,13 @@ function SearchBar(rawProps) {
17157
17171
  }
17158
17172
  return formatPrice(price || 0, { symbol: props.currency ?? "\u20AC" });
17159
17173
  }
17174
+ const useTax = !!props.includeTax;
17175
+ function leadingPrice(result) {
17176
+ return useTax ? result.priceNet ?? result.price ?? 0 : result.priceGross ?? result.price ?? 0;
17177
+ }
17178
+ function priceTaxLabel() {
17179
+ return useTax ? getLabel(props.priceLabels, "inclTax", "incl. VAT") : getLabel(props.priceLabels, "exclTax", "excl. VAT");
17180
+ }
17160
17181
  function noImageUrl() {
17161
17182
  return props.noImageUrl || "";
17162
17183
  }
@@ -17275,7 +17296,10 @@ function SearchBar(rawProps) {
17275
17296
  result.sku
17276
17297
  ] }) : null
17277
17298
  ] }),
17278
- result.price !== void 0 && result.price !== null ? /* @__PURE__ */ jsx("div", { className: "propeller-search-bar__result-price text-sm font-semibold text-foreground flex-shrink-0", children: formatItemPrice(result.price) }) : null
17299
+ result.price !== void 0 && result.price !== null ? /* @__PURE__ */ jsxs("div", { className: "propeller-search-bar__result-price text-sm font-semibold text-foreground flex-shrink-0 text-right", children: [
17300
+ /* @__PURE__ */ jsx("span", { className: "propeller-search-bar__result-price-value", children: formatItemPrice(leadingPrice(result)) }),
17301
+ /* @__PURE__ */ jsx("span", { className: "propeller-search-bar__result-price-label block text-xs font-normal text-muted-foreground", children: priceTaxLabel() })
17302
+ ] }) : null
17279
17303
  ]
17280
17304
  },
17281
17305
  result.id + "-" + index