@mirai/ui 1.0.62 → 1.0.64

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.
Files changed (77) hide show
  1. package/README.md +8 -1
  2. package/build/components/Button/Button.stories.js +4 -2
  3. package/build/components/Button/Button.stories.js.map +1 -1
  4. package/build/components/Calendar/Calendar.stories.js +2 -2
  5. package/build/components/Calendar/Calendar.stories.js.map +1 -1
  6. package/build/components/Form/Form.stories.js +4 -2
  7. package/build/components/Form/Form.stories.js.map +1 -1
  8. package/build/components/InputDate/InputDate.js +28 -12
  9. package/build/components/InputDate/InputDate.js.map +1 -1
  10. package/build/components/InputDate/InputDate.module.css +9 -16
  11. package/build/components/InputDate/InputDate.stories.js +15 -3
  12. package/build/components/InputDate/InputDate.stories.js.map +1 -1
  13. package/build/components/InputDate/__tests__/__snapshots__/InputDate.test.js.snap +144 -167
  14. package/build/components/InputNumber/InputNumber.stories.js +4 -2
  15. package/build/components/InputNumber/InputNumber.stories.js.map +1 -1
  16. package/build/components/InputOption/InputOption.js +1 -0
  17. package/build/components/InputOption/InputOption.js.map +1 -1
  18. package/build/components/InputOption/InputOption.stories.js +4 -2
  19. package/build/components/InputOption/InputOption.stories.js.map +1 -1
  20. package/build/components/InputOption/__tests__/__snapshots__/InputOption.test.js.snap +3 -3
  21. package/build/components/InputSelect/InputSelect.js +17 -7
  22. package/build/components/InputSelect/InputSelect.js.map +1 -1
  23. package/build/components/InputSelect/InputSelect.stories.js +4 -2
  24. package/build/components/InputSelect/InputSelect.stories.js.map +1 -1
  25. package/build/components/InputSelect/__tests__/__snapshots__/InputSelect.test.js.snap +217 -163
  26. package/build/components/InputText/InputText.js +13 -10
  27. package/build/components/InputText/InputText.js.map +1 -1
  28. package/build/components/InputText/InputText.module.css +11 -11
  29. package/build/components/InputText/InputText.stories.js +5 -2
  30. package/build/components/InputText/InputText.stories.js.map +1 -1
  31. package/build/components/InputText/__tests__/__snapshots__/InputText.test.js.snap +108 -88
  32. package/build/components/Menu/Menu.js +37 -15
  33. package/build/components/Menu/Menu.js.map +1 -1
  34. package/build/components/Menu/Menu.module.css +3 -0
  35. package/build/components/Menu/Menu.stories.js +7 -4
  36. package/build/components/Menu/Menu.stories.js.map +1 -1
  37. package/build/components/Menu/__tests__/__snapshots__/Menu.test.jsx.snap +36 -19
  38. package/build/components/Modal/Modal.js +5 -2
  39. package/build/components/Modal/Modal.js.map +1 -1
  40. package/build/components/Modal/Modal.module.css +9 -20
  41. package/build/components/Modal/Modal.stories.js +5 -2
  42. package/build/components/Modal/Modal.stories.js.map +1 -1
  43. package/build/components/Modal/__tests__/__snapshots__/Modal.test.js.snap +24 -12
  44. package/build/components/Notification/Notification.stories.js +4 -2
  45. package/build/components/Notification/Notification.stories.js.map +1 -1
  46. package/build/components/Table/Table.stories.js +4 -2
  47. package/build/components/Table/Table.stories.js.map +1 -1
  48. package/build/components/Tooltip/Tooltip.stories.js +4 -2
  49. package/build/components/Tooltip/Tooltip.stories.js.map +1 -1
  50. package/build/hooks/useDevice.js +1 -1
  51. package/build/hooks/useDevice.js.map +1 -1
  52. package/build/primitives/Checkbox/Checkbox.stories.js +4 -2
  53. package/build/primitives/Checkbox/Checkbox.stories.js.map +1 -1
  54. package/build/primitives/Icon/Icon.stories.js +4 -2
  55. package/build/primitives/Icon/Icon.stories.js.map +1 -1
  56. package/build/primitives/Input/Input.stories.js +4 -2
  57. package/build/primitives/Input/Input.stories.js.map +1 -1
  58. package/build/primitives/Layer/Layer.stories.js +4 -2
  59. package/build/primitives/Layer/Layer.stories.js.map +1 -1
  60. package/build/primitives/Pressable/Pressable.stories.js +4 -2
  61. package/build/primitives/Pressable/Pressable.stories.js.map +1 -1
  62. package/build/primitives/Radio/Radio.stories.js +4 -2
  63. package/build/primitives/Radio/Radio.stories.js.map +1 -1
  64. package/build/primitives/ScrollView/ScrollView.stories.js +4 -2
  65. package/build/primitives/ScrollView/ScrollView.stories.js.map +1 -1
  66. package/build/primitives/Select/Select.stories.js +4 -2
  67. package/build/primitives/Select/Select.stories.js.map +1 -1
  68. package/build/primitives/Switch/Switch.stories.js +4 -2
  69. package/build/primitives/Switch/Switch.stories.js.map +1 -1
  70. package/build/primitives/Text/Text.stories.js +4 -2
  71. package/build/primitives/Text/Text.stories.js.map +1 -1
  72. package/build/primitives/View/View.stories.js +4 -2
  73. package/build/primitives/View/View.stories.js.map +1 -1
  74. package/build/theme/default.theme.css +1 -1
  75. package/build/theme/theme.stories.js +2 -0
  76. package/build/theme/theme.stories.js.map +1 -0
  77. package/package.json +1 -1
@@ -38,28 +38,32 @@ exports[`component:<InputSelect> inherit:className 1`] = `
38
38
  five
39
39
  </option>
40
40
  </select>
41
- <span
42
- class="icon headline-3 icon right"
41
+ <div
42
+ class="view row icons"
43
43
  >
44
- <svg
45
- fill="currentColor"
46
- height="1em"
47
- stroke="currentColor"
48
- stroke-width="0"
49
- viewBox="0 0 24 24"
50
- width="1em"
51
- xmlns="http://www.w3.org/2000/svg"
52
- >
53
- <path
54
- d="M24 24H0V0h24v24z"
55
- fill="none"
56
- opacity=".87"
57
- />
58
- <path
59
- d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6-1.41-1.41z"
60
- />
61
- </svg>
62
- </span>
44
+ <span
45
+ class="icon headline-3 icon"
46
+ >
47
+ <svg
48
+ fill="currentColor"
49
+ height="1em"
50
+ stroke="currentColor"
51
+ stroke-width="0"
52
+ viewBox="0 0 24 24"
53
+ width="1em"
54
+ xmlns="http://www.w3.org/2000/svg"
55
+ >
56
+ <path
57
+ d="M24 24H0V0h24v24z"
58
+ fill="none"
59
+ opacity=".87"
60
+ />
61
+ <path
62
+ d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6-1.41-1.41z"
63
+ />
64
+ </svg>
65
+ </span>
66
+ </div>
63
67
  </div>
64
68
  </div>
65
69
  </DocumentFragment>
@@ -147,28 +151,32 @@ exports[`component:<InputSelect> prop:error 1`] = `
147
151
  five
148
152
  </option>
149
153
  </select>
150
- <span
151
- class="icon headline-3 icon right"
154
+ <div
155
+ class="view row icons"
152
156
  >
153
- <svg
154
- fill="currentColor"
155
- height="1em"
156
- stroke="currentColor"
157
- stroke-width="0"
158
- viewBox="0 0 24 24"
159
- width="1em"
160
- xmlns="http://www.w3.org/2000/svg"
161
- >
162
- <path
163
- d="M24 24H0V0h24v24z"
164
- fill="none"
165
- opacity=".87"
166
- />
167
- <path
168
- d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6-1.41-1.41z"
169
- />
170
- </svg>
171
- </span>
157
+ <span
158
+ class="icon headline-3 icon"
159
+ >
160
+ <svg
161
+ fill="currentColor"
162
+ height="1em"
163
+ stroke="currentColor"
164
+ stroke-width="0"
165
+ viewBox="0 0 24 24"
166
+ width="1em"
167
+ xmlns="http://www.w3.org/2000/svg"
168
+ >
169
+ <path
170
+ d="M24 24H0V0h24v24z"
171
+ fill="none"
172
+ opacity=".87"
173
+ />
174
+ <path
175
+ d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6-1.41-1.41z"
176
+ />
177
+ </svg>
178
+ </span>
179
+ </div>
172
180
  </div>
173
181
  </div>
174
182
  </DocumentFragment>
@@ -212,28 +220,32 @@ exports[`component:<InputSelect> prop:hint 1`] = `
212
220
  five
213
221
  </option>
214
222
  </select>
215
- <span
216
- class="icon headline-3 icon right"
223
+ <div
224
+ class="view row icons"
217
225
  >
218
- <svg
219
- fill="currentColor"
220
- height="1em"
221
- stroke="currentColor"
222
- stroke-width="0"
223
- viewBox="0 0 24 24"
224
- width="1em"
225
- xmlns="http://www.w3.org/2000/svg"
226
- >
227
- <path
228
- d="M24 24H0V0h24v24z"
229
- fill="none"
230
- opacity=".87"
231
- />
232
- <path
233
- d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6-1.41-1.41z"
234
- />
235
- </svg>
236
- </span>
226
+ <span
227
+ class="icon headline-3 icon"
228
+ >
229
+ <svg
230
+ fill="currentColor"
231
+ height="1em"
232
+ stroke="currentColor"
233
+ stroke-width="0"
234
+ viewBox="0 0 24 24"
235
+ width="1em"
236
+ xmlns="http://www.w3.org/2000/svg"
237
+ >
238
+ <path
239
+ d="M24 24H0V0h24v24z"
240
+ fill="none"
241
+ opacity=".87"
242
+ />
243
+ <path
244
+ d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6-1.41-1.41z"
245
+ />
246
+ </svg>
247
+ </span>
248
+ </div>
237
249
  </div>
238
250
  <span
239
251
  class="text small text hint"
@@ -287,28 +299,32 @@ exports[`component:<InputSelect> prop:label 1`] = `
287
299
  five
288
300
  </option>
289
301
  </select>
290
- <span
291
- class="icon headline-3 icon right"
302
+ <div
303
+ class="view row icons"
292
304
  >
293
- <svg
294
- fill="currentColor"
295
- height="1em"
296
- stroke="currentColor"
297
- stroke-width="0"
298
- viewBox="0 0 24 24"
299
- width="1em"
300
- xmlns="http://www.w3.org/2000/svg"
301
- >
302
- <path
303
- d="M24 24H0V0h24v24z"
304
- fill="none"
305
- opacity=".87"
306
- />
307
- <path
308
- d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6-1.41-1.41z"
309
- />
310
- </svg>
311
- </span>
305
+ <span
306
+ class="icon headline-3 icon"
307
+ >
308
+ <svg
309
+ fill="currentColor"
310
+ height="1em"
311
+ stroke="currentColor"
312
+ stroke-width="0"
313
+ viewBox="0 0 24 24"
314
+ width="1em"
315
+ xmlns="http://www.w3.org/2000/svg"
316
+ >
317
+ <path
318
+ d="M24 24H0V0h24v24z"
319
+ fill="none"
320
+ opacity=".87"
321
+ />
322
+ <path
323
+ d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6-1.41-1.41z"
324
+ />
325
+ </svg>
326
+ </span>
327
+ </div>
312
328
  </div>
313
329
  </div>
314
330
  </DocumentFragment>
@@ -352,28 +368,32 @@ exports[`component:<InputSelect> prop:label 2`] = `
352
368
  five
353
369
  </option>
354
370
  </select>
355
- <span
356
- class="icon headline-3 icon right"
371
+ <div
372
+ class="view row icons"
357
373
  >
358
- <svg
359
- fill="currentColor"
360
- height="1em"
361
- stroke="currentColor"
362
- stroke-width="0"
363
- viewBox="0 0 24 24"
364
- width="1em"
365
- xmlns="http://www.w3.org/2000/svg"
366
- >
367
- <path
368
- d="M24 24H0V0h24v24z"
369
- fill="none"
370
- opacity=".87"
371
- />
372
- <path
373
- d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6-1.41-1.41z"
374
- />
375
- </svg>
376
- </span>
374
+ <span
375
+ class="icon headline-3 icon"
376
+ >
377
+ <svg
378
+ fill="currentColor"
379
+ height="1em"
380
+ stroke="currentColor"
381
+ stroke-width="0"
382
+ viewBox="0 0 24 24"
383
+ width="1em"
384
+ xmlns="http://www.w3.org/2000/svg"
385
+ >
386
+ <path
387
+ d="M24 24H0V0h24v24z"
388
+ fill="none"
389
+ opacity=".87"
390
+ />
391
+ <path
392
+ d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6-1.41-1.41z"
393
+ />
394
+ </svg>
395
+ </span>
396
+ </div>
377
397
  </div>
378
398
  </div>
379
399
  </DocumentFragment>
@@ -461,23 +481,49 @@ exports[`component:<InputSelect> prop:warning 1`] = `
461
481
  five
462
482
  </option>
463
483
  </select>
464
- <span
465
- class="icon headline-3 icon right warning"
484
+ <div
485
+ class="view row icons"
466
486
  >
467
- <svg
468
- fill="currentColor"
469
- height="1em"
470
- stroke="currentColor"
471
- stroke-width="0"
472
- viewBox="0 0 24 24"
473
- width="1em"
474
- xmlns="http://www.w3.org/2000/svg"
475
- >
476
- <path
477
- d="M1 21h22L12 2 1 21zm12-3h-2v-2h2v2zm0-4h-2v-4h2v4z"
478
- />
479
- </svg>
480
- </span>
487
+ <span
488
+ class="icon headline-3 icon"
489
+ >
490
+ <svg
491
+ fill="currentColor"
492
+ height="1em"
493
+ stroke="currentColor"
494
+ stroke-width="0"
495
+ viewBox="0 0 24 24"
496
+ width="1em"
497
+ xmlns="http://www.w3.org/2000/svg"
498
+ >
499
+ <path
500
+ d="M24 24H0V0h24v24z"
501
+ fill="none"
502
+ opacity=".87"
503
+ />
504
+ <path
505
+ d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6-1.41-1.41z"
506
+ />
507
+ </svg>
508
+ </span>
509
+ <span
510
+ class="icon headline-3 icon warning"
511
+ >
512
+ <svg
513
+ fill="currentColor"
514
+ height="1em"
515
+ stroke="currentColor"
516
+ stroke-width="0"
517
+ viewBox="0 0 24 24"
518
+ width="1em"
519
+ xmlns="http://www.w3.org/2000/svg"
520
+ >
521
+ <path
522
+ d="M1 21h22L12 2 1 21zm12-3h-2v-2h2v2zm0-4h-2v-4h2v4z"
523
+ />
524
+ </svg>
525
+ </span>
526
+ </div>
481
527
  </div>
482
528
  </div>
483
529
  </DocumentFragment>
@@ -521,28 +567,32 @@ exports[`component:<InputSelect> renders 1`] = `
521
567
  five
522
568
  </option>
523
569
  </select>
524
- <span
525
- class="icon headline-3 icon right"
570
+ <div
571
+ class="view row icons"
526
572
  >
527
- <svg
528
- fill="currentColor"
529
- height="1em"
530
- stroke="currentColor"
531
- stroke-width="0"
532
- viewBox="0 0 24 24"
533
- width="1em"
534
- xmlns="http://www.w3.org/2000/svg"
535
- >
536
- <path
537
- d="M24 24H0V0h24v24z"
538
- fill="none"
539
- opacity=".87"
540
- />
541
- <path
542
- d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6-1.41-1.41z"
543
- />
544
- </svg>
545
- </span>
573
+ <span
574
+ class="icon headline-3 icon"
575
+ >
576
+ <svg
577
+ fill="currentColor"
578
+ height="1em"
579
+ stroke="currentColor"
580
+ stroke-width="0"
581
+ viewBox="0 0 24 24"
582
+ width="1em"
583
+ xmlns="http://www.w3.org/2000/svg"
584
+ >
585
+ <path
586
+ d="M24 24H0V0h24v24z"
587
+ fill="none"
588
+ opacity=".87"
589
+ />
590
+ <path
591
+ d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6-1.41-1.41z"
592
+ />
593
+ </svg>
594
+ </span>
595
+ </div>
546
596
  </div>
547
597
  </div>
548
598
  </DocumentFragment>
@@ -587,28 +637,32 @@ exports[`component:<InputSelect> testID 1`] = `
587
637
  five
588
638
  </option>
589
639
  </select>
590
- <span
591
- class="icon headline-3 icon right"
640
+ <div
641
+ class="view row icons"
592
642
  >
593
- <svg
594
- fill="currentColor"
595
- height="1em"
596
- stroke="currentColor"
597
- stroke-width="0"
598
- viewBox="0 0 24 24"
599
- width="1em"
600
- xmlns="http://www.w3.org/2000/svg"
601
- >
602
- <path
603
- d="M24 24H0V0h24v24z"
604
- fill="none"
605
- opacity=".87"
606
- />
607
- <path
608
- d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6-1.41-1.41z"
609
- />
610
- </svg>
611
- </span>
643
+ <span
644
+ class="icon headline-3 icon"
645
+ >
646
+ <svg
647
+ fill="currentColor"
648
+ height="1em"
649
+ stroke="currentColor"
650
+ stroke-width="0"
651
+ viewBox="0 0 24 24"
652
+ width="1em"
653
+ xmlns="http://www.w3.org/2000/svg"
654
+ >
655
+ <path
656
+ d="M24 24H0V0h24v24z"
657
+ fill="none"
658
+ opacity=".87"
659
+ />
660
+ <path
661
+ d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6-1.41-1.41z"
662
+ />
663
+ </svg>
664
+ </span>
665
+ </div>
612
666
  </div>
613
667
  </div>
614
668
  </DocumentFragment>
@@ -115,22 +115,25 @@ var InputText = function InputText(_ref) {
115
115
  onChange: handleChange,
116
116
  onEnter: handleEnter,
117
117
  onLeave: handleLeave
118
- })), has.stateIcon && /*#__PURE__*/_react.default.createElement(_primitives.Icon, {
119
- value: (0, _helpers.getIconState)({
120
- error: error,
121
- success: success,
122
- warning: warning
123
- }),
124
- className: (0, _helpers.styles)(_InputTextModule.default.icon, _InputTextModule.default.right, error ? _InputTextModule.default.error : warning ? _InputTextModule.default.warning : success ? _InputTextModule.default.success : undefined)
125
- }), is.password && !disabled && !has.stateIcon && /*#__PURE__*/_react.default.createElement(_primitives.Pressable, {
118
+ })), (is.password && !disabled || has.stateIcon) && /*#__PURE__*/_react.default.createElement(_primitives.View, {
119
+ row: true,
120
+ className: _InputTextModule.default.icons
121
+ }, is.password && !disabled && /*#__PURE__*/_react.default.createElement(_primitives.Pressable, {
126
122
  tabIndex: -1,
127
123
  type: "button",
128
- className: _InputTextModule.default.pressable,
129
124
  onPress: function onPress() {
130
125
  return setPassword(!password);
131
126
  }
132
127
  }, /*#__PURE__*/_react.default.createElement(_primitives.Icon, {
133
- value: password ? _primitives.ICON.EYE_CLOSE : _primitives.ICON.EYE_OPEN
128
+ value: password ? _primitives.ICON.EYE_CLOSE : _primitives.ICON.EYE_OPEN,
129
+ className: _InputTextModule.default.icon
130
+ })), has.stateIcon && /*#__PURE__*/_react.default.createElement(_primitives.Icon, {
131
+ value: (0, _helpers.getIconState)({
132
+ error: error,
133
+ success: success,
134
+ warning: warning
135
+ }),
136
+ className: (0, _helpers.styles)(_InputTextModule.default.icon, error ? _InputTextModule.default.error : warning ? _InputTextModule.default.warning : success ? _InputTextModule.default.success : undefined)
134
137
  }))), hint && /*#__PURE__*/_react.default.createElement(_primitives.Text, {
135
138
  small: true,
136
139
  className: (0, _helpers.styles)(_InputTextModule.default.text, _InputTextModule.default.hint, disabled && _InputTextModule.default.disabled, error && _InputTextModule.default.error)
@@ -1 +1 @@
1
- {"version":3,"file":"InputText.js","names":["InputText","disabled","error","hint","icon","label","showState","success","type","warning","onChange","onEnter","onLeave","others","focus","setFocus","password","setPassword","handleChange","value","event","handleEnter","handleLeave","has","undefined","length","stateIcon","is","style","inputContainer","className","text","withIcon","inputBorder","left","input","iconLeft","right","pressable","ICON","EYE_CLOSE","EYE_OPEN","displayName","propTypes","PropTypes","bool","string","func","multiLine","name","isRequired"],"sources":["../../../src/components/InputText/InputText.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React, { useState } from 'react';\n\nimport { getIconState, styles } from '../../helpers';\nimport { ICON, Icon, Input, Pressable, Text, View } from '../../primitives';\nimport style from './InputText.module.css';\n\nconst InputText = ({\n disabled,\n error,\n hint,\n icon,\n label,\n showState = true,\n success,\n type,\n warning,\n onChange = () => {},\n onEnter = () => {},\n onLeave = () => {},\n ...others\n}) => {\n const [focus, setFocus] = useState(false);\n const [password, setPassword] = useState(true);\n\n const handleChange = (value, event) => {\n onChange(value, event);\n };\n\n const handleEnter = (event) => {\n setFocus(true);\n onEnter(event);\n };\n\n const handleLeave = () => {\n setFocus(false);\n onLeave(event);\n };\n\n const has = {\n value: others.value !== undefined && others.value?.length > 0,\n stateIcon: showState && (error || success || warning),\n };\n const is = { password: type === 'password' };\n\n return (\n <View className={styles(style.inputContainer, others.className)} style={others.style}>\n {label && (\n <Text\n className={styles(\n style.text,\n style.label,\n disabled && style.disabled,\n focus && style.focus,\n error && style.error,\n icon && style.withIcon,\n (focus || error || has.value) && style.value,\n )}\n >\n {label}\n </Text>\n )}\n\n <View\n row\n className={styles(\n style.inputBorder,\n disabled && style.disabled,\n error && style.error,\n focus && !error && style.focus,\n )}\n >\n {icon && (\n <Icon\n value={icon}\n className={styles(style.icon, style.left, disabled && style.disabled, error && style.error)}\n />\n )}\n <Input\n {...others}\n disabled={disabled}\n type={!is.password || password ? type : 'text'}\n value={others.value || ''}\n className={styles(style.input, icon && style.iconLeft)}\n style={undefined}\n onChange={handleChange}\n onEnter={handleEnter}\n onLeave={handleLeave}\n />\n\n {has.stateIcon && (\n <Icon\n value={getIconState({ error, success, warning })}\n className={styles(\n style.icon,\n style.right,\n error ? style.error : warning ? style.warning : success ? style.success : undefined,\n )}\n />\n )}\n {is.password && !disabled && !has.stateIcon && (\n <Pressable tabIndex={-1} type=\"button\" className={style.pressable} onPress={() => setPassword(!password)}>\n <Icon value={password ? ICON.EYE_CLOSE : ICON.EYE_OPEN} />\n </Pressable>\n )}\n </View>\n\n {hint && (\n <Text small className={styles(style.text, style.hint, disabled && style.disabled, error && style.error)}>\n {hint}\n </Text>\n )}\n </View>\n );\n};\n\nInputText.displayName = 'Component:InputText';\n\nInputText.propTypes = {\n disabled: PropTypes.bool,\n error: PropTypes.bool,\n hint: PropTypes.string,\n icon: PropTypes.func,\n label: PropTypes.string,\n multiLine: PropTypes.bool,\n name: PropTypes.string.isRequired,\n showState: PropTypes.bool,\n success: PropTypes.bool,\n type: PropTypes.string,\n warning: PropTypes.bool,\n onChange: PropTypes.func,\n onEnter: PropTypes.func,\n onLeave: PropTypes.func,\n};\n\nexport { InputText };\n"],"mappings":"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"}
1
+ {"version":3,"file":"InputText.js","names":["InputText","disabled","error","hint","icon","label","showState","success","type","warning","onChange","onEnter","onLeave","others","focus","setFocus","password","setPassword","handleChange","value","event","handleEnter","handleLeave","has","undefined","length","stateIcon","is","style","inputContainer","className","text","withIcon","inputBorder","left","input","iconLeft","icons","ICON","EYE_CLOSE","EYE_OPEN","displayName","propTypes","PropTypes","bool","string","func","multiLine","name","isRequired"],"sources":["../../../src/components/InputText/InputText.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React, { useState } from 'react';\n\nimport { getIconState, styles } from '../../helpers';\nimport { ICON, Icon, Input, Pressable, Text, View } from '../../primitives';\nimport style from './InputText.module.css';\n\nconst InputText = ({\n disabled,\n error,\n hint,\n icon,\n label,\n showState = true,\n success,\n type,\n warning,\n onChange = () => {},\n onEnter = () => {},\n onLeave = () => {},\n ...others\n}) => {\n const [focus, setFocus] = useState(false);\n const [password, setPassword] = useState(true);\n\n const handleChange = (value, event) => {\n onChange(value, event);\n };\n\n const handleEnter = (event) => {\n setFocus(true);\n onEnter(event);\n };\n\n const handleLeave = () => {\n setFocus(false);\n onLeave(event);\n };\n\n const has = {\n value: others.value !== undefined && others.value?.length > 0,\n stateIcon: showState && (error || success || warning),\n };\n const is = { password: type === 'password' };\n\n return (\n <View className={styles(style.inputContainer, others.className)} style={others.style}>\n {label && (\n <Text\n className={styles(\n style.text,\n style.label,\n disabled && style.disabled,\n focus && style.focus,\n error && style.error,\n icon && style.withIcon,\n (focus || error || has.value) && style.value,\n )}\n >\n {label}\n </Text>\n )}\n\n <View\n row\n className={styles(\n style.inputBorder,\n disabled && style.disabled,\n error && style.error,\n focus && !error && style.focus,\n )}\n >\n {icon && (\n <Icon\n value={icon}\n className={styles(style.icon, style.left, disabled && style.disabled, error && style.error)}\n />\n )}\n <Input\n {...others}\n disabled={disabled}\n type={!is.password || password ? type : 'text'}\n value={others.value || ''}\n className={styles(style.input, icon && style.iconLeft)}\n style={undefined}\n onChange={handleChange}\n onEnter={handleEnter}\n onLeave={handleLeave}\n />\n\n {((is.password && !disabled) || has.stateIcon) && (\n <View row className={style.icons}>\n {is.password && !disabled && (\n <Pressable tabIndex={-1} type=\"button\" onPress={() => setPassword(!password)}>\n <Icon value={password ? ICON.EYE_CLOSE : ICON.EYE_OPEN} className={style.icon} />\n </Pressable>\n )}\n\n {has.stateIcon && (\n <Icon\n value={getIconState({ error, success, warning })}\n className={styles(\n style.icon,\n error ? style.error : warning ? style.warning : success ? style.success : undefined,\n )}\n />\n )}\n </View>\n )}\n </View>\n\n {hint && (\n <Text small className={styles(style.text, style.hint, disabled && style.disabled, error && style.error)}>\n {hint}\n </Text>\n )}\n </View>\n );\n};\n\nInputText.displayName = 'Component:InputText';\n\nInputText.propTypes = {\n disabled: PropTypes.bool,\n error: PropTypes.bool,\n hint: PropTypes.string,\n icon: PropTypes.func,\n label: PropTypes.string,\n multiLine: PropTypes.bool,\n name: PropTypes.string.isRequired,\n showState: PropTypes.bool,\n success: PropTypes.bool,\n type: PropTypes.string,\n warning: PropTypes.bool,\n onChange: PropTypes.func,\n onEnter: PropTypes.func,\n onLeave: PropTypes.func,\n};\n\nexport { InputText };\n"],"mappings":"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"}
@@ -23,21 +23,17 @@
23
23
  }
24
24
 
25
25
  .icon {
26
- color: var(--mirai-ui-input-disabled);
27
26
  font-size: var(--mirai-ui-input-text-icon);
28
27
  height: var(--mirai-ui-input-text-icon);
29
28
  line-height: var(--mirai-ui-input-text-icon);
30
- pointer-events: none;
31
- position: absolute;
32
29
  width: var(--mirai-ui-input-text-icon);
33
30
  }
34
31
 
35
32
  .icon.left {
33
+ color: var(--mirai-ui-input-disabled);
36
34
  left: var(--mirai-ui-input-text-padding-x);
37
- }
38
-
39
- .icon.right {
40
- right: var(--mirai-ui-input-text-padding-x);
35
+ pointer-events: none;
36
+ position: absolute;
41
37
  }
42
38
 
43
39
  .input {
@@ -54,20 +50,24 @@
54
50
  padding-right: calc(var(--mirai-ui-input-text-padding-x) * 3);
55
51
  }
56
52
 
57
- .input.empty:not(:focus),
58
- .input::placeholder {
53
+ .input.empty:not(:focus) {
59
54
  color: var(--mirai-ui-base);
60
55
  }
61
56
 
62
57
  .hint {
63
- margin: calc(var(--mirai-ui-input-text-padding-x) / 4) var(--mirai-ui-input-text-padding-x);
58
+ margin: calc(var(--mirai-ui-input-text-padding-y) / 4) var(--mirai-ui-input-text-padding-x);
64
59
  }
65
60
 
66
- .pressable {
61
+ .icons {
67
62
  position: absolute;
68
63
  right: var(--mirai-ui-input-text-padding-x);
69
64
  }
70
65
 
66
+ .icons > .icon {
67
+ margin-left: calc(var(--mirai-ui-input-text-icon) / 2);
68
+ position: relative;
69
+ }
70
+
71
71
  .label {
72
72
  background-color: var(--mirai-ui-input-background);
73
73
  font-size: var(--mirai-ui-input-font-size);
@@ -29,6 +29,8 @@ function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToAr
29
29
 
30
30
  function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
31
31
 
32
+ function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
33
+
32
34
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
33
35
 
34
36
  var _default = {
@@ -44,7 +46,7 @@ var Story = function Story(props) {
44
46
 
45
47
  exports.Story = Story;
46
48
  Story.storyName = 'InputText';
47
- Story.args = {
49
+ Story.args = _defineProperty({
48
50
  disabled: false,
49
51
  error: false,
50
52
  hint: 'hint',
@@ -52,6 +54,7 @@ Story.args = {
52
54
  label: 'label',
53
55
  multiLine: false,
54
56
  name: 'name',
57
+ placeholder: '',
55
58
  showState: true,
56
59
  success: false,
57
60
  type: 'text',
@@ -84,7 +87,7 @@ Story.args = {
84
87
 
85
88
  return (_console3 = console).log.apply(_console3, ['<InputText>::onLeave'].concat(props));
86
89
  }
87
- };
90
+ }, 'data-testid', 'test-story');
88
91
  Story.argTypes = {
89
92
  icon: {
90
93
  options: [undefined].concat(_toConsumableArray(Object.keys(_primitives.ICON))),
@@ -1 +1 @@
1
- {"version":3,"file":"InputText.stories.js","names":["title","Story","props","ICON","icon","storyName","args","disabled","error","hint","undefined","label","multiLine","name","showState","success","type","value","warning","onChange","console","log","onEnter","onLeave","argTypes","options","Object","keys","control","defaultValue"],"sources":["../../../src/components/InputText/InputText.stories.jsx"],"sourcesContent":["/* eslint-disable react/prop-types */\nimport * as React from 'react';\n\nimport { ICON } from '../../primitives';\nimport { InputText } from './InputText';\n\nexport default { title: 'Components' };\n\nexport const Story = (props) => <InputText {...props} icon={ICON[props.icon]} />;\n\nStory.storyName = 'InputText';\n\nStory.args = {\n disabled: false,\n error: false,\n hint: 'hint',\n icon: undefined,\n label: 'label',\n multiLine: false,\n name: 'name',\n showState: true,\n success: false,\n type: 'text',\n value: 'value',\n warning: false,\n onChange: (...props) => console.log('<InputText>::onChange', ...props),\n onEnter: (...props) => console.log('<InputText>::onEnter', ...props),\n onLeave: (...props) => console.log('<InputText>::onLeave', ...props),\n};\n\nStory.argTypes = {\n icon: {\n options: [undefined, ...Object.keys(ICON)],\n control: { type: 'select' },\n defaultValue: undefined,\n },\n type: {\n options: ['text', 'password', 'number', 'email', 'date'],\n control: { type: 'select' },\n defaultValue: 'text',\n },\n};\n"],"mappings":";;;;;;;;;AACA;;AAEA;;AACA;;;;;;;;;;;;;;;;;;;;eAEe;EAAEA,KAAK,EAAE;AAAT,C;;;AAER,IAAMC,KAAK,GAAG,SAARA,KAAQ,CAACC,KAAD;EAAA,oBAAW,oBAAC,oBAAD,eAAeA,KAAf;IAAsB,IAAI,EAAEC,iBAAKD,KAAK,CAACE,IAAX;EAA5B,GAAX;AAAA,CAAd;;;AAEPH,KAAK,CAACI,SAAN,GAAkB,WAAlB;AAEAJ,KAAK,CAACK,IAAN,GAAa;EACXC,QAAQ,EAAE,KADC;EAEXC,KAAK,EAAE,KAFI;EAGXC,IAAI,EAAE,MAHK;EAIXL,IAAI,EAAEM,SAJK;EAKXC,KAAK,EAAE,OALI;EAMXC,SAAS,EAAE,KANA;EAOXC,IAAI,EAAE,MAPK;EAQXC,SAAS,EAAE,IARA;EASXC,OAAO,EAAE,KATE;EAUXC,IAAI,EAAE,MAVK;EAWXC,KAAK,EAAE,OAXI;EAYXC,OAAO,EAAE,KAZE;EAaXC,QAAQ,EAAE;IAAA;;IAAA,kCAAIjB,KAAJ;MAAIA,KAAJ;IAAA;;IAAA,OAAc,YAAAkB,OAAO,EAACC,GAAR,kBAAY,uBAAZ,SAAwCnB,KAAxC,EAAd;EAAA,CAbC;EAcXoB,OAAO,EAAE;IAAA;;IAAA,mCAAIpB,KAAJ;MAAIA,KAAJ;IAAA;;IAAA,OAAc,aAAAkB,OAAO,EAACC,GAAR,mBAAY,sBAAZ,SAAuCnB,KAAvC,EAAd;EAAA,CAdE;EAeXqB,OAAO,EAAE;IAAA;;IAAA,mCAAIrB,KAAJ;MAAIA,KAAJ;IAAA;;IAAA,OAAc,aAAAkB,OAAO,EAACC,GAAR,mBAAY,sBAAZ,SAAuCnB,KAAvC,EAAd;EAAA;AAfE,CAAb;AAkBAD,KAAK,CAACuB,QAAN,GAAiB;EACfpB,IAAI,EAAE;IACJqB,OAAO,GAAGf,SAAH,4BAAiBgB,MAAM,CAACC,IAAP,CAAYxB,gBAAZ,CAAjB,EADH;IAEJyB,OAAO,EAAE;MAAEZ,IAAI,EAAE;IAAR,CAFL;IAGJa,YAAY,EAAEnB;EAHV,CADS;EAMfM,IAAI,EAAE;IACJS,OAAO,EAAE,CAAC,MAAD,EAAS,UAAT,EAAqB,QAArB,EAA+B,OAA/B,EAAwC,MAAxC,CADL;IAEJG,OAAO,EAAE;MAAEZ,IAAI,EAAE;IAAR,CAFL;IAGJa,YAAY,EAAE;EAHV;AANS,CAAjB"}
1
+ {"version":3,"file":"InputText.stories.js","names":["title","Story","props","ICON","icon","storyName","args","disabled","error","hint","undefined","label","multiLine","name","placeholder","showState","success","type","value","warning","onChange","console","log","onEnter","onLeave","argTypes","options","Object","keys","control","defaultValue"],"sources":["../../../src/components/InputText/InputText.stories.jsx"],"sourcesContent":["/* eslint-disable react/prop-types */\nimport * as React from 'react';\n\nimport { ICON } from '../../primitives';\nimport { InputText } from './InputText';\n\nexport default { title: 'Components' };\n\nexport const Story = (props) => <InputText {...props} icon={ICON[props.icon]} />;\n\nStory.storyName = 'InputText';\n\nStory.args = {\n disabled: false,\n error: false,\n hint: 'hint',\n icon: undefined,\n label: 'label',\n multiLine: false,\n name: 'name',\n placeholder: '',\n showState: true,\n success: false,\n type: 'text',\n value: 'value',\n warning: false,\n onChange: (...props) => console.log('<InputText>::onChange', ...props),\n onEnter: (...props) => console.log('<InputText>::onEnter', ...props),\n onLeave: (...props) => console.log('<InputText>::onLeave', ...props),\n ['data-testid']: 'test-story',\n};\n\nStory.argTypes = {\n icon: {\n options: [undefined, ...Object.keys(ICON)],\n control: { type: 'select' },\n defaultValue: undefined,\n },\n type: {\n options: ['text', 'password', 'number', 'email', 'date'],\n control: { type: 'select' },\n defaultValue: 'text',\n },\n};\n"],"mappings":";;;;;;;;;AACA;;AAEA;;AACA;;;;;;;;;;;;;;;;;;;;;;eAEe;EAAEA,KAAK,EAAE;AAAT,C;;;AAER,IAAMC,KAAK,GAAG,SAARA,KAAQ,CAACC,KAAD;EAAA,oBAAW,oBAAC,oBAAD,eAAeA,KAAf;IAAsB,IAAI,EAAEC,iBAAKD,KAAK,CAACE,IAAX;EAA5B,GAAX;AAAA,CAAd;;;AAEPH,KAAK,CAACI,SAAN,GAAkB,WAAlB;AAEAJ,KAAK,CAACK,IAAN;EACEC,QAAQ,EAAE,KADZ;EAEEC,KAAK,EAAE,KAFT;EAGEC,IAAI,EAAE,MAHR;EAIEL,IAAI,EAAEM,SAJR;EAKEC,KAAK,EAAE,OALT;EAMEC,SAAS,EAAE,KANb;EAOEC,IAAI,EAAE,MAPR;EAQEC,WAAW,EAAE,EARf;EASEC,SAAS,EAAE,IATb;EAUEC,OAAO,EAAE,KAVX;EAWEC,IAAI,EAAE,MAXR;EAYEC,KAAK,EAAE,OAZT;EAaEC,OAAO,EAAE,KAbX;EAcEC,QAAQ,EAAE;IAAA;;IAAA,kCAAIlB,KAAJ;MAAIA,KAAJ;IAAA;;IAAA,OAAc,YAAAmB,OAAO,EAACC,GAAR,kBAAY,uBAAZ,SAAwCpB,KAAxC,EAAd;EAAA,CAdZ;EAeEqB,OAAO,EAAE;IAAA;;IAAA,mCAAIrB,KAAJ;MAAIA,KAAJ;IAAA;;IAAA,OAAc,aAAAmB,OAAO,EAACC,GAAR,mBAAY,sBAAZ,SAAuCpB,KAAvC,EAAd;EAAA,CAfX;EAgBEsB,OAAO,EAAE;IAAA;;IAAA,mCAAItB,KAAJ;MAAIA,KAAJ;IAAA;;IAAA,OAAc,aAAAmB,OAAO,EAACC,GAAR,mBAAY,sBAAZ,SAAuCpB,KAAvC,EAAd;EAAA;AAhBX,GAiBG,aAjBH,EAiBmB,YAjBnB;AAoBAD,KAAK,CAACwB,QAAN,GAAiB;EACfrB,IAAI,EAAE;IACJsB,OAAO,GAAGhB,SAAH,4BAAiBiB,MAAM,CAACC,IAAP,CAAYzB,gBAAZ,CAAjB,EADH;IAEJ0B,OAAO,EAAE;MAAEZ,IAAI,EAAE;IAAR,CAFL;IAGJa,YAAY,EAAEpB;EAHV,CADS;EAMfO,IAAI,EAAE;IACJS,OAAO,EAAE,CAAC,MAAD,EAAS,UAAT,EAAqB,QAArB,EAA+B,OAA/B,EAAwC,MAAxC,CADL;IAEJG,OAAO,EAAE;MAAEZ,IAAI,EAAE;IAAR,CAFL;IAGJa,YAAY,EAAE;EAHV;AANS,CAAjB"}