@sonic-equipment/ui 131.0.0 → 133.0.0

package/dist/address/address.d.ts

@@ -1,14 +1,3 @@
-export interface AddressProps {
-    address1?: string;
-    address2?: string;
-    address3?: string;
-    city?: string;
-    companyName?: string;
-    country?: string;
-    email?: string;
-    firstName?: string;
-    lastName?: string;
-    phone?: string;
-    postalCode?: string;
-}
+import { AddressType } from '../shared/model/address';
+export type AddressProps = AddressType;
 export declare function Address({ address1, address2, address3, city, companyName, country, email, firstName, lastName, phone, postalCode, }: AddressProps): import("react/jsx-runtime").JSX.Element;

package/dist/buttons/add-to-cart-button/add-to-cart-button.js

@@ -8,7 +8,7 @@ import { Button } from '../button/button.js';
 import styles from './add-to-cart-button.module.css.js';
 
 function AddToCartButton({ initialState = 'initial', isDisabled = false, onChange, quantity, }) {
-    const [currentState, setState] = useState(initialState);
+    const [currentState, setState] = useState(quantity > 0 ? 'spinner' : initialState);
     const [manualInputQuantity, setManualInputQuantity] = useState(null);
     useEffect(() => {
         setState(currentState => {

package/dist/buttons/add-to-cart-button/connected-add-to-cart-button.js

@@ -13,7 +13,7 @@ import { AddToCartButton } from './add-to-cart-button.js';
 const ConnectedAddToCartButton = ({ onAddToCart, productId }) => {
     const { createEcommerceEvent, dataLayer } = useDataLayer();
     const { isPending: isPendingAddToCart, mutate: addToCart } = useAddProductToCurrentCart();
-    const { data: cartLines, isLoading: isLoadingCartLines } = useFetchCurrentCartLines();
+    const { data: cartLines, isFetching: isLoadingCartLines } = useFetchCurrentCartLines();
     const { isPending: isPendingDeleteCartLine, mutate: deleteCartLine } = useDeleteCartLineById();
     const { mutate: updateCartLine } = usePatchCartLineById();
     const { addToast } = useToast();

package/dist/buttons/button/button.js

@@ -9,6 +9,7 @@ import buttonStyles from './button.module.css.js';
 function Button({ _pseudo = 'none', children, className, color = 'primary', condensed, 'data-test-selector': dataTestSelector, form, icon, iconPosition = 'left', isDisabled, isLoading = false, onClick: _onClick, size = 'lg', type = 'button', variant = 'solid', withArrow = false, }) {
     const showIconOnLeft = icon && iconPosition === 'left';
     const showIconOnRight = icon && iconPosition === 'right';
+    const iconElement = icon && jsx("span", { className: buttonStyles.icon, children: icon });
     const onClick = (e) => {
         if (_onClick)
             _onClick(e);
@@ -20,7 +21,7 @@ function Button({ _pseudo = 'none', children, className, color = 'primary', cond
     return (jsx("button", { className: clsx({ [buttonStyles.condensed]: condensed }, { [buttonStyles.icon]: icon }, { [buttonStyles['loading-uninformative']]: isLoading === true }, {
             [buttonStyles['loading-informative']]: isLoading &&
                 (typeof isLoading === 'string' || isValidElement(isLoading)),
-        }, buttonStyles.button, buttonStyles[variant], buttonStyles[size], buttonStyles[color], buttonStyles[_pseudo], className), "data-disabled": isDisabled ? true : undefined, "data-test-selector": dataTestSelector, disabled: isDisabled, form: form, onClick: onClick, type: type, children: jsxs(Fragment, { children: [showIconOnLeft && jsx("span", { className: buttonStyles.icon, children: icon }), jsx("span", { className: buttonStyles.children, children: isLoading ? (isLoading === true ? children : isLoading) : children }), withArrow && (jsx(GlyphsArrowBoldCapsRightIcon, { className: buttonStyles['right-arrow-icon'] })), showIconOnRight && jsx("span", { className: buttonStyles.icon, children: icon }), isLoading && (jsx(ProgressCircle, { className: buttonStyles.spinner, size: "sm", variant: color === 'primary' ? 'white' : 'gray' }))] }) }));
+        }, buttonStyles.button, buttonStyles[variant], buttonStyles[size], buttonStyles[color], buttonStyles[_pseudo], className), "data-disabled": isDisabled ? true : undefined, "data-test-selector": dataTestSelector, disabled: isDisabled, form: form, onClick: onClick, type: type, children: jsxs(Fragment, { children: [showIconOnLeft && iconElement, jsx("span", { className: buttonStyles.children, children: isLoading ? (isLoading === true ? children : isLoading) : children }), withArrow && (jsx(GlyphsArrowBoldCapsRightIcon, { className: buttonStyles['right-arrow-icon'] })), showIconOnRight && iconElement, isLoading && (jsx(ProgressCircle, { className: buttonStyles.spinner, size: "sm", variant: color === 'primary' ? 'white' : 'gray' }))] }) }));
 }
 
 export { Button };

package/dist/cart-totals/cart-totals.d.ts

@@ -1,6 +1,7 @@
 export interface CartTotalsProps {
     deliveryDate?: string;
     fulfillmentMethod?: string;
+    isPayByInvoice?: boolean;
     orderNumber?: string;
     shippingCost: string;
     subtotal: string;
@@ -9,4 +10,4 @@ export interface CartTotalsProps {
     vatPercentage: number | undefined;
 }
 export declare const formatDisplayPriceToSymbolSpaceValue: (displayPrice: string) => string;
-export declare function CartTotals({ deliveryDate, fulfillmentMethod, orderNumber, shippingCost, subtotal, tax, total, vatPercentage, }: CartTotalsProps): import("react/jsx-runtime").JSX.Element;
+export declare function CartTotals({ deliveryDate, fulfillmentMethod, isPayByInvoice, orderNumber, shippingCost, subtotal, tax, total, vatPercentage, }: CartTotalsProps): import("react/jsx-runtime").JSX.Element;

package/dist/cart-totals/cart-totals.js

@@ -5,9 +5,9 @@ import { Heading } from '../typography/heading/heading.js';
 import styles from './cart-totals.module.css.js';
 
 const formatDisplayPriceToSymbolSpaceValue = (displayPrice) => displayPrice.replace(/^(\D)([\d,.]*$)/, (_, symbol, value) => `${symbol} ${value}`);
-function CartTotals({ deliveryDate, fulfillmentMethod, orderNumber, shippingCost, subtotal, tax, total, vatPercentage, }) {
+function CartTotals({ deliveryDate, fulfillmentMethod, isPayByInvoice, orderNumber, shippingCost, subtotal, tax, total, vatPercentage, }) {
     const t = useFormattedMessage();
-    return (jsxs("div", { className: styles['cart-totals'], children: [orderNumber && (jsxs("section", { className: styles.section, children: [jsx(Heading, { className: styles['section-header'], size: "xxxs", tag: "h3", children: jsx(FormattedMessage, { id: "Order number" }) }), jsx("div", { children: jsx("div", { className: styles.line, children: jsx("p", { className: styles.label, "data-test-selector": "orderConfirmation_orderNumber", children: orderNumber }) }) })] })), deliveryDate !== undefined && (jsxs("section", { className: styles.section, children: [jsx(Heading, { className: styles['section-header'], size: "xxxs", tag: "h3", children: jsx(FormattedMessage, { id: "Delivery date" }) }), jsx("div", { children: jsx("div", { className: styles.line, children: jsx("p", { className: styles.label, "data-test-selector": "deliveryDate", children: deliveryDate || t('As soon as possible') }) }) })] })), fulfillmentMethod && (jsxs("section", { className: styles.section, children: [jsx(Heading, { className: styles['section-header'], size: "xxxs", tag: "h3", children: jsx(FormattedMessage, { id: "Fulfillment method" }) }), jsx("div", { children: jsx("div", { className: styles.line, children: jsx("p", { className: styles.label, "data-test-selector": "fulfillmentMethod", children: fulfillmentMethod }) }) })] })), jsxs("section", { className: styles.section, children: [jsx(Heading, { className: styles['section-header'], size: "xxxs", tag: "h3", children: jsx(FormattedMessage, { id: "Cost overview" }) }), jsxs("div", { children: [jsxs("div", { className: styles.line, children: [jsxs("p", { className: styles.label, children: [jsx(FormattedMessage, { id: "Subtotal" }), ' ', jsx(FormattedMessage, { id: "Excl. VAT" })] }), jsx("p", { className: styles.value, "data-test-selector": "cartTotal_subTotal", children: formatDisplayPriceToSymbolSpaceValue(subtotal) })] }), jsxs("div", { className: styles.line, children: [jsx("p", { className: styles.label, children: jsx(FormattedMessage, { id: "Shipping and handling" }) }), jsx("p", { className: styles.value, "data-test-selector": "shippingCost", children: formatDisplayPriceToSymbolSpaceValue(shippingCost) })] }), jsxs("div", { className: styles.line, children: [jsxs("p", { className: styles.label, children: [jsx(FormattedMessage, { id: "VAT" }), ' ', vatPercentage ? `${vatPercentage}%` : ''] }), jsx("p", { className: styles.value, "data-test-selector": "vatAmount", children: formatDisplayPriceToSymbolSpaceValue(tax) })] })] })] }), jsx("section", { className: styles.totals, children: jsxs("div", { className: styles.line, children: [jsx("p", { className: styles.label, children: jsx(FormattedMessage, { id: "Total" }) }), jsx("p", { className: styles.value, "data-test-selector": "cartTotal_orderGrandTotalDisplay", children: formatDisplayPriceToSymbolSpaceValue(total) })] }) })] }));
+    return (jsxs("div", { className: styles['cart-totals'], children: [orderNumber && (jsxs("section", { className: styles.section, children: [jsx(Heading, { className: styles['section-header'], size: "xxxs", tag: "h3", children: jsx(FormattedMessage, { id: "Order number" }) }), jsx("div", { children: jsx("div", { className: styles.line, children: jsx("p", { className: styles.label, "data-test-selector": "orderConfirmation_orderNumber", children: orderNumber }) }) })] })), deliveryDate !== undefined && (jsxs("section", { className: styles.section, children: [jsx(Heading, { className: styles['section-header'], size: "xxxs", tag: "h3", children: jsx(FormattedMessage, { id: "Delivery date" }) }), jsx("div", { children: jsx("div", { className: styles.line, children: jsx("p", { className: styles.label, "data-test-selector": "deliveryDate", children: deliveryDate || t('As soon as possible') }) }) })] })), fulfillmentMethod && (jsxs("section", { className: styles.section, children: [jsx(Heading, { className: styles['section-header'], size: "xxxs", tag: "h3", children: jsx(FormattedMessage, { id: "Fulfillment method" }) }), jsx("div", { children: jsx("div", { className: styles.line, children: jsx("p", { className: styles.label, "data-test-selector": "fulfillmentMethod", children: fulfillmentMethod }) }) })] })), isPayByInvoice && (jsxs("section", { className: styles.section, children: [jsx(Heading, { className: styles['section-header'], size: "xxxs", tag: "h3", children: jsx(FormattedMessage, { id: "Payment method" }) }), jsx("div", { children: jsx("div", { className: styles.line, children: jsx("p", { className: styles.label, "data-test-selector": "paymentMethod", children: jsx(FormattedMessage, { id: "Pay by invoice" }) }) }) })] })), jsxs("section", { className: styles.section, children: [jsx(Heading, { className: styles['section-header'], size: "xxxs", tag: "h3", children: jsx(FormattedMessage, { id: "Cost overview" }) }), jsxs("div", { children: [jsxs("div", { className: styles.line, children: [jsxs("p", { className: styles.label, children: [jsx(FormattedMessage, { id: "Subtotal" }), ' ', jsx(FormattedMessage, { id: "Excl. VAT" })] }), jsx("p", { className: styles.value, "data-test-selector": "cartTotal_subTotal", children: formatDisplayPriceToSymbolSpaceValue(subtotal) })] }), jsxs("div", { className: styles.line, children: [jsx("p", { className: styles.label, children: jsx(FormattedMessage, { id: "Shipping and handling" }) }), jsx("p", { className: styles.value, "data-test-selector": "shippingCost", children: formatDisplayPriceToSymbolSpaceValue(shippingCost) })] }), jsxs("div", { className: styles.line, children: [jsxs("p", { className: styles.label, children: [jsx(FormattedMessage, { id: "VAT" }), ' ', vatPercentage ? `${vatPercentage}%` : ''] }), jsx("p", { className: styles.value, "data-test-selector": "vatAmount", children: formatDisplayPriceToSymbolSpaceValue(tax) })] })] })] }), jsx("section", { className: styles.totals, children: jsxs("div", { className: styles.line, children: [jsx("p", { className: styles.label, children: jsx(FormattedMessage, { id: "Total" }) }), jsx("p", { className: styles.value, "data-test-selector": "cartTotal_orderGrandTotalDisplay", children: formatDisplayPriceToSymbolSpaceValue(total) })] }) })] }));
 }
 
 export { CartTotals, formatDisplayPriceToSymbolSpaceValue };

package/dist/delivery-time/delivery-time.js

@@ -1,18 +1,19 @@
 "use client";
-import { jsx } from 'react/jsx-runtime';
+import { jsxs, jsx } from 'react/jsx-runtime';
 import clsx from 'clsx';
 import { FormattedMessage } from '../intl/formatted-message.js';
 import { useFormattedMessage } from '../intl/use-formatted-message.js';
 import { getDateUnitObject } from '../shared/utils/date.js';
+import { Tooltip } from '../tooltip/tooltip.js';
 import styles from './delivery-time.module.css.js';
 
 function DeliveryTime({ className, deliveryDate }) {
     const t = useFormattedMessage();
     const { number, unit } = getDateUnitObject(deliveryDate);
-    return (jsx("p", { className: clsx(styles['delivery-time'], className), children: jsx(FormattedMessage, { id: "Delivery expected in {0} {1}", replacementValues: {
-                '0': number.toString(),
-                '1': t.pluralize('unit', unit, number),
-            } }) }));
+    return (jsxs("div", { className: clsx(styles['delivery-time'], className), children: [jsx("p", { children: jsx(FormattedMessage, { id: "Delivery expected in {0} {1}", replacementValues: {
+                        '0': number.toString(),
+                        '1': t.pluralize('unit', unit, number),
+                    } }) }), jsx(Tooltip, { text: t('The expected delivery is an indication based on the product availability and the shipping location.') })] }));
 }
 
 export { DeliveryTime };

package/dist/display/info-display/info-display.d.ts

@@ -0,0 +1,7 @@
+import { ReactNode } from 'react';
+export interface InfoDisplayProps {
+    id: string;
+    label: string;
+    value: string | ReactNode;
+}
+export declare function InfoDisplay({ id, label, value }: InfoDisplayProps): import("react/jsx-runtime").JSX.Element;

package/dist/display/info-display/info-display.js

@@ -0,0 +1,8 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import styles from './info-display.module.css.js';
+
+function InfoDisplay({ id, label, value }) {
+    return (jsxs("div", { className: styles['info-display'], children: [jsx("span", { className: styles.label, id: id, children: label }), typeof value === 'string' ? (jsx("p", { "aria-labelledby": id, className: styles.value, children: value })) : (jsx("div", { "aria-labelledby": id, children: value }))] }));
+}
+
+export { InfoDisplay };

package/dist/display/info-display/info-display.module.css.js

@@ -0,0 +1,3 @@
+var styles = {"info-display":"info-display-module-jsSU0","label":"info-display-module-aGbJV","value":"info-display-module-bzl9Y"};
+
+export { styles as default };

package/dist/exports.d.ts

@@ -56,11 +56,6 @@ export * from './carousel/usp-carousel/product-usp-carousel-slide';
 export * from './carousel/usp-carousel/usp-carousel';
 export * from './cart-totals/cart-totals';
 export * from './cart-totals/cart-totals-summary';
-export * from './checkout/adyen-payment';
-export * from './checkout/parse-amount';
-export * from './checkout/payment';
-export * from './checkout/use-get-adyen-redirect-result';
-export * from './checkout/use-has-returned-from-adyen';
 export * from './collapsables/accordion/accordion';
 export * from './collapsables/accordion/accordion-item';
 export * from './collapsables/show-all/show-all';
@@ -71,6 +66,7 @@ export * from './country-selector/country-selector-dialog/country-selector-dialo
 export * from './country-selector/country-selector-trigger/country-selector-trigger';
 export * from './country-selector/use-countries-languages';
 export * from './delivery-time/delivery-time';
+export * from './display/info-display/info-display';
 export * from './display/product-price/product-price';
 export * from './display/product-price/product-total-price';
 export * from './display/product-sku/product-sku';
@@ -85,6 +81,7 @@ export * from './forms/label/label';
 export * from './forms/number-field/number-field';
 export * from './forms/select/select';
 export * from './forms/switch/switch';
+export * from './forms/text-field/password-reveal-toggle/password-reveal-toggle';
 export * from './forms/text-field/text-field';
 export * from './forms/textarea/textarea';
 export * from './global-search/categories-grid/categories-grid';
@@ -143,15 +140,25 @@ export * from './notifications/announcements/announcement-provider';
 export * from './notifications/announcements/connected-announcement';
 export * from './observers/intersection-observer';
 export * from './pages/checkout/cart-page/cart-page';
+export * from './pages/checkout/cart-page/components/empty-cart-page';
+export * from './pages/checkout/components/billing-and-invoice-information';
+export * from './pages/checkout/constants';
 export * from './pages/checkout/layouts/checkout-page-layout/checkout-page-layout';
 export * from './pages/checkout/layouts/checkout-page-layout/components/checkout-page-section';
 export * from './pages/checkout/layouts/checkout-page-layout/components/checkout-page-section-content';
 export * from './pages/checkout/layouts/checkout-page-layout/components/checkout-page-section-header';
 export * from './pages/checkout/layouts/checkout-page-layout/components/checkout-page-section-link';
+export * from './pages/checkout/order-confirmation-page/order-confirmation-page';
+export * from './pages/checkout/payment-page/components/adyen-payment';
+export * from './pages/checkout/payment-page/components/payment';
+export * from './pages/checkout/payment-page/hooks/use-get-adyen-redirect-result';
+export * from './pages/checkout/payment-page/hooks/use-has-returned-from-adyen';
 export * from './pages/checkout/payment-page/payment-page';
+export * from './pages/checkout/payment-page/utils/parse-amount';
 export * from './pages/checkout/shipping-page/components/edit-address';
 export * from './pages/checkout/shipping-page/components/readonly-address';
 export * from './pages/checkout/shipping-page/components/sonic-address';
+export * from './pages/checkout/shipping-page/hooks/use-patch-shipping-details';
 export * from './pages/checkout/shipping-page/shipping-page';
 export * from './pages/components/page-container/page-container';
 export * from './pages/components/page-meta-data/page-meta-data';
@@ -193,6 +200,7 @@ export * from './shared/api/storefront/hooks/authentication/use-sign-out';
 export * from './shared/api/storefront/hooks/cart/use-add-product-to-current-cart';
 export * from './shared/api/storefront/hooks/cart/use-delete-cart-line-by-id';
 export * from './shared/api/storefront/hooks/cart/use-delete-current-cart';
+export * from './shared/api/storefront/hooks/cart/use-fetch-cart-by-id';
 export * from './shared/api/storefront/hooks/cart/use-fetch-current-cart';
 export * from './shared/api/storefront/hooks/cart/use-fetch-current-cart-checkout-atp';
 export * from './shared/api/storefront/hooks/cart/use-fetch-current-cart-count';

package/dist/forms/input/input.d.ts

@@ -3,6 +3,7 @@ import { Input as AriaInput } from 'react-aria-components';
 export interface InputProps extends Omit<ComponentProps<typeof AriaInput>, 'size'> {
     _pseudo?: 'focus' | 'none';
     autoGrow?: boolean;
+    inlineElement?: React.ReactNode;
     label: string;
     size?: 'md' | 'lg';
     value?: string | number;

package/dist/forms/input/input.js

@@ -9,7 +9,7 @@ import styles from './input.module.css.js';
  * This component is used to create an input that grows as the user types.
  * It uses a shadow input to calculate the width of the input.
  */
-const Input = forwardRef(({ _pseudo = 'none', autoGrow, label, size = 'lg', ...inputProps }, inputRef) => {
+const Input = forwardRef(({ _pseudo = 'none', autoGrow, inlineElement, label, size = 'lg', ...inputProps }, inputRef) => {
     const [props, ref] = useContextProps(inputProps, inputRef, InputContext);
     const { defaultValue, onChange, value: controlledValue } = props;
     const [uncontrolledValue, setUncontrolledValue] = useState(defaultValue);
@@ -18,11 +18,13 @@ const Input = forwardRef(({ _pseudo = 'none', autoGrow, label, size = 'lg', ...i
     const handleChange = (event) => isControlled
         ? onChange?.(event)
         : setUncontrolledValue(event.target.value);
-    return (jsx("div", { className: clsx(styles['input-container'], styles[size], styles[_pseudo]), children: jsxs("div", { className: clsx({ [styles['growing-input']]: autoGrow }), children: [jsx(Input$1, { "aria-label": label, size: autoGrow ? 1 : undefined, ...props, ref: ref, onChange: handleChange, onClick: e => {
+    return (jsx("div", { className: clsx(styles['input-container'], styles[size], styles[_pseudo]), children: jsxs("div", { className: clsx(styles.input, {
+                [styles['growing-input']]: autoGrow,
+            }), children: [jsx(Input$1, { "aria-label": label, size: autoGrow ? 1 : undefined, ...props, ref: ref, onChange: handleChange, onClick: e => {
                         e.preventDefault();
                         e.stopPropagation();
                         e.target.focus();
-                    } }), autoGrow && jsx("span", { className: styles['shadow-input'], children: value })] }) }));
+                    } }), inlineElement && (jsx("div", { className: styles['inline-element'], children: inlineElement })), autoGrow && jsx("span", { className: styles['shadow-input'], children: value })] }) }));
 });
 Input.displayName = 'Input';
 

package/dist/forms/input/input.module.css.js

@@ -1,3 +1,3 @@
-var styles = {"input-container":"input-module-2woJR","shadow-input":"input-module-pNKEt","lg":"input-module-Dx2qC","md":"input-module-sH6e7","focus":"input-module-hEEuy","growing-input":"input-module-6HwY4"};
+var styles = {"input-container":"input-module-2woJR","shadow-input":"input-module-pNKEt","lg":"input-module-Dx2qC","md":"input-module-sH6e7","focus":"input-module-hEEuy","growing-input":"input-module-6HwY4","inline-element":"input-module-oeAz2","input":"input-module-zjVxG"};
 
 export { styles as default };

package/dist/forms/switch/switch.d.ts

@@ -4,9 +4,10 @@ export interface SwitchProps {
     children?: ReactNode;
     className?: string;
     'data-test-selector'?: string;
+    defaultSelected?: boolean;
     isDisabled?: boolean;
     isSelected?: boolean;
     onChange?: (isSelected: boolean) => void;
     value?: string;
 }
-export declare function Switch({ _pseudo, children, className, 'data-test-selector': dataTestSelector, isDisabled, isSelected, onChange, value, }: SwitchProps): import("react/jsx-runtime").JSX.Element;
+export declare function Switch({ _pseudo, children, className, 'data-test-selector': dataTestSelector, defaultSelected, isDisabled, isSelected, onChange, value, }: SwitchProps): import("react/jsx-runtime").JSX.Element;

package/dist/forms/switch/switch.js

@@ -4,8 +4,8 @@ import { Switch as Switch$1 } from 'react-aria-components';
 import clsx from 'clsx';
 import styles from './switch.module.css.js';
 
-function Switch({ _pseudo = 'none', children, className, 'data-test-selector': dataTestSelector, isDisabled, isSelected, onChange, value, }) {
-    return (jsxs(Switch$1, { className: clsx(className, styles.switch, styles[_pseudo]), "data-test-selector": dataTestSelector, isDisabled: isDisabled, isSelected: isSelected, onChange: onChange, value: value, children: [jsx("div", { className: styles.indicator }), children] }));
+function Switch({ _pseudo = 'none', children, className, 'data-test-selector': dataTestSelector, defaultSelected, isDisabled, isSelected, onChange, value, }) {
+    return (jsxs(Switch$1, { className: clsx(className, styles.switch, styles[_pseudo]), "data-test-selector": dataTestSelector, defaultSelected: defaultSelected, isDisabled: isDisabled, isSelected: isSelected, onChange: onChange, value: value, children: [jsx("div", { className: styles.indicator }), children] }));
 }
 
 export { Switch };

package/dist/forms/text-field/password-reveal-toggle/password-reveal-toggle.d.ts

@@ -0,0 +1,10 @@
+interface PasswordRevealToggleProps {
+    onChange: (showPassword: boolean) => void;
+    showPassword: boolean;
+}
+/**
+ * This component is used to show a toggle to reveal password value.
+ * It can be used as inline element of the Input component.
+ */
+export declare function PasswordRevealToggle({ onChange, showPassword, }: PasswordRevealToggleProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/forms/text-field/password-reveal-toggle/password-reveal-toggle.js

@@ -0,0 +1,18 @@
+import { jsx } from 'react/jsx-runtime';
+import { Checkbox } from 'react-aria-components';
+import { StrokeDehashedIcon } from '../../../icons/stroke/stroke-dehashed-icon.js';
+import { StrokeHashedIcon } from '../../../icons/stroke/stroke-hashed-icon.js';
+import { useFormattedMessage } from '../../../intl/use-formatted-message.js';
+import styles from './password-reveal-toggle.module.css.js';
+
+/**
+ * This component is used to show a toggle to reveal password value.
+ * It can be used as inline element of the Input component.
+ */
+function PasswordRevealToggle({ onChange, showPassword, }) {
+    const t = useFormattedMessage();
+    const helpText = showPassword ? t('Conceal value') : t('Reveal value');
+    return (jsx(Checkbox, { "aria-label": helpText, className: styles.toggle, onChange: onChange, children: jsx("span", { title: helpText, children: showPassword ? jsx(StrokeHashedIcon, {}) : jsx(StrokeDehashedIcon, {}) }) }));
+}
+
+export { PasswordRevealToggle };

package/dist/forms/text-field/password-reveal-toggle/password-reveal-toggle.module.css.js

@@ -0,0 +1,3 @@
+var styles = {"toggle":"password-reveal-toggle-module-uUQbW"};
+
+export { styles as default };

package/dist/forms/text-field/text-field.d.ts

@@ -1,5 +1,5 @@
-import { FormEventHandler, KeyboardEvent } from 'react';
-import { ValidateFunction } from '../field-error/field-error';
+import { type FormEventHandler, type KeyboardEvent } from 'react';
+import { type ValidateFunction } from '../field-error/field-error';
 interface TextFieldProps {
     autoFocus?: boolean;
     autoGrow?: boolean;
@@ -29,5 +29,5 @@ interface TextFieldProps {
  * It can be used as a single line input or as a textarea.
  * This field can also grow when a user types in text.
  */
-export declare function TextField({ autoFocus, autoGrow, defaultValue, isDisabled, isInvalid, isMultiline, isReadOnly, isRequired, label, maxLength, minLength, name, onChange, onInput, onKeyUp, placeholder, rows, showLabel, size, type, validate, value, }: TextFieldProps): import("react/jsx-runtime").JSX.Element;
+export declare function TextField({ autoFocus, autoGrow, defaultValue, isDisabled, isInvalid, isMultiline, isReadOnly, isRequired, label, maxLength, minLength, name, onChange, onInput, onKeyUp, placeholder, rows, showLabel, size, type: defaultType, validate, value, }: TextFieldProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/forms/text-field/text-field.js

@@ -1,11 +1,13 @@
 "use client";
 import { jsxs, jsx } from 'react/jsx-runtime';
+import { useState, useCallback } from 'react';
 import { TextField as TextField$1 } from 'react-aria-components';
 import clsx from 'clsx';
 import { FieldError } from '../field-error/field-error.js';
 import { Input } from '../input/input.js';
 import { Label } from '../label/label.js';
 import { TextArea } from '../textarea/textarea.js';
+import { PasswordRevealToggle } from './password-reveal-toggle/password-reveal-toggle.js';
 import styles from './text-field.module.css.js';
 
 /**
@@ -13,10 +15,15 @@ import styles from './text-field.module.css.js';
  * It can be used as a single line input or as a textarea.
  * This field can also grow when a user types in text.
  */
-function TextField({ autoFocus, autoGrow, defaultValue, isDisabled, isInvalid, isMultiline, isReadOnly, isRequired, label, maxLength, minLength, name, onChange, onInput, onKeyUp, placeholder, rows, showLabel = false, size = 'lg', type = 'text', validate, value, }) {
+function TextField({ autoFocus, autoGrow, defaultValue, isDisabled, isInvalid, isMultiline, isReadOnly, isRequired, label, maxLength, minLength, name, onChange, onInput, onKeyUp, placeholder, rows, showLabel = false, size = 'lg', type: defaultType = 'text', validate, value, }) {
+    const [type, setType] = useState(defaultType);
+    const isPasswordInput = type === 'password';
+    const togglePasswordType = useCallback(() => {
+        setType(isPasswordInput ? 'text' : 'password');
+    }, [isPasswordInput]);
     return (jsxs(TextField$1, { "aria-label": label, autoFocus: autoFocus, className: clsx(styles.field, styles[size]), defaultValue: defaultValue, isDisabled: isDisabled, isInvalid: isInvalid, isReadOnly: isReadOnly, isRequired: isRequired, maxLength: maxLength, minLength: minLength, name: name, onChange: value => {
             onChange?.(value);
-        }, onInput: onInput, onKeyUp: e => onKeyUp?.(e), validate: validate, value: value, children: [showLabel && jsx(Label, { isRequired: isRequired, children: label }), isMultiline ? (jsx(TextArea, { autoGrow: autoGrow, label: label, placeholder: placeholder, rows: rows, size: size })) : (jsx(Input, { autoGrow: autoGrow, label: label, placeholder: placeholder, size: size, type: type })), jsx(FieldError, {}, Math.random())] }));
+        }, onInput: onInput, onKeyUp: e => onKeyUp?.(e), validate: validate, value: value, children: [showLabel && jsx(Label, { isRequired: isRequired, children: label }), isMultiline ? (jsx(TextArea, { autoGrow: autoGrow, label: label, placeholder: placeholder, rows: rows, size: size })) : (jsx(Input, { autoGrow: autoGrow, inlineElement: defaultType === 'password' && (jsx(PasswordRevealToggle, { onChange: togglePasswordType, showPassword: !isPasswordInput })), label: label, placeholder: placeholder, size: size, type: type })), jsx(FieldError, {}, Math.random())] }));
 }
 
 export { TextField };

package/dist/icons/stroke/stroke-dehashed-icon.js

@@ -0,0 +1,7 @@
+import { jsx } from 'react/jsx-runtime';
+
+function StrokeDehashedIcon(props) {
+    return (jsx("svg", { xmlns: "http://www.w3.org/2000/svg", ...props, fill: "currentColor", height: "24", viewBox: "0 0 24 24", width: "24", children: jsx("path", { d: "M11.9999099,7.6660389 C9.53942024,7.6660389 7.53751323,9.61026864 7.53751323,11.9998688 C7.53751323,14.3896147 9.53942024,16.3338444 11.9999099,16.3338444 C14.4605497,16.3338444 16.4624567,14.3896147 16.4624567,11.9998688 C16.4624567,9.61026864 14.4605497,7.6660389 11.9999099,7.6660389 M11.9997748,5 C17.5138784,5 22,8.14019646 22,11.9997813 C22,15.8596577 17.5138784,19 11.9997748,19 C6.48597148,19 2,15.8596577 2,11.9997813 C2,8.14019646 6.48597148,5 11.9997748,5 Z M11.9997748,6.29192404 C9.61000954,6.29192404 7.37625851,6.93416735 5.70995473,8.1005302 C4.17533954,9.17472735 3.33025009,10.5595463 3.33025009,11.9997813 C3.33025009,13.4401621 4.17533954,14.824981 5.71010489,15.899324 C7.37625851,17.0656868 9.61000954,17.708076 11.9997748,17.708076 C14.3896901,17.708076 16.6235913,17.0656868 18.2898951,15.899324 C19.8246605,14.824981 20.6697499,13.4401621 20.6697499,11.9997813 C20.6697499,10.5595463 19.8246605,9.17487318 18.2898951,8.1005302 C16.6235913,6.93416735 14.3896901,6.29192404 11.9997748,6.29192404 Z M11.9999099,10.249887 C12.9936558,10.249887 13.8021067,11.0348996 13.8021067,11.9998688 C13.8021067,12.9649837 12.9936558,13.7501422 11.9999099,13.7501422 C11.0063141,13.7501422 10.1980134,12.9649837 10.1980134,11.9998688 C10.1980134,11.0348996 11.0063141,10.249887 11.9999099,10.249887 Z", fillRule: "evenodd" }) }));
+}
+
+export { StrokeDehashedIcon };

package/dist/icons/stroke/stroke-hashed-icon.js

@@ -0,0 +1,7 @@
+import { jsx } from 'react/jsx-runtime';
+
+function StrokeHashedIcon(props) {
+    return (jsx("svg", { xmlns: "http://www.w3.org/2000/svg", ...props, fill: "currentColor", height: "24", viewBox: "0 0 24 24", width: "24", children: jsx("path", { d: "M4.93374005,4.18971899 L20.0027973,18.8949316 C20.2618651,19.1477442 20.2618651,19.5576512 20.0027973,19.8103175 C19.8734132,19.9367238 19.7035965,20 19.5337799,20 C19.3639632,20 19.1942963,19.9367238 19.0647624,19.8103175 L3.99555542,5.10495875 C3.73663742,4.85229237 3.73663742,4.44238537 3.99570517,4.18971899 C4.25462316,3.93676034 4.67452256,3.93676034 4.93374005,4.18971899 Z M4.94633404,7.794314 C5.19911228,8.05311803 5.18922877,8.46273276 4.92417102,8.70955376 C3.87906478,9.68237048 3.32663651,10.8200268 3.32663651,11.9994776 C3.32663651,15.1521812 7.20711193,17.7169861 11.9769535,17.7169861 C12.8107622,17.7169861 13.6414263,17.6357353 14.4460338,17.4752798 C14.8060331,17.40382 15.15555,17.6297438 15.2287778,17.9798819 C15.3020056,18.3303122 15.0704919,18.6722667 14.7116905,18.7437264 C13.8197787,18.9214258 12.8997138,19.0115907 11.9769535,19.0115907 C6.47573224,19.0115907 2,15.8660477 2,11.9994776 C2,10.4576135 2.69454116,8.99597719 4.0084489,7.77283224 C4.27350665,7.5258651 4.69340605,7.53580224 4.94633404,7.794314 Z M12.0231963,4.98695522 C17.5244175,4.98695522 22,8.13264437 22,11.9990684 C22,13.5409325 21.3054588,15.0024226 19.9917008,16.2255676 C19.8632152,16.3452517 19.6984901,16.4045822 19.5339147,16.4045822 C19.3588567,16.4045822 19.1840983,16.3373604 19.0538157,16.2040858 C18.8008877,15.9452818 18.810921,15.5356671 19.075829,15.2888461 C20.1209352,14.3160293 20.6732137,13.178373 20.6732137,11.9990684 C20.6732137,8.84636479 16.7928881,6.28170603 12.0231963,6.28170603 C11.1887885,6.28170603 10.3581245,6.36281062 9.55396621,6.52312006 C9.19441612,6.59531046 8.84474954,6.36880213 8.77137197,6.01851797 C8.69814415,5.66808767 8.92965787,5.32613317 9.28845921,5.25467345 C10.1797721,5.07697401 11.0999867,4.98695522 12.0231963,4.98695522 Z M7.64053377,11.1276836 C7.68815431,10.902052 7.97792084,10.8221165 8.14489225,10.9850564 L13.0393259,15.7613132 C13.2062973,15.9242531 13.124384,16.206877 12.8931697,16.2533477 C12.4097763,16.3505271 11.8983796,16.3712782 11.3714088,16.2990878 C9.42465696,16.0326848 7.86800423,14.5140561 7.59411123,12.614455 C7.51983516,12.0996235 7.54094993,11.5998438 7.64053377,11.1276836 Z M11.1026372,7.74588506 C11.5867795,7.64812115 12.0993742,7.62707779 12.6272434,7.69912205 C14.5757923,7.96537893 16.1339425,9.48576126 16.4064878,11.3872621 C16.4803146,11.9023859 16.4587506,12.4024578 16.3585677,12.8749103 C16.3107974,13.1003957 16.0211807,13.1801851 15.854359,13.0173914 L10.9566309,8.23791959 C10.7898092,8.07512587 10.8715728,7.79250194 11.1026372,7.74588506 Z", fillRule: "evenodd" }) }));
+}
+
+export { StrokeHashedIcon };

package/dist/index.js

@@ -61,11 +61,6 @@ export { ProductUsp } from './carousel/usp-carousel/product-usp-carousel-slide.j
 export { USPCarousel } from './carousel/usp-carousel/usp-carousel.js';
 export { CartTotals, formatDisplayPriceToSymbolSpaceValue } from './cart-totals/cart-totals.js';
 export { CartTotalsSummary } from './cart-totals/cart-totals-summary.js';
-export { AdyenPayment } from './checkout/adyen-payment.js';
-export { parseAmount } from './checkout/parse-amount.js';
-export { Payment } from './checkout/payment.js';
-export { useGetAdyenRedirectResult } from './checkout/use-get-adyen-redirect-result.js';
-export { useHasReturnedFromAdyen } from './checkout/use-has-returned-from-adyen.js';
 export { Accordion } from './collapsables/accordion/accordion.js';
 export { AccordionItem } from './collapsables/accordion/accordion-item.js';
 export { ShowAll } from './collapsables/show-all/show-all.js';
@@ -76,6 +71,7 @@ export { CountrySelectorDialog } from './country-selector/country-selector-dialo
 export { CountrySelectorTrigger } from './country-selector/country-selector-trigger/country-selector-trigger.js';
 export { useCountriesLanguages } from './country-selector/use-countries-languages.js';
 export { DeliveryTime } from './delivery-time/delivery-time.js';
+export { InfoDisplay } from './display/info-display/info-display.js';
 export { ProductPrice } from './display/product-price/product-price.js';
 export { ProductTotalPrice } from './display/product-price/product-total-price.js';
 export { ProductSku } from './display/product-sku/product-sku.js';
@@ -90,6 +86,7 @@ export { Label } from './forms/label/label.js';
 export { NumberField } from './forms/number-field/number-field.js';
 export { Select } from './forms/select/select.js';
 export { Switch } from './forms/switch/switch.js';
+export { PasswordRevealToggle } from './forms/text-field/password-reveal-toggle/password-reveal-toggle.js';
 export { TextField } from './forms/text-field/text-field.js';
 export { TextArea } from './forms/textarea/textarea.js';
 export { CategoriesGrid } from './global-search/categories-grid/categories-grid.js';
@@ -146,15 +143,25 @@ export { AnnouncementProvider } from './notifications/announcements/announcement
 export { ConnectedAnnouncement, now } from './notifications/announcements/connected-announcement.js';
 export { IntersectionObserverComponent } from './observers/intersection-observer.js';
 export { CartPage } from './pages/checkout/cart-page/cart-page.js';
+export { EmptyCart } from './pages/checkout/cart-page/components/empty-cart-page.js';
+export { BillingAndInvoiceInformation } from './pages/checkout/components/billing-and-invoice-information.js';
+export { CHECKOUT_PATHS } from './pages/checkout/constants.js';
 export { CheckoutPageLayout } from './pages/checkout/layouts/checkout-page-layout/checkout-page-layout.js';
 export { CheckoutPageSection } from './pages/checkout/layouts/checkout-page-layout/components/checkout-page-section.js';
 export { CheckoutPageSectionContent } from './pages/checkout/layouts/checkout-page-layout/components/checkout-page-section-content.js';
 export { CheckoutPageSectionHeader } from './pages/checkout/layouts/checkout-page-layout/components/checkout-page-section-header.js';
 export { CheckoutPageSectionLink } from './pages/checkout/layouts/checkout-page-layout/components/checkout-page-section-link.js';
+export { OrderConfirmationPage } from './pages/checkout/order-confirmation-page/order-confirmation-page.js';
+export { AdyenPayment } from './pages/checkout/payment-page/components/adyen-payment.js';
+export { Payment } from './pages/checkout/payment-page/components/payment.js';
+export { useGetAdyenRedirectResult } from './pages/checkout/payment-page/hooks/use-get-adyen-redirect-result.js';
+export { useHasReturnedFromAdyen } from './pages/checkout/payment-page/hooks/use-has-returned-from-adyen.js';
 export { PaymentPage } from './pages/checkout/payment-page/payment-page.js';
+export { parseAmount } from './pages/checkout/payment-page/utils/parse-amount.js';
 export { EDIT_ADDRESS_FORM_ID, EditAddresses } from './pages/checkout/shipping-page/components/edit-address.js';
 export { ReadOnlyAddresses } from './pages/checkout/shipping-page/components/readonly-address.js';
 export { SonicAddress } from './pages/checkout/shipping-page/components/sonic-address.js';
+export { usePatchShippingDetails } from './pages/checkout/shipping-page/hooks/use-patch-shipping-details.js';
 export { ShippingPage } from './pages/checkout/shipping-page/shipping-page.js';
 export { PageContainer } from './pages/components/page-container/page-container.js';
 export { PageMetaData } from './pages/components/page-meta-data/page-meta-data.js';
@@ -195,6 +202,7 @@ export { useSignOut } from './shared/api/storefront/hooks/authentication/use-sig
 export { useAddProductToCurrentCart } from './shared/api/storefront/hooks/cart/use-add-product-to-current-cart.js';
 export { useDeleteCartLineById } from './shared/api/storefront/hooks/cart/use-delete-cart-line-by-id.js';
 export { useDeleteCurrentCart } from './shared/api/storefront/hooks/cart/use-delete-current-cart.js';
+export { useFetchCartById } from './shared/api/storefront/hooks/cart/use-fetch-cart-by-id.js';
 export { useFetchCurrentCart } from './shared/api/storefront/hooks/cart/use-fetch-current-cart.js';
 export { useFetchCurrentCheckoutAtp } from './shared/api/storefront/hooks/cart/use-fetch-current-cart-checkout-atp.js';
 export { useFetchCurrentCartCount } from './shared/api/storefront/hooks/cart/use-fetch-current-cart-count.js';
@@ -274,7 +282,7 @@ export { RouteProvider, useBasePath, useNavigate, useOnNavigate } from './shared
 export { withRouting } from './shared/routing/with-routing.js';
 export { ensureArray } from './shared/utils/array.js';
 export { breakpoints, getCurrentBreakpoints } from './shared/utils/breakpoints.js';
-export { convertDateUnitToPluralOrSingle, getDateUnitObject } from './shared/utils/date.js';
+export { convertDateUnitToPluralOrSingle, formatDateToLocaleString, getDateUnitObject } from './shared/utils/date.js';
 export { environment, environments } from './shared/utils/environment.js';
 export { EventEmitter } from './shared/utils/event-emitter.js';
 export { clone, deepMerge, isPlainObject, default as main, merge } from './shared/utils/merge.js';

package/dist/intl/translation-id.d.ts

@@ -1 +1 @@
-export type TranslationId = "'{0}' in all products" | "Try 'Search' and try to find the product you're looking for" | "Unfortnately, We found no articles for your search '{0}'" | ' to your account to manage your lists.' | 'Add order notes' | 'Add to list' | 'Address' | 'Amount: {0}' | 'An error occurred while processing your payment. Please try again.' | 'An unexpected error occured' | 'Are you looking for information about our service? Please visit our customer support page' | 'Are you sure you want to remove all items from your cart?' | 'Are you sure you want to remove this item from your cart?' | 'article' | 'articles' | 'As soon as possible' | 'Attention' | 'Billing address' | 'Billing and shipping address' | 'Cancel' | 'Cart' | 'Changing your address is currently not possible. Please contact customer support to change your address.' | 'Chosen filters' | 'City' | 'Clear filters' | 'Clear' | 'Click the button below to continue shopping.' | 'Company name' | 'Continue shopping' | 'Continue' | 'Cost overview' | 'Country' | 'create account' | 'Create new list' | 'Delivery expected in {0} {1}' | 'Delivery date' | 'Double check your spelling' | 'Downloads' | 'Easily add your favorite products' | 'Edit billing address' | 'Edit shipping address' | 'Email' | 'Excl. VAT' | 'Explore by categories' | 'Exploring our products by category' | 'facet.categories' | 'facet.height' | 'facet.weight' | 'Features' | 'First name' | 'Fulfillment method' | 'Hide filters' | 'Home' | 'Incl. VAT' | 'Includes' | 'Industry' | 'Language' | 'Last name' | 'List name already exists' | 'New list name' | 'of' | 'Order number' | 'Order' | 'Pay' | 'Payment method' | 'Payment' | 'pc' | 'Phone' | 'Pick up' | 'Pickup address' | 'Please Sign In' | 'PO Number' | 'Popular searches' | 'Postal Code' | 'Print' | 'Processing' | 'Product Features' | 'Product' | 'Products' | 'Quick access' | 'Recent searches' | 'Recently viewed' | 'Remove all' | 'Review and payment' | 'Save order' | 'Save' | 'Saved cart for later.' | 'Search' | 'Searching again using more general terms' | 'See all results' | 'Select a desired delivery date' | 'Select a list' | 'Selecting As Soon As Possible will enable us to send the products to you as they become available.' | 'Share your favorite list with others' | 'Ship' | 'Shipping address' | 'Shipping and handling' | 'Shipping details' | 'Shop more efficiently and quicker with a favorites list' | 'Show all' | 'Show filters' | 'Show less' | 'Show' | 'sign in' | 'Sonic address' | 'Sorry, there are no products found' | 'Sorry, we could not find matches for' | 'Sort by' | 'sort.newest' | 'sort.price_asc' | 'sort.price_desc' | 'sort.relevance' | 'Specifications' | 'Submit' | 'Subtotal' | 'Suggestions' | 'tag.limited' | 'tag.new' | 'The product has been added to your cart.' | 'The product has been removed from your cart.' | 'The product has been updated in your cart.' | 'There are no products in your shopping cart.' | 'Total amount is' | 'Total' | 'Total' | 'Try another search' | 'Try another search' | 'Unable to add the product to your cart.' | 'Unable to add the product to your cart.' | 'Unable to empty your cart.' | 'Unable to empty your cart.' | 'Unable to remove the product from your cart.' | 'Unable to remove the product from your cart.' | 'Unable to save cart for later.' | 'Unable to save cart for later.' | 'Unable to update the product in your cart.' | 'Unable to update the product in your cart.' | 'Updating address' | 'Use billing address' | 'Use fewer keywords' | 'Validating' | 'validation.badInput' | 'validation.customError' | 'validation.invalid' | 'validation.patternMismatch' | 'validation.rangeOverflow' | 'validation.rangeUnderflow' | 'validation.stepMismatch' | 'validation.tooLong' | 'validation.tooShort' | 'validation.typeMismatch' | 'validation.valid' | 'validation.valueMissing' | 'VAT Number' | 'VAT' | 'Welcome to Sonic Equipment. Please choose your country and language below.' | 'What are you searching for?' | 'You could try checking the spelling of your search query' | 'You could try exploring our products by category' | 'You could try' | 'You must ' | 'Your cart has been emptied.' | 'Your favorites are available on multiple devices' | 'Your shopping cart is still empty';
+export type TranslationId = "'{0}' in all products" | "Try 'Search' and try to find the product you're looking for" | "Unfortnately, We found no articles for your search '{0}'" | ' to your account to manage your lists.' | 'Add order notes' | 'Add to list' | 'Address' | 'Amount: {0}' | 'An error occurred while processing your payment. Please try again.' | 'An unexpected error occured' | 'Are you looking for information about our service? Please visit our customer support page' | 'Are you sure you want to remove all items from your cart?' | 'Are you sure you want to remove this item from your cart?' | 'article' | 'articles' | 'As soon as possible' | 'Attention' | 'Billing address' | 'Billing and shipping address' | 'Billing and shipping information' | 'Cancel' | 'Cart' | 'Changing your address is currently not possible. Please contact customer support to change your address.' | 'Chosen filters' | 'City' | 'Clear filters' | 'Clear' | 'Click the button below to continue shopping.' | 'Company name' | 'Conceal value' | 'Continue shopping' | 'Continue' | 'Cost overview' | 'Country' | 'create account' | 'Create new list' | 'Delivery date' | 'Delivery expected in {0} {1}' | 'Double check your spelling' | 'Downloads' | 'Easily add your favorite products' | 'Edit billing address' | 'Edit shipping address' | 'Email' | 'Excl. VAT' | 'Explore by categories' | 'Exploring our products by category' | 'facet.categories' | 'facet.height' | 'facet.weight' | 'Features' | 'First name' | 'Fulfillment method' | 'General' | 'Hide filters' | 'Home' | 'Incl. VAT' | 'Includes' | 'Industry' | 'Language' | 'Last name' | 'List name already exists' | 'New list name' | 'of' | 'Order confirmation' | 'Order date' | 'Order number' | 'Order' | 'Pay by invoice' | 'Pay' | 'Payment method' | 'Payment' | 'pc' | 'Phone' | 'Pick up' | 'Pickup address' | 'Please enter a valid e-mail address' | 'Please enter a valid phone number' | 'Please Sign In' | 'PO Number' | 'Popular searches' | 'Postal Code' | 'Print' | 'Processing' | 'Product Features' | 'Product' | 'Products' | 'Quick access' | 'Recent searches' | 'Recently viewed' | 'Remove all' | 'Requested delivery date' | 'Reveal value' | 'Review and payment' | 'Save order' | 'Save' | 'Saved cart for later.' | 'Search' | 'Searching again using more general terms' | 'See all results' | 'Select a desired delivery date' | 'Select a list' | 'Selecting As Soon As Possible will enable us to send the products to you as they become available.' | 'Share your favorite list with others' | 'Ship' | 'Shipping address' | 'Shipping and handling' | 'Shipping details' | 'Shop more efficiently and quicker with a favorites list' | 'Show all' | 'Show filters' | 'Show less' | 'Show' | 'sign in' | 'Sonic address' | 'Sonic Equipment' | 'Sorry, there are no products found' | 'Sorry, we could not find matches for' | 'Sort by' | 'sort.newest' | 'sort.price_asc' | 'sort.price_desc' | 'sort.relevance' | 'Specifications' | 'Submit' | 'Subtotal' | 'Suggestions' | 'tag.limited' | 'tag.new' | 'The expected delivery is an indication based on the product availability and the shipping location.' | 'The product has been added to your cart.' | 'The product has been removed from your cart.' | 'The product has been updated in your cart.' | 'There are no products in your shopping cart.' | 'Total amount is' | 'Total' | 'Total' | 'Try another search' | 'Try another search' | 'Unable to add the product to your cart.' | 'Unable to add the product to your cart.' | 'Unable to empty your cart.' | 'Unable to empty your cart.' | 'Unable to remove the product from your cart.' | 'Unable to remove the product from your cart.' | 'Unable to save cart for later.' | 'Unable to save cart for later.' | 'Unable to update the product in your cart.' | 'Unable to update the product in your cart.' | 'Updating address' | 'Use billing address' | 'Use fewer keywords' | 'Validating' | 'validation.badInput' | 'validation.customError' | 'validation.invalid' | 'validation.patternMismatch' | 'validation.rangeOverflow' | 'validation.rangeUnderflow' | 'validation.stepMismatch' | 'validation.tooLong' | 'validation.tooShort' | 'validation.typeMismatch' | 'validation.valid' | 'validation.valueMissing' | 'VAT Number' | 'VAT' | 'Welcome to Sonic Equipment. Please choose your country and language below.' | 'What are you searching for?' | 'You could try checking the spelling of your search query' | 'You could try exploring our products by category' | 'You could try' | 'You must ' | 'Your cart has been emptied.' | 'Your favorites are available on multiple devices' | 'Your shopping cart is still empty';

package/dist/pages/checkout/cart-page/cart-page.js

@@ -1,4 +1,4 @@
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { jsx } from 'react/jsx-runtime';
 import { ConnectedOrderLineCard } from '../../../cards/orderline-card/connected-orderline-card.js';
 import { CartTotals } from '../../../cart-totals/cart-totals.js';
 import { CartTotalsSummary } from '../../../cart-totals/cart-totals-summary.js';
@@ -9,7 +9,6 @@ import { CheckoutPageLayout } from '../layouts/checkout-page-layout/checkout-pag
 import { Page } from '../../components/page/page.js';
 import { ErrorPage } from '../../error-page/error-page.js';
 import { LoadingPage } from '../../loading-page/loading-page.js';
-import { NoResults } from '../../product/product-listing-page/no-results/no-results.js';
 import { useIsAuthenticated } from '../../../shared/api/storefront/hooks/authentication/use-is-authenticated.js';
 import { useDeleteCartLineById } from '../../../shared/api/storefront/hooks/cart/use-delete-cart-line-by-id.js';
 import { useDeleteCurrentCart } from '../../../shared/api/storefront/hooks/cart/use-delete-current-cart.js';
@@ -18,11 +17,9 @@ import { RouteButton } from '../../../shared/routing/route-button.js';
 import { useToast } from '../../../toast/use-toast.js';
 import { useFetchCurrentCartLinesWithAtp } from '../../../shared/api/storefront/hooks/cart/use-fetch-current-cart-lines-with-atp.js';
 import { useFetchCurrentCartWithAtp } from '../../../shared/api/storefront/hooks/cart/use-fetch-current-cart-with-atp.js';
+import { CHECKOUT_PATHS } from '../constants.js';
+import { EmptyCart } from './components/empty-cart-page.js';
 
-function EmptyCart() {
-    const t = useFormattedMessage();
-    return (jsx(NoResults, { content: jsxs(Fragment, { children: [jsx(FormattedMessage, { id: "There are no products in your shopping cart." }), jsx("br", {}), jsx(FormattedMessage, { id: "Click the button below to continue shopping." })] }), title: t('Your shopping cart is still empty') }));
-}
 function CartContent({ cartLines }) {
     const { addToast } = useToast();
     const { data: currentCart } = useFetchCurrentCartWithAtp();
@@ -107,9 +104,9 @@ function CartPage() {
     if (isLoading)
         return jsx(LoadingPage, {});
     return (jsx(Page, { breadCrumb: [
-            { href: '/', label: 'home' },
-            { href: '/cart', label: t('Cart') },
-        ], title: t('Cart'), children: cartLines?.length ? (jsx(CartContent, { cartLines: cartLines })) : (jsx(EmptyCart, {})) }));
+            { href: CHECKOUT_PATHS.HOME, label: 'home' },
+            { href: CHECKOUT_PATHS.CART, label: t('Cart') },
+        ], canonicalUrl: CHECKOUT_PATHS.CART, title: t('Cart'), children: cartLines?.length ? (jsx(CartContent, { cartLines: cartLines })) : (jsx(EmptyCart, {})) }));
 }
 
 export { CartPage };

package/dist/pages/checkout/cart-page/components/empty-cart-page.d.ts

@@ -0,0 +1 @@
+export declare function EmptyCart(): import("react/jsx-runtime").JSX.Element;

package/dist/pages/checkout/cart-page/components/empty-cart-page.js

@@ -0,0 +1,11 @@
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { FormattedMessage } from '../../../../intl/formatted-message.js';
+import { useFormattedMessage } from '../../../../intl/use-formatted-message.js';
+import { NoResults } from '../../../product/product-listing-page/no-results/no-results.js';
+
+function EmptyCart() {
+    const t = useFormattedMessage();
+    return (jsx(NoResults, { content: jsxs(Fragment, { children: [jsx(FormattedMessage, { id: "There are no products in your shopping cart." }), jsx("br", {}), jsx(FormattedMessage, { id: "Click the button below to continue shopping." })] }), title: t('Your shopping cart is still empty') }));
+}
+
+export { EmptyCart };

package/dist/pages/checkout/components/billing-and-invoice-information.d.ts

@@ -0,0 +1,7 @@
+import { AddressType } from '../../../shared/model/address';
+interface BillingAndInvoiceInformationProps {
+    billToAddress: AddressType;
+    shipToAddress: AddressType;
+}
+export declare function BillingAndInvoiceInformation({ billToAddress, shipToAddress, }: BillingAndInvoiceInformationProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/pages/checkout/components/billing-and-invoice-information.js

@@ -0,0 +1,12 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Address } from '../../../address/address.js';
+import { InfoDisplay } from '../../../display/info-display/info-display.js';
+import { useFormattedMessage } from '../../../intl/use-formatted-message.js';
+import styles from './billing-and-invoice-information.module.css.js';
+
+function BillingAndInvoiceInformation({ billToAddress, shipToAddress, }) {
+    const t = useFormattedMessage();
+    return (jsxs("div", { className: styles['billing-and-invoice-information'], children: [jsx("section", { className: styles.section, children: jsx(InfoDisplay, { id: "billing-address", label: t('Billing address'), value: jsx(Address, { ...billToAddress }) }) }), jsx("section", { className: styles.section, children: jsx(InfoDisplay, { id: "shipping-address", label: t('Shipping address'), value: jsx(Address, { ...shipToAddress }) }) })] }));
+}
+
+export { BillingAndInvoiceInformation };

package/dist/pages/checkout/components/billing-and-invoice-information.module.css.js

@@ -0,0 +1,3 @@
+var styles = {"billing-and-invoice-information":"billing-and-invoice-information-module-FXmcK","section":"billing-and-invoice-information-module-5-ORs"};
+
+export { styles as default };

package/dist/pages/checkout/constants.d.ts

@@ -0,0 +1,8 @@
+export declare const CHECKOUT_PATHS: {
+    readonly CART: "/cart";
+    readonly CHECKOUT_SHIPPING: "/CheckoutShipping";
+    readonly CHECKOUT_SHIPPING_VIA_SIGNIN: "/signin?returnUrl=/CheckoutShipping";
+    readonly HOME: "/";
+    readonly ORDER_CONFIRMATION: "/OrderConfirmation";
+    readonly REVIEW_AND_SUBMIT: "/CheckoutReviewAndSubmit";
+};