@propeller-commerce/propeller-v2-react-ui 0.11.2 → 0.11.4

package/dist/index.d.cts

@@ -6688,6 +6688,11 @@ interface ProductSliderProps {
      * add-to-cart in a semi-closed portal. The host owns navigation.
      */
     onLoginClick?: () => void;
+    /**
+     * Show the add-to-cart control on each card. Defaults to true; a semi-closed
+     * portal still withholds it from anonymous visitors regardless.
+     */
+    allowAddToCart?: boolean;
     /** Called when "Request a Quote" is clicked in the AddToCart modal. */ onRequestQuoteClick?: (cart: Cart) => void;
     /**  * Label overrides forwarded to the embedded AddToCart component.  * Keys: add, adding, addedToCart, outOfStock, noCartId, errorAdding,  *       modalTitle, quantity, continueShopping, proceedToCheckout  */ addToCartLabels?: Record<string, string>;
     /** Translated labels forwarded to embedded `<ProductCard>` instances. */

package/dist/index.d.ts

@@ -6688,6 +6688,11 @@ interface ProductSliderProps {
      * add-to-cart in a semi-closed portal. The host owns navigation.
      */
     onLoginClick?: () => void;
+    /**
+     * Show the add-to-cart control on each card. Defaults to true; a semi-closed
+     * portal still withholds it from anonymous visitors regardless.
+     */
+    allowAddToCart?: boolean;
     /** Called when "Request a Quote" is clicked in the AddToCart modal. */ onRequestQuoteClick?: (cart: Cart) => void;
     /**  * Label overrides forwarded to the embedded AddToCart component.  * Keys: add, adding, addedToCart, outOfStock, noCartId, errorAdding,  *       modalTitle, quantity, continueShopping, proceedToCheckout  */ addToCartLabels?: Record<string, string>;
     /** Translated labels forwarded to embedded `<ProductCard>` instances. */

package/dist/index.js

@@ -4587,7 +4587,7 @@ function AddToCart(rawProps) {
             "button",
             {
               type: "button",
-              className: "propeller-add-to-cart__submit flex-1 basis-full md:basis-auto inline-flex justify-center items-center gap-2 h-10 px-6 border border-transparent text-sm font-medium rounded-control text-secondary-foreground bg-secondary hover:bg-secondary/90 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-secondary disabled:opacity-50 disabled:cursor-not-allowed transition-colors",
+              className: "propeller-add-to-cart__submit flex-1 min-w-0 basis-full md:basis-auto inline-flex justify-center items-center gap-2 h-10 px-3 sm:px-6 border border-transparent text-sm font-medium rounded-control text-secondary-foreground bg-secondary hover:bg-secondary/80 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-secondary disabled:opacity-50 disabled:cursor-not-allowed transition-colors",
               onClick: () => handleAddToCart(),
               disabled: loading,
               children: [
@@ -4609,8 +4609,7 @@ function AddToCart(rawProps) {
                     ]
                   }
                 ),
-                loading ? /* @__PURE__ */ jsx(Fragment, { children: getLabel(props.labels, "adding", "Adding...") }) : null,
-                !loading ? /* @__PURE__ */ jsx(Fragment, { children: getLabel(props.labels, "add", "Add") }) : null
+                /* @__PURE__ */ jsx("span", { className: "propeller-add-to-cart__submit-label min-w-0 truncate", children: loading ? getLabel(props.labels, "adding", "Adding...") : getLabel(props.labels, "add", "Add") })
               ]
             }
           )
@@ -8363,8 +8362,8 @@ function ClusterCardViewClusterLink(props) {
     {
       href: derived.clusterUrl,
       onClick: handleClusterClick,
-      className: props.className ?? "propeller-cluster-card__cta-link flex w-full items-center justify-center rounded-control bg-primary px-4 py-2 text-sm font-medium text-primary-foreground transition-colors hover:bg-primary/80 focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2",
-      children: props.label ?? derived.viewClusterLabel
+      className: props.className ?? "propeller-cluster-card__cta-link flex w-full min-w-0 items-center justify-center rounded-control bg-primary px-3 sm:px-4 py-2 text-sm font-medium text-primary-foreground transition-colors hover:bg-primary/80 focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2",
+      children: /* @__PURE__ */ jsx("span", { className: "propeller-cluster-card__cta-label min-w-0 truncate", children: props.label ?? derived.viewClusterLabel })
     }
   );
 }
@@ -16061,8 +16060,9 @@ function ProductSlider(rawProps) {
   function desktopCount() {
     return props.itemsPerView?.desktop || 4;
   }
-  function portalMode() {
-    return props.portalMode || "open";
+  function showAddToCart() {
+    const allow = props.allowAddToCart !== false;
+    return !isContentHidden(props.portalMode, props.user) && allow;
   }
   function isCluster(item) {
     return "clusterId" in item && !("productId" in item);
@@ -16211,7 +16211,7 @@ function ProductSlider(rawProps) {
                   ProductCardImpl,
                   {
                     product: item,
-                    allowAddToCart: portalMode() === "open",
+                    allowAddToCart: showAddToCart(),
                     labels: props.productCardLabels,
                     stockLabels: props.stockLabels,
                     priceLabels: props.priceLabels,