@sonic-equipment/ui 260.0.6 → 260.0.7

package/dist/lists/orderline-list/orderline-list.js

@@ -23,7 +23,10 @@ function OrderLineList({ children, onRemoveAll }) {
                         // eslint-disable-next-line @eslint-react/no-children-map
                         Children.map(children, (child, index) => (
                         // eslint-disable-next-line @eslint-react/no-array-index-key
-                        jsx("li", { className: styles.item, children: child }, index))) })] }), onRemoveAll && (jsx(ConfirmationDialog, { isOpen: isOpen, onCancel: close, onConfirm: onRemoveAll, title: t('Are you sure you want to remove all items from your cart?') }))] }));
+                        jsx("li", { className: styles.item, children: child }, index))) })] }), onRemoveAll && (jsx(ConfirmationDialog, { isOpen: isOpen, onCancel: close, onConfirm: () => {
+                    close();
+                    onRemoveAll();
+                }, title: t('Are you sure you want to remove all items from your cart?') }))] }));
 }
 
 export { OrderLineList };

package/dist/modals/modal/modal.d.ts

@@ -15,4 +15,4 @@ export interface ModalProps {
     onOpenChange?: (isOpen: boolean) => void;
     shouldCloseOnInteractOutside?: boolean;
 }
-export declare function Modal({ children, className, hasCloseButton, isDismissable, isFullScreen, isKeyboardDismissDisabled, isOpen, onOpenChange, shouldCloseOnInteractOutside, }: ModalProps): import("react/jsx-runtime").JSX.Element | undefined;
+export declare function Modal({ children, className, hasCloseButton, isDismissable, isFullScreen, isKeyboardDismissDisabled, isOpen, onOpenChange, shouldCloseOnInteractOutside, }: ModalProps): import("react/jsx-runtime").JSX.Element;

package/dist/modals/modal/modal.js

@@ -7,28 +7,9 @@ import { useFormattedMessage } from '../../intl/use-formatted-message.js';
 import resetStyles from '../../shared/reset.module.css.js';
 import styles from './modal.module.css.js';
 
-const getDocument = () => typeof window === 'undefined' ? undefined : window.document;
 function Modal({ children, className, hasCloseButton, isDismissable, isFullScreen, isKeyboardDismissDisabled, isOpen, onOpenChange, shouldCloseOnInteractOutside = true, }) {
     const t = useFormattedMessage();
-    const document = getDocument();
-    if (!document)
-        return;
-    return (jsx(ModalOverlay, { ref: ref => {
-            ref?.addEventListener('click', e => {
-                if ((!e.target || ref.contains(e.target)) &&
-                    ref !== e.target)
-                    return;
-                e.preventDefault();
-                e.stopPropagation();
-            });
-            ref?.addEventListener('touchend', e => {
-                if ((!e.target || ref.contains(e.target)) &&
-                    ref !== e.target)
-                    return;
-                e.preventDefault();
-                e.stopPropagation();
-            });
-        }, className: clsx(styles['modal-overlay'], resetStyles.reset, typeof className === 'string' ? className : className?.overlay), isDismissable: isDismissable, isKeyboardDismissDisabled: isKeyboardDismissDisabled, isOpen: isOpen, onOpenChange: onOpenChange, shouldCloseOnInteractOutside: () => shouldCloseOnInteractOutside, UNSTABLE_portalContainer: document.body, children: jsxs(Modal$1, { className: clsx(styles.modal, {
+    return (jsx(ModalOverlay, { className: clsx(styles['modal-overlay'], resetStyles.reset, typeof className === 'string' ? className : className?.overlay), isDismissable: isDismissable, isKeyboardDismissDisabled: isKeyboardDismissDisabled, isOpen: isOpen, onOpenChange: onOpenChange, shouldCloseOnInteractOutside: () => shouldCloseOnInteractOutside, children: jsxs(Modal$1, { className: clsx(styles.modal, {
                 [styles['is-full-screen']]: isFullScreen,
             }, typeof className === 'string' ? undefined : className?.modal), children: [hasCloseButton && (jsx(IconButton, { className: styles.close, icon: "Close", isDisabled: !isDismissable, label: t('Close'), onClick: () => onOpenChange?.(false), theme: "secondary" })), jsx("div", { className: clsx(styles.content, typeof className === 'string' ? className : className?.content), children: children })] }) }));
 }

package/dist/pages/checkout/payment-page/components/payment.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsxs, jsx } from 'react/jsx-runtime';
-import { useRef, useState, useEffect, useCallback } from 'react';
+import { useRef, useState, useEffect, useMemo, useCallback } from 'react';
 import { Form } from 'react-aria-components';
 import { useAlgoliaInsights } from '../../../../algolia/use-algolia-insights.js';
 import { Accordion } from '../../../../collapsables/accordion/accordion.js';
@@ -57,16 +57,29 @@ function Payment({ atp, cart: _cart, form, isProcessing, onError: _onError, onPa
         cartRef.current = _cart;
     }, [_cart]);
     const [validationErrors, setValidationErrors] = useState({});
-    const atpSelectOptions = atp
+    const atpSelectOptions = useMemo(() => atp
         .filter(atp => Boolean(atp.date))
         .reduce((acc, atp) => ({
         ...acc,
         [atp.date || '']: atp.displayDate,
-    }), {});
-    const paymentMethodOptions = cart.paymentOptions?.paymentMethods?.reduce((acc, method) => {
+    }), {}), [atp]);
+    const paymentMethodOptions = useMemo(() => cart.paymentOptions?.paymentMethods?.reduce((acc, method) => {
         acc[method.name] = t(`paymentMethod.${method.description}`);
         return acc;
-    }, {});
+    }, {}), [cart.paymentOptions?.paymentMethods, t]);
+    const industryOptions = useMemo(() => ({
+        /* eslint-disable sort-keys-fix/sort-keys-fix */
+        PP: t('industry.PP'),
+        AU: t('industry.AU'),
+        MC: t('industry.MC'),
+        BC: t('industry.BC'),
+        TR: t('industry.TR'),
+        AG: t('industry.AG'),
+        AV: t('industry.AV'),
+        MA: t('industry.MA'),
+        OT: t('industry.OT'),
+        /* eslint-enable sort-keys-fix/sort-keys-fix */
+    }), [t]);
     const onPlaceOrderCompleted = useCallback(({ cart, payment_type }) => {
         dataLayer.push(createEcommerceEvent({
             cart,
@@ -231,19 +244,7 @@ function Payment({ atp, cart: _cart, form, isProcessing, onError: _onError, onPa
                                     setAsSoonAsPossible(checked);
                                     if (checked)
                                         setDeliveryDate('');
-                                }, children: t('As soon as possible') }), jsx(InfoIconTooltip, { size: "sm", variant: "stroke", children: t('Selecting As Soon As Possible will enable us to send the products to you as they become available.') })] })] })), jsx(Select, { isRequired: true, showLabel: true, "data-test-selector": "industrySelect", defaultSelectedOption: cart.properties.industry, isDisabled: isDisabled, label: t('Industry'), name: "industry", options: {
-                    /* eslint-disable sort-keys-fix/sort-keys-fix */
-                    PP: t('industry.PP'),
-                    AU: t('industry.AU'),
-                    MC: t('industry.MC'),
-                    BC: t('industry.BC'),
-                    TR: t('industry.TR'),
-                    AG: t('industry.AG'),
-                    AV: t('industry.AV'),
-                    MA: t('industry.MA'),
-                    OT: t('industry.OT'),
-                    /* eslint-enable sort-keys-fix/sort-keys-fix */
-                }, placeholder: t('Select an industry'), variant: "solid" }), jsx(TextField, { showLabel: true, defaultValue: cart.customerVatNumber, isDisabled: isDisabled, label: t('VAT Number'), minLength: 8, name: "customerVatNumber" }, `vat${Boolean(validationErrors.customerVatNumber)}`), jsx(TextField, { showLabel: true, defaultValue: cart.poNumber, isDisabled: isDisabled, isRequired: cart.requiresPoNumber, label: t('PO Number'), name: "poNumber" }), paymentMethodOptions && Object.keys(paymentMethodOptions).length > 1 && (jsx(Select, { "data-test-selector": "paymentMethodSelect", defaultSelectedOption: cart.paymentOptions?.paymentMethods?.[0]?.name || 'ADY', isDisabled: isDisabled, label: t('Payment method'), name: "paymentMethod", onChange: setSelectedPaymentMethod, options: paymentMethodOptions, selectedOption: selectedPaymentMethod, variant: "solid" })), isAdyenPayment && cart.billTo && (jsx(AdyenPayment, { amount: cart.orderGrandTotal, cartId: cart.trackId, countryCode: countryCode, currencyCode: currencyCode, customerId: cart.billTo.id, dropinRef: dropinRef, environment: isProductionEnvironment ? 'live' : 'test', isDisabled: isDisabled, onComplete: onComplete, onError: onError, orderAmount: cart.orderGrandTotal, returnUrl: 
+                                }, children: t('As soon as possible') }), jsx(InfoIconTooltip, { size: "sm", variant: "stroke", children: t('Selecting As Soon As Possible will enable us to send the products to you as they become available.') })] })] })), jsx(Select, { isRequired: true, showLabel: true, "data-test-selector": "industrySelect", defaultSelectedOption: cart.properties.industry || 'AU', isDisabled: isDisabled, label: t('Industry'), name: "industry", options: industryOptions, placeholder: t('Select an industry'), variant: "solid" }), jsx(TextField, { showLabel: true, defaultValue: cart.customerVatNumber, isDisabled: isDisabled, label: t('VAT Number'), minLength: 8, name: "customerVatNumber" }, `vat${Boolean(validationErrors.customerVatNumber)}`), jsx(TextField, { showLabel: true, defaultValue: cart.poNumber, isDisabled: isDisabled, isRequired: cart.requiresPoNumber, label: t('PO Number'), name: "poNumber" }), paymentMethodOptions && Object.keys(paymentMethodOptions).length > 1 && (jsx(Select, { "data-test-selector": "paymentMethodSelect", defaultSelectedOption: cart.paymentOptions?.paymentMethods?.[0]?.name || 'ADY', isDisabled: isDisabled, label: t('Payment method'), name: "paymentMethod", onChange: setSelectedPaymentMethod, options: paymentMethodOptions, selectedOption: selectedPaymentMethod, variant: "solid" })), isAdyenPayment && cart.billTo && (jsx(AdyenPayment, { amount: cart.orderGrandTotal, cartId: cart.trackId, countryCode: countryCode, currencyCode: currencyCode, customerId: cart.billTo.id, dropinRef: dropinRef, environment: isProductionEnvironment ? 'live' : 'test', isDisabled: isDisabled, onComplete: onComplete, onError: onError, orderAmount: cart.orderGrandTotal, returnUrl: 
                 /* eslint-disable ssr-friendly/no-dom-globals-in-react-fc */
                 typeof window === 'undefined'
                     ? ''

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sonic-equipment/ui",
-  "version": "260.0.6",
+  "version": "260.0.7",
   "type": "module",
   "license": "MIT",
   "engines": {