imbric-theme 0.6.9 → 0.7.1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (4) hide show
  1. package/atoms/Modal/Modal.module.css +1 -1
  2. package/layout/Navbar/Navbar.js +104 -96
  3. package/molecules/CardServices/CardServices.js +165 -160
  4. package/package.json +1 -1
package/atoms/Modal/Modal.module.css CHANGED
@@ -71,7 +71,7 @@
71
71
 
72
72
  @media (min-width: 992px) {
73
73
  .modal {
74
- max-width: 465px;
74
+ max-width: 520px;
75
75
  height: auto;
76
76
  border-radius: var(--border-radius-sm);
77
77
  /* max-height: 100%;
package/layout/Navbar/Navbar.js CHANGED
@@ -9,8 +9,25 @@ import Heading from '../../atoms/Heading/Heading'
9
9
  import Tabs from '../../molecules/Tabs/Tabs'
10
10
  import Icon from '../../atoms/Icon'
11
11
 
12
- export const Navbar = ({ getStyles, viewTabsNav, viewOptionsNav, children, linkLogout, linkLegal, linkInfo, linkProfile, txtTootipLegal, txtTootipInfo, txtTootipProfile, languageSwitchLink }) => {
13
-
12
+ export const Navbar = ({
13
+ getStyles,
14
+ viewTabsNav,
15
+ viewOptionsNav,
16
+ isViewLegal,
17
+ isViewInfo,
18
+ isViewProfile,
19
+ isViewLogout,
20
+ children,
21
+ linkLogout,
22
+ linkLegal,
23
+ linkInfo,
24
+ linkProfile,
25
+ txtTootipLegal,
26
+ txtTootipInfo,
27
+ txtTootipProfile,
28
+ languageSwitchLink,
29
+
30
+ }) => {
14
31
 
15
32
  const router = useRouter();
16
33
 
@@ -87,114 +104,97 @@ export const Navbar = ({ getStyles, viewTabsNav, viewOptionsNav, children, linkL
87
104
  {viewOptionsNav ? (
88
105
  <div className={getStyles('navbar__actions')}>
89
106
 
90
-
91
- <span
92
- data-tip
93
- data-for='legal'
94
- onMouseEnter={handleMouseEnter}
95
- onMouseLeave={handleMouseLeave}
96
- >
97
- <Icon
98
- size='lg'
99
- name='legal'
100
- color='highlight'
101
- background='transparent'
102
- onClick={linkLegal}
103
- />
104
-
105
- </span>
106
-
107
- {isToolTipMounted ? (
108
- <ReactTooltip id='legal' type='error'>
109
- <span>{txtTootipLegal}</span>
110
- </ReactTooltip>
107
+ {isViewLegal ? (
108
+ <>
109
+ <span
110
+ data-tip
111
+ data-for='legal'
112
+ onMouseEnter={handleMouseEnter}
113
+ onMouseLeave={handleMouseLeave}
114
+ >
115
+ <Icon
116
+ size='lg'
117
+ name='legal'
118
+ color='highlight'
119
+ background='transparent'
120
+ onClick={linkLegal}
121
+ />
122
+
123
+ </span>
124
+
125
+ {isToolTipMounted ? (
126
+ <ReactTooltip id='legal' type='error'>
127
+ <span>{txtTootipLegal}</span>
128
+ </ReactTooltip>
129
+ ) : null}
130
+ </>
111
131
  ) : null}
112
132
 
113
-
114
-
115
-
116
- <span
117
- data-tip
118
- data-for='info'
119
- onMouseEnter={handleMouseEnter}
120
- onMouseLeave={handleMouseLeave}
121
- >
122
- <Icon
123
- size='lg'
124
- name='info'
125
- color='highlight'
126
- background='transparent'
127
- onClick={linkInfo}
128
- />
129
-
130
- </span>
131
-
132
- {isToolTipMounted ? (
133
- <ReactTooltip id='info' type='error'>
134
- <span>{txtTootipInfo}</span>
135
- </ReactTooltip>
133
+ {isViewInfo ? (
134
+ <>
135
+ <span
136
+ data-tip
137
+ data-for='info'
138
+ onMouseEnter={handleMouseEnter}
139
+ onMouseLeave={handleMouseLeave}
140
+ >
141
+ <Icon
142
+ size='lg'
143
+ name='info'
144
+ color='highlight'
145
+ background='transparent'
146
+ onClick={linkInfo}
147
+ />
148
+
149
+ </span>
150
+
151
+ {isToolTipMounted ? (
152
+ <ReactTooltip id='info' type='error'>
153
+ <span>{txtTootipInfo}</span>
154
+ </ReactTooltip>
155
+ ) : null}
156
+ </>
136
157
  ) : null}
137
158
 
159
+ {isViewProfile ? (
160
+ <>
161
+ <span
162
+ data-tip
163
+ data-for='profile'
164
+ onMouseEnter={handleMouseEnter}
165
+ onMouseLeave={handleMouseLeave}
166
+ >
167
+ <Icon
168
+ size='lg'
169
+ name='profile'
170
+ color='highlight'
171
+ background='transparent'
172
+ onClick={linkProfile}
173
+ />
174
+
175
+ </span>
176
+
177
+ {isToolTipMounted ? (
178
+ <ReactTooltip id='profile' type='error'>
179
+ <span>{txtTootipProfile}</span>
180
+ </ReactTooltip>
181
+ ) : null}
182
+ </>
183
+ ) : null}
138
184
 
185
+ {languageSwitchLink}
139
186
 
140
- <span
141
- data-tip
142
- data-for='profile'
143
- onMouseEnter={handleMouseEnter}
144
- onMouseLeave={handleMouseLeave}
145
- >
187
+ {isViewLogout ? (
146
188
  <Icon
147
189
  size='lg'
148
- name='profile'
190
+ name='logout'
149
191
  color='highlight'
150
192
  background='transparent'
151
- onClick={linkProfile}
193
+ onClick={linkLogout}
152
194
  />
153
-
154
- </span>
155
-
156
- {isToolTipMounted ? (
157
- <ReactTooltip id='profile' type='error'>
158
- <span>{txtTootipProfile}</span>
159
- </ReactTooltip>
160
195
  ) : null}
161
196
 
162
197
 
163
-
164
-
165
- {/* <DynamicSelect
166
- isClearable={false}
167
- // defaultValue={{
168
- // label: 'ES',
169
- // value: 'es'
170
- // }}
171
- defaultValue={defaultValueLanguage}
172
- onChange={handleChangeLanguage}
173
- optionsSelect={optionsSelectLanguage}
174
- // optionsSelect={[
175
- // {
176
- // label: 'ES',
177
- // value: 'es'
178
- // },
179
- // {
180
- // label: 'EN',
181
- // value: 'en'
182
- // }
183
- // ]}
184
- /> */}
185
-
186
- {languageSwitchLink}
187
-
188
- <Icon
189
- size='lg'
190
- name='logout'
191
- color='highlight'
192
- background='transparent'
193
- onClick={linkLogout}
194
- />
195
-
196
-
197
-
198
198
  </div>
199
199
 
200
200
  ) : null}
@@ -224,12 +224,20 @@ Navbar.propTypes = {
224
224
  linkProfile: PropTypes.func,
225
225
  handleChange: PropTypes.func,
226
226
  languageSwitchLink: PropTypes.any.isRequired,
227
+ isViewLegal: PropTypes.bool,
228
+ isViewInfo: PropTypes.bool,
229
+ isViewProfile: PropTypes.bool,
230
+ isViewLogout: PropTypes.bool,
227
231
  }
228
232
 
229
233
  Navbar.defaultProps = {
230
234
  viewTabsNav: false,
231
235
  viewOptionsNav: true,
232
236
  getStyles: () => { },
237
+ isViewLegal: true,
238
+ isViewInfo: true,
239
+ isViewProfile: true,
240
+ isViewLogout: true,
233
241
  }
234
242
 
235
243
  export default withStyles(styles)(Navbar)
package/molecules/CardServices/CardServices.js CHANGED
@@ -43,6 +43,7 @@ export const CardServices = ({
43
43
  labelUserService,
44
44
  labelRefService,
45
45
  labelUserNumberService,
46
+ isViewAction,
46
47
  }) => {
47
48
 
48
49
  // STATE TOOLTIP
@@ -211,180 +212,182 @@ export const CardServices = ({
211
212
 
212
213
  </div>
213
214
 
214
- <div className={getStyles('card-content-action')}>
215
-
216
- <div className={getStyles('card-subcontent-action')}>
217
-
218
- <span
219
- data-tip
220
- data-for='userView'
221
- onMouseEnter={handleMouseEnter}
222
- onMouseLeave={handleMouseLeave}
223
- >
224
- <Icon
225
- color="highlight"
226
- id='userViewIcon'
227
- isClickable
228
- name="userView"
229
- onClick={onClickUserView}
230
- size="sm"
231
- className={getStyles('icon-view')}
232
- />
233
-
234
- </span>
235
-
236
- {isToolTipMounted ? (
237
- <ReactTooltip id='userView' type='error'>
238
- <span>{txtTootipUserView}</span>
239
- </ReactTooltip>
240
- ) : null}
215
+ {isViewAction ? (
216
+ <div className={getStyles('card-content-action')}>
241
217
 
242
- </div>
218
+ <div className={getStyles('card-subcontent-action')}>
243
219
 
244
- <div className={getStyles('card-subcontent-action')}>
245
-
246
- <span
247
- data-tip
248
- data-for='returnOrder'
249
- onMouseEnter={handleMouseEnter}
250
- onMouseLeave={handleMouseLeave}
251
- >
252
- <Icon
253
- color="highlight"
254
- id='returnOrderIcon'
255
- isClickable
256
- name="returnOrder"
257
- onClick={onClickReturnOrder}
258
- size="sm"
259
- className={getStyles('icon-view')}
260
- />
261
-
262
- </span>
263
-
264
- {isToolTipMounted ? (
265
- <ReactTooltip id='returnOrder' type='error'>
266
- <span>{txtTootipReturnOrder}</span>
267
- </ReactTooltip>
268
- ) : null}
220
+ <span
221
+ data-tip
222
+ data-for='userView'
223
+ onMouseEnter={handleMouseEnter}
224
+ onMouseLeave={handleMouseLeave}
225
+ >
226
+ <Icon
227
+ color="highlight"
228
+ id='userViewIcon'
229
+ isClickable
230
+ name="userView"
231
+ onClick={onClickUserView}
232
+ size="sm"
233
+ className={getStyles('icon-view')}
234
+ />
269
235
 
270
- </div>
236
+ </span>
271
237
 
272
- <div className={getStyles('card-subcontent-action')}>
273
-
274
- <span
275
- data-tip
276
- data-for='repeatOrder'
277
- onMouseEnter={handleMouseEnter}
278
- onMouseLeave={handleMouseLeave}
279
- >
280
- <Icon
281
- color="highlight"
282
- id='repeatOrderIcon'
283
- isClickable
284
- name="repeatOrder"
285
- onClick={onClickRepeatOrder}
286
- size="sm"
287
- className={getStyles('icon-view')}
288
- />
289
-
290
- </span>
291
-
292
- {isToolTipMounted ? (
293
- <ReactTooltip id='repeatOrder' type='error'>
294
- <span>{txtTootipRepeatOrder}</span>
295
- </ReactTooltip>
296
- ) : null}
238
+ {isToolTipMounted ? (
239
+ <ReactTooltip id='userView' type='error'>
240
+ <span>{txtTootipUserView}</span>
241
+ </ReactTooltip>
242
+ ) : null}
297
243
 
244
+ </div>
298
245
 
299
- </div>
246
+ <div className={getStyles('card-subcontent-action')}>
300
247
 
301
- <div className={getStyles('card-subcontent-action')}>
302
-
303
- <span
304
- data-tip
305
- data-for='edit'
306
- onMouseEnter={handleMouseEnter}
307
- onMouseLeave={handleMouseLeave}
308
- >
309
- <Icon
310
- color="highlight"
311
- id='editIcon'
312
- isClickable
313
- name="edit"
314
- onClick={onClickEdit}
315
- size="sm"
316
- className={getStyles('icon-view')}
317
- />
318
-
319
- </span>
320
-
321
- {isToolTipMounted ? (
322
- <ReactTooltip id='edit' type='error'>
323
- <span>{txtTootipEdit}</span>
324
- </ReactTooltip>
325
- ) : null}
248
+ <span
249
+ data-tip
250
+ data-for='returnOrder'
251
+ onMouseEnter={handleMouseEnter}
252
+ onMouseLeave={handleMouseLeave}
253
+ >
254
+ <Icon
255
+ color="highlight"
256
+ id='returnOrderIcon'
257
+ isClickable
258
+ name="returnOrder"
259
+ onClick={onClickReturnOrder}
260
+ size="sm"
261
+ className={getStyles('icon-view')}
262
+ />
326
263
 
264
+ </span>
327
265
 
328
- </div>
266
+ {isToolTipMounted ? (
267
+ <ReactTooltip id='returnOrder' type='error'>
268
+ <span>{txtTootipReturnOrder}</span>
269
+ </ReactTooltip>
270
+ ) : null}
329
271
 
330
- <div className={getStyles('card-subcontent-action')}>
331
-
332
- <span
333
- data-tip
334
- data-for='trash'
335
- onMouseEnter={handleMouseEnter}
336
- onMouseLeave={handleMouseLeave}
337
- >
338
- <Icon
339
- color="highlight"
340
- id='trashIcon'
341
- isClickable
342
- name="trash"
343
- onClick={onClickTrash}
344
- size="sm"
345
- className={getStyles('icon-view-delete')}
346
- />
347
-
348
- </span>
349
-
350
- {isToolTipMounted ? (
351
- <ReactTooltip id='trash' type='error'>
352
- <span>{txtTootipTrash}</span>
353
- </ReactTooltip>
354
- ) : null}
272
+ </div>
355
273
 
356
- </div>
274
+ <div className={getStyles('card-subcontent-action')}>
357
275
 
358
- <div className={getStyles('card-subcontent-action')}>
359
-
360
- <span
361
- data-tip
362
- data-for='circleStatus'
363
- onMouseEnter={handleMouseEnter}
364
- onMouseLeave={handleMouseLeave}
365
- >
366
-
367
- <Icon
368
- className={getStyles(
369
- { 'icon-view-status10': statusService === 10 || -30 },
370
- { 'icon-view-status20': statusService === 20 },
371
- // { 'icon-view-status30': statusService === 30 || -20 || -40 },
372
- )}
373
- name="circleStatus"
374
- size="sm"
375
- />
376
-
377
- </span>
378
-
379
- {isToolTipMounted ? (
380
- <ReactTooltip id='circleStatus' type='error'>
381
- <span>{txtTootipCircleStatus}</span>
382
- </ReactTooltip>
383
- ) : null}
276
+ <span
277
+ data-tip
278
+ data-for='repeatOrder'
279
+ onMouseEnter={handleMouseEnter}
280
+ onMouseLeave={handleMouseLeave}
281
+ >
282
+ <Icon
283
+ color="highlight"
284
+ id='repeatOrderIcon'
285
+ isClickable
286
+ name="repeatOrder"
287
+ onClick={onClickRepeatOrder}
288
+ size="sm"
289
+ className={getStyles('icon-view')}
290
+ />
384
291
 
385
- </div>
292
+ </span>
386
293
 
387
- </div>
294
+ {isToolTipMounted ? (
295
+ <ReactTooltip id='repeatOrder' type='error'>
296
+ <span>{txtTootipRepeatOrder}</span>
297
+ </ReactTooltip>
298
+ ) : null}
299
+
300
+
301
+ </div>
302
+
303
+ <div className={getStyles('card-subcontent-action')}>
304
+
305
+ <span
306
+ data-tip
307
+ data-for='edit'
308
+ onMouseEnter={handleMouseEnter}
309
+ onMouseLeave={handleMouseLeave}
310
+ >
311
+ <Icon
312
+ color="highlight"
313
+ id='editIcon'
314
+ isClickable
315
+ name="edit"
316
+ onClick={onClickEdit}
317
+ size="sm"
318
+ className={getStyles('icon-view')}
319
+ />
320
+
321
+ </span>
322
+
323
+ {isToolTipMounted ? (
324
+ <ReactTooltip id='edit' type='error'>
325
+ <span>{txtTootipEdit}</span>
326
+ </ReactTooltip>
327
+ ) : null}
328
+
329
+
330
+ </div>
331
+
332
+ <div className={getStyles('card-subcontent-action')}>
333
+
334
+ <span
335
+ data-tip
336
+ data-for='trash'
337
+ onMouseEnter={handleMouseEnter}
338
+ onMouseLeave={handleMouseLeave}
339
+ >
340
+ <Icon
341
+ color="highlight"
342
+ id='trashIcon'
343
+ isClickable
344
+ name="trash"
345
+ onClick={onClickTrash}
346
+ size="sm"
347
+ className={getStyles('icon-view-delete')}
348
+ />
349
+
350
+ </span>
351
+
352
+ {isToolTipMounted ? (
353
+ <ReactTooltip id='trash' type='error'>
354
+ <span>{txtTootipTrash}</span>
355
+ </ReactTooltip>
356
+ ) : null}
357
+
358
+ </div>
359
+
360
+ <div className={getStyles('card-subcontent-action')}>
361
+
362
+ <span
363
+ data-tip
364
+ data-for='circleStatus'
365
+ onMouseEnter={handleMouseEnter}
366
+ onMouseLeave={handleMouseLeave}
367
+ >
368
+
369
+ <Icon
370
+ className={getStyles(
371
+ { 'icon-view-status10': statusService === 10 || -30 },
372
+ { 'icon-view-status20': statusService === 20 },
373
+ // { 'icon-view-status30': statusService === 30 || -20 || -40 },
374
+ )}
375
+ name="circleStatus"
376
+ size="sm"
377
+ />
378
+
379
+ </span>
380
+
381
+ {isToolTipMounted ? (
382
+ <ReactTooltip id='circleStatus' type='error'>
383
+ <span>{txtTootipCircleStatus}</span>
384
+ </ReactTooltip>
385
+ ) : null}
386
+
387
+ </div>
388
+
389
+ </div>
390
+ ) : null}
388
391
 
389
392
  {/* {children} */}
390
393
  </div>
@@ -421,6 +424,7 @@ CardServices.propTypes = {
421
424
  labelUserService: PropTypes.string,
422
425
  labelRefService: PropTypes.string,
423
426
  labelUserNumberService: PropTypes.string,
427
+ isViewAction: PropTypes.bool,
424
428
  }
425
429
 
426
430
  CardServices.defaultProps = {
@@ -451,6 +455,7 @@ CardServices.defaultProps = {
451
455
  labelUserService: 'Pasajero',
452
456
  labelRefService: 'REF',
453
457
  labelUserNumberService: 'Usuario',
458
+ isViewAction: true,
454
459
  }
455
460
 
456
461
  export default withStyles(styles)(CardServices)
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "imbric-theme",
3
- "version": "0.6.9",
3
+ "version": "0.7.1",
4
4
  "description": "Components library IMBRIC",
5
5
  "private": false,
6
6
  "main": "index.js",