@propeller-commerce/propeller-v2-vue-ui 0.3.14 → 0.3.15

package/CHANGELOG.md

@@ -8,6 +8,31 @@ once it reaches 1.0. Until then (the `0.x` line) the public API may change
 between minor versions; breaking changes are called out below and in
 [MIGRATION.md](./MIGRATION.md).
 
+## [0.3.15] - 2026-06-11
+
+### Fixed
+
+- **VAT toggle (incl./excl. tax) had no effect on catalog cards.** `ProductGrid`,
+  `ProductCard` and `ClusterCard` ignored the `<PropellerProvider>` `includeTax`
+  flag, so prices stayed gross (excl. VAT) regardless of the toggle. Two stacked
+  causes:
+  - **Vue Boolean-prop coercion** — an absent `includeTax?: boolean` prop is cast
+    to `false` (never `undefined`), so `useInfraProps`' "explicit prop wins"
+    precedence treated the coerced `false` as an override and never consulted the
+    provider. The grid now resolves `includeTax` from the provider context
+    directly (`usePropellerContext()`), treating only an explicit `true` as a host
+    opt-in, and passes the resolved value down to every card.
+  - **`inject()` inside a `computed`** — `ProductCard` / `ClusterCard` resolved
+    props via `computed(() => useResolvedProps(...))`, where `inject()` returns a
+    null context (it is setup-only). Infra is now resolved once at setup via
+    `useInfraProps(props)`, so the reactive provider value (the VAT toggle) is
+    honoured. Same class of bug as the 0.3.1 provider fix.
+
+  Brings the Vue cards to parity with `propeller-v2-react-ui`, whose `ProductCard`
+  already resolves `includeTax` from infra. Standalone `ProductPrice` /
+  `ProductBulkPrices` / `ProductInfo` keep the React contract (the consumer passes
+  `includeTax`); the propeller-vue PDP / cluster views were updated accordingly.
+
 ## [0.3.14] - 2026-06-09
 
 ### Fixed

package/dist/components/ClusterCard.vue.d.ts

@@ -90,8 +90,6 @@ export interface ClusterCardProps {
 }
 interface ClusterCardState {
     isFavorite: boolean;
-    includeTax: boolean;
-    priceListener: any;
     isRow: () => boolean;
     getClusterName: () => string;
     getClusterSku: () => string;

package/dist/components/ProductCard.vue.d.ts

@@ -171,8 +171,6 @@ export interface ProductCardProps {
 }
 interface ProductCardState {
     isFavorite: boolean;
-    includeTax: boolean;
-    priceListener: any;
     getProductName: () => string;
     getProductSku: () => string;
     getProductImageUrl: () => string;

package/dist/index.cjs

@@ -8154,6 +8154,9 @@ const _sfc_main$B = /* @__PURE__ */ vue.defineComponent({
   setup(__props) {
     const props = __props;
     const RESOLVE_SPEC = {
+      // NOTE: includeTax is resolved separately (see `infra`/`resolvedIncludeTax`
+      // below) because the infra fallback must read injected context at setup —
+      // useResolvedProps runs inside a `computed` here, where inject() returns null.
       priceComponent: { grid: "priceComponent" },
       stockComponent: { grid: "stockComponent" },
       imageComponent: { grid: "imageComponent" },
@@ -8161,14 +8164,16 @@ const _sfc_main$B = /* @__PURE__ */ vue.defineComponent({
       favoriteComponent: { grid: "favoriteComponent" }
     };
     const resolved = vue.computed(() => useResolvedProps(props, RESOLVE_SPEC));
+    const infra = ProductVideos_vue_vue_type_script_setup_true_lang.useInfraProps(props);
+    const resolvedIncludeTax = vue.computed(
+      () => props.includeTax === true ? true : !!infra.includeTax
+    );
     const PriceImpl = vue.computed(() => resolved.value.priceComponent ?? ProductVideos_vue_vue_type_script_setup_true_lang._sfc_main$9);
     const StockImpl = vue.computed(() => resolved.value.stockComponent ?? ProductVideos_vue_vue_type_script_setup_true_lang._sfc_main$3);
     const ImageImpl = vue.computed(() => resolved.value.imageComponent ?? _sfc_main$D);
     const BadgesImpl = vue.computed(() => resolved.value.badgesComponent ?? _sfc_main$C);
     const FavoriteImpl = vue.computed(() => resolved.value.favoriteComponent ?? _sfc_main$P);
     const isFavorite = vue.ref(false);
-    const includeTax = vue.ref(false);
-    vue.ref(null);
     function isRow() {
       return props.columns === 1;
     }
@@ -8215,7 +8220,7 @@ const _sfc_main$B = /* @__PURE__ */ vue.defineComponent({
     function getClusterPrice() {
       if (!props.showPrice) return "";
       const priceObj = props.cluster?.defaultProduct?.price;
-      const useTax = props.includeTax !== void 0 ? !!props.includeTax : includeTax.value;
+      const useTax = resolvedIncludeTax.value;
       const value = useTax ? priceObj?.net : priceObj?.gross;
       if (!value && value !== 0) return "";
       return index.formatPrice(Number(value), { symbol: props.currency ?? "€" });
@@ -8449,14 +8454,14 @@ const _sfc_main$B = /* @__PURE__ */ vue.defineComponent({
               key: 1,
               cluster: __props.cluster,
               price: __props.cluster.defaultProduct?.price,
-              includeTax: props.includeTax !== void 0 ? !!props.includeTax : includeTax.value,
+              includeTax: resolvedIncludeTax.value,
               currency: __props.currency,
               labels: __props.labels
             }, () => [
               props.priceComponent ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(PriceImpl.value), {
                 key: 0,
                 price: __props.cluster.defaultProduct?.price,
-                "include-tax": includeTax.value,
+                "include-tax": resolvedIncludeTax.value,
                 currency: __props.currency,
                 labels: __props.labels
               }, null, 8, ["price", "include-tax", "currency", "labels"])) : (vue.openBlock(), vue.createElementBlock("span", _hoisted_16$i, vue.toDisplayString(getClusterPrice()), 1))
@@ -8552,7 +8557,7 @@ const _sfc_main$B = /* @__PURE__ */ vue.defineComponent({
               key: 6,
               cluster: __props.cluster,
               price: __props.cluster.defaultProduct?.price,
-              includeTax: props.includeTax !== void 0 ? !!props.includeTax : includeTax.value,
+              includeTax: resolvedIncludeTax.value,
               currency: __props.currency,
               labels: __props.labels
             }, () => [
@@ -8560,7 +8565,7 @@ const _sfc_main$B = /* @__PURE__ */ vue.defineComponent({
                 props.priceComponent ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(PriceImpl.value), {
                   key: 0,
                   price: __props.cluster.defaultProduct?.price,
-                  "include-tax": includeTax.value,
+                  "include-tax": resolvedIncludeTax.value,
                   currency: __props.currency,
                   labels: __props.labels
                 }, null, 8, ["price", "include-tax", "currency", "labels"])) : (vue.openBlock(), vue.createElementBlock("span", _hoisted_26$b, vue.toDisplayString(getClusterPrice()), 1))
@@ -15008,6 +15013,9 @@ const _sfc_main$e = /* @__PURE__ */ vue.defineComponent({
   setup(__props) {
     const props = __props;
     const RESOLVE_SPEC = {
+      // NOTE: includeTax is resolved separately (see `infra`/`resolvedIncludeTax`
+      // below) because the infra fallback must read injected context at setup —
+      // useResolvedProps runs inside a `computed` here, where inject() returns null.
       priceComponent: { grid: "priceComponent" },
       stockComponent: { grid: "stockComponent" },
       addToCartComponent: { grid: "addToCartComponent" },
@@ -15016,6 +15024,10 @@ const _sfc_main$e = /* @__PURE__ */ vue.defineComponent({
       favoriteComponent: { grid: "favoriteComponent" }
     };
     const resolved = vue.computed(() => useResolvedProps(props, RESOLVE_SPEC));
+    const infra = ProductVideos_vue_vue_type_script_setup_true_lang.useInfraProps(props);
+    const resolvedIncludeTax = vue.computed(
+      () => props.includeTax === true ? true : !!infra.includeTax
+    );
     const PriceImpl = vue.computed(() => resolved.value.priceComponent ?? ProductVideos_vue_vue_type_script_setup_true_lang._sfc_main$9);
     const StockImpl = vue.computed(() => resolved.value.stockComponent ?? ProductVideos_vue_vue_type_script_setup_true_lang._sfc_main$3);
     const AddToCartImpl = vue.computed(() => resolved.value.addToCartComponent ?? _sfc_main$Q);
@@ -15023,8 +15035,6 @@ const _sfc_main$e = /* @__PURE__ */ vue.defineComponent({
     const BadgesImpl = vue.computed(() => resolved.value.badgesComponent ?? _sfc_main$C);
     const FavoriteImpl = vue.computed(() => resolved.value.favoriteComponent ?? _sfc_main$P);
     const isFavorite = vue.ref(false);
-    const includeTax = vue.ref(false);
-    vue.ref(null);
     function isRow() {
       return props.columns === 1;
     }
@@ -15290,7 +15300,7 @@ const _sfc_main$e = /* @__PURE__ */ vue.defineComponent({
               key: 1,
               product: __props.product,
               price: __props.product.price,
-              includeTax: props.includeTax !== void 0 ? !!props.includeTax : includeTax.value,
+              includeTax: resolvedIncludeTax.value,
               currency: __props.currency,
               labels: props.priceLabels
             }, () => [
@@ -15298,13 +15308,13 @@ const _sfc_main$e = /* @__PURE__ */ vue.defineComponent({
                 props.priceComponent ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(PriceImpl.value), {
                   key: 0,
                   price: __props.product.price,
-                  "include-tax": props.includeTax !== void 0 ? !!props.includeTax : includeTax.value,
+                  "include-tax": resolvedIncludeTax.value,
                   currency: __props.currency,
                   labels: props.priceLabels
                 }, null, 8, ["price", "include-tax", "currency", "labels"])) : (vue.openBlock(), vue.createBlock(ProductVideos_vue_vue_type_script_setup_true_lang._sfc_main$9, {
                   key: 1,
                   price: __props.product.price,
-                  includeTax: props.includeTax !== void 0 ? !!props.includeTax : includeTax.value,
+                  includeTax: resolvedIncludeTax.value,
                   priceSize: "text-sm",
                   labels: props.priceLabels
                 }, null, 8, ["price", "includeTax", "labels"]))
@@ -15430,7 +15440,7 @@ const _sfc_main$e = /* @__PURE__ */ vue.defineComponent({
               key: 6,
               product: __props.product,
               price: __props.product.price,
-              includeTax: props.includeTax !== void 0 ? !!props.includeTax : includeTax.value,
+              includeTax: resolvedIncludeTax.value,
               currency: __props.currency,
               labels: props.priceLabels
             }, () => [
@@ -15438,13 +15448,13 @@ const _sfc_main$e = /* @__PURE__ */ vue.defineComponent({
                 props.priceComponent ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(PriceImpl.value), {
                   key: 0,
                   price: __props.product.price,
-                  "include-tax": props.includeTax !== void 0 ? !!props.includeTax : includeTax.value,
+                  "include-tax": resolvedIncludeTax.value,
                   currency: __props.currency,
                   labels: props.priceLabels
                 }, null, 8, ["price", "include-tax", "currency", "labels"])) : (vue.openBlock(), vue.createBlock(ProductVideos_vue_vue_type_script_setup_true_lang._sfc_main$9, {
                   key: 1,
                   price: __props.product.price,
-                  includeTax: props.includeTax !== void 0 ? !!props.includeTax : includeTax.value,
+                  includeTax: resolvedIncludeTax.value,
                   priceSize: "text-base sm:text-lg",
                   labels: props.priceLabels
                 }, null, 8, ["price", "includeTax", "labels"]))
@@ -15864,6 +15874,10 @@ const _sfc_main$b = /* @__PURE__ */ vue.defineComponent({
   setup(__props) {
     const props = __props;
     const infra = ProductVideos_vue_vue_type_script_setup_true_lang.useInfraProps(props);
+    const ctxForTax = ProductVideos_vue_vue_type_script_setup_true_lang.usePropellerContext();
+    const resolvedIncludeTax = vue.computed(
+      () => props.includeTax === true ? true : !!(ctxForTax ? ctxForTax.includeTax : false)
+    );
     const ProductCardImpl = vue.computed(
       () => props.productCardComponent ?? _sfc_main$e
     );
@@ -16052,7 +16066,7 @@ const _sfc_main$b = /* @__PURE__ */ vue.defineComponent({
                     columns: props.columns || 3,
                     cluster: item,
                     configuration: vue.unref(infra).configuration,
-                    includeTax: vue.unref(infra).includeTax,
+                    includeTax: resolvedIncludeTax.value,
                     showPrice: props.showPrice,
                     language: vue.unref(infra).language || "NL",
                     showStock: props.showStock,
@@ -16080,7 +16094,7 @@ const _sfc_main$b = /* @__PURE__ */ vue.defineComponent({
                     graphqlClient: vue.unref(infra).graphqlClient,
                     user: vue.unref(infra).user || null,
                     configuration: vue.unref(infra).configuration,
-                    includeTax: vue.unref(infra).includeTax,
+                    includeTax: resolvedIncludeTax.value,
                     cartId: props.cartId,
                     createCart: props.createCart,
                     onCartCreated: props.onCartCreated,