@propeller-commerce/propeller-v2-react-ui 0.6.0 → 0.7.0

package/dist/index.cjs

@@ -248,6 +248,7 @@ function useAddress(options) {
   );
   return { loading, error, createAddress, updateAddress, deleteAddress, setDefaultAddress };
 }
+var isViewerSearchInput = (v) => typeof v === "object" && v !== null && !Array.isArray(v);
 function useAuth(options) {
   const { graphqlClient, language = "NL", onAuthHeaderUpdate, configuration } = options;
   const [loading, setLoading] = React6.useState(false);
@@ -284,8 +285,14 @@ function useAuth(options) {
         ...configuration?.companyTrackAttributes?.length && {
           companyAttributesInput: { attributeDescription: { names: configuration.companyTrackAttributes } }
         },
-        ...configuration?.contactPAConfigInput && {
+        // Contact-scoped pagination inputs — only when the host supplies a real
+        // input object (an empty array `[]` is truthy but 400s the viewer). See
+        // isViewerSearchInput.
+        ...isViewerSearchInput(configuration?.contactPAConfigInput) && {
           contactPAConfigInput: configuration.contactPAConfigInput
+        },
+        ...isViewerSearchInput(configuration?.contactCompaniesSearchInput) && {
+          contactCompaniesSearchInput: configuration.contactCompaniesSearchInput
         }
       };
       const viewer = await userService.getViewer(viewerInput);
@@ -2491,6 +2498,140 @@ function useProductSearch(options) {
     goToPage: pagination.goToPage
   };
 }
+function toMatch(item, language) {
+  const isCluster = "clusterId" in item;
+  const displayItem = isCluster ? item.defaultProduct : item;
+  const productId = displayItem?.productId ?? item.productId;
+  const clusterId = isCluster ? item.clusterId : void 0;
+  const name = language && item.names?.find((n) => n.language === language)?.value || item.names?.[0]?.value || "Product";
+  const netPrice = displayItem?.price?.net ?? 0;
+  const grossPrice = displayItem?.price?.gross ?? 0;
+  const minQuantity = Math.max(1, displayItem?.minimumQuantity ?? 1);
+  const imageUrl = isCluster ? propellerV2CoreUi.getClusterImageUrl(item) : propellerV2CoreUi.getProductImageUrl(item);
+  return {
+    productId,
+    clusterId,
+    name,
+    sku: item.sku || displayItem?.sku || "",
+    netPrice,
+    grossPrice,
+    minQuantity,
+    imageUrl
+  };
+}
+function useQuickOrder(options) {
+  const {
+    graphqlClient,
+    user,
+    companyId,
+    configuration = {},
+    onCartCreated,
+    afterAddToCart
+  } = options;
+  const language = options.language || "NL";
+  const searchLimit = options.searchLimit ?? 8;
+  const [submitting, setSubmitting] = React6.useState(false);
+  const [error, setError] = React6.useState(null);
+  const searchProducts = React6.useCallback(
+    async (term) => {
+      const trimmed = term.trim();
+      if (!trimmed || !graphqlClient) return [];
+      try {
+        const service = propellerV2CoreUi.createServices(graphqlClient).product;
+        const input = {
+          term: trimmed,
+          language,
+          page: 1,
+          offset: searchLimit,
+          statuses: [propellerSdkV2.ProductStatus.A, propellerSdkV2.ProductStatus.P, propellerSdkV2.ProductStatus.T, propellerSdkV2.ProductStatus.S],
+          sortInputs: [{ field: propellerSdkV2.ProductSortField.RELEVANCE, order: propellerSdkV2.SortOrder.DESC }],
+          searchFields: [
+            {
+              fieldNames: [
+                propellerSdkV2.ProductSearchableField.SKU,
+                propellerSdkV2.ProductSearchableField.NAME,
+                propellerSdkV2.ProductSearchableField.KEYWORDS,
+                propellerSdkV2.ProductSearchableField.CUSTOM_KEYWORDS
+              ],
+              boost: 5
+            },
+            {
+              fieldNames: [
+                propellerSdkV2.ProductSearchableField.MANUFACTURER_CODE,
+                propellerSdkV2.ProductSearchableField.EAN_CODE,
+                propellerSdkV2.ProductSearchableField.BAR_CODE,
+                propellerSdkV2.ProductSearchableField.SUPPLIER_CODE,
+                propellerSdkV2.ProductSearchableField.PRODUCT_ID
+              ],
+              boost: 1
+            }
+          ]
+        };
+        const variables = {
+          input,
+          language,
+          imageVariantFilters: configuration.imageVariantFiltersSmall
+        };
+        const result = await service.getProducts(variables);
+        const items = result?.items ?? [];
+        return items.map((it) => toMatch(it, language));
+      } catch {
+        return [];
+      }
+    },
+    [graphqlClient, language, searchLimit, configuration]
+  );
+  const submit = React6.useCallback(
+    async (lines) => {
+      const valid = lines.filter((l) => l.productId && (l.quantity ?? 0) > 0);
+      if (!valid.length) return { success: false, error: "No items to add" };
+      if (!graphqlClient) return { success: false, error: "No GraphQL client" };
+      setSubmitting(true);
+      setError(null);
+      try {
+        const services = propellerV2CoreUi.createServices(graphqlClient);
+        const cart = await initCart({
+          services,
+          user: user ?? null,
+          companyId,
+          language,
+          imageSearchFilters: configuration.imageSearchFiltersGrid,
+          imageVariantFilters: configuration.imageVariantFiltersSmall,
+          onCartCreated
+        });
+        const items = valid.map((l) => ({
+          productId: l.productId,
+          quantity: l.quantity,
+          ...l.clusterId ? { clusterId: l.clusterId } : {}
+        }));
+        const bulk = await services.cart.bulkUpdateCartItems({
+          input: { cartId: cart.cartId, items }
+        });
+        const updated = await services.cart.getCart({
+          cartId: cart.cartId,
+          language,
+          imageSearchFilters: configuration.imageSearchFiltersGrid,
+          imageVariantFilters: configuration.imageVariantFiltersSmall
+        });
+        const finalCart = updated ?? cart;
+        afterAddToCart?.(finalCart);
+        return {
+          success: true,
+          cart: finalCart,
+          added: (bulk?.created ?? 0) + (bulk?.updated ?? 0)
+        };
+      } catch (e) {
+        const msg = e instanceof Error ? e.message : "Failed to add items to cart";
+        setError(msg);
+        return { success: false, error: msg };
+      } finally {
+        setSubmitting(false);
+      }
+    },
+    [graphqlClient, user, companyId, language, configuration, onCartCreated, afterAddToCart]
+  );
+  return { submitting, error, searchProducts, submit };
+}
 var inflightFetches3 = /* @__PURE__ */ new Set();
 var STOREFRONT_STATUSES = [
   propellerSdkV2.ProductStatus.A,
@@ -3466,7 +3607,13 @@ function LoginForm(rawProps) {
   const [email, setEmail] = React6.useState("");
   const [password, setPassword] = React6.useState("");
   const { loading, error: authError, login } = useAuth({
-    graphqlClient: props.graphqlClient
+    graphqlClient: props.graphqlClient,
+    // Resolved from <PropellerDepsProvider> by useInfraProps (the app's full
+    // `config`), so the login viewer requests the configured track attributes +
+    // pagination inputs (companyTrackAttributes → MY_INSTALLATIONS,
+    // contactCompaniesSearchInput, contactPAConfigInput). Without this the header
+    // login returns a viewer with no companies/attributes until a later refresh.
+    configuration: props.configuration
   });
   propellerV2CoreUi.getLabel(props.labels, "email", "Email");
   propellerV2CoreUi.getLabel(props.labels, "password", "Password");
@@ -6372,7 +6519,7 @@ function CartItem(rawProps) {
     }
     return "#";
   }
-  function getProductImageUrl5() {
+  function getProductImageUrl6() {
     return props.cartItem.product?.media?.images?.items?.[0]?.imageVariants?.[0]?.url || "";
   }
   function getProductSku3() {
@@ -6556,7 +6703,7 @@ function CartItem(rawProps) {
     derived: {
       name: getProductName5(),
       sku: getProductSku3(),
-      imageUrl: getProductImageUrl5(),
+      imageUrl: getProductImageUrl6(),
       productUrl: getProductUrl2(),
       isBundle: isBundleItem(),
       bundleName: getBundleName(),
@@ -9530,7 +9677,7 @@ function GridToolbar(rawProps) {
   const [currentSortOrder, setCurrentSortOrder] = React6.useState(propellerSdkV2.SortOrder.DESC);
   const [currentOffset, setCurrentOffset] = React6.useState(12);
   const [currentViewMode, setCurrentViewMode] = React6.useState("grid");
-  function getLabel54(key) {
+  function getLabel55(key) {
     const labels = props.labels || {};
     return labels[key] !== void 0 ? labels[key] : DEFAULT_LABELS[key] || key;
   }
@@ -9609,7 +9756,7 @@ function GridToolbar(rawProps) {
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: "propeller-grid-toolbar__count text-sm text-muted-foreground font-medium", children: props.itemsFound > 0 ? /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
             props.itemsFound,
             "\xA0",
-            props.itemsFound === 1 ? getLabel54("productSingular") : getLabel54("productPlural")
+            props.itemsFound === 1 ? getLabel55("productSingular") : getLabel55("productPlural")
           ] }) : null }),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "propeller-grid-toolbar__controls flex flex-wrap items-center gap-3", children: [
             /* @__PURE__ */ jsxRuntime.jsx(
@@ -9620,7 +9767,7 @@ function GridToolbar(rawProps) {
                 onChange: (e) => handleOffsetChange(parseInt(e.target.value)),
                 children: getOffsetOptions()?.map((n) => /* @__PURE__ */ jsxRuntime.jsxs("option", { value: n, children: [
                   n,
-                  getLabel54("perPage")
+                  getLabel55("perPage")
                 ] }, n))
               }
             ),
@@ -9636,7 +9783,7 @@ function GridToolbar(rawProps) {
                   {
                     value: field,
                     disabled: field === "PRICE" && isPriceSortDisabled(),
-                    children: getLabel54(field)
+                    children: getLabel55(field)
                   },
                   field
                 ))
@@ -9649,8 +9796,8 @@ function GridToolbar(rawProps) {
                 value: currentSortOrder,
                 onChange: (e) => handleSortOrderChange(e.target.value),
                 children: [
-                  /* @__PURE__ */ jsxRuntime.jsx("option", { value: propellerSdkV2.SortOrder.ASC, children: getLabel54("ASC") }),
-                  /* @__PURE__ */ jsxRuntime.jsx("option", { value: propellerSdkV2.SortOrder.DESC, children: getLabel54("DESC") })
+                  /* @__PURE__ */ jsxRuntime.jsx("option", { value: propellerSdkV2.SortOrder.ASC, children: getLabel55("ASC") }),
+                  /* @__PURE__ */ jsxRuntime.jsx("option", { value: propellerSdkV2.SortOrder.DESC, children: getLabel55("DESC") })
                 ]
               }
             ),
@@ -9660,7 +9807,7 @@ function GridToolbar(rawProps) {
                 type: "button",
                 className: "propeller-grid-toolbar__view-toggle h-9 w-9 flex items-center justify-center rounded-control border border-input bg-transparent hover:bg-accent hover:text-accent-foreground transition-colors",
                 onClick: (event) => handleViewChange(),
-                title: currentViewMode === "grid" ? getLabel54("switchToList") : getLabel54("switchToGrid"),
+                title: currentViewMode === "grid" ? getLabel55("switchToList") : getLabel55("switchToGrid"),
                 children: [
                   currentViewMode === "grid" ? /* @__PURE__ */ jsxRuntime.jsxs(
                     "svg",
@@ -9718,7 +9865,7 @@ function GridToolbar(rawProps) {
               onClick: (event) => {
                 if (props.onClearFilters) props.onClearFilters();
               },
-              children: getLabel54("clearAll")
+              children: getLabel55("clearAll")
             }
           ),
           props.priceFilterMin !== void 0 || props.priceFilterMax !== void 0 ? /* @__PURE__ */ jsxRuntime.jsxs(
@@ -9729,7 +9876,7 @@ function GridToolbar(rawProps) {
                 if (props.onPriceFilterRemove) props.onPriceFilterRemove();
               },
               children: [
-                getLabel54("price"),
+                getLabel55("price"),
                 ": \u20AC",
                 props.priceFilterMin ?? 0,
                 " \u2013 \u20AC",
@@ -9766,7 +9913,7 @@ var DEFAULT_LABELS2 = {
   of: "of"
 };
 function GridPagination(props) {
-  function getLabel54(key) {
+  function getLabel55(key) {
     const labels = props.labels || {};
     return labels[key] !== void 0 ? labels[key] : DEFAULT_LABELS2[key] || key;
   }
@@ -9839,15 +9986,15 @@ function GridPagination(props) {
               className: "propeller-grid-pagination__btn propeller-grid-pagination__btn--prev inline-flex items-center rounded-control border border-input bg-card px-4 py-2 text-sm font-medium text-foreground shadow-sm hover:bg-surface-hover disabled:opacity-40 disabled:cursor-not-allowed",
               disabled: currentPage === 1,
               onClick: () => handlePageChange(currentPage - 1),
-              children: getLabel54("previous")
+              children: getLabel55("previous")
             }
           ),
           /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "propeller-grid-pagination__info px-2 text-sm font-medium text-muted-foreground", children: [
-            getLabel54("page"),
+            getLabel55("page"),
             "\xA0",
             currentPage,
             "\xA0",
-            getLabel54("of"),
+            getLabel55("of"),
             "\xA0",
             totalPages
           ] }),
@@ -9858,7 +10005,7 @@ function GridPagination(props) {
               className: "propeller-grid-pagination__btn propeller-grid-pagination__btn--next inline-flex items-center rounded-control border border-input bg-card px-4 py-2 text-sm font-medium text-foreground shadow-sm hover:bg-surface-hover disabled:opacity-40 disabled:cursor-not-allowed",
               disabled: currentPage === totalPages,
               onClick: () => handlePageChange(currentPage + 1),
-              children: getLabel54("next")
+              children: getLabel55("next")
             }
           )
         ] }) : null,
@@ -9870,7 +10017,7 @@ function GridPagination(props) {
               className: "propeller-grid-pagination__btn propeller-grid-pagination__btn--prev inline-flex items-center rounded-control border border-input bg-card px-3 py-2 text-sm font-medium text-foreground shadow-sm hover:bg-surface-hover disabled:opacity-40 disabled:cursor-not-allowed",
               disabled: currentPage === 1,
               onClick: () => handlePageChange(currentPage - 1),
-              children: getLabel54("previous")
+              children: getLabel55("previous")
             }
           ),
           getFullPages().map((item, idx) => /* @__PURE__ */ jsxRuntime.jsx(
@@ -9897,7 +10044,7 @@ function GridPagination(props) {
               className: "propeller-grid-pagination__btn propeller-grid-pagination__btn--next inline-flex items-center rounded-control border border-input bg-card px-3 py-2 text-sm font-medium text-foreground shadow-sm hover:bg-surface-hover disabled:opacity-40 disabled:cursor-not-allowed",
               disabled: currentPage === totalPages,
               onClick: () => handlePageChange(currentPage + 1),
-              children: getLabel54("next")
+              children: getLabel55("next")
             }
           )
         ] }) : null
@@ -10376,7 +10523,7 @@ function formatPrice9(price, currency) {
 function getProductName2(product) {
   return product.names?.[0]?.value || `Product ${product.productId}`;
 }
-function getProductImageUrl3(product) {
+function getProductImageUrl4(product) {
   const media = product.media;
   if (media?.images?.items && Array.isArray(media.images.items) && media.images.items.length > 0) {
     const firstImage = media.images.items[0];
@@ -10405,7 +10552,7 @@ function ClusterOptions(props) {
           (p) => p.productId.toString() === selectedProductId
         );
         if (selectedProduct) {
-          previewImageUrl = getProductImageUrl3(selectedProduct);
+          previewImageUrl = getProductImageUrl4(selectedProduct);
           previewName = getProductName2(selectedProduct);
           previewPrice = formatPrice9(selectedProduct.price?.gross || 0, props.currency ?? "\u20AC");
         }
@@ -13782,6 +13929,347 @@ function OrderList(rawProps) {
   ] });
 }
 var OrderList_default = OrderList;
+var ROW_SEQ = 0;
+function blankRow() {
+  ROW_SEQ += 1;
+  return {
+    key: `qo-${ROW_SEQ}`,
+    code: "",
+    productId: null,
+    name: "",
+    netPrice: 0,
+    quantity: 1,
+    minQuantity: 1,
+    matches: [],
+    searching: false,
+    searched: false
+  };
+}
+function QuickOrderInner(props) {
+  const {
+    companyId,
+    language = "NL",
+    currency = "\u20AC",
+    configuration,
+    initialRows = 5,
+    searchThreshold = 3,
+    debounceMs = 300,
+    parseSpreadsheet,
+    templateUrl,
+    maxUploadBytes = 2 * 1024 * 1024,
+    maxUploadRows = 500,
+    onCartCreated,
+    afterAddToCart,
+    onMissingCodes,
+    className,
+    labels
+  } = props;
+  const user = props.user ?? null;
+  const graphqlClient = props.graphqlClient;
+  const displayPrice = (n) => props.formatPrice ? props.formatPrice(n) : propellerV2CoreUi.formatPrice(n, { symbol: currency });
+  const L = (key, fallback) => propellerV2CoreUi.getLabel(labels, key, fallback);
+  const { submitting, searchProducts, submit } = useQuickOrder({
+    graphqlClient,
+    user,
+    companyId,
+    language,
+    configuration,
+    onCartCreated,
+    afterAddToCart
+  });
+  const [rows, setRows] = React6.useState(
+    () => Array.from({ length: Math.max(1, initialRows) }, blankRow)
+  );
+  const [missing, setMissing] = React6.useState([]);
+  const [uploadError, setUploadError] = React6.useState(null);
+  const [uploading, setUploading] = React6.useState(false);
+  const [notice, setNotice] = React6.useState(null);
+  const fileInputRef = React6.useRef(null);
+  const searchTimers = React6.useRef({});
+  const patchRow = React6.useCallback((key, patch) => {
+    setRows((prev) => prev.map((r) => r.key === key ? { ...r, ...patch } : r));
+  }, []);
+  const onCodeInput = React6.useCallback(
+    (key, value) => {
+      patchRow(key, { code: value, productId: null, name: "", netPrice: 0, searched: false });
+      setNotice(null);
+      const timers = searchTimers.current;
+      if (timers[key]) clearTimeout(timers[key]);
+      if (value.trim().length < searchThreshold) {
+        patchRow(key, { matches: [], searching: false, searched: false });
+        return;
+      }
+      patchRow(key, { searching: true });
+      timers[key] = setTimeout(async () => {
+        const results = await searchProducts(value);
+        patchRow(key, { matches: results, searching: false, searched: true });
+      }, debounceMs);
+    },
+    [patchRow, searchProducts, searchThreshold, debounceMs]
+  );
+  const selectMatch = React6.useCallback(
+    (key, match) => {
+      const dup = rows.some((r) => r.key !== key && r.productId && r.code === match.sku);
+      if (dup) {
+        setNotice(L("alreadyInList", "Product is already in the list"));
+        patchRow(key, { code: "", matches: [], productId: null, name: "", netPrice: 0, searched: false });
+        return;
+      }
+      patchRow(key, {
+        code: match.sku,
+        productId: match.productId,
+        clusterId: match.clusterId,
+        name: match.name,
+        netPrice: match.netPrice,
+        quantity: match.minQuantity,
+        minQuantity: match.minQuantity,
+        matches: [],
+        searching: false,
+        searched: false
+      });
+    },
+    [rows, patchRow, L]
+  );
+  const setQuantity = React6.useCallback(
+    (key, raw) => {
+      const n = parseInt(raw, 10);
+      setRows(
+        (prev) => prev.map(
+          (r) => r.key === key ? { ...r, quantity: Number.isFinite(n) && n > 0 ? Math.max(r.minQuantity, n) : r.minQuantity } : r
+        )
+      );
+    },
+    []
+  );
+  const addRow = React6.useCallback(() => setRows((prev) => [...prev, blankRow()]), []);
+  const removeRow = React6.useCallback(
+    (key) => setRows((prev) => prev.length > 1 ? prev.filter((r) => r.key !== key) : prev),
+    []
+  );
+  const resolvedCount = React6.useMemo(() => rows.filter((r) => r.productId).length, [rows]);
+  const onFileChosen = React6.useCallback(
+    async (file) => {
+      if (!file || !parseSpreadsheet) return;
+      setUploadError(null);
+      setMissing([]);
+      if (file.size > maxUploadBytes) {
+        setUploadError(`File too large (max ${Math.round(maxUploadBytes / 1024 / 1024)} MB)`);
+        return;
+      }
+      setUploading(true);
+      try {
+        let lines = await parseSpreadsheet(file);
+        lines = lines.slice(0, maxUploadRows).map((l) => ({ code: String(l.code ?? "").trim(), quantity: Math.max(1, parseInt(String(l.quantity), 10) || 1) })).filter((l) => l.code.length > 0);
+        if (!lines.length) {
+          setUploadError("No valid rows found in the file");
+          return;
+        }
+        const resolved = [];
+        const notFound = [];
+        for (const line of lines) {
+          const matches = await searchProducts(line.code);
+          const exact = matches.find((m) => m.sku.toLowerCase() === line.code.toLowerCase()) || matches[0];
+          if (!exact) {
+            notFound.push(line.code);
+            continue;
+          }
+          if (resolved.some((r) => r.productId === exact.productId)) continue;
+          const row = blankRow();
+          resolved.push({
+            ...row,
+            code: exact.sku,
+            productId: exact.productId,
+            clusterId: exact.clusterId,
+            name: exact.name,
+            netPrice: exact.netPrice,
+            quantity: Math.max(exact.minQuantity, line.quantity),
+            minQuantity: exact.minQuantity
+          });
+        }
+        if (resolved.length) {
+          setRows([...resolved, blankRow()]);
+        }
+        if (notFound.length) {
+          setMissing(notFound);
+          onMissingCodes?.(notFound);
+        }
+      } catch {
+        setUploadError("Could not read the file");
+      } finally {
+        setUploading(false);
+        if (fileInputRef.current) fileInputRef.current.value = "";
+      }
+    },
+    [parseSpreadsheet, maxUploadBytes, maxUploadRows, searchProducts, onMissingCodes]
+  );
+  const handleSubmit = React6.useCallback(async () => {
+    const lines = rows.filter((r) => r.productId).map((r) => ({ productId: r.productId, quantity: r.quantity, clusterId: r.clusterId, code: r.code }));
+    if (!lines.length) {
+      setNotice(L("noItems", "Add at least one product before submitting"));
+      return;
+    }
+    const res = await submit(lines);
+    if (res.success) {
+      setRows(Array.from({ length: Math.max(1, initialRows) }, blankRow));
+      setMissing([]);
+      setNotice(null);
+    } else {
+      setNotice(res.error ?? "Failed to add items to cart");
+    }
+  }, [rows, submit, initialRows, L]);
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: className ?? "propeller-quick-order", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col lg:flex-row gap-8", children: [
+    parseSpreadsheet ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full lg:w-1/3", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-lg font-semibold mb-3 text-foreground", children: L("uploadTitle", "Upload Excel file") }),
+      templateUrl ? /* @__PURE__ */ jsxRuntime.jsx(
+        "a",
+        {
+          href: templateUrl,
+          target: "_blank",
+          rel: "noopener nofollow",
+          className: "text-primary hover:underline text-sm inline-block mb-4",
+          children: L("downloadTemplate", "Download XLSX template")
+        }
+      ) : null,
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground mb-3", children: L("uploadHint", "Column A: article no. / SKU \u2014 Column B: quantity. First two rows are ignored.") }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "input",
+        {
+          ref: fileInputRef,
+          type: "file",
+          accept: ".xlsx,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,application/vnd.ms-excel",
+          className: "block w-full text-sm text-muted-foreground file:mr-3 file:py-2 file:px-4 file:rounded file:border-0 file:bg-primary file:text-primary-foreground hover:file:bg-primary/90",
+          onChange: (e) => onFileChosen(e.target.files?.[0]),
+          disabled: uploading
+        }
+      ),
+      uploading ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground mt-2", children: L("upload", "Uploading\u2026") }) : null,
+      uploadError ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-destructive mt-2", children: uploadError }) : null
+    ] }) : null,
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-lg font-semibold mb-3 text-foreground", children: L("title", "Add your products manually") }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "hidden md:grid grid-cols-12 gap-2 px-2 pb-2 text-xs font-medium text-muted-foreground border-b border-border", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-3", children: L("colCode", "Article no. / SKU") }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-3", children: L("colName", "Product name") }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-2", children: L("colPrice", "excl. VAT") }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-1", children: L("colQuantity", "Qty") }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-2 text-right", children: L("colTotal", "Total") }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-1" })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "divide-y divide-border", children: rows.map((r) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-12 gap-2 items-center py-2 relative", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "col-span-12 md:col-span-3 relative", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "input",
+            {
+              type: "text",
+              value: r.code,
+              onChange: (e) => onCodeInput(r.key, e.target.value),
+              readOnly: !!r.productId,
+              placeholder: L("colCode", "Article no. / SKU"),
+              className: "w-full rounded border border-input bg-background px-2 py-1.5 text-sm focus:outline-none focus:ring-2 focus:ring-ring"
+            }
+          ),
+          (r.searching || r.matches.length > 0 || r.searched) && !r.productId ? /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "absolute z-20 mt-1 w-[320px] max-w-[90vw] bg-card border border-border rounded shadow-lg max-h-72 overflow-auto", children: r.searching ? /* @__PURE__ */ jsxRuntime.jsx("li", { className: "px-3 py-2 text-sm text-muted-foreground", children: "\u2026" }) : r.matches.length ? r.matches.map((m) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsxs(
+            "button",
+            {
+              type: "button",
+              onClick: () => selectMatch(r.key, m),
+              className: "flex items-center gap-2 w-full text-left px-3 py-2 hover:bg-muted text-sm",
+              children: [
+                m.imageUrl ? (
+                  // eslint-disable-next-line @next/next/no-img-element
+                  /* @__PURE__ */ jsxRuntime.jsx("img", { src: m.imageUrl, alt: "", width: 32, height: 32, className: "rounded object-cover" })
+                ) : null,
+                /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex-1", children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "block text-foreground", children: m.name }),
+                  m.sku ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "block text-xs text-muted-foreground", children: [
+                    "SKU: ",
+                    m.sku
+                  ] }) : null
+                ] })
+              ]
+            }
+          ) }, `${r.key}-${m.productId}`)) : /* @__PURE__ */ jsxRuntime.jsx("li", { className: "px-3 py-2 text-sm text-muted-foreground", children: L("noResults", "No results found") }) }) : null
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-6 md:col-span-3", children: /* @__PURE__ */ jsxRuntime.jsx(
+          "input",
+          {
+            type: "text",
+            value: r.name,
+            disabled: true,
+            className: "w-full rounded border border-input bg-muted/40 px-2 py-1.5 text-sm text-muted-foreground"
+          }
+        ) }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-3 md:col-span-2", children: /* @__PURE__ */ jsxRuntime.jsx(
+          "input",
+          {
+            type: "text",
+            value: r.productId ? displayPrice(r.netPrice) : "",
+            disabled: true,
+            className: "w-full rounded border border-input bg-muted/40 px-2 py-1.5 text-sm text-muted-foreground"
+          }
+        ) }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-3 md:col-span-1", children: /* @__PURE__ */ jsxRuntime.jsx(
+          "input",
+          {
+            type: "number",
+            min: r.minQuantity,
+            step: 1,
+            value: r.productId ? r.quantity : "",
+            disabled: !r.productId,
+            onChange: (e) => setQuantity(r.key, e.target.value),
+            onKeyDown: (e) => {
+              if (["e", "E", "+", "-", "."].includes(e.key)) e.preventDefault();
+            },
+            className: "w-full rounded border border-input bg-background px-2 py-1.5 text-sm focus:outline-none focus:ring-2 focus:ring-ring disabled:bg-muted/40"
+          }
+        ) }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-9 md:col-span-2 text-right text-sm text-foreground whitespace-nowrap", children: r.productId ? displayPrice(r.netPrice * r.quantity) : "" }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-3 md:col-span-1 flex justify-end", children: /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            type: "button",
+            onClick: () => removeRow(r.key),
+            "aria-label": L("remove", "Remove"),
+            className: "text-muted-foreground hover:text-destructive p-1",
+            children: "\u2715"
+          }
+        ) })
+      ] }, r.key)) }),
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        "button",
+        {
+          type: "button",
+          onClick: addRow,
+          className: "mt-3 text-primary hover:underline text-sm font-medium",
+          children: [
+            "+ ",
+            L("addRow", "Add more rows")
+          ]
+        }
+      ),
+      missing.length ? /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-sm text-destructive mt-4", children: [
+        L("missingCodes", "The following products were not added:"),
+        " ",
+        missing.join(", ")
+      ] }) : null,
+      notice ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-destructive mt-2", children: notice }) : null,
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-end mt-6 pt-4 border-t border-border", children: /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          onClick: handleSubmit,
+          disabled: submitting || resolvedCount === 0,
+          className: "bg-primary text-primary-foreground px-6 py-2.5 rounded font-medium hover:bg-primary/90 transition disabled:opacity-50 disabled:cursor-not-allowed",
+          children: submitting ? L("adding", "Adding\u2026") : L("addToCart", "Add to cart")
+        }
+      ) })
+    ] })
+  ] }) });
+}
+function QuickOrder(rawProps) {
+  const props = useInfraProps(rawProps);
+  return /* @__PURE__ */ jsxRuntime.jsx(QuickOrderInner, { ...props });
+}
 function OrderShipments(props) {
   const [activeShipment, setActiveShipment] = React6.useState(null);
   const shipments = props.order?.shipments || [];
@@ -18258,6 +18746,7 @@ exports.PropellerDepsProvider = PropellerDepsProvider;
 exports.PropellerProvider = PropellerProvider;
 exports.PurchaseAuthorizationConfigurator = PurchaseAuthorizationConfigurator_default;
 exports.PurchaseAuthorizationRequests = PurchaseAuthorizationRequests_default;
+exports.QuickOrder = QuickOrder;
 exports.QuoteActions = QuoteActions_default;
 exports.RegisterForm = RegisterForm_default;
 exports.SearchBar = SearchBar_default;
@@ -18288,6 +18777,7 @@ exports.usePropellerDeps = usePropellerDeps;
 exports.usePropellerScope = usePropellerScope;
 exports.usePurchaseAuthorizationConfigurator = usePurchaseAuthorizationConfigurator;
 exports.usePurchaseAuthorizationRequests = usePurchaseAuthorizationRequests;
+exports.useQuickOrder = useQuickOrder;
 exports.useRequiredPropellerDeps = useRequiredPropellerDeps;
 exports.useResolvedProps = useResolvedProps;
 exports.useServices = useServices;