@propeller-commerce/propeller-v2-vue-ui 0.3.36 → 0.3.38

package/CHANGELOG.md

@@ -8,6 +8,42 @@ 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.38] - 2026-07-21
+
+### Fixed
+
+- **`SearchBar` autosuggest orderlist scoping — real fix.** 0.3.37 set
+  `orderlistIds`/`applyOrderlists` on the flat `products` search input, but the
+  server's `products` resolver does not honour orderlist scoping (only the
+  `category.products` resolver does), so the preview still leaked the full
+  catalogue inside a contract. The debounced autosuggest now runs the **same
+  category term-search the grid uses** (`getCategory` over the base category)
+  instead of the flat `getProducts`, so contract scoping is applied server-side
+  and the preview matches the grid exactly. Requires
+  `configuration.baseCategoryId` (already provided by all consumers).
+
+## [0.3.37] - 2026-07-21
+
+### Fixed
+
+- **`SearchBar` autosuggest now respects orderlist (contract) scoping.** The
+  debounced live-search query built a plain `ProductSearchInput` that never
+  passed `orderlistIds`/`applyOrderlists`, so the dropdown previewed the full
+  catalogue even inside a B2B contract catalogue (the submitted results were
+  already correctly scoped — only the preview leaked). It now threads the same
+  orderlist scope as the grid fetch, so previews and results agree and a PDP
+  outside the contract is no longer reachable from the preview.
+
+### Added
+
+- **`SearchBar`: `#price` scoped slot + `showPrice` prop.** The scoped
+  `#price` slot (receives `{ result }`) replaces the price cell of each result
+  with custom content — e.g. a "Price by quotation" label for a contract
+  catalogue where prices are quote-only; it fully overrides the default price
+  rendering. `showPrice` (default `true`) is a simpler boolean to hide the
+  price column outright. Both default to the previous behaviour, so the change
+  is backward-compatible.
+
 ## [0.3.36] - 2026-07-21
 
 ### Added

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

@@ -61,6 +61,17 @@ export interface SearchBarProps {
      * Omit to keep the button fallback.
      */
     getViewAllHref?: (term: string) => string;
+    /**
+     * Show the price column on each autosuggest result. Defaults to `true`.
+     * Set `false` to hide prices entirely in the dropdown — e.g. a B2B
+     * contract-catalogue context where prices are quote-only and shouldn't
+     * appear in the live preview. Ignored when the `price` slot is provided.
+     *
+     * For custom per-result price content (e.g. a "Price by quotation" label),
+     * use the scoped `#price` slot instead — it receives `{ result }` and fully
+     * overrides the default price cell.
+     */
+    showPrice?: boolean;
     /** Custom price formatting function */
     formatPrice?: (price: number) => string;
     /** Labels for the component */
@@ -107,5 +118,32 @@ export interface SearchBarProps {
      */
     clearSignal?: number;
 }
-declare const _default: import('vue').DefineComponent<SearchBarProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<SearchBarProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        price?(_: {
+            result: {
+                id: number | string;
+                name: string;
+                sku?: string | undefined;
+                price?: number | undefined;
+                priceNet?: number | undefined;
+                priceGross?: number | undefined;
+                imageUrl?: string | undefined;
+                url?: string | undefined;
+                isCluster?: boolean | undefined;
+            };
+        }): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<SearchBarProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<SearchBarProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/index.cjs

@@ -2190,10 +2190,24 @@ function useProductSearch(options) {
       if (!graphqlClient) return;
       searchLoading.value = true;
       try {
-        const service = index.createServices(graphqlClient).product;
         const lang = languageRef.value || "NL";
-        const input = {
-          term,
+        const service = index.createServices(graphqlClient).category;
+        const catId = configuration?.baseCategoryId ?? 0;
+        if (!catId) {
+          searchResults.value = [];
+          searchItemsFound.value = 0;
+          return;
+        }
+        const searchOrderlistIds = options.orderlistIds?.value;
+        const orderlistScope = searchOrderlistIds && searchOrderlistIds.length > 0 ? {
+          applyOrderlists: options.applyOrderlists?.value !== false,
+          orderlistIds: searchOrderlistIds
+        } : { applyOrderlists: false };
+        const user = userRef.value;
+        const userId = user && "contactId" in user ? user.contactId : user && "customerId" in user ? user.customerId : void 0;
+        const contactId = user && "contactId" in user ? user.contactId : void 0;
+        const customerId = user && "customerId" in user ? user.customerId : void 0;
+        const categoryProductSearchInput = {
           language: lang,
           page: 1,
           offset: 10,
@@ -2203,7 +2217,8 @@ function useProductSearch(options) {
             propellerSdkV2.ProductStatus.T,
             propellerSdkV2.ProductStatus.S
           ],
-          sortInputs: [{ field: propellerSdkV2.ProductSortField.RELEVANCE, order: propellerSdkV2.SortOrder.DESC }],
+          hidden: false,
+          term,
           searchFields: [
             {
               fieldNames: [
@@ -2230,16 +2245,30 @@ function useProductSearch(options) {
               ],
               boost: 1
             }
-          ]
+          ],
+          sortInputs: [{ field: propellerSdkV2.ProductSortField.RELEVANCE, order: propellerSdkV2.SortOrder.DESC }],
+          ...companyIdRef.value && { companyId: companyIdRef.value },
+          ...userId !== void 0 && { userId },
+          ...orderlistScope
+        };
+        const priceCalculateProductInput = {
+          taxZone,
+          ...companyIdRef.value && { companyId: companyIdRef.value },
+          ...contactId !== void 0 && { contactId },
+          ...customerId !== void 0 && { customerId }
         };
         const variables = {
-          input,
+          categoryId: catId,
           language: lang,
+          categoryProductSearchInput,
+          priceCalculateProductInput,
+          imageSearchFilters: configuration?.imageSearchFiltersGrid,
           imageVariantFilters: configuration?.imageVariantFiltersMedium
         };
-        const result = await service.getProducts(variables);
-        searchResults.value = result?.items ?? [];
-        searchItemsFound.value = result?.itemsFound ?? searchResults.value.length;
+        const response = await service.getCategory(variables);
+        const productsResponse = response?.products;
+        searchResults.value = productsResponse?.items ?? [];
+        searchItemsFound.value = productsResponse?.itemsFound ?? searchResults.value.length;
       } catch {
         searchResults.value = [];
         searchItemsFound.value = 0;
@@ -19937,7 +19966,7 @@ const _hoisted_11$1 = {
   class: "propeller-search-bar__result-sku text-sm text-muted-foreground"
 };
 const _hoisted_12$1 = {
-  key: 1,
+  key: 2,
   class: "propeller-search-bar__result-price text-sm font-semibold text-foreground flex-shrink-0 text-right"
 };
 const _hoisted_13$1 = { class: "propeller-search-bar__result-price-value" };
@@ -19964,6 +19993,7 @@ const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
     onViewAllClick: { type: Function },
     getResultHref: { type: Function },
     getViewAllHref: { type: Function },
+    showPrice: { type: Boolean },
     formatPrice: { type: Function },
     labels: {},
     includeTax: { type: Boolean },
@@ -20196,7 +20226,10 @@ const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
                       vue.createElementVNode("div", _hoisted_10$1, vue.toDisplayString(result.name), 1),
                       result.sku ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_11$1, "SKU: " + vue.toDisplayString(result.sku), 1)) : vue.createCommentVNode("", true)
                     ]),
-                    result.price !== void 0 && result.price !== null ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_12$1, [
+                    _ctx.$slots.price ? vue.renderSlot(_ctx.$slots, "price", {
+                      key: 1,
+                      result
+                    }) : __props.showPrice !== false && result.price !== void 0 && result.price !== null ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_12$1, [
                       vue.createElementVNode("span", _hoisted_13$1, vue.toDisplayString(formatItemPrice(leadingPrice(result))), 1),
                       vue.createElementVNode("span", _hoisted_14$1, vue.toDisplayString(priceTaxLabel()), 1)
                     ])) : vue.createCommentVNode("", true)