@sonic-equipment/ui 185.0.0 → 186.0.0

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

@@ -1,6 +1,6 @@
-import { AddressType } from '../shared/model/address';
+import { Address } from '../shared/model/address';
 export interface AddressProps {
-    address: AddressType;
+    address: Address;
     'data-test-selector'?: string;
 }
 export declare function AddressInfoDisplay({ address, 'data-test-selector': dataTestSelector, }: AddressProps): import("react/jsx-runtime").JSX.Element;

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

@@ -3,7 +3,7 @@ import styles from './address-info-display.module.css.js';
 
 function AddressInfoDisplay({ address, 'data-test-selector': dataTestSelector, }) {
     const { address1, address2, address3, city, companyName, country, email, firstName, lastName, phone, postalCode, } = address;
-    return (jsxs("address", { className: styles.address, "data-test-selector": dataTestSelector, children: [(firstName || lastName) && (jsxs("p", { "data-test-selector": "addressInfoDisplay_name", children: [jsx("span", { "data-test-selector": "addressInfoDisplay_name_firstName", children: firstName }), ` `, jsx("span", { "data-test-selector": "addressInfoDisplay_name_lastName", children: lastName })] })), companyName && (jsx("p", { "data-test-selector": "addressInfoDisplay_companyName", children: companyName })), address1 && (jsx("p", { "data-test-selector": "addressInfoDisplay_address1", children: address1 })), address2 && (jsx("p", { "data-test-selector": "addressInfoDisplay_address2", children: address2 })), address3 && (jsx("p", { "data-test-selector": "addressInfoDisplay_address3", children: address3 })), (postalCode || city) && (jsxs("p", { children: [postalCode && (jsxs(Fragment, { children: [jsx("span", { "data-test-selector": "addressInfoDisplay_postalCode", children: postalCode }), ' '] })), city && (jsx("span", { "data-test-selector": "addressInfoDisplay_city", children: city }))] })), country && (jsx("p", { "data-test-selector": "addressInfoDisplay_country", children: country })), phone && jsx("p", { "data-test-selector": "addressInfoDisplay_phone", children: phone }), email && jsx("p", { "data-test-selector": "addressInfoDisplay_email", children: email })] }));
+    return (jsxs("address", { className: styles.address, "data-test-selector": dataTestSelector, children: [(firstName || lastName) && (jsxs("p", { "data-test-selector": "addressInfoDisplay_name", children: [jsx("span", { "data-test-selector": "addressInfoDisplay_name_firstName", children: firstName }), ` `, jsx("span", { "data-test-selector": "addressInfoDisplay_name_lastName", children: lastName })] })), companyName && (jsx("p", { "data-test-selector": "addressInfoDisplay_companyName", children: companyName })), address1 && (jsx("p", { "data-test-selector": "addressInfoDisplay_address1", children: address1 })), address2 && (jsx("p", { "data-test-selector": "addressInfoDisplay_address2", children: address2 })), address3 && (jsx("p", { "data-test-selector": "addressInfoDisplay_address3", children: address3 })), (postalCode || city) && (jsxs("p", { children: [postalCode && (jsxs(Fragment, { children: [jsx("span", { "data-test-selector": "addressInfoDisplay_postalCode", children: postalCode }), ' '] })), city && (jsx("span", { "data-test-selector": "addressInfoDisplay_city", children: city }))] })), country && (jsx("p", { "data-test-selector": "addressInfoDisplay_country", children: country.name })), phone && jsx("p", { "data-test-selector": "addressInfoDisplay_phone", children: phone }), email && jsx("p", { "data-test-selector": "addressInfoDisplay_email", children: email })] }));
 }
 
 export { AddressInfoDisplay };

package/dist/algolia/algolia-multi-select-filter-section.js

@@ -2,7 +2,7 @@
 import { jsx } from 'react/jsx-runtime';
 import { useRefinementList } from 'react-instantsearch';
 import { MultiSelect } from '../filters/multi-select/multi-select.js';
-import { Checkbox } from '../forms/checkbox/checkbox.js';
+import { Checkbox } from '../forms/elements/checkbox/checkbox.js';
 import { FilterSection } from './filter-section.js';
 
 function AlgoliaMultiSelectFilterSection({ attribute, }) {

package/dist/algolia/algolia-sort-by.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
 import { useSortBy } from 'react-instantsearch';
-import { Select } from '../forms/select/select.js';
+import { Select } from '../forms/elements/select/select.js';
 import { useFormattedMessage } from '../intl/use-formatted-message.js';
 import { useLanguageCode } from '../intl/use-language-code.js';
 import { environment } from '../shared/utils/environment.js';

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

@@ -1,7 +1,7 @@
 "use client";
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { useState, useCallback, useRef, useEffect } from 'react';
-import { NumberField } from '../../forms/number-field/number-field.js';
+import { NumberField } from '../../forms/fields/number-field/number-field.js';
 import { SolidCartIcon } from '../../icons/solid/solid-cart-icon.js';
 import { useFormattedMessage } from '../../intl/use-formatted-message.js';
 import { useDebouncedCallback } from '../../shared/hooks/use-debounced-callback.js';

package/dist/country-select/country-select.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
 import { useMemo } from 'react';
-import { SelectField } from '../forms/select-field/select-field.js';
+import { SelectField } from '../forms/fields/select-field/select-field.js';
 import { useFormattedMessage } from '../intl/use-formatted-message.js';
 
 function CountrySelect({ countries, countryNameInLanguageOfCountry = false, 'data-test-selector': dataTestSelector, defaultSelectedCountry, isDisabled, isLoading, isRequired, name, onCountryChange, selectedCountry, showLabel = true, }) {

package/dist/country-select/hooks/use-countries.js

@@ -33,6 +33,7 @@ function useCountries({ enabled = true, }) {
                     };
                 }),
                 name: country.name,
+                states: null,
             };
         });
         return countries;

package/dist/country-selector/country-selector-dialog/country-selector-dialog.js

@@ -3,7 +3,7 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 import { useState, useMemo, useCallback } from 'react';
 import { Button } from '../../buttons/button/button.js';
 import { CountrySelect } from '../../country-select/country-select.js';
-import { Select } from '../../forms/select/select.js';
+import { Select } from '../../forms/elements/select/select.js';
 import { FormattedMessage } from '../../intl/formatted-message.js';
 import { useFormattedMessage } from '../../intl/use-formatted-message.js';
 import { Dialog } from '../../modals/dialog/dialog.js';

package/dist/exports.d.ts

@@ -89,27 +89,28 @@ export * from './filters/multi-select/multi-select';
 export * from './filters/pagination/pagination';
 export * from './footer/connected-footer';
 export * from './footer/footer';
-export * from './forms/checkbox-field/checkbox-field';
-export * from './forms/checkbox/checkbox';
-export * from './forms/color-checkbox/color-checkbox';
-export * from './forms/field-error/field-error';
-export * from './forms/form/form';
-export * from './forms/form/form-field-layout';
-export * from './forms/form/form-segment';
-export * from './forms/form/form-segment-group';
-export * from './forms/input/input';
-export * from './forms/label/label';
-export * from './forms/number-field/number-field';
-export * from './forms/password-field/password-field';
-export * from './forms/password-validation/password-validation';
-export * from './forms/search-field/search-field';
-export * from './forms/select-field/select-field';
-export * from './forms/select/select';
-export * from './forms/switch-field/switch-field';
-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 './forms/elements/checkbox/checkbox';
+export * from './forms/elements/color-checkbox/color-checkbox';
+export * from './forms/elements/field-error/field-error';
+export * from './forms/elements/input/input';
+export * from './forms/elements/label/label';
+export * from './forms/elements/select/select';
+export * from './forms/elements/switch/switch';
+export * from './forms/elements/textarea/textarea';
+export * from './forms/fields/checkbox-field/checkbox-field';
+export * from './forms/fields/number-field/number-field';
+export * from './forms/fields/password-field/password-field';
+export * from './forms/fields/search-field/search-field';
+export * from './forms/fields/select-field/select-field';
+export * from './forms/fields/switch-field/switch-field';
+export * from './forms/fields/text-field/password-reveal-toggle/password-reveal-toggle';
+export * from './forms/fields/text-field/text-field';
+export * from './forms/layout/form/form';
+export * from './forms/layout/form/form-field-layout';
+export * from './forms/layout/form/form-segment';
+export * from './forms/layout/form/form-segment-group';
+export * from './forms/partials/edit-address-form/edit-address-form';
+export * from './forms/partials/password-validation/password-validation';
 export * from './global-search/categories-grid/categories-grid';
 export * from './global-search/global-search';
 export * from './global-search/global-search-provider/global-search-provider';
@@ -223,7 +224,7 @@ export * from './pages/checkout/payment-page/payment-page';
 export * from './pages/checkout/payment-page/payment-page-content';
 export * from './pages/checkout/payment-page/utils/parse-amount';
 export * from './pages/checkout/shipping-page/components/currency-change-dialog';
-export * from './pages/checkout/shipping-page/components/edit-address-form';
+export * from './pages/checkout/shipping-page/components/edit-checkout-bill-to-address-form';
 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';
@@ -240,6 +241,7 @@ export * from './pages/my-sonic/actions/change-customer/connected-change-custome
 export * from './pages/my-sonic/actions/change-password/change-password';
 export * from './pages/my-sonic/actions/change-password/change-password-dialog';
 export * from './pages/my-sonic/actions/change-password/connected-change-password-dialog';
+export * from './pages/my-sonic/actions/edit-bill-to-address/edit-bill-to-address';
 export * from './pages/my-sonic/actions/edit-user-info/connected-edit-user-info-dialog';
 export * from './pages/my-sonic/actions/edit-user-info/edit-user-info';
 export * from './pages/my-sonic/actions/edit-user-info/edit-user-info-dialog';

package/dist/filters/pagination/pagination.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { IconButton } from '../../buttons/icon-button/icon-button.js';
-import { NumberField } from '../../forms/number-field/number-field.js';
+import { NumberField } from '../../forms/fields/number-field/number-field.js';
 import { GlyphsChevronsSlimLeftIcon } from '../../icons/glyph/glyphs-chevrons-slim-left-icon.js';
 import { GlyphsChevronsSlimRightIcon } from '../../icons/glyph/glyphs-chevrons-slim-right-icon.js';
 import { FormattedMessage } from '../../intl/formatted-message.js';

package/dist/forms/elements/checkbox/checkbox.module.css.js

@@ -0,0 +1,3 @@
+var styles = {"checkbox":"checkbox-module-QzsaZ","box":"checkbox-module-spG9E","checkmark":"checkbox-module-CQcmb","color-checkbox":"checkbox-module-CRPMG","label":"checkbox-module-bO3ou"};
+
+export { styles as default };

package/dist/forms/{field-error → elements/field-error}/field-error.js

@@ -2,7 +2,7 @@
 import { jsx } from 'react/jsx-runtime';
 import { FieldError as FieldError$1 } from 'react-aria-components';
 import clsx from 'clsx';
-import { useFormattedMessage } from '../../intl/use-formatted-message.js';
+import { useFormattedMessage } from '../../../intl/use-formatted-message.js';
 import styles from './field-error.module.css.js';
 
 function FieldError({ children, className }) {

package/dist/forms/elements/field-error/field-error.module.css.js

@@ -0,0 +1,3 @@
+var styles = {"field-error":"field-error-module-1wmEy"};
+
+export { styles as default };

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

@@ -0,0 +1,3 @@
+var styles = {"input-container":"input-module-uAOUY","solid":"input-module-7IaPE","outline":"input-module-axHOD","shadow-input":"input-module-2u4Pp","lg":"input-module-HFhUu","md":"input-module-DRosR","focus":"input-module-7iPV5","growing-input":"input-module-peOqs","inline-element":"input-module-Ai2f7","input":"input-module-JdwaH"};
+
+export { styles as default };

package/dist/forms/elements/label/label.module.css.js

@@ -0,0 +1,3 @@
+var styles = {"label":"label-module-iLPRx","required":"label-module-8uUN-"};
+
+export { styles as default };

package/dist/forms/{select → elements/select}/select.js

@@ -3,9 +3,9 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 import { useRef, useEffect } from 'react';
 import { Select as Select$1, Button, SelectValue, Popover, ListBox, ListBoxSection, Header, ListBoxItem } from 'react-aria-components';
 import clsx from 'clsx';
-import { GlyphsChevronsSlimDownIcon } from '../../icons/glyph/glyphs-chevrons-slim-down-icon.js';
-import { StrokeCheckmarkIcon } from '../../icons/stroke/stroke-checkmark-icon.js';
-import { ProgressCircle } from '../../loading/progress-circle.js';
+import { GlyphsChevronsSlimDownIcon } from '../../../icons/glyph/glyphs-chevrons-slim-down-icon.js';
+import { StrokeCheckmarkIcon } from '../../../icons/stroke/stroke-checkmark-icon.js';
+import { ProgressCircle } from '../../../loading/progress-circle.js';
 import { FieldError } from '../field-error/field-error.js';
 import { Label } from '../label/label.js';
 import styles from './select.module.css.js';

package/dist/forms/elements/select/select.module.css.js

@@ -0,0 +1,3 @@
+var styles = {"select":"select-module-IPU-m","sm":"select-module-ysEmc","md":"select-module-E62kG","button":"select-module-0kwVJ","icon-wrapper":"select-module-ptK6Z","focus":"select-module-cnFLz","solid":"select-module-Qq411","loading":"select-module-KuyIv","popover":"select-module-XFHrL","listbox":"select-module-K6TjK","header":"select-module-AUXLg","item":"select-module-MkKKi","check":"select-module-N7nUk"};
+
+export { styles as default };

package/dist/forms/elements/switch/switch.module.css.js

@@ -0,0 +1,3 @@
+var styles = {"switch":"switch-module-C7eqt","indicator":"switch-module-UZop9","label":"switch-module-rX09b"};
+
+export { styles as default };

package/dist/forms/elements/textarea/textarea.module.css.js

@@ -0,0 +1,3 @@
+var styles = {"input-container":"textarea-module-FEAEz","solid":"textarea-module-hHg5e","outline":"textarea-module-CEbPl","lg":"textarea-module-PKIWL","md":"textarea-module-27RUM"};
+
+export { styles as default };

package/dist/forms/{checkbox-field → fields/checkbox-field}/checkbox-field.d.ts

@@ -1,5 +1,5 @@
-import { CheckboxProps, CheckboxPropsBase } from '../checkbox/checkbox';
-import { ValidateFunction } from '../field-error/field-error';
+import { CheckboxProps, CheckboxPropsBase } from '../../elements/checkbox/checkbox';
+import { ValidateFunction } from '../../elements/field-error/field-error';
 export interface CheckboxFieldPropsBase extends CheckboxPropsBase {
     errorMessage?: string;
     info?: string;

package/dist/forms/{checkbox-field → fields/checkbox-field}/checkbox-field.js

@@ -2,10 +2,10 @@
 import { jsx } from 'react/jsx-runtime';
 import { CheckboxGroup } from 'react-aria-components';
 import clsx from 'clsx';
-import { InfoIconTooltip } from '../../info-icon-tooltip/info-icon-tooltip.js';
-import { Checkbox } from '../checkbox/checkbox.js';
-import { FieldError } from '../field-error/field-error.js';
-import { FormFieldLayout } from '../form/form-field-layout.js';
+import { InfoIconTooltip } from '../../../info-icon-tooltip/info-icon-tooltip.js';
+import { Checkbox } from '../../elements/checkbox/checkbox.js';
+import { FieldError } from '../../elements/field-error/field-error.js';
+import { FormFieldLayout } from '../../layout/form/form-field-layout.js';
 import styles from './checkbox-field.module.css.js';
 
 function CheckboxField(props) {

package/dist/forms/fields/checkbox-field/checkbox-field.module.css.js

@@ -0,0 +1,3 @@
+var styles = {"checkbox-field":"checkbox-field-module-cjj4V"};
+
+export { styles as default };

package/dist/forms/{number-field → fields/number-field}/number-field.d.ts

@@ -1,5 +1,5 @@
 import { FocusEvent, FormEventHandler } from 'react';
-import { ValidateFunction } from '../field-error/field-error';
+import { ValidateFunction } from '../../elements/field-error/field-error';
 interface NumberFieldProps {
     autoFocus?: boolean;
     autoGrow?: boolean;

package/dist/forms/{number-field → fields/number-field}/number-field.js

@@ -3,14 +3,14 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 import { useRef, useState } from 'react';
 import { NumberField as NumberField$1, Button } from 'react-aria-components';
 import clsx from 'clsx';
-import { StrokeMinusIcon } from '../../icons/stroke/stroke-minus-icon.js';
-import { StrokePlusIcon } from '../../icons/stroke/stroke-plus-icon.js';
-import { StrokeTrashIcon } from '../../icons/stroke/stroke-trash-icon.js';
-import { InfoIconTooltip } from '../../info-icon-tooltip/info-icon-tooltip.js';
-import { FieldError } from '../field-error/field-error.js';
-import { FormFieldLayout } from '../form/form-field-layout.js';
-import { Input } from '../input/input.js';
-import { Label } from '../label/label.js';
+import { StrokeMinusIcon } from '../../../icons/stroke/stroke-minus-icon.js';
+import { StrokePlusIcon } from '../../../icons/stroke/stroke-plus-icon.js';
+import { StrokeTrashIcon } from '../../../icons/stroke/stroke-trash-icon.js';
+import { InfoIconTooltip } from '../../../info-icon-tooltip/info-icon-tooltip.js';
+import { FieldError } from '../../elements/field-error/field-error.js';
+import { Input } from '../../elements/input/input.js';
+import { Label } from '../../elements/label/label.js';
+import { FormFieldLayout } from '../../layout/form/form-field-layout.js';
 import styles from './number-field.module.css.js';
 
 const defaultFormatOptions = {

package/dist/forms/fields/number-field/number-field.module.css.js

@@ -0,0 +1,3 @@
+var styles = {"number-field":"number-field-module-eFnKr","controls":"number-field-module-MAY-9","zoom-in-text":"number-field-module-QbNfS","control":"number-field-module-v1sB2"};
+
+export { styles as default };

package/dist/forms/{search-field → fields/search-field}/search-field.js

@@ -1,9 +1,9 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
 import { useState } from 'react';
-import { StrokeSearchIcon } from '../../icons/stroke/stroke-search-icon.js';
-import { ProgressCircle } from '../../loading/progress-circle.js';
-import { useDebouncedCallback } from '../../shared/hooks/use-debounced-callback.js';
+import { StrokeSearchIcon } from '../../../icons/stroke/stroke-search-icon.js';
+import { ProgressCircle } from '../../../loading/progress-circle.js';
+import { useDebouncedCallback } from '../../../shared/hooks/use-debounced-callback.js';
 import { TextField } from '../text-field/text-field.js';
 
 function SearchField({ isDebounced = false, isLoading = false, onChange, value: _value, ...props }) {

package/dist/forms/{select-field → fields/select-field}/select-field.d.ts

@@ -1,4 +1,4 @@
-import { ValidateFunction } from '../field-error/field-error';
+import { ValidateFunction } from '../../elements/field-error/field-error';
 interface SelectFieldPropsBase {
     'data-test-selector'?: string;
     label: string;

package/dist/forms/{select-field → fields/select-field}/select-field.js

@@ -3,13 +3,13 @@ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useState, useEffect } from 'react';
 import { Select, Button, SelectValue, Popover, ListBox, ListBoxSection, Header, ListBoxItem } from 'react-aria-components';
 import clsx from 'clsx';
-import { GlyphsChevronsSlimDownIcon } from '../../icons/glyph/glyphs-chevrons-slim-down-icon.js';
-import { StrokeCheckmarkIcon } from '../../icons/stroke/stroke-checkmark-icon.js';
-import { InfoIconTooltip } from '../../info-icon-tooltip/info-icon-tooltip.js';
-import { ProgressCircle } from '../../loading/progress-circle.js';
-import { FieldError } from '../field-error/field-error.js';
-import { FormFieldLayout } from '../form/form-field-layout.js';
-import { Label } from '../label/label.js';
+import { GlyphsChevronsSlimDownIcon } from '../../../icons/glyph/glyphs-chevrons-slim-down-icon.js';
+import { StrokeCheckmarkIcon } from '../../../icons/stroke/stroke-checkmark-icon.js';
+import { InfoIconTooltip } from '../../../info-icon-tooltip/info-icon-tooltip.js';
+import { ProgressCircle } from '../../../loading/progress-circle.js';
+import { FieldError } from '../../elements/field-error/field-error.js';
+import { Label } from '../../elements/label/label.js';
+import { FormFieldLayout } from '../../layout/form/form-field-layout.js';
 import styles from './select-field.module.css.js';
 
 function SelectField({ className, 'data-test-selector': dataTestSelector, defaultSelectedOption, info, isDisabled, isInvalid, isLoading, isRequired, label, name, onChange, options, placeholder, selectedOption, showLabel = true, showPlaceholder, size = 'lg', variant = 'outline', }) {

package/dist/forms/fields/select-field/select-field.module.css.js

@@ -0,0 +1,3 @@
+var styles = {"select-field":"select-field-module-T07fb","md":"select-field-module-x-dtL","solid":"select-field-module-jfk-G","loading":"select-field-module-NyDa0","button":"select-field-module-uGX30","value":"select-field-module-z-6Ym","icon":"select-field-module-Njvvb","popover":"select-field-module-tbhPg","listbox":"select-field-module-Rwf0R","header":"select-field-module-KDZmc","item":"select-field-module-u3hoe"};
+
+export { styles as default };

package/dist/forms/{switch-field → fields/switch-field}/switch-field.d.ts

@@ -1,5 +1,5 @@
-import { ValidateFunction } from '../field-error/field-error';
-import { SwitchProps, SwitchPropsBase } from '../switch/switch';
+import { ValidateFunction } from '../../elements/field-error/field-error';
+import { SwitchProps, SwitchPropsBase } from '../../elements/switch/switch';
 export interface SwitchFieldPropsBase extends SwitchPropsBase {
     errorMessage?: string;
     info?: string;

package/dist/forms/{switch-field → fields/switch-field}/switch-field.js

@@ -2,10 +2,10 @@
 import { jsx } from 'react/jsx-runtime';
 import { CheckboxGroup } from 'react-aria-components';
 import clsx from 'clsx';
-import { InfoIconTooltip } from '../../info-icon-tooltip/info-icon-tooltip.js';
-import { FieldError } from '../field-error/field-error.js';
-import { FormFieldLayout } from '../form/form-field-layout.js';
-import { Switch } from '../switch/switch.js';
+import { InfoIconTooltip } from '../../../info-icon-tooltip/info-icon-tooltip.js';
+import { FieldError } from '../../elements/field-error/field-error.js';
+import { Switch } from '../../elements/switch/switch.js';
+import { FormFieldLayout } from '../../layout/form/form-field-layout.js';
 import styles from './switch-field.module.css.js';
 
 function SwitchField(props) {

package/dist/forms/fields/switch-field/switch-field.module.css.js

@@ -0,0 +1,3 @@
+var styles = {"switch-field":"switch-field-module-sVrKL"};
+
+export { styles as default };

package/dist/forms/{text-field → fields/text-field}/password-reveal-toggle/password-reveal-toggle.js

@@ -1,9 +1,9 @@
 "use client";
 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 { 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';
 
 /**

package/dist/forms/{text-field → fields/text-field}/password-reveal-toggle/password-reveal-toggle.module.css.js

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

package/dist/forms/{text-field → fields/text-field}/text-field.d.ts

@@ -1,5 +1,5 @@
 import { FocusEvent, FormEventHandler } from 'react';
-import { ValidateFunction } from '../field-error/field-error';
+import { ValidateFunction } from '../../elements/field-error/field-error';
 interface TextFieldPropsBase {
     autoComplete?: string;
     autoFocus?: boolean;

package/dist/forms/{text-field → fields/text-field}/text-field.js

@@ -2,12 +2,12 @@
 import { jsx } from 'react/jsx-runtime';
 import { TextField as TextField$1 } from 'react-aria-components';
 import clsx from 'clsx';
-import { InfoIconTooltip } from '../../info-icon-tooltip/info-icon-tooltip.js';
-import { FieldError } from '../field-error/field-error.js';
-import { FormFieldLayout } from '../form/form-field-layout.js';
-import { Input } from '../input/input.js';
-import { Label } from '../label/label.js';
-import { TextArea } from '../textarea/textarea.js';
+import { InfoIconTooltip } from '../../../info-icon-tooltip/info-icon-tooltip.js';
+import { FieldError } from '../../elements/field-error/field-error.js';
+import { Input } from '../../elements/input/input.js';
+import { Label } from '../../elements/label/label.js';
+import { TextArea } from '../../elements/textarea/textarea.js';
+import { FormFieldLayout } from '../../layout/form/form-field-layout.js';
 import styles from './text-field.module.css.js';
 
 function SingleLineInput({ autoGrow, 'data-test-selector': dataTestSelector, inlineElement, inputMode, label, onBlur, pattern, placeholder, role, size, type = 'text', value, variant, }) {

package/dist/forms/fields/text-field/text-field.module.css.js

@@ -0,0 +1,3 @@
+var styles = {"text-field":"text-field-module-TYL3X"};
+
+export { styles as default };

package/dist/forms/layout/form/form-field-layout.module.css.js

@@ -0,0 +1,3 @@
+var styles = {"form-field-layout":"form-field-layout-module-6lieX","label":"form-field-layout-module-3CQx4","input":"form-field-layout-module-0CMW-","info":"form-field-layout-module-RCuwU","error":"form-field-layout-module-VHcQ-"};
+
+export { styles as default };

package/dist/forms/layout/form/form-segment-group.module.css.js

@@ -0,0 +1,3 @@
+var styles = {"form-segment-group":"form-segment-group-module-810IM"};
+
+export { styles as default };

package/dist/forms/layout/form/form-segment.module.css.js

@@ -0,0 +1,3 @@
+var styles = {"form-segment":"form-segment-module-GbJZZ","floating":"form-segment-module-60hj6"};
+
+export { styles as default };

package/dist/forms/{form → layout/form}/form.js

@@ -3,8 +3,8 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import { useEffect } from 'react';
 import { Form as Form$1 } from 'react-aria-components';
 import clsx from 'clsx';
-import { Message } from '../../message/message.js';
-import { scrollToTop } from '../../shared/hooks/use-scroll-to.js';
+import { Message } from '../../../message/message.js';
+import { scrollToTop } from '../../../shared/hooks/use-scroll-to.js';
 import styles from './form.module.css.js';
 
 function Form({ autoComplete = false, children, className, errorMessage, footer, header, onSubmit, title, validationErrors, }) {
@@ -22,7 +22,7 @@ function Form({ autoComplete = false, children, className, errorMessage, footer,
             scrollToTop();
         }
     }, [errorMessage]);
-    return (jsxs(Form$1, { "aria-label": title, autoComplete: autoComplete ? 'on' : 'off', className: clsx(styles['form'], className), onSubmit: handleSubmit, validationBehavior: "native", validationErrors: validationErrors, children: [jsx("header", { className: styles['form-header'], children: header }), errorMessage && (jsx("section", { className: styles['error-messages'], children: jsx(Message, { type: "danger", children: errorMessage }) })), children, jsx("footer", { className: styles['form-footer'], children: footer })] }));
+    return (jsxs(Form$1, { "aria-label": title, autoComplete: autoComplete ? 'on' : 'off', className: clsx(styles['form'], className), onSubmit: handleSubmit, validationBehavior: "native", validationErrors: validationErrors, children: [header && jsx("header", { className: styles['form-header'], children: header }), errorMessage && (jsx("section", { className: styles['error-messages'], children: jsx(Message, { type: "danger", children: errorMessage }) })), children, jsx("footer", { className: styles['form-footer'], children: footer })] }));
 }
 
 export { Form };

package/dist/forms/layout/form/form.module.css.js

@@ -0,0 +1,3 @@
+var styles = {"form":"form-module-j-sK-","error-messages":"form-module-FJZtR","form-header":"form-module-KjHjn","form-footer":"form-module-2IhUq"};
+
+export { styles as default };

package/dist/forms/partials/edit-address-form/edit-address-form.d.ts

@@ -0,0 +1,8 @@
+import { Address } from '../../../shared/model/address';
+import { Country } from '../../../shared/model/countries-languages';
+export interface EditAddressFormProps {
+    address: Address | null | undefined;
+    countries: Country[];
+    isLoading: boolean;
+}
+export declare function EditAddressForm({ address, countries, isLoading, }: EditAddressFormProps): import("react/jsx-runtime").JSX.Element;

package/dist/forms/partials/edit-address-form/edit-address-form.js

@@ -0,0 +1,35 @@
+"use client";
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { useState } from 'react';
+import { CountrySelect } from '../../../country-select/country-select.js';
+import { TextField } from '../../fields/text-field/text-field.js';
+import { FormattedMessage } from '../../../intl/formatted-message.js';
+import { useFormattedMessage } from '../../../intl/use-formatted-message.js';
+import { Message } from '../../../message/message.js';
+import { validatePhone, validateEmail } from '../../../shared/model/address.js';
+import styles from './edit-address-form.module.css.js';
+
+function EditAddressForm({ address, countries, isLoading, }) {
+    const t = useFormattedMessage();
+    const [companyName, setCompanyName] = useState(address?.companyName || '');
+    const [lastName, setLastName] = useState(address?.lastName || '');
+    const currentCountry = countries.find(country => country.id === address?.country?.id);
+    const [selectedCountry, setSelectedCountry] = useState(currentCountry);
+    const currencyHasChanged = selectedCountry?.currencyCode !== currentCountry?.currencyCode;
+    if (countries.length === 0) {
+        return (jsx(Message, { type: "danger", children: jsx(FormattedMessage, { force: true, id: "No countries available. Unable to change address." }) }));
+    }
+    return (jsxs(Fragment, { children: [jsx(TextField, { defaultValue: address?.firstName, isDisabled: isLoading, label: t('First name'), name: "firstName", showLabel: true }), jsx(TextField, { isDisabled: isLoading, isRequired: !address?.companyName, label: t('Last name'), minLength: 3, name: "lastName", onChange: setLastName, showLabel: true, value: lastName }, `lastname-${Boolean(address?.companyName)}`), jsx(TextField, { defaultValue: address?.companyName, isDisabled: isLoading, label: t('Company name'), name: "companyName", onChange: setCompanyName, showLabel: true, value: companyName }), jsx(TextField, { defaultValue: address?.attention, isDisabled: isLoading, label: t('Attention'), name: "attention", showLabel: true }), jsx("div", { className: styles['span-2'], children: jsx(TextField, { isRequired: true, defaultValue: address?.address1, isDisabled: isLoading, label: `${t('Address')} 1`, maxLength: 30, minLength: 3, name: "address1", showLabel: true }) }), jsx("div", { className: styles['span-2'], children: jsx(TextField, { defaultValue: address?.address2, isDisabled: isLoading, label: `${t('Address')} 2`, maxLength: 30, minLength: 3, name: "address2", showLabel: true }) }), jsx("div", { className: styles['span-2'], children: jsx(TextField, { defaultValue: address?.address3, isDisabled: isLoading, label: `${t('Address')} 3`, maxLength: 30, minLength: 3, name: "address3", showLabel: true }) }), jsx(TextField, { isRequired: true, defaultValue: address?.postalCode, isDisabled: isLoading, label: t('Postal Code'), maxLength: 10, minLength: 4, name: "postalCode", showLabel: true }), jsx(TextField, { isRequired: true, defaultValue: address?.city, isDisabled: isLoading, label: t('City'), maxLength: 30, minLength: 3, name: "city", showLabel: true }), jsxs("div", { className: styles['span-2'], children: [jsx(CountrySelect, { isRequired: true, countries: countries, "data-test-selector": "countrySelect", isDisabled: isLoading, name: "countrySelect", onCountryChange: setSelectedCountry, selectedCountry: selectedCountry }), currencyHasChanged && (jsx(Message, { className: styles['currency-warning'], type: "warning", children: jsx(FormattedMessage, { id: "Selecting this country will result in your cart to be converted to the currency {0}", replacementValues: {
+                                '0': selectedCountry?.currencyCode || t('Unknown'),
+                            } }) }))] }), jsx("div", { className: styles['span-2'], children: jsx(TextField, { isRequired: true, defaultValue: address?.phone, isDisabled: isLoading, label: t('Phone'), name: "phone", showLabel: true, validate: value => {
+                        if (!value)
+                            return value;
+                        return (validatePhone(value) || t('Please enter a valid phone number'));
+                    } }) }), jsx("div", { className: styles['span-2'], children: jsx(TextField, { isRequired: true, defaultValue: address?.email || '', isDisabled: isLoading, label: t('Email'), name: "email", showLabel: true, type: "email", validate: value => {
+                        if (!value)
+                            return value;
+                        return (validateEmail(value) || t('Please enter a valid email address'));
+                    } }) })] }));
+}
+
+export { EditAddressForm };

package/dist/forms/partials/edit-address-form/edit-address-form.module.css.js

@@ -0,0 +1,3 @@
+var styles = {"span-2":"edit-address-form-module-HF64G","currency-warning":"edit-address-form-module-V-LOB"};
+
+export { styles as default };

package/dist/forms/{password-validation → partials/password-validation}/password-validation.js

@@ -1,9 +1,9 @@
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { useState, useCallback, useEffect } from 'react';
-import { useFormattedMessage } from '../../intl/use-formatted-message.js';
-import { validatePassword } from '../../shared/model/account.js';
-import { FormSegment } from '../form/form-segment.js';
-import { PasswordField } from '../password-field/password-field.js';
+import { useFormattedMessage } from '../../../intl/use-formatted-message.js';
+import { validatePassword } from '../../../shared/model/account.js';
+import { PasswordField } from '../../fields/password-field/password-field.js';
+import { FormSegment } from '../../layout/form/form-segment.js';
 
 function PasswordValidation({ isDisabled = false, onPasswordChanged, }) {
     const t = useFormattedMessage();