Cart USF 1509 - Cart supports configurations

blocks/commerce-cart-summary/commerce-cart-summary.js

@@ -10,8 +10,24 @@ export default async function decorate(block) {
     'hide-attributes': hideAttributes = '',
     'enable-item-quantity-update': enableUpdateItemQuantity = 'false',
     'enable-item-remove': enableRemoveItem = 'true',
+    'show-discount': showDiscount = 'false',
+    'show-savings': showSavings = 'false',
+    'quantity-type': quantityType = 'stepper',
   } = readBlockConfig(block);
 
+  const DROPDOWN_MAX_QUANTITY = 20;
+
+  const dropdownOptions = Array.from(
+    { length: parseInt(DROPDOWN_MAX_QUANTITY, 10) },
+    (_, i) => {
+      const quantityOption = i + 1;
+      return {
+        value: `${quantityOption}`,
+        text: `${quantityOption}`,
+      };
+    },
+  );
+
   block.innerHTML = '';
 
   return provider.render(CartSummaryList, {
@@ -22,5 +38,9 @@ export default async function decorate(block) {
     attributesToHide: hideAttributes.split(',').map((attr) => attr.trim().toLowerCase()),
     enableUpdateItemQuantity: enableUpdateItemQuantity === 'true',
     enableRemoveItem: enableRemoveItem === 'true',
+    showDiscount: showDiscount === 'true',
+    showSavings: showSavings === 'true',
+    quantityType,
+    dropdownOptions,
   })(block);
 }

blocks/commerce-mini-cart/commerce-mini-cart.js

@@ -7,6 +7,8 @@ export default async function decorate(block) {
     'start-shopping-url': startShoppingURL = '',
     'cart-url': cartURL = '',
     'checkout-url': checkoutURL = '',
+    'show-discount': showDiscount = 'false',
+    'show-savings': showSavings = 'false',
   } = readBlockConfig(block);
 
   block.innerHTML = '';
@@ -16,5 +18,7 @@ export default async function decorate(block) {
     routeCart: cartURL ? () => cartURL : undefined,
     routeCheckout: checkoutURL ? () => checkoutURL : undefined,
     routeProduct: (product) => `/products/${product.url.urlKey}/${product.sku}`,
+    showDiscount: showDiscount === 'true',
+    showSavings: showSavings === 'true',
   })(block);
 }

package.json

@@ -34,11 +34,11 @@
   "dependencies": {
     "@adobe/magento-storefront-event-collector": "^1.8.0",
     "@adobe/magento-storefront-events-sdk": "^1.8.0",
-    "@dropins/storefront-cart": "0.6.0",
+    "@dropins/storefront-cart": "0.7.0-alpha012",
     "@dropins/storefront-checkout": "0.1.0-alpha49",
     "@dropins/storefront-auth": "0.0.1-alpha20",
     "@dropins/storefront-order-confirmation": "0.1.0-alpha33",
     "@dropins/storefront-pdp": "0.4.0-alpha3",
-    "@dropins/tools": "0.30.0"
+    "@dropins/tools": "0.32.0-alpha3"
   }
 }

scripts/__dropins__/storefront-cart/containers/Cart/Cart.d.ts

@@ -12,6 +12,13 @@ export interface CartProps extends HTMLAttributes<HTMLDivElement> {
         OrderSummary?: SlotProps<DefaultSlotContext>;
         ProductList?: SlotProps;
     };
+    showDiscount?: boolean;
+    showSavings?: boolean;
+    quantityType?: 'stepper' | 'dropdown';
+    dropdownOptions?: {
+        value: string;
+        text: string;
+    }[];
 }
 export declare const Cart: Container<CartProps, CartModel | null>;
 export {};

scripts/__dropins__/storefront-cart/containers/CartSummaryList/CartSummaryList.d.ts

@@ -21,6 +21,13 @@ export interface CartSummaryListProps extends HTMLAttributes<HTMLDivElement> {
     enableRemoveItem?: boolean;
     enableUpdateItemQuantity?: boolean;
     onItemsErrorsChange?: (errors: Map<string, string>) => void;
+    showDiscount?: boolean;
+    showSavings?: boolean;
+    quantityType?: 'stepper' | 'dropdown';
+    dropdownOptions?: {
+        value: string;
+        text: string;
+    }[];
 }
 export type SwitchableAttributes = 'name' | 'image' | 'configurations' | 'warning' | 'alert' | 'sku' | 'price' | 'quantity' | 'total' | 'totalDiscount' | 'totalExcludingTax';
 export declare const CartSummaryList: Container<CartSummaryListProps, CartModel | null>;

scripts/__dropins__/storefront-cart/containers/MiniCart/MiniCart.d.ts

@@ -10,6 +10,8 @@ export interface MiniCartProps extends HTMLAttributes<HTMLDivElement> {
     slots?: {
         ProductList?: SlotProps;
     };
+    showDiscount?: boolean;
+    showSavings?: boolean;
 }
 export declare const MiniCart: Container<MiniCartProps, CartModel | null>;
 //# sourceMappingURL=MiniCart.d.ts.map

scripts/__dropins__/storefront-cart/data/models/cart-model.d.ts

@@ -88,6 +88,8 @@ export interface Item {
     outOfStock?: boolean;
     notAvailableMessage?: string;
     stockLevel?: String;
+    discountPercentage?: number;
+    savingsAmount?: Price;
 }
 interface ItemError {
     id: string;

scripts/__dropins__/storefront-cart/data/transforms/__fixtures__/productTypesData.d.ts

@@ -940,5 +940,65 @@ declare const complexInsufficientQuantityGeneralMessage: {
         };
     };
 };
-export { bundleOptions, bundleOptionsEmpty, giftCardPhysical, giftCardVirtual, simple, simpleCustomizable, configurable, configurableCustomizable, giftCard, downloadbleWithMultipleLinks, simpleLowInventory, complexInsufficientQuantity, complexInsufficientQuantityGeneralMessage, };
+declare const simpleWithNoDiscount: {
+    prices: {
+        row_total: {
+            value: number;
+            currency: string;
+        };
+        original_row_total: {
+            value: number;
+            currency: string;
+        };
+        price: {
+            value: number;
+            currency: string;
+        };
+        total_item_discount: {
+            value: number;
+            currency: string;
+        };
+        price_including_tax: {
+            value: number;
+            currency: string;
+        };
+        row_total_including_tax: {
+            value: number;
+        };
+    };
+    product: {
+        price_range: {
+            maximum_price: {
+                regular_price: {
+                    value: number;
+                    currency: string;
+                };
+                final_price: {
+                    value: number;
+                    currency: string;
+                };
+                discount: {
+                    amount_off: number;
+                    percent_off: number;
+                };
+            };
+        };
+        name: string;
+        sku: string;
+        thumbnail: {
+            url: string;
+            label: string;
+        };
+        url_key: string;
+        url_suffix: string;
+        categories: {
+            url_path: string;
+            url_key: string;
+        }[];
+    };
+    uid: string;
+    quantity: number;
+    errors: null;
+};
+export { bundleOptions, bundleOptionsEmpty, giftCardPhysical, giftCardVirtual, simple, simpleCustomizable, configurable, configurableCustomizable, giftCard, downloadbleWithMultipleLinks, simpleLowInventory, complexInsufficientQuantity, complexInsufficientQuantityGeneralMessage, simpleWithNoDiscount, };
 //# sourceMappingURL=productTypesData.d.ts.map

scripts/__dropins__/storefront-cart/i18n/en_US.json.d.ts

@@ -78,7 +78,9 @@ declare const _default: {
       "lowInventory": "Only {count} left!",
       "insufficientQuantity": "Only {inventory} of {count} in stock",
       "insufficientQuantityGeneral": "Not enough items for sale",
-      "notAvailableMessage": "Requested qty. not available"
+      "notAvailableMessage": "Requested qty. not available",
+      "discountPercentage": "{discount}% off",
+      "savingsAmount": "Savings"
     },
     "EstimateShipping": {
       "label": "Shipping",