@faststore/core 2.0.66-alpha.0 → 2.0.69-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/.turbo/turbo-build.log
CHANGED
|
@@ -24,10 +24,10 @@ Route (pages) Size First Load JS
|
|
|
24
24
|
┌ ● / 2.84 kB 124 kB
|
|
25
25
|
├ └ css/43d61b402f41569b.css 1.84 kB
|
|
26
26
|
├ /_app 0 B 100 kB
|
|
27
|
-
├ ● /[...slug]
|
|
28
|
-
├ └ css/
|
|
29
|
-
├ ● /[slug]/p 11.
|
|
30
|
-
├ └ css/
|
|
27
|
+
├ ● /[...slug] 6.83 kB 128 kB
|
|
28
|
+
├ └ css/8e980d3191396e67.css 2.56 kB
|
|
29
|
+
├ ● /[slug]/p 11.9 kB 133 kB
|
|
30
|
+
├ └ css/1bc30e7e0de1217d.css 3.97 kB
|
|
31
31
|
├ ○ /404 431 B 106 kB
|
|
32
32
|
├ ○ /500 439 B 106 kB
|
|
33
33
|
├ ○ /account 369 B 106 kB
|
|
@@ -35,14 +35,14 @@ Route (pages) Size First Load JS
|
|
|
35
35
|
├ λ /api/preview 0 B 100 kB
|
|
36
36
|
├ ○ /checkout 371 B 106 kB
|
|
37
37
|
├ ○ /login 368 B 106 kB
|
|
38
|
-
└ ○ /s
|
|
39
|
-
└ css/
|
|
38
|
+
└ ○ /s 6.14 kB 122 kB
|
|
39
|
+
└ css/e8f44fcf61ab2e4a.css 2.36 kB
|
|
40
40
|
+ First Load JS shared by all 119 kB
|
|
41
41
|
├ chunks/framework-dfd14d7ce6600b03.js 45.3 kB
|
|
42
42
|
├ chunks/main-9746772201fe3ac1.js 23.9 kB
|
|
43
43
|
├ chunks/pages/_app-e7c6f1c268f7cf60.js 28.9 kB
|
|
44
|
-
├ chunks/webpack-
|
|
45
|
-
└ css/
|
|
44
|
+
├ chunks/webpack-4cc1704791fe4bfe.js 2.23 kB
|
|
45
|
+
└ css/143753c0da8d77a0.css 18.7 kB
|
|
46
46
|
|
|
47
47
|
λ (Server) server-side renders at runtime (uses getInitialProps or getServerSideProps)
|
|
48
48
|
○ (Static) automatically rendered as static HTML (uses no initial props)
|
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,18 @@
|
|
|
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.69-alpha.0](https://github.com/vtex/faststore/compare/v2.0.68-alpha.0...v2.0.69-alpha.0) (2023-02-15)
|
|
7
|
+
|
|
8
|
+
### Features
|
|
9
|
+
|
|
10
|
+
- Add `Breadcrumb` component ([#1635](https://github.com/vtex/faststore/issues/1635)) ([20a2f1b](https://github.com/vtex/faststore/commit/20a2f1bb3cf8551e0477b5c4641ae9af4b20a525))
|
|
11
|
+
|
|
12
|
+
## [2.0.67-alpha.0](https://github.com/vtex/faststore/compare/v2.0.66-alpha.0...v2.0.67-alpha.0) (2023-02-14)
|
|
13
|
+
|
|
14
|
+
### Features
|
|
15
|
+
|
|
16
|
+
- CLI makes WebOps Evergreen + Vercel ([#1618](https://github.com/vtex/faststore/issues/1618)) ([c8c9083](https://github.com/vtex/faststore/commit/c8c908321f56e7ca570cd15e3ed7a145197a6d38)), closes [/github.com/vtex/vtex-cicd-platform/blob/main/images/faststore-ci-cd/src/plugins/nextjs12/mod.ts#L23](https://github.com/vtex//github.com/vtex/vtex-cicd-platform/blob/main/images/faststore-ci-cd/src/plugins/nextjs12/mod.ts/issues/L23) [/github.com/vtex/faststore/blob/main/packages/cli/src/commands/dev.ts#L29](https://github.com/vtex//github.com/vtex/faststore/blob/main/packages/cli/src/commands/dev.ts/issues/L29)
|
|
17
|
+
|
|
6
18
|
## 2.0.66-alpha.0 (2023-02-13)
|
|
7
19
|
|
|
8
20
|
### Bug Fixes
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@faststore/core",
|
|
3
|
-
"version": "2.0.
|
|
3
|
+
"version": "2.0.69-alpha.0",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"browserslist": "supports es6-module and not dead",
|
|
6
6
|
"scripts": {
|
|
@@ -30,10 +30,10 @@
|
|
|
30
30
|
"@envelop/parser-cache": "^2.2.0",
|
|
31
31
|
"@envelop/validation-cache": "^2.2.0",
|
|
32
32
|
"@faststore/api": "^2.0.3-alpha.0",
|
|
33
|
-
"@faststore/components": "^2.0.
|
|
33
|
+
"@faststore/components": "^2.0.69-alpha.0",
|
|
34
34
|
"@faststore/graphql-utils": "^2.0.3-alpha.0",
|
|
35
35
|
"@faststore/sdk": "^2.0.3-alpha.0",
|
|
36
|
-
"@faststore/ui": "^2.0.
|
|
36
|
+
"@faststore/ui": "^2.0.69-alpha.0",
|
|
37
37
|
"@types/react": "^18.0.14",
|
|
38
38
|
"@vtex/client-cms": "^0.2.12",
|
|
39
39
|
"autoprefixer": "^10.4.0",
|
|
@@ -108,5 +108,5 @@
|
|
|
108
108
|
"msw": {
|
|
109
109
|
"workerDirectory": "public"
|
|
110
110
|
},
|
|
111
|
-
"gitHead": "
|
|
111
|
+
"gitHead": "9203ce7fd8a8fd0d0ae60afde8743adaec18c53d"
|
|
112
112
|
}
|
|
@@ -1,19 +1,10 @@
|
|
|
1
1
|
import type { BreadcrumbProps as UIBreadcrumbProps } from '@faststore/ui'
|
|
2
|
-
import {
|
|
3
|
-
Breadcrumb as UIBreadcrumb,
|
|
4
|
-
Dropdown as UIDropdown,
|
|
5
|
-
DropdownButton as UIDropdownButton,
|
|
6
|
-
DropdownMenu as UIDropdownMenu,
|
|
7
|
-
DropdownItem as UIDropdownItem,
|
|
8
|
-
} from '@faststore/ui'
|
|
9
|
-
import { useRouter } from 'next/router'
|
|
2
|
+
import { Breadcrumb as UIBreadcrumb } from '@faststore/ui'
|
|
10
3
|
import { memo } from 'react'
|
|
11
4
|
|
|
12
5
|
import Icon from 'src/components/ui/Icon'
|
|
13
6
|
import Link from 'src/components/ui/Link'
|
|
14
7
|
|
|
15
|
-
import styles from './breadcrumb.module.scss'
|
|
16
|
-
|
|
17
8
|
type ItemElement = {
|
|
18
9
|
item: string
|
|
19
10
|
name: string
|
|
@@ -30,94 +21,21 @@ interface BaseBreadcrumbProps extends BreadcrumbProps {
|
|
|
30
21
|
isDesktop?: boolean
|
|
31
22
|
}
|
|
32
23
|
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
const firstItem = isDesktop ? breadcrumbList[0] : null
|
|
39
|
-
const mediumItems = isDesktop
|
|
40
|
-
? breadcrumbList.slice(1, -2)
|
|
41
|
-
: breadcrumbList.slice(0, -2)
|
|
42
|
-
|
|
43
|
-
const lastItems = breadcrumbList.slice(-2)
|
|
44
|
-
|
|
45
|
-
const collapseBreadcrumb = breadcrumbList.length > 4
|
|
46
|
-
|
|
47
|
-
return (
|
|
48
|
-
<UIBreadcrumb
|
|
49
|
-
divider=""
|
|
50
|
-
className={`${styles.fsBreadcrumb} ${
|
|
51
|
-
isDesktop ? 'hidden-mobile' : 'display-mobile'
|
|
52
|
-
}`}
|
|
53
|
-
>
|
|
54
|
-
<Link
|
|
55
|
-
data-fs-breadcrumb-link
|
|
56
|
-
data-fs-breadcrumb-link-home
|
|
57
|
-
aria-label="Go to homepage"
|
|
58
|
-
href="/"
|
|
59
|
-
>
|
|
24
|
+
const Breadcrumb = ({ breadcrumbList, ...otherProps }: BaseBreadcrumbProps) => (
|
|
25
|
+
<UIBreadcrumb
|
|
26
|
+
breadcrumbList={breadcrumbList}
|
|
27
|
+
homeLink={
|
|
28
|
+
<Link aria-label="Go to homepage" href="/">
|
|
60
29
|
<Icon name="House" width={18} height={18} weight="bold" />
|
|
61
30
|
</Link>
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
</Link>
|
|
71
|
-
)
|
|
72
|
-
})}
|
|
73
|
-
|
|
74
|
-
{collapseBreadcrumb && firstItem && (
|
|
75
|
-
<Link data-fs-breadcrumb-link href={firstItem.item}>
|
|
76
|
-
{firstItem.name}
|
|
77
|
-
</Link>
|
|
78
|
-
)}
|
|
79
|
-
|
|
80
|
-
{collapseBreadcrumb && (
|
|
81
|
-
<UIDropdown>
|
|
82
|
-
<UIDropdownButton data-fs-breadcrumb-dropdown-button size="small">
|
|
83
|
-
<Icon name="DotsThree" width={24} height={24} />
|
|
84
|
-
</UIDropdownButton>
|
|
85
|
-
<UIDropdownMenu data-fs-breadcrumb-dropdown-menu>
|
|
86
|
-
{mediumItems.map(({ item, name }, index) => (
|
|
87
|
-
<UIDropdownItem
|
|
88
|
-
data-fs-breadcrumb-dropdown-item
|
|
89
|
-
onClick={() => router.push(item)}
|
|
90
|
-
key={String(index)}
|
|
91
|
-
icon={
|
|
92
|
-
<Icon name="ArrowElbowDownRight" width={24} height={24} />
|
|
93
|
-
}
|
|
94
|
-
>
|
|
95
|
-
{name}
|
|
96
|
-
</UIDropdownItem>
|
|
97
|
-
))}
|
|
98
|
-
</UIDropdownMenu>
|
|
99
|
-
</UIDropdown>
|
|
100
|
-
)}
|
|
101
|
-
|
|
102
|
-
{collapseBreadcrumb &&
|
|
103
|
-
lastItems.map(({ item, name }, index) => {
|
|
104
|
-
return lastItems.length === index + 1 ? (
|
|
105
|
-
<span key={String(index)}>{name}</span>
|
|
106
|
-
) : (
|
|
107
|
-
<Link data-fs-breadcrumb-link href={item} key={String(index)}>
|
|
108
|
-
{name}
|
|
109
|
-
</Link>
|
|
110
|
-
)
|
|
111
|
-
})}
|
|
112
|
-
</UIBreadcrumb>
|
|
113
|
-
)
|
|
114
|
-
}
|
|
115
|
-
|
|
116
|
-
const Breadcrumb = ({ breadcrumbList }: BreadcrumbProps) => (
|
|
117
|
-
<>
|
|
118
|
-
<BaseBreadcrumb breadcrumbList={breadcrumbList} />
|
|
119
|
-
<BaseBreadcrumb breadcrumbList={breadcrumbList} isDesktop />
|
|
120
|
-
</>
|
|
31
|
+
}
|
|
32
|
+
renderLink={({ itemProps: { item: link, name } }) => (
|
|
33
|
+
<Link data-fs-breadcrumb-link href={link}>
|
|
34
|
+
{name}
|
|
35
|
+
</Link>
|
|
36
|
+
)}
|
|
37
|
+
{...otherProps}
|
|
38
|
+
></UIBreadcrumb>
|
|
121
39
|
)
|
|
122
40
|
|
|
123
41
|
export default memo(Breadcrumb)
|
package/tsconfig.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
|
-
"extends": "@faststore/shared/tsconfig.json",
|
|
3
2
|
"compilerOptions": {
|
|
3
|
+
"allowSyntheticDefaultImports": true,
|
|
4
4
|
"declaration": false,
|
|
5
5
|
"moduleResolution": "node",
|
|
6
6
|
"jsx": "preserve",
|
|
@@ -15,11 +15,14 @@
|
|
|
15
15
|
"src/*": ["src/*"],
|
|
16
16
|
"@generated/*": ["@generated/*"]
|
|
17
17
|
},
|
|
18
|
+
"forceConsistentCasingInFileNames": true,
|
|
18
19
|
"strict": false,
|
|
19
20
|
"incremental": true,
|
|
20
21
|
"isolatedModules": true,
|
|
21
22
|
"target": "es5",
|
|
22
|
-
"lib": ["dom", "dom.iterable", "esnext"]
|
|
23
|
+
"lib": ["dom", "dom.iterable", "esnext"],
|
|
24
|
+
"skipLibCheck": true,
|
|
25
|
+
"esModuleInterop": true
|
|
23
26
|
},
|
|
24
27
|
"include": ["*.d.ts", "src/**/*.ts", "src/**/*.tsx", "@generated/**/*.ts"],
|
|
25
28
|
"exclude": ["node_modules", "public", "src/components/search/searchMock.ts"]
|
|
@@ -1,144 +0,0 @@
|
|
|
1
|
-
@import "src/styles/scaffold";
|
|
2
|
-
|
|
3
|
-
.fs-breadcrumb {
|
|
4
|
-
// --------------------------------------------------------
|
|
5
|
-
// Design Tokens for Breadcrumb
|
|
6
|
-
// --------------------------------------------------------
|
|
7
|
-
|
|
8
|
-
// Default properties
|
|
9
|
-
--fs-breadcrumb-margin-left : calc(-1 * var(--fs-spacing-1));
|
|
10
|
-
--fs-breadcrumb-padding : var(--fs-spacing-2) 0;
|
|
11
|
-
|
|
12
|
-
// List item
|
|
13
|
-
--fs-breadcrumb-list-item-padding : var(--fs-spacing-0);
|
|
14
|
-
--fs-breadcrumb-list-item-last-text-color : var(--fs-color-text-light);
|
|
15
|
-
--fs-breadcrumb-list-item-max-width-mobile : 30%;
|
|
16
|
-
|
|
17
|
-
// Link
|
|
18
|
-
--fs-breadcrumb-link-color-visited : var(--fs-color-link);
|
|
19
|
-
|
|
20
|
-
// Link Home
|
|
21
|
-
--fs-breadcrumb-link-home-padding : var(--fs-spacing-1);
|
|
22
|
-
--fs-breadcrumb-link-home-border-radius : var(--fs-border-radius-circle);
|
|
23
|
-
--fs-breadcrumb-link-home-hover-bkg-color : var(--fs-color-primary-bkg-light);
|
|
24
|
-
--fs-breadcrumb-link-home-color : var(--fs-color-text);
|
|
25
|
-
|
|
26
|
-
// Divider
|
|
27
|
-
--fs-breadcrumb-divider-height : var(--fs-spacing-3);
|
|
28
|
-
--fs-breadcrumb-divider-margin : var(--fs-spacing-1);
|
|
29
|
-
--fs-breadcrumb-divider-border-left-width : var(--fs-border-width);
|
|
30
|
-
--fs-breadcrumb-divider-border-left-color : var(--fs-border-color-light);
|
|
31
|
-
|
|
32
|
-
// Dropdown Button
|
|
33
|
-
--fs-breadcrumb-dropdown-button-margin-left : var(--fs-breadcrumb-margin-left);
|
|
34
|
-
--fs-breadcrumb-dropdown-button-color : var(--fs-color-link);
|
|
35
|
-
--fs-breadcrumb-dropdown-button-border-radius : var(--fs-spacing-0);
|
|
36
|
-
--fs-breadcrumb-dropdown-button-transition-property : var(--fs-transition-property);
|
|
37
|
-
--fs-breadcrumb-dropdown-button-transition-timing : var(--fs-transition-timing);
|
|
38
|
-
--fs-breadcrumb-dropdown-button-transition-function : var(--fs-transition-function);
|
|
39
|
-
|
|
40
|
-
// --------------------------------------------------------
|
|
41
|
-
// Structural Styles
|
|
42
|
-
// --------------------------------------------------------
|
|
43
|
-
|
|
44
|
-
width: 100%;
|
|
45
|
-
padding: var(--fs-breadcrumb-padding);
|
|
46
|
-
|
|
47
|
-
@include media(">=notebook") {
|
|
48
|
-
width: 50%;
|
|
49
|
-
}
|
|
50
|
-
|
|
51
|
-
[data-breadcrumb-list] {
|
|
52
|
-
display: flex;
|
|
53
|
-
align-items: center;
|
|
54
|
-
margin-left: var(--fs-breadcrumb-margin-left);
|
|
55
|
-
overflow-x: hidden;
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
[data-breadcrumb-list-item] {
|
|
59
|
-
display: inline-flex;
|
|
60
|
-
align-items: center;
|
|
61
|
-
padding: var(--fs-breadcrumb-list-item-padding);
|
|
62
|
-
|
|
63
|
-
&:not(:first-child) {
|
|
64
|
-
overflow: hidden;
|
|
65
|
-
text-overflow: ellipsis;
|
|
66
|
-
white-space: nowrap;
|
|
67
|
-
|
|
68
|
-
@include media("<=tablet") {
|
|
69
|
-
max-width: var(--fs-breadcrumb-list-item-max-width-mobile);
|
|
70
|
-
}
|
|
71
|
-
}
|
|
72
|
-
|
|
73
|
-
[data-fs-breadcrumb-link-home] {
|
|
74
|
-
display: flex;
|
|
75
|
-
align-items: center;
|
|
76
|
-
padding: var(--fs-breadcrumb-link-home-padding);
|
|
77
|
-
border-radius: var(--fs-breadcrumb-link-home-border-radius);
|
|
78
|
-
|
|
79
|
-
&:hover, &:focus {
|
|
80
|
-
background-color: var(--fs-breadcrumb-link-home-hover-bkg-color);
|
|
81
|
-
}
|
|
82
|
-
|
|
83
|
-
svg {
|
|
84
|
-
color: var(--fs-breadcrumb-link-home-color);
|
|
85
|
-
}
|
|
86
|
-
}
|
|
87
|
-
|
|
88
|
-
&:nth-child(2) {
|
|
89
|
-
overflow: visible;
|
|
90
|
-
}
|
|
91
|
-
|
|
92
|
-
&:last-child {
|
|
93
|
-
color: var(--fs-breadcrumb-list-item-last-text-color);
|
|
94
|
-
}
|
|
95
|
-
|
|
96
|
-
@include media(">=notebook") {
|
|
97
|
-
&:nth-child(3) {
|
|
98
|
-
overflow: visible;
|
|
99
|
-
}
|
|
100
|
-
|
|
101
|
-
&:nth-child(2) {
|
|
102
|
-
overflow: hidden;
|
|
103
|
-
}
|
|
104
|
-
}
|
|
105
|
-
}
|
|
106
|
-
|
|
107
|
-
[data-breadcrumb-item] {
|
|
108
|
-
display: block;
|
|
109
|
-
width: 100%;
|
|
110
|
-
overflow: hidden;
|
|
111
|
-
text-overflow: ellipsis;
|
|
112
|
-
white-space: nowrap;
|
|
113
|
-
}
|
|
114
|
-
|
|
115
|
-
[data-breadcrumb-divider] {
|
|
116
|
-
height: var(--fs-breadcrumb-divider-height);
|
|
117
|
-
margin: var(--fs-breadcrumb-divider-margin);
|
|
118
|
-
border-left: var(--fs-breadcrumb-divider-border-left-width) solid var(--fs-breadcrumb-divider-border-left-color);
|
|
119
|
-
}
|
|
120
|
-
|
|
121
|
-
[data-fs-breadcrumb-link] {
|
|
122
|
-
padding: 0;
|
|
123
|
-
|
|
124
|
-
&:visited {
|
|
125
|
-
color: var(--fs-breadcrumb-link-color-visited);
|
|
126
|
-
}
|
|
127
|
-
}
|
|
128
|
-
|
|
129
|
-
[data-fs-breadcrumb-dropdown-button] {
|
|
130
|
-
display: flex;
|
|
131
|
-
align-items: center;
|
|
132
|
-
margin-left: var(--fs-breadcrumb-dropdown-button-margin-left);
|
|
133
|
-
color: var(--fs-breadcrumb-dropdown-button-color);
|
|
134
|
-
cursor: pointer;
|
|
135
|
-
background-color: transparent;
|
|
136
|
-
border-width: 0;
|
|
137
|
-
border-radius: var(--fs-breadcrumb-dropdown-button-border-radius);
|
|
138
|
-
transition: var(--fs-breadcrumb-dropdown-button-transition-property) var(--fs-breadcrumb-dropdown-button-transition-timing) var(--fs-breadcrumb-dropdown-button-transition-function);
|
|
139
|
-
|
|
140
|
-
&:focus, &:focus-visible {
|
|
141
|
-
@include focus-ring;
|
|
142
|
-
}
|
|
143
|
-
}
|
|
144
|
-
}
|