@riosst100/pwa-marketplace 1.8.1 → 1.8.2
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/i18n/id_ID.json +508 -508
- package/package.json +1 -2
- package/src/components/CustomSubCategory/subCategory.js +0 -14
- package/src/components/FilterTop/FilterBlockList/filterTopItemGroup.module.css +1 -1
- package/src/components/FilterTop/filterTop.js +2 -2
- package/src/components/FilterTop/filterTop.module.css +1 -1
- package/src/components/FilterTopBackup/CustomFilters/customFilter.js +83 -83
- package/src/components/FilterTopBackup/CustomFilters/customFilter.module.css +21 -21
- package/src/components/FilterTopBackup/CustomFilters/customFilters.js +131 -131
- package/src/components/FilterTopBackup/CustomFilters/customFilters.module.css +22 -22
- package/src/components/FilterTopBackup/CustomFilters/index.js +1 -1
- package/src/components/FilterTopBackup/filterTop.js +14 -14
- package/src/components/FilterTopBackup/filterTop.module.css +22 -22
- package/src/components/FilterTopBackup/filterTop.shimmer.js +24 -24
- package/src/components/FilterTopBackup/index.js +2 -2
- package/src/components/Header/websiteSwitcher.shimmer.js +6 -6
- package/src/components/Header/websiteSwitcherItem.js +47 -47
- package/src/components/Header/websiteSwitcherItem.module.css +20 -20
- package/src/components/PhoneTextInput/index.js +1 -1
- package/src/components/PhoneTextInput/phoneTextInput.js +62 -62
- package/src/components/ProductListTab/index.js +4 -4
- package/src/components/ProductListTab/productListTab.module.css +64 -64
- package/src/components/ProductListTab/productListTab.shimmer.js +24 -24
- package/src/components/SellerCountry/index.js +1 -1
- package/src/components/SellerCountry/sellerCountry.js +71 -71
- package/src/components/SellerCountry/sellerCountry.module.css +3 -3
- package/src/components/ShopByCategory/index.js +2 -2
- package/src/components/ShopByCategory/shopByCategory.js +69 -69
- package/src/components/ShopByCategory/shopByCategory.module.css +58 -58
- package/src/components/ShopByCategory/shopByCategory.shimmer.js +24 -24
- package/src/components/SubCategory/subCategory.js +1 -1
- package/src/components/WebsiteSwitcher/websiteSwitcher.shimmer.js +6 -6
- package/src/components/WebsiteSwitcher/websiteSwitcherItem.js +47 -47
- package/src/components/WebsiteSwitcher/websiteSwitcherItem.module.css +20 -20
- package/src/overwrites/peregrine/lib/talons/MegaMenu/megaMenu.gql.js +96 -96
- package/src/overwrites/peregrine/lib/talons/MegaMenu/useMegaMenu.js +199 -199
- package/src/overwrites/peregrine/lib/talons/MegaMenu/useMegaMenuItem.js +66 -66
- package/src/overwrites/peregrine/lib/talons/MegaMenu/useSubMenu.js +20 -20
- package/src/overwrites/peregrine/lib/talons/ProductFullDetail/useProductFullDetail.js +642 -642
- package/src/overwrites/peregrine/lib/talons/RootComponents/Category/category.gql.js +49 -49
- package/src/overwrites/peregrine/lib/talons/RootComponents/Category/useCategory.js +227 -227
- package/src/overwrites/peregrine/lib/talons/RootComponents/Product/product.gql.js +31 -31
- package/src/overwrites/peregrine/lib/talons/RootComponents/Product/productDetailFragment.gql.js +235 -235
- package/src/overwrites/venia-ui/lib/components/Header/cartTrigger.module.css +47 -47
- package/src/overwrites/venia-ui/lib/components/RadioGroup/radio.js +60 -60
- package/src/overwrites/venia-ui/lib/components/RadioGroup/radio.module.css +70 -70
- package/src/talons/AttributesBlock/attributesBlock.gql.js +15 -15
- package/src/talons/CustomFilters/customFilters.gql.js +45 -45
- package/src/talons/CustomFilters/useCustomFilters.js +5 -2
- package/src/talons/FilterTop/filterTop.gql.js +45 -45
- package/src/talons/FilterTop/index.js +1 -1
- package/src/talons/FilterTop/useFilterTop.js +5 -4
- package/src/talons/Header/websiteSwitcher.gql.js +45 -45
- package/src/talons/SellerReview/sellerReview.gql.js +53 -53
- package/src/talons/ShopByCategory/index.js +1 -1
- package/src/talons/ShopByCategory/shopByCategory.gql.js +38 -38
- package/src/talons/ShopByCategory/useShopByCategory.js +69 -69
- package/src/talons/SubCategory/subCategory.gql.js +15 -15
- package/src/talons/SubCategory/useSubCategory.js +3 -3
- package/src/talons/WebsiteSwitcher/websiteSwitcher.gql.js +45 -45
|
@@ -1,23 +1,23 @@
|
|
|
1
|
-
.root {
|
|
2
|
-
composes: flex from global;
|
|
3
|
-
composes: flex-wrap from global;
|
|
4
|
-
composes: mt-3 from global;
|
|
5
|
-
composes: gap-[15px] from global;
|
|
6
|
-
margin-bottom: 10px;
|
|
7
|
-
justify-content: center;
|
|
8
|
-
}
|
|
9
|
-
|
|
10
|
-
.item {
|
|
11
|
-
composes: px-4 from global;
|
|
12
|
-
composes: py-2 from global;
|
|
13
|
-
composes: transition-colors from global;
|
|
14
|
-
composes: duration-150 from global;
|
|
15
|
-
composes: border from global;
|
|
16
|
-
composes: border-solid from global;
|
|
17
|
-
composes: leading-normal from global;
|
|
18
|
-
composes: text-base from global;
|
|
19
|
-
composes: text-colorDefault from global;
|
|
20
|
-
composes: bg-white from global;
|
|
21
|
-
composes: border-gray-100 from global;
|
|
22
|
-
border-radius: 5px;
|
|
1
|
+
.root {
|
|
2
|
+
composes: flex from global;
|
|
3
|
+
composes: flex-wrap from global;
|
|
4
|
+
composes: mt-3 from global;
|
|
5
|
+
composes: gap-[15px] from global;
|
|
6
|
+
margin-bottom: 10px;
|
|
7
|
+
/* justify-content: center; */
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
.item {
|
|
11
|
+
composes: px-4 from global;
|
|
12
|
+
composes: py-2 from global;
|
|
13
|
+
composes: transition-colors from global;
|
|
14
|
+
composes: duration-150 from global;
|
|
15
|
+
composes: border from global;
|
|
16
|
+
composes: border-solid from global;
|
|
17
|
+
composes: leading-normal from global;
|
|
18
|
+
composes: text-base from global;
|
|
19
|
+
composes: text-colorDefault from global;
|
|
20
|
+
composes: bg-white from global;
|
|
21
|
+
composes: border-gray-100 from global;
|
|
22
|
+
border-radius: 5px;
|
|
23
23
|
}
|
|
@@ -1,24 +1,24 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { shape, string } from 'prop-types';
|
|
3
|
-
import { useStyle } from '@magento/venia-ui/lib/classify';
|
|
4
|
-
|
|
5
|
-
import Shimmer from '@magento/venia-ui/lib/components/Shimmer';
|
|
6
|
-
import defaultClasses from './filterTop.module.css';
|
|
7
|
-
|
|
8
|
-
const FilterTop = props => {
|
|
9
|
-
const classes = useStyle(defaultClasses, props.classes);
|
|
10
|
-
|
|
11
|
-
return (
|
|
12
|
-
<aside className={classes.root} aria-live="polite" aria-busy="true">
|
|
13
|
-
<Shimmer width="95%" height="70vh" style={{ marginBottom: 25 }} />
|
|
14
|
-
</aside>
|
|
15
|
-
);
|
|
16
|
-
};
|
|
17
|
-
|
|
18
|
-
FilterTop.propTypes = {
|
|
19
|
-
classes: shape({
|
|
20
|
-
root: string
|
|
21
|
-
})
|
|
22
|
-
};
|
|
23
|
-
|
|
24
|
-
export default FilterTop;
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { shape, string } from 'prop-types';
|
|
3
|
+
import { useStyle } from '@magento/venia-ui/lib/classify';
|
|
4
|
+
|
|
5
|
+
import Shimmer from '@magento/venia-ui/lib/components/Shimmer';
|
|
6
|
+
import defaultClasses from './filterTop.module.css';
|
|
7
|
+
|
|
8
|
+
const FilterTop = props => {
|
|
9
|
+
const classes = useStyle(defaultClasses, props.classes);
|
|
10
|
+
|
|
11
|
+
return (
|
|
12
|
+
<aside className={classes.root} aria-live="polite" aria-busy="true">
|
|
13
|
+
<Shimmer width="95%" height="70vh" style={{ marginBottom: 25 }} />
|
|
14
|
+
</aside>
|
|
15
|
+
);
|
|
16
|
+
};
|
|
17
|
+
|
|
18
|
+
FilterTop.propTypes = {
|
|
19
|
+
classes: shape({
|
|
20
|
+
root: string
|
|
21
|
+
})
|
|
22
|
+
};
|
|
23
|
+
|
|
24
|
+
export default FilterTop;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { default } from './filterTop';
|
|
2
|
-
export { default as FilterTopShimmer } from './filterTop.shimmer';
|
|
1
|
+
export { default } from './filterTop';
|
|
2
|
+
export { default as FilterTopShimmer } from './filterTop.shimmer';
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import Shimmer from '@magento/venia-ui/lib/components/Shimmer';
|
|
3
|
-
|
|
4
|
-
export default () => {
|
|
5
|
-
return <Shimmer width={6} height={2.25} />;
|
|
6
|
-
};
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import Shimmer from '@magento/venia-ui/lib/components/Shimmer';
|
|
3
|
+
|
|
4
|
+
export default () => {
|
|
5
|
+
return <Shimmer width={6} height={2.25} />;
|
|
6
|
+
};
|
|
@@ -1,47 +1,47 @@
|
|
|
1
|
-
import React, { useCallback } from 'react';
|
|
2
|
-
import { Check } from 'react-feather';
|
|
3
|
-
import { bool, func, shape, string } from 'prop-types';
|
|
4
|
-
|
|
5
|
-
import { useStyle } from '@magento/venia-ui/lib/classify';
|
|
6
|
-
import Icon from '@magento/venia-ui/lib/components/Icon/icon';
|
|
7
|
-
import defaultClasses from './websiteSwitcherItem.module.css';
|
|
8
|
-
|
|
9
|
-
const WebsiteSwitcherItem = props => {
|
|
10
|
-
const { active, onClick, option, option2, children } = props;
|
|
11
|
-
const classes = useStyle(defaultClasses, props.classes);
|
|
12
|
-
|
|
13
|
-
const handleClick = useCallback(() => {
|
|
14
|
-
onClick(option, option2);
|
|
15
|
-
}, [option, option2, onClick]);
|
|
16
|
-
|
|
17
|
-
const activeIcon = active ? (
|
|
18
|
-
<Icon data-cy="WebsiteSwitcherItem-activeIcon" size={20} src={Check} />
|
|
19
|
-
) : null;
|
|
20
|
-
|
|
21
|
-
return (
|
|
22
|
-
<button
|
|
23
|
-
data-cy="WebsiteSwitcherItem-button"
|
|
24
|
-
className={classes.root}
|
|
25
|
-
disabled={active}
|
|
26
|
-
onClick={handleClick}
|
|
27
|
-
>
|
|
28
|
-
<span className={classes.content}>
|
|
29
|
-
<span className={classes.text}>{children}</span>
|
|
30
|
-
{activeIcon}
|
|
31
|
-
</span>
|
|
32
|
-
</button>
|
|
33
|
-
);
|
|
34
|
-
};
|
|
35
|
-
|
|
36
|
-
WebsiteSwitcherItem.propTypes = {
|
|
37
|
-
active: bool,
|
|
38
|
-
classes: shape({
|
|
39
|
-
content: string,
|
|
40
|
-
root: string,
|
|
41
|
-
text: string
|
|
42
|
-
}),
|
|
43
|
-
onClick: func,
|
|
44
|
-
option: string
|
|
45
|
-
};
|
|
46
|
-
|
|
47
|
-
export default WebsiteSwitcherItem;
|
|
1
|
+
import React, { useCallback } from 'react';
|
|
2
|
+
import { Check } from 'react-feather';
|
|
3
|
+
import { bool, func, shape, string } from 'prop-types';
|
|
4
|
+
|
|
5
|
+
import { useStyle } from '@magento/venia-ui/lib/classify';
|
|
6
|
+
import Icon from '@magento/venia-ui/lib/components/Icon/icon';
|
|
7
|
+
import defaultClasses from './websiteSwitcherItem.module.css';
|
|
8
|
+
|
|
9
|
+
const WebsiteSwitcherItem = props => {
|
|
10
|
+
const { active, onClick, option, option2, children } = props;
|
|
11
|
+
const classes = useStyle(defaultClasses, props.classes);
|
|
12
|
+
|
|
13
|
+
const handleClick = useCallback(() => {
|
|
14
|
+
onClick(option, option2);
|
|
15
|
+
}, [option, option2, onClick]);
|
|
16
|
+
|
|
17
|
+
const activeIcon = active ? (
|
|
18
|
+
<Icon data-cy="WebsiteSwitcherItem-activeIcon" size={20} src={Check} />
|
|
19
|
+
) : null;
|
|
20
|
+
|
|
21
|
+
return (
|
|
22
|
+
<button
|
|
23
|
+
data-cy="WebsiteSwitcherItem-button"
|
|
24
|
+
className={classes.root}
|
|
25
|
+
disabled={active}
|
|
26
|
+
onClick={handleClick}
|
|
27
|
+
>
|
|
28
|
+
<span className={classes.content}>
|
|
29
|
+
<span className={classes.text}>{children}</span>
|
|
30
|
+
{activeIcon}
|
|
31
|
+
</span>
|
|
32
|
+
</button>
|
|
33
|
+
);
|
|
34
|
+
};
|
|
35
|
+
|
|
36
|
+
WebsiteSwitcherItem.propTypes = {
|
|
37
|
+
active: bool,
|
|
38
|
+
classes: shape({
|
|
39
|
+
content: string,
|
|
40
|
+
root: string,
|
|
41
|
+
text: string
|
|
42
|
+
}),
|
|
43
|
+
onClick: func,
|
|
44
|
+
option: string
|
|
45
|
+
};
|
|
46
|
+
|
|
47
|
+
export default WebsiteSwitcherItem;
|
|
@@ -1,20 +1,20 @@
|
|
|
1
|
-
.root {
|
|
2
|
-
composes: flex from global;
|
|
3
|
-
composes: items-center from global;
|
|
4
|
-
composes: w-full from global;
|
|
5
|
-
}
|
|
6
|
-
|
|
7
|
-
.content {
|
|
8
|
-
composes: gap-3 from global;
|
|
9
|
-
composes: grid from global;
|
|
10
|
-
composes: grid-cols-[1fr] from global;
|
|
11
|
-
composes: grid-flow-col from global;
|
|
12
|
-
composes: items-center from global;
|
|
13
|
-
composes: px-xs from global;
|
|
14
|
-
composes: py-2xs from global;
|
|
15
|
-
composes: w-full from global;
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
.text {
|
|
19
|
-
composes: text-left from global;
|
|
20
|
-
}
|
|
1
|
+
.root {
|
|
2
|
+
composes: flex from global;
|
|
3
|
+
composes: items-center from global;
|
|
4
|
+
composes: w-full from global;
|
|
5
|
+
}
|
|
6
|
+
|
|
7
|
+
.content {
|
|
8
|
+
composes: gap-3 from global;
|
|
9
|
+
composes: grid from global;
|
|
10
|
+
composes: grid-cols-[1fr] from global;
|
|
11
|
+
composes: grid-flow-col from global;
|
|
12
|
+
composes: items-center from global;
|
|
13
|
+
composes: px-xs from global;
|
|
14
|
+
composes: py-2xs from global;
|
|
15
|
+
composes: w-full from global;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
.text {
|
|
19
|
+
composes: text-left from global;
|
|
20
|
+
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { default } from './phoneTextInput';
|
|
1
|
+
export { default } from './phoneTextInput';
|
|
@@ -1,62 +1,62 @@
|
|
|
1
|
-
import React, { Fragment, useState } from 'react';
|
|
2
|
-
import { node, shape, string } from 'prop-types';
|
|
3
|
-
import useFieldState from '@magento/peregrine/lib/hooks/hook-wrappers/useInformedFieldStateWrapper';
|
|
4
|
-
|
|
5
|
-
import { useStyle } from '@magento/venia-ui/lib/classify';
|
|
6
|
-
import { FieldIcons, Message } from '@magento/venia-ui/lib/components/Field';
|
|
7
|
-
import defaultClasses from './phoneTextInput.module.css';
|
|
8
|
-
import PhoneInput from 'react-phone-number-input'
|
|
9
|
-
import 'react-phone-number-input/style.css'
|
|
10
|
-
|
|
11
|
-
const PhoneTextInput = props => {
|
|
12
|
-
const {
|
|
13
|
-
after,
|
|
14
|
-
before,
|
|
15
|
-
classes: propClasses,
|
|
16
|
-
regionError,
|
|
17
|
-
field,
|
|
18
|
-
message,
|
|
19
|
-
countryCodeField = "country",
|
|
20
|
-
...rest
|
|
21
|
-
} = props;
|
|
22
|
-
const fieldState = useFieldState(field);
|
|
23
|
-
const { value: phoneValue } = fieldState;
|
|
24
|
-
const classes = useStyle(defaultClasses, propClasses);
|
|
25
|
-
var inputClass =
|
|
26
|
-
fieldState.error || regionError ? classes.input_error : classes.input;
|
|
27
|
-
|
|
28
|
-
const handleChange = (value) => {
|
|
29
|
-
fieldState.value = value;
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
const countryFieldState = useFieldState(countryCodeField);
|
|
33
|
-
const { value: country } = countryFieldState;
|
|
34
|
-
|
|
35
|
-
return (
|
|
36
|
-
<Fragment>
|
|
37
|
-
<FieldIcons after={after} before={before}>
|
|
38
|
-
<PhoneInput
|
|
39
|
-
international
|
|
40
|
-
countryCallingCodeEditable={false}
|
|
41
|
-
defaultCountry={country}
|
|
42
|
-
name={field}
|
|
43
|
-
value={phoneValue}
|
|
44
|
-
onChange={handleChange}
|
|
45
|
-
/>
|
|
46
|
-
</FieldIcons>
|
|
47
|
-
<Message fieldState={fieldState}>{message}</Message>
|
|
48
|
-
</Fragment>
|
|
49
|
-
);
|
|
50
|
-
};
|
|
51
|
-
|
|
52
|
-
export default PhoneTextInput;
|
|
53
|
-
|
|
54
|
-
PhoneTextInput.propTypes = {
|
|
55
|
-
after: node,
|
|
56
|
-
before: node,
|
|
57
|
-
classes: shape({
|
|
58
|
-
input: string
|
|
59
|
-
}),
|
|
60
|
-
field: string.isRequired,
|
|
61
|
-
message: node
|
|
62
|
-
};
|
|
1
|
+
import React, { Fragment, useState } from 'react';
|
|
2
|
+
import { node, shape, string } from 'prop-types';
|
|
3
|
+
import useFieldState from '@magento/peregrine/lib/hooks/hook-wrappers/useInformedFieldStateWrapper';
|
|
4
|
+
|
|
5
|
+
import { useStyle } from '@magento/venia-ui/lib/classify';
|
|
6
|
+
import { FieldIcons, Message } from '@magento/venia-ui/lib/components/Field';
|
|
7
|
+
import defaultClasses from './phoneTextInput.module.css';
|
|
8
|
+
import PhoneInput from 'react-phone-number-input'
|
|
9
|
+
import 'react-phone-number-input/style.css'
|
|
10
|
+
|
|
11
|
+
const PhoneTextInput = props => {
|
|
12
|
+
const {
|
|
13
|
+
after,
|
|
14
|
+
before,
|
|
15
|
+
classes: propClasses,
|
|
16
|
+
regionError,
|
|
17
|
+
field,
|
|
18
|
+
message,
|
|
19
|
+
countryCodeField = "country",
|
|
20
|
+
...rest
|
|
21
|
+
} = props;
|
|
22
|
+
const fieldState = useFieldState(field);
|
|
23
|
+
const { value: phoneValue } = fieldState;
|
|
24
|
+
const classes = useStyle(defaultClasses, propClasses);
|
|
25
|
+
var inputClass =
|
|
26
|
+
fieldState.error || regionError ? classes.input_error : classes.input;
|
|
27
|
+
|
|
28
|
+
const handleChange = (value) => {
|
|
29
|
+
fieldState.value = value;
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
const countryFieldState = useFieldState(countryCodeField);
|
|
33
|
+
const { value: country } = countryFieldState;
|
|
34
|
+
|
|
35
|
+
return (
|
|
36
|
+
<Fragment>
|
|
37
|
+
<FieldIcons after={after} before={before}>
|
|
38
|
+
<PhoneInput
|
|
39
|
+
international
|
|
40
|
+
countryCallingCodeEditable={false}
|
|
41
|
+
defaultCountry={country}
|
|
42
|
+
name={field}
|
|
43
|
+
value={phoneValue}
|
|
44
|
+
onChange={handleChange}
|
|
45
|
+
/>
|
|
46
|
+
</FieldIcons>
|
|
47
|
+
<Message fieldState={fieldState}>{message}</Message>
|
|
48
|
+
</Fragment>
|
|
49
|
+
);
|
|
50
|
+
};
|
|
51
|
+
|
|
52
|
+
export default PhoneTextInput;
|
|
53
|
+
|
|
54
|
+
PhoneTextInput.propTypes = {
|
|
55
|
+
after: node,
|
|
56
|
+
before: node,
|
|
57
|
+
classes: shape({
|
|
58
|
+
input: string
|
|
59
|
+
}),
|
|
60
|
+
field: string.isRequired,
|
|
61
|
+
message: node
|
|
62
|
+
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { default } from './productListTab';
|
|
2
|
-
export {
|
|
3
|
-
default as ProductListTabShimmer
|
|
4
|
-
} from './productListTab.shimmer';
|
|
1
|
+
export { default } from './productListTab';
|
|
2
|
+
export {
|
|
3
|
+
default as ProductListTabShimmer
|
|
4
|
+
} from './productListTab.shimmer';
|
|
@@ -1,64 +1,64 @@
|
|
|
1
|
-
.root {
|
|
2
|
-
composes: bg-white from global;
|
|
3
|
-
composes: flex from global;
|
|
4
|
-
composes: items-center from global;
|
|
5
|
-
composes: flex-wrap from global;
|
|
6
|
-
width: inherit;
|
|
7
|
-
}
|
|
8
|
-
|
|
9
|
-
.buttonContainer {
|
|
10
|
-
composes: inline-flex from global;
|
|
11
|
-
align-items: center;
|
|
12
|
-
}
|
|
13
|
-
|
|
14
|
-
.button {
|
|
15
|
-
composes: flex from global;
|
|
16
|
-
composes: px-4 from global;
|
|
17
|
-
composes: py-2 from global;
|
|
18
|
-
composes: transition-colors from global;
|
|
19
|
-
composes: duration-150 from global;
|
|
20
|
-
composes: border from global;
|
|
21
|
-
composes: border-solid from global;
|
|
22
|
-
composes: leading-normal from global;
|
|
23
|
-
composes: text-base from global;
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
.activeButton {
|
|
27
|
-
color: white;
|
|
28
|
-
background-color: #4E31DB;
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
.activeFirstButton {
|
|
32
|
-
composes: activeButton;
|
|
33
|
-
composes: border-r-0 from global;
|
|
34
|
-
composes: rounded-l-lg from global;
|
|
35
|
-
border-radius: 6px 0px 0px 6px;
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
.middleButton {
|
|
39
|
-
composes: button;
|
|
40
|
-
composes: text-colorDefault from global;
|
|
41
|
-
composes: bg-white from global;
|
|
42
|
-
composes: border-l-0 from global;
|
|
43
|
-
composes: border-gray-100 from global;
|
|
44
|
-
}
|
|
45
|
-
|
|
46
|
-
.lastButton {
|
|
47
|
-
composes: button;
|
|
48
|
-
composes: text-colorDefault from global;
|
|
49
|
-
composes: bg-white from global;
|
|
50
|
-
composes: border-l-0 from global;
|
|
51
|
-
composes: border-gray-100 from global;
|
|
52
|
-
composes: rounded-r-lg from global;
|
|
53
|
-
border-radius: 0px 6px 6px 0px;
|
|
54
|
-
}
|
|
55
|
-
|
|
56
|
-
.firstButton {
|
|
57
|
-
composes: button;
|
|
58
|
-
composes: text-colorDefault from global;
|
|
59
|
-
composes: bg-white from global;
|
|
60
|
-
/* composes: border-l-0 from global; */
|
|
61
|
-
composes: border-gray-100 from global;
|
|
62
|
-
composes: rounded-l-lg from global;
|
|
63
|
-
border-radius: 6px 0px 0px 6px;
|
|
64
|
-
}
|
|
1
|
+
.root {
|
|
2
|
+
composes: bg-white from global;
|
|
3
|
+
composes: flex from global;
|
|
4
|
+
composes: items-center from global;
|
|
5
|
+
composes: flex-wrap from global;
|
|
6
|
+
width: inherit;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
.buttonContainer {
|
|
10
|
+
composes: inline-flex from global;
|
|
11
|
+
align-items: center;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
.button {
|
|
15
|
+
composes: flex from global;
|
|
16
|
+
composes: px-4 from global;
|
|
17
|
+
composes: py-2 from global;
|
|
18
|
+
composes: transition-colors from global;
|
|
19
|
+
composes: duration-150 from global;
|
|
20
|
+
composes: border from global;
|
|
21
|
+
composes: border-solid from global;
|
|
22
|
+
composes: leading-normal from global;
|
|
23
|
+
composes: text-base from global;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
.activeButton {
|
|
27
|
+
color: white;
|
|
28
|
+
background-color: #4E31DB;
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
.activeFirstButton {
|
|
32
|
+
composes: activeButton;
|
|
33
|
+
composes: border-r-0 from global;
|
|
34
|
+
composes: rounded-l-lg from global;
|
|
35
|
+
border-radius: 6px 0px 0px 6px;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
.middleButton {
|
|
39
|
+
composes: button;
|
|
40
|
+
composes: text-colorDefault from global;
|
|
41
|
+
composes: bg-white from global;
|
|
42
|
+
composes: border-l-0 from global;
|
|
43
|
+
composes: border-gray-100 from global;
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
.lastButton {
|
|
47
|
+
composes: button;
|
|
48
|
+
composes: text-colorDefault from global;
|
|
49
|
+
composes: bg-white from global;
|
|
50
|
+
composes: border-l-0 from global;
|
|
51
|
+
composes: border-gray-100 from global;
|
|
52
|
+
composes: rounded-r-lg from global;
|
|
53
|
+
border-radius: 0px 6px 6px 0px;
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
.firstButton {
|
|
57
|
+
composes: button;
|
|
58
|
+
composes: text-colorDefault from global;
|
|
59
|
+
composes: bg-white from global;
|
|
60
|
+
/* composes: border-l-0 from global; */
|
|
61
|
+
composes: border-gray-100 from global;
|
|
62
|
+
composes: rounded-l-lg from global;
|
|
63
|
+
border-radius: 6px 0px 0px 6px;
|
|
64
|
+
}
|
|
@@ -1,24 +1,24 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { shape, string } from 'prop-types';
|
|
3
|
-
import { useStyle } from '@magento/venia-ui/lib/classify';
|
|
4
|
-
|
|
5
|
-
import Shimmer from '@magento/venia-ui/lib/components/Shimmer';
|
|
6
|
-
import defaultClasses from './productListTab.module.css';
|
|
7
|
-
|
|
8
|
-
const ProductListTabShimmer = props => {
|
|
9
|
-
const classes = useStyle(defaultClasses, props.classes);
|
|
10
|
-
|
|
11
|
-
return (
|
|
12
|
-
<div className={classes.root} aria-live="polite" aria-busy="true">
|
|
13
|
-
<Shimmer width={10} />
|
|
14
|
-
</div>
|
|
15
|
-
);
|
|
16
|
-
};
|
|
17
|
-
|
|
18
|
-
ProductListTabShimmer.propTypes = {
|
|
19
|
-
classes: shape({
|
|
20
|
-
root: string
|
|
21
|
-
})
|
|
22
|
-
};
|
|
23
|
-
|
|
24
|
-
export default ProductListTabShimmer;
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { shape, string } from 'prop-types';
|
|
3
|
+
import { useStyle } from '@magento/venia-ui/lib/classify';
|
|
4
|
+
|
|
5
|
+
import Shimmer from '@magento/venia-ui/lib/components/Shimmer';
|
|
6
|
+
import defaultClasses from './productListTab.module.css';
|
|
7
|
+
|
|
8
|
+
const ProductListTabShimmer = props => {
|
|
9
|
+
const classes = useStyle(defaultClasses, props.classes);
|
|
10
|
+
|
|
11
|
+
return (
|
|
12
|
+
<div className={classes.root} aria-live="polite" aria-busy="true">
|
|
13
|
+
<Shimmer width={10} />
|
|
14
|
+
</div>
|
|
15
|
+
);
|
|
16
|
+
};
|
|
17
|
+
|
|
18
|
+
ProductListTabShimmer.propTypes = {
|
|
19
|
+
classes: shape({
|
|
20
|
+
root: string
|
|
21
|
+
})
|
|
22
|
+
};
|
|
23
|
+
|
|
24
|
+
export default ProductListTabShimmer;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { default } from './sellerCountry';
|
|
1
|
+
export { default } from './sellerCountry';
|