@sonic-equipment/ui 126.0.0 → 128.0.0

package/dist/tooltip/tooltip.d.ts

@@ -1,9 +1,9 @@
-import { ReactElement } from 'react';
+import { ReactElement, ReactNode } from 'react';
 import { Placement } from 'react-aria';
 export interface TooltipProps {
     offset?: number;
     placement?: Placement;
-    text: string;
+    text: string | ReactNode;
     trigger?: ReactElement;
 }
 export declare function Tooltip({ offset, placement, text, trigger, }: TooltipProps): import("react/jsx-runtime").JSX.Element;

package/dist/typography/heading/heading.d.ts

@@ -1,9 +1,11 @@
+import { Breakpoint } from '../../shared/utils/breakpoints';
 export declare const SIZES: readonly ["xxl", "xl", "l", "m", "s", "xs", "xxs", "xxxs"];
 export declare const TAGS: readonly ["h1", "h2", "h3", "h4", "h5", "h6", "h7"];
 type Size = (typeof SIZES)[number];
 type Tag = (typeof TAGS)[number];
-interface HeadingProps {
+export interface HeadingProps {
     bold?: boolean;
+    breakpoints?: Partial<Record<Breakpoint, Size>>;
     children: React.ReactNode;
     className?: string;
     italic?: boolean;
@@ -11,7 +13,7 @@ interface HeadingProps {
     tag?: Tag;
     uppercase?: boolean;
 }
-export declare function Heading({ bold, children, className, italic, size, tag, uppercase, }: HeadingProps): React.ReactElement<{
+export declare function Heading({ bold, breakpoints, children, className, italic, size, tag, uppercase, }: HeadingProps): React.ReactElement<{
     className: string;
 }, string | React.JSXElementConstructor<any>>;
 export {};

package/dist/typography/heading/heading.js

@@ -14,9 +14,10 @@ const sizeToTag = {
     xxs: 'h6',
     xxxs: 'h6',
 };
-function Heading({ bold = true, children, className, italic, size = 'xxl', tag, uppercase, }) {
+function Heading({ bold = true, breakpoints, children, className, italic, size = 'xxl', tag, uppercase, }) {
     return createElement(tag || sizeToTag[size], {
-        className: clsx(className, styles.heading, styles[size], {
+        className: clsx(className, styles.heading, styles[size], breakpoints &&
+            Object.entries(breakpoints).map(([breakpoint, bpSize]) => styles[`${breakpoint}-${bpSize}`]), {
             [styles.uppercase]: uppercase,
             [styles.italic]: italic,
             [styles.bold]: bold,

package/dist/typography/heading/heading.module.css.js

@@ -1,3 +1,3 @@
-var styles = {"heading":"heading-module-pMC65","uppercase":"heading-module-6spgX","italic":"heading-module-XXMDM","bold":"heading-module-xvrxo","xxl":"heading-module-Kn3ZN","xl":"heading-module--hZs-","l":"heading-module-WrJRY","m":"heading-module-hTexc","s":"heading-module-7W29m","xs":"heading-module-SgaLB","xxs":"heading-module-33en7","xxxs":"heading-module-qvrEk"};
+var styles = {"heading":"heading-module-pMC65","uppercase":"heading-module-6spgX","italic":"heading-module-XXMDM","bold":"heading-module-xvrxo","xxl":"heading-module-Kn3ZN","xl":"heading-module--hZs-","l":"heading-module-WrJRY","m":"heading-module-hTexc","s":"heading-module-7W29m","xs":"heading-module-SgaLB","xxs":"heading-module-33en7","xxxs":"heading-module-qvrEk","sm-xxl":"heading-module-Q3y61","sm-xl":"heading-module-k5ODo","sm-l":"heading-module-45IqH","sm-m":"heading-module-X7un-","sm-s":"heading-module-EimRV","sm-xs":"heading-module-OCU2-","sm-xxs":"heading-module-Iey3i","sm-xxxs":"heading-module-HIlpl","md-xxl":"heading-module-5QOn5","md-xl":"heading-module-Yi-gr","md-l":"heading-module-Yv3Nk","md-m":"heading-module-rw6SX","md-s":"heading-module-w5E3X","md-xs":"heading-module-gS4KN","md-xxs":"heading-module-WP-gl","md-xxxs":"heading-module-mpKxt","lg-xxl":"heading-module-Jl0gk","lg-xl":"heading-module-JeBTR","lg-l":"heading-module-3dHjk","lg-m":"heading-module-TWKes","lg-s":"heading-module-Y4TBU","lg-xs":"heading-module-c7cii","lg-xxs":"heading-module-pzJ8y","lg-xxxs":"heading-module--tJ-O","xl-xxl":"heading-module-nWxkD","xl-xl":"heading-module-VXYJS","xl-l":"heading-module-ozpn6","xl-m":"heading-module-mYwNt","xl-s":"heading-module-Bthct","xl-xs":"heading-module-81BCe","xl-xxs":"heading-module-RjUW0","xl-xxxs":"heading-module-PlHnT","xxl-xxl":"heading-module-zl8KP","xxl-xl":"heading-module-zw3KX","xxl-l":"heading-module-76y37","xxl-m":"heading-module-Ucgfg","xxl-s":"heading-module-dOPjv","xxl-xs":"heading-module-Le9JC","xxl-xxs":"heading-module-9j-SM","xxl-xxxs":"heading-module-wOR6v"};
 
 export { styles as default };

package/package.json

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

package/dist/pages/layouts/checkout-page-layout/checkout-page-layout.module.css.js

@@ -1,3 +0,0 @@
-var styles = {"checkout-page-layout":"checkout-page-layout-module-54Qta","wrapper":"checkout-page-layout-module-itTHb","sticky-side":"checkout-page-layout-module-pV1P2","actions":"checkout-page-layout-module-xuXiO","top-actions":"checkout-page-layout-module-Nmktk","top-actions-sticky":"checkout-page-layout-module---Bqj"};
-
-export { styles as default };

package/dist/pages/layouts/product-details-page-layout/product-details-page-layout.module.css.js

@@ -1,3 +0,0 @@
-var styles = {"product-details-page-layout":"product-details-page-layout-module-YnHNa","top":"product-details-page-layout-module-bWVpu","image-gallery":"product-details-page-layout-module-EgqvM","product-information":"product-details-page-layout-module-Tu8s1","recently-viewed":"product-details-page-layout-module-9VKcH","included":"product-details-page-layout-module--tq0o","usp":"product-details-page-layout-module-xA4IZ"};
-
-export { styles as default };

package/dist/pages/page/page.module.css.js

@@ -1,3 +0,0 @@
-var styles = {"page":"page-module-XtZ9Y","breadcrumb":"page-module-ohh9z","title":"page-module-TEmve"};
-
-export { styles as default };

package/dist/pages/page-container/page-container.module.css.js

@@ -1,3 +0,0 @@
-var styles = {"page-container":"page-container-module-PYmbC","inner-page-container":"page-container-module-uD8GF"};
-
-export { styles as default };

package/dist/pages/product-details-page/components/product-details-panel/product-details-panel.module.css.js

@@ -1,3 +0,0 @@
-var styles = {"product-details-panel":"product-details-panel-module-kfhpL","heading":"product-details-panel-module--1ODE","price-action-container":"product-details-panel-module-CCcmA","action-container":"product-details-panel-module-1vyDM","description":"product-details-panel-module-GfTab","feature-list":"product-details-panel-module-ze0my"};
-
-export { styles as default };

package/dist/pages/product-details-page/product-details-page.js

@@ -1,22 +0,0 @@
-"use client";
-import { jsx } from 'react/jsx-runtime';
-import { useCultureCode } from '../../intl/use-culture-code.js';
-import { useFetchProductDetailsPageData } from '../../shared/api/bff/hooks/use-fetch-product-details-page-data.js';
-import { ErrorPage } from '../error-page/error-page.js';
-import { LoadingPage } from '../loading-page/loading-page.js';
-import { ProductDetails } from './product-details.js';
-
-function ProductDetailsPage({ pageUrl }) {
-    const cultureCode = useCultureCode();
-    const { data, error, isError, isFetching } = useFetchProductDetailsPageData({
-        cultureCode,
-        pageUrl,
-    });
-    if (isError)
-        return jsx(ErrorPage, { error: error });
-    if (!data || isFetching)
-        return jsx(LoadingPage, {});
-    return jsx(ProductDetails, { data: data });
-}
-
-export { ProductDetailsPage };

package/dist/pages/product-listing-page/no-results/no-results.module.css.js

@@ -1,3 +0,0 @@
-var styles = {"no-results":"no-results-module-T1cti","title":"no-results-module-mZ8TQ","body":"no-results-module-FQGhC","buttons":"no-results-module-QGZsD"};
-
-export { styles as default };

package/dist/pages/product-listing-page/product-listing-page.js

@@ -1,29 +0,0 @@
-"use client";
-import { jsx } from 'react/jsx-runtime';
-import { createSonicSearchClient } from '../../algolia/algolia-sonic-searchclient.js';
-import { config } from '../../config.js';
-import { useCultureCode } from '../../intl/use-culture-code.js';
-import { useFetchProductListingPageData } from '../../shared/api/bff/hooks/use-fetch-product-listing-page-data.js';
-import { ErrorPage } from '../error-page/error-page.js';
-import { LoadingPage } from '../loading-page/loading-page.js';
-import { ProductListing } from './product-listing.js';
-
-const defaultSearchClient = createSonicSearchClient({
-    apiKey: config.ALGOLIA_API_KEY,
-    appId: config.ALGOLIA_APP_ID,
-    host: config.ALGOLIA_HOST,
-});
-function ProductListingPage({ pageUrl, searchClient = defaultSearchClient, }) {
-    const cultureCode = useCultureCode();
-    const { data, error, isError, isFetching } = useFetchProductListingPageData({
-        cultureCode,
-        pageUrl,
-    });
-    if (isError)
-        return jsx(ErrorPage, { error: error });
-    if (!data || isFetching)
-        return jsx(LoadingPage, {});
-    return jsx(ProductListing, { data: data, searchClient: searchClient });
-}
-
-export { ProductListingPage };

package/dist/pages/product-listing-page/product-listing-page.module.css.js

@@ -1,3 +0,0 @@
-var styles = {"product-listing":"product-listing-page-module-dmIHF","header":"product-listing-page-module-Oz76Z","promos":"product-listing-page-module-iY1yj","action-bar":"product-listing-page-module-XxGrr","sidebar-toggle":"product-listing-page-module-F7bxy","sort":"product-listing-page-module-aQzHr","count":"product-listing-page-module-zx79v","categories":"product-listing-page-module-R4aOl","product-grid-container":"product-listing-page-module-ICkKg","product-grid":"product-listing-page-module-LHE7z","pagination":"product-listing-page-module-xsRaj"};
-
-export { styles as default };

package/dist/pages/search-result-page/search-results-page.module.css.js

@@ -1,3 +0,0 @@
-var styles = {"search-results":"search-results-page-module-M7SIu","header":"search-results-page-module-DpNT-","action-bar":"search-results-page-module-RJoMk","sidebar-toggle":"search-results-page-module-SzLQb","sort":"search-results-page-module-cgonp","count":"search-results-page-module-hunZp","categories":"search-results-page-module-n2lSj","product-grid-container":"search-results-page-module-TK-iE","product-grid":"search-results-page-module-HWUnk","pagination":"search-results-page-module-SZYiA"};
-
-export { styles as default };

package/dist/pages/shipping-page/components/edit-address.module.css.js

@@ -1,3 +0,0 @@
-var styles = {"form-container":"edit-address-module-dphSX","form-header":"edit-address-module-8FyLR","form":"edit-address-module-dtGk5","span-2":"edit-address-module-HVdsP","use-invoice-checkbox":"edit-address-module-H8hM-"};
-
-export { styles as default };

package/dist/pages/shipping-page/components/readonly-address.js

@@ -1,25 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { Form } from 'react-aria-components';
-import { Address } from '../../../address/address.js';
-import { Checkbox } from '../../../forms/checkbox/checkbox.js';
-import { TextField } from '../../../forms/text-field/text-field.js';
-import { FormattedMessage } from '../../../intl/formatted-message.js';
-import { useFormattedMessage } from '../../../intl/use-formatted-message.js';
-import { RouteLink } from '../../../shared/routing/route-link.js';
-import { Heading } from '../../../typography/heading/heading.js';
-import { EDIT_ADDRESS_FORM_ID } from './edit-address.js';
-import styles from './readonly-address.module.css.js';
-
-const ACCOUNT_ADDRESSES_PATH = '/MyAccount/Addresses';
-function ReadOnlyAddresses({ billTo, isLoading, notes, onSubmit, shipTo, }) {
-    const t = useFormattedMessage();
-    return (jsxs(Form, { className: styles.form, id: EDIT_ADDRESS_FORM_ID, onSubmit: e => {
-            e.preventDefault();
-            const formData = new FormData(e.currentTarget);
-            onSubmit({
-                notes: formData.get('notes')?.toString() || '',
-            });
-        }, children: [jsxs("section", { className: styles.section, children: [jsx(Heading, { className: styles['section-header'], size: "xs", tag: "h2", children: jsx(FormattedMessage, { id: "Billing address" }) }), jsxs(RouteLink, { className: styles['section-link'], color: "secondary", href: ACCOUNT_ADDRESSES_PATH, isDisabled: isLoading, children: [jsx(FormattedMessage, { id: "Edit billing address" }), " >"] }), jsxs("div", { className: styles['section-content'], children: [billTo && (jsx(Address, { city: billTo.city, companyName: billTo.companyName, country: billTo.country?.name, email: billTo.email, phone: billTo.phone, postalCode: billTo.postalCode })), jsx("div", { className: styles.notes, children: jsx(TextField, { defaultValue: notes, isDisabled: isLoading, isMultiline: true, label: t('Add order notes'), name: "notes", rows: 3, showLabel: true }) })] })] }), jsxs("section", { className: styles.section, children: [jsx(Heading, { className: styles['section-header'], size: "xs", tag: "h2", children: jsx(FormattedMessage, { id: "Shipping address" }) }), jsxs(RouteLink, { className: styles['section-link'], color: "secondary", href: ACCOUNT_ADDRESSES_PATH, isDisabled: isLoading, children: [jsx(FormattedMessage, { id: "Edit shipping address" }), " >"] }), jsxs("div", { className: styles['section-content'], children: [jsx(Checkbox, { className: styles['use-invoice-checkbox'], isDisabled: true, isSelected: true, children: jsx(FormattedMessage, { id: "Use billing address" }) }), shipTo && (jsx(Address, { city: shipTo.city, companyName: shipTo.companyName, country: shipTo.country?.name, email: shipTo.email, phone: shipTo.phone, postalCode: shipTo.postalCode }))] })] })] }));
-}
-
-export { ReadOnlyAddresses };

package/dist/pages/shipping-page/components/readonly-address.module.css.js

@@ -1,3 +0,0 @@
-var styles = {"section":"readonly-address-module-86tan","section-header":"readonly-address-module-VLsk2","section-content":"readonly-address-module-84Ake","section-link":"readonly-address-module-rxXHA","notes":"readonly-address-module-mhW4y","use-invoice-checkbox":"readonly-address-module-qgm1D"};
-
-export { styles as default };

package/dist/pages/shipping-page/shipping-page.js

@@ -1,75 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { useEffect } from 'react';
-import { Button } from '../../buttons/button/button.js';
-import { CartTotals } from '../../cart-totals/cart-totals.js';
-import { CartTotalsSummary } from '../../cart-totals/cart-totals-summary.js';
-import { FormattedMessage } from '../../intl/formatted-message.js';
-import { useFormattedMessage } from '../../intl/use-formatted-message.js';
-import { useFetchCurrentCart } from '../../shared/api/storefront/hooks/cart/use-fetch-current-cart.js';
-import { usePatchCart } from '../../shared/api/storefront/hooks/cart/use-patch-cart.js';
-import { usePatchBillToAddress } from '../../shared/api/storefront/hooks/customer/use-patch-bill-to-address.js';
-import { useFetchCountries } from '../../shared/api/storefront/hooks/website/use-fetch-countries.js';
-import { useNavigate } from '../../shared/routing/route-provider.js';
-import { ErrorPage } from '../error-page/error-page.js';
-import { CheckoutPageLayout } from '../layouts/checkout-page-layout/checkout-page-layout.js';
-import { LoadingPage } from '../loading-page/loading-page.js';
-import { Page } from '../page/page.js';
-import { EDIT_ADDRESS_FORM_ID, EditAddresses } from './components/edit-address.js';
-import { ReadOnlyAddresses } from './components/readonly-address.js';
-import styles from './shipping-page.module.css.js';
-
-const REVIEW_AND_SUBMIT_PATH = '/CheckoutReviewAndSubmit';
-function ShippingPage() {
-    const { data: cart, error, isLoading: isLoadingCart } = useFetchCurrentCart();
-    const hasCart = Boolean(cart);
-    const hasBillTo = Boolean(cart?.billTo);
-    const hasEmptyBillTo = Boolean(cart?.billTo?.address1);
-    const { data: countries, isLoading: isLoadingCountries } = useFetchCountries({
-        enabled: !hasEmptyBillTo,
-    });
-    const { isLoading: isPatchBillToAddress, mutate: patchBillToAddress } = usePatchBillToAddress();
-    const { isLoading: isPatchingCart, mutate: patchCart } = usePatchCart();
-    const t = useFormattedMessage();
-    const isLoading = isLoadingCart || isLoadingCountries;
-    const isPatching = isPatchBillToAddress || isPatchingCart;
-    const navigate = useNavigate();
-    useEffect(() => {
-        if (hasCart && !hasBillTo)
-            navigate('/sign-in?returnUrl=/CheckoutShipping');
-    }, [hasCart, hasBillTo, navigate]);
-    if (error)
-        return jsx(ErrorPage, { error: error });
-    if (isLoading)
-        return jsx(LoadingPage, {});
-    if (!cart || (!hasEmptyBillTo && !countries))
-        return null;
-    if (!hasBillTo) {
-        return (jsx(Page, { breadCrumb: [
-                { href: '/', label: t('Home') },
-                { href: '/CheckoutShipping', label: t('Shipping details') },
-            ], children: jsx("h1", { children: jsx(FormattedMessage, { id: "Please Sign In" }) }) }));
-    }
-    return (jsx(Page, { breadCrumb: [
-            { href: '/', label: t('Home') },
-            { href: '/CheckoutShipping', label: t('Shipping details') },
-        ], title: t('Shipping details'), children: jsx(CheckoutPageLayout, { actions: {
-                primary: (jsx(Button, { withArrow: true, "data-test-selector": "checkoutShippingCartTotalContinueButton", form: EDIT_ADDRESS_FORM_ID, isDisabled: isPatching, isLoading: isPatching && jsx(FormattedMessage, { id: "Continue shopping" }), type: "submit", children: jsx(FormattedMessage, { id: "Continue shopping" }) })),
-            }, mobileSummary: jsx(CartTotalsSummary, { totalAmount: cart.orderGrandTotalDisplay }), overview: jsx(CartTotals, { shippingCost: cart.shippingAndHandlingDisplay, subtotal: cart.orderSubTotalDisplay, tax: cart.totalTaxDisplay, total: cart.orderGrandTotalDisplay, vatPercentage: cart.cartLines?.[0]?.pricing?.vatRate || 0 }), children: jsx("div", { className: styles['main-content'], children: hasEmptyBillTo ? (jsx(ReadOnlyAddresses, { billTo: cart.billTo, isLoading: isPatching, notes: cart.notes, onSubmit: async ({ notes }) => {
-                        if (!cart.billTo)
-                            return;
-                        await patchCart({ cart: { ...cart, notes } });
-                        navigate(REVIEW_AND_SUBMIT_PATH);
-                    }, shipTo: cart.shipTo })) : (jsx(EditAddresses, { countries: countries || [], isLoading: isPatching, onSubmit: async ({ address, notes }) => {
-                        if (!cart.billTo)
-                            return;
-                        await Promise.all([
-                            patchBillToAddress({
-                                billTo: { ...cart.billTo, ...address },
-                            }),
-                            patchCart({ cart: { ...cart, notes } }),
-                        ]);
-                        navigate(REVIEW_AND_SUBMIT_PATH);
-                    } })) }) }) }));
-}
-
-export { ShippingPage };

package/dist/pages/shipping-page/shipping-page.module.css.js

@@ -1,3 +0,0 @@
-var styles = {"main-content":"shipping-page-module-vmV0t"};
-
-export { styles as default };