@faststore/ui 2.0.56-alpha.0 → 2.0.59-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/dist/components/molecules/Carousel/Carousel.js +1 -1
- package/dist/components/molecules/Carousel/Carousel.js.map +1 -1
- package/dist/index.d.ts +0 -4
- package/dist/index.js +0 -2
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
- package/src/components/atoms/Badge/styles.scss +0 -24
- package/src/components/atoms/Skeleton/styles.scss +67 -0
- package/src/components/molecules/Carousel/Carousel.tsx +1 -1
- package/src/components/molecules/DiscountBadge/styles.scss +0 -6
- package/src/components/molecules/ProductTitle/styles.scss +53 -0
- package/src/index.ts +0 -6
- package/src/styles/components.scss +2 -0
- package/dist/components/atoms/Skeleton/Skeleton.d.ts +0 -10
- package/dist/components/atoms/Skeleton/Skeleton.js +0 -6
- package/dist/components/atoms/Skeleton/Skeleton.js.map +0 -1
- package/dist/components/atoms/Skeleton/index.d.ts +0 -2
- package/dist/components/atoms/Skeleton/index.js +0 -2
- package/dist/components/atoms/Skeleton/index.js.map +0 -1
- package/dist/components/molecules/ProductTitle/ProductTitle.d.ts +0 -47
- package/dist/components/molecules/ProductTitle/ProductTitle.js +0 -12
- package/dist/components/molecules/ProductTitle/ProductTitle.js.map +0 -1
- package/dist/components/molecules/ProductTitle/index.d.ts +0 -2
- package/dist/components/molecules/ProductTitle/index.js +0 -2
- package/dist/components/molecules/ProductTitle/index.js.map +0 -1
- package/src/components/atoms/Skeleton/Skeleton.tsx +0 -20
- package/src/components/atoms/Skeleton/index.ts +0 -2
- package/src/components/molecules/ProductTitle/ProductTitle.tsx +0 -46
- package/src/components/molecules/ProductTitle/index.tsx +0 -2
|
@@ -3,7 +3,7 @@ import { RightArrowIcon, LeftArrowIcon } from './Arrows';
|
|
|
3
3
|
import CarouselItem from './CarouselItem';
|
|
4
4
|
import useSlider from '../../../hooks/useSlider/useSlider';
|
|
5
5
|
import Bullets from '../Bullets';
|
|
6
|
-
import { IconButton } from '../../../
|
|
6
|
+
import { IconButton } from '../../../';
|
|
7
7
|
const createTransformValues = (infinite, totalItems) => {
|
|
8
8
|
const transformMap = {};
|
|
9
9
|
const slideWidth = 100 / totalItems;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Carousel.js","sourceRoot":"","sources":["../../../../src/components/molecules/Carousel/Carousel.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAG9C,OAAO,EAAE,cAAc,EAAE,aAAa,EAAE,MAAM,UAAU,CAAA;AACxD,OAAO,YAAY,MAAM,gBAAgB,CAAA;AACzC,OAAO,SAAS,MAAM,oCAAoC,CAAA;AAC1D,OAAO,OAAO,MAAM,YAAY,CAAA;AAChC,OAAO,EAAE,UAAU,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"Carousel.js","sourceRoot":"","sources":["../../../../src/components/molecules/Carousel/Carousel.tsx"],"names":[],"mappings":"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"}
|
package/dist/index.d.ts
CHANGED
|
@@ -3,14 +3,10 @@ export { default as Popover } from './components/atoms/Popover';
|
|
|
3
3
|
export type { PopoverProps } from './components/atoms/Popover';
|
|
4
4
|
export { default as TextArea } from './components/atoms/TextArea';
|
|
5
5
|
export type { TextAreaProps } from './components/atoms/TextArea';
|
|
6
|
-
export { default as Skeleton } from './components/atoms/Skeleton';
|
|
7
|
-
export type { SkeletonProps } from './components/atoms/Skeleton';
|
|
8
6
|
export { default as Incentive } from './components/atoms/Incentive';
|
|
9
7
|
export type { IncentiveProps } from './components/atoms/Incentive';
|
|
10
8
|
export { default as SkuSelector } from './components/molecules/SkuSelector';
|
|
11
9
|
export type { SkuSelectorProps } from './components/molecules/SkuSelector';
|
|
12
|
-
export { default as ProductTitle } from './components/molecules/ProductTitle';
|
|
13
|
-
export type { ProductTitleProps } from './components/molecules/ProductTitle';
|
|
14
10
|
export { default as OrderSummary } from './components/molecules/OrderSummary';
|
|
15
11
|
export type { OrderSummaryProps } from './components/molecules/OrderSummary';
|
|
16
12
|
export { default as ProductCard, ProductCardImage, ProductCardContent, ProductCardActions, } from './components/molecules/ProductCard';
|
package/dist/index.js
CHANGED
|
@@ -2,11 +2,9 @@ export * from '@faststore/components';
|
|
|
2
2
|
// Atoms
|
|
3
3
|
export { default as Popover } from './components/atoms/Popover';
|
|
4
4
|
export { default as TextArea } from './components/atoms/TextArea';
|
|
5
|
-
export { default as Skeleton } from './components/atoms/Skeleton';
|
|
6
5
|
export { default as Incentive } from './components/atoms/Incentive';
|
|
7
6
|
// Molecules
|
|
8
7
|
export { default as SkuSelector } from './components/molecules/SkuSelector';
|
|
9
|
-
export { default as ProductTitle } from './components/molecules/ProductTitle';
|
|
10
8
|
export { default as OrderSummary } from './components/molecules/OrderSummary';
|
|
11
9
|
export { default as ProductCard, ProductCardImage, ProductCardContent, ProductCardActions, } from './components/molecules/ProductCard';
|
|
12
10
|
export { default as Card, CardImage, CardContent, CardActions, } from './components/molecules/Card';
|
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,
|
|
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,SAAS,EAAE,MAAM,8BAA8B,CAAA;AAGnE,YAAY;AACZ,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,oCAAoC,CAAA;AAG3E,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,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,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.59-alpha.0",
|
|
4
4
|
"description": "A lightweight, framework agnostic component library for React",
|
|
5
5
|
"author": "emersonlaurentino",
|
|
6
6
|
"license": "MIT",
|
|
@@ -59,5 +59,5 @@
|
|
|
59
59
|
"node": "16.18.0",
|
|
60
60
|
"yarn": "1.19.1"
|
|
61
61
|
},
|
|
62
|
-
"gitHead": "
|
|
62
|
+
"gitHead": "c77d8db1934c7d2c6f7ae9cc8a166477edbfae01"
|
|
63
63
|
}
|
|
@@ -135,10 +135,6 @@
|
|
|
135
135
|
[data-fs-badge-wrapper] {
|
|
136
136
|
background-color: var(--fs-badge-success-bkg-color);
|
|
137
137
|
border-color: var(--fs-badge-success-border-color);
|
|
138
|
-
|
|
139
|
-
&::after {
|
|
140
|
-
background-color: var(--fs-badge-success-bkg-color);
|
|
141
|
-
}
|
|
142
138
|
}
|
|
143
139
|
}
|
|
144
140
|
|
|
@@ -148,10 +144,6 @@
|
|
|
148
144
|
[data-fs-badge-wrapper] {
|
|
149
145
|
background-color: var(--fs-badge-neutral-bkg-color);
|
|
150
146
|
border-color: var(--fs-badge-neutral-border-color);
|
|
151
|
-
|
|
152
|
-
&::after {
|
|
153
|
-
background-color: var(--fs-badge-neutral-bkg-color);
|
|
154
|
-
}
|
|
155
147
|
}
|
|
156
148
|
}
|
|
157
149
|
|
|
@@ -161,10 +153,6 @@
|
|
|
161
153
|
[data-fs-badge-wrapper] {
|
|
162
154
|
background-color: var(--fs-badge-highlighted-bkg-color);
|
|
163
155
|
border-color: var(--fs-badge-highlighted-border-color);
|
|
164
|
-
|
|
165
|
-
&::after {
|
|
166
|
-
background-color: var(--fs-badge-highlighted-bkg-color);
|
|
167
|
-
}
|
|
168
156
|
}
|
|
169
157
|
}
|
|
170
158
|
|
|
@@ -174,10 +162,6 @@
|
|
|
174
162
|
[data-fs-badge-wrapper] {
|
|
175
163
|
background-color: var(--fs-badge-info-bkg-color);
|
|
176
164
|
border-color: var(--fs-badge-info-border-color);
|
|
177
|
-
|
|
178
|
-
&::after {
|
|
179
|
-
background-color: var(--fs-badge-info-bkg-color);
|
|
180
|
-
}
|
|
181
165
|
}
|
|
182
166
|
}
|
|
183
167
|
|
|
@@ -187,10 +171,6 @@
|
|
|
187
171
|
[data-fs-badge-wrapper] {
|
|
188
172
|
background-color: var(--fs-badge-warning-bkg-color);
|
|
189
173
|
border-color: var(--fs-badge-warning-border-color);
|
|
190
|
-
|
|
191
|
-
&::after {
|
|
192
|
-
background-color: var(--fs-badge-warning-bkg-color);
|
|
193
|
-
}
|
|
194
174
|
}
|
|
195
175
|
}
|
|
196
176
|
|
|
@@ -200,10 +180,6 @@
|
|
|
200
180
|
[data-fs-badge-wrapper] {
|
|
201
181
|
background-color: var(--fs-badge-danger-bkg-color);
|
|
202
182
|
border-color: var(--fs-badge-danger-border-color);
|
|
203
|
-
|
|
204
|
-
&::after {
|
|
205
|
-
background-color: var(--fs-badge-danger-bkg-color);
|
|
206
|
-
}
|
|
207
183
|
}
|
|
208
184
|
}
|
|
209
185
|
}
|
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
[data-fs-skeleton] {
|
|
2
|
+
// --------------------------------------------------------
|
|
3
|
+
// Design Tokens for Skeleton
|
|
4
|
+
// --------------------------------------------------------
|
|
5
|
+
|
|
6
|
+
// Default properties
|
|
7
|
+
--fs-skeleton-bkg-color : var(--fs-color-disabled-bkg);
|
|
8
|
+
--fs-skeleton-border-radius : var(--fs-border-radius);
|
|
9
|
+
|
|
10
|
+
// Shimmer
|
|
11
|
+
--fs-skeleton-shimmer-width : 50%;
|
|
12
|
+
--fs-skeleton-shimmer-height : 100%;
|
|
13
|
+
--fs-skeleton-shimmer-bkg-color : rgb(255 255 255 / 20%);
|
|
14
|
+
--fs-skeleton-shimmer-box-shadow : 0 0 var(--fs-spacing-5) var(--fs-spacing-5) var(--fs-skeleton-shimmer-bkg-color);
|
|
15
|
+
|
|
16
|
+
--fs-skeleton-shimmer-transition-timing : 850ms;
|
|
17
|
+
--fs-skeleton-shimmer-transition-function : linear;
|
|
18
|
+
--fs-skeleton-shimmer-transition-iteration : infinite;
|
|
19
|
+
|
|
20
|
+
// --------------------------------------------------------
|
|
21
|
+
// Structural Styles
|
|
22
|
+
// --------------------------------------------------------
|
|
23
|
+
|
|
24
|
+
overflow: hidden;
|
|
25
|
+
position: relative;
|
|
26
|
+
background: var(--fs-skeleton-bkg-color);
|
|
27
|
+
border-radius: var(--fs-skeleton-border-radius);
|
|
28
|
+
|
|
29
|
+
[data-fs-skeleton-shimmer] {
|
|
30
|
+
position: absolute;
|
|
31
|
+
top: 0;
|
|
32
|
+
left: 0;
|
|
33
|
+
width: 100vw;
|
|
34
|
+
height: 100%;
|
|
35
|
+
animation: loading var(--fs-skeleton-shimmer-transition-timing) var(--fs-skeleton-shimmer-transition-iteration) var(--fs-skeleton-shimmer-transition-function);
|
|
36
|
+
&::after {
|
|
37
|
+
position: absolute;
|
|
38
|
+
content: '';
|
|
39
|
+
width: var(--fs-skeleton-shimmer-width);
|
|
40
|
+
height: var(--fs-skeleton-shimmer-height);
|
|
41
|
+
background: var(--fs-skeleton-shimmer-bkg-color);
|
|
42
|
+
box-shadow: var(--fs-skeleton-shimmer-box-shadow);
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
|
|
47
|
+
// --------------------------------------------------------
|
|
48
|
+
// Variants Styles
|
|
49
|
+
// --------------------------------------------------------
|
|
50
|
+
|
|
51
|
+
&[data-fs-skeleton-border="regular"] {
|
|
52
|
+
border-radius: var(--fs-skeleton-border-radius);
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
&[data-fs-skeleton-border="pill"] {
|
|
56
|
+
border-radius: var(--fs-border-radius-pill);
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
&[data-fs-skeleton-border="circle"] {
|
|
60
|
+
border-radius: var(--fs-border-radius-circle);
|
|
61
|
+
}
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
@keyframes loading {
|
|
65
|
+
0% { transform: translate3d(-50vw, 0, 0); }
|
|
66
|
+
100% { transform: translate3d(0, 0, 0); }
|
|
67
|
+
}
|
|
@@ -12,7 +12,7 @@ import { RightArrowIcon, LeftArrowIcon } from './Arrows'
|
|
|
12
12
|
import CarouselItem from './CarouselItem'
|
|
13
13
|
import useSlider from '../../../hooks/useSlider/useSlider'
|
|
14
14
|
import Bullets from '../Bullets'
|
|
15
|
-
import { IconButton } from '../../../
|
|
15
|
+
import { IconButton } from '../../../'
|
|
16
16
|
|
|
17
17
|
const createTransformValues = (infinite: boolean, totalItems: number) => {
|
|
18
18
|
const transformMap: Record<number, number> = {}
|
|
@@ -28,10 +28,6 @@
|
|
|
28
28
|
[data-fs-badge-wrapper] {
|
|
29
29
|
background-color: var(--fs-discount-badge-low-bkg-color);
|
|
30
30
|
border-color: var(--fs-discount-badge-low-border-color);
|
|
31
|
-
|
|
32
|
-
&::after {
|
|
33
|
-
background-color: var(--fs-discount-badge-low-bkg-color);
|
|
34
|
-
}
|
|
35
31
|
}
|
|
36
32
|
}
|
|
37
33
|
|
|
@@ -41,7 +37,6 @@
|
|
|
41
37
|
[data-fs-badge-wrapper] {
|
|
42
38
|
background-color: var(--fs-discount-badge-medium-bkg-color);
|
|
43
39
|
border-color: var(--fs-discount-badge-medium-border-color);
|
|
44
|
-
&::after { background-color: var(--fs-discount-badge-medium-bkg-color); }
|
|
45
40
|
}
|
|
46
41
|
}
|
|
47
42
|
|
|
@@ -51,7 +46,6 @@
|
|
|
51
46
|
[data-fs-badge-wrapper] {
|
|
52
47
|
background-color: var(--fs-discount-badge-high-bkg-color);
|
|
53
48
|
border-color: var(--fs-discount-badge-high-border-color);
|
|
54
|
-
&::after { background-color: var(--fs-discount-badge-high-bkg-color); }
|
|
55
49
|
}
|
|
56
50
|
}
|
|
57
51
|
}
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
[data-fs-product-title] {
|
|
2
|
+
// --------------------------------------------------------
|
|
3
|
+
// Design Tokens for Product Title
|
|
4
|
+
// --------------------------------------------------------
|
|
5
|
+
|
|
6
|
+
// Default properties
|
|
7
|
+
--fs-product-title-text-size : var(--fs-text-size-title-product);
|
|
8
|
+
--fs-product-title-text-weight : var(--fs-text-weight-regular);
|
|
9
|
+
--fs-product-title-line-height : 1.12;
|
|
10
|
+
--fs-product-title-column-gap : var(--fs-spacing-2);
|
|
11
|
+
--fs-product-title-row-gap : var(--fs-spacing-3);
|
|
12
|
+
|
|
13
|
+
--fs-product-title-addendum-color : var(--fs-color-text-light);
|
|
14
|
+
--fs-product-title-addendum-size : var(--fs-text-size-1);
|
|
15
|
+
--fs-product-title-addendum-line-height : 1.7;
|
|
16
|
+
|
|
17
|
+
// --------------------------------------------------------
|
|
18
|
+
// Structural Styles
|
|
19
|
+
// --------------------------------------------------------
|
|
20
|
+
|
|
21
|
+
[data-fs-product-title-header] {
|
|
22
|
+
display: flex;
|
|
23
|
+
justify-content: space-between;
|
|
24
|
+
max-width: 42ch;
|
|
25
|
+
flex-wrap: wrap;
|
|
26
|
+
column-gap: var(--fs-product-title-column-gap);
|
|
27
|
+
row-gap: var(--fs-product-title-row-gap);
|
|
28
|
+
|
|
29
|
+
// Title prop
|
|
30
|
+
& > *:first-child {
|
|
31
|
+
font-size: var(--fs-product-title-text-size);
|
|
32
|
+
font-weight: var(--fs-product-title-text-weight);
|
|
33
|
+
line-height: var(--fs-product-title-line-height);
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
[data-fs-badge] { white-space: nowrap; }
|
|
37
|
+
|
|
38
|
+
@include media(">=tablet", "<notebook") {
|
|
39
|
+
flex-direction: column;
|
|
40
|
+
row-gap: var(--fs-product-title-row-gap);
|
|
41
|
+
}
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
[data-fs-product-title-addendum] {
|
|
45
|
+
display: flex;
|
|
46
|
+
justify-content: space-between;
|
|
47
|
+
align-items: center;
|
|
48
|
+
margin-top: var(--fs-product-title-row-gap);
|
|
49
|
+
font-size: var(--fs-product-title-addendum-size);
|
|
50
|
+
line-height: var(--fs-product-title-addendum-line-height);
|
|
51
|
+
color: var(--fs-product-title-addendum-color);
|
|
52
|
+
}
|
|
53
|
+
}
|
package/src/index.ts
CHANGED
|
@@ -7,9 +7,6 @@ export type { PopoverProps } from './components/atoms/Popover'
|
|
|
7
7
|
export { default as TextArea } from './components/atoms/TextArea'
|
|
8
8
|
export type { TextAreaProps } from './components/atoms/TextArea'
|
|
9
9
|
|
|
10
|
-
export { default as Skeleton } from './components/atoms/Skeleton'
|
|
11
|
-
export type { SkeletonProps } from './components/atoms/Skeleton'
|
|
12
|
-
|
|
13
10
|
export { default as Incentive } from './components/atoms/Incentive'
|
|
14
11
|
export type { IncentiveProps } from './components/atoms/Incentive'
|
|
15
12
|
|
|
@@ -17,9 +14,6 @@ export type { IncentiveProps } from './components/atoms/Incentive'
|
|
|
17
14
|
export { default as SkuSelector } from './components/molecules/SkuSelector'
|
|
18
15
|
export type { SkuSelectorProps } from './components/molecules/SkuSelector'
|
|
19
16
|
|
|
20
|
-
export { default as ProductTitle } from './components/molecules/ProductTitle'
|
|
21
|
-
export type { ProductTitleProps } from './components/molecules/ProductTitle'
|
|
22
|
-
|
|
23
17
|
export { default as OrderSummary } from './components/molecules/OrderSummary'
|
|
24
18
|
export type { OrderSummaryProps } from './components/molecules/OrderSummary'
|
|
25
19
|
|
|
@@ -11,6 +11,7 @@
|
|
|
11
11
|
@import "../components/atoms/Price/styles";
|
|
12
12
|
@import "../components/atoms/Radio/styles";
|
|
13
13
|
@import "../components/atoms/Select/styles";
|
|
14
|
+
@import "../components/atoms/Skeleton/styles";
|
|
14
15
|
@import "../components/atoms/Slider/styles";
|
|
15
16
|
@import "../components/atoms/SROnly/styles";
|
|
16
17
|
|
|
@@ -25,6 +26,7 @@
|
|
|
25
26
|
@import "../components/molecules/InputField/styles";
|
|
26
27
|
@import "../components/molecules/LinkButton/styles";
|
|
27
28
|
@import "../components/molecules/Modal/styles";
|
|
29
|
+
@import "../components/molecules/ProductTitle/styles";
|
|
28
30
|
@import "../components/molecules/QuantitySelector/styles";
|
|
29
31
|
@import "../components/molecules/RadioField/styles";
|
|
30
32
|
@import "../components/molecules/Rating/styles";
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import type { HTMLAttributes } from 'react';
|
|
3
|
-
export interface SkeletonProps extends HTMLAttributes<HTMLDivElement> {
|
|
4
|
-
/**
|
|
5
|
-
* ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
|
|
6
|
-
*/
|
|
7
|
-
testId?: string;
|
|
8
|
-
}
|
|
9
|
-
declare const Skeleton: React.ForwardRefExoticComponent<SkeletonProps & React.RefAttributes<HTMLDivElement>>;
|
|
10
|
-
export default Skeleton;
|
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
import React, { forwardRef } from 'react';
|
|
2
|
-
const Skeleton = forwardRef(function Skeleton({ testId = 'store-skeleton', ...otherProps }, ref) {
|
|
3
|
-
return (React.createElement("div", { ref: ref, "data-fs-skeleton": true, "data-testid": testId, ...otherProps }));
|
|
4
|
-
});
|
|
5
|
-
export default Skeleton;
|
|
6
|
-
//# sourceMappingURL=Skeleton.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Skeleton.js","sourceRoot":"","sources":["../../../../src/components/atoms/Skeleton/Skeleton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAUzC,MAAM,QAAQ,GAAG,UAAU,CAAgC,SAAS,QAAQ,CAC1E,EAAE,MAAM,GAAG,gBAAgB,EAAE,GAAG,UAAU,EAAE,EAC5C,GAAG;IAEH,OAAO,CACL,6BAAK,GAAG,EAAE,GAAG,2CAAgC,MAAM,KAAM,UAAU,GAAI,CACxE,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,QAAQ,CAAA"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/atoms/Skeleton/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAA"}
|
|
@@ -1,47 +0,0 @@
|
|
|
1
|
-
import React, { HTMLAttributes } from 'react';
|
|
2
|
-
import type { ReactNode } from 'react';
|
|
3
|
-
export type ProductTitleProps = Omit<HTMLAttributes<HTMLElement>, 'title'> & {
|
|
4
|
-
/**
|
|
5
|
-
* A react component to be used as the product title, e.g. a `h1`
|
|
6
|
-
*/
|
|
7
|
-
title: ReactNode;
|
|
8
|
-
/**
|
|
9
|
-
* A react component to be used as the product label, e.g. a `DiscountBadge`
|
|
10
|
-
*/
|
|
11
|
-
label?: ReactNode;
|
|
12
|
-
/**
|
|
13
|
-
* Label for reference.
|
|
14
|
-
*/
|
|
15
|
-
refTag?: string;
|
|
16
|
-
/**
|
|
17
|
-
* A text to be used below the title and the label, such as the product's reference number.
|
|
18
|
-
*/
|
|
19
|
-
refNumber?: string;
|
|
20
|
-
/**
|
|
21
|
-
* ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
|
|
22
|
-
*/
|
|
23
|
-
testId?: string;
|
|
24
|
-
};
|
|
25
|
-
declare const ProductTitle: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLElement>, "title"> & {
|
|
26
|
-
/**
|
|
27
|
-
* A react component to be used as the product title, e.g. a `h1`
|
|
28
|
-
*/
|
|
29
|
-
title: ReactNode;
|
|
30
|
-
/**
|
|
31
|
-
* A react component to be used as the product label, e.g. a `DiscountBadge`
|
|
32
|
-
*/
|
|
33
|
-
label?: ReactNode;
|
|
34
|
-
/**
|
|
35
|
-
* Label for reference.
|
|
36
|
-
*/
|
|
37
|
-
refTag?: string | undefined;
|
|
38
|
-
/**
|
|
39
|
-
* A text to be used below the title and the label, such as the product's reference number.
|
|
40
|
-
*/
|
|
41
|
-
refNumber?: string | undefined;
|
|
42
|
-
/**
|
|
43
|
-
* ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
|
|
44
|
-
*/
|
|
45
|
-
testId?: string | undefined;
|
|
46
|
-
} & React.RefAttributes<HTMLElement>>;
|
|
47
|
-
export default ProductTitle;
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import React, { forwardRef } from 'react';
|
|
2
|
-
const ProductTitle = forwardRef(function ProductTitle({ title, label, refTag = "Ref.: ", refNumber, testId = 'store-product-title', ...otherProps }, ref) {
|
|
3
|
-
return (React.createElement("header", { ref: ref, "data-fs-product-title": true, "data-testid": testId, ...otherProps },
|
|
4
|
-
React.createElement("div", { "data-fs-product-title-header": true },
|
|
5
|
-
title,
|
|
6
|
-
!!label && label),
|
|
7
|
-
refNumber && (React.createElement("p", { "data-fs-product-title-addendum": true },
|
|
8
|
-
refTag,
|
|
9
|
-
refNumber))));
|
|
10
|
-
});
|
|
11
|
-
export default ProductTitle;
|
|
12
|
-
//# sourceMappingURL=ProductTitle.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ProductTitle.js","sourceRoot":"","sources":["../../../../src/components/molecules/ProductTitle/ProductTitle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAkB,MAAM,OAAO,CAAA;AA0BzD,MAAM,YAAY,GAAG,UAAU,CAC7B,SAAS,YAAY,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,GAAE,QAAQ,EAAC,SAAS,EAAE,MAAM,GAAE,qBAAqB,EAAE,GAAG,UAAU,EAAE,EAAE,GAAG;IACnH,OAAO,CACL,gCAAQ,GAAG,EAAE,GAAG,gDAAqC,MAAM,KAAM,UAAU;QACzE;YACG,KAAK;YACL,CAAC,CAAC,KAAK,IAAI,KAAK,CACb;QAEL,SAAS,IAAI,CACZ;YACG,MAAM;YAAE,SAAS,CAChB,CACL,CACM,CACV,CAAA;AACH,CAAC,CACF,CAAA;AAED,eAAe,YAAY,CAAA"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/molecules/ProductTitle/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAA"}
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import React, { forwardRef } from 'react'
|
|
2
|
-
import type { HTMLAttributes } from 'react'
|
|
3
|
-
|
|
4
|
-
export interface SkeletonProps extends HTMLAttributes<HTMLDivElement> {
|
|
5
|
-
/**
|
|
6
|
-
* ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
|
|
7
|
-
*/
|
|
8
|
-
testId?: string
|
|
9
|
-
}
|
|
10
|
-
|
|
11
|
-
const Skeleton = forwardRef<HTMLDivElement, SkeletonProps>(function Skeleton(
|
|
12
|
-
{ testId = 'store-skeleton', ...otherProps },
|
|
13
|
-
ref
|
|
14
|
-
) {
|
|
15
|
-
return (
|
|
16
|
-
<div ref={ref} data-fs-skeleton data-testid={testId} {...otherProps} />
|
|
17
|
-
)
|
|
18
|
-
})
|
|
19
|
-
|
|
20
|
-
export default Skeleton
|
|
@@ -1,46 +0,0 @@
|
|
|
1
|
-
import React, { forwardRef, HTMLAttributes } from 'react'
|
|
2
|
-
import type { ReactNode } from 'react'
|
|
3
|
-
|
|
4
|
-
export type ProductTitleProps = Omit<HTMLAttributes<HTMLElement>, 'title'> & {
|
|
5
|
-
/**
|
|
6
|
-
* A react component to be used as the product title, e.g. a `h1`
|
|
7
|
-
*/
|
|
8
|
-
title: ReactNode
|
|
9
|
-
/**
|
|
10
|
-
* A react component to be used as the product label, e.g. a `DiscountBadge`
|
|
11
|
-
*/
|
|
12
|
-
label?: ReactNode
|
|
13
|
-
/**
|
|
14
|
-
* Label for reference.
|
|
15
|
-
*/
|
|
16
|
-
refTag?: string
|
|
17
|
-
/**
|
|
18
|
-
* A text to be used below the title and the label, such as the product's reference number.
|
|
19
|
-
*/
|
|
20
|
-
refNumber?: string
|
|
21
|
-
/**
|
|
22
|
-
* ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
|
|
23
|
-
*/
|
|
24
|
-
testId?: string
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
const ProductTitle = forwardRef<HTMLElement, ProductTitleProps>(
|
|
28
|
-
function ProductTitle({ title, label, refTag= "Ref.: ",refNumber, testId= 'store-product-title', ...otherProps }, ref) {
|
|
29
|
-
return (
|
|
30
|
-
<header ref={ref} data-fs-product-title data-testid={testId} {...otherProps}>
|
|
31
|
-
<div data-fs-product-title-header>
|
|
32
|
-
{title}
|
|
33
|
-
{!!label && label}
|
|
34
|
-
</div>
|
|
35
|
-
|
|
36
|
-
{refNumber && (
|
|
37
|
-
<p data-fs-product-title-addendum>
|
|
38
|
-
{refTag}{refNumber}
|
|
39
|
-
</p>
|
|
40
|
-
)}
|
|
41
|
-
</header>
|
|
42
|
-
)
|
|
43
|
-
}
|
|
44
|
-
)
|
|
45
|
-
|
|
46
|
-
export default ProductTitle
|