@faststore/ui 2.0.91-alpha.0 → 2.0.95-alpha.0

package/dist/index.d.ts

@@ -13,7 +13,7 @@ export { default as Banner, BannerContent, BannerImage, BannerLink, } from './co
 export type { BannerProps, BannerContentProps, BannerImageProps, BannerLinkProps, } from './components/molecules/Banner';
 export { default as Form } from './components/molecules/Form';
 export type { FormProps } from './components/molecules/Form';
-export { Tiles, Tile } from './components/organisms/Tiles';
+export { Tile, Tiles } from './components/organisms/Tiles';
 export type { TilesProps, TileProps } from './components/organisms/Tiles';
 export { default as useSlider } from './hooks/useSlider';
 export type { UseSliderArgs, SliderState, SliderDispatch, SlideDirection, } from './hooks/useSlider';

package/dist/index.js

@@ -9,7 +9,7 @@ export { default as Carousel } from './components/molecules/Carousel';
 export { default as Banner, BannerContent, BannerImage, BannerLink, } from './components/molecules/Banner';
 export { default as Form } from './components/molecules/Form';
 // Organisms
-export { Tiles, Tile } from './components/organisms/Tiles';
+export { Tile, Tiles } from './components/organisms/Tiles';
 // 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":"AAAA,cAAc,uBAAuB,CAAA;AAErC,QAAQ;AACR,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,6BAA6B,CAAA;AAGjE,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,8BAA8B,CAAA;AAGnE,YAAY;AAEZ,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,qCAAqC,CAAA;AAG7E,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,gCAAgC,CAAA;AAGnE,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,iCAAiC,CAAA;AAGrE,OAAO,EACL,OAAO,IAAI,MAAM,EACjB,aAAa,EACb,WAAW,EACX,UAAU,GACX,MAAM,+BAA+B,CAAA;AAQtC,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,6BAA6B,CAAA;AAG7D,YAAY;AACZ,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,8BAA8B,CAAA;AAG1D,QAAQ;AACR,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,mBAAmB,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAA;AAErC,QAAQ;AACR,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,6BAA6B,CAAA;AAGjE,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,8BAA8B,CAAA;AAGnE,YAAY;AAEZ,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,qCAAqC,CAAA;AAG7E,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,gCAAgC,CAAA;AAGnE,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,iCAAiC,CAAA;AAGrE,OAAO,EACL,OAAO,IAAI,MAAM,EACjB,aAAa,EACb,WAAW,EACX,UAAU,GACX,MAAM,+BAA+B,CAAA;AAQtC,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,6BAA6B,CAAA;AAG7D,YAAY;AACZ,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,8BAA8B,CAAA;AAG1D,QAAQ;AACR,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,mBAAmB,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@faststore/ui",
-  "version": "2.0.91-alpha.0",
+  "version": "2.0.95-alpha.0",
   "description": "A lightweight, framework agnostic component library for React",
   "author": "emersonlaurentino",
   "license": "MIT",
@@ -58,5 +58,5 @@
     "node": "16.18.0",
     "yarn": "1.19.1"
   },
-  "gitHead": "837e0d4445c0366c8f99750eed611091e5d68933"
+  "gitHead": "3e2c8ab5300ce51834636f545d386fa5c506a97c"
 }

package/src/components/molecules/RegionBar/styles.scss

@@ -0,0 +1,60 @@
+[data-fs-region-bar] {
+  // --------------------------------------------------------
+  // Design Tokens for Region Bar
+  // --------------------------------------------------------
+
+  // Default properties
+  --fs-region-bar-width                    : 100%;
+  --fs-region-bar-padding                  : var(--fs-spacing-0) var(--fs-spacing-2) var(--fs-spacing-0) var(--fs-spacing-3);
+
+  --fs-region-bar-text-color               : var(--fs-color-text-display);
+
+  --fs-region-bar-bkg-color                : var(--fs-color-body-bkg);
+
+  --fs-region-bar-border-bottom-width      : var(--fs-border-width);
+  --fs-region-bar-border-bottom-color      : var(--fs-border-color-light);
+
+  // CTA
+  --fs-region-bar-cta-margin-left          : auto;
+  --fs-region-bar-cta-text-decoration      : underline;
+
+  // Message
+  --fs-region-bar-message-margin-right     : auto;
+
+  // Postal Code
+  --fs-region-bar-postal-code-margin-right : auto;
+
+  // --------------------------------------------------------
+  // Structural Styles
+  // --------------------------------------------------------
+
+  width: var(--fs-region-bar-width);
+
+  [data-fs-button] {
+    width: var(--fs-region-bar-width);
+    padding: var(--fs-region-bar-padding);
+    color: var(--fs-region-bar-text-color);
+    background-color: var(--fs-region-bar-bkg-color);
+    border-bottom: var(--fs-region-bar-border-bottom-width) solid var(--fs-region-bar-border-bottom-color);
+    border-radius: 0;
+
+    > span {
+      display: contents;
+    }
+  }
+
+  [data-fs-region-bar-cta] {
+    margin-left: var(--fs-region-bar-cta-margin-left);
+    text-decoration: var(--fs-region-bar-cta-text-decoration);
+  }
+
+  [data-fs-region-bar-postal-code] {
+    margin-right: var(--fs-region-bar-postal-code-margin-right);
+    font-weight: var(--fs-text-weight-regular);
+  }
+
+  [data-fs-region-bar-message] {
+    margin-right: var(--fs-region-bar-message-margin-right);
+    font-weight: var(--fs-text-weight-regular);
+  }
+}

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

@@ -0,0 +1,67 @@
+[data-fs-shipping-simulation] {
+  // --------------------------------------------------------
+  // Design Tokens for Shipping Simulation
+  // --------------------------------------------------------
+
+  // Default properties
+  --fs-shipping-simulation-text-size                : var(--fs-text-size-legend);
+
+  // Title
+  --fs-shipping-simulation-title-padding-bottom     : var(--fs-spacing-2);
+  --fs-shipping-simulation-title-font-size          : var(--fs-text-size-3);
+  --fs-shipping-simulation-title-font-weight        : var(--fs-text-weight-bold);
+  --fs-shipping-simulation-title-line-height        : 1.2;
+
+  // Link
+  --fs-shipping-simulation-link-padding-top         : var(--fs-spacing-1);
+
+  // Header
+  --fs-shipping-simulation-header-padding-top       : var(--fs-spacing-3);
+
+  // Subtitle
+  --fs-shipping-simulation-subtitle-size            : var(--fs-text-size-2);
+  --fs-shipping-simulation-subtitle-weight          : var(--fs-text-weight-bold);
+  --fs-shipping-simulation-subtitle-line-height     : 1.5;
+
+  // Location
+  --fs-shipping-simulation-location-padding-bottom  : var(--fs-spacing-2);
+  --fs-shipping-simulation-location-font-size       : var(--fs-text-size-2);
+  --fs-shipping-simulation-location-line-height     : 1.5;
+
+  // --------------------------------------------------------
+  // Structural Styles
+  // --------------------------------------------------------
+
+  [data-fs-shipping-simulation-title] {
+    padding-bottom: var(--fs-shipping-simulation-title-padding-bottom);
+    font-size: var(--fs-shipping-simulation-title-font-size);
+    font-weight: var(--fs-shipping-simulation-title-font-weight);
+    line-height: var(--fs-shipping-simulation-title-line-height);
+  }
+
+  [data-fs-shipping-simulation-link] {
+    display: flex;
+    align-items: center;
+    padding-top: var(--fs-shipping-simulation-link-padding-top);
+
+    svg {
+      margin-left: var(--fs-spacing-0);
+    }
+  }
+
+  [data-fs-shipping-simulation-header] {
+    padding-top: var(--fs-shipping-simulation-header-padding-top);
+  }
+
+  [data-fs-shipping-simulation-subtitle] {
+    font-size: var(--fs-shipping-simulation-subtitle-size);
+    font-weight: var(--fs-shipping-simulation-subtitle-weight);
+    line-height: var(--fs-shipping-simulation-subtitle-line-height);
+  }
+
+  [data-fs-shipping-simulation-location] {
+    padding-bottom: var(--fs-shipping-simulation-location-padding-bottom);
+    font-size: var(--fs-shipping-simulation-location-font-size);
+    line-height: var(--fs-shipping-simulation-location-line-height);
+  }
+}

package/src/index.ts

@@ -35,7 +35,7 @@ export { default as Form } from './components/molecules/Form'
 export type { FormProps } from './components/molecules/Form'
 
 // Organisms
-export { Tiles, Tile } from './components/organisms/Tiles'
+export { Tile, Tiles } from './components/organisms/Tiles'
 export type { TilesProps, TileProps } from './components/organisms/Tiles'
 
 // Hooks

package/src/styles/components.scss

@@ -33,6 +33,7 @@
 @import "../components/molecules/QuantitySelector/styles";
 @import "../components/molecules/RadioField/styles";
 @import "../components/molecules/Rating/styles";
+@import "../components/molecules/RegionBar/styles";
 @import "../components/molecules/SearchAutoComplete/styles";
 @import "../components/molecules/SearchDropdown/styles";
 @import "../components/molecules/SearchHistory/styles";
@@ -55,4 +56,5 @@
 @import "../components/organisms/PaymentMethods/styles";
 @import "../components/organisms/PriceRange/styles";
 @import "../components/organisms/SearchInput/styles";
+@import "../components/organisms/ShippingSimulation/styles";
 @import "../components/organisms/SlideOver/styles";