@propeller-commerce/propeller-v2-react-ui 0.15.4 → 0.15.6

package/dist/index.d.cts

@@ -3536,6 +3536,8 @@ interface CategoryDescriptionProps {
     maxLength?: number;
     /** Extra CSS class applied to the root element. */
     className?: string;
+    /** Translated labels: `readMore`, `readLess`. */
+    labels?: Record<string, string>;
 }
 /**
  * Renders a category's localised HTML description, optionally truncated with a
@@ -6083,6 +6085,8 @@ interface ProductDescriptionProps {
     maxLength?: number;
     /** Extra CSS class applied to the root element. */
     className?: string;
+    /** Translated labels: `readMore`, `readLess`. */
+    labels?: Record<string, string>;
 }
 /**
  * Renders a product's localised HTML description, optionally collapsed to a

package/dist/index.d.ts

@@ -3536,6 +3536,8 @@ interface CategoryDescriptionProps {
     maxLength?: number;
     /** Extra CSS class applied to the root element. */
     className?: string;
+    /** Translated labels: `readMore`, `readLess`. */
+    labels?: Record<string, string>;
 }
 /**
  * Renders a category's localised HTML description, optionally truncated with a
@@ -6083,6 +6085,8 @@ interface ProductDescriptionProps {
     maxLength?: number;
     /** Extra CSS class applied to the root element. */
     className?: string;
+    /** Translated labels: `readMore`, `readLess`. */
+    labels?: Record<string, string>;
 }
 /**
  * Renders a product's localised HTML description, optionally collapsed to a

package/dist/index.js

@@ -1572,15 +1572,15 @@ function buildCategoriesQuery(depth) {
     categories {
       categoryId
       hidden
-      names(language: $language) { value language }
-      slugs(language: $language) { value }
+      names { value language }
+      slugs { value language }
       ${buildCategoriesQuery(depth - 1)}
     }
   `;
 }
 function mapCategory(raw, language) {
   const nameEntry = raw.names?.find((n) => n.language === language) ?? raw.names?.[0];
-  const slugEntry = raw.slugs?.[0];
+  const slugEntry = raw.slugs?.find((s) => s.language === language) ?? raw.slugs?.[0];
   return {
     categoryId: raw.categoryId,
     name: nameEntry?.value ?? "",
@@ -1656,17 +1656,17 @@ function useMenu(options) {
     inflightFetches.set(key, promise);
     try {
       const gql = `
-        query Menu($categoryId: Float, $language: String) {
+        query Menu($categoryId: Float) {
           category(categoryId: $categoryId) {
             categoryId
             hidden
-            names(language: $language) { value language }
-            slugs(language: $language) { value }
+            names { value language }
+            slugs { value language }
             ${buildCategoriesQuery(depth)}
           }
         }
       `;
-      const variables = { categoryId: rootCategoryId, language };
+      const variables = { categoryId: rootCategoryId };
       const data = await graphqlClient.query(gql, variables);
       const root = data?.category ?? null;
       const items = root ? (root.categories ?? []).filter((cat) => !isHidden(cat)).map((cat) => mapCategory(cat, language)) : [];
@@ -4161,10 +4161,7 @@ function AccountIconAndMenu(rawProps) {
                     )
                   }
                 ),
-                props.user ? /* @__PURE__ */ jsxs("span", { className: "propeller-account-menu__greeting hidden md:block font-normal", children: [
-                  "Hi, ",
-                  getUserName()
-                ] }) : null,
+                props.user ? /* @__PURE__ */ jsx("span", { className: "propeller-account-menu__greeting hidden md:block font-normal", children: getLabel(props.labels, "greeting", "Hi, {name}").replace("{name}", getUserName()) }) : null,
                 !props.user ? /* @__PURE__ */ jsx("span", { className: "propeller-account-menu__greeting hidden md:block font-normal", children: getLabel(props.labels, "accountLabel", "Account") }) : null
               ]
             }
@@ -7975,7 +7972,7 @@ function CategoryDescription(props) {
             type: "button",
             className: "propeller-category-description__toggle mt-2 text-sm font-medium text-primary hover:underline",
             onClick: () => setExpanded((v) => !v),
-            children: expanded ? "Read less" : "Read more"
+            children: expanded ? getLabel(props.labels, "readLess", "Read less") : getLabel(props.labels, "readMore", "Read more")
           }
         ) : null
       ]
@@ -9892,7 +9889,7 @@ function GridToolbar(rawProps) {
   const [currentSortOrder, setCurrentSortOrder] = useState(SortOrder.DESC);
   const [currentOffset, setCurrentOffset] = useState(12);
   const [currentViewMode, setCurrentViewMode] = useState("grid");
-  function getLabel56(key) {
+  function getLabel59(key) {
     const labels = props.labels || {};
     return labels[key] !== void 0 ? labels[key] : DEFAULT_LABELS[key] || key;
   }
@@ -9930,8 +9927,8 @@ function GridToolbar(rawProps) {
   }
   function getAvailabilityLabel() {
     const qty = props.minStock;
-    if (qty !== void 0 && qty > MIN_STOCK_THRESHOLD) return `${getLabel56("inStock")}: ${qty}+`;
-    return getLabel56("inStock");
+    if (qty !== void 0 && qty > MIN_STOCK_THRESHOLD) return `${getLabel59("inStock")}: ${qty}+`;
+    return getLabel59("inStock");
   }
   function handleSortFieldChange(field) {
     setCurrentSortField(field);
@@ -9977,7 +9974,7 @@ function GridToolbar(rawProps) {
           /* @__PURE__ */ jsx("div", { className: "propeller-grid-toolbar__count text-sm text-muted-foreground font-medium", children: props.itemsFound > 0 ? /* @__PURE__ */ jsxs("span", { children: [
             props.itemsFound,
             "\xA0",
-            props.itemsFound === 1 ? getLabel56("productSingular") : getLabel56("productPlural")
+            props.itemsFound === 1 ? getLabel59("productSingular") : getLabel59("productPlural")
           ] }) : null }),
           /* @__PURE__ */ jsxs("div", { className: "propeller-grid-toolbar__controls flex flex-wrap items-center gap-3", children: [
             /* @__PURE__ */ jsx(
@@ -9988,7 +9985,7 @@ function GridToolbar(rawProps) {
                 onChange: (e) => handleOffsetChange(parseInt(e.target.value)),
                 children: getOffsetOptions()?.map((n) => /* @__PURE__ */ jsxs("option", { value: n, children: [
                   n,
-                  getLabel56("perPage")
+                  getLabel59("perPage")
                 ] }, n))
               }
             ),
@@ -10004,7 +10001,7 @@ function GridToolbar(rawProps) {
                   {
                     value: field,
                     disabled: field === "PRICE" && isPriceSortDisabled(),
-                    children: getLabel56(field)
+                    children: getLabel59(field)
                   },
                   field
                 ))
@@ -10017,8 +10014,8 @@ function GridToolbar(rawProps) {
                 value: currentSortOrder,
                 onChange: (e) => handleSortOrderChange(e.target.value),
                 children: [
-                  /* @__PURE__ */ jsx("option", { value: SortOrder.ASC, children: getLabel56("ASC") }),
-                  /* @__PURE__ */ jsx("option", { value: SortOrder.DESC, children: getLabel56("DESC") })
+                  /* @__PURE__ */ jsx("option", { value: SortOrder.ASC, children: getLabel59("ASC") }),
+                  /* @__PURE__ */ jsx("option", { value: SortOrder.DESC, children: getLabel59("DESC") })
                 ]
               }
             ),
@@ -10028,7 +10025,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" ? getLabel56("switchToList") : getLabel56("switchToGrid"),
+                title: currentViewMode === "grid" ? getLabel59("switchToList") : getLabel59("switchToGrid"),
                 children: [
                   currentViewMode === "grid" ? /* @__PURE__ */ jsxs(
                     "svg",
@@ -10086,7 +10083,7 @@ function GridToolbar(rawProps) {
               onClick: (event) => {
                 if (props.onClearFilters) props.onClearFilters();
               },
-              children: getLabel56("clearAll")
+              children: getLabel59("clearAll")
             }
           ),
           props.priceFilterMin !== void 0 || props.priceFilterMax !== void 0 ? /* @__PURE__ */ jsxs(
@@ -10097,7 +10094,7 @@ function GridToolbar(rawProps) {
                 if (props.onPriceFilterRemove) props.onPriceFilterRemove();
               },
               children: [
-                getLabel56("price"),
+                getLabel59("price"),
                 ": \u20AC",
                 props.priceFilterMin ?? 0,
                 " \u2013 \u20AC",
@@ -10147,7 +10144,7 @@ var DEFAULT_LABELS2 = {
   of: "of"
 };
 function GridPagination(props) {
-  function getLabel56(key) {
+  function getLabel59(key) {
     const labels = props.labels || {};
     return labels[key] !== void 0 ? labels[key] : DEFAULT_LABELS2[key] || key;
   }
@@ -10220,15 +10217,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: getLabel56("previous")
+              children: getLabel59("previous")
             }
           ),
           /* @__PURE__ */ jsxs("span", { className: "propeller-grid-pagination__info px-2 text-sm font-medium text-muted-foreground", children: [
-            getLabel56("page"),
+            getLabel59("page"),
             "\xA0",
             currentPage,
             "\xA0",
-            getLabel56("of"),
+            getLabel59("of"),
             "\xA0",
             totalPages
           ] }),
@@ -10239,7 +10236,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: getLabel56("next")
+              children: getLabel59("next")
             }
           )
         ] }) : null,
@@ -10251,7 +10248,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: getLabel56("previous")
+              children: getLabel59("previous")
             }
           ),
           getFullPages().map((item, idx) => /* @__PURE__ */ jsx(
@@ -10278,7 +10275,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: getLabel56("next")
+              children: getLabel59("next")
             }
           )
         ] }) : null
@@ -10417,7 +10414,7 @@ function MachineGrid(rawProps) {
     const cards = rootMachines.map((m) => ({ machine: m, href: childSlugHref(m) })).filter((c) => c.href !== null);
     return /* @__PURE__ */ jsxs("div", { className: rawProps.className, children: [
       /* @__PURE__ */ jsx("h1", { className: "propeller-grid-title mb-6 text-2xl font-semibold", children: rawProps.rootTitle ?? "Machines" }),
-      rootLoading ? /* @__PURE__ */ jsx("p", { className: "py-12 text-center text-foreground-subtle", children: "Loading\u2026" }) : cards.length === 0 ? /* @__PURE__ */ jsx("p", { className: "py-12 text-center text-foreground-subtle", children: "No machines found." }) : /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4", children: cards.map(({ machine: m, href }) => /* @__PURE__ */ jsx(
+      rootLoading ? /* @__PURE__ */ jsx("p", { className: "py-12 text-center text-foreground-subtle", children: getLabel(rawProps.machineCardLabels, "loading", "Loading\u2026") }) : cards.length === 0 ? /* @__PURE__ */ jsx("p", { className: "py-12 text-center text-foreground-subtle", children: getLabel(rawProps.machineCardLabels, "noMachines", "No machines found.") }) : /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4", children: cards.map(({ machine: m, href }) => /* @__PURE__ */ jsx(
         MachineCard,
         {
           machine: m,
@@ -15416,7 +15413,7 @@ function ProductDescription(props) {
             type: "button",
             className: "propeller-product-description__toggle mt-2 text-sm font-medium text-primary hover:underline",
             onClick: () => setExpanded((v) => !v),
-            children: expanded ? "Read less" : "Read more"
+            children: expanded ? getLabel(props.labels, "readLess", "Read less") : getLabel(props.labels, "readMore", "Read more")
           }
         ) : null
       ]
@@ -16731,7 +16728,8 @@ function ProductTabs(rawProps) {
                 product: props.product,
                 language: props.language,
                 collapsed: props.descriptionCollapsed,
-                maxLength: props.descriptionMaxLength
+                maxLength: props.descriptionMaxLength,
+                labels: props.labels
               }
             ) : null,
             specsVisited && isTabVisible("specifications") ? /* @__PURE__ */ jsx("div", { className: isActive("specifications") ? "" : "hidden", children: /* @__PURE__ */ jsx(
@@ -16801,7 +16799,8 @@ function ProductTabs(rawProps) {
                 product: props.product,
                 language: props.language,
                 collapsed: props.descriptionCollapsed,
-                maxLength: props.descriptionMaxLength
+                maxLength: props.descriptionMaxLength,
+                labels: props.labels
               }
             ) }) : null
           ] }) : null,
@@ -17129,8 +17128,9 @@ function PurchaseAuthorizationConfigurator(rawProps) {
                   {
                     type: "button",
                     className: "text-muted-foreground hover:text-foreground transition",
+                    "aria-label": getLabel(props.labels, "closeLabel", "Close"),
                     onClick: () => closeAddContactModal(),
-                    children: "\u2715"
+                    children: /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children: "\u2715" })
                   }
                 )
               ] }),
@@ -17228,7 +17228,7 @@ function PurchaseAuthorizationConfigurator(rawProps) {
                   }
                 )
               ] }),
-              addContactError ? /* @__PURE__ */ jsx("p", { className: "text-sm text-destructive", children: addContactError }) : null,
+              addContactError ? /* @__PURE__ */ jsx("p", { className: "text-sm text-destructive", children: props.labels?.addContactFailed || addContactError }) : null,
               /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-3 pt-2", children: [
                 /* @__PURE__ */ jsx(
                   "button",
@@ -17381,8 +17381,9 @@ function PurchaseAuthorizationRequests(rawProps) {
             {
               type: "button",
               className: "propeller-purchase-authorization-requests__modal-close text-foreground-subtle hover:text-foreground focus:outline-none",
+              "aria-label": getLabel(props.labels, "closeLabel", "Close"),
               onClick: () => closeModal(),
-              children: /* @__PURE__ */ jsx("svg", { fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", className: "h-5 w-5", strokeWidth: 2, children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6 18L18 6M6 6l12 12" }) })
+              children: /* @__PURE__ */ jsx("svg", { "aria-hidden": "true", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", className: "h-5 w-5", strokeWidth: 2, children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6 18L18 6M6 6l12 12" }) })
             }
           )
         ] }),
@@ -17665,6 +17666,8 @@ function RegisterForm(rawProps) {
   const emailPlaceholder = props.labels?.emailPlaceholder || "name@example.com";
   const passwordPlaceholder = props.labels?.passwordPlaceholder || "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022";
   const passwordMismatchText = props.labels?.passwordMismatch || "Passwords do not match";
+  const selectUserTypeText = props.labels?.selectUserType || "Please select an account type.";
+  const registrationFailedText = props.labels?.registrationFailed;
   const loginText = props.labels?.loginText || "Already have an account?";
   const loginLinkText = props.labels?.loginLink || "Log in";
   function isFieldRequired(fieldName) {
@@ -17675,7 +17678,7 @@ function RegisterForm(rawProps) {
   async function handleSubmit(e) {
     e.preventDefault();
     if (!effectiveUserType) {
-      setError("Please select an account type.");
+      setError(selectUserTypeText);
       return;
     }
     if (password !== confirmPassword) {
@@ -17751,7 +17754,7 @@ function RegisterForm(rawProps) {
         );
       }
     } else if (result.error) {
-      setError(result.error);
+      setError(registrationFailedText || result.error);
     }
   }
   return /* @__PURE__ */ jsxs("div", { className: "propeller-register-form", "data-loading": loading ? "true" : "false", "data-user-type": selectedUserType, children: [