@faststore/ui 2.0.17-alpha.0 → 2.0.19-alpha.0

package/CHANGELOG.md

@@ -3,6 +3,15 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [2.0.19-alpha.0](https://github.com/vtex/faststore/compare/v2.0.18-alpha.0...v2.0.19-alpha.0) (2022-12-16)
+
+
+### Features
+
+* Adds `Hero` component ([#1556](https://github.com/vtex/faststore/issues/1556)) ([871f35c](https://github.com/vtex/faststore/commit/871f35cdcfc85d5ec0038dcc55a9aeedcc5ff546))
+
+
+
 ## [2.0.17-alpha.0](https://github.com/vtex/faststore/compare/v2.0.16-alpha.0...v2.0.17-alpha.0) (2022-12-15)
 
 

package/dist/index.d.ts

@@ -63,7 +63,5 @@ export { default as OutOfStock, OutOfStockTitle, OutOfStockMessage, } from './co
 export type { OutOfStockProps, OutOfStockMessageProps, OutOfStockTitleProps, } from './components/organisms/OutOfStock';
 export { Tiles, Tile } from './components/organisms/Tiles';
 export type { TilesProps, TileProps } from './components/organisms/Tiles';
-export { default as Hero, HeroHeading, HeroImage, } from './components/organisms/Hero';
-export type { HeroProps, HeroHeadingProps, HeroImageProps, } from './components/organisms/Hero';
 export { default as useSlider } from './hooks/useSlider';
 export type { UseSliderArgs, SliderState, SliderDispatch, SlideDirection, } from './hooks/useSlider';

package/dist/index.js

@@ -34,7 +34,6 @@ export { default as Dropdown, DropdownButton, DropdownItem, DropdownMenu, } from
 // Organisms
 export { default as OutOfStock, OutOfStockTitle, OutOfStockMessage, } from './components/organisms/OutOfStock';
 export { Tiles, Tile } from './components/organisms/Tiles';
-export { default as Hero, HeroHeading, HeroImage, } from './components/organisms/Hero';
 // Hooks
 export { default as useSlider } from './hooks/useSlider';
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@faststore/ui",
-  "version": "2.0.17-alpha.0",
+  "version": "2.0.19-alpha.0",
   "description": "A lightweight, framework agnostic component library for React",
   "author": "emersonlaurentino",
   "license": "MIT",
@@ -50,7 +50,7 @@
   "devDependencies": {
     "@babel/core": "^7.19.6",
     "@faststore/shared": "^2.0.3-alpha.0",
-    "@faststore/styles": "^2.0.14-alpha.0",
+    "@faststore/styles": "^2.0.19-alpha.0",
     "@size-limit/preset-small-lib": "^7.0.8",
     "@storybook/addon-a11y": "^6.5.13",
     "@storybook/addon-actions": "^6.5.13",
@@ -78,5 +78,5 @@
     "node": "16.18.0",
     "yarn": "1.19.1"
   },
-  "gitHead": "63d93423c77df7aadbbd8ba8b5f9d39302e6fd3e"
+  "gitHead": "40266ca0a2dc46a9a3da1632caf5c8a264157efd"
 }

package/src/components/organisms/Hero/styles.scss

@@ -0,0 +1,203 @@
+[data-fs-hero] {
+  // --------------------------------------------------------
+  // Design Tokens for Hero Section
+  // --------------------------------------------------------
+
+  // Default properties
+  --fs-hero-text-size                      : var(--fs-text-size-lead);
+  --fs-hero-text-line-height               : 1.33;
+
+  // Image
+  --fs-hero-image-border-radius            : 0;
+
+  // Title
+  --fs-hero-title-padding                  : var(--fs-spacing-5) 0 var(--fs-spacing-6);
+  --fs-hero-title-weight                   : var(--fs-text-weight-black);
+  --fs-hero-title-line-height              : 1.1;
+
+  // Subtitle
+  --fs-hero-subtitle-margin-top-mobile     : var(--fs-spacing-2);
+  --fs-hero-subtitle-margin-top-tablet     : var(--fs-spacing-4);
+  --fs-hero-subtitle-size                  : var(--fs-hero-text-size);
+  --fs-hero-subtitle-line-height           : var(--fs-hero-text-line-height);
+
+  // Primary
+  --fs-hero-primary-image-height-mobile    : 15rem; // 240px
+  --fs-hero-primary-image-height-desktop   : 29rem; // 464px
+  --fs-hero-primary-title-size             : var(--fs-text-size-title-huge);
+
+  // Secondary
+  --fs-hero-secondary-image-height-mobile  : 11.25rem;  // 180px
+  --fs-hero-secondary-image-height-desktop : 14.188rem; // 227px
+  --fs-hero-secondary-title-size           : var(--fs-text-size-title-page);
+
+  // Main
+  --fs-hero-main-bkg-color                 : var(--fs-color-primary-bkg);
+  --fs-hero-main-text-color                : var(--fs-color-primary-text);
+
+  // Light
+  --fs-hero-light-bkg-color                : var(--fs-color-secondary-bkg-light);
+  --fs-hero-light-text-color               : var(--fs-color-text-display);
+
+  // Accent
+  --fs-hero-accent-bkg-color               : var(--fs-color-highlighted-bkg);
+  --fs-hero-accent-text-color              : var(--fs-hero-light-text-color);
+
+  // --------------------------------------------------------
+  // Structural Styles
+  // --------------------------------------------------------
+
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+
+  @include media(">=tablet") {
+    position: relative;
+    flex-direction: row-reverse;
+    justify-content: flex-end;
+  }
+
+  [data-fs-hero-image] {
+    border-radius: var(--fs-hero-image-border-radius);
+
+    @include media(">=tablet") {
+      position: absolute;
+      right: 0;
+      width: 50%;
+      height: 100%;
+      overflow: hidden;
+    }
+  }
+
+  [data-fs-hero-heading] {
+    width: 100%;
+    padding: var(--fs-hero-title-padding);
+  }
+
+  [data-fs-hero-wrapper] {
+    display: flex;
+    gap: var(--fs-spacing-3);
+    justify-content: space-between;
+
+    @include media(">=tablet") {
+      gap: var(--fs-spacing-1);
+      justify-content: flex-start;
+    }
+  }
+
+  [data-fs-hero-title] {
+    font-weight: var(--fs-hero-title-weight);
+    line-height: var(--fs-hero-title-line-height);
+  }
+
+  [data-fs-hero-subtitle] {
+    margin-top: var(--fs-hero-subtitle-margin-top-mobile);
+    font-size: var(--fs-hero-subtitle-size);
+    line-height: var(--fs-hero-subtitle-line-height);
+
+    @include media(">=tablet") {
+      margin-top: var(--fs-hero-subtitle-margin-top-tablet);
+    }
+  }
+
+  [data-fs-button] {
+    justify-content: space-between;
+    min-width: 11.25rem;
+    margin-top: var(--fs-spacing-6);
+  }
+
+  [data-fs-hero-icon] {
+    color: var(--fs-hero-text-color);
+    height: fit-content;
+    > * {
+      height: var(--fs-spacing-6);
+      width: var(--fs-spacing-6);
+    }
+  }
+
+  // --------------------------------------------------------
+  // Variants Styles
+  // --------------------------------------------------------
+
+  &[data-fs-hero-variant="primary"] {
+    @include media(">=tablet") {
+      min-height: var(--fs-hero-primary-image-height-desktop);
+    }
+
+    [data-fs-hero-title] {
+      font-size: var(--fs-hero-primary-title-size);
+    }
+
+    [data-fs-hero-heading] {
+      @include media(">=tablet") {
+        display: flex;
+        align-items: center;
+        padding: var(--fs-spacing-9) 0;
+      }
+    }
+
+    [data-fs-button] {
+      @include media(">=tablet") {
+        margin-top: var(--fs-spacing-8);
+      }
+    }
+
+    [data-fs-hero-image] {
+      @include media("<tablet") {
+        height: var(--fs-hero-primary-image-height-mobile);
+      }
+    }
+
+    [data-fs-hero-info] {
+      @include media(">=tablet") {
+        width: 46%;
+        padding-right: var(--fs-spacing-9);
+      }
+    }
+  }
+
+  &[data-fs-hero-variant="secondary"] {
+    @include media(">=tablet") {
+      min-height: var(--fs-hero-secondary-image-height-desktop);
+    }
+
+    [data-fs-hero-title] {
+      font-size: var(--fs-hero-secondary-title-size);
+    }
+
+    [data-fs-hero-info] {
+      @include media(">=tablet") {
+        width: 42%;
+      }
+    }
+
+    [data-fs-hero-heading] {
+      padding: var(--fs-spacing-4) 0 var(--fs-spacing-5);
+
+      @include media(">=tablet") {
+        padding: var(--fs-spacing-5) 0;
+      }
+    }
+
+    [data-fs-hero-image] {
+      @include media("<tablet") {
+        height: var(--fs-hero-secondary-image-height-mobile);
+      }
+    }
+  }
+
+  &[data-fs-hero-color-variant="main"] {
+    color: var(--fs-hero-main-text-color);
+    background-color: var(--fs-hero-main-bkg-color);
+  }
+
+  &[data-fs-hero-color-variant="light"] {
+    color: var(--fs-hero-light-text-color);
+    background-color: var(--fs-hero-light-bkg-color);
+  }
+
+  &[data-fs-hero-color-variant="accent"] {
+    color: var(--fs-hero-accent-text-color);
+    background-color: var(--fs-hero-accent-bkg-color);
+  }
+}

package/src/index.ts

@@ -204,17 +204,6 @@ export type {
 export { Tiles, Tile } from './components/organisms/Tiles'
 export type { TilesProps, TileProps } from './components/organisms/Tiles'
 
-export {
-  default as Hero,
-  HeroHeading,
-  HeroImage,
-} from './components/organisms/Hero'
-export type {
-  HeroProps,
-  HeroHeadingProps,
-  HeroImageProps,
-} from './components/organisms/Hero'
-
 // Hooks
 export { default as useSlider } from './hooks/useSlider'
 export type {

package/src/styles/components.scss

@@ -3,7 +3,7 @@
 @import "../components/atoms/Button/styles";
 @import "../components/atoms/Checkbox/styles";
 @import "../components/atoms/Icon/styles";
-@import "../components/atoms/Link/styles";   
+@import "../components/atoms/Link/styles";
 @import "../components/atoms/Input/styles";
 @import "../components/atoms/List/styles";
 @import "../components/atoms/Overlay/styles";
@@ -23,3 +23,6 @@
 @import "../components/molecules/Tag/styles";
 @import "../components/molecules/Toggle/styles";
 @import "../components/molecules/ToggleField/styles";
+
+// Organisms
+@import "../components/organisms/Hero/styles";

package/dist/components/organisms/Hero/Hero.d.ts

@@ -1,11 +0,0 @@
-import React from 'react';
-import type { HTMLAttributes } from 'react';
-export interface HeroProps extends HTMLAttributes<HTMLDivElement> {
-    /**
-     * ID to find this component in testing tools (e.g.: cypress,
-     * testing-library, and jest).
-     */
-    testId?: string;
-}
-declare const Hero: React.ForwardRefExoticComponent<HeroProps & React.RefAttributes<HTMLDivElement>>;
-export default Hero;

package/dist/components/organisms/Hero/Hero.js

@@ -1,6 +0,0 @@
-import React, { forwardRef } from 'react';
-const Hero = forwardRef(function Hero({ testId = 'store-hero', children, ...otherProps }, ref) {
-    return (React.createElement("article", Object.assign({ ref: ref, "data-fs-hero": true, "data-testid": testId }, otherProps), children));
-});
-export default Hero;
-//# sourceMappingURL=Hero.js.map

package/dist/components/organisms/Hero/Hero.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Hero.js","sourceRoot":"","sources":["../../../../src/components/organisms/Hero/Hero.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAWzC,MAAM,IAAI,GAAG,UAAU,CAA4B,SAAS,IAAI,CAC9D,EAAE,MAAM,GAAG,YAAY,EAAE,QAAQ,EAAE,GAAG,UAAU,EAAE,EAClD,GAAG;IAEH,OAAO,CACL,+CAAS,GAAG,EAAE,GAAG,uCAA4B,MAAM,IAAM,UAAU,GAChE,QAAQ,CACD,CACX,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,IAAI,CAAA"}

package/dist/components/organisms/Hero/HeroHeading.d.ts

@@ -1,10 +0,0 @@
-import type { HTMLAttributes } from 'react';
-import React from 'react';
-export interface HeroHeadingProps extends HTMLAttributes<HTMLDivElement> {
-    /**
-     * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
-     */
-    testId?: string;
-}
-declare const HeroHeading: React.ForwardRefExoticComponent<HeroHeadingProps & React.RefAttributes<HTMLDivElement>>;
-export default HeroHeading;

package/dist/components/organisms/Hero/HeroHeading.js

@@ -1,6 +0,0 @@
-import React, { forwardRef } from 'react';
-const HeroHeading = forwardRef(function HeroHeading({ testId = 'store-hero-heading', children, ...otherProps }, ref) {
-    return (React.createElement("header", Object.assign({ ref: ref, "data-hero-heading": true, "data-testid": testId }, otherProps), children));
-});
-export default HeroHeading;
-//# sourceMappingURL=HeroHeading.js.map

package/dist/components/organisms/Hero/HeroHeading.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"HeroHeading.js","sourceRoot":"","sources":["../../../../src/components/organisms/Hero/HeroHeading.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AASzC,MAAM,WAAW,GAAG,UAAU,CAC5B,SAAS,WAAW,CAClB,EAAE,MAAM,GAAG,oBAAoB,EAAE,QAAQ,EAAE,GAAG,UAAU,EAAE,EAC1D,GAAG;IAEH,OAAO,CACL,8CAAQ,GAAG,EAAE,GAAG,4CAAiC,MAAM,IAAM,UAAU,GACpE,QAAQ,CACF,CACV,CAAA;AACH,CAAC,CACF,CAAA;AAED,eAAe,WAAW,CAAA"}

package/dist/components/organisms/Hero/HeroImage.d.ts

@@ -1,10 +0,0 @@
-import type { HTMLAttributes } from 'react';
-import React from 'react';
-export interface HeroImageProps extends HTMLAttributes<HTMLDivElement> {
-    /**
-     * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
-     */
-    testId?: string;
-}
-declare const HeroImage: React.ForwardRefExoticComponent<HeroImageProps & React.RefAttributes<HTMLDivElement>>;
-export default HeroImage;

package/dist/components/organisms/Hero/HeroImage.js

@@ -1,6 +0,0 @@
-import React, { forwardRef } from 'react';
-const HeroImage = forwardRef(function HeroImage({ testId = 'store-hero-image', children, ...otherProps }, ref) {
-    return (React.createElement("div", Object.assign({ ref: ref, "data-hero-image": true, "data-testid": testId }, otherProps), children));
-});
-export default HeroImage;
-//# sourceMappingURL=HeroImage.js.map

package/dist/components/organisms/Hero/HeroImage.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"HeroImage.js","sourceRoot":"","sources":["../../../../src/components/organisms/Hero/HeroImage.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AASzC,MAAM,SAAS,GAAG,UAAU,CAAiC,SAAS,SAAS,CAC7E,EAAE,MAAM,GAAG,kBAAkB,EAAE,QAAQ,EAAE,GAAG,UAAU,EAAE,EACxD,GAAG;IAEH,OAAO,CACL,2CAAK,GAAG,EAAE,GAAG,0CAA+B,MAAM,IAAM,UAAU,GAC/D,QAAQ,CACL,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,SAAS,CAAA"}

package/dist/components/organisms/Hero/index.d.ts

@@ -1,6 +0,0 @@
-export { default } from './Hero';
-export type { HeroProps } from './Hero';
-export { default as HeroImage } from './HeroImage';
-export type { HeroImageProps } from './HeroImage';
-export { default as HeroHeading } from './HeroHeading';
-export type { HeroHeadingProps } from './HeroHeading';

package/dist/components/organisms/Hero/index.js

@@ -1,4 +0,0 @@
-export { default } from './Hero';
-export { default as HeroImage } from './HeroImage';
-export { default as HeroHeading } from './HeroHeading';
-//# sourceMappingURL=index.js.map

package/dist/components/organisms/Hero/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/organisms/Hero/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAA;AAGhC,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAA;AAGlD,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAA"}

package/src/components/organisms/Hero/Hero.tsx

@@ -1,23 +0,0 @@
-import React, { forwardRef } from 'react'
-import type { HTMLAttributes } from 'react'
-
-export interface HeroProps extends HTMLAttributes<HTMLDivElement> {
-  /**
-   * ID to find this component in testing tools (e.g.: cypress,
-   * testing-library, and jest).
-   */
-  testId?: string
-}
-
-const Hero = forwardRef<HTMLDivElement, HeroProps>(function Hero(
-  { testId = 'store-hero', children, ...otherProps },
-  ref
-) {
-  return (
-    <article ref={ref} data-fs-hero data-testid={testId} {...otherProps}>
-      {children}
-    </article>
-  )
-})
-
-export default Hero

package/src/components/organisms/Hero/HeroHeading.tsx

@@ -1,24 +0,0 @@
-import type { HTMLAttributes } from 'react'
-import React, { forwardRef } from 'react'
-
-export interface HeroHeadingProps extends HTMLAttributes<HTMLDivElement> {
-  /**
-   * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
-   */
-  testId?: string
-}
-
-const HeroHeading = forwardRef<HTMLDivElement, HeroHeadingProps>(
-  function HeroHeading(
-    { testId = 'store-hero-heading', children, ...otherProps },
-    ref
-  ) {
-    return (
-      <header ref={ref} data-hero-heading data-testid={testId} {...otherProps}>
-        {children}
-      </header>
-    )
-  }
-)
-
-export default HeroHeading

package/src/components/organisms/Hero/HeroImage.tsx

@@ -1,22 +0,0 @@
-import type { HTMLAttributes } from 'react'
-import React, { forwardRef } from 'react'
-
-export interface HeroImageProps extends HTMLAttributes<HTMLDivElement> {
-  /**
-   * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
-   */
-  testId?: string
-}
-
-const HeroImage = forwardRef<HTMLDivElement, HeroImageProps>(function HeroImage(
-  { testId = 'store-hero-image', children, ...otherProps },
-  ref
-) {
-  return (
-    <div ref={ref} data-hero-image data-testid={testId} {...otherProps}>
-      {children}
-    </div>
-  )
-})
-
-export default HeroImage

package/src/components/organisms/Hero/index.tsx

@@ -1,8 +0,0 @@
-export { default } from './Hero'
-export type { HeroProps } from './Hero'
-
-export { default as HeroImage } from './HeroImage'
-export type { HeroImageProps } from './HeroImage'
-
-export { default as HeroHeading } from './HeroHeading'
-export type { HeroHeadingProps } from './HeroHeading'

package/src/components/organisms/Hero/stories/Hero.mdx

@@ -1,48 +0,0 @@
-import { Canvas, Props, Story, ArgsTable } from '@storybook/addon-docs'
-
-import Hero from '../Hero'
-import HeroImage from '../HeroImage'
-import HeroHeading from '../HeroHeading'
-
-# Hero
-
-<Canvas>
-  <Story id="organisms-hero--hero" />
-</Canvas>
-
-## Components
-
-The `Hero` uses the [Compound Component](https://kentcdodds.com/blog/compound-components-with-react-hooks) pattern, its components are:
-
-- `Hero`: the wrapper component.
-- `HeroImage`: the component that wraps the image displayed in the component.
-- `HeroHeading`: the component should have a title, description, and a call to action link.
-
-## Props
-
-All hero-related components support all attributes also supported by the `<div>` tag.
-
-Besides those attributes, the following props are also supported:
-
-### `Hero`
-
-<ArgsTable of={Hero} />
-
-### `HeroImage`
-
-<ArgsTable of={HeroImage} />
-
-### `HeroHeading`
-
-<ArgsTable of={HeroHeading} />
-
-## CSS Selectors
-
-```css
-[data-fs-hero] {
-}
-[data-hero-image] {
-}
-[data-hero-heading] {
-}
-```

package/src/components/organisms/Hero/stories/Hero.stories.tsx

@@ -1,56 +0,0 @@
-import type { Story, Meta } from '@storybook/react'
-import React from 'react'
-
-import HeroComponent from '../Hero'
-import HeroImage from '../HeroImage'
-import HeroHeading from '../HeroHeading'
-import type { HeroProps } from '../Hero'
-import { Icon } from '../../../../'
-import mdx from './Hero.mdx'
-
-const RightArrow = () => (
-  <svg
-    xmlns="http://www.w3.org/2000/svg"
-    width="18"
-    height="18"
-    viewBox="0 0 18 18"
-  >
-    <path
-      d="M10.6553 3.40717C10.3624 3.11428 9.88756 3.11428 9.59467 3.40717C9.30178 3.70006 9.30178 4.17494 9.59467 4.46783L13.3768 8.25H2.8125C2.39829 8.25 2.0625 8.58579 2.0625 9C2.0625 9.41421 2.39829 9.75 2.8125 9.75H13.3768L9.59467 13.5322C9.30178 13.8251 9.30178 14.2999 9.59467 14.5928C9.88756 14.8857 10.3624 14.8857 10.6553 14.5928L15.7178 9.53033C15.8643 9.38388 15.9375 9.19194 15.9375 9C15.9375 8.89831 15.9173 8.80134 15.8806 8.71291C15.844 8.62445 15.7897 8.54158 15.7178 8.46967L10.6553 3.40717Z"
-      fill="currentColor"
-    />
-  </svg>
-)
-
-const HeroTemplate: Story<HeroProps> = ({ testId }) => (
-  <HeroComponent testId={testId}>
-    <HeroImage>
-      <img
-        alt="Quest 2 Controller on a table"
-        src="https://storeframework.vtexassets.com/arquivos/ids/190897/Photo.jpg"
-      />
-    </HeroImage>
-    <HeroHeading>
-      <h1>New Products Available</h1>
-      <p>
-        At BaseStore you can shop the best tech of 2022. Enjoy and get 10% off
-        on your first purchase.
-      </p>
-      <a href="/">
-        See all <Icon component={<RightArrow />} />
-      </a>
-    </HeroHeading>
-  </HeroComponent>
-)
-
-export const Hero = HeroTemplate.bind({})
-Hero.storyName = 'Hero'
-
-export default {
-  title: 'Organisms/Hero',
-  parameters: {
-    docs: {
-      page: mdx,
-    },
-  },
-} as Meta