@faststore/ui 2.0.47-alpha.0 → 2.0.48-alpha.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +14 -0
- package/dist/index.d.ts +0 -4
- package/dist/index.js +0 -2
- package/dist/index.js.map +1 -1
- package/package.json +5 -5
- package/src/components/molecules/Alert/styles.scss +108 -0
- package/src/components/molecules/Rating/styles.scss +69 -0
- package/src/index.ts +0 -6
- package/src/styles/components.scss +2 -0
- package/dist/components/molecules/AggregateRating/AggregateRating.d.ts +0 -18
- package/dist/components/molecules/AggregateRating/AggregateRating.js +0 -26
- package/dist/components/molecules/AggregateRating/AggregateRating.js.map +0 -1
- package/dist/components/molecules/AggregateRating/index.d.ts +0 -2
- package/dist/components/molecules/AggregateRating/index.js +0 -2
- package/dist/components/molecules/AggregateRating/index.js.map +0 -1
- package/dist/components/molecules/Alert/Alert.d.ts +0 -11
- package/dist/components/molecules/Alert/Alert.js +0 -6
- package/dist/components/molecules/Alert/Alert.js.map +0 -1
- package/dist/components/molecules/Alert/index.d.ts +0 -2
- package/dist/components/molecules/Alert/index.js +0 -2
- package/dist/components/molecules/Alert/index.js.map +0 -1
- package/src/components/molecules/AggregateRating/AggregateRating.tsx +0 -76
- package/src/components/molecules/AggregateRating/index.ts +0 -2
- package/src/components/molecules/Alert/Alert.tsx +0 -30
- package/src/components/molecules/Alert/index.ts +0 -2
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,20 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## 2.0.48-alpha.0 (2023-01-13)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
### Features
|
|
10
|
+
|
|
11
|
+
* Adds `Alert` Component ([#1590](https://github.com/vtex/faststore/issues/1590)) ([6e1cc00](https://github.com/vtex/faststore/commit/6e1cc004a5f3ae8674798fe6a36fd2a5d1451d7c))
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
### Bug Fixes
|
|
15
|
+
|
|
16
|
+
* ui size limit ([#1608](https://github.com/vtex/faststore/issues/1608)) ([c19360f](https://github.com/vtex/faststore/commit/c19360f4eb0e1d1f53e578e8429daa1a716d881d))
|
|
17
|
+
|
|
18
|
+
|
|
19
|
+
|
|
6
20
|
## [2.0.47-alpha.0](https://github.com/vtex/faststore/compare/v2.0.46-alpha.0...v2.0.47-alpha.0) (2023-01-13)
|
|
7
21
|
|
|
8
22
|
|
package/dist/index.d.ts
CHANGED
|
@@ -19,8 +19,6 @@ export { default as ProductTitle } from './components/molecules/ProductTitle';
|
|
|
19
19
|
export type { ProductTitleProps } from './components/molecules/ProductTitle';
|
|
20
20
|
export { default as OrderSummary } from './components/molecules/OrderSummary';
|
|
21
21
|
export type { OrderSummaryProps } from './components/molecules/OrderSummary';
|
|
22
|
-
export { default as AggregateRating } from './components/molecules/AggregateRating';
|
|
23
|
-
export type { AggregateRatingProps } from './components/molecules/AggregateRating';
|
|
24
22
|
export { default as ProductCard, ProductCardImage, ProductCardContent, ProductCardActions, } from './components/molecules/ProductCard';
|
|
25
23
|
export type { ProductCardProps, ProductCardImageProps, ProductCardContentProps, ProductCardActionsProps, } from './components/molecules/ProductCard';
|
|
26
24
|
export { default as Card, CardImage, CardContent, CardActions, } from './components/molecules/Card';
|
|
@@ -49,8 +47,6 @@ export { default as RadioGroup, RadioOption, } from './components/molecules/Radi
|
|
|
49
47
|
export type { RadioGroupProps, RadioOptionProps, } from './components/molecules/RadioGroup';
|
|
50
48
|
export { default as Form } from './components/molecules/Form';
|
|
51
49
|
export type { FormProps } from './components/molecules/Form';
|
|
52
|
-
export { default as Alert } from './components/molecules/Alert';
|
|
53
|
-
export type { AlertProps } from './components/molecules/Alert';
|
|
54
50
|
export { default as OutOfStock, OutOfStockTitle, OutOfStockMessage, } from './components/organisms/OutOfStock';
|
|
55
51
|
export type { OutOfStockProps, OutOfStockMessageProps, OutOfStockTitleProps, } from './components/organisms/OutOfStock';
|
|
56
52
|
export { Tiles, Tile } from './components/organisms/Tiles';
|
package/dist/index.js
CHANGED
|
@@ -11,7 +11,6 @@ export { default as SkuSelector } from './components/molecules/SkuSelector';
|
|
|
11
11
|
export { default as Gift, GiftContent, GiftImage, } from './components/molecules/Gift';
|
|
12
12
|
export { default as ProductTitle } from './components/molecules/ProductTitle';
|
|
13
13
|
export { default as OrderSummary } from './components/molecules/OrderSummary';
|
|
14
|
-
export { default as AggregateRating } from './components/molecules/AggregateRating';
|
|
15
14
|
export { default as ProductCard, ProductCardImage, ProductCardContent, ProductCardActions, } from './components/molecules/ProductCard';
|
|
16
15
|
export { default as Card, CardImage, CardContent, CardActions, } from './components/molecules/Card';
|
|
17
16
|
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';
|
|
|
26
25
|
export { default as PriceRange } from './components/molecules/PriceRange';
|
|
27
26
|
export { default as RadioGroup, RadioOption, } from './components/molecules/RadioGroup';
|
|
28
27
|
export { default as Form } from './components/molecules/Form';
|
|
29
|
-
export { default as Alert } from './components/molecules/Alert';
|
|
30
28
|
// Organisms
|
|
31
29
|
export { default as OutOfStock, OutOfStockTitle, OutOfStockMessage, } from './components/organisms/OutOfStock';
|
|
32
30
|
export { Tiles, Tile } from './components/organisms/Tiles';
|
package/dist/index.js.map
CHANGED
|
@@ -1 +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,
|
|
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,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
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@faststore/ui",
|
|
3
|
-
"version": "2.0.
|
|
3
|
+
"version": "2.0.48-alpha.0",
|
|
4
4
|
"description": "A lightweight, framework agnostic component library for React",
|
|
5
5
|
"author": "emersonlaurentino",
|
|
6
6
|
"license": "MIT",
|
|
@@ -30,7 +30,7 @@
|
|
|
30
30
|
"size-limit": [
|
|
31
31
|
{
|
|
32
32
|
"path": "dist/index.js",
|
|
33
|
-
"limit": "
|
|
33
|
+
"limit": "30 KB"
|
|
34
34
|
}
|
|
35
35
|
],
|
|
36
36
|
"dependencies": {
|
|
@@ -46,8 +46,8 @@
|
|
|
46
46
|
"react-dom": "^18.2.0"
|
|
47
47
|
},
|
|
48
48
|
"devDependencies": {
|
|
49
|
-
"@faststore/eslint-config": "^2.0.
|
|
50
|
-
"@faststore/shared": "^2.0.
|
|
49
|
+
"@faststore/eslint-config": "^2.0.48-alpha.0",
|
|
50
|
+
"@faststore/shared": "^2.0.48-alpha.0",
|
|
51
51
|
"@size-limit/preset-small-lib": "^7.0.8",
|
|
52
52
|
"@types/tabbable": "^3.1.1",
|
|
53
53
|
"babel-loader": "^8.2.5",
|
|
@@ -59,5 +59,5 @@
|
|
|
59
59
|
"node": "16.18.0",
|
|
60
60
|
"yarn": "1.19.1"
|
|
61
61
|
},
|
|
62
|
-
"gitHead": "
|
|
62
|
+
"gitHead": "13071d1410c4d42df70946ba27631549d2544d85"
|
|
63
63
|
}
|
|
@@ -0,0 +1,108 @@
|
|
|
1
|
+
[data-fs-alert] {
|
|
2
|
+
// --------------------------------------------------------
|
|
3
|
+
// Design Tokens for Alert
|
|
4
|
+
// --------------------------------------------------------
|
|
5
|
+
|
|
6
|
+
// Default properties
|
|
7
|
+
--fs-alert-height : var(--fs-spacing-7);
|
|
8
|
+
--fs-alert-padding-left : var(--fs-spacing-3);
|
|
9
|
+
--fs-alert-padding-right : var(--fs-alert-padding-left);
|
|
10
|
+
|
|
11
|
+
--fs-alert-bkg-color : var(--fs-color-highlighted-bkg);
|
|
12
|
+
|
|
13
|
+
--fs-alert-text-color : var(--fs-color-highlighted-text);
|
|
14
|
+
--fs-alert-text-size : var(--fs-text-size-1);
|
|
15
|
+
|
|
16
|
+
// Icon
|
|
17
|
+
--fs-alert-icon-width : var(--fs-spacing-4);
|
|
18
|
+
--fs-alert-icon-height : var(--fs-alert-icon-width);
|
|
19
|
+
--fs-alert-icon-margin-right : var(--fs-spacing-1);
|
|
20
|
+
--fs-alert-icon-color : var(--fs-alert-text-color);
|
|
21
|
+
|
|
22
|
+
// Link
|
|
23
|
+
--fs-alert-link-color : var(--fs-alert-text-color);
|
|
24
|
+
--fs-alert-link-color-visited : var(--fs-alert-text-color);
|
|
25
|
+
|
|
26
|
+
// Dismissible Button
|
|
27
|
+
--fs-alert-button-text-color : var(--fs-alert-text-color);
|
|
28
|
+
--fs-alert-button-bkg-color : var(--fs-alert-bkg-color);
|
|
29
|
+
--fs-alert-button-border-radius : var(--fs-border-radius);
|
|
30
|
+
|
|
31
|
+
// --------------------------------------------------------
|
|
32
|
+
// Structural Styles
|
|
33
|
+
// --------------------------------------------------------
|
|
34
|
+
|
|
35
|
+
display: flex;
|
|
36
|
+
align-items: center;
|
|
37
|
+
width: 100%;
|
|
38
|
+
height: var(--fs-alert-height);
|
|
39
|
+
padding-right: var(--fs-alert-padding-right);
|
|
40
|
+
padding-left: var(--fs-alert-padding-left);
|
|
41
|
+
font-size: var(--fs-alert-text-size);
|
|
42
|
+
color: var(--fs-alert-text-color);
|
|
43
|
+
background-color: var(--fs-alert-bkg-color);
|
|
44
|
+
|
|
45
|
+
> [data-fs-icon] {
|
|
46
|
+
width: var(--fs-alert-icon-width);
|
|
47
|
+
height: var(--fs-alert-icon-height);
|
|
48
|
+
margin-right: var(--fs-alert-icon-margin-right);
|
|
49
|
+
color: var(--fs-alert-icon-color);
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
[data-fs-alert-content] {
|
|
53
|
+
overflow: hidden;
|
|
54
|
+
text-overflow: ellipsis;
|
|
55
|
+
white-space: nowrap;
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
span {
|
|
59
|
+
font-weight: var(--fs-text-weight-bold);
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
[data-fs-alert-link] {
|
|
63
|
+
min-width: 0;
|
|
64
|
+
height: var(--fs-alert-height);
|
|
65
|
+
padding: 0 var(--fs-spacing-1);
|
|
66
|
+
overflow: hidden;
|
|
67
|
+
font-weight: var(--fs-text-weight-bold);
|
|
68
|
+
line-height: var(--fs-alert-height);
|
|
69
|
+
color: var(--fs-alert-link-color);
|
|
70
|
+
text-overflow: ellipsis;
|
|
71
|
+
white-space: nowrap;
|
|
72
|
+
|
|
73
|
+
&:visited {
|
|
74
|
+
color: var(--fs-alert-link-color-visited);
|
|
75
|
+
}
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
[data-fs-alert-button] {
|
|
79
|
+
min-width: var(--fs-control-tap-size);
|
|
80
|
+
height: 100%;
|
|
81
|
+
padding: var(--fs-spacing-0);
|
|
82
|
+
margin-left: auto;
|
|
83
|
+
color: var(--fs-alert-button-text-color);
|
|
84
|
+
background-color: var(--fs-alert-button-bkg-color);
|
|
85
|
+
|
|
86
|
+
> span {
|
|
87
|
+
display: flex;
|
|
88
|
+
align-items: center;
|
|
89
|
+
justify-content: center;
|
|
90
|
+
width: 100%;
|
|
91
|
+
height: 100%;
|
|
92
|
+
background-color: var(--fs-alert-button-bkg-color);
|
|
93
|
+
border-radius: var(--fs-alert-button-border-radius);
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
&:hover span {
|
|
97
|
+
filter: brightness(0.95);
|
|
98
|
+
}
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
// --------------------------------------------------------
|
|
102
|
+
// Variants Styles
|
|
103
|
+
// --------------------------------------------------------
|
|
104
|
+
|
|
105
|
+
&[data-fs-alert-dismissible="true"] {
|
|
106
|
+
padding-right: 0;
|
|
107
|
+
}
|
|
108
|
+
}
|
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
[data-fs-rating] {
|
|
2
|
+
// --------------------------------------------------------
|
|
3
|
+
// Design Tokens for Rating
|
|
4
|
+
// --------------------------------------------------------
|
|
5
|
+
|
|
6
|
+
// Default properties
|
|
7
|
+
--fs-rating-gap : var(--fs-spacing-3);
|
|
8
|
+
--fs-rating-color : var(--fs-color-text);
|
|
9
|
+
|
|
10
|
+
// Icon
|
|
11
|
+
--fs-rating-icon-width : var(--fs-spacing-3);
|
|
12
|
+
--fs-rating-icon-height : var(--fs-rating-icon-width);
|
|
13
|
+
|
|
14
|
+
// Actionable
|
|
15
|
+
--fs-rating-actionable-gap : 0;
|
|
16
|
+
|
|
17
|
+
// --------------------------------------------------------
|
|
18
|
+
// Structural Styles
|
|
19
|
+
// --------------------------------------------------------
|
|
20
|
+
|
|
21
|
+
display: flex;
|
|
22
|
+
|
|
23
|
+
[data-fs-icon] {
|
|
24
|
+
color: var(--fs-rating-color);
|
|
25
|
+
width: var(--fs-rating-icon-width);
|
|
26
|
+
height: var(--fs-rating-icon-height);
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
[data-fs-rating-button] {
|
|
30
|
+
color: unset;
|
|
31
|
+
&[data-fs-button-variant=tertiary]:hover,
|
|
32
|
+
&[data-fs-button-variant=tertiary]:focus,
|
|
33
|
+
&[data-fs-button-variant=tertiary]:active { color: unset; }
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
[data-fs-rating-icon-wrapper] {
|
|
37
|
+
position: absolute;
|
|
38
|
+
top: 0;
|
|
39
|
+
left: 0;
|
|
40
|
+
overflow: hidden;
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
[data-fs-rating-icon-outline] {
|
|
44
|
+
svg { fill: none; }
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
[data-fs-rating-item] { position: relative; }
|
|
48
|
+
|
|
49
|
+
// --------------------------------------------------------
|
|
50
|
+
// Variants Styles
|
|
51
|
+
// --------------------------------------------------------
|
|
52
|
+
|
|
53
|
+
[data-fs-rating-item="empty"] [data-fs-icon] svg {
|
|
54
|
+
fill: none;
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
[data-fs-rating-item="partial"] [data-fs-rating-icon-wrapper] {
|
|
58
|
+
width: calc(var(--fs-rating-icon-width) / 2);
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
&:not([data-fs-rating-actionable="true"]) {
|
|
62
|
+
column-gap: var(--fs-rating-gap);
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
[data-fs-rating-actionable="true"] {
|
|
66
|
+
column-gap: var(--fs-rating-actionable-gap);
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
}
|
package/src/index.ts
CHANGED
|
@@ -40,9 +40,6 @@ export type { ProductTitleProps } from './components/molecules/ProductTitle'
|
|
|
40
40
|
export { default as OrderSummary } from './components/molecules/OrderSummary'
|
|
41
41
|
export type { OrderSummaryProps } from './components/molecules/OrderSummary'
|
|
42
42
|
|
|
43
|
-
export { default as AggregateRating } from './components/molecules/AggregateRating'
|
|
44
|
-
export type { AggregateRatingProps } from './components/molecules/AggregateRating'
|
|
45
|
-
|
|
46
43
|
export {
|
|
47
44
|
default as ProductCard,
|
|
48
45
|
ProductCardImage,
|
|
@@ -140,9 +137,6 @@ export type {
|
|
|
140
137
|
export { default as Form } from './components/molecules/Form'
|
|
141
138
|
export type { FormProps } from './components/molecules/Form'
|
|
142
139
|
|
|
143
|
-
export { default as Alert } from './components/molecules/Alert'
|
|
144
|
-
export type { AlertProps } from './components/molecules/Alert'
|
|
145
|
-
|
|
146
140
|
// Organisms
|
|
147
141
|
export {
|
|
148
142
|
default as OutOfStock,
|
|
@@ -14,6 +14,7 @@
|
|
|
14
14
|
|
|
15
15
|
// Molecules
|
|
16
16
|
@import "../components/molecules/Accordion/styles";
|
|
17
|
+
@import "../components/molecules/Alert/styles";
|
|
17
18
|
@import "../components/molecules/BuyButton/styles";
|
|
18
19
|
@import "../components/molecules/CheckboxField/styles";
|
|
19
20
|
@import "../components/molecules/DiscountBadge/styles";
|
|
@@ -22,6 +23,7 @@
|
|
|
22
23
|
@import "../components/molecules/LinkButton/styles";
|
|
23
24
|
@import "../components/molecules/QuantitySelector/styles";
|
|
24
25
|
@import "../components/molecules/RadioField/styles";
|
|
26
|
+
@import "../components/molecules/Rating/styles";
|
|
25
27
|
@import "../components/molecules/SelectField/styles";
|
|
26
28
|
@import "../components/molecules/Table/styles";
|
|
27
29
|
@import "../components/molecules/Tag/styles";
|
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import type { HTMLAttributes } from 'react';
|
|
3
|
-
export interface AggregateRatingProps extends HTMLAttributes<HTMLUListElement> {
|
|
4
|
-
/**
|
|
5
|
-
* The current value of the rating, based on the quantity of child elements.
|
|
6
|
-
*/
|
|
7
|
-
value: number;
|
|
8
|
-
/**
|
|
9
|
-
* ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
|
|
10
|
-
*/
|
|
11
|
-
testId?: string;
|
|
12
|
-
}
|
|
13
|
-
export interface RatingItemProps {
|
|
14
|
-
'data-fs-aggregate-rating-item'?: 'full' | 'partial' | 'empty';
|
|
15
|
-
'data-testid'?: string;
|
|
16
|
-
}
|
|
17
|
-
declare const AggregateRating: React.ForwardRefExoticComponent<AggregateRatingProps & React.RefAttributes<HTMLUListElement>>;
|
|
18
|
-
export default AggregateRating;
|
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
import React, { forwardRef } from 'react';
|
|
2
|
-
import { List } from '@faststore/components';
|
|
3
|
-
const RatingItem = ({ children, ...otherProps }) => {
|
|
4
|
-
if (!React.isValidElement(children)) {
|
|
5
|
-
return React.createElement("li", { ...otherProps }, children);
|
|
6
|
-
}
|
|
7
|
-
return React.createElement("li", null, React.cloneElement(children, otherProps));
|
|
8
|
-
};
|
|
9
|
-
const AggregateRating = forwardRef(function AggregateRating({ children, testId = 'store-aggregate-rating', value, ...otherProps }, ref) {
|
|
10
|
-
const fillCheck = (itemValue) => {
|
|
11
|
-
if (itemValue >= 1) {
|
|
12
|
-
return 'full';
|
|
13
|
-
}
|
|
14
|
-
if (0 < itemValue && itemValue < 1) {
|
|
15
|
-
return 'partial';
|
|
16
|
-
}
|
|
17
|
-
return 'empty';
|
|
18
|
-
};
|
|
19
|
-
return (React.createElement(List, { "data-fs-aggregate-rating": true, ref: ref, "data-testid": testId, ...otherProps }, React.Children.map(children, (child, index) => {
|
|
20
|
-
const currentItemNumber = index;
|
|
21
|
-
const fill = fillCheck(value - currentItemNumber);
|
|
22
|
-
return (React.createElement(RatingItem, { key: `aggregate-rating-${index}`, "data-fs-aggregate-rating-item": fill, "data-testid": `${testId}-item` }, child));
|
|
23
|
-
})));
|
|
24
|
-
});
|
|
25
|
-
export default AggregateRating;
|
|
26
|
-
//# sourceMappingURL=AggregateRating.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"AggregateRating.js","sourceRoot":"","sources":["../../../../src/components/molecules/AggregateRating/AggregateRating.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAGzC,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAA;AAkB5C,MAAM,UAAU,GAA2C,CAAC,EAC1D,QAAQ,EACR,GAAG,UAAU,EACd,EAAE,EAAE;IACH,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE;QACnC,OAAO,+BAAQ,UAAU,IAAG,QAAQ,CAAM,CAAA;KAC3C;IAED,OAAO,gCAAK,KAAK,CAAC,YAAY,CAAC,QAAQ,EAAE,UAAU,CAAC,CAAM,CAAA;AAC5D,CAAC,CAAA;AAED,MAAM,eAAe,GAAG,UAAU,CAChC,SAAS,eAAe,CACtB,EAAE,QAAQ,EAAE,MAAM,GAAG,wBAAwB,EAAE,KAAK,EAAE,GAAG,UAAU,EAAE,EACrE,GAAG;IAEH,MAAM,SAAS,GAAG,CAAC,SAAiB,EAAE,EAAE;QACtC,IAAI,SAAS,IAAI,CAAC,EAAE;YAClB,OAAO,MAAM,CAAA;SACd;QAED,IAAI,CAAC,GAAG,SAAS,IAAI,SAAS,GAAG,CAAC,EAAE;YAClC,OAAO,SAAS,CAAA;SACjB;QAED,OAAO,OAAO,CAAA;IAChB,CAAC,CAAA;IAED,OAAO,CACL,oBAAC,IAAI,sCAEH,GAAG,EAAE,GAAG,iBACK,MAAM,KACf,UAAU,IAEb,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAa,EAAE,EAAE;QACrD,MAAM,iBAAiB,GAAG,KAAK,CAAA;QAC/B,MAAM,IAAI,GAAG,SAAS,CAAC,KAAK,GAAG,iBAAiB,CAAC,CAAA;QAEjD,OAAO,CACL,oBAAC,UAAU,IACT,GAAG,EAAE,oBAAoB,KAAK,EAAE,mCACD,IAAI,iBACtB,GAAG,MAAM,OAAO,IAE5B,KAAK,CACK,CACd,CAAA;IACH,CAAC,CAAC,CACG,CACR,CAAA;AACH,CAAC,CACF,CAAA;AAED,eAAe,eAAe,CAAA"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/molecules/AggregateRating/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAA"}
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import type { HTMLAttributes } from 'react';
|
|
2
|
-
import React from 'react';
|
|
3
|
-
export interface AlertProps extends Omit<HTMLAttributes<HTMLDivElement>, 'role'> {
|
|
4
|
-
/**
|
|
5
|
-
* ID to find this component in testing tools (e.g.: cypress,
|
|
6
|
-
* testing-library, and jest).
|
|
7
|
-
*/
|
|
8
|
-
testId?: string;
|
|
9
|
-
}
|
|
10
|
-
declare const Alert: React.ForwardRefExoticComponent<AlertProps & React.RefAttributes<HTMLDivElement>>;
|
|
11
|
-
export default Alert;
|
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
import React, { forwardRef } from 'react';
|
|
2
|
-
const Alert = forwardRef(function Alert({ testId = 'store-alert', children, ...otherProps }, ref) {
|
|
3
|
-
return (React.createElement("div", { ref: ref, role: "alert", "data-fs-alert": true, "data-testid": testId, ...otherProps }, children));
|
|
4
|
-
});
|
|
5
|
-
export default Alert;
|
|
6
|
-
//# sourceMappingURL=Alert.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Alert.js","sourceRoot":"","sources":["../../../../src/components/molecules/Alert/Alert.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAWzC,MAAM,KAAK,GAAG,UAAU,CAA6B,SAAS,KAAK,CACjE,EAAE,MAAM,GAAG,aAAa,EAAE,QAAQ,EAAE,GAAG,UAAU,EAAE,EACnD,GAAG;IAEH,OAAO,CACL,6BACE,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,OAAO,wCAEC,MAAM,KACf,UAAU,IAEb,QAAQ,CACL,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,KAAK,CAAA"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/molecules/Alert/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,SAAS,CAAA"}
|
|
@@ -1,76 +0,0 @@
|
|
|
1
|
-
import React, { forwardRef } from 'react'
|
|
2
|
-
import type { FC, PropsWithChildren, HTMLAttributes } from 'react'
|
|
3
|
-
|
|
4
|
-
import { List } from '@faststore/components'
|
|
5
|
-
|
|
6
|
-
export interface AggregateRatingProps extends HTMLAttributes<HTMLUListElement> {
|
|
7
|
-
/**
|
|
8
|
-
* The current value of the rating, based on the quantity of child elements.
|
|
9
|
-
*/
|
|
10
|
-
value: number
|
|
11
|
-
/**
|
|
12
|
-
* ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
|
|
13
|
-
*/
|
|
14
|
-
testId?: string
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
export interface RatingItemProps {
|
|
18
|
-
'data-fs-aggregate-rating-item'?: 'full' | 'partial' | 'empty'
|
|
19
|
-
'data-testid'?: string
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
const RatingItem: FC<PropsWithChildren<RatingItemProps>> = ({
|
|
23
|
-
children,
|
|
24
|
-
...otherProps
|
|
25
|
-
}) => {
|
|
26
|
-
if (!React.isValidElement(children)) {
|
|
27
|
-
return <li {...otherProps}>{children}</li>
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
return <li>{React.cloneElement(children, otherProps)}</li>
|
|
31
|
-
}
|
|
32
|
-
|
|
33
|
-
const AggregateRating = forwardRef<HTMLUListElement, AggregateRatingProps>(
|
|
34
|
-
function AggregateRating(
|
|
35
|
-
{ children, testId = 'store-aggregate-rating', value, ...otherProps },
|
|
36
|
-
ref
|
|
37
|
-
) {
|
|
38
|
-
const fillCheck = (itemValue: number) => {
|
|
39
|
-
if (itemValue >= 1) {
|
|
40
|
-
return 'full'
|
|
41
|
-
}
|
|
42
|
-
|
|
43
|
-
if (0 < itemValue && itemValue < 1) {
|
|
44
|
-
return 'partial'
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
return 'empty'
|
|
48
|
-
}
|
|
49
|
-
|
|
50
|
-
return (
|
|
51
|
-
<List
|
|
52
|
-
data-fs-aggregate-rating
|
|
53
|
-
ref={ref}
|
|
54
|
-
data-testid={testId}
|
|
55
|
-
{...otherProps}
|
|
56
|
-
>
|
|
57
|
-
{React.Children.map(children, (child, index: number) => {
|
|
58
|
-
const currentItemNumber = index
|
|
59
|
-
const fill = fillCheck(value - currentItemNumber)
|
|
60
|
-
|
|
61
|
-
return (
|
|
62
|
-
<RatingItem
|
|
63
|
-
key={`aggregate-rating-${index}`}
|
|
64
|
-
data-fs-aggregate-rating-item={fill}
|
|
65
|
-
data-testid={`${testId}-item`}
|
|
66
|
-
>
|
|
67
|
-
{child}
|
|
68
|
-
</RatingItem>
|
|
69
|
-
)
|
|
70
|
-
})}
|
|
71
|
-
</List>
|
|
72
|
-
)
|
|
73
|
-
}
|
|
74
|
-
)
|
|
75
|
-
|
|
76
|
-
export default AggregateRating
|
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
import type { HTMLAttributes } from 'react'
|
|
2
|
-
import React, { forwardRef } from 'react'
|
|
3
|
-
|
|
4
|
-
export interface AlertProps
|
|
5
|
-
extends Omit<HTMLAttributes<HTMLDivElement>, 'role'> {
|
|
6
|
-
/**
|
|
7
|
-
* ID to find this component in testing tools (e.g.: cypress,
|
|
8
|
-
* testing-library, and jest).
|
|
9
|
-
*/
|
|
10
|
-
testId?: string
|
|
11
|
-
}
|
|
12
|
-
|
|
13
|
-
const Alert = forwardRef<HTMLDivElement, AlertProps>(function Alert(
|
|
14
|
-
{ testId = 'store-alert', children, ...otherProps },
|
|
15
|
-
ref
|
|
16
|
-
) {
|
|
17
|
-
return (
|
|
18
|
-
<div
|
|
19
|
-
ref={ref}
|
|
20
|
-
role="alert"
|
|
21
|
-
data-fs-alert
|
|
22
|
-
data-testid={testId}
|
|
23
|
-
{...otherProps}
|
|
24
|
-
>
|
|
25
|
-
{children}
|
|
26
|
-
</div>
|
|
27
|
-
)
|
|
28
|
-
})
|
|
29
|
-
|
|
30
|
-
export default Alert
|