@alfalab/core-components-bank-card 5.6.2 → 5.6.4

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 (12) hide show
  1. package/Component.js +1 -1
  2. package/cssm/index.js +0 -10
  3. package/cssm/index.module.css +1 -1
  4. package/esm/Component.js +1 -1
  5. package/esm/index.css +21 -21
  6. package/esm/index.js +0 -9
  7. package/index.css +21 -21
  8. package/index.js +0 -9
  9. package/modern/Component.js +1 -1
  10. package/modern/index.css +21 -21
  11. package/modern/index.js +0 -9
  12. package/package.json +2 -2
package/Component.js CHANGED
@@ -17,7 +17,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
17
17
  var React__default = /*#__PURE__*/_interopDefaultCompat(React);
18
18
  var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
19
19
 
20
- var styles = {"component":"bank-card__component_wd8lq","aspectRatioContainer":"bank-card__aspectRatioContainer_wd8lq","content":"bank-card__content_wd8lq","label":"bank-card__label_wd8lq","focused":"bank-card__focused_wd8lq","filled":"bank-card__filled_wd8lq","input":"bank-card__input_wd8lq","bankLogo":"bank-card__bankLogo_wd8lq","brandLogo":"bank-card__brandLogo_wd8lq","usePhoto":"bank-card__usePhoto_wd8lq"};
20
+ var styles = {"component":"bank-card__component_i3u6b","aspectRatioContainer":"bank-card__aspectRatioContainer_i3u6b","content":"bank-card__content_i3u6b","label":"bank-card__label_i3u6b","focused":"bank-card__focused_i3u6b","filled":"bank-card__filled_i3u6b","input":"bank-card__input_i3u6b","bankLogo":"bank-card__bankLogo_i3u6b","brandLogo":"bank-card__brandLogo_i3u6b","usePhoto":"bank-card__usePhoto_i3u6b"};
21
21
  require('./index.css')
22
22
 
23
23
  // prettier-ignore
package/cssm/index.js CHANGED
@@ -3,16 +3,6 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var Component = require('./Component.js');
6
- require('react');
7
- require('classnames');
8
- require('@alfalab/core-components-masked-input/cssm');
9
- require('@alfalab/icons-glyph/CameraMIcon');
10
- require('@alfalab/icons-logotype/AlfaBankLIcon');
11
- require('@alfalab/icons-logotype/MastercardLIcon');
12
- require('@alfalab/icons-logotype/MirXxlIcon');
13
- require('@alfalab/icons-logotype/VisaXxlIcon');
14
- require('./utils.js');
15
- require('./index.module.css');
16
6
 
17
7
 
18
8
 
package/cssm/index.module.css CHANGED
@@ -1,4 +1,4 @@
1
- :root {
1
+ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
2
2
  } /* deprecated */ :root {
3
3
  --color-light-neutral-1500: #0e0e0e;
4
4
  --color-light-text-secondary: rgba(4, 4, 19, 0.55); /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
package/esm/Component.js CHANGED
@@ -8,7 +8,7 @@ import { MirXxlIcon } from '@alfalab/icons-logotype/MirXxlIcon';
8
8
  import { VisaXxlIcon } from '@alfalab/icons-logotype/VisaXxlIcon';
9
9
  import { validateCardNumber } from './utils.js';
10
10
 
11
- var styles = {"component":"bank-card__component_wd8lq","aspectRatioContainer":"bank-card__aspectRatioContainer_wd8lq","content":"bank-card__content_wd8lq","label":"bank-card__label_wd8lq","focused":"bank-card__focused_wd8lq","filled":"bank-card__filled_wd8lq","input":"bank-card__input_wd8lq","bankLogo":"bank-card__bankLogo_wd8lq","brandLogo":"bank-card__brandLogo_wd8lq","usePhoto":"bank-card__usePhoto_wd8lq"};
11
+ var styles = {"component":"bank-card__component_i3u6b","aspectRatioContainer":"bank-card__aspectRatioContainer_i3u6b","content":"bank-card__content_i3u6b","label":"bank-card__label_i3u6b","focused":"bank-card__focused_i3u6b","filled":"bank-card__filled_i3u6b","input":"bank-card__input_i3u6b","bankLogo":"bank-card__bankLogo_i3u6b","brandLogo":"bank-card__brandLogo_i3u6b","usePhoto":"bank-card__usePhoto_i3u6b"};
12
12
  require('./index.css')
13
13
 
14
14
  // prettier-ignore
package/esm/index.css CHANGED
@@ -1,5 +1,5 @@
1
- /* hash: 141pm */
2
- :root {
1
+ /* hash: c4v3e */
2
+ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
3
3
  } /* deprecated */ :root {
4
4
  --color-light-neutral-1500: #0e0e0e;
5
5
  --color-light-text-secondary: rgba(4, 4, 19, 0.55); /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -22,7 +22,7 @@
22
22
  --font-family-styrene: 'Styrene UI', system-ui, -apple-system, 'Segoe UI', Roboto,
23
23
  'Helvetica Neue', Helvetica, sans-serif;
24
24
  } :root {
25
- } .bank-card__component_wd8lq {
25
+ } .bank-card__component_i3u6b {
26
26
  /* TODO: как это будет собираться и работать в webView */
27
27
  --form-control-border-radius: 0;
28
28
  --form-control-border-bottom: 1px solid var(--color-light-neutral-translucent-700);
@@ -41,10 +41,10 @@
41
41
  max-width: 343px;
42
42
 
43
43
  font-family: var(--font-family-styrene);
44
- } .bank-card__aspectRatioContainer_wd8lq {
44
+ } .bank-card__aspectRatioContainer_i3u6b {
45
45
  /* Эталонный размер 343x216 */
46
46
  padding-bottom: 63%;
47
- } .bank-card__content_wd8lq {
47
+ } .bank-card__content_i3u6b {
48
48
  position: absolute;
49
49
  top: 0;
50
50
  right: 0;
@@ -56,26 +56,26 @@
56
56
  padding-right: var(--gap-l);
57
57
  border-radius: var(--border-radius-l);
58
58
  box-sizing: border-box;
59
- } .bank-card__label_wd8lq {
59
+ } .bank-card__label_i3u6b {
60
60
  left: 0;
61
61
  transform: translateY(-1px);
62
62
  color: var(--color-light-text-secondary);
63
63
  font-size: 20px;
64
64
  line-height: 24px
65
- } @media (max-width: 360px) { .bank-card__label_wd8lq {
65
+ } @media (max-width: 360px) { .bank-card__label_i3u6b {
66
66
  font-size: 16px
67
67
  }
68
- } .bank-card__focused_wd8lq .bank-card__label_wd8lq,
69
- .bank-card__filled_wd8lq .bank-card__label_wd8lq {
68
+ } .bank-card__focused_i3u6b .bank-card__label_i3u6b,
69
+ .bank-card__filled_i3u6b .bank-card__label_i3u6b {
70
70
  color: var(--color-light-neutral-1500);
71
71
  transform: translateY(-19px) scale(0.6)
72
- } @media (max-width: 360px) { .bank-card__focused_wd8lq .bank-card__label_wd8lq,
73
- .bank-card__filled_wd8lq .bank-card__label_wd8lq {
72
+ } @media (max-width: 360px) { .bank-card__focused_i3u6b .bank-card__label_i3u6b,
73
+ .bank-card__filled_i3u6b .bank-card__label_i3u6b {
74
74
  transform: translateY(-22px) scale(0.75)
75
75
  }
76
- } .bank-card__focused_wd8lq:before {
76
+ } .bank-card__focused_i3u6b:before {
77
77
  transform: scale(1) !important;
78
- } .bank-card__input_wd8lq {
78
+ } .bank-card__input_i3u6b {
79
79
  font-size: 20px;
80
80
  line-height: 24px;
81
81
  font-weight: 400;
@@ -88,27 +88,27 @@
88
88
  /* TODO: обсудить с дизайнером, почему инпут не соответствует дизайн-системе, либо уменьшить каскад в form-control */
89
89
  padding-left: 0 !important;
90
90
  padding-bottom: var(--gap-2xs) !important
91
- } @media (max-width: 360px) { .bank-card__input_wd8lq {
91
+ } @media (max-width: 360px) { .bank-card__input_i3u6b {
92
92
  font-size: 16px
93
93
  }
94
- } .bank-card__bankLogo_wd8lq {
94
+ } .bank-card__bankLogo_i3u6b {
95
95
  position: absolute;
96
96
  top: 20px;
97
97
  left: 20px
98
- } .bank-card__bankLogo_wd8lq svg {
98
+ } .bank-card__bankLogo_i3u6b svg {
99
99
  max-height: 32px;
100
100
  width: auto;
101
101
  display: block
102
- } .bank-card__bankLogo_wd8lq svg g {
102
+ } .bank-card__bankLogo_i3u6b svg g {
103
103
  fill: var(--color-light-neutral-1500);
104
- } .bank-card__brandLogo_wd8lq {
104
+ } .bank-card__brandLogo_i3u6b {
105
105
  position: absolute;
106
106
  bottom: 20px;
107
107
  right: 20px
108
- } .bank-card__brandLogo_wd8lq svg {
108
+ } .bank-card__brandLogo_i3u6b svg {
109
109
  display: block;
110
110
  fill: var(--color-light-neutral-1500);
111
- } .bank-card__usePhoto_wd8lq {
111
+ } .bank-card__usePhoto_i3u6b {
112
112
  display: block;
113
113
  margin: 0;
114
114
  padding: 0;
@@ -125,7 +125,7 @@
125
125
 
126
126
  /* В макете иконка прилегает к правому краю поля, а по дизайн-системе там должен быть отступ */
127
127
  margin-right: calc(var(--gap-s) * -1)
128
- } .bank-card__usePhoto_wd8lq svg {
128
+ } .bank-card__usePhoto_i3u6b svg {
129
129
  fill: var(--color-light-neutral-1500);
130
130
  display: block;
131
131
  }
package/esm/index.js CHANGED
@@ -1,10 +1 @@
1
1
  export { BankCard } from './Component.js';
2
- import 'react';
3
- import 'classnames';
4
- import '@alfalab/core-components-masked-input/esm';
5
- import '@alfalab/icons-glyph/CameraMIcon';
6
- import '@alfalab/icons-logotype/AlfaBankLIcon';
7
- import '@alfalab/icons-logotype/MastercardLIcon';
8
- import '@alfalab/icons-logotype/MirXxlIcon';
9
- import '@alfalab/icons-logotype/VisaXxlIcon';
10
- import './utils.js';
package/index.css CHANGED
@@ -1,5 +1,5 @@
1
- /* hash: 141pm */
2
- :root {
1
+ /* hash: c4v3e */
2
+ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
3
3
  } /* deprecated */ :root {
4
4
  --color-light-neutral-1500: #0e0e0e;
5
5
  --color-light-text-secondary: rgba(4, 4, 19, 0.55); /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -22,7 +22,7 @@
22
22
  --font-family-styrene: 'Styrene UI', system-ui, -apple-system, 'Segoe UI', Roboto,
23
23
  'Helvetica Neue', Helvetica, sans-serif;
24
24
  } :root {
25
- } .bank-card__component_wd8lq {
25
+ } .bank-card__component_i3u6b {
26
26
  /* TODO: как это будет собираться и работать в webView */
27
27
  --form-control-border-radius: 0;
28
28
  --form-control-border-bottom: 1px solid var(--color-light-neutral-translucent-700);
@@ -41,10 +41,10 @@
41
41
  max-width: 343px;
42
42
 
43
43
  font-family: var(--font-family-styrene);
44
- } .bank-card__aspectRatioContainer_wd8lq {
44
+ } .bank-card__aspectRatioContainer_i3u6b {
45
45
  /* Эталонный размер 343x216 */
46
46
  padding-bottom: 63%;
47
- } .bank-card__content_wd8lq {
47
+ } .bank-card__content_i3u6b {
48
48
  position: absolute;
49
49
  top: 0;
50
50
  right: 0;
@@ -56,26 +56,26 @@
56
56
  padding-right: var(--gap-l);
57
57
  border-radius: var(--border-radius-l);
58
58
  box-sizing: border-box;
59
- } .bank-card__label_wd8lq {
59
+ } .bank-card__label_i3u6b {
60
60
  left: 0;
61
61
  transform: translateY(-1px);
62
62
  color: var(--color-light-text-secondary);
63
63
  font-size: 20px;
64
64
  line-height: 24px
65
- } @media (max-width: 360px) { .bank-card__label_wd8lq {
65
+ } @media (max-width: 360px) { .bank-card__label_i3u6b {
66
66
  font-size: 16px
67
67
  }
68
- } .bank-card__focused_wd8lq .bank-card__label_wd8lq,
69
- .bank-card__filled_wd8lq .bank-card__label_wd8lq {
68
+ } .bank-card__focused_i3u6b .bank-card__label_i3u6b,
69
+ .bank-card__filled_i3u6b .bank-card__label_i3u6b {
70
70
  color: var(--color-light-neutral-1500);
71
71
  transform: translateY(-19px) scale(0.6)
72
- } @media (max-width: 360px) { .bank-card__focused_wd8lq .bank-card__label_wd8lq,
73
- .bank-card__filled_wd8lq .bank-card__label_wd8lq {
72
+ } @media (max-width: 360px) { .bank-card__focused_i3u6b .bank-card__label_i3u6b,
73
+ .bank-card__filled_i3u6b .bank-card__label_i3u6b {
74
74
  transform: translateY(-22px) scale(0.75)
75
75
  }
76
- } .bank-card__focused_wd8lq:before {
76
+ } .bank-card__focused_i3u6b:before {
77
77
  transform: scale(1) !important;
78
- } .bank-card__input_wd8lq {
78
+ } .bank-card__input_i3u6b {
79
79
  font-size: 20px;
80
80
  line-height: 24px;
81
81
  font-weight: 400;
@@ -88,27 +88,27 @@
88
88
  /* TODO: обсудить с дизайнером, почему инпут не соответствует дизайн-системе, либо уменьшить каскад в form-control */
89
89
  padding-left: 0 !important;
90
90
  padding-bottom: var(--gap-2xs) !important
91
- } @media (max-width: 360px) { .bank-card__input_wd8lq {
91
+ } @media (max-width: 360px) { .bank-card__input_i3u6b {
92
92
  font-size: 16px
93
93
  }
94
- } .bank-card__bankLogo_wd8lq {
94
+ } .bank-card__bankLogo_i3u6b {
95
95
  position: absolute;
96
96
  top: 20px;
97
97
  left: 20px
98
- } .bank-card__bankLogo_wd8lq svg {
98
+ } .bank-card__bankLogo_i3u6b svg {
99
99
  max-height: 32px;
100
100
  width: auto;
101
101
  display: block
102
- } .bank-card__bankLogo_wd8lq svg g {
102
+ } .bank-card__bankLogo_i3u6b svg g {
103
103
  fill: var(--color-light-neutral-1500);
104
- } .bank-card__brandLogo_wd8lq {
104
+ } .bank-card__brandLogo_i3u6b {
105
105
  position: absolute;
106
106
  bottom: 20px;
107
107
  right: 20px
108
- } .bank-card__brandLogo_wd8lq svg {
108
+ } .bank-card__brandLogo_i3u6b svg {
109
109
  display: block;
110
110
  fill: var(--color-light-neutral-1500);
111
- } .bank-card__usePhoto_wd8lq {
111
+ } .bank-card__usePhoto_i3u6b {
112
112
  display: block;
113
113
  margin: 0;
114
114
  padding: 0;
@@ -125,7 +125,7 @@
125
125
 
126
126
  /* В макете иконка прилегает к правому краю поля, а по дизайн-системе там должен быть отступ */
127
127
  margin-right: calc(var(--gap-s) * -1)
128
- } .bank-card__usePhoto_wd8lq svg {
128
+ } .bank-card__usePhoto_i3u6b svg {
129
129
  fill: var(--color-light-neutral-1500);
130
130
  display: block;
131
131
  }
package/index.js CHANGED
@@ -3,15 +3,6 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var Component = require('./Component.js');
6
- require('react');
7
- require('classnames');
8
- require('@alfalab/core-components-masked-input');
9
- require('@alfalab/icons-glyph/CameraMIcon');
10
- require('@alfalab/icons-logotype/AlfaBankLIcon');
11
- require('@alfalab/icons-logotype/MastercardLIcon');
12
- require('@alfalab/icons-logotype/MirXxlIcon');
13
- require('@alfalab/icons-logotype/VisaXxlIcon');
14
- require('./utils.js');
15
6
 
16
7
 
17
8
 
package/modern/Component.js CHANGED
@@ -8,7 +8,7 @@ import { MirXxlIcon } from '@alfalab/icons-logotype/MirXxlIcon';
8
8
  import { VisaXxlIcon } from '@alfalab/icons-logotype/VisaXxlIcon';
9
9
  import { validateCardNumber } from './utils.js';
10
10
 
11
- const styles = {"component":"bank-card__component_wd8lq","aspectRatioContainer":"bank-card__aspectRatioContainer_wd8lq","content":"bank-card__content_wd8lq","label":"bank-card__label_wd8lq","focused":"bank-card__focused_wd8lq","filled":"bank-card__filled_wd8lq","input":"bank-card__input_wd8lq","bankLogo":"bank-card__bankLogo_wd8lq","brandLogo":"bank-card__brandLogo_wd8lq","usePhoto":"bank-card__usePhoto_wd8lq"};
11
+ const styles = {"component":"bank-card__component_i3u6b","aspectRatioContainer":"bank-card__aspectRatioContainer_i3u6b","content":"bank-card__content_i3u6b","label":"bank-card__label_i3u6b","focused":"bank-card__focused_i3u6b","filled":"bank-card__filled_i3u6b","input":"bank-card__input_i3u6b","bankLogo":"bank-card__bankLogo_i3u6b","brandLogo":"bank-card__brandLogo_i3u6b","usePhoto":"bank-card__usePhoto_i3u6b"};
12
12
  require('./index.css')
13
13
 
14
14
  // prettier-ignore
package/modern/index.css CHANGED
@@ -1,5 +1,5 @@
1
- /* hash: 141pm */
2
- :root {
1
+ /* hash: c4v3e */
2
+ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
3
3
  } /* deprecated */ :root {
4
4
  --color-light-neutral-1500: #0e0e0e;
5
5
  --color-light-text-secondary: rgba(4, 4, 19, 0.55); /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -22,7 +22,7 @@
22
22
  --font-family-styrene: 'Styrene UI', system-ui, -apple-system, 'Segoe UI', Roboto,
23
23
  'Helvetica Neue', Helvetica, sans-serif;
24
24
  } :root {
25
- } .bank-card__component_wd8lq {
25
+ } .bank-card__component_i3u6b {
26
26
  /* TODO: как это будет собираться и работать в webView */
27
27
  --form-control-border-radius: 0;
28
28
  --form-control-border-bottom: 1px solid var(--color-light-neutral-translucent-700);
@@ -41,10 +41,10 @@
41
41
  max-width: 343px;
42
42
 
43
43
  font-family: var(--font-family-styrene);
44
- } .bank-card__aspectRatioContainer_wd8lq {
44
+ } .bank-card__aspectRatioContainer_i3u6b {
45
45
  /* Эталонный размер 343x216 */
46
46
  padding-bottom: 63%;
47
- } .bank-card__content_wd8lq {
47
+ } .bank-card__content_i3u6b {
48
48
  position: absolute;
49
49
  top: 0;
50
50
  right: 0;
@@ -56,26 +56,26 @@
56
56
  padding-right: var(--gap-l);
57
57
  border-radius: var(--border-radius-l);
58
58
  box-sizing: border-box;
59
- } .bank-card__label_wd8lq {
59
+ } .bank-card__label_i3u6b {
60
60
  left: 0;
61
61
  transform: translateY(-1px);
62
62
  color: var(--color-light-text-secondary);
63
63
  font-size: 20px;
64
64
  line-height: 24px
65
- } @media (max-width: 360px) { .bank-card__label_wd8lq {
65
+ } @media (max-width: 360px) { .bank-card__label_i3u6b {
66
66
  font-size: 16px
67
67
  }
68
- } .bank-card__focused_wd8lq .bank-card__label_wd8lq,
69
- .bank-card__filled_wd8lq .bank-card__label_wd8lq {
68
+ } .bank-card__focused_i3u6b .bank-card__label_i3u6b,
69
+ .bank-card__filled_i3u6b .bank-card__label_i3u6b {
70
70
  color: var(--color-light-neutral-1500);
71
71
  transform: translateY(-19px) scale(0.6)
72
- } @media (max-width: 360px) { .bank-card__focused_wd8lq .bank-card__label_wd8lq,
73
- .bank-card__filled_wd8lq .bank-card__label_wd8lq {
72
+ } @media (max-width: 360px) { .bank-card__focused_i3u6b .bank-card__label_i3u6b,
73
+ .bank-card__filled_i3u6b .bank-card__label_i3u6b {
74
74
  transform: translateY(-22px) scale(0.75)
75
75
  }
76
- } .bank-card__focused_wd8lq:before {
76
+ } .bank-card__focused_i3u6b:before {
77
77
  transform: scale(1) !important;
78
- } .bank-card__input_wd8lq {
78
+ } .bank-card__input_i3u6b {
79
79
  font-size: 20px;
80
80
  line-height: 24px;
81
81
  font-weight: 400;
@@ -88,27 +88,27 @@
88
88
  /* TODO: обсудить с дизайнером, почему инпут не соответствует дизайн-системе, либо уменьшить каскад в form-control */
89
89
  padding-left: 0 !important;
90
90
  padding-bottom: var(--gap-2xs) !important
91
- } @media (max-width: 360px) { .bank-card__input_wd8lq {
91
+ } @media (max-width: 360px) { .bank-card__input_i3u6b {
92
92
  font-size: 16px
93
93
  }
94
- } .bank-card__bankLogo_wd8lq {
94
+ } .bank-card__bankLogo_i3u6b {
95
95
  position: absolute;
96
96
  top: 20px;
97
97
  left: 20px
98
- } .bank-card__bankLogo_wd8lq svg {
98
+ } .bank-card__bankLogo_i3u6b svg {
99
99
  max-height: 32px;
100
100
  width: auto;
101
101
  display: block
102
- } .bank-card__bankLogo_wd8lq svg g {
102
+ } .bank-card__bankLogo_i3u6b svg g {
103
103
  fill: var(--color-light-neutral-1500);
104
- } .bank-card__brandLogo_wd8lq {
104
+ } .bank-card__brandLogo_i3u6b {
105
105
  position: absolute;
106
106
  bottom: 20px;
107
107
  right: 20px
108
- } .bank-card__brandLogo_wd8lq svg {
108
+ } .bank-card__brandLogo_i3u6b svg {
109
109
  display: block;
110
110
  fill: var(--color-light-neutral-1500);
111
- } .bank-card__usePhoto_wd8lq {
111
+ } .bank-card__usePhoto_i3u6b {
112
112
  display: block;
113
113
  margin: 0;
114
114
  padding: 0;
@@ -125,7 +125,7 @@
125
125
 
126
126
  /* В макете иконка прилегает к правому краю поля, а по дизайн-системе там должен быть отступ */
127
127
  margin-right: calc(var(--gap-s) * -1)
128
- } .bank-card__usePhoto_wd8lq svg {
128
+ } .bank-card__usePhoto_i3u6b svg {
129
129
  fill: var(--color-light-neutral-1500);
130
130
  display: block;
131
131
  }
package/modern/index.js CHANGED
@@ -1,10 +1 @@
1
1
  export { BankCard } from './Component.js';
2
- import 'react';
3
- import 'classnames';
4
- import '@alfalab/core-components-masked-input/modern';
5
- import '@alfalab/icons-glyph/CameraMIcon';
6
- import '@alfalab/icons-logotype/AlfaBankLIcon';
7
- import '@alfalab/icons-logotype/MastercardLIcon';
8
- import '@alfalab/icons-logotype/MirXxlIcon';
9
- import '@alfalab/icons-logotype/VisaXxlIcon';
10
- import './utils.js';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alfalab/core-components-bank-card",
3
- "version": "5.6.2",
3
+ "version": "5.6.4",
4
4
  "description": "Bank card component",
5
5
  "keywords": [],
6
6
  "license": "MIT",
@@ -15,7 +15,7 @@
15
15
  "react-dom": "^16.9.0 || ^17.0.1 || ^18.0.0"
16
16
  },
17
17
  "dependencies": {
18
- "@alfalab/core-components-masked-input": "^6.2.18",
18
+ "@alfalab/core-components-masked-input": "^6.3.0",
19
19
  "@alfalab/icons-glyph": "^2.139.0",
20
20
  "@alfalab/icons-logotype": "^2.27.0",
21
21
  "classnames": "^2.3.1",