@faststore/core 2.0.125-alpha.0 → 2.0.129-alpha.0

package/.turbo/turbo-build.log

@@ -14,48 +14,36 @@ info  - Using external babel configuration from /home/runner/work/faststore/fast
 info  - Compiled successfully
 info  - Collecting page data...
 info  - Generating static pages (0/7)
-warn - Children not found. Add a new component for this section or remove it from the CMS
-warn - Children not found. Add a new component for this section or remove it from the CMS
 info  - Generating static pages (1/7)
-warn - Children not found. Add a new component for this section or remove it from the CMS
-warn - Children not found. Add a new component for this section or remove it from the CMS
-warn - Children not found. Add a new component for this section or remove it from the CMS
-warn - Children not found. Add a new component for this section or remove it from the CMS
 info  - Generating static pages (3/7)
-warn - Children not found. Add a new component for this section or remove it from the CMS
-warn - Children not found. Add a new component for this section or remove it from the CMS
 warn - CallToAction not found. Add a new component for this section or remove it from the CMS
 warn - CallToAction not found. Add a new component for this section or remove it from the CMS
 warn - CallToAction not found. Add a new component for this section or remove it from the CMS
-warn - Children not found. Add a new component for this section or remove it from the CMS
-warn - Children not found. Add a new component for this section or remove it from the CMS
 info  - Generating static pages (5/7)
-warn - Children not found. Add a new component for this section or remove it from the CMS
-warn - Children not found. Add a new component for this section or remove it from the CMS
 info  - Generating static pages (7/7)
 info  - Finalizing page optimization...
 
 Route (pages)                              Size     First Load JS
-┌ ● /                                      2.85 kB         122 kB
+┌ ● /                                      2.85 kB         126 kB
 ├   └ css/7a8417de90d11c60.css             7.06 kB
-├   /_app                                  0 B            77.8 kB
-├ ● /[...slug]                             9.64 kB         129 kB
-├   └ css/4e0fc649e912b30f.css             6.98 kB
-├ ● /[slug]/p                              11.2 kB         131 kB
+├   /_app                                  0 B            77.9 kB
+├ ● /[...slug]                             7.74 kB         133 kB
+├   └ css/326e215d7b09f642.css             7.72 kB
+├ ● /[slug]/p                              11.2 kB         135 kB
 ├   └ css/4b7b7b64ae6afe67.css             9.14 kB
 ├ ○ /404                                   951 B           110 kB
 ├ ● /500                                   718 B           110 kB
 ├ ● /account                               669 B           110 kB
-├ λ /api/graphql                           0 B            77.8 kB
-├ λ /api/preview                           0 B            77.8 kB
+├ λ /api/graphql                           0 B            77.9 kB
+├ λ /api/preview                           0 B            77.9 kB
 ├ ● /checkout                              657 B           110 kB
 ├ ● /login                                 868 B           110 kB
 └ ● /s                                     961 B           121 kB
-+ First Load JS shared by all              80.6 kB
++ First Load JS shared by all              80.7 kB
   ├ chunks/framework-dfd14d7ce6600b03.js   45.3 kB
   ├ chunks/main-9746772201fe3ac1.js        23.9 kB
   ├ chunks/pages/_app-b601536188b9a919.js  6.43 kB
-  ├ chunks/webpack-aff0e2e4ba699b8a.js     2.24 kB
+  ├ chunks/webpack-02fe78a6d63f52e6.js     2.25 kB
   └ css/587c27bbda64e700.css               2.8 kB
 
 λ  (Server)  server-side renders at runtime (uses getInitialProps or getServerSideProps)

package/CHANGELOG.md

@@ -3,6 +3,18 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [2.0.129-alpha.0](https://github.com/vtex/faststore/compare/v2.0.128-alpha.0...v2.0.129-alpha.0) (2023-05-04)
+
+### Features
+
+- Update content-type to globalSections ([#1744](https://github.com/vtex/faststore/issues/1744)) ([f6c5d1d](https://github.com/vtex/faststore/commit/f6c5d1df2ea093b7c1d371b91e3e828bdc7243f6))
+
+## [2.0.128-alpha.0](https://github.com/vtex/faststore/compare/v2.0.127-alpha.0...v2.0.128-alpha.0) (2023-05-04)
+
+### Features
+
+- Adds `Carousel` Component 782 ([#1735](https://github.com/vtex/faststore/issues/1735)) ([a4d5156](https://github.com/vtex/faststore/commit/a4d5156404f47ce22fe2f9b5141b446f987bccbc))
+
 ## [2.0.125-alpha.0](https://github.com/vtex/faststore/compare/v2.0.124-alpha.0...v2.0.125-alpha.0) (2023-05-03)
 
 **Note:** Version bump only for package @faststore/core

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@faststore/core",
-  "version": "2.0.125-alpha.0",
+  "version": "2.0.129-alpha.0",
   "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.0.118-alpha.0",
-    "@faststore/components": "^2.0.123-alpha.0",
+    "@faststore/components": "^2.0.128-alpha.0",
     "@faststore/graphql-utils": "^2.0.3-alpha.0",
     "@faststore/sdk": "^2.0.118-alpha.0",
-    "@faststore/ui": "^2.0.122-alpha.0",
+    "@faststore/ui": "^2.0.128-alpha.0",
     "@types/react": "^18.0.14",
     "@vtex/client-cms": "^0.2.12",
     "autoprefixer": "^10.4.0",
@@ -108,5 +108,5 @@
   "msw": {
     "workerDirectory": "public"
   },
-  "gitHead": "71f126c7a26db0154582eb128159062fef5c80df"
+  "gitHead": "a169adddff8684854585cc6fcad7733a896d464a"
 }

package/src/components/cms/GlobalSections.tsx

@@ -12,8 +12,7 @@ import Navbar from 'src/components/navigation/Navbar'
 import Alert from 'src/components/sections/Alert/Alert'
 import RenderSections from './RenderSections'
 
-// TODO: When the CMS is finished, switch to using 'globalSections'.
-export const GLOBAL_SECTIONS_CONTENT_TYPE = 'globalAlert'
+export const GLOBAL_SECTIONS_CONTENT_TYPE = 'globalSections'
 
 export type GlobalSectionsData = {
   sections: Section[]

package/src/components/cms/RenderSections.tsx

@@ -1,5 +1,5 @@
 import chalk from 'chalk'
-import { ComponentType, PropsWithChildren, ReactNode, useMemo } from 'react'
+import { ComponentType } from 'react'
 
 import SectionBoundary from './SectionBoundary'
 

package/src/components/sections/ProductShelf/ProductShelf.tsx

@@ -1,11 +1,7 @@
 import { useEffect, useRef } from 'react'
 import { useInView } from 'react-intersection-observer'
 
-import {
-  ProductShelfItem,
-  ProductShelfItems,
-  ProductShelf as UIProductShelf,
-} from '@faststore/ui'
+import { ProductShelf as UIProductShelf } from '@faststore/ui'
 
 import type { ProductsQueryQueryVariables } from '@generated/graphql'
 import ProductShelfSkeleton from 'src/components/skeletons/ProductShelfSkeleton'
@@ -15,6 +11,7 @@ import { useProductsQuery } from 'src/sdk/product/useProductsQuery'
 import { Components } from './Overrides'
 const { ProductCard } = Components
 import Section from '../Section'
+import Carousel from '../../ui/Carousel'
 
 import styles from './section.module.scss'
 
@@ -66,17 +63,17 @@ function ProductShelf({
         loading={products === undefined}
       >
         <UIProductShelf>
-          <ProductShelfItems className="layout__content">
+          <Carousel>
             {productEdges.map((product, idx) => (
-              <ProductShelfItem key={`${product.node.id}`}>
-                <ProductCard
-                  product={product.node}
-                  index={idx + 1}
-                  aspectRatio={aspectRatio}
-                />
-              </ProductShelfItem>
+              <ProductCard
+                bordered
+                key={`${product.node.id}`}
+                product={product.node}
+                index={idx + 1}
+                aspectRatio={aspectRatio}
+              />
             ))}
-          </ProductShelfItems>
+          </Carousel>
         </UIProductShelf>
       </ProductShelfSkeleton>
     </Section>

package/src/components/sections/ProductShelf/section.module.scss

@@ -2,6 +2,25 @@
 @import "@faststore/ui/src/styles/base/utilities.scss";
 
 .section {
+  [data-fs-product-shelf-skeleton] {
+    --fs-carousel-item-width-tablet    : 14.2rem;
+    --fs-carousel-item-margin-right    : var(--fs-spacing-3);
+
+    padding-bottom: var(--fs-spacing-5);
+
+    @include media("<tablet") {
+      [data-fs-product-shelf-item] {
+        &:not(:last-of-type) {
+          margin-right: var(--fs-carousel-item-margin-right);
+        }
+      }
+
+      [data-fs-product-card-skeleton] {
+        width: var(--fs-carousel-item-width-tablet);
+      }
+    }
+  }
+
   @import "@faststore/ui/src/components/atoms/Badge/styles";
   @import "@faststore/ui/src/components/atoms/Button/styles";
   @import "@faststore/ui/src/components/atoms/Icon/styles";
@@ -9,6 +28,7 @@
   @import "@faststore/ui/src/components/atoms/Price/styles";
   @import "@faststore/ui/src/components/atoms/SROnly/styles";
   @import "@faststore/ui/src/components/atoms/Skeleton/styles";
+  @import "@faststore/ui/src/components/molecules/Carousel/styles";
   @import "@faststore/ui/src/components/molecules/DiscountBadge/styles";
   @import "@faststore/ui/src/components/molecules/Rating/styles";
   @import "@faststore/ui/src/components/molecules/ProductCard/styles";

package/src/components/skeletons/ProductShelfSkeleton/ProductShelfSkeleton.tsx

@@ -21,11 +21,11 @@ function ProductShelfSkeleton({
   loading = true,
 }: PropsWithChildren<Props>) {
   return loading ? (
-    <UIProductShelf>
+    <UIProductShelf data-fs-product-shelf-skeleton>
       <ProductShelfItems className="layout__content">
         {Array.from({ length: ITEMS_PER_SECTION }, (_, index) => (
           <ProductShelfItem key={String(index)}>
-            <ProductCardSkeleton aspectRatio={aspectRatio} sectioned />
+            <ProductCardSkeleton aspectRatio={aspectRatio} sectioned bordered />
           </ProductShelfItem>
         ))}
       </ProductShelfItems>

package/src/components/ui/Carousel/Carousel.tsx

@@ -1,8 +1,6 @@
-import type { CarouselProps as UICarouselProps } from '@faststore/ui'
-import { Carousel as UICarousel, Icon } from '@faststore/ui'
 import type { PropsWithChildren } from 'react'
-
-import styles from './carousel.module.scss'
+import { Carousel as UICarousel } from '@faststore/ui'
+import type { CarouselProps as UICarouselProps } from '@faststore/ui'
 
 export type CarouselProps = {
   id?: string
@@ -24,12 +22,7 @@ function Carousel({
       testId={testId}
       variant="scroll"
       infiniteMode={false}
-      className={styles.fsCarousel}
       itemsPerPage={isMobile ? 1 : itemsPerPage}
-      navigationIcons={{
-        left: <Icon width={20} height={20} weight="bold" name="ArrowLeft" />,
-        right: <Icon width={20} height={20} weight="bold" name="ArrowRight" />,
-      }}
     >
       {children}
     </UICarousel>

package/.next/BUILD_ID

@@ -1 +0,0 @@
-E3svUtP3jVTE--NFE5Ka5

package/.next/build-manifest.json

@@ -1,120 +0,0 @@
-{
-  "polyfillFiles": [
-    "static/chunks/polyfills-c67a75d1b6f99dc8.js"
-  ],
-  "devFiles": [],
-  "ampDevFiles": [],
-  "lowPriorityFiles": [
-    "static/E3svUtP3jVTE--NFE5Ka5/_buildManifest.js",
-    "static/E3svUtP3jVTE--NFE5Ka5/_ssgManifest.js"
-  ],
-  "rootMainFiles": [],
-  "pages": {
-    "/": [
-      "static/chunks/webpack-aff0e2e4ba699b8a.js",
-      "static/chunks/framework-dfd14d7ce6600b03.js",
-      "static/chunks/main-9746772201fe3ac1.js",
-      "static/chunks/861-d1a326525092ab9c.js",
-      "static/css/364c439adafef5c8.css",
-      "static/chunks/832-5460e7c4690723c9.js",
-      "static/css/7df2581c69fe96b4.css",
-      "static/chunks/533-7ddbc43c0305df0c.js",
-      "static/css/7a8417de90d11c60.css",
-      "static/chunks/pages/index-dc845df360bc3a28.js"
-    ],
-    "/404": [
-      "static/chunks/webpack-aff0e2e4ba699b8a.js",
-      "static/chunks/framework-dfd14d7ce6600b03.js",
-      "static/chunks/main-9746772201fe3ac1.js",
-      "static/chunks/861-d1a326525092ab9c.js",
-      "static/css/364c439adafef5c8.css",
-      "static/chunks/832-5460e7c4690723c9.js",
-      "static/chunks/pages/404-ac22e12eb22b9c50.js"
-    ],
-    "/500": [
-      "static/chunks/webpack-aff0e2e4ba699b8a.js",
-      "static/chunks/framework-dfd14d7ce6600b03.js",
-      "static/chunks/main-9746772201fe3ac1.js",
-      "static/chunks/861-d1a326525092ab9c.js",
-      "static/css/364c439adafef5c8.css",
-      "static/chunks/832-5460e7c4690723c9.js",
-      "static/chunks/pages/500-7b708e8b89389d0e.js"
-    ],
-    "/[...slug]": [
-      "static/chunks/webpack-aff0e2e4ba699b8a.js",
-      "static/chunks/framework-dfd14d7ce6600b03.js",
-      "static/chunks/main-9746772201fe3ac1.js",
-      "static/chunks/861-d1a326525092ab9c.js",
-      "static/css/364c439adafef5c8.css",
-      "static/chunks/832-5460e7c4690723c9.js",
-      "static/css/2253644409b99b98.css",
-      "static/chunks/706-abfba2e18f084aed.js",
-      "static/css/4e0fc649e912b30f.css",
-      "static/chunks/pages/[...slug]-53c0858024f06998.js"
-    ],
-    "/[slug]/p": [
-      "static/chunks/webpack-aff0e2e4ba699b8a.js",
-      "static/chunks/framework-dfd14d7ce6600b03.js",
-      "static/chunks/main-9746772201fe3ac1.js",
-      "static/chunks/861-d1a326525092ab9c.js",
-      "static/css/364c439adafef5c8.css",
-      "static/chunks/832-5460e7c4690723c9.js",
-      "static/css/7df2581c69fe96b4.css",
-      "static/chunks/533-7ddbc43c0305df0c.js",
-      "static/css/4b7b7b64ae6afe67.css",
-      "static/chunks/pages/[slug]/p-fdc9d52c82f44e5d.js"
-    ],
-    "/_app": [
-      "static/chunks/webpack-aff0e2e4ba699b8a.js",
-      "static/chunks/framework-dfd14d7ce6600b03.js",
-      "static/chunks/main-9746772201fe3ac1.js",
-      "static/css/587c27bbda64e700.css",
-      "static/chunks/pages/_app-b601536188b9a919.js"
-    ],
-    "/_error": [
-      "static/chunks/webpack-aff0e2e4ba699b8a.js",
-      "static/chunks/framework-dfd14d7ce6600b03.js",
-      "static/chunks/main-9746772201fe3ac1.js",
-      "static/chunks/pages/_error-a7a0c1d9bfbb4f38.js"
-    ],
-    "/account": [
-      "static/chunks/webpack-aff0e2e4ba699b8a.js",
-      "static/chunks/framework-dfd14d7ce6600b03.js",
-      "static/chunks/main-9746772201fe3ac1.js",
-      "static/chunks/861-d1a326525092ab9c.js",
-      "static/css/364c439adafef5c8.css",
-      "static/chunks/832-5460e7c4690723c9.js",
-      "static/chunks/pages/account-04a0a6c07709c50e.js"
-    ],
-    "/checkout": [
-      "static/chunks/webpack-aff0e2e4ba699b8a.js",
-      "static/chunks/framework-dfd14d7ce6600b03.js",
-      "static/chunks/main-9746772201fe3ac1.js",
-      "static/chunks/861-d1a326525092ab9c.js",
-      "static/css/364c439adafef5c8.css",
-      "static/chunks/832-5460e7c4690723c9.js",
-      "static/chunks/pages/checkout-2ed6b828bb6ed7e6.js"
-    ],
-    "/login": [
-      "static/chunks/webpack-aff0e2e4ba699b8a.js",
-      "static/chunks/framework-dfd14d7ce6600b03.js",
-      "static/chunks/main-9746772201fe3ac1.js",
-      "static/chunks/861-d1a326525092ab9c.js",
-      "static/css/364c439adafef5c8.css",
-      "static/chunks/832-5460e7c4690723c9.js",
-      "static/chunks/pages/login-3bb40d77e6ee120a.js"
-    ],
-    "/s": [
-      "static/chunks/webpack-aff0e2e4ba699b8a.js",
-      "static/chunks/framework-dfd14d7ce6600b03.js",
-      "static/chunks/main-9746772201fe3ac1.js",
-      "static/chunks/861-d1a326525092ab9c.js",
-      "static/css/364c439adafef5c8.css",
-      "static/chunks/832-5460e7c4690723c9.js",
-      "static/css/2253644409b99b98.css",
-      "static/chunks/706-abfba2e18f084aed.js",
-      "static/chunks/pages/s-8fec20c40a2bd7da.js"
-    ]
-  },
-  "ampFirstPages": []
-}