@faststore/core 2.1.8 → 2.1.11

package/src/components/ui/Newsletter/Newsletter.tsx

@@ -0,0 +1,198 @@
+import { Button as UIButton, InputField as UIInputField } from '@faststore/ui'
+import { ComponentPropsWithRef, FormEvent } from 'react'
+import { forwardRef, useRef } from 'react'
+import { convertFromRaw } from 'draft-js'
+import { stateToHTML } from 'draft-js-export-html'
+import { Icon, useUI } from '@faststore/ui'
+import { useNewsletter } from 'src/sdk/newsletter/useNewsletter'
+
+const cmsToHtml = (content) => {
+  if (!content) {
+    return ''
+  }
+  const rawDraftContentState = JSON.parse(content)
+  const html = stateToHTML(convertFromRaw(rawDraftContentState), {
+    entityStyleFn: (entity) => {
+      const entityType = entity.get('type').toLowerCase()
+      if (entityType === 'link') {
+        const data = entity.getData()
+        return {
+          element: 'a',
+          attributes: {
+            'data-fs-link': 'true',
+            'data-fs-link-variant': 'inline',
+            'data-fs-link-inverse': 'true',
+            'data-fs-link-size': 'regular',
+            'data-testid': 'fs-link',
+            href: data.url,
+          },
+        }
+      }
+    },
+  })
+
+  return html
+}
+
+export type SubscribeMessage = {
+  title: string
+  message: string
+  icon: string
+}
+
+export interface NewsletterProps
+  extends Omit<ComponentPropsWithRef<'form'>, 'title' | 'onSubmit'> {
+  /**
+   * Icon for the section.
+   */
+  icon: {
+    icon: string
+    alt: string
+  }
+  /**
+   * Title for the section.
+   */
+  title: string
+  /**
+   * A description for the section.
+   */
+  description?: string
+  /**
+   * The Privacy Policy disclaimer.
+   */
+  privacyPolicy?: string
+  /**
+   * The email input label.
+   */
+  emailInputLabel?: string
+  /**
+   * The name input visibility.
+   */
+  displayNameInput?: boolean
+  /**
+   * The name input label.
+   */
+  nameInputLabel?: string
+  /**
+   * The subscribe button label.
+   */
+  subscribeButtonLabel?: string
+  /**
+   * The subscribe button loading label.
+   */
+  subscribeButtonLoadingLabel?: string
+  /**
+   * The card Variant
+   */
+  card: Boolean
+
+  toastSubscribe: SubscribeMessage
+
+  toastSubscribeError: SubscribeMessage
+}
+
+const Newsletter = forwardRef<HTMLFormElement, NewsletterProps>(
+  function Newsletter(
+    {
+      icon,
+      title,
+      description,
+      privacyPolicy,
+      emailInputLabel,
+      displayNameInput,
+      nameInputLabel,
+      subscribeButtonLabel,
+      subscribeButtonLoadingLabel,
+      card,
+      toastSubscribe,
+      toastSubscribeError,
+      ...otherProps
+    },
+    ref
+  ) {
+    const { subscribeUser, loading, data } = useNewsletter()
+    const nameInputRef = useRef<HTMLInputElement>(null)
+    const emailInputRef = useRef<HTMLInputElement>(null)
+
+    const { pushToast } = useUI()
+
+    const handleSubmit = (event: FormEvent) => {
+      event.preventDefault()
+      subscribeUser({
+        data: {
+          name: nameInputRef.current?.value ?? '',
+          email: emailInputRef.current?.value ?? '',
+        },
+      })
+
+      if (data?.subscribeToNewsletter?.id) {
+        pushToast({
+          ...toastSubscribe,
+          status: 'INFO',
+          icon: <Icon name={toastSubscribe.icon} width={30} height={30} />,
+        })
+      } else {
+        pushToast({
+          ...toastSubscribeError,
+          status: 'ERROR',
+          icon: <Icon name={toastSubscribeError.icon} width={30} height={30} />,
+        })
+      }
+
+      const formElement = event.currentTarget as HTMLFormElement
+
+      formElement.reset()
+    }
+
+    return (
+      <div data-fs-newsletter={card ? 'card' : ''}>
+        <form
+          data-fs-newsletter-form
+          ref={ref}
+          onSubmit={handleSubmit}
+          {...otherProps}
+          className="layout__content"
+        >
+          <header data-fs-newsletter-header>
+            <h3>
+              <Icon name={icon.icon} width={32} height={32} />
+              {title}
+            </h3>
+            {description && <span> {description}</span>}
+          </header>
+
+          <div data-fs-newsletter-controls>
+            <>
+              {displayNameInput ? (
+                <UIInputField
+                  inputRef={nameInputRef}
+                  id="newsletter-name"
+                  label={nameInputLabel}
+                  required
+                />
+              ) : null}
+              <UIInputField
+                inputRef={emailInputRef}
+                id="newsletter-email"
+                label={emailInputLabel}
+                type="email"
+                required
+              />
+              <span
+                data-fs-newsletter-addendum
+                dangerouslySetInnerHTML={{
+                  __html: cmsToHtml(privacyPolicy),
+                }}
+              ></span>
+              <UIButton variant="secondary" inverse type="submit">
+                {loading ? subscribeButtonLoadingLabel : subscribeButtonLabel}
+              </UIButton>
+            </>
+          </div>
+        </form>
+      </div>
+    )
+  }
+)
+
+export default Newsletter

package/src/components/ui/Newsletter/index.ts

@@ -0,0 +1,2 @@
+export { default } from './Newsletter'
+export type { NewsletterProps } from './Newsletter'

package/.next/server/chunks/378.js

@@ -1,326 +0,0 @@
-exports.id = 378;
-exports.ids = [378];
-exports.modules = {
-
-/***/ 32127:
-/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-
-"use strict";
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "S": () => (/* binding */ useBanner),
-/* harmony export */   "Z": () => (__WEBPACK_DEFAULT_EXPORT__)
-/* harmony export */ });
-/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(16689);
-/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
-
-const BannerContext = (0,react__WEBPACK_IMPORTED_MODULE_0__.createContext)(undefined);
-const Banner = (0,react__WEBPACK_IMPORTED_MODULE_0__.forwardRef)(function Banner({ children, testId = 'fs-banner', variant = 'primary', colorVariant = 'main', ...otherProps }, ref) {
-    const context = { variant, colorVariant };
-    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(BannerContext.Provider, { value: context },
-        react__WEBPACK_IMPORTED_MODULE_0___default().createElement("article", { ref: ref, "data-fs-banner": true, "data-fs-banner-variant": variant, "data-fs-banner-color-variant": colorVariant, "data-testid": testId, ...otherProps }, children)));
-});
-function useBanner() {
-    const context = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(BannerContext);
-    if (context === undefined) {
-        throw new Error('Do not use Banner components outside the Banner context.');
-    }
-    return context;
-}
-/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Banner);
-//# sourceMappingURL=Banner.js.map
-
-/***/ }),
-
-/***/ 87538:
-/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-
-"use strict";
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "Z": () => (__WEBPACK_DEFAULT_EXPORT__)
-/* harmony export */ });
-/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(16689);
-/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var ___WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(67703);
-/* harmony import */ var _Banner__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(32127);
-
-
-
-const BannerContent = (0,react__WEBPACK_IMPORTED_MODULE_0__.forwardRef)(function BannerContent({ testId = 'fs-banner-content', title, caption, link, linkText, ...otherProps }, ref) {
-    const { variant, colorVariant } = (0,_Banner__WEBPACK_IMPORTED_MODULE_1__/* .useBanner */ .S)();
-    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("header", { ref: ref, "data-fs-banner-content": true, "data-testid": testId, ...otherProps, className: "layout__content" },
-        react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { "data-fs-banner-heading": true, "data-fs-banner-color-variant": colorVariant },
-            react__WEBPACK_IMPORTED_MODULE_0___default().createElement("h2", null, title),
-            variant === 'secondary' && caption && react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", null, caption)),
-        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(___WEBPACK_IMPORTED_MODULE_2__/* ["default"] */ .Z, { "data-fs-banner-link": true, href: link, variant: variant, inverse: colorVariant === 'main' }, linkText)));
-});
-/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (BannerContent);
-//# sourceMappingURL=BannerContent.js.map
-
-/***/ }),
-
-/***/ 68170:
-/***/ ((module, __webpack_exports__, __webpack_require__) => {
-
-"use strict";
-__webpack_require__.a(module, async (__webpack_handle_async_dependencies__, __webpack_async_result__) => { try {
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "Z": () => (__WEBPACK_DEFAULT_EXPORT__)
-/* harmony export */ });
-/* harmony import */ var _faststore_ui__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(28287);
-/* harmony import */ var _faststore_ui__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(57578);
-/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(16689);
-/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _faststore_ui__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(90395);
-/* harmony import */ var _faststore_ui__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(25045);
-/* harmony import */ var src_components_ui_Link__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(51093);
-/* harmony import */ var src_sdk_newsletter_useNewsletter__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(35822);
-/* harmony import */ var _Section__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(57067);
-/* harmony import */ var _section_module_scss__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(37781);
-/* harmony import */ var _section_module_scss__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_section_module_scss__WEBPACK_IMPORTED_MODULE_7__);
-/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(20997);
-/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__);
-var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([src_sdk_newsletter_useNewsletter__WEBPACK_IMPORTED_MODULE_2__]);
-src_sdk_newsletter_useNewsletter__WEBPACK_IMPORTED_MODULE_2__ = (__webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__)[0];
-
-
-
-
-
-
-
-
-
-
-const Newsletter = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.forwardRef)(function Newsletter({
-  title,
-  description,
-  card = false,
-  lite = false
-}, ref) {
-  const {
-    subscribeUser,
-    loading,
-    data
-  } = (0,src_sdk_newsletter_useNewsletter__WEBPACK_IMPORTED_MODULE_2__/* .useNewsletter */ .u)();
-  const nameInputRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null);
-  const emailInputRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null);
-  const {
-    pushToast
-  } = (0,_faststore_ui__WEBPACK_IMPORTED_MODULE_5__/* .useUI */ .l)();
-
-  const handleSubmit = event => {
-    event.preventDefault();
-    subscribeUser({
-      data: {
-        name: nameInputRef.current?.value ?? '',
-        email: emailInputRef.current?.value ?? ''
-      }
-    });
-
-    if (data?.subscribeToNewsletter?.id) {
-      pushToast({
-        title: 'Hooray!',
-        message: 'Thank for your subscription.',
-        status: 'INFO',
-        icon: /*#__PURE__*/react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx(_faststore_ui__WEBPACK_IMPORTED_MODULE_6__/* ["default"] */ .Z, {
-          name: "CircleWavyCheck",
-          width: 30,
-          height: 30
-        })
-      });
-    } else {
-      pushToast({
-        title: 'Oops.',
-        message: 'Something went wrong. Please Try again.',
-        status: 'ERROR',
-        icon: /*#__PURE__*/react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx(_faststore_ui__WEBPACK_IMPORTED_MODULE_6__/* ["default"] */ .Z, {
-          name: "CircleWavyWarning",
-          width: 30,
-          height: 30
-        })
-      });
-    }
-
-    const formElement = event.currentTarget;
-    formElement.reset();
-  };
-
-  return /*#__PURE__*/react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx(_Section__WEBPACK_IMPORTED_MODULE_3__/* ["default"] */ .Z, {
-    className: `${(_section_module_scss__WEBPACK_IMPORTED_MODULE_7___default().section)} section-newsletter`,
-    children: /*#__PURE__*/react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx("div", {
-      "data-fs-newsletter": card ? 'card' : '',
-      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("form", {
-        ref: ref,
-        "data-fs-newsletter-form": true,
-        onSubmit: handleSubmit,
-        className: "layout__content",
-        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("header", {
-          "data-fs-newsletter-header": true,
-          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("h3", {
-            children: [/*#__PURE__*/react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx(_faststore_ui__WEBPACK_IMPORTED_MODULE_6__/* ["default"] */ .Z, {
-              name: "Envelop",
-              width: 32,
-              height: 32
-            }), title]
-          }), description && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("span", {
-            children: [" ", description]
-          })]
-        }), /*#__PURE__*/react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx("div", {
-          "data-fs-newsletter-controls": true,
-          children: lite ? /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
-            children: [/*#__PURE__*/react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx(_faststore_ui__WEBPACK_IMPORTED_MODULE_8__/* ["default"] */ .Z, {
-              inputRef: emailInputRef,
-              id: "newsletter-email",
-              label: "Your Email",
-              type: "email",
-              required: true,
-              actionable: true,
-              onSubmit: () => undefined,
-              onClear: () => undefined,
-              buttonActionText: "Subscribe",
-              displayClearButton: false
-            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("span", {
-              "data-fs-newsletter-addendum": true,
-              children: ["By subscribing to our newsletter you agree to to our", ' ', /*#__PURE__*/react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx(src_components_ui_Link__WEBPACK_IMPORTED_MODULE_1__/* ["default"] */ .Z, {
-                href: "/",
-                inverse: true,
-                variant: "inline",
-                children: "Privacy Policy."
-              })]
-            })]
-          }) : /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
-            children: [/*#__PURE__*/react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx(_faststore_ui__WEBPACK_IMPORTED_MODULE_8__/* ["default"] */ .Z, {
-              inputRef: nameInputRef,
-              id: "newsletter-name",
-              label: "Your Name",
-              required: true
-            }), /*#__PURE__*/react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx(_faststore_ui__WEBPACK_IMPORTED_MODULE_8__/* ["default"] */ .Z, {
-              inputRef: emailInputRef,
-              id: "newsletter-email",
-              label: "Your Email",
-              type: "email",
-              required: true
-            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("span", {
-              "data-fs-newsletter-addendum": true,
-              children: ["By subscribing to our newsletter you agree to to our", ' ', /*#__PURE__*/react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx(src_components_ui_Link__WEBPACK_IMPORTED_MODULE_1__/* ["default"] */ .Z, {
-                href: "/",
-                inverse: true,
-                variant: "inline",
-                children: "Privacy Policy."
-              })]
-            }), /*#__PURE__*/react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx(_faststore_ui__WEBPACK_IMPORTED_MODULE_9__/* ["default"] */ .Z, {
-              variant: "secondary",
-              inverse: true,
-              type: "submit",
-              children: loading ? 'Loading...' : 'Subscribe'
-            })]
-          })
-        })]
-      })
-    })
-  });
-});
-/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Newsletter);
-__webpack_async_result__();
-} catch(e) { __webpack_async_result__(e); } });
-
-/***/ }),
-
-/***/ 87191:
-/***/ ((module, __webpack_exports__, __webpack_require__) => {
-
-"use strict";
-__webpack_require__.a(module, async (__webpack_handle_async_dependencies__, __webpack_async_result__) => { try {
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "Z": () => (/* reexport safe */ _Newsletter__WEBPACK_IMPORTED_MODULE_0__.Z)
-/* harmony export */ });
-/* harmony import */ var _Newsletter__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(68170);
-var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([_Newsletter__WEBPACK_IMPORTED_MODULE_0__]);
-_Newsletter__WEBPACK_IMPORTED_MODULE_0__ = (__webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__)[0];
-
-__webpack_async_result__();
-} catch(e) { __webpack_async_result__(e); } });
-
-/***/ }),
-
-/***/ 88597:
-/***/ ((module, __webpack_exports__, __webpack_require__) => {
-
-"use strict";
-__webpack_require__.a(module, async (__webpack_handle_async_dependencies__, __webpack_async_result__) => { try {
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "t": () => (/* binding */ useLazyQuery)
-/* harmony export */ });
-/* harmony import */ var swr__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(15941);
-/* harmony import */ var _request__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(180);
-/* harmony import */ var _useQuery__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(77732);
-var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([swr__WEBPACK_IMPORTED_MODULE_0__, _useQuery__WEBPACK_IMPORTED_MODULE_1__]);
-([swr__WEBPACK_IMPORTED_MODULE_0__, _useQuery__WEBPACK_IMPORTED_MODULE_1__] = __webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__);
-
-
-
-const useLazyQuery = (operationName, variables, options) => {
-  const response = (0,swr__WEBPACK_IMPORTED_MODULE_0__["default"])((0,_useQuery__WEBPACK_IMPORTED_MODULE_1__/* .getKey */ .km)(operationName, variables), () => null, _useQuery__WEBPACK_IMPORTED_MODULE_1__/* .DEFAULT_OPTIONS */ .WN);
-
-  const execute = async queryVariables => {
-    const data = await (0,_request__WEBPACK_IMPORTED_MODULE_2__/* .request */ .W)(operationName, queryVariables, options);
-    response.mutate(data, false);
-  };
-
-  return [execute, response];
-};
-__webpack_async_result__();
-} catch(e) { __webpack_async_result__(e); } });
-
-/***/ }),
-
-/***/ 35822:
-/***/ ((module, __webpack_exports__, __webpack_require__) => {
-
-"use strict";
-__webpack_require__.a(module, async (__webpack_handle_async_dependencies__, __webpack_async_result__) => { try {
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "u": () => (/* binding */ useNewsletter)
-/* harmony export */ });
-/* unused harmony export mutation */
-/* harmony import */ var _graphql_useLazyQuery__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(88597);
-var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([_graphql_useLazyQuery__WEBPACK_IMPORTED_MODULE_0__]);
-_graphql_useLazyQuery__WEBPACK_IMPORTED_MODULE_0__ = (__webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__)[0];
-
-const mutation = "SubscribeToNewsletter";
-const useNewsletter = () => {
-  const [subscribeUser, {
-    data,
-    error,
-    isValidating: loading
-  }] = (0,_graphql_useLazyQuery__WEBPACK_IMPORTED_MODULE_0__/* .useLazyQuery */ .t)(mutation, {
-    data: {
-      name: '',
-      email: ''
-    }
-  });
-  return {
-    subscribeUser,
-    data,
-    error,
-    loading
-  };
-};
-__webpack_async_result__();
-} catch(e) { __webpack_async_result__(e); } });
-
-/***/ }),
-
-/***/ 37781:
-/***/ ((module) => {
-
-// Exports
-module.exports = {
-	"section": "section_section__kRRBW"
-};
-
-
-/***/ })
-
-};
-;

package/.next/static/chunks/234-7d72b0ee52936c13.js

@@ -1 +0,0 @@
-(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[234],{7704:function(e,t,r){"use strict";r.d(t,{YD:function(){return h},df:function(){return m}});var n=r(2784);function i(){return i=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},i.apply(this,arguments)}function a(e,t){return a=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e},a(e,t)}var o=new Map,s=new WeakMap,c=0,l=void 0;function d(e){return Object.keys(e).sort().filter((function(t){return void 0!==e[t]})).map((function(t){return t+"_"+("root"===t?(r=e.root)?(s.has(r)||(c+=1,s.set(r,c.toString())),s.get(r)):"0":e[t]);var r})).toString()}function u(e,t,r,n){if(void 0===r&&(r={}),void 0===n&&(n=l),"undefined"===typeof window.IntersectionObserver&&void 0!==n){var i=e.getBoundingClientRect();return t(n,{isIntersecting:n,target:e,intersectionRatio:"number"===typeof r.threshold?r.threshold:0,time:0,boundingClientRect:i,intersectionRect:i,rootBounds:i}),function(){}}var a=function(e){var t=d(e),r=o.get(t);if(!r){var n,i=new Map,a=new IntersectionObserver((function(t){t.forEach((function(t){var r,a=t.isIntersecting&&n.some((function(e){return t.intersectionRatio>=e}));e.trackVisibility&&"undefined"===typeof t.isVisible&&(t.isVisible=a),null==(r=i.get(t.target))||r.forEach((function(e){e(a,t)}))}))}),e);n=a.thresholds||(Array.isArray(e.threshold)?e.threshold:[e.threshold||0]),r={id:t,observer:a,elements:i},o.set(t,r)}return r}(r),s=a.id,c=a.observer,u=a.elements,f=u.get(e)||[];return u.has(e)||u.set(e,f),f.push(t),c.observe(e),function(){f.splice(f.indexOf(t),1),0===f.length&&(u.delete(e),c.unobserve(e)),0===u.size&&(c.disconnect(),o.delete(s))}}var f=["children","as","triggerOnce","threshold","root","rootMargin","onChange","skip","trackVisibility","delay","initialInView","fallbackInView"];function p(e){return"function"!==typeof e.children}var m=function(e){var t,r;function o(t){var r;return(r=e.call(this,t)||this).node=null,r._unobserveCb=null,r.handleNode=function(e){r.node&&(r.unobserve(),e||r.props.triggerOnce||r.props.skip||r.setState({inView:!!r.props.initialInView,entry:void 0})),r.node=e||null,r.observeNode()},r.handleChange=function(e,t){e&&r.props.triggerOnce&&r.unobserve(),p(r.props)||r.setState({inView:e,entry:t}),r.props.onChange&&r.props.onChange(e,t)},r.state={inView:!!t.initialInView,entry:void 0},r}r=e,(t=o).prototype=Object.create(r.prototype),t.prototype.constructor=t,a(t,r);var s=o.prototype;return s.componentDidUpdate=function(e){e.rootMargin===this.props.rootMargin&&e.root===this.props.root&&e.threshold===this.props.threshold&&e.skip===this.props.skip&&e.trackVisibility===this.props.trackVisibility&&e.delay===this.props.delay||(this.unobserve(),this.observeNode())},s.componentWillUnmount=function(){this.unobserve(),this.node=null},s.observeNode=function(){if(this.node&&!this.props.skip){var e=this.props,t=e.threshold,r=e.root,n=e.rootMargin,i=e.trackVisibility,a=e.delay,o=e.fallbackInView;this._unobserveCb=u(this.node,this.handleChange,{threshold:t,root:r,rootMargin:n,trackVisibility:i,delay:a},o)}},s.unobserve=function(){this._unobserveCb&&(this._unobserveCb(),this._unobserveCb=null)},s.render=function(){if(!p(this.props)){var e=this.state,t=e.inView,r=e.entry;return this.props.children({inView:t,entry:r,ref:this.handleNode})}var a=this.props,o=a.children,s=a.as,c=function(e,t){if(null==e)return{};var r,n,i={},a=Object.keys(e);for(n=0;n<a.length;n++)r=a[n],t.indexOf(r)>=0||(i[r]=e[r]);return i}(a,f);return n.createElement(s||"div",i({ref:this.handleNode},c),o)},o}(n.Component);function h(e){var t=void 0===e?{}:e,r=t.threshold,i=t.delay,a=t.trackVisibility,o=t.rootMargin,s=t.root,c=t.triggerOnce,l=t.skip,d=t.initialInView,f=t.fallbackInView,p=n.useRef(),m=n.useState({inView:!!d}),h=m[0],v=m[1],g=n.useCallback((function(e){void 0!==p.current&&(p.current(),p.current=void 0),l||e&&(p.current=u(e,(function(e,t){v({inView:e,entry:t}),t.isIntersecting&&c&&p.current&&(p.current(),p.current=void 0)}),{root:s,rootMargin:o,threshold:r,trackVisibility:a,delay:i},f))}),[Array.isArray(r)?r.toString():r,s,o,c,l,a,f,i]);(0,n.useEffect)((function(){p.current||!h.entry||c||l||v({inView:!!d})}));var b=[g,h.inView,h.entry];return b.ref=b[0],b.inView=b[1],b.entry=b[2],b}m.displayName="InView",m.defaultProps={threshold:0,triggerOnce:!1,initialInView:!1}},7216:function(e,t,r){"use strict";var n=r(2784);const i=(0,n.forwardRef)((function({testId:e="fs-label",children:t,...r},i){return n.createElement("label",{ref:i,"data-fs-label":!0,"data-testid":e,...r},t)}));t.Z=i},7549:function(e,t,r){"use strict";var n=r(2784),i=r(2691);const a=(0,n.forwardRef)((function({value:e,as:t="span",variant:r="selling",testId:a="fs-price",formatter:o=(e=>e),SRText:s,...c},l){const d=o(e,r);return n.createElement(t,{ref:l,"data-fs-price":!0,"data-fs-price-variant":r,"data-testid":a,...c},s&&n.createElement(i.Z,{text:s}),d)}));t.Z=a},2928:function(e,t,r){"use strict";var n=r(2784);const i=(0,n.forwardRef)((function({testId:e="fs-skeleton",loading:t=!0,shimmer:r=!0,children:i,size:a,border:o,borderRadius:s,...c},l){const d={width:a.width,height:a.height};return t?n.createElement("div",{ref:l,"data-fs-skeleton":!0,"data-testid":e,"data-fs-skeleton-border":o||null,style:s?{...d,borderRadius:s}:d,...c},r&&n.createElement("div",{"data-fs-skeleton-shimmer":!0})):n.createElement(n.Fragment,null,i)}));t.Z=i},9875:function(e,t,r){"use strict";r.d(t,{Z:function(){return a}});var n=r(2784),i=r(44);var a=({listPrice:e,spotPrice:t,thresholdLow:r=15,thresholdHigh:a=40,size:o,testId:s="fs-discount-badge"})=>{const c=((e,t)=>(0,n.useMemo)((()=>{const r=100*(e-t)/e;return Math.round(r)}),[t,e]))(e,t);if(0===c)return n.createElement(n.Fragment,null);const l=c<=r?"low":c<=a?"medium":"high";return n.createElement(i.Z,{"data-fs-discount-badge":!0,"data-fs-discount-badge-variant":l,size:o,"data-testid":s},c,"% off")}},8287:function(e,t,r){"use strict";var n=r(2784),i=r(875),a=r(7216),o=r(2765),s=r(5045),c=r(7578);t.Z=({id:e,label:t,type:r="text",error:l,displayClearButton:d,actionable:u,buttonActionText:f="Apply",onSubmit:p,onClear:m,placeholder:h=" ",inputRef:v,disabled:g,value:b,testId:y="fs-input-field",...w})=>{const O=!g&&l&&""!==l,P=u&&!g&&""!==b;return n.createElement("div",{"data-fs-input-field":!0,"data-fs-input-field-actionable":u,"data-fs-input-field-error":l&&""!==l,"data-testid":y},n.createElement(i.Z,{id:e,type:r,value:b,ref:v,disabled:g,placeholder:h,...w}),n.createElement(a.Z,{htmlFor:e},t),P&&(d||l?n.createElement(o.Z,{size:"small","aria-label":"Clear Field",icon:n.createElement(s.Z,{name:"XCircle"}),onClick:()=>{m?.(),v?.current?.focus()}}):n.createElement(c.Z,{variant:"tertiary",size:"small",onClick:p},f)),O&&n.createElement("span",{"data-fs-input-field-error-message":!0},l))}},783:function(e,t,r){"use strict";var n=r(2784),i=r(5045),a=r(2765),o=r(1329);const s=(0,n.forwardRef)((function({children:e,testId:t="fs-rating",length:r=5,value:s=0,icon:c,onChange:l,...d},u){const[f,p]=(0,n.useState)(0),m={"data-fs-rating-icon-outline":!0},h=n.isValidElement(c)?c:n.createElement(i.Z,{name:"Star"});return n.createElement(o.Z,{ref:u,"data-fs-rating":!0,"data-fs-rating-actionable":"function"===typeof l,"data-testid":t,...d},Array.from({length:r}).map(((e,r)=>{const o=r+1;return n.createElement("li",{key:`rating-${r}`,"data-fs-rating-item":o<=(f||s)?"full":o-s>0&&o-s<1?"partial":"empty","data-testid":`${t}-item`},l?n.createElement(a.Z,{"data-fs-rating-button":!0,icon:h,size:"small","aria-label":"rate",onClick:()=>{l(o)},onMouseEnter:()=>p(o),onMouseLeave:()=>p(s)}):n.createElement(n.Fragment,null,n.createElement("div",{"data-fs-rating-icon-wrapper":!0},h),n.isValidElement(c)?n.cloneElement(c,m):n.createElement(i.Z,{name:"Star","data-fs-rating-icon-outline":!0})))})))}));t.Z=s},2127:function(e,t,r){"use strict";r.d(t,{S:function(){return o}});var n=r(2784);const i=(0,n.createContext)(void 0),a=(0,n.forwardRef)((function({children:e,testId:t="fs-banner",variant:r="primary",colorVariant:a="main",...o},s){const c={variant:r,colorVariant:a};return n.createElement(i.Provider,{value:c},n.createElement("article",{ref:s,"data-fs-banner":!0,"data-fs-banner-variant":r,"data-fs-banner-color-variant":a,"data-testid":t,...o},e))}));function o(){const e=(0,n.useContext)(i);if(void 0===e)throw new Error("Do not use Banner components outside the Banner context.");return e}t.Z=a},7538:function(e,t,r){"use strict";var n=r(2784),i=r(7703),a=r(2127);const o=(0,n.forwardRef)((function({testId:e="fs-banner-content",title:t,caption:r,link:o,linkText:s,...c},l){const{variant:d,colorVariant:u}=(0,a.S)();return n.createElement("header",{ref:l,"data-fs-banner-content":!0,"data-testid":e,...c,className:"layout__content"},n.createElement("div",{"data-fs-banner-heading":!0,"data-fs-banner-color-variant":u},n.createElement("h2",null,t),"secondary"===d&&r&&n.createElement("p",null,r)),n.createElement(i.Z,{"data-fs-banner-link":!0,href:o,variant:d,inverse:"main"===u},s))}));t.Z=o},3432:function(e,t,r){"use strict";r.d(t,{Z:function(){return x}});var n=r(9499),i=r(4730),a=r(2784);var o=(0,a.forwardRef)((function({testId:e="fs-product-card",variant:t="default",bordered:r=!1,outOfStock:n,children:i,...o},s){return a.createElement("article",{ref:s,"data-fs-product-card":n?"out-of-stock":"","data-fs-product-card-variant":t,"data-fs-product-card-bordered":r,"data-testid":e,...o},i)}));var s=(0,a.forwardRef)((function({testId:e="fs-product-card-image",aspectRatio:t=1,children:r,...n},i){return a.createElement("div",{ref:i,"data-fs-product-card-image":!0,"data-testid":e,style:{"--fs-product-card-image-aspect-ratio":t},...n},r)})),c=r(7865),l=r(7549),d=r(783),u=r(5045),f=r(9875),p=r(44),m=r(7578);var h=(0,a.forwardRef)((function({testId:e="fs-product-card-content",title:t,linkProps:r,price:n,outOfStock:i,outOfStockLabel:o="Out of stock",ratingValue:s,showDiscountBadge:h,buttonLabel:v="Add",onButtonClick:g,children:b,...y},w){return a.createElement("section",{ref:w,"data-fs-product-card-content":!0,"data-fs-product-card-badge":h,"data-testid":e,...y},a.createElement("div",{"data-fs-product-card-heading":!0},a.createElement("h3",{"data-fs-product-card-title":!0},a.createElement(c.Z,{...r,title:t},t)),a.createElement("div",{"data-fs-product-card-prices":!0},a.createElement(l.Z,{value:n?.listPrice?n.listPrice:0,formatter:n?.formatter,testId:"list-price","data-value":n?.listPrice,variant:"listing",SRText:"Original price:"}),a.createElement(l.Z,{value:n?.value?n.value:0,formatter:n?.formatter,testId:"price","data-value":n?.value,variant:"spot",SRText:"Sale Price:"})),s&&a.createElement(d.Z,{value:s,icon:a.createElement(u.Z,{name:"Star"})})),h&&!i&&a.createElement(f.Z,{listPrice:n?.listPrice?n.listPrice:0,spotPrice:n?.value?n.value:0}),i&&a.createElement(p.Z,null,o),g&&!i&&a.createElement("div",{"data-fs-product-card-actions":!0},a.createElement(m.Z,{variant:"primary",icon:a.createElement(u.Z,{name:"ShoppingCart"}),iconPosition:"left",size:"small",onClick:g},v)))})),v=r(1664),g=r.n(v),b=r(9266),y=r(5346),w=r(9854),O=r(2322),P=["product","index","bordered","variant","aspectRatio","imgProps","ratingValue","buttonLabel","onButtonClick","showDiscountBadge"];function j(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function E(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?j(Object(r),!0).forEach((function(t){(0,n.Z)(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):j(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}function k(e){var t,r,{product:n,index:a,bordered:c=!1,variant:l="default",aspectRatio:d=1,imgProps:u,ratingValue:f,buttonLabel:p="Add",onButtonClick:m,showDiscountBadge:v=!0}=e,j=(0,i.Z)(e,P),{sku:k,isVariantOf:{name:x},image:[S],offers:{lowPrice:_,offers:[{listPrice:I,availability:C}]}}=n,Z=E(E({},(0,w.w)({product:n,selectedOffer:0,index:a})),{},{as:g(),passHref:!0,legacyBehavior:!1,prefetch:!1}),R="https://schema.org/InStock"!==C;return(0,O.jsxs)(o,E(E({outOfStock:R,bordered:c,variant:l,"data-fs-product-card-sku":k},j),{},{children:[(0,O.jsx)(s,{aspectRatio:d,children:(0,O.jsx)(b.E,{src:S.url,alt:S.alternateName,sizes:"".concat(null!==(t=null===u||void 0===u?void 0:u.sizes)&&void 0!==t?t:"(max-width: 768px) 40vw, 30vw"),width:null!==(r=null===u||void 0===u?void 0:u.width)&&void 0!==r?r:360,height:Math.round((Number(null===u||void 0===u?void 0:u.height)||360)/d),loading:null===u||void 0===u?void 0:u.loading})}),(0,O.jsx)(h,{title:x,price:{value:_,listPrice:I,formatter:y.P},ratingValue:f,outOfStock:R,onButtonClick:m,linkProps:Z,showDiscountBadge:v})]}))}var x=(0,a.memo)(k)},383:function(e,t,r){"use strict";r.d(t,{Z:function(){return b}});var n=r(8287),i=r(7578),a=r(2784),o=r(395),s=r(5045),c=r(1093),l=r(29),d=r(9857),u=r(180),f=r(7732),p=(e,t,r)=>{var n=(0,d.ZP)((0,f.km)(e,t),(()=>null),f.WN),i=function(){var t=(0,l.Z)((function*(t){var i=yield(0,u.W)(e,t,r);n.mutate(i,!1)}));return function(e){return t.apply(this,arguments)}}();return[i,n]},m=r(7067),h=r(1778),v=r.n(h),g=r(2322),b=(0,a.forwardRef)((function(e,t){var{title:r,description:l,card:d=!1,lite:u=!1}=e,{subscribeUser:f,loading:h,data:b}=(()=>{var[e,{data:t,error:r,isValidating:n}]=p("SubscribeToNewsletter",{data:{name:"",email:""}});return{subscribeUser:e,data:t,error:r,loading:n}})(),y=(0,a.useRef)(null),w=(0,a.useRef)(null),{pushToast:O}=(0,o.l)();return(0,g.jsx)(m.Z,{className:"".concat(v().section," section-newsletter"),children:(0,g.jsx)("div",{"data-fs-newsletter":d?"card":"",children:(0,g.jsxs)("form",{ref:t,"data-fs-newsletter-form":!0,onSubmit:e=>{var t,r,n,i,a;e.preventDefault(),f({data:{name:null!==(t=null===(r=y.current)||void 0===r?void 0:r.value)&&void 0!==t?t:"",email:null!==(n=null===(i=w.current)||void 0===i?void 0:i.value)&&void 0!==n?n:""}}),null!==b&&void 0!==b&&null!==(a=b.subscribeToNewsletter)&&void 0!==a&&a.id?O({title:"Hooray!",message:"Thank for your subscription.",status:"INFO",icon:(0,g.jsx)(s.Z,{name:"CircleWavyCheck",width:30,height:30})}):O({title:"Oops.",message:"Something went wrong. Please Try again.",status:"ERROR",icon:(0,g.jsx)(s.Z,{name:"CircleWavyWarning",width:30,height:30})}),e.currentTarget.reset()},className:"layout__content",children:[(0,g.jsxs)("header",{"data-fs-newsletter-header":!0,children:[(0,g.jsxs)("h3",{children:[(0,g.jsx)(s.Z,{name:"Envelop",width:32,height:32}),r]}),l&&(0,g.jsxs)("span",{children:[" ",l]})]}),(0,g.jsx)("div",{"data-fs-newsletter-controls":!0,children:u?(0,g.jsxs)(g.Fragment,{children:[(0,g.jsx)(n.Z,{inputRef:w,id:"newsletter-email",label:"Your Email",type:"email",required:!0,actionable:!0,onSubmit:()=>{},onClear:()=>{},buttonActionText:"Subscribe",displayClearButton:!1}),(0,g.jsxs)("span",{"data-fs-newsletter-addendum":!0,children:["By subscribing to our newsletter you agree to to our"," ",(0,g.jsx)(c.Z,{href:"/",inverse:!0,variant:"inline",children:"Privacy Policy."})]})]}):(0,g.jsxs)(g.Fragment,{children:[(0,g.jsx)(n.Z,{inputRef:y,id:"newsletter-name",label:"Your Name",required:!0}),(0,g.jsx)(n.Z,{inputRef:w,id:"newsletter-email",label:"Your Email",type:"email",required:!0}),(0,g.jsxs)("span",{"data-fs-newsletter-addendum":!0,children:["By subscribing to our newsletter you agree to to our"," ",(0,g.jsx)(c.Z,{href:"/",inverse:!0,variant:"inline",children:"Privacy Policy."})]}),(0,g.jsx)(i.Z,{variant:"secondary",inverse:!0,type:"submit",children:h?"Loading...":"Subscribe"})]})})]})})})}))},3288:function(e,t,r){"use strict";r.d(t,{Z:function(){return a}});var n=r(2928),i=r(2322);var a=function(e){var{bordered:t,sectioned:r,displayButton:a,aspectRatio:o=1,variant:s="default"}=e;return(0,i.jsxs)("div",{"data-fs-product-card-skeleton":!0,"data-fs-product-card-skeleton-variant":s,"data-fs-product-card-skeleton-bordered":t,"data-fs-product-card-skeleton-sectioned":r,children:[(0,i.jsx)("div",{"data-fs-product-card-skeleton-image":!0,style:{"--fs-product-card-skeleton-image-aspect-ratio":o},children:(0,i.jsx)(n.Z,{size:{width:"100%",height:"100%"}})}),(0,i.jsxs)("div",{"data-fs-product-card-skeleton-content":!0,children:[(0,i.jsx)(n.Z,{"data-fs-product-card-skeleton-text":!0,size:{width:"90%",height:"1.5rem"}}),(0,i.jsx)(n.Z,{"data-fs-product-card-skeleton-text":!0,size:{width:"70%",height:"1.5rem"}}),(0,i.jsx)(n.Z,{"data-fs-product-card-skeleton-badge":!0,size:{width:"6rem",height:"2rem"},border:"pill"}),a&&(0,i.jsx)(n.Z,{"data-fs-product-card-skeleton-button":!0,size:{width:"6rem",height:"2rem"},style:{columnGap:".75rem"}})]})]})}},10:function(e,t,r){"use strict";r.d(t,{Z:function(){return F}});var n=r(9499),i=r(4730),a=r(2784);var o=(0,a.forwardRef)((function({testId:e="fs-product-shelf",children:t,...r},n){return a.createElement("div",{ref:n,"data-fs-product-shelf":!0,"data-testid":e,...r},t)}));var s=(0,a.forwardRef)((function({testId:e="fs-product-shelf-items",children:t,...r},n){return a.createElement("ul",{role:"list",ref:n,"data-fs-product-shelf-items":!0,"data-testid":e,...r},t)}));var c=(0,a.forwardRef)((function({testId:e="fs-product-shelf-item",children:t,...r},n){return a.createElement("li",{role:"listitem",ref:n,"data-fs-product-shelf-item":!0,"data-testid":e,...r},t)})),l=r(8459),d=r(3288),u=r(2322);var f=function(e){var{children:t,aspectRatio:r,loading:n=!0}=e;return n?(0,u.jsx)(o,{"data-fs-product-shelf-skeleton":!0,children:(0,u.jsx)(s,{className:"layout__content",children:Array.from({length:l.K},((e,t)=>(0,u.jsx)(c,{children:(0,u.jsx)(d.Z,{aspectRatio:r,sectioned:!0,bordered:!0})},String(t))))})}):(0,u.jsx)(u.Fragment,{children:t})},p=r(5184),m=r(737);var h=r(3432),v=r(2765),g=r(5045);const b={delta:10,preventScrollOnSwipe:!1,rotationAngle:0,trackMouse:!1,trackTouch:!0,swipeDuration:1/0,touchEventOptions:{passive:!0}},y={first:!0,initial:[0,0],start:0,swiping:!1,xy:[0,0]},w="mousemove",O="mouseup";function P(e,t){if(0===t)return e;const r=Math.PI/180*t;return[e[0]*Math.cos(r)+e[1]*Math.sin(r),e[1]*Math.cos(r)-e[0]*Math.sin(r)]}function j(e,t){const r=t=>{const r="touches"in t;r&&t.touches.length>1||e(((e,i)=>{i.trackMouse&&!r&&(document.addEventListener(w,n),document.addEventListener(O,a));const{clientX:o,clientY:s}=r?t.touches[0]:t,c=P([o,s],i.rotationAngle);return i.onTouchStartOrOnMouseDown&&i.onTouchStartOrOnMouseDown({event:t}),Object.assign(Object.assign(Object.assign({},e),y),{initial:c.slice(),xy:c,start:t.timeStamp||0})}))},n=t=>{e(((e,r)=>{const n="touches"in t;if(n&&t.touches.length>1)return e;if(t.timeStamp-e.start>r.swipeDuration)return e.swiping?Object.assign(Object.assign({},e),{swiping:!1}):e;const{clientX:i,clientY:a}=n?t.touches[0]:t,[o,s]=P([i,a],r.rotationAngle),c=o-e.xy[0],l=s-e.xy[1],d=Math.abs(c),u=Math.abs(l),f=(t.timeStamp||0)-e.start,p=Math.sqrt(d*d+u*u)/(f||1),m=[c/(f||1),l/(f||1)],h=function(e,t,r,n){return e>t?r>0?"Right":"Left":n>0?"Down":"Up"}(d,u,c,l),v="number"===typeof r.delta?r.delta:r.delta[h.toLowerCase()]||b.delta;if(d<v&&u<v&&!e.swiping)return e;const g={absX:d,absY:u,deltaX:c,deltaY:l,dir:h,event:t,first:e.first,initial:e.initial,velocity:p,vxvy:m};g.first&&r.onSwipeStart&&r.onSwipeStart(g),r.onSwiping&&r.onSwiping(g);let y=!1;return(r.onSwiping||r.onSwiped||r[`onSwiped${h}`])&&(y=!0),y&&r.preventScrollOnSwipe&&r.trackTouch&&t.cancelable&&t.preventDefault(),Object.assign(Object.assign({},e),{first:!1,eventData:g,swiping:!0})}))},i=t=>{e(((e,r)=>{let n;if(e.swiping&&e.eventData){if(t.timeStamp-e.start<r.swipeDuration){n=Object.assign(Object.assign({},e.eventData),{event:t}),r.onSwiped&&r.onSwiped(n);const i=r[`onSwiped${n.dir}`];i&&i(n)}}else r.onTap&&r.onTap({event:t});return r.onTouchEndOrOnMouseUp&&r.onTouchEndOrOnMouseUp({event:t}),Object.assign(Object.assign(Object.assign({},e),y),{eventData:n})}))},a=e=>{document.removeEventListener(w,n),document.removeEventListener(O,a),i(e)},o=(e,t)=>{let a=()=>{};if(e&&e.addEventListener){const o=Object.assign(Object.assign({},b.touchEventOptions),t.touchEventOptions),s=[["touchstart",r,o],["touchmove",n,Object.assign(Object.assign({},o),t.preventScrollOnSwipe?{passive:!1}:{})],["touchend",i,o]];s.forEach((([t,r,n])=>e.addEventListener(t,r,n))),a=()=>s.forEach((([t,r])=>e.removeEventListener(t,r)))}return a},s={ref:t=>{null!==t&&e(((e,r)=>{if(e.el===t)return e;const n={};return e.el&&e.el!==t&&e.cleanUpTouch&&(e.cleanUpTouch(),n.cleanUpTouch=void 0),r.trackTouch&&t&&(n.cleanUpTouch=o(t,r)),Object.assign(Object.assign(Object.assign({},e),{el:t}),n)}))}};return t.trackMouse&&(s.onMouseDown=r),[s,o]}function E(e){const{trackMouse:t}=e,r=a.useRef(Object.assign({},y)),n=a.useRef(Object.assign({},b)),i=a.useRef(Object.assign({},n.current));let o;for(o in i.current=Object.assign({},n.current),n.current=Object.assign(Object.assign({},b),e),b)void 0===n.current[o]&&(n.current[o]=b[o]);const[s,c]=a.useMemo((()=>j((e=>r.current=e(r.current,n.current)),{trackMouse:t})),[t]);return r.current=function(e,t,r,n){return t.trackTouch&&e.el?e.cleanUpTouch?t.preventScrollOnSwipe!==r.preventScrollOnSwipe||t.touchEventOptions.passive!==r.touchEventOptions.passive?(e.cleanUpTouch(),Object.assign(Object.assign({},e),{cleanUpTouch:n(e.el,t)})):e:Object.assign(Object.assign({},e),{cleanUpTouch:n(e.el,t)}):(e.cleanUpTouch&&e.cleanUpTouch(),Object.assign(Object.assign({},e),{cleanUpTouch:void 0}))}(r.current,n.current,i.current,c),s}function k(e,t){switch(t.type){case"NEXT_PAGE":{const t=e.infinite?e.totalPages+1:e.totalPages,r=(e.currentPage+1)%t,n=r%t*e.itemsPerPage;return{...e,sliding:!0,slideDirection:"next",currentItem:n,currentPage:r}}case"PREVIOUS_PAGE":{const t=e.infinite?e.totalPages+1:e.totalPages,r=e.infinite&&0===e.currentPage?-1:((e,t)=>(t-(t-e+1)%t)%t)(e.currentPage,e.totalPages);return{...e,sliding:!0,slideDirection:"previous",currentItem:r%t*e.itemsPerPage,currentPage:r}}case"GO_TO_PAGE":return t.payload.pageIndex===e.currentPage?e:{...e,sliding:t.payload.shouldSlide,slideDirection:t.payload.pageIndex>e.currentPage?"next":"previous",currentItem:t.payload.pageIndex%e.totalPages*e.itemsPerPage,currentPage:t.payload.pageIndex};case"STOP_SLIDE":return{...e,sliding:!1};default:return e}}const x=(e,t)=>{"next"===e&&t({type:"NEXT_PAGE"}),"previous"===e&&t({type:"PREVIOUS_PAGE"}),"number"===typeof e&&t({type:"GO_TO_PAGE",payload:{pageIndex:e,shouldSlide:!0}})},S=({totalItems:e,itemsPerPage:t=1,infiniteMode:r=!1,shouldSlideOnSwipe:n=!0,...i})=>{const[o,s]=(0,a.useReducer)(k,void 0,(()=>((e,t,r)=>({currentItem:0,currentPage:0,sliding:!1,slideDirection:"next",totalItems:e,itemsPerPage:t,totalPages:Math.ceil(e/t),infinite:r}))(e,t,r)));return{handlers:E({onSwipedRight:()=>n&&x("previous",s),onSwipedLeft:()=>n&&x("next",s),trackMouse:!0,...i}),slide:x,sliderState:o,sliderDispatch:s}};var _=r(7578);const I=(e,t,r)=>r?`Current page from ${e}`:`Go to page ${t+1} from ${e}`;var C=(0,a.forwardRef)((function({id:e,totalQuantity:t,activeBullet:r,onClick:n,testId:i="fs-carousel-bullets",ariaLabelGenerator:o=I,ariaControlsGenerator:s,...c},l){const d=(0,a.useMemo)((()=>Array(t).fill(0)),[t]);return a.createElement("div",{ref:l,"data-fs-carousel-bullets":!0,"data-testid":i,role:"tablist",...c},d.map(((t,c)=>{const l=r===c;return a.createElement(_.Z,{key:`${e}-${c}`,role:"tab",tabIndex:-1,"data-fs-carousel-bullet":!0,testId:`${i}-bullet`,onClick:e=>n(e,c),"aria-label":o(e,c,l),"aria-controls":s?.(c),"aria-selected":l,variant:"tertiary"})})))}));var Z=function({id:e,index:t,state:r,children:n,totalItems:i,infiniteMode:o,isScrollCarousel:s}){const{isItemVisible:c,shouldRenderItem:l}=(({currentSlide:e,itemsPerPage:t,totalItems:r})=>{const n=(0,a.useRef)(new Set);(0,a.useEffect)((()=>{for(let r=0;r<t;r++)n.current.add(e+r)}),[e,t]);const i=n=>function({itemsPerPage:e,currentSlide:t,slideIdx:r,totalItems:n}){return t<0||t>=n||r>=t&&r<t+e}({slideIdx:n,currentSlide:e,itemsPerPage:t,totalItems:r});return{shouldRenderItem:e=>n.current.has(e)||i(e),isItemVisible:i}})({totalItems:i,currentSlide:r.currentItem,itemsPerPage:r.itemsPerPage}),d=!s&&{width:"100%"}||s&&{maxWidth:"60%",display:"inline-block"},u=s||l(t-Number(o));return a.createElement("li",{style:d,id:`${e}-carousel-item-${t}`,"data-fs-carousel-item":!0,"data-fs-carousel-item-visible":c(t-Number(o))||void 0},u?n:null)};var R=function({children:e,className:t,"aria-label":r,infiniteMode:n=!0,controls:i="complete",testId:o="fs-carousel",transition:s={duration:400,property:"transform"},id:c="fs-carousel",variant:l="slide",itemsPerPage:d=1,navigationIcons:u,...f}){const p=(0,a.useRef)(null),m="slide"===l,h="scroll"===l,b=a.Children.toArray(e),y=b.length,w=n?y+2:y,O=`${s.property} ${s.duration}ms ${s.timing??""} ${s.delay??""}`,{handlers:P,slide:j,sliderState:E,sliderDispatch:k}=S({itemsPerPage:d,infiniteMode:n,totalItems:y,shouldSlideOnSwipe:m,...f}),x=Math.ceil(y/E.itemsPerPage),_=1!==x&&("complete"===i||"navigationArrows"===i),I=1!==x&&("complete"===i||"paginationBullets"===i),R=(0,a.useMemo)((()=>((e,t)=>{const r={},n=100/t;for(let i=0;i<t;++i){const t=-n*i;r[e?i-1:i]=t}return r})(n,w)),[w,n]),D=n&&e?b.slice(0,1):[],V=(n&&e?b.slice(y-1):[]).concat(e??[],D),M=(0,a.useMemo)((()=>({display:"flex",width:100*w+"%",transition:E.sliding?O:void 0,transform:`translate3d(${R[E.currentPage]}%, 0, 0)`})),[w,R,O,E.sliding,E.currentPage]),T=(0,a.useMemo)((()=>({width:"100%",display:"block",overflowX:"scroll",whiteSpace:"nowrap"})),[]),N=m&&M||h&&T,A=()=>{E.sliding||!n&&0===E.currentPage||j("previous",k)},B=()=>{E.sliding||!n&&E.currentPage===y-1||j("next",k)},L=async(e,t)=>{if("previous"===t&&0===E.currentPage)return;if("next"===t&&E.currentPage===E.totalPages-1)return;let r;const n=Number(p.current?.firstElementChild?.clientWidth);r=d>1?e*n*d:e*n-.125*n,p.current?.scrollTo({left:r,behavior:"smooth"}),j(e,k)};return a.createElement("section",{id:c,"data-fs-carousel":!0,className:t,"data-testid":o,"aria-label":r},a.createElement("div",{"data-fs-carousel-track-container":!0,style:{width:"100%",overflow:"hidden",display:h?"block":void 0},...P},a.createElement("ul",{"aria-live":"polite",ref:p,style:N,"data-fs-carousel-track":!0,onScroll:e=>{if(m||d>1)return;const t=Number(e.currentTarget.firstElementChild?.scrollWidth),r=e.currentTarget?.scrollLeft,n=(r>t/2?Math.round:Math.floor)(r/t);j(n,k)},onTransitionEnd:()=>{k({type:"STOP_SLIDE"}),n&&E.currentItem>=y&&k({type:"GO_TO_PAGE",payload:{pageIndex:0,shouldSlide:!1}}),n&&E.currentItem<0&&k({type:"GO_TO_PAGE",payload:{pageIndex:E.totalPages-1,shouldSlide:!1}})}},V.map(((e,t)=>a.createElement(Z,{id:c,index:t,key:String(t),state:E,totalItems:y,infiniteMode:n,isScrollCarousel:h},e))))),_&&a.createElement("div",{"data-fs-carousel-controls":!0},a.createElement(v.Z,{"data-fs-carousel-control":"left","aria-controls":c,"aria-label":"previous",icon:u?.left??a.createElement(g.Z,{name:"ArrowLeft",width:20,height:20,weight:"bold"}),onClick:()=>{m&&A(),h&&L(E.currentPage-1,"previous")}}),a.createElement(v.Z,{"data-fs-carousel-control":"right","aria-controls":c,"aria-label":"next",icon:u?.right??a.createElement(g.Z,{name:"ArrowRight",width:20,height:20,weight:"bold"}),onClick:()=>{m&&B(),h&&L(E.currentPage+1,"next")}})),I&&a.createElement(C,{id:c,tabIndex:0,activeBullet:E.currentPage,totalQuantity:x,onKeyDown:e=>{switch(e.key){case"ArrowLeft":m&&A(),h&&L(E.currentPage-1,"previous");break;case"ArrowRight":m&&B(),h&&L(E.currentPage+1,"next");break;case"Home":j(0,k);break;case"End":j(y-1,k)}},onClick:async(e,t)=>{m&&!E.sliding&&j(t,k),h&&L(t)},onFocus:e=>e.currentTarget.focus(),ariaControlsGenerator:e=>`${c}-carousel-item-${e}`}))};var D=function(e){var{id:t,testId:r,children:n,itemsPerPage:i=5}=e,a=window.innerWidth<=768;return(0,u.jsx)(R,{id:t,testId:r,variant:"scroll",infiniteMode:!1,itemsPerPage:a?1:i,children:n})},V={name:"ProductShelf",components:{ProductShelf:{props:{}},__experimentalCarousel:{props:{}},__experimentalProductCard:{props:{}}}};function M(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}var T={},N={};Object.entries(V.components).forEach((e=>{var[t,r]=e;r.Component&&(T[t]=r.Component)})),Object.entries(V.components).forEach((e=>{var[t,r]=e;r.props&&(N[t]=r.props)}));var A=function(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?M(Object(r),!0).forEach((function(t){(0,n.Z)(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):M(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}({ProductShelf:o,__experimentalCarousel:D,__experimentalProductCard:h.Z},T),B=["title","inView","productCardConfiguration"];function L(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function G(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?L(Object(r),!0).forEach((function(t){(0,n.Z)(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):L(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}var{ProductShelf:U,__experimentalCarousel:$,__experimentalProductCard:z}=A;var F=function(e){var t,{title:r,inView:n,productCardConfiguration:{bordered:o=N.__experimentalProductCard.bordered,showDiscountBadge:s=N.__experimentalProductCard.showDiscountBadge}={}}=e,c=(0,i.Z)(e,B),l=function(e){var t,r=e.replace(/[^\w\s]/gi,"-");return null!==(t=r=(r=r.replace(/\s+/g,"-")).toLowerCase())&&void 0!==t?t:""}(r),d=(0,a.useId)(),h=(0,a.useRef)(!1),v=(0,m.kN)(c),g=null!==(t=null===v||void 0===v?void 0:v.edges)&&void 0!==t?t:[],{sendViewItemListEvent:b}=(0,p.m)({products:g,title:r,page:0,pageSize:0});return(0,a.useEffect)((()=>{n&&!h.current&&g.length&&(b(),h.current=!0)}),[n,g.length,b]),0===(null===v||void 0===v?void 0:v.edges.length)?null:(0,u.jsxs)(u.Fragment,{children:[(0,u.jsx)("h2",{className:"text__title-section layout__content",children:r}),(0,u.jsx)(f,{aspectRatio:1,loading:void 0===v,children:(0,u.jsx)(U,G(G({},N.ProductShelfWrapper),{},{children:(0,u.jsx)($,G(G({id:l||d},N.__experimentalCarousel),{},{children:g.map(((e,t)=>(0,a.createElement)(z,G(G({aspectRatio:1,imgProps:{width:216,height:216,sizes:"(max-width: 768px) 42vw, 30vw"}},N.__experimentalProductCard),{},{bordered:o,showDiscountBadge:s,key:"".concat(e.node.id),product:e.node,index:t+1}))))}))}))})]})}},8459:function(e,t,r){"use strict";r.d(t,{K:function(){return i},g:function(){return n}});var n=12,i=5},5184:function(e,t,r){"use strict";r.d(t,{m:function(){return o}});var n=r(1072),i=r(2784),a=r(7295),o=e=>{var{products:t,title:r,page:o,pageSize:s}=e,{currency:{code:c}}=(0,a.kP)();return{sendViewItemListEvent:(0,i.useCallback)((()=>{(0,n._)({name:"view_item_list",params:{item_list_name:r,item_list_id:r,items:t.map(((e,t)=>{var{node:r}=e;return{item_id:r.isVariantOf.productGroupID,item_name:r.isVariantOf.name,item_brand:r.brand.name,item_variant:r.sku,price:r.offers.offers[0].price,index:o*s+t+1,discount:r.offers.offers[0].listPrice-r.offers.offers[0].price,currency:c,item_variant_name:r.name,product_reference_id:r.gtin}}))}})}),[c,t,r,o,s])}}},5346:function(e,t,r){"use strict";r.d(t,{P:function(){return a}});var n=r(2784),i=r(7295),a=e=>{var t=function(){var{decimals:e}=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},{currency:t,locale:r}=(0,i.kP)();return(0,n.useCallback)((n=>Intl.NumberFormat(r,{style:"currency",currency:t.code,minimumFractionDigits:e?2:0}).format(n)),[t.code,r,e])}();return(0,n.useMemo)((()=>t(e)),[t,e])}},9854:function(e,t,r){"use strict";r.d(t,{w:function(){return o}});var n=r(1072),i=r(2784),a=r(7295),o=e=>{var{index:t,product:r,selectedOffer:o}=e,{slug:s}=r,{currency:{code:c}}=(0,a.kP)(),l=(0,i.useCallback)((()=>{(0,n._)({name:"select_item",params:{items:[{item_id:r.isVariantOf.productGroupID,item_name:r.isVariantOf.name,item_brand:r.brand.name,item_variant:r.sku,index:t,price:r.offers.offers[o].price,discount:r.offers.offers[o].listPrice-r.offers.offers[o].price,currency:c,item_variant_name:r.name,product_reference_id:r.gtin}]}}),(0,n._)({name:"search_select_item",params:{url:window.location.href,items:[{item_id:r.isVariantOf.productGroupID,item_variant:r.sku,index:t}]}})}),[c,r,t,o]);return{href:"/".concat(s,"/p"),onClick:l,"data-testid":"product-link"}}},737:function(e,t,r){"use strict";r.d(t,{yb:function(){return h},kN:function(){return v},BG:function(){return g}});var n=r(9499),i=r(2784),a=r(9857),o=r(8459),s=r(4730),c=r(180),l=r(7732),d=["cache"],u=r(7295);function f(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function p(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?f(Object(r),!0).forEach((function(t){(0,n.Z)(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):f(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}var m="ProductsQuery",h=e=>{var{first:t,after:r,sort:n,term:a,selectedFacets:s}=e,{channel:c,locale:l}=(0,u.kP)();return(0,i.useMemo)((()=>{var e,i=(e=s,Array.isArray(e)?e:e?[e]:[]);return{first:null!==t&&void 0!==t?t:o.K,after:null!==r&&void 0!==r?r:"0",sort:null!==n&&void 0!==n?n:"score_desc",term:null!==a&&void 0!==a?a:"",selectedFacets:[...i,{key:"channel",value:null!==c&&void 0!==c?c:""},{key:"locale",value:l}]}}),[s,t,r,n,a,c,l])},v=(e,t)=>{var r,n=h(e),{data:i}=(0,l.aM)(m,n,p({fallbackData:null,suspense:!0},t));return null===i||void 0===i||null===(r=i.search)||void 0===r?void 0:r.products},g=(e,t)=>{var r=h(e),{cache:n}=(0,a.kY)();return(0,i.useCallback)((()=>((e,t,r)=>{var{cache:n}=r,i=(0,s.Z)(r,d),o=(0,l.km)(e,t);n.get(o)||(0,a.JG)(o,(0,c.W)(e,t,i))})(m,r,p({cache:n},t))),[r,n,t])}},1778:function(e){e.exports={section:"section_section__kRRBW"}},3262:function(e){e.exports={section:"section_section__C1DoH",loading:"section_loading__k5bCF"}}}]);