@faststore/core 2.1.14 → 2.1.16

package/lighthouserc.js

@@ -19,5 +19,6 @@ module.exports = lhConfig({
     deprecations: 'warn',
     'resource-summary:stylesheet:count': ['warn', { maxNumericValue: 400 }],
     'resource-summary:script:count': ['warn', { maxNumericValue: 20 }],
+    'resource-summary:script:size': ['error', { maxNumericValue: 210 * 1024 }],
   },
 })

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@faststore/core",
-  "version": "2.1.14",
+  "version": "2.1.16",
   "license": "MIT",
   "browserslist": "supports es6-module and not dead",
   "scripts": {
@@ -30,10 +30,10 @@
     "@envelop/parser-cache": "^2.2.0",
     "@envelop/validation-cache": "^2.2.0",
     "@faststore/api": "^2.1.9",
-    "@faststore/components": "^2.1.9",
+    "@faststore/components": "^2.1.16",
     "@faststore/graphql-utils": "^2.1.9",
     "@faststore/sdk": "^2.1.9",
-    "@faststore/ui": "^2.1.9",
+    "@faststore/ui": "^2.1.16",
     "@types/react": "^18.0.14",
     "@vtex/client-cms": "^0.2.12",
     "autoprefixer": "^10.4.0",
@@ -110,5 +110,5 @@
   "msw": {
     "workerDirectory": "public"
   },
-  "gitHead": "51ae4e321b9f68d9ec93d1b59d4b18b7d3f3e53e"
+  "gitHead": "a1b180b75407f3e4064b4637e8595e8aab130a2e"
 }

package/src/components/navigation/Navbar/Navbar.tsx

@@ -1,4 +1,4 @@
-import { useRef, useState } from 'react'
+import { useRef, useState, useCallback } from 'react'
 
 import { useUI, useScrollDirection, Icon as UIIcon } from '@faststore/ui'
 
@@ -88,10 +88,15 @@ function Navbar({
   const searchMobileRef = useRef<SearchInputRef>(null)
   const [searchExpanded, setSearchExpanded] = useState(false)
 
-  const handlerExpandSearch = () => {
+  const handlerExpandSearch = useCallback(() => {
     setSearchExpanded(true)
     searchMobileRef.current?.inputRef?.focus()
-  }
+  }, [])
+
+  const handleCollapseSearch = useCallback(() => {
+    setSearchExpanded(false)
+    searchMobileRef.current?.resetSearchInput()
+  }, [])
 
   return (
     <NavbarWrapper scrollDirection={scrollDirection} {...Props['Navbar']}>
@@ -129,10 +134,7 @@ function Navbar({
                 data-fs-button-collapse
                 aria-label="Collapse search bar"
                 icon={<UIIcon name="CaretLeft" width={32} height={32} />}
-                onClick={() => {
-                  setSearchExpanded(false)
-                  searchMobileRef.current?.resetSearchInput()
-                }}
+                onClick={handleCollapseSearch}
                 {...Props['IconButton']}
               />
             )}

package/src/components/product/ProductCard/ProductCard.tsx

@@ -4,7 +4,7 @@ import {
   ProductCardContent as UIProductCardContent,
   ProductCardImage as UIProductCardImage,
 } from '@faststore/ui'
-import { memo } from 'react'
+import { memo, useMemo } from 'react'
 
 import type { ProductSummary_ProductFragment } from '@generated/graphql'
 import { ImageProps } from 'next/future/image'
@@ -83,7 +83,10 @@ function ProductCard({
     prefetch: false,
   }
 
-  const outOfStock = availability !== 'https://schema.org/InStock'
+  const outOfStock = useMemo(
+    () => availability !== 'https://schema.org/InStock',
+    [availability]
+  )
 
   return (
     <UIProductCard

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

@@ -1,5 +1,5 @@
 import { Button as UIButton, InputField as UIInputField } from '@faststore/ui'
-import { ComponentPropsWithRef, FormEvent } from 'react'
+import { ComponentPropsWithRef, FormEvent, useMemo } from 'react'
 import { forwardRef, useRef } from 'react'
 import { convertFromRaw } from 'draft-js'
 import { stateToHTML } from 'draft-js-export-html'
@@ -10,12 +10,15 @@ 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: {
@@ -106,13 +109,16 @@ const Newsletter = forwardRef<HTMLFormElement, NewsletterProps>(
       card,
       toastSubscribe,
       toastSubscribeError,
-      ...otherProps
     },
     ref
   ) {
     const { subscribeUser, loading, data } = useNewsletter()
     const nameInputRef = useRef<HTMLInputElement>(null)
     const emailInputRef = useRef<HTMLInputElement>(null)
+    const subscriptionButtonLabel = useMemo(
+      () => (loading ? subscribeButtonLoadingLabel : subscribeButtonLabel),
+      [loading, subscribeButtonLabel, subscribeButtonLoadingLabel]
+    )
 
     const { pushToast } = useUI()
 
@@ -129,13 +135,15 @@ const Newsletter = forwardRef<HTMLFormElement, NewsletterProps>(
         pushToast({
           ...toastSubscribe,
           status: 'INFO',
-          icon: <Icon name={toastSubscribe.icon} width={30} height={30} />,
+          icon: <Icon name={toastSubscribe?.icon} width={30} height={30} />,
         })
       } else {
         pushToast({
           ...toastSubscribeError,
           status: 'ERROR',
-          icon: <Icon name={toastSubscribeError.icon} width={30} height={30} />,
+          icon: (
+            <Icon name={toastSubscribeError?.icon} width={30} height={30} />
+          ),
         })
       }
 
@@ -147,10 +155,9 @@ const Newsletter = forwardRef<HTMLFormElement, NewsletterProps>(
     return (
       <div data-fs-newsletter={card ? 'card' : ''}>
         <form
-          data-fs-newsletter-form
           ref={ref}
+          data-fs-newsletter-form
           onSubmit={handleSubmit}
-          {...otherProps}
           className="layout__content"
         >
           <header data-fs-newsletter-header>
@@ -162,32 +169,58 @@ const Newsletter = forwardRef<HTMLFormElement, NewsletterProps>(
           </header>
 
           <div data-fs-newsletter-controls>
-            <>
-              {displayNameInput ? (
+            {displayNameInput ? (
+              <>
                 <UIInputField
-                  inputRef={nameInputRef}
+                  required
                   id="newsletter-name"
                   label={nameInputLabel}
+                  inputRef={nameInputRef}
+                />
+                <UIInputField
+                  required
+                  type="email"
+                  id="newsletter-email"
+                  label={emailInputLabel}
+                  inputRef={emailInputRef}
+                />
+                <span
+                  data-fs-newsletter-addendum
+                  dangerouslySetInnerHTML={{
+                    __html: cmsToHtml(privacyPolicy),
+                  }}
+                />
+                <UIButton
+                  variant="secondary"
+                  inverse
+                  type="submit"
+                  aria-label={subscriptionButtonLabel}
+                >
+                  {subscriptionButtonLabel}
+                </UIButton>
+              </>
+            ) : (
+              <>
+                <UIInputField
                   required
+                  actionable
+                  type="email"
+                  id="newsletter-email"
+                  label={emailInputLabel}
+                  inputRef={emailInputRef}
+                  onClear={() => null}
+                  onSubmit={() => null}
+                  displayClearButton={false}
+                  buttonActionText={subscriptionButtonLabel}
+                />
+                <span
+                  data-fs-newsletter-addendum
+                  dangerouslySetInnerHTML={{
+                    __html: cmsToHtml(privacyPolicy),
+                  }}
                 />
-              ) : 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>

package/.next/BUILD_ID

@@ -1 +0,0 @@
-pDkGOqwrvVbN2os-F1GC4

package/.next/build-manifest.json

@@ -1,125 +0,0 @@
-{
-  "polyfillFiles": [
-    "static/chunks/polyfills-c67a75d1b6f99dc8.js"
-  ],
-  "devFiles": [],
-  "ampDevFiles": [],
-  "lowPriorityFiles": [
-    "static/pDkGOqwrvVbN2os-F1GC4/_buildManifest.js",
-    "static/pDkGOqwrvVbN2os-F1GC4/_ssgManifest.js"
-  ],
-  "rootMainFiles": [],
-  "pages": {
-    "/": [
-      "static/chunks/webpack-3eefca84f4c29194.js",
-      "static/chunks/framework-dfd14d7ce6600b03.js",
-      "static/chunks/main-fd466221927468fd.js",
-      "static/chunks/738-a5ff304828f20cbf.js",
-      "static/chunks/548-6b23e7ad82cd22b9.js",
-      "static/css/23a9d5dfc051ec6e.css",
-      "static/chunks/682-5cfea9ed52851ed1.js",
-      "static/css/0cb9134bc2d237e2.css",
-      "static/chunks/483-eda59544da21c849.js",
-      "static/css/0d62ff2d64099b84.css",
-      "static/chunks/pages/index-4f3314ad44c30b8f.js"
-    ],
-    "/404": [
-      "static/chunks/webpack-3eefca84f4c29194.js",
-      "static/chunks/framework-dfd14d7ce6600b03.js",
-      "static/chunks/main-fd466221927468fd.js",
-      "static/chunks/738-a5ff304828f20cbf.js",
-      "static/css/23a9d5dfc051ec6e.css",
-      "static/chunks/682-5cfea9ed52851ed1.js",
-      "static/css/e02cdad8fc000339.css",
-      "static/chunks/pages/404-c3b320b915df45bb.js"
-    ],
-    "/500": [
-      "static/chunks/webpack-3eefca84f4c29194.js",
-      "static/chunks/framework-dfd14d7ce6600b03.js",
-      "static/chunks/main-fd466221927468fd.js",
-      "static/chunks/738-a5ff304828f20cbf.js",
-      "static/css/23a9d5dfc051ec6e.css",
-      "static/chunks/682-5cfea9ed52851ed1.js",
-      "static/css/e02cdad8fc000339.css",
-      "static/chunks/pages/500-d37a3a2e931f6995.js"
-    ],
-    "/[...slug]": [
-      "static/chunks/webpack-3eefca84f4c29194.js",
-      "static/chunks/framework-dfd14d7ce6600b03.js",
-      "static/chunks/main-fd466221927468fd.js",
-      "static/chunks/738-a5ff304828f20cbf.js",
-      "static/css/23a9d5dfc051ec6e.css",
-      "static/chunks/682-5cfea9ed52851ed1.js",
-      "static/css/d4a0d9df8c6df555.css",
-      "static/chunks/791-727eda8f766aa791.js",
-      "static/css/6e41f1b6078c14c1.css",
-      "static/chunks/pages/[...slug]-7370214f166e8584.js"
-    ],
-    "/[slug]/p": [
-      "static/chunks/webpack-3eefca84f4c29194.js",
-      "static/chunks/framework-dfd14d7ce6600b03.js",
-      "static/chunks/main-fd466221927468fd.js",
-      "static/chunks/738-a5ff304828f20cbf.js",
-      "static/chunks/548-6b23e7ad82cd22b9.js",
-      "static/css/23a9d5dfc051ec6e.css",
-      "static/chunks/682-5cfea9ed52851ed1.js",
-      "static/css/0cb9134bc2d237e2.css",
-      "static/chunks/483-eda59544da21c849.js",
-      "static/css/0f8ce5203de8ae6f.css",
-      "static/chunks/pages/[slug]/p-7b946d76b9f0d9db.js"
-    ],
-    "/_app": [
-      "static/chunks/webpack-3eefca84f4c29194.js",
-      "static/chunks/framework-dfd14d7ce6600b03.js",
-      "static/chunks/main-fd466221927468fd.js",
-      "static/css/104f0f3ce3be32c6.css",
-      "static/chunks/pages/_app-79d333aa6001a806.js"
-    ],
-    "/_error": [
-      "static/chunks/webpack-3eefca84f4c29194.js",
-      "static/chunks/framework-dfd14d7ce6600b03.js",
-      "static/chunks/main-fd466221927468fd.js",
-      "static/chunks/pages/_error-a7a0c1d9bfbb4f38.js"
-    ],
-    "/account": [
-      "static/chunks/webpack-3eefca84f4c29194.js",
-      "static/chunks/framework-dfd14d7ce6600b03.js",
-      "static/chunks/main-fd466221927468fd.js",
-      "static/chunks/738-a5ff304828f20cbf.js",
-      "static/css/23a9d5dfc051ec6e.css",
-      "static/chunks/682-5cfea9ed52851ed1.js",
-      "static/chunks/pages/account-86a1b6e7db03bab6.js"
-    ],
-    "/checkout": [
-      "static/chunks/webpack-3eefca84f4c29194.js",
-      "static/chunks/framework-dfd14d7ce6600b03.js",
-      "static/chunks/main-fd466221927468fd.js",
-      "static/chunks/738-a5ff304828f20cbf.js",
-      "static/css/23a9d5dfc051ec6e.css",
-      "static/chunks/682-5cfea9ed52851ed1.js",
-      "static/chunks/pages/checkout-c77dbc66c0b35ec3.js"
-    ],
-    "/login": [
-      "static/chunks/webpack-3eefca84f4c29194.js",
-      "static/chunks/framework-dfd14d7ce6600b03.js",
-      "static/chunks/main-fd466221927468fd.js",
-      "static/chunks/738-a5ff304828f20cbf.js",
-      "static/css/23a9d5dfc051ec6e.css",
-      "static/chunks/682-5cfea9ed52851ed1.js",
-      "static/css/e02cdad8fc000339.css",
-      "static/chunks/pages/login-bbf85bc59afce37c.js"
-    ],
-    "/s": [
-      "static/chunks/webpack-3eefca84f4c29194.js",
-      "static/chunks/framework-dfd14d7ce6600b03.js",
-      "static/chunks/main-fd466221927468fd.js",
-      "static/chunks/738-a5ff304828f20cbf.js",
-      "static/css/23a9d5dfc051ec6e.css",
-      "static/chunks/682-5cfea9ed52851ed1.js",
-      "static/css/d4a0d9df8c6df555.css",
-      "static/chunks/791-727eda8f766aa791.js",
-      "static/chunks/pages/s-dd486933e8ba7fbf.js"
-    ]
-  },
-  "ampFirstPages": []
-}