@sonic-equipment/ui 184.0.0 → 186.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (196) hide show
  1. package/dist/address-info-display/address-info-display.d.ts +2 -2
  2. package/dist/address-info-display/address-info-display.js +1 -1
  3. package/dist/algolia/algolia-multi-select-filter-section.js +1 -1
  4. package/dist/algolia/algolia-sort-by.js +1 -1
  5. package/dist/buttons/add-to-cart-button/add-to-cart-button.js +1 -1
  6. package/dist/cards/data-card/data-card.js +37 -20
  7. package/dist/cards/data-card/data-card.module.css.js +1 -1
  8. package/dist/country-select/country-select.js +1 -1
  9. package/dist/country-select/hooks/use-countries.js +1 -0
  10. package/dist/country-selector/country-selector-dialog/country-selector-dialog.js +2 -6
  11. package/dist/exports.d.ts +43 -23
  12. package/dist/filters/pagination/pagination.js +1 -1
  13. package/dist/forms/elements/checkbox/checkbox.module.css.js +3 -0
  14. package/dist/forms/{field-error → elements/field-error}/field-error.js +1 -1
  15. package/dist/forms/elements/field-error/field-error.module.css.js +3 -0
  16. package/dist/forms/elements/input/input.module.css.js +3 -0
  17. package/dist/forms/elements/label/label.module.css.js +3 -0
  18. package/dist/forms/{select → elements/select}/select.d.ts +2 -1
  19. package/dist/forms/{select → elements/select}/select.js +5 -5
  20. package/dist/forms/elements/select/select.module.css.js +3 -0
  21. package/dist/forms/elements/switch/switch.module.css.js +3 -0
  22. package/dist/forms/elements/textarea/textarea.module.css.js +3 -0
  23. package/dist/forms/{checkbox-field → fields/checkbox-field}/checkbox-field.d.ts +2 -2
  24. package/dist/forms/{checkbox-field → fields/checkbox-field}/checkbox-field.js +4 -4
  25. package/dist/forms/fields/checkbox-field/checkbox-field.module.css.js +3 -0
  26. package/dist/forms/{number-field → fields/number-field}/number-field.d.ts +1 -1
  27. package/dist/forms/{number-field → fields/number-field}/number-field.js +8 -8
  28. package/dist/forms/fields/number-field/number-field.module.css.js +3 -0
  29. package/dist/forms/{search-field → fields/search-field}/search-field.js +3 -3
  30. package/dist/forms/{select-field → fields/select-field}/select-field.d.ts +1 -1
  31. package/dist/forms/{select-field → fields/select-field}/select-field.js +7 -7
  32. package/dist/forms/fields/select-field/select-field.module.css.js +3 -0
  33. package/dist/forms/{switch-field → fields/switch-field}/switch-field.d.ts +2 -2
  34. package/dist/forms/{switch-field → fields/switch-field}/switch-field.js +4 -4
  35. package/dist/forms/fields/switch-field/switch-field.module.css.js +3 -0
  36. package/dist/forms/{text-field → fields/text-field}/password-reveal-toggle/password-reveal-toggle.js +3 -3
  37. package/dist/forms/{text-field → fields/text-field}/password-reveal-toggle/password-reveal-toggle.module.css.js +1 -1
  38. package/dist/forms/{text-field → fields/text-field}/text-field.d.ts +1 -1
  39. package/dist/forms/{text-field → fields/text-field}/text-field.js +6 -6
  40. package/dist/forms/fields/text-field/text-field.module.css.js +3 -0
  41. package/dist/forms/layout/form/form-field-layout.module.css.js +3 -0
  42. package/dist/forms/layout/form/form-segment-group.module.css.js +3 -0
  43. package/dist/forms/layout/form/form-segment.module.css.js +3 -0
  44. package/dist/forms/layout/form/form.d.ts +20 -0
  45. package/dist/forms/{form → layout/form}/form.js +4 -4
  46. package/dist/forms/layout/form/form.module.css.js +3 -0
  47. package/dist/forms/partials/edit-address-form/edit-address-form.d.ts +8 -0
  48. package/dist/forms/partials/edit-address-form/edit-address-form.js +35 -0
  49. package/dist/forms/partials/edit-address-form/edit-address-form.module.css.js +3 -0
  50. package/dist/forms/partials/password-validation/password-validation.d.ts +4 -0
  51. package/dist/forms/partials/password-validation/password-validation.js +32 -0
  52. package/dist/index.js +44 -24
  53. package/dist/intl/formatted-message.js +5 -1
  54. package/dist/intl/translation-id.d.ts +1 -1
  55. package/dist/intl/types.d.ts +6 -1
  56. package/dist/intl/use-formatted-message.js +2 -1
  57. package/dist/lists/menu-list/menu-list.d.ts +2 -1
  58. package/dist/lists/menu-list/menu-list.js +2 -2
  59. package/dist/lists/widget-grid/widget-grid.d.ts +5 -0
  60. package/dist/lists/widget-grid/widget-grid.js +9 -0
  61. package/dist/lists/widget-grid/widget-grid.module.css.js +3 -0
  62. package/dist/lists/widget-grid/widget.d.ts +6 -0
  63. package/dist/lists/widget-grid/widget.js +10 -0
  64. package/dist/modals/dialog/dialog.d.ts +5 -5
  65. package/dist/modals/dialog/dialog.js +18 -18
  66. package/dist/modals/dialog/dialog.module.css.js +1 -1
  67. package/dist/modals/favorite/add-to-favorite-dialog.js +2 -2
  68. package/dist/modals/recover-password/recover-password-dialog.js +2 -4
  69. package/dist/pages/account/components/create-account-form/create-account-form.js +8 -23
  70. package/dist/pages/account/components/sign-in-form/sign-in-form.js +6 -6
  71. package/dist/pages/account/create-account-page/create-account-page.js +4 -5
  72. package/dist/pages/account/layouts/sign-in-page-layout/sign-in-page-layout.js +1 -1
  73. package/dist/pages/account/sign-in-page/sign-in-page.js +2 -3
  74. package/dist/pages/checkout/components/billing-and-invoice-information.d.ts +3 -3
  75. package/dist/pages/checkout/components/billing-and-invoice-information.js +1 -1
  76. package/dist/pages/checkout/order-confirmation-page/order-confirmation-page-content.js +26 -20
  77. package/dist/pages/checkout/payment-page/components/payment.js +29 -23
  78. package/dist/pages/checkout/shipping-page/components/{edit-address-form.d.ts → edit-checkout-bill-to-address-form.d.ts} +3 -17
  79. package/dist/pages/checkout/shipping-page/components/edit-checkout-bill-to-address-form.js +49 -0
  80. package/dist/pages/checkout/shipping-page/components/edit-checkout-bill-to-address-form.module.css.js +3 -0
  81. package/dist/pages/checkout/shipping-page/components/readonly-address.js +7 -5
  82. package/dist/pages/checkout/shipping-page/hooks/use-patch-shipping-details.d.ts +1 -0
  83. package/dist/pages/checkout/shipping-page/shipping-page-content.js +2 -2
  84. package/dist/pages/checkout/shipping-page/shipping-page.js +2 -2
  85. package/dist/pages/components/page-container/page-container.js +1 -1
  86. package/dist/pages/my-sonic/actions/change-customer/change-customer-dialog.d.ts +4 -3
  87. package/dist/pages/my-sonic/actions/change-customer/change-customer-dialog.js +10 -4
  88. package/dist/pages/my-sonic/actions/change-customer/change-customer.d.ts +5 -2
  89. package/dist/pages/my-sonic/actions/change-customer/change-customer.js +17 -8
  90. package/dist/pages/my-sonic/actions/change-customer/change-customer.module.css.js +1 -1
  91. package/dist/pages/my-sonic/actions/change-customer/connected-change-customer-dialog.d.ts +7 -2
  92. package/dist/pages/my-sonic/actions/change-customer/connected-change-customer-dialog.js +9 -6
  93. package/dist/pages/my-sonic/actions/change-password/change-password-dialog.d.ts +10 -0
  94. package/dist/pages/my-sonic/actions/change-password/change-password-dialog.js +24 -0
  95. package/dist/pages/my-sonic/actions/change-password/change-password.d.ts +7 -0
  96. package/dist/pages/my-sonic/actions/change-password/change-password.js +35 -0
  97. package/dist/pages/my-sonic/actions/change-password/change-password.module.css.js +3 -0
  98. package/dist/pages/my-sonic/actions/change-password/connected-change-password-dialog.d.ts +5 -0
  99. package/dist/pages/my-sonic/actions/change-password/connected-change-password-dialog.js +39 -0
  100. package/dist/pages/my-sonic/actions/edit-bill-to-address/edit-bill-to-address.d.ts +1 -0
  101. package/dist/pages/my-sonic/actions/edit-bill-to-address/edit-bill-to-address.js +8 -0
  102. package/dist/pages/my-sonic/actions/edit-user-info/connected-edit-user-info-dialog.d.ts +5 -0
  103. package/dist/pages/my-sonic/actions/edit-user-info/connected-edit-user-info-dialog.js +56 -0
  104. package/dist/pages/my-sonic/actions/edit-user-info/edit-user-info-dialog.d.ts +10 -0
  105. package/dist/pages/my-sonic/actions/edit-user-info/edit-user-info-dialog.js +15 -0
  106. package/dist/pages/my-sonic/actions/edit-user-info/edit-user-info.d.ts +11 -0
  107. package/dist/pages/my-sonic/actions/edit-user-info/edit-user-info.js +29 -0
  108. package/dist/pages/my-sonic/actions/edit-user-info/edit-user-info.module.css.js +3 -0
  109. package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-aside.d.ts +4 -0
  110. package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-aside.js +9 -0
  111. package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-main.d.ts +4 -0
  112. package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-main.js +9 -0
  113. package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-page.d.ts +5 -0
  114. package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-page.js +10 -0
  115. package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-pre-aside.d.ts +4 -0
  116. package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-pre-aside.js +9 -0
  117. package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-title.d.ts +4 -0
  118. package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-title.js +10 -0
  119. package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout.d.ts +5 -0
  120. package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout.js +10 -0
  121. package/dist/pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout.module.css.js +3 -0
  122. package/dist/pages/my-sonic/navigation/connected-my-sonic-navigation.js +3 -4
  123. package/dist/pages/my-sonic/navigation/connected-my-sonic-navigation.module.css.js +3 -0
  124. package/dist/pages/my-sonic/navigation/my-sonic-desktop-navigation.d.ts +2 -1
  125. package/dist/pages/my-sonic/navigation/my-sonic-desktop-navigation.js +2 -2
  126. package/dist/pages/my-sonic/navigation/my-sonic-mobile-navigation.d.ts +2 -1
  127. package/dist/pages/my-sonic/navigation/my-sonic-mobile-navigation.js +3 -3
  128. package/dist/pages/my-sonic/widgets/connected-customer-information-widget.js +3 -3
  129. package/dist/pages/my-sonic/widgets/connected-user-account-widget.js +16 -5
  130. package/dist/shared/api/shared/hooks/use-awaitable-mutation.d.ts +1 -0
  131. package/dist/shared/api/shared/hooks/use-awaitable-mutation.js +6 -0
  132. package/dist/shared/api/storefront/hooks/{authentication → account}/use-create-account.d.ts +1 -1
  133. package/dist/shared/api/storefront/hooks/{authentication → account}/use-create-account.js +3 -1
  134. package/dist/shared/api/storefront/hooks/{authentication → account}/use-create-guest-account.js +3 -1
  135. package/dist/shared/api/storefront/hooks/account/use-fetch-current-account.d.ts +3 -0
  136. package/dist/shared/api/storefront/hooks/account/use-fetch-current-account.js +13 -0
  137. package/dist/shared/api/storefront/hooks/account/use-patch-current-account.d.ts +11 -0
  138. package/dist/shared/api/storefront/hooks/account/use-patch-current-account.js +20 -0
  139. package/dist/shared/api/storefront/hooks/authentication/use-patch-session.d.ts +1 -0
  140. package/dist/shared/api/storefront/hooks/authentication/use-patch-session.js +1 -1
  141. package/dist/shared/api/storefront/hooks/cart/use-patch-cart.d.ts +1 -0
  142. package/dist/shared/api/storefront/hooks/cart/use-place-order.d.ts +1 -0
  143. package/dist/shared/api/storefront/hooks/customer/use-patch-bill-to-address.d.ts +1 -0
  144. package/dist/shared/api/storefront/services/account-service.d.ts +31 -0
  145. package/dist/shared/api/storefront/services/account-service.js +84 -0
  146. package/dist/shared/api/storefront/services/authentication-service.d.ts +7 -26
  147. package/dist/shared/api/storefront/services/authentication-service.js +38 -65
  148. package/dist/shared/data/countries-languages.data.js +4 -0
  149. package/dist/shared/model/address.d.ts +27 -12
  150. package/dist/shared/model/countries-languages.d.ts +1 -0
  151. package/dist/shared/utils/price.d.ts +1 -1
  152. package/dist/styles.css +751 -627
  153. package/package.json +1 -1
  154. package/dist/forms/checkbox/checkbox.module.css.js +0 -3
  155. package/dist/forms/checkbox-field/checkbox-field.module.css.js +0 -3
  156. package/dist/forms/field-error/field-error.module.css.js +0 -3
  157. package/dist/forms/form/form-field-layout.module.css.js +0 -3
  158. package/dist/forms/form/form-segment-group.module.css.js +0 -3
  159. package/dist/forms/form/form-segment.module.css.js +0 -3
  160. package/dist/forms/form/form.d.ts +0 -16
  161. package/dist/forms/form/form.module.css.js +0 -3
  162. package/dist/forms/input/input.module.css.js +0 -3
  163. package/dist/forms/label/label.module.css.js +0 -3
  164. package/dist/forms/number-field/number-field.module.css.js +0 -3
  165. package/dist/forms/select/select.module.css.js +0 -3
  166. package/dist/forms/select-field/select-field.module.css.js +0 -3
  167. package/dist/forms/switch/switch.module.css.js +0 -3
  168. package/dist/forms/switch-field/switch-field.module.css.js +0 -3
  169. package/dist/forms/text-field/text-field.module.css.js +0 -3
  170. package/dist/forms/textarea/textarea.module.css.js +0 -3
  171. package/dist/pages/checkout/shipping-page/components/edit-address-form.js +0 -68
  172. package/dist/pages/checkout/shipping-page/components/edit-address-form.module.css.js +0 -3
  173. /package/dist/forms/{checkbox → elements/checkbox}/checkbox.d.ts +0 -0
  174. /package/dist/forms/{checkbox → elements/checkbox}/checkbox.js +0 -0
  175. /package/dist/forms/{color-checkbox → elements/color-checkbox}/color-checkbox.d.ts +0 -0
  176. /package/dist/forms/{color-checkbox → elements/color-checkbox}/color-checkbox.js +0 -0
  177. /package/dist/forms/{field-error → elements/field-error}/field-error.d.ts +0 -0
  178. /package/dist/forms/{input → elements/input}/input.d.ts +0 -0
  179. /package/dist/forms/{input → elements/input}/input.js +0 -0
  180. /package/dist/forms/{label → elements/label}/label.d.ts +0 -0
  181. /package/dist/forms/{label → elements/label}/label.js +0 -0
  182. /package/dist/forms/{switch → elements/switch}/switch.d.ts +0 -0
  183. /package/dist/forms/{switch → elements/switch}/switch.js +0 -0
  184. /package/dist/forms/{textarea → elements/textarea}/textarea.d.ts +0 -0
  185. /package/dist/forms/{textarea → elements/textarea}/textarea.js +0 -0
  186. /package/dist/forms/{password-field → fields/password-field}/password-field.d.ts +0 -0
  187. /package/dist/forms/{password-field → fields/password-field}/password-field.js +0 -0
  188. /package/dist/forms/{search-field → fields/search-field}/search-field.d.ts +0 -0
  189. /package/dist/forms/{text-field → fields/text-field}/password-reveal-toggle/password-reveal-toggle.d.ts +0 -0
  190. /package/dist/forms/{form → layout/form}/form-field-layout.d.ts +0 -0
  191. /package/dist/forms/{form → layout/form}/form-field-layout.js +0 -0
  192. /package/dist/forms/{form → layout/form}/form-segment-group.d.ts +0 -0
  193. /package/dist/forms/{form → layout/form}/form-segment-group.js +0 -0
  194. /package/dist/forms/{form → layout/form}/form-segment.d.ts +0 -0
  195. /package/dist/forms/{form → layout/form}/form-segment.js +0 -0
  196. /package/dist/shared/api/storefront/hooks/{authentication → account}/use-create-guest-account.d.ts +0 -0
@@ -1,5 +1,5 @@
1
1
  import { FocusEvent, FormEventHandler } from 'react';
2
- import { ValidateFunction } from '../field-error/field-error';
2
+ import { ValidateFunction } from '../../elements/field-error/field-error';
3
3
  interface TextFieldPropsBase {
4
4
  autoComplete?: string;
5
5
  autoFocus?: boolean;
@@ -2,12 +2,12 @@
2
2
  import { jsx } from 'react/jsx-runtime';
3
3
  import { TextField as TextField$1 } from 'react-aria-components';
4
4
  import clsx from 'clsx';
5
- import { InfoIconTooltip } from '../../info-icon-tooltip/info-icon-tooltip.js';
6
- import { FieldError } from '../field-error/field-error.js';
7
- import { FormFieldLayout } from '../form/form-field-layout.js';
8
- import { Input } from '../input/input.js';
9
- import { Label } from '../label/label.js';
10
- import { TextArea } from '../textarea/textarea.js';
5
+ import { InfoIconTooltip } from '../../../info-icon-tooltip/info-icon-tooltip.js';
6
+ import { FieldError } from '../../elements/field-error/field-error.js';
7
+ import { Input } from '../../elements/input/input.js';
8
+ import { Label } from '../../elements/label/label.js';
9
+ import { TextArea } from '../../elements/textarea/textarea.js';
10
+ import { FormFieldLayout } from '../../layout/form/form-field-layout.js';
11
11
  import styles from './text-field.module.css.js';
12
12
 
13
13
  function SingleLineInput({ autoGrow, 'data-test-selector': dataTestSelector, inlineElement, inputMode, label, onBlur, pattern, placeholder, role, size, type = 'text', value, variant, }) {
@@ -0,0 +1,3 @@
1
+ var styles = {"text-field":"text-field-module-TYL3X"};
2
+
3
+ export { styles as default };
@@ -0,0 +1,3 @@
1
+ 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-"};
2
+
3
+ export { styles as default };
@@ -0,0 +1,3 @@
1
+ var styles = {"form-segment-group":"form-segment-group-module-810IM"};
2
+
3
+ export { styles as default };
@@ -0,0 +1,3 @@
1
+ var styles = {"form-segment":"form-segment-module-GbJZZ","floating":"form-segment-module-60hj6"};
2
+
3
+ export { styles as default };
@@ -0,0 +1,20 @@
1
+ import { ReactNode } from 'react';
2
+ import { FormProps as AriaFormProps } from 'react-aria-components';
3
+ export interface OnSubmitEventArgs {
4
+ formData: FormData;
5
+ submitter?: HTMLButtonElement;
6
+ }
7
+ export type OnSubmitHandler = (e: OnSubmitEventArgs) => void;
8
+ export type ValidationErrors = AriaFormProps['validationErrors'];
9
+ export interface FormProps {
10
+ autoComplete?: boolean;
11
+ children: ReactNode;
12
+ className?: string;
13
+ errorMessage?: string;
14
+ footer?: ReactNode;
15
+ header?: ReactNode;
16
+ onSubmit?: OnSubmitHandler;
17
+ title?: string;
18
+ validationErrors?: ValidationErrors;
19
+ }
20
+ export declare function Form({ autoComplete, children, className, errorMessage, footer, header, onSubmit, title, validationErrors, }: FormProps): import("react/jsx-runtime").JSX.Element;
@@ -3,11 +3,11 @@ import { jsxs, jsx } from 'react/jsx-runtime';
3
3
  import { useEffect } from 'react';
4
4
  import { Form as Form$1 } from 'react-aria-components';
5
5
  import clsx from 'clsx';
6
- import { Message } from '../../message/message.js';
7
- import { scrollToTop } from '../../shared/hooks/use-scroll-to.js';
6
+ import { Message } from '../../../message/message.js';
7
+ import { scrollToTop } from '../../../shared/hooks/use-scroll-to.js';
8
8
  import styles from './form.module.css.js';
9
9
 
10
- function Form({ autoComplete = false, children, className, errorMessage, footer, header, onSubmit, title, }) {
10
+ function Form({ autoComplete = false, children, className, errorMessage, footer, header, onSubmit, title, validationErrors, }) {
11
11
  const handleSubmit = (event) => {
12
12
  if (onSubmit) {
13
13
  event.preventDefault();
@@ -22,7 +22,7 @@ function Form({ autoComplete = false, children, className, errorMessage, footer,
22
22
  scrollToTop();
23
23
  }
24
24
  }, [errorMessage]);
25
- return (jsxs(Form$1, { "aria-label": title, autoComplete: autoComplete ? 'on' : 'off', className: clsx(styles['form'], className), onSubmit: handleSubmit, validationBehavior: "native", 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 })] }));
25
+ 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 })] }));
26
26
  }
27
27
 
28
28
  export { Form };
@@ -0,0 +1,3 @@
1
+ var styles = {"form":"form-module-j-sK-","error-messages":"form-module-FJZtR","form-header":"form-module-KjHjn","form-footer":"form-module-2IhUq"};
2
+
3
+ export { styles as default };
@@ -0,0 +1,8 @@
1
+ import { Address } from '../../../shared/model/address';
2
+ import { Country } from '../../../shared/model/countries-languages';
3
+ export interface EditAddressFormProps {
4
+ address: Address | null | undefined;
5
+ countries: Country[];
6
+ isLoading: boolean;
7
+ }
8
+ export declare function EditAddressForm({ address, countries, isLoading, }: EditAddressFormProps): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,35 @@
1
+ "use client";
2
+ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
3
+ import { useState } from 'react';
4
+ import { CountrySelect } from '../../../country-select/country-select.js';
5
+ import { TextField } from '../../fields/text-field/text-field.js';
6
+ import { FormattedMessage } from '../../../intl/formatted-message.js';
7
+ import { useFormattedMessage } from '../../../intl/use-formatted-message.js';
8
+ import { Message } from '../../../message/message.js';
9
+ import { validatePhone, validateEmail } from '../../../shared/model/address.js';
10
+ import styles from './edit-address-form.module.css.js';
11
+
12
+ function EditAddressForm({ address, countries, isLoading, }) {
13
+ const t = useFormattedMessage();
14
+ const [companyName, setCompanyName] = useState(address?.companyName || '');
15
+ const [lastName, setLastName] = useState(address?.lastName || '');
16
+ const currentCountry = countries.find(country => country.id === address?.country?.id);
17
+ const [selectedCountry, setSelectedCountry] = useState(currentCountry);
18
+ const currencyHasChanged = selectedCountry?.currencyCode !== currentCountry?.currencyCode;
19
+ if (countries.length === 0) {
20
+ return (jsx(Message, { type: "danger", children: jsx(FormattedMessage, { force: true, id: "No countries available. Unable to change address." }) }));
21
+ }
22
+ 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: {
23
+ '0': selectedCountry?.currencyCode || t('Unknown'),
24
+ } }) }))] }), 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 => {
25
+ if (!value)
26
+ return value;
27
+ return (validatePhone(value) || t('Please enter a valid phone number'));
28
+ } }) }), 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 => {
29
+ if (!value)
30
+ return value;
31
+ return (validateEmail(value) || t('Please enter a valid email address'));
32
+ } }) })] }));
33
+ }
34
+
35
+ export { EditAddressForm };
@@ -0,0 +1,3 @@
1
+ var styles = {"span-2":"edit-address-form-module-HF64G","currency-warning":"edit-address-form-module-V-LOB"};
2
+
3
+ export { styles as default };
@@ -0,0 +1,4 @@
1
+ export declare function PasswordValidation({ isDisabled, onPasswordChanged, }: {
2
+ isDisabled?: boolean;
3
+ onPasswordChanged?: (password: string | undefined) => void;
4
+ }): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,32 @@
1
+ import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
2
+ import { useState, useCallback, useEffect } from 'react';
3
+ import { useFormattedMessage } from '../../../intl/use-formatted-message.js';
4
+ import { validatePassword } from '../../../shared/model/account.js';
5
+ import { PasswordField } from '../../fields/password-field/password-field.js';
6
+ import { FormSegment } from '../../layout/form/form-segment.js';
7
+
8
+ function PasswordValidation({ isDisabled = false, onPasswordChanged, }) {
9
+ const t = useFormattedMessage();
10
+ const [password, setPassword] = useState('');
11
+ const [passwordConfirm, setPasswordConfirm] = useState('');
12
+ const isMatchingPasswords = useCallback(() => {
13
+ if (!password || !passwordConfirm)
14
+ return undefined;
15
+ return password === passwordConfirm;
16
+ }, [password, passwordConfirm]);
17
+ useEffect(() => {
18
+ if (!isMatchingPasswords())
19
+ return onPasswordChanged?.(password);
20
+ onPasswordChanged?.(password);
21
+ }, [isMatchingPasswords, onPasswordChanged, password, passwordConfirm]);
22
+ return (jsxs(Fragment, { children: [jsx(FormSegment, { children: jsx(PasswordField, { autoComplete: "new-password", "data-test-selector": "new_password", info: "Password must be at least 8 characters long, include at least one number, at least one lowercase character, at least one uppercase character and at least one non-alphanumeric character.", isDisabled: isDisabled, isRequired: true, label: t('New password'), name: "new-password", onChange: setPassword, validate: value => {
23
+ if (!value)
24
+ return;
25
+ return (validatePassword(value) ||
26
+ t('Password does not meet requirements'));
27
+ } }) }), jsx(FormSegment, { children: jsx(PasswordField, { autoComplete: "new-password", customErrorMessage: isMatchingPasswords() === false
28
+ ? 'Passwords do not match'
29
+ : undefined, "data-test-selector": "new_passwordConfirm", isDisabled: isDisabled, isInvalid: isMatchingPasswords() === false ? true : undefined, isRequired: true, label: t('Confirm password'), onChange: setPasswordConfirm, value: passwordConfirm }) })] }));
30
+ }
31
+
32
+ export { PasswordValidation };
package/dist/index.js CHANGED
@@ -93,26 +93,28 @@ export { MultiSelect } from './filters/multi-select/multi-select.js';
93
93
  export { Pagination } from './filters/pagination/pagination.js';
94
94
  export { ConnectedFooter } from './footer/connected-footer.js';
95
95
  export { Footer } from './footer/footer.js';
96
- export { CheckboxField } from './forms/checkbox-field/checkbox-field.js';
97
- export { Checkbox } from './forms/checkbox/checkbox.js';
98
- export { ColorCheckbox } from './forms/color-checkbox/color-checkbox.js';
99
- export { FieldError } from './forms/field-error/field-error.js';
100
- export { Form } from './forms/form/form.js';
101
- export { FormFieldLayout } from './forms/form/form-field-layout.js';
102
- export { FormSegment } from './forms/form/form-segment.js';
103
- export { FormSegmentGroup } from './forms/form/form-segment-group.js';
104
- export { Input } from './forms/input/input.js';
105
- export { Label } from './forms/label/label.js';
106
- export { NumberField } from './forms/number-field/number-field.js';
107
- export { PasswordField } from './forms/password-field/password-field.js';
108
- export { SearchField } from './forms/search-field/search-field.js';
109
- export { SelectField } from './forms/select-field/select-field.js';
110
- export { Select } from './forms/select/select.js';
111
- export { SwitchField } from './forms/switch-field/switch-field.js';
112
- export { Switch } from './forms/switch/switch.js';
113
- export { PasswordRevealToggle } from './forms/text-field/password-reveal-toggle/password-reveal-toggle.js';
114
- export { TextField } from './forms/text-field/text-field.js';
115
- export { TextArea } from './forms/textarea/textarea.js';
96
+ export { Checkbox } from './forms/elements/checkbox/checkbox.js';
97
+ export { ColorCheckbox } from './forms/elements/color-checkbox/color-checkbox.js';
98
+ export { FieldError } from './forms/elements/field-error/field-error.js';
99
+ export { Input } from './forms/elements/input/input.js';
100
+ export { Label } from './forms/elements/label/label.js';
101
+ export { Select } from './forms/elements/select/select.js';
102
+ export { Switch } from './forms/elements/switch/switch.js';
103
+ export { TextArea } from './forms/elements/textarea/textarea.js';
104
+ export { CheckboxField } from './forms/fields/checkbox-field/checkbox-field.js';
105
+ export { NumberField } from './forms/fields/number-field/number-field.js';
106
+ export { PasswordField } from './forms/fields/password-field/password-field.js';
107
+ export { SearchField } from './forms/fields/search-field/search-field.js';
108
+ export { SelectField } from './forms/fields/select-field/select-field.js';
109
+ export { SwitchField } from './forms/fields/switch-field/switch-field.js';
110
+ export { PasswordRevealToggle } from './forms/fields/text-field/password-reveal-toggle/password-reveal-toggle.js';
111
+ export { TextField } from './forms/fields/text-field/text-field.js';
112
+ export { Form } from './forms/layout/form/form.js';
113
+ export { FormFieldLayout } from './forms/layout/form/form-field-layout.js';
114
+ export { FormSegment } from './forms/layout/form/form-segment.js';
115
+ export { FormSegmentGroup } from './forms/layout/form/form-segment-group.js';
116
+ export { EditAddressForm } from './forms/partials/edit-address-form/edit-address-form.js';
117
+ export { PasswordValidation } from './forms/partials/password-validation/password-validation.js';
116
118
  export { CategoriesGrid } from './global-search/categories-grid/categories-grid.js';
117
119
  export { GlobalSearch, SearchRoot } from './global-search/global-search.js';
118
120
  export { GlobalSearchProvider } from './global-search/global-search-provider/global-search-provider.js';
@@ -172,6 +174,8 @@ export { MenuListHeader } from './lists/menu-list/menu-list-header.js';
172
174
  export { MenuListItem } from './lists/menu-list/menu-list-item.js';
173
175
  export { OrderLineList } from './lists/orderline-list/orderline-list.js';
174
176
  export { ProductOverviewGrid } from './lists/product-overview-grid/product-overview-grid.js';
177
+ export { Widget } from './lists/widget-grid/widget.js';
178
+ export { WidgetGrid } from './lists/widget-grid/widget-grid.js';
175
179
  export { BlankPageSpacer } from './loading/blank-page-spacer.js';
176
180
  export { LoadingOverlay } from './loading/loading-overlay.js';
177
181
  export { ProgressCircle } from './loading/progress-circle.js';
@@ -222,7 +226,7 @@ export { PaymentPage } from './pages/checkout/payment-page/payment-page.js';
222
226
  export { PaymentPageContent } from './pages/checkout/payment-page/payment-page-content.js';
223
227
  export { parseAmount } from './pages/checkout/payment-page/utils/parse-amount.js';
224
228
  export { CurrencyChangeDialog } from './pages/checkout/shipping-page/components/currency-change-dialog.js';
225
- export { EDIT_ADDRESS_FORM_ID, EditAddressesForm } from './pages/checkout/shipping-page/components/edit-address-form.js';
229
+ export { EDIT_ADDRESS_FORM_ID, EditCheckoutBillToAddressForm } from './pages/checkout/shipping-page/components/edit-checkout-bill-to-address-form.js';
226
230
  export { ReadOnlyAddresses } from './pages/checkout/shipping-page/components/readonly-address.js';
227
231
  export { SonicAddress } from './pages/checkout/shipping-page/components/sonic-address.js';
228
232
  export { usePatchShippingDetails } from './pages/checkout/shipping-page/hooks/use-patch-shipping-details.js';
@@ -236,6 +240,19 @@ export { LoadingPage } from './pages/loading-page/loading-page.js';
236
240
  export { ChangeCustomer } from './pages/my-sonic/actions/change-customer/change-customer.js';
237
241
  export { ChangeCustomerDialog } from './pages/my-sonic/actions/change-customer/change-customer-dialog.js';
238
242
  export { ConnectedChangeCustomerDialog } from './pages/my-sonic/actions/change-customer/connected-change-customer-dialog.js';
243
+ export { ChangePassword } from './pages/my-sonic/actions/change-password/change-password.js';
244
+ export { ChangePasswordDialog } from './pages/my-sonic/actions/change-password/change-password-dialog.js';
245
+ export { ConnectedChangePasswordDialog } from './pages/my-sonic/actions/change-password/connected-change-password-dialog.js';
246
+ export { EditBillToAddress } from './pages/my-sonic/actions/edit-bill-to-address/edit-bill-to-address.js';
247
+ export { ConnectedEditUserInfoDialog } from './pages/my-sonic/actions/edit-user-info/connected-edit-user-info-dialog.js';
248
+ export { EditUserInfo } from './pages/my-sonic/actions/edit-user-info/edit-user-info.js';
249
+ export { EditUserInfoDialog } from './pages/my-sonic/actions/edit-user-info/edit-user-info-dialog.js';
250
+ export { MySonicLayout } from './pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout.js';
251
+ export { MySonicLayoutAside } from './pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-aside.js';
252
+ export { MySonicLayoutMain } from './pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-main.js';
253
+ export { MySonicLayoutPage } from './pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-page.js';
254
+ export { MySonicLayoutPreAside } from './pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-pre-aside.js';
255
+ export { MySonicLayoutTitle } from './pages/my-sonic/layouts/my-sonic-layout/my-sonic-layout-title.js';
239
256
  export { ConnectedMySonicNavigation } from './pages/my-sonic/navigation/connected-my-sonic-navigation.js';
240
257
  export { MySonicDesktopNavigation } from './pages/my-sonic/navigation/my-sonic-desktop-navigation.js';
241
258
  export { MySonicMobileNavigation } from './pages/my-sonic/navigation/my-sonic-mobile-navigation.js';
@@ -273,8 +290,10 @@ export { useFetchProductListingPageData } from './shared/api/bff/hooks/use-fetch
273
290
  export { useFetchRecentlyViewedProducts } from './shared/api/bff/hooks/use-fetch-recently-viewed-products.js';
274
291
  export { fetchAnnouncements, fetchNavigationLinks, fetchProductDetailsPageData, fetchProductListingPageData, fetchRecentlyViewedProducts } from './shared/api/bff/services/bff-service.js';
275
292
  export { useAwaitableMutation } from './shared/api/shared/hooks/use-awaitable-mutation.js';
276
- export { useCreateAccount } from './shared/api/storefront/hooks/authentication/use-create-account.js';
277
- export { useCreateGuestAccount } from './shared/api/storefront/hooks/authentication/use-create-guest-account.js';
293
+ export { useCreateAccount } from './shared/api/storefront/hooks/account/use-create-account.js';
294
+ export { useCreateGuestAccount } from './shared/api/storefront/hooks/account/use-create-guest-account.js';
295
+ export { useFetchCurrentAccount } from './shared/api/storefront/hooks/account/use-fetch-current-account.js';
296
+ export { usePatchCurrentAccount } from './shared/api/storefront/hooks/account/use-patch-current-account.js';
278
297
  export { useFetchSession } from './shared/api/storefront/hooks/authentication/use-fetch-session.js';
279
298
  export { useInvalidateSession } from './shared/api/storefront/hooks/authentication/use-invalidate-session.js';
280
299
  export { useIsAuthenticated } from './shared/api/storefront/hooks/authentication/use-is-authenticated.js';
@@ -322,7 +341,8 @@ export { useCreateWishList } from './shared/api/storefront/hooks/wishlist/use-cr
322
341
  export { useDeleteWishListItemFromWishList } from './shared/api/storefront/hooks/wishlist/use-delete-wishlist-item-from-wishlist.js';
323
342
  export { useFetchAllWishListsItems } from './shared/api/storefront/hooks/wishlist/use-fetch-all-wishlists-items.js';
324
343
  export { useFetchWishLists } from './shared/api/storefront/hooks/wishlist/use-fetch-wishlists.js';
325
- export { ExistingAccountError, createAccount, createGuestAccount, createSession, fetchSession, patchSession, recoverPassword, signIn, signOut } from './shared/api/storefront/services/authentication-service.js';
344
+ export { ExistingAccountError, createAccount, createGuestAccount, fetchCurrentAccount, patchCurrentAccount } from './shared/api/storefront/services/account-service.js';
345
+ export { InvalidPasswordError, NonUniquePasswordError, createSession, fetchSession, patchSession, recoverPassword, signIn, signOut } from './shared/api/storefront/services/authentication-service.js';
326
346
  export { addProductToCurrentCart, convertToMinorUnits, deleteCartLineById, deleteCurrentCart, fetchCart, fetchCurrentCart, fetchCurrentCartLines, fetchCurrentCartProductAtp, fetchCurrentCartPromotions, fetchCurrentCheckoutAtp, getAdyenPaymentDetails, patchCart, patchCartLineById, placeOrder, postAdyenPayment, saveCartForLater } from './shared/api/storefront/services/cart-service.js';
327
347
  export { fetchBillToAddresses, fetchCurrentBillToAddress, fetchCurrentShipToAddress, fetchFulfillmentMethods, fetchShipToAddresses, patchBillToAddress } from './shared/api/storefront/services/customer-service.js';
328
348
  export { validateVATNumber } from './shared/api/storefront/services/finance-service.js';
@@ -1,6 +1,10 @@
1
1
  "use client";
2
2
  import { useFormattedMessage } from './use-formatted-message.js';
3
3
 
4
- const FormattedMessage = ({ fallbackValue, id, optional, replacementValues, }) => useFormattedMessage()(id, { fallbackValue, optional, replacementValues });
4
+ const FormattedMessage = ({ fallbackValue, id, optional, replacementValues, }) => useFormattedMessage()(id, {
5
+ fallbackValue,
6
+ optional,
7
+ replacementValues,
8
+ });
5
9
 
6
10
  export { FormattedMessage };
@@ -1 +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.' | 'Account' | 'Access denied.' | 'active' | 'Add order notes' | 'Add to list' | 'Address 1' | 'Address 2' | 'Address 3' | 'Address 4' | 'Address' | 'Amount: {0}' | 'An error occurred while changing the customer.' | 'An error occurred while fetching customers. Please try again later.' | 'An error occurred while processing your payment. Please try again.' | 'An unexpected error occured' | 'An unexpected error occured. Please try again.' | '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' | 'ascending' | 'Attention' | 'Availability unknown, please contact customer support for lead time or alternatives.' | 'Billing address' | 'Billing and shipping address' | 'Billing and shipping information' | 'Billing' | 'Cancel' | 'Cart' | 'Change customer' | 'Change password' | 'Changing your address is currently not possible. Please contact customer support to change your address.' | 'Checkout order' | 'Chosen filters' | 'City' | 'Clear filters' | 'Clear' | 'Click the button below to continue shopping.' | 'Client cases' | 'Close' | 'CoC number' | 'Company name' | 'Conceal value' | 'Confirm password' | 'Continue shopping' | 'Continue to sign in' | 'Continue' | 'Cost overview' | 'Country' | 'create account' | 'Create new list' | 'Currency Change' | 'Current page' | 'Delivery date' | 'Delivery expected on {0}' | 'descending' | 'Double check your spelling' | 'Downloads' | 'Easily add your favorite products' | 'Edit billing address' | 'Edit shipping address' | 'Edit' | 'Email' | 'Enter your email address and we will send you an email that will allow you to recover your password.' | 'Excl. VAT' | 'Explore by categories' | 'Exploring our products by category' | 'facet.categories' | 'facet.height' | 'facet.weight' | 'Favorites' | 'Features' | 'Finalize order' | 'Finalize payment' | 'First name' | 'Forgot password?' | 'Fulfillment method' | 'General' | 'Hide filters' | 'Home' | 'If an account matches the email address you entered, instructions on how to recover the password will be sent to that email address shortly. If you do not receive this email, please contact Customer Support.' | 'If you want to proceed, click the continue button. If you want to change your country, close this message and select a different country.' | 'Incl. VAT' | 'Includes' | 'Industry' | 'industry.AG' | 'industry.AU' | 'industry.AV' | 'industry.BC' | 'industry.MA' | 'industry.MC' | 'industry.OT' | 'industry.PP' | 'industry.TR' | 'Information' | 'Language' | 'Last name' | 'List name already exists' | 'Log out' | 'Main menu' | 'More than {0} articles' | 'My Sonic' | 'Name' | 'Navigate to...' | 'Navigation' | 'New list name' | 'New user?' | 'No results found. Please refine your search.' | 'Number of favorites' | 'Number of products' | 'of' | 'Or continue as guest' | 'Order confirmation' | 'Order date' | 'Order number' | 'Order' | 'Orders' | 'Our products' | 'Overview' | 'Password does not meet requirements' | 'Password' | 'Passwords do not match' | 'Pay by invoice' | 'Payment method' | 'Payment' | 'pc' | 'Phone' | 'Pick up' | 'Pickup address' | 'Please enter a valid email address' | 'Please enter a valid phone number' | 'please go back to your cart.' | 'Please Sign In' | 'PO Number' | 'Popular searches' | 'Postal Code' | 'Print' | 'Private account' | 'Processing' | 'Product Features' | 'Product' | 'Products' | 'Quantity' | 'Quick access' | 'Recent searches' | 'Recently viewed' | 'Recover your password' | 'Remember me' | 'Remove all' | 'Requested delivery date' | 'Reveal value' | 'Review and payment' | 'Save order' | 'Save' | 'Saved cart for later.' | 'Search for a customer' | 'Search' | 'Searching again using more general terms' | 'See all results' | 'Select a country' | 'Select a desired delivery date' | 'Select a language' | 'Select a list' | 'Select an industry' | 'Select other customer' | 'Selected customer' | 'Selecting As Soon As Possible will enable us to send the products to you as they become available.' | 'Selecting this country will result in your cart to be converted to the currency {0}' | 'Share your favorite list with others' | 'Ship' | 'Shipping address' | 'Shipping and handling' | 'Shipping details' | 'Shop more efficiently and quicker with a favorites list' | 'Shopping cart' | 'Show all' | 'Show filters' | 'Show less' | 'Show' | 'Sign in or create account' | 'sign in' | 'Sign me up for newsletters and product updates' | 'Signed in' | 'Signed out' | 'Signing in…' | 'Sonic account' | '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' | 'Start checkout' | 'Submenu' | 'Submit email address' | 'Submit' | 'Submitting…' | 'Subtotal' | 'Suggestions' | 'Support' | 'tag.limited' | 'tag.new' | 'The email address you entered is already associated with an existing account. Please sign in to this account or contact Customer Support.' | '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 more customers, please refine your search if needed.' | 'There are no products in your shopping cart.' | 'There is no information to display' | 'Toggle navigation menu' | 'Total amount is' | 'Total' | 'Try another search' | 'Unable to add the product to your cart.' | 'Unable to empty your cart.' | 'Unable to remove the product from your cart.' | 'Unable to save cart for later.' | 'Unable to update the product in your cart.' | 'Unknown' | '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 are not authorized to access this information.' | 'You are not authorized to view customers. Please log in or contact support.' | 'You could try checking the spelling of your search query' | 'You could try exploring our products by category' | 'You could try' | 'You have reached the end of the results, but there may be more articles available. Adjust your filters or search to discover more!' | 'You must ' | 'You selected a country where we invoice in a different currency. This will result in your cart being converted to the new currency. If you would like to review your order, ' | 'Your cart has been emptied.' | 'Your email and password were not recognized.' | 'Your favorites are available on multiple devices' | 'Your new Sonic Equipment account was succesfully created. You should receive an email soon with further instructions on how to activate this account. If you do not receive this email, please contact Customer Support.' | 'Your shopping cart is still empty';
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.' | 'Access denied.' | 'Account' | 'active' | 'Add order notes' | 'Add to list' | 'Address 1' | 'Address 2' | 'Address 3' | 'Address 4' | 'Address' | 'Amount: {0}' | 'An error occurred while changing the customer.' | 'An error occurred while fetching customers. Please try again later.' | 'An error occurred while processing your payment. Please try again.' | 'An unexpected error occured' | 'An unexpected error occured. Please try again.' | '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' | 'ascending' | 'Attention' | 'Availability unknown, please contact customer support for lead time or alternatives.' | 'Billing address' | 'Billing and shipping address' | 'Billing and shipping information' | 'Billing' | 'Cancel' | 'Cart' | 'Change customer' | 'Change password' | 'Changing your address is currently not possible. Please contact customer support to change your address.' | 'Checkout order' | 'Chosen filters' | 'City' | 'Clear filters' | 'Clear' | 'Click the button below to continue shopping.' | 'Client cases' | 'Close' | 'CoC number' | 'Company name' | 'Conceal value' | 'Confirm password' | 'Continue shopping' | 'Continue to sign in' | 'Continue' | 'Cost overview' | 'Country' | 'create account' | 'Create new list' | 'Currency Change' | 'Current page' | 'Current Password is invalid' | 'Delivery date' | 'Delivery expected on {0}' | 'descending' | 'Double check your spelling' | 'Downloads' | 'Easily add your favorite products' | 'Edit billing address' | 'Edit shipping address' | 'Edit Sonic account' | 'Edit' | 'Email' | 'Enter your email address and we will send you an email that will allow you to recover your password.' | 'Excl. VAT' | 'Explore by categories' | 'Exploring our products by category' | 'facet.categories' | 'facet.height' | 'facet.weight' | 'Favorites' | 'Features' | 'Finalize order' | 'Finalize payment' | 'First name' | 'Forgot password?' | 'Fulfillment method' | 'General' | 'Hide filters' | 'Home' | 'If an account matches the email address you entered, instructions on how to recover the password will be sent to that email address shortly. If you do not receive this email, please contact Customer Support.' | 'If you want to proceed, click the continue button. If you want to change your country, close this message and select a different country.' | 'Incl. VAT' | 'Includes' | 'Industry' | 'industry.AG' | 'industry.AU' | 'industry.AV' | 'industry.BC' | 'industry.MA' | 'industry.MC' | 'industry.OT' | 'industry.PP' | 'industry.TR' | 'Information' | 'Language' | 'Last name' | 'List name already exists' | 'Log out' | 'Main menu' | 'Make this the default customer' | 'More than {0} articles' | 'My Sonic' | 'Name' | 'Navigate to...' | 'Navigation' | 'New list name' | 'New Password is required and must be different than Current Password' | 'New password' | 'New user?' | 'No results found. Please refine your search.' | 'Number of favorites' | 'Number of products' | 'of' | 'Or continue as guest' | 'Order confirmation' | 'Order date' | 'Order number' | 'Order' | 'Orders' | 'Our products' | 'Overview' | 'Password changed. Please sign in again.' | 'Password does not meet requirements' | 'Password' | 'Passwords do not match' | 'Pay by invoice' | 'Payment method' | 'Payment' | 'pc' | 'Phone' | 'Pick up' | 'Pickup address' | 'Please enter a valid email address' | 'Please enter a valid phone number' | 'please go back to your cart.' | 'Please Sign In' | 'PO Number' | 'Popular searches' | 'Postal Code' | 'Print' | 'Private account' | 'Processing' | 'Product Features' | 'Product' | 'Products' | 'Quantity' | 'Quick access' | 'Recent searches' | 'Recently viewed' | 'Recover your password' | 'Remember me' | 'Remove all' | 'Requested delivery date' | 'Reveal value' | 'Review and payment' | 'Save order' | 'Save' | 'Saved cart for later.' | 'Search for a customer' | 'Search' | 'Searching again using more general terms' | 'See all results' | 'Select a country' | 'Select a desired delivery date' | 'Select a language' | 'Select a list' | 'Select an industry' | 'Select other customer' | 'Selected customer' | 'Selecting As Soon As Possible will enable us to send the products to you as they become available.' | 'Selecting this country will result in your cart to be converted to the currency {0}' | 'Share your favorite list with others' | 'Ship' | 'Shipping address' | 'Shipping and handling' | 'Shipping details' | 'Shop more efficiently and quicker with a favorites list' | 'Shopping cart' | 'Show all' | 'Show filters' | 'Show less' | 'Show' | 'Sign in or create account' | 'sign in' | 'Sign me up for newsletters and product updates' | 'Signed in' | 'Signed out' | 'Signing in…' | 'Sonic account' | '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' | 'Start checkout' | 'Submenu' | 'Submit email address' | 'Submit' | 'Submitting…' | 'Subtotal' | 'Suggestions' | 'Support' | 'tag.limited' | 'tag.new' | 'The email address you entered is already associated with an existing account. Please sign in to this account or contact Customer Support.' | '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 more customers, please refine your search if needed.' | 'There are no products in your shopping cart.' | 'There is no information to display' | 'This email is already in use' | 'Toggle navigation menu' | 'Total amount is' | 'Total' | 'Try another search' | 'Unable to add the product to your cart.' | 'Unable to empty your cart.' | 'Unable to remove the product from your cart.' | 'Unable to save cart for later.' | 'Unable to update the product in your cart.' | 'Unknown' | 'Updating address' | 'Use billing address' | 'Use fewer keywords' | 'Username' | '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 are not authorized to access this information.' | 'You are not authorized to perform this action' | 'You are not authorized to view customers. Please log in or contact support.' | 'You could try checking the spelling of your search query' | 'You could try exploring our products by category' | 'You could try' | 'You have reached the end of the results, but there may be more articles available. Adjust your filters or search to discover more!' | 'You must ' | 'You selected a country where we invoice in a different currency. This will result in your cart being converted to the new currency. If you would like to review your order, ' | 'Your cart has been emptied.' | 'Your email and password were not recognized.' | 'Your favorites are available on multiple devices' | 'Your new Sonic Equipment account was succesfully created. You should receive an email soon with further instructions on how to activate this account. If you do not receive this email, please contact Customer Support.' | 'Your shopping cart is still empty';
@@ -14,9 +14,14 @@ export interface FormattedMessageOptions {
14
14
  optional?: boolean;
15
15
  replacementValues?: Record<string, string>;
16
16
  }
17
- export interface FormattedMessageProps extends FormattedMessageOptions {
17
+ export interface FormattedMessageWithKnownTranslationIdProps extends FormattedMessageOptions {
18
18
  id: TranslationId;
19
19
  }
20
+ export interface FormattedMessageWithUnknownTranslationIdProps extends FormattedMessageOptions {
21
+ force: true;
22
+ id: string;
23
+ }
24
+ export type FormattedMessageProps = FormattedMessageWithKnownTranslationIdProps | FormattedMessageWithUnknownTranslationIdProps;
20
25
  export interface FormattedMessageFunction {
21
26
  (id: TranslationId, options?: {
22
27
  fallbackValue?: string;
@@ -1,4 +1,5 @@
1
1
  "use client";
2
+ import { useCallback } from 'react';
2
3
  import { useIntl } from './use-intl.js';
3
4
 
4
5
  function useFormattedMessage() {
@@ -10,7 +11,7 @@ function useFormattedMessage() {
10
11
  : `${translationIdOrPrefix}.${translationIdOrCount}.${count === 1 ? 'singular' : 'plural'}`));
11
12
  }
12
13
  formatFunction.pluralize = pluralize;
13
- return formatFunction;
14
+ return useCallback(formatFunction, [formattedMessage]);
14
15
  }
15
16
 
16
17
  export { useFormattedMessage };
@@ -6,6 +6,7 @@ export interface MenuListProps {
6
6
  title: string;
7
7
  };
8
8
  children: ReactNode;
9
+ className?: string;
9
10
  header?: string | {
10
11
  href: string;
11
12
  title: string;
@@ -13,4 +14,4 @@ export interface MenuListProps {
13
14
  scrollable?: boolean;
14
15
  variant?: MenuListVariant;
15
16
  }
16
- export declare function MenuList({ back, children, header, scrollable, variant, }: MenuListProps): import("react/jsx-runtime").JSX.Element;
17
+ export declare function MenuList({ back, children, className, header, scrollable, variant, }: MenuListProps): import("react/jsx-runtime").JSX.Element;
@@ -5,10 +5,10 @@ import { MenuListBackButton } from './menu-list-back-button.js';
5
5
  import { MenuListHeader } from './menu-list-header.js';
6
6
  import styles from './menu-list.module.css.js';
7
7
 
8
- function MenuList({ back, children, header, scrollable = true, variant = 'default', }) {
8
+ function MenuList({ back, children, className, header, scrollable = true, variant = 'default', }) {
9
9
  const headerTitle = typeof header === 'string' ? header : header?.title;
10
10
  const headerHref = typeof header === 'string' ? undefined : header?.href;
11
- return (jsxs("section", { className: clsx(styles['menu-list'], styles[variant], scrollable && styles['scrollable']), role: "menu", children: [back && (jsx(MenuListBackButton, { "data-test-selector": "menuListBackButton", onClick: back.onClick, children: back.title })), jsxs("div", { className: styles['scroll-area'], "data-test-selector": "menuListScrollArea", children: [header && (jsx(MenuListHeader, { "data-test-selector": "menuListHeader", href: headerHref, children: headerTitle })), jsx("ul", { className: styles['list'], children: children })] })] }));
11
+ return (jsxs("section", { className: clsx(styles['menu-list'], styles[variant], scrollable && styles['scrollable'], className), role: "menu", children: [back && (jsx(MenuListBackButton, { "data-test-selector": "menuListBackButton", onClick: back.onClick, children: back.title })), jsxs("div", { className: styles['scroll-area'], "data-test-selector": "menuListScrollArea", children: [header && (jsx(MenuListHeader, { "data-test-selector": "menuListHeader", href: headerHref, children: headerTitle })), jsx("ul", { className: styles['list'], children: children })] })] }));
12
12
  }
13
13
 
14
14
  export { MenuList };
@@ -0,0 +1,5 @@
1
+ import { ReactNode } from 'react';
2
+ export interface WidgetGridProps {
3
+ children?: ReactNode;
4
+ }
5
+ export declare function WidgetGrid({ children }: WidgetGridProps): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,9 @@
1
+ "use client";
2
+ import { jsx } from 'react/jsx-runtime';
3
+ import styles from './widget-grid.module.css.js';
4
+
5
+ function WidgetGrid({ children }) {
6
+ return jsx("div", { className: styles['widget-grid'], children: children });
7
+ }
8
+
9
+ export { WidgetGrid };
@@ -0,0 +1,3 @@
1
+ var styles = {"widget-grid":"widget-grid-module-GdtqD","widget":"widget-grid-module-y2wM2","size-full":"widget-grid-module-Pladu"};
2
+
3
+ export { styles as default };
@@ -0,0 +1,6 @@
1
+ import { ReactNode } from 'react';
2
+ export interface WidgetProps {
3
+ children?: ReactNode;
4
+ size?: 'default' | 'full';
5
+ }
6
+ export declare function Widget({ children, size }: WidgetProps): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,10 @@
1
+ "use client";
2
+ import { jsx } from 'react/jsx-runtime';
3
+ import clsx from 'clsx';
4
+ import styles from './widget-grid.module.css.js';
5
+
6
+ function Widget({ children, size = 'default' }) {
7
+ return (jsx("div", { className: clsx(styles['widget'], styles[`size-${size}`]), children: children }));
8
+ }
9
+
10
+ export { Widget };
@@ -1,5 +1,5 @@
1
- import { ComponentProps, ReactNode } from 'react';
2
- import { Form as AriaForm } from 'react-aria-components';
1
+ import { ReactNode } from 'react';
2
+ import { OnSubmitHandler, ValidationErrors } from '../../forms/layout/form/form';
3
3
  import { ModalProps } from '../modal/modal';
4
4
  interface DialogProps extends Omit<ModalProps, 'children' | 'className'> {
5
5
  allowClose?: boolean;
@@ -16,16 +16,16 @@ interface DialogProps extends Omit<ModalProps, 'children' | 'className'> {
16
16
  form?: string;
17
17
  header?: string;
18
18
  heading?: string;
19
- modal?: string;
19
+ modal?: ModalProps['className'];
20
20
  };
21
21
  'data-test-selector'?: string;
22
22
  footer?: ReactNode | ((props: DialogFooterProps) => ReactNode);
23
23
  hideTitle?: boolean;
24
24
  isSubmitting?: boolean;
25
- onSubmit?: (e: React.FormEvent<HTMLFormElement>) => void;
25
+ onSubmit?: OnSubmitHandler;
26
26
  submitLabel?: string;
27
27
  title: string;
28
- validationErrors?: ComponentProps<typeof AriaForm>['validationErrors'];
28
+ validationErrors?: ValidationErrors;
29
29
  }
30
30
  interface DialogFooterProps {
31
31
  allowSubmit?: boolean;
@@ -1,9 +1,10 @@
1
1
  "use client";
2
2
  import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
3
- import { Dialog as Dialog$1, Form } from 'react-aria-components';
3
+ import { Dialog as Dialog$1 } from 'react-aria-components';
4
4
  import clsx from 'clsx';
5
5
  import { Button } from '../../buttons/button/button.js';
6
6
  import { IconButton } from '../../buttons/icon-button/icon-button.js';
7
+ import { Form } from '../../forms/layout/form/form.js';
7
8
  import { StrokeCloseboxIcon } from '../../icons/stroke/stroke-closebox-icon.js';
8
9
  import { FormattedMessage } from '../../intl/formatted-message.js';
9
10
  import { useFormattedMessage } from '../../intl/use-formatted-message.js';
@@ -16,23 +17,22 @@ function Footer({ allowSubmit = true, cancelLabel, close, isSubmitting, submitLa
16
17
  }
17
18
  function Dialog({ allowClose = true, allowSubmit = true, cancelLabel = 'Close', children, className, 'data-test-selector': dataTestSelector = 'dialog', footer = Footer, hasCloseButton = true, hideTitle, isDismissable, isFullScreen, isKeyboardDismissDisabled, isOpen, isSubmitting = false, onOpenChange, onSubmit, shouldCloseOnInteractOutside, submitLabel = 'Submit', title, validationErrors, }) {
18
19
  const t = useFormattedMessage();
19
- return (jsx(Modal, { className: clsx(styles['modal-overlay'], typeof className === 'string' ? className : className?.modal), hasCloseButton: false, isDismissable: isDismissable, isFullScreen: isFullScreen, isKeyboardDismissDisabled: isKeyboardDismissDisabled, isOpen: isOpen, onOpenChange: onOpenChange, shouldCloseOnInteractOutside: shouldCloseOnInteractOutside, children: jsx(Dialog$1, { "aria-label": title, className: clsx(styles.dialog, typeof className === 'string' ? undefined : className?.dialog), "data-test-selector": dataTestSelector, children: ({ close }) => (jsxs(Form, { className: clsx(styles.form, typeof className === 'string' ? undefined : className?.form), onSubmit: e => {
20
- e.preventDefault();
21
- e.stopPropagation();
22
- onSubmit?.(e);
23
- }, validationErrors: validationErrors, children: [jsxs("header", { className: clsx(styles.header, typeof className === 'string' ? undefined : className?.header), children: [!hideTitle && (jsx(Heading, { className: clsx(styles.heading, typeof className === 'string'
24
- ? undefined
25
- : className?.heading), size: "xs", tag: "h2", children: title })), hasCloseButton && (jsx("div", { className: clsx(styles.close, typeof className === 'string'
26
- ? undefined
27
- : className?.close), children: jsx(IconButton, { "aria-label": t('Close'), color: "secondary", isDisabled: !allowClose, onClick: close, children: jsx(StrokeCloseboxIcon, {}) }) }))] }), jsx("div", { className: clsx(styles.content, typeof className === 'string' ? undefined : className?.content), children: children instanceof Function ? children({ close }) : children }), jsx("footer", { className: clsx(styles.footer, typeof className === 'string' ? undefined : className?.footer), children: footer instanceof Function
28
- ? footer({
29
- allowSubmit,
30
- cancelLabel,
31
- close,
32
- isSubmitting,
33
- submitLabel,
34
- })
35
- : footer })] })) }) }));
20
+ return (jsx(Modal, { className: {
21
+ modal: styles.modal,
22
+ overlay: clsx(styles['modal-overlay'], typeof className === 'string' ? className : className?.modal),
23
+ }, hasCloseButton: false, isDismissable: isDismissable, isFullScreen: isFullScreen, isKeyboardDismissDisabled: isKeyboardDismissDisabled, isOpen: isOpen, onOpenChange: onOpenChange, shouldCloseOnInteractOutside: shouldCloseOnInteractOutside, children: jsx(Dialog$1, { "aria-label": title, className: clsx(styles.dialog, typeof className === 'string' ? undefined : className?.dialog), "data-test-selector": dataTestSelector, children: ({ close }) => (jsx(Form, { className: clsx(styles.form, typeof className === 'string' ? undefined : className?.form), footer: jsx("div", { className: clsx(styles.footer, typeof className === 'string' ? undefined : className?.footer), children: footer instanceof Function
24
+ ? footer({
25
+ allowSubmit,
26
+ cancelLabel,
27
+ close,
28
+ isSubmitting,
29
+ submitLabel,
30
+ })
31
+ : footer }), header: jsxs(Fragment, { children: [!hideTitle && (jsx(Heading, { className: clsx(styles.heading, typeof className === 'string'
32
+ ? undefined
33
+ : className?.heading), size: "xs", tag: "h2", children: title })), hasCloseButton && (jsx("div", { className: clsx(styles.close, typeof className === 'string'
34
+ ? undefined
35
+ : className?.close), children: jsx(IconButton, { "aria-label": t('Close'), color: "secondary", isDisabled: !allowClose, onClick: close, children: jsx(StrokeCloseboxIcon, {}) }) }))] }), onSubmit: onSubmit, validationErrors: validationErrors, children: jsx("div", { className: clsx(styles.content, typeof className === 'string' ? undefined : className?.content), children: children instanceof Function ? children({ close }) : children }) })) }) }));
36
36
  }
37
37
 
38
38
  export { Dialog };
@@ -1,3 +1,3 @@
1
- var styles = {"dialog":"dialog-module-qKzgy","header":"dialog-module-ZnsAe","close":"dialog-module-Y7Tqg","footer":"dialog-module-y7Axm"};
1
+ var styles = {"modal":"dialog-module-uKVDu","dialog":"dialog-module-qKzgy","form":"dialog-module-5sZYV","close":"dialog-module-Y7Tqg","footer":"dialog-module-y7Axm"};
2
2
 
3
3
  export { styles as default };
@@ -2,8 +2,8 @@
2
2
  import { jsx, jsxs } from 'react/jsx-runtime';
3
3
  import { useState, useEffect } from 'react';
4
4
  import { Button } from '../../buttons/button/button.js';
5
- import { Select } from '../../forms/select/select.js';
6
- import { TextField } from '../../forms/text-field/text-field.js';
5
+ import { Select } from '../../forms/elements/select/select.js';
6
+ import { TextField } from '../../forms/fields/text-field/text-field.js';
7
7
  import { useFormattedMessage } from '../../intl/use-formatted-message.js';
8
8
  import { ProgressCircle } from '../../loading/progress-circle.js';
9
9
  import { useCreateWishList } from '../../shared/api/storefront/hooks/wishlist/use-create-wishlist.js';