imbric-theme 0.5.1 → 0.5.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/atoms/Button/Button.js +4 -0
- package/atoms/Input/Input.js +4 -0
- package/atoms/LinkItem/LinkItem.js +4 -2
- package/atoms/Modal/Modal.js +1 -0
- package/molecules/CardDefault/CardDefault.js +1 -0
- package/molecules/CardProductTypesBooking/CardProductTypesBooking.js +5 -2
- package/molecules/CardProductTypesBooking/CardProductTypesBooking.module.css +5 -0
- package/molecules/DatePicker/DatePicker.js +1 -0
- package/molecules/FooterTable/FooterTable.module.css +6 -3
- package/molecules/InputAutocomplete/InputAutocomplete.js +12 -9
- package/molecules/RowTable/RowTable.js +7 -1
- package/package.json +1 -1
- package/public/static/google-maps.png +0 -0
package/atoms/Button/Button.js
CHANGED
@@ -23,9 +23,11 @@ export const Button = ({
|
|
23
23
|
isFloatRight,
|
24
24
|
isFloatLeft,
|
25
25
|
onClick,
|
26
|
+
id,
|
26
27
|
getStyles,
|
27
28
|
}) => (
|
28
29
|
<button
|
30
|
+
id={id}
|
29
31
|
type="submit"
|
30
32
|
disabled={isMuted}
|
31
33
|
className={getStyles('button', ['type'], {
|
@@ -65,6 +67,7 @@ Button.propTypes = {
|
|
65
67
|
isMuted: PropTypes.bool,
|
66
68
|
isFloatRight: PropTypes.bool,
|
67
69
|
isFloatLeft: PropTypes.bool,
|
70
|
+
id: PropTypes.string,
|
68
71
|
}
|
69
72
|
|
70
73
|
Button.defaultProps = {
|
@@ -74,6 +77,7 @@ Button.defaultProps = {
|
|
74
77
|
isInline: false,
|
75
78
|
isFloatRight: false,
|
76
79
|
isFloatLeft: false,
|
80
|
+
id: '',
|
77
81
|
}
|
78
82
|
|
79
83
|
export default withStyles(styles)(Button)
|
package/atoms/Input/Input.js
CHANGED
@@ -36,6 +36,7 @@ export const Input = ({
|
|
36
36
|
colorIcon,
|
37
37
|
backgroundIcon,
|
38
38
|
pattern,
|
39
|
+
min,
|
39
40
|
}) => (
|
40
41
|
|
41
42
|
<>
|
@@ -72,6 +73,7 @@ export const Input = ({
|
|
72
73
|
onKeyDown={onKeyDown}
|
73
74
|
autoComplete={autoComplete}
|
74
75
|
disabled={disabled}
|
76
|
+
min={min}
|
75
77
|
></input>
|
76
78
|
|
77
79
|
</div> :
|
@@ -94,6 +96,7 @@ export const Input = ({
|
|
94
96
|
onKeyDown={onKeyDown}
|
95
97
|
autoComplete={autoComplete}
|
96
98
|
disabled={disabled}
|
99
|
+
min={min}
|
97
100
|
></input>
|
98
101
|
|
99
102
|
}
|
@@ -124,6 +127,7 @@ Input.propTypes = {
|
|
124
127
|
backgroundIcon: PropTypes.string,
|
125
128
|
autoComplete: PropTypes.string,
|
126
129
|
disabled: PropTypes.bool,
|
130
|
+
min: PropTypes.any,
|
127
131
|
}
|
128
132
|
|
129
133
|
Input.defaultProps = {
|
@@ -7,10 +7,10 @@ import { options } from './constants'
|
|
7
7
|
import withStyles from '../../hocs/withStyles'
|
8
8
|
// import Paragraph from '../Paragraph'
|
9
9
|
|
10
|
-
export const LinkItem = ({ children, size, color, getStyles, isHref }) => {
|
10
|
+
export const LinkItem = ({ children, size, color, getStyles, isHref, target }) => {
|
11
11
|
return (
|
12
12
|
<Link href={isHref} passHref>
|
13
|
-
<a target=
|
13
|
+
<a target={target} className={getStyles('link', ['color'])}>
|
14
14
|
{/* <Paragraph size={size} color={color} weight="semibold" isInline> */}
|
15
15
|
{children}
|
16
16
|
{/* </Paragraph> */}
|
@@ -24,6 +24,7 @@ LinkItem.propTypes = {
|
|
24
24
|
getStyles: PropTypes.func.isRequired,
|
25
25
|
color: PropTypes.oneOf(options.colors),
|
26
26
|
size: PropTypes.oneOf(options.sizes),
|
27
|
+
target: PropTypes.string,
|
27
28
|
}
|
28
29
|
|
29
30
|
LinkItem.defaultProps = {
|
@@ -31,6 +32,7 @@ LinkItem.defaultProps = {
|
|
31
32
|
color: 'primary',
|
32
33
|
size: 'md',
|
33
34
|
isHref: '/',
|
35
|
+
target: ''
|
34
36
|
}
|
35
37
|
|
36
38
|
export default withStyles(styles)(LinkItem)
|
package/atoms/Modal/Modal.js
CHANGED
@@ -58,6 +58,7 @@ export const Modal = ({
|
|
58
58
|
<div className={getStyles('heading')}>
|
59
59
|
{!!onClose && (
|
60
60
|
<Icon
|
61
|
+
id='btnColsedModal'
|
61
62
|
color={isDesktop && type === 'secondary' ? 'primary' : 'primary'}
|
62
63
|
name={isDesktop ? 'cross' : 'angleLeft'}
|
63
64
|
background={isDesktop ? 'transparent' : 'muted'}
|
@@ -17,9 +17,10 @@ export const CardProductTypesBooking = ({
|
|
17
17
|
priceProductTypes,
|
18
18
|
priceProductTypesSub,
|
19
19
|
selectCard,
|
20
|
+
availableCard,
|
20
21
|
getStyles
|
21
22
|
}) => {
|
22
|
-
return <div className={getStyles('card-product-types-booking', {'selectCard': selectCard})} onClick={onClick}>
|
23
|
+
return <div className={getStyles('card-product-types-booking', { 'selectCard': selectCard }, { 'availableCard': !availableCard })} onClick={availableCard ? onClick : null}>
|
23
24
|
|
24
25
|
<div className={getStyles('labelNotification')}>
|
25
26
|
{textNotification}
|
@@ -67,6 +68,7 @@ CardProductTypesBooking.propTypes = {
|
|
67
68
|
priceProductTypes: PropTypes.string,
|
68
69
|
priceProductTypesSub: PropTypes.string,
|
69
70
|
selectCard: PropTypes.bool,
|
71
|
+
availableCard: PropTypes.bool,
|
70
72
|
getStyles: PropTypes.func.isRequired,
|
71
73
|
|
72
74
|
}
|
@@ -80,7 +82,8 @@ CardProductTypesBooking.defaultProps = {
|
|
80
82
|
textDescription: 'Envío urgente de sobres y paquetes pequeños con taxi.',
|
81
83
|
priceProductTypes: '30€ - 30€',
|
82
84
|
priceProductTypesSub: 'Máx.',
|
83
|
-
selectCard: 'false'
|
85
|
+
selectCard: 'false',
|
86
|
+
availableCard: 'false'
|
84
87
|
}
|
85
88
|
|
86
89
|
export default withStyles(styles)(CardProductTypesBooking)
|
@@ -99,6 +99,11 @@
|
|
99
99
|
background-image: linear-gradient(to bottom, #39b54a 0%, #00a3ff 100%), linear-gradient(to bottom, #39b54a 0%, #00a3ff 100%);
|
100
100
|
}
|
101
101
|
|
102
|
+
.availableCard {
|
103
|
+
cursor: no-drop;
|
104
|
+
opacity: .4;
|
105
|
+
}
|
106
|
+
|
102
107
|
/* .selectCard:before {
|
103
108
|
content: '';
|
104
109
|
position: absolute;
|
@@ -203,6 +203,7 @@ export const DatePicker = ({ getStyles, isLayoutDate, onChangeRange, sinceDateRa
|
|
203
203
|
|
204
204
|
<div className={getStyles('btnSave')} onClick={handleClickCloseCalendar}>
|
205
205
|
<Icon
|
206
|
+
id='iconClosedDatePicker'
|
206
207
|
name="checkCircle"
|
207
208
|
color="inverted"
|
208
209
|
onClick={function noRefCheck() { }}
|
@@ -1,11 +1,13 @@
|
|
1
1
|
.footer-table {
|
2
2
|
display: flex;
|
3
|
+
width: 100%;
|
4
|
+
justify-content: space-between;
|
3
5
|
}
|
4
6
|
|
5
7
|
.tableFooter {
|
6
|
-
background-color: #f1f1f1;
|
8
|
+
/* background-color: #f1f1f1; */
|
7
9
|
padding: 4px 0px;
|
8
|
-
width:
|
10
|
+
width: 400px;
|
9
11
|
font-weight: 500;
|
10
12
|
text-align: left;
|
11
13
|
font-size: 16px;
|
@@ -14,7 +16,8 @@
|
|
14
16
|
border-bottom-right-radius: 0px;
|
15
17
|
display: flex;
|
16
18
|
align-items: center;
|
17
|
-
justify-content:
|
19
|
+
justify-content: flex-start;
|
20
|
+
overflow-x: auto;
|
18
21
|
}
|
19
22
|
|
20
23
|
.button {
|
@@ -124,17 +124,20 @@ export const InputAutocomplete = ({
|
|
124
124
|
<div className={getStyles('input-autocomplete-box-results')}>
|
125
125
|
<ul className={getStyles('input-autocomplete-ul')}>
|
126
126
|
{suggestedAddresses.map((itemAddresses, index) => (
|
127
|
-
<li key={index} className={getStyles('input-autocomplete-li')} onClick={handleOnSelect}>
|
127
|
+
<li id={'idLiItem' + index} key={index} className={getStyles('input-autocomplete-li')} onClick={handleOnSelect}>
|
128
128
|
{viewIconList ?
|
129
129
|
<div className={getStyles('input-autocomplete-li-icon')}>
|
130
|
-
|
131
|
-
|
132
|
-
|
133
|
-
|
134
|
-
|
135
|
-
|
136
|
-
|
137
|
-
|
130
|
+
<Picture
|
131
|
+
src={itemAddresses.iconURL ? itemAddresses.iconURL : "../../static/google-maps.png"}
|
132
|
+
width={15}
|
133
|
+
height={15}
|
134
|
+
/>
|
135
|
+
</div>
|
136
|
+
:
|
137
|
+
null
|
138
|
+
|
139
|
+
}
|
140
|
+
{itemAddresses.name ? itemAddresses.name : itemAddresses.addressField}
|
138
141
|
</li>
|
139
142
|
))}
|
140
143
|
</ul>
|
@@ -125,7 +125,7 @@ export const RowTable = ({
|
|
125
125
|
<span key={itemTdObj.id}>{itemTdObj[itemTd.subAccessor]}
|
126
126
|
|
127
127
|
{array.length - 1 !== index ?
|
128
|
-
<span>, </span> : null
|
128
|
+
<span>, </span> : null}
|
129
129
|
|
130
130
|
</span>
|
131
131
|
|
@@ -156,6 +156,7 @@ export const RowTable = ({
|
|
156
156
|
{itemTd.viewUserView ?
|
157
157
|
<>
|
158
158
|
<Icon
|
159
|
+
id="userView"
|
159
160
|
background="base"
|
160
161
|
name="userView"
|
161
162
|
onClick={(e) => { onClickActionUserView(e, item) }}
|
@@ -168,6 +169,7 @@ export const RowTable = ({
|
|
168
169
|
{itemTd.viewListInvoice ?
|
169
170
|
<>
|
170
171
|
<Icon
|
172
|
+
id={"listInvoice" + index}
|
171
173
|
background="base"
|
172
174
|
name="listInvoice"
|
173
175
|
onClick={(e) => { onClickActionListInvoice(e, item) }}
|
@@ -179,6 +181,7 @@ export const RowTable = ({
|
|
179
181
|
{itemTd.viewListXLS && item.fileType === 'xls' ?
|
180
182
|
<>
|
181
183
|
<Icon
|
184
|
+
id={"listXLS" + index}
|
182
185
|
background="base"
|
183
186
|
name="listXLS"
|
184
187
|
onClick={(e) => { onClickActionListXLS(e, item) }}
|
@@ -190,6 +193,7 @@ export const RowTable = ({
|
|
190
193
|
{itemTd.viewListCSV && item.fileType === 'xml' ?
|
191
194
|
<>
|
192
195
|
<Icon
|
196
|
+
id={"listCSV" + index}
|
193
197
|
background="base"
|
194
198
|
name="listCSV"
|
195
199
|
onClick={(e) => { onClickActionListCSV(e, item) }}
|
@@ -201,6 +205,7 @@ export const RowTable = ({
|
|
201
205
|
{itemTd.viewListPDF && item.fileType === 'pdf' ?
|
202
206
|
<>
|
203
207
|
<Icon
|
208
|
+
id={"listPDF" + index}
|
204
209
|
background="base"
|
205
210
|
name="listPDF"
|
206
211
|
onClick={(e) => { onClickActionListPDF(e, item) }}
|
@@ -214,6 +219,7 @@ export const RowTable = ({
|
|
214
219
|
{itemTd.viewEdit ?
|
215
220
|
<>
|
216
221
|
<Icon
|
222
|
+
id={"edit" + index}
|
217
223
|
background="base"
|
218
224
|
name="edit"
|
219
225
|
onClick={(e) => { onClickActionEdit(e, item) }}
|
package/package.json
CHANGED
Binary file
|