@woosmap/ui 4.19.1 → 4.20.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/package.json +1 -1
- package/src/components/Card/Card.js +1 -2
- package/src/components/UseCase/UseCase.js +15 -2
- package/src/components/UseCase/UseCase.stories.js +17 -2
- package/src/components/UseCase/UseCase.styl +42 -4
- package/src/images/usecases/store-locator.png +0 -0
- package/.idea/encodings.xml +0 -6
- package/.idea/inspectionProfiles/Project_Default.xml +0 -18
- package/.idea/inspectionProfiles/profiles_settings.xml +0 -6
- package/.idea/misc.xml +0 -4
- package/.idea/modules.xml +0 -8
- package/.idea/prettier.xml +0 -6
- package/.idea/ui.iml +0 -15
- package/.idea/vcs.xml +0 -6
package/package.json
CHANGED
|
@@ -129,7 +129,7 @@ class Aside extends Component {
|
|
|
129
129
|
/>
|
|
130
130
|
<div className="card__aside__list__item__section">
|
|
131
131
|
<div className="card__aside__list__item__section__title">{product.name}</div>
|
|
132
|
-
{isEnterprise ? (
|
|
132
|
+
{!isEnterprise ? (
|
|
133
133
|
<Tooltip
|
|
134
134
|
direction="n"
|
|
135
135
|
wrap
|
|
@@ -285,7 +285,6 @@ Card.defaultProps = {
|
|
|
285
285
|
noBorder: false,
|
|
286
286
|
isNew: false,
|
|
287
287
|
testId: 'card',
|
|
288
|
-
isEnterprise: false,
|
|
289
288
|
};
|
|
290
289
|
|
|
291
290
|
Card.propTypes = {
|
|
@@ -26,6 +26,7 @@ const productImg = {
|
|
|
26
26
|
MERCHANTS: merchantImgSq,
|
|
27
27
|
INDOOR: indoorImgSq,
|
|
28
28
|
};
|
|
29
|
+
|
|
29
30
|
class Footer extends Component {
|
|
30
31
|
render() {
|
|
31
32
|
const { products, ...rest } = this.props;
|
|
@@ -57,12 +58,13 @@ class UseCase extends Component {
|
|
|
57
58
|
};
|
|
58
59
|
|
|
59
60
|
render() {
|
|
60
|
-
const { className, children, isSelectable, testId, ...rest } = this.props;
|
|
61
|
+
const { className, children, isSelectable, testId, useCaseStory, ...rest } = this.props;
|
|
61
62
|
const { stateSelected } = this.state;
|
|
62
63
|
const classes = cl(
|
|
63
64
|
'use-case',
|
|
64
65
|
{ 'use-case--selectable': isSelectable },
|
|
65
66
|
{ 'use-case--selected': stateSelected },
|
|
67
|
+
`use-case__story--${useCaseStory}`,
|
|
66
68
|
className
|
|
67
69
|
);
|
|
68
70
|
return (
|
|
@@ -75,7 +77,8 @@ class UseCase extends Component {
|
|
|
75
77
|
tabIndex="-1"
|
|
76
78
|
{...rest}
|
|
77
79
|
>
|
|
78
|
-
|
|
80
|
+
<div className="use-case__image" />
|
|
81
|
+
<div className="use-case__content">{children}</div>
|
|
79
82
|
</div>
|
|
80
83
|
);
|
|
81
84
|
}
|
|
@@ -85,6 +88,15 @@ UseCase.defaultProps = {
|
|
|
85
88
|
testId: 'usecase',
|
|
86
89
|
className: '',
|
|
87
90
|
isSelectable: false,
|
|
91
|
+
useCaseStory: PropTypes.oneOf([
|
|
92
|
+
'storeLocator',
|
|
93
|
+
'productLocator',
|
|
94
|
+
'addressAutocomplete',
|
|
95
|
+
'ecommerceCheckout',
|
|
96
|
+
'fleetTracking',
|
|
97
|
+
'geocoding',
|
|
98
|
+
'indoorMapping',
|
|
99
|
+
]),
|
|
88
100
|
product: PropTypes.oneOf([
|
|
89
101
|
'LOCALITIES',
|
|
90
102
|
'LOCALITIES_ADDRESS_UK',
|
|
@@ -106,6 +118,7 @@ UseCase.propTypes = {
|
|
|
106
118
|
className: PropTypes.string,
|
|
107
119
|
product: PropTypes.string,
|
|
108
120
|
isSelectable: PropTypes.bool,
|
|
121
|
+
useCaseStory: PropTypes.string,
|
|
109
122
|
};
|
|
110
123
|
|
|
111
124
|
export default Object.assign(UseCase, {
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import UseCase from './UseCase';
|
|
3
|
+
import Icon from '../Icon/Icon';
|
|
4
|
+
import { tr } from '../utils/locale';
|
|
3
5
|
|
|
4
6
|
const Story = {
|
|
5
7
|
title: 'base/UseCase',
|
|
@@ -10,12 +12,25 @@ export default Story;
|
|
|
10
12
|
|
|
11
13
|
const Template = () => (
|
|
12
14
|
<div className="mbib flex-column">
|
|
13
|
-
<UseCase isSelectable>
|
|
15
|
+
<UseCase isSelectable useCaseStory="storeLocator">
|
|
14
16
|
<div className="use-case__header">Store Locator</div>
|
|
15
17
|
<div className="use-case__body">Store Locator</div>
|
|
16
18
|
<div className="use-case__footer">
|
|
17
19
|
<h4 className="title">Products :</h4>
|
|
18
|
-
<UseCase.Footer
|
|
20
|
+
<UseCase.Footer
|
|
21
|
+
products={[
|
|
22
|
+
{ id: 'INDOOR', name: 'Indoor' },
|
|
23
|
+
{ id: 'STORES', name: 'Stores Search' },
|
|
24
|
+
{ id: 'MAP', name: 'Maps' },
|
|
25
|
+
{ id: 'DISTANCE', name: 'distance' },
|
|
26
|
+
{ id: 'GEOLOCATION', name: 'Localities' },
|
|
27
|
+
{ id: 'ADDRESS', name: 'Address' },
|
|
28
|
+
]}
|
|
29
|
+
/>
|
|
30
|
+
<div className="use-case__product-item ready">
|
|
31
|
+
<Icon icon="big-commerce" />
|
|
32
|
+
<span className="use-case__product-item__name">{tr('BigCommerce ready')}</span>
|
|
33
|
+
</div>
|
|
19
34
|
</div>
|
|
20
35
|
</UseCase>
|
|
21
36
|
</div>
|
|
@@ -1,10 +1,9 @@
|
|
|
1
1
|
.use-case
|
|
2
2
|
box()
|
|
3
|
-
width
|
|
4
|
-
transition .2s all
|
|
3
|
+
width 76rem
|
|
4
|
+
transition .2s all
|
|
5
5
|
display flex
|
|
6
|
-
|
|
7
|
-
padding 2rem 2.4rem
|
|
6
|
+
overflow hidden
|
|
8
7
|
&--selectable
|
|
9
8
|
cursor pointer
|
|
10
9
|
&:hover
|
|
@@ -16,6 +15,40 @@
|
|
|
16
15
|
background-color rgba($success2, .03)
|
|
17
16
|
&:hover
|
|
18
17
|
border .1rem solid $success2
|
|
18
|
+
&__image
|
|
19
|
+
width 46rem
|
|
20
|
+
background-size cover
|
|
21
|
+
background-repeat no-repeat
|
|
22
|
+
background-position center
|
|
23
|
+
&__content
|
|
24
|
+
height 100%
|
|
25
|
+
padding 2rem 2.4rem
|
|
26
|
+
display flex
|
|
27
|
+
flex-direction column
|
|
28
|
+
border-left .1rem solid $dark10
|
|
29
|
+
flex-grow 1
|
|
30
|
+
&__story
|
|
31
|
+
&--storeLocator
|
|
32
|
+
.use-case__image
|
|
33
|
+
background-image url('../../images/usecases/store-locator.png')
|
|
34
|
+
&--productLocator
|
|
35
|
+
.use-case__image
|
|
36
|
+
background-image url('../../images/usecases/store-locator.png')
|
|
37
|
+
&--addressAutocomplete
|
|
38
|
+
.use-case__image
|
|
39
|
+
background-image url('../../images/usecases/store-locator.png')
|
|
40
|
+
&--ecommerceCheckout
|
|
41
|
+
.use-case__image
|
|
42
|
+
background-image url('../../images/usecases/store-locator.png')
|
|
43
|
+
&--fleetTracking
|
|
44
|
+
.use-case__image
|
|
45
|
+
background-image url('../../images/usecases/store-locator.png')
|
|
46
|
+
&--geocoding
|
|
47
|
+
.use-case__image
|
|
48
|
+
background-image url('../../images/usecases/store-locator.png')
|
|
49
|
+
&--indoorMapping
|
|
50
|
+
.use-case__image
|
|
51
|
+
background-image url('../../images/usecases/store-locator.png')
|
|
19
52
|
&__header
|
|
20
53
|
text-align center
|
|
21
54
|
font-size $title
|
|
@@ -40,3 +73,8 @@
|
|
|
40
73
|
.title
|
|
41
74
|
margin-bottom 1rem
|
|
42
75
|
font-weight 600
|
|
76
|
+
.ready
|
|
77
|
+
box()
|
|
78
|
+
background-color $light
|
|
79
|
+
padding .4rem 1rem
|
|
80
|
+
margin-top 2rem
|
|
Binary file
|
package/.idea/encodings.xml
DELETED
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
<component name="InspectionProjectProfileManager">
|
|
2
|
-
<profile version="1.0">
|
|
3
|
-
<option name="myName" value="Project Default" />
|
|
4
|
-
<inspection_tool class="Eslint" enabled="true" level="WARNING" enabled_by_default="true" />
|
|
5
|
-
<inspection_tool class="PyPackageRequirementsInspection" enabled="true" level="WARNING" enabled_by_default="true">
|
|
6
|
-
<option name="ignoredPackages">
|
|
7
|
-
<value>
|
|
8
|
-
<list size="4">
|
|
9
|
-
<item index="0" class="java.lang.String" itemvalue="Fabric" />
|
|
10
|
-
<item index="1" class="java.lang.String" itemvalue="PyYAML" />
|
|
11
|
-
<item index="2" class="java.lang.String" itemvalue="Jinja2" />
|
|
12
|
-
<item index="3" class="java.lang.String" itemvalue="github3.py" />
|
|
13
|
-
</list>
|
|
14
|
-
</value>
|
|
15
|
-
</option>
|
|
16
|
-
</inspection_tool>
|
|
17
|
-
</profile>
|
|
18
|
-
</component>
|
package/.idea/misc.xml
DELETED
package/.idea/modules.xml
DELETED
package/.idea/prettier.xml
DELETED
package/.idea/ui.iml
DELETED
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
<?xml version="1.0" encoding="UTF-8"?>
|
|
2
|
-
<module type="PYTHON_MODULE" version="4">
|
|
3
|
-
<component name="NewModuleRootManager">
|
|
4
|
-
<content url="file://$MODULE_DIR$" />
|
|
5
|
-
<orderEntry type="inheritedJdk" />
|
|
6
|
-
<orderEntry type="sourceFolder" forTests="false" />
|
|
7
|
-
</component>
|
|
8
|
-
<component name="TemplatesService">
|
|
9
|
-
<option name="TEMPLATE_FOLDERS">
|
|
10
|
-
<list>
|
|
11
|
-
<option value="$MODULE_DIR$/node_modules/@storybook/core/dist/server/templates" />
|
|
12
|
-
</list>
|
|
13
|
-
</option>
|
|
14
|
-
</component>
|
|
15
|
-
</module>
|