@faststore/ui 2.0.47-alpha.0 → 2.0.49-alpha.0

package/dist/index.d.ts

@@ -19,8 +19,6 @@ export { default as ProductTitle } from './components/molecules/ProductTitle';
 export type { ProductTitleProps } from './components/molecules/ProductTitle';
 export { default as OrderSummary } from './components/molecules/OrderSummary';
 export type { OrderSummaryProps } from './components/molecules/OrderSummary';
-export { default as AggregateRating } from './components/molecules/AggregateRating';
-export type { AggregateRatingProps } from './components/molecules/AggregateRating';
 export { default as ProductCard, ProductCardImage, ProductCardContent, ProductCardActions, } from './components/molecules/ProductCard';
 export type { ProductCardProps, ProductCardImageProps, ProductCardContentProps, ProductCardActionsProps, } from './components/molecules/ProductCard';
 export { default as Card, CardImage, CardContent, CardActions, } from './components/molecules/Card';
@@ -49,8 +47,6 @@ export { default as RadioGroup, RadioOption, } from './components/molecules/Radi
 export type { RadioGroupProps, RadioOptionProps, } from './components/molecules/RadioGroup';
 export { default as Form } from './components/molecules/Form';
 export type { FormProps } from './components/molecules/Form';
-export { default as Alert } from './components/molecules/Alert';
-export type { AlertProps } from './components/molecules/Alert';
 export { default as OutOfStock, OutOfStockTitle, OutOfStockMessage, } from './components/organisms/OutOfStock';
 export type { OutOfStockProps, OutOfStockMessageProps, OutOfStockTitleProps, } from './components/organisms/OutOfStock';
 export { Tiles, Tile } from './components/organisms/Tiles';

package/dist/index.js

@@ -11,7 +11,6 @@ export { default as SkuSelector } from './components/molecules/SkuSelector';
 export { default as Gift, GiftContent, GiftImage, } from './components/molecules/Gift';
 export { default as ProductTitle } from './components/molecules/ProductTitle';
 export { default as OrderSummary } from './components/molecules/OrderSummary';
-export { default as AggregateRating } from './components/molecules/AggregateRating';
 export { default as ProductCard, ProductCardImage, ProductCardContent, ProductCardActions, } from './components/molecules/ProductCard';
 export { default as Card, CardImage, CardContent, CardActions, } from './components/molecules/Card';
 export { default as CartItem, CartItemActions, CartItemContent, CartItemImage, CartItemPrices, CartItemSummary, CartItemTitle, } from './components/molecules/CartItem';
@@ -26,7 +25,6 @@ export { default as LoadingButton } from './components/molecules/LoadingButton';
 export { default as PriceRange } from './components/molecules/PriceRange';
 export { default as RadioGroup, RadioOption, } from './components/molecules/RadioGroup';
 export { default as Form } from './components/molecules/Form';
-export { default as Alert } from './components/molecules/Alert';
 // Organisms
 export { default as OutOfStock, OutOfStockTitle, OutOfStockMessage, } from './components/organisms/OutOfStock';
 export { Tiles, Tile } from './components/organisms/Tiles';

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,OAAO,EAAE,MAAM,4BAA4B,CAAA;AAG/D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,6BAA6B,CAAA;AAGjE,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,2BAA2B,CAAA;AAG7D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,6BAA6B,CAAA;AAGjE,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,4BAA4B,CAAA;AAG/D,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,8BAA8B,CAAA;AAGnE,YAAY;AACZ,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,oCAAoC,CAAA;AAG3E,OAAO,EACL,OAAO,IAAI,IAAI,EACf,WAAW,EACX,SAAS,GACV,MAAM,6BAA6B,CAAA;AAOpC,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,qCAAqC,CAAA;AAG7E,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,qCAAqC,CAAA;AAG7E,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,wCAAwC,CAAA;AAGnF,OAAO,EACL,OAAO,IAAI,WAAW,EACtB,gBAAgB,EAChB,kBAAkB,EAClB,kBAAkB,GACnB,MAAM,oCAAoC,CAAA;AAQ3C,OAAO,EACL,OAAO,IAAI,IAAI,EACf,SAAS,EACT,WAAW,EACX,WAAW,GACZ,MAAM,6BAA6B,CAAA;AAQpC,OAAO,EACL,OAAO,IAAI,QAAQ,EACnB,eAAe,EACf,eAAe,EACf,aAAa,EACb,cAAc,EACd,eAAe,EACf,aAAa,GACd,MAAM,iCAAiC,CAAA;AAWxC,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,gCAAgC,CAAA;AAGnE,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,oCAAoC,CAAA;AAM3E,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,iCAAiC,CAAA;AAGrE,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,8BAA8B,CAAA;AAG/D,OAAO,EACL,OAAO,IAAI,MAAM,EACjB,aAAa,EACb,WAAW,EACX,UAAU,GACX,MAAM,+BAA+B,CAAA;AAQtC,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,uCAAuC,CAAA;AAGjF,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,mCAAmC,CAAA;AAGzE,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,sCAAsC,CAAA;AAG/E,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,mCAAmC,CAAA;AAGzE,OAAO,EACL,OAAO,IAAI,UAAU,EACrB,WAAW,GACZ,MAAM,mCAAmC,CAAA;AAM1C,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,6BAA6B,CAAA;AAG7D,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,8BAA8B,CAAA;AAG/D,YAAY;AACZ,OAAO,EACL,OAAO,IAAI,UAAU,EACrB,eAAe,EACf,iBAAiB,GAClB,MAAM,mCAAmC,CAAA;AAO1C,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,OAAO,EAAE,MAAM,4BAA4B,CAAA;AAG/D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,6BAA6B,CAAA;AAGjE,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,2BAA2B,CAAA;AAG7D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,6BAA6B,CAAA;AAGjE,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,4BAA4B,CAAA;AAG/D,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,8BAA8B,CAAA;AAGnE,YAAY;AACZ,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,oCAAoC,CAAA;AAG3E,OAAO,EACL,OAAO,IAAI,IAAI,EACf,WAAW,EACX,SAAS,GACV,MAAM,6BAA6B,CAAA;AAOpC,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,qCAAqC,CAAA;AAG7E,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,qCAAqC,CAAA;AAG7E,OAAO,EACL,OAAO,IAAI,WAAW,EACtB,gBAAgB,EAChB,kBAAkB,EAClB,kBAAkB,GACnB,MAAM,oCAAoC,CAAA;AAQ3C,OAAO,EACL,OAAO,IAAI,IAAI,EACf,SAAS,EACT,WAAW,EACX,WAAW,GACZ,MAAM,6BAA6B,CAAA;AAQpC,OAAO,EACL,OAAO,IAAI,QAAQ,EACnB,eAAe,EACf,eAAe,EACf,aAAa,EACb,cAAc,EACd,eAAe,EACf,aAAa,GACd,MAAM,iCAAiC,CAAA;AAWxC,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,gCAAgC,CAAA;AAGnE,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,oCAAoC,CAAA;AAM3E,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,iCAAiC,CAAA;AAGrE,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,8BAA8B,CAAA;AAG/D,OAAO,EACL,OAAO,IAAI,MAAM,EACjB,aAAa,EACb,WAAW,EACX,UAAU,GACX,MAAM,+BAA+B,CAAA;AAQtC,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,uCAAuC,CAAA;AAGjF,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,mCAAmC,CAAA;AAGzE,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,sCAAsC,CAAA;AAG/E,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,mCAAmC,CAAA;AAGzE,OAAO,EACL,OAAO,IAAI,UAAU,EACrB,WAAW,GACZ,MAAM,mCAAmC,CAAA;AAM1C,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,6BAA6B,CAAA;AAG7D,YAAY;AACZ,OAAO,EACL,OAAO,IAAI,UAAU,EACrB,eAAe,EACf,iBAAiB,GAClB,MAAM,mCAAmC,CAAA;AAO1C,OAAO,EAAE,KAAK,EAAE,IAAI,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.47-alpha.0",
+  "version": "2.0.49-alpha.0",
   "description": "A lightweight, framework agnostic component library for React",
   "author": "emersonlaurentino",
   "license": "MIT",
@@ -30,7 +30,7 @@
   "size-limit": [
     {
       "path": "dist/index.js",
-      "limit": "20 KB"
+      "limit": "30 KB"
     }
   ],
   "dependencies": {
@@ -46,8 +46,8 @@
     "react-dom": "^18.2.0"
   },
   "devDependencies": {
-    "@faststore/eslint-config": "^2.0.37-alpha.0",
-    "@faststore/shared": "^2.0.44-alpha.0",
+    "@faststore/eslint-config": "^2.0.49-alpha.0",
+    "@faststore/shared": "^2.0.49-alpha.0",
     "@size-limit/preset-small-lib": "^7.0.8",
     "@types/tabbable": "^3.1.1",
     "babel-loader": "^8.2.5",
@@ -59,5 +59,5 @@
     "node": "16.18.0",
     "yarn": "1.19.1"
   },
-  "gitHead": "3e7e16180416349dc8471b69ad9e305fd2f4d424"
+  "gitHead": "7046452f096b9b7e33b10db94e0213c3f10f91b5"
 }

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

@@ -0,0 +1,108 @@
+[data-fs-alert] {
+  // --------------------------------------------------------
+  // Design Tokens for Alert
+  // --------------------------------------------------------
+
+  // Default properties
+  --fs-alert-height                    : var(--fs-spacing-7);
+  --fs-alert-padding-left              : var(--fs-spacing-3);
+  --fs-alert-padding-right             : var(--fs-alert-padding-left);
+
+  --fs-alert-bkg-color                 : var(--fs-color-highlighted-bkg);
+
+  --fs-alert-text-color                : var(--fs-color-highlighted-text);
+  --fs-alert-text-size                 : var(--fs-text-size-1);
+
+  // Icon
+  --fs-alert-icon-width                : var(--fs-spacing-4);
+  --fs-alert-icon-height               : var(--fs-alert-icon-width);
+  --fs-alert-icon-margin-right         : var(--fs-spacing-1);
+  --fs-alert-icon-color                : var(--fs-alert-text-color);
+
+  // Link
+  --fs-alert-link-color                : var(--fs-alert-text-color);
+  --fs-alert-link-color-visited        : var(--fs-alert-text-color);
+
+  // Dismissible Button
+  --fs-alert-button-text-color         : var(--fs-alert-text-color);
+  --fs-alert-button-bkg-color          : var(--fs-alert-bkg-color);
+  --fs-alert-button-border-radius      : var(--fs-border-radius);
+
+  // --------------------------------------------------------
+  // Structural Styles
+  // --------------------------------------------------------
+
+  display: flex;
+  align-items: center;
+  width: 100%;
+  height: var(--fs-alert-height);
+  padding-right: var(--fs-alert-padding-right);
+  padding-left: var(--fs-alert-padding-left);
+  font-size: var(--fs-alert-text-size);
+  color: var(--fs-alert-text-color);
+  background-color: var(--fs-alert-bkg-color);
+
+  > [data-fs-icon] {
+    width: var(--fs-alert-icon-width);
+    height: var(--fs-alert-icon-height);
+    margin-right: var(--fs-alert-icon-margin-right);
+    color: var(--fs-alert-icon-color);
+  }
+
+  [data-fs-alert-content] {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  span {
+    font-weight: var(--fs-text-weight-bold);
+  }
+
+  [data-fs-alert-link] {
+    min-width: 0;
+    height: var(--fs-alert-height);
+    padding: 0 var(--fs-spacing-1);
+    overflow: hidden;
+    font-weight: var(--fs-text-weight-bold);
+    line-height: var(--fs-alert-height);
+    color: var(--fs-alert-link-color);
+    text-overflow: ellipsis;
+    white-space: nowrap;
+
+    &:visited {
+      color: var(--fs-alert-link-color-visited);
+    }
+  }
+
+  [data-fs-alert-button] {
+    min-width: var(--fs-control-tap-size);
+    height: 100%;
+    padding: var(--fs-spacing-0);
+    margin-left: auto;
+    color: var(--fs-alert-button-text-color);
+    background-color: var(--fs-alert-button-bkg-color);
+
+    > span {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      width: 100%;
+      height: 100%;
+      background-color: var(--fs-alert-button-bkg-color);
+      border-radius: var(--fs-alert-button-border-radius);
+    }
+
+    &:hover span {
+      filter: brightness(0.95);
+    }
+  }
+
+  // --------------------------------------------------------
+  // Variants Styles
+  // --------------------------------------------------------
+
+  &[data-fs-alert-dismissible="true"] {
+    padding-right: 0;
+  }
+}

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

@@ -0,0 +1,69 @@
+[data-fs-rating] {
+  // --------------------------------------------------------
+  // Design Tokens for Rating
+  // --------------------------------------------------------
+
+  // Default properties
+  --fs-rating-gap                     : var(--fs-spacing-3);
+  --fs-rating-color                   : var(--fs-color-text);
+
+  // Icon
+  --fs-rating-icon-width              : var(--fs-spacing-3);
+  --fs-rating-icon-height             : var(--fs-rating-icon-width);
+
+  // Actionable
+  --fs-rating-actionable-gap          : 0;
+
+  // --------------------------------------------------------
+  // Structural Styles
+  // --------------------------------------------------------
+
+  display: flex;
+
+  [data-fs-icon] {
+    color: var(--fs-rating-color);
+    width: var(--fs-rating-icon-width);
+    height: var(--fs-rating-icon-height);
+  }
+
+  [data-fs-rating-button] {
+    color: unset;
+    &[data-fs-button-variant=tertiary]:hover,
+    &[data-fs-button-variant=tertiary]:focus,
+    &[data-fs-button-variant=tertiary]:active { color: unset; }
+  }
+
+  [data-fs-rating-icon-wrapper] {
+    position: absolute;
+    top: 0;
+    left: 0;
+    overflow: hidden;
+  }
+
+  [data-fs-rating-icon-outline] {
+    svg { fill: none; }
+  }
+
+  [data-fs-rating-item] { position: relative; }
+
+  //  --------------------------------------------------------
+  // Variants Styles
+  // --------------------------------------------------------
+
+  [data-fs-rating-item="empty"] [data-fs-icon] svg {
+    fill: none;
+  }
+
+  [data-fs-rating-item="partial"] [data-fs-rating-icon-wrapper] {
+    width: calc(var(--fs-rating-icon-width) / 2);
+  }
+
+  &:not([data-fs-rating-actionable="true"]) {
+    column-gap: var(--fs-rating-gap);
+  }
+
+  [data-fs-rating-actionable="true"] {
+    column-gap: var(--fs-rating-actionable-gap);
+  }
+
+}

package/src/index.ts

@@ -40,9 +40,6 @@ export type { ProductTitleProps } from './components/molecules/ProductTitle'
 export { default as OrderSummary } from './components/molecules/OrderSummary'
 export type { OrderSummaryProps } from './components/molecules/OrderSummary'
 
-export { default as AggregateRating } from './components/molecules/AggregateRating'
-export type { AggregateRatingProps } from './components/molecules/AggregateRating'
-
 export {
   default as ProductCard,
   ProductCardImage,
@@ -140,9 +137,6 @@ export type {
 export { default as Form } from './components/molecules/Form'
 export type { FormProps } from './components/molecules/Form'
 
-export { default as Alert } from './components/molecules/Alert'
-export type { AlertProps } from './components/molecules/Alert'
-
 // Organisms
 export {
   default as OutOfStock,

package/src/styles/components.scss

@@ -14,6 +14,7 @@
 
 // Molecules
 @import "../components/molecules/Accordion/styles";
+@import "../components/molecules/Alert/styles";
 @import "../components/molecules/BuyButton/styles";
 @import "../components/molecules/CheckboxField/styles";
 @import "../components/molecules/DiscountBadge/styles";
@@ -22,6 +23,7 @@
 @import "../components/molecules/LinkButton/styles";
 @import "../components/molecules/QuantitySelector/styles";
 @import "../components/molecules/RadioField/styles";
+@import "../components/molecules/Rating/styles";
 @import "../components/molecules/SelectField/styles";
 @import "../components/molecules/Table/styles";
 @import "../components/molecules/Tag/styles";