@alfalab/core-components-bank-card 5.2.4 → 5.2.6

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 (9) hide show
  1. package/Component.js +1 -1
  2. package/cssm/index.module.css +1 -1
  3. package/esm/Component.js +1 -1
  4. package/esm/index.css +21 -21
  5. package/index.css +21 -21
  6. package/modern/Component.js +1 -1
  7. package/modern/index.css +21 -21
  8. package/package.json +2 -2
  9. package/send-stats.js +1 -1
package/Component.js CHANGED
@@ -17,7 +17,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
17
17
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
18
18
  var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
19
19
 
20
- var styles = {"component":"bank-card__component_x2sls","aspectRatioContainer":"bank-card__aspectRatioContainer_x2sls","content":"bank-card__content_x2sls","label":"bank-card__label_x2sls","focused":"bank-card__focused_x2sls","filled":"bank-card__filled_x2sls","input":"bank-card__input_x2sls","bankLogo":"bank-card__bankLogo_x2sls","brandLogo":"bank-card__brandLogo_x2sls","usePhoto":"bank-card__usePhoto_x2sls"};
20
+ var styles = {"component":"bank-card__component_2rj78","aspectRatioContainer":"bank-card__aspectRatioContainer_2rj78","content":"bank-card__content_2rj78","label":"bank-card__label_2rj78","focused":"bank-card__focused_2rj78","filled":"bank-card__filled_2rj78","input":"bank-card__input_2rj78","bankLogo":"bank-card__bankLogo_2rj78","brandLogo":"bank-card__brandLogo_2rj78","usePhoto":"bank-card__usePhoto_2rj78"};
21
21
  require('./index.css')
22
22
 
23
23
  // prettier-ignore
package/cssm/index.module.css CHANGED
@@ -97,7 +97,7 @@
97
97
 
98
98
  /* TODO: обсудить с дизайнером, почему инпут не соответствует дизайн-системе, либо уменьшить каскад в form-control */
99
99
  padding-left: 0 !important;
100
- padding-bottom: 4px !important
100
+ padding-bottom: var(--gap-2xs) !important
101
101
  }
102
102
  @media (max-width: 360px) {
103
103
  .input {
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_x2sls","aspectRatioContainer":"bank-card__aspectRatioContainer_x2sls","content":"bank-card__content_x2sls","label":"bank-card__label_x2sls","focused":"bank-card__focused_x2sls","filled":"bank-card__filled_x2sls","input":"bank-card__input_x2sls","bankLogo":"bank-card__bankLogo_x2sls","brandLogo":"bank-card__brandLogo_x2sls","usePhoto":"bank-card__usePhoto_x2sls"};
11
+ var styles = {"component":"bank-card__component_2rj78","aspectRatioContainer":"bank-card__aspectRatioContainer_2rj78","content":"bank-card__content_2rj78","label":"bank-card__label_2rj78","focused":"bank-card__focused_2rj78","filled":"bank-card__filled_2rj78","input":"bank-card__input_2rj78","bankLogo":"bank-card__bankLogo_2rj78","brandLogo":"bank-card__brandLogo_2rj78","usePhoto":"bank-card__usePhoto_2rj78"};
12
12
  require('./index.css')
13
13
 
14
14
  // prettier-ignore
package/esm/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 1lcwp */
1
+ /* hash: 735pg */
2
2
  :root {
3
3
  --color-black: #000;
4
4
  --color-black-60: rgba(0, 0, 0, 0.6);
@@ -23,7 +23,7 @@
23
23
  :root {
24
24
  --border-radius-l: 12px;
25
25
  }
26
- .bank-card__component_x2sls {
26
+ .bank-card__component_2rj78 {
27
27
  /* TODO: как это будет собираться и работать в webView */
28
28
  --form-control-border-radius: 0;
29
29
  --form-control-border-bottom: 1px solid var(--color-black-60);
@@ -43,11 +43,11 @@
43
43
 
44
44
  font-family: var(--font-family-styrene);
45
45
  }
46
- .bank-card__aspectRatioContainer_x2sls {
46
+ .bank-card__aspectRatioContainer_2rj78 {
47
47
  /* Эталонный размер 343x216 */
48
48
  padding-bottom: 63%;
49
49
  }
50
- .bank-card__content_x2sls {
50
+ .bank-card__content_2rj78 {
51
51
  position: absolute;
52
52
  top: 0;
53
53
  right: 0;
@@ -60,7 +60,7 @@
60
60
  border-radius: var(--border-radius-l);
61
61
  box-sizing: border-box;
62
62
  }
63
- .bank-card__label_x2sls {
63
+ .bank-card__label_2rj78 {
64
64
  left: 0;
65
65
  transform: translateY(-1px);
66
66
  color: var(--color-black-60);
@@ -68,25 +68,25 @@
68
68
  line-height: 24px
69
69
  }
70
70
  @media (max-width: 360px) {
71
- .bank-card__label_x2sls {
71
+ .bank-card__label_2rj78 {
72
72
  font-size: 16px
73
73
  }
74
74
  }
75
- .bank-card__focused_x2sls .bank-card__label_x2sls,
76
- .bank-card__filled_x2sls .bank-card__label_x2sls {
75
+ .bank-card__focused_2rj78 .bank-card__label_2rj78,
76
+ .bank-card__filled_2rj78 .bank-card__label_2rj78 {
77
77
  color: var(--color-black);
78
78
  transform: translateY(-19px) scale(0.6)
79
79
  }
80
80
  @media (max-width: 360px) {
81
- .bank-card__focused_x2sls .bank-card__label_x2sls,
82
- .bank-card__filled_x2sls .bank-card__label_x2sls {
81
+ .bank-card__focused_2rj78 .bank-card__label_2rj78,
82
+ .bank-card__filled_2rj78 .bank-card__label_2rj78 {
83
83
  transform: translateY(-22px) scale(0.75)
84
84
  }
85
85
  }
86
- .bank-card__focused_x2sls:before {
86
+ .bank-card__focused_2rj78:before {
87
87
  transform: scale(1) !important;
88
88
  }
89
- .bank-card__input_x2sls {
89
+ .bank-card__input_2rj78 {
90
90
  font-size: 20px;
91
91
  line-height: 24px;
92
92
  font-weight: 400;
@@ -98,36 +98,36 @@
98
98
 
99
99
  /* TODO: обсудить с дизайнером, почему инпут не соответствует дизайн-системе, либо уменьшить каскад в form-control */
100
100
  padding-left: 0 !important;
101
- padding-bottom: 4px !important
101
+ padding-bottom: var(--gap-2xs) !important
102
102
  }
103
103
  @media (max-width: 360px) {
104
- .bank-card__input_x2sls {
104
+ .bank-card__input_2rj78 {
105
105
  font-size: 16px
106
106
  }
107
107
  }
108
- .bank-card__bankLogo_x2sls {
108
+ .bank-card__bankLogo_2rj78 {
109
109
  position: absolute;
110
110
  top: 20px;
111
111
  left: 20px
112
112
  }
113
- .bank-card__bankLogo_x2sls svg {
113
+ .bank-card__bankLogo_2rj78 svg {
114
114
  max-height: 32px;
115
115
  width: auto;
116
116
  display: block
117
117
  }
118
- .bank-card__bankLogo_x2sls svg g {
118
+ .bank-card__bankLogo_2rj78 svg g {
119
119
  fill: var(--color-black);
120
120
  }
121
- .bank-card__brandLogo_x2sls {
121
+ .bank-card__brandLogo_2rj78 {
122
122
  position: absolute;
123
123
  bottom: 20px;
124
124
  right: 20px
125
125
  }
126
- .bank-card__brandLogo_x2sls svg {
126
+ .bank-card__brandLogo_2rj78 svg {
127
127
  display: block;
128
128
  fill: var(--color-black);
129
129
  }
130
- .bank-card__usePhoto_x2sls {
130
+ .bank-card__usePhoto_2rj78 {
131
131
  display: block;
132
132
  margin: 0;
133
133
  padding: 0;
@@ -145,7 +145,7 @@
145
145
  /* В макете иконка прилегает к правому краю поля, а по дизайн-системе там должен быть отступ */
146
146
  margin-right: calc(var(--gap-s) * -1)
147
147
  }
148
- .bank-card__usePhoto_x2sls svg {
148
+ .bank-card__usePhoto_2rj78 svg {
149
149
  fill: var(--color-black);
150
150
  display: block;
151
151
  }
package/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 1lcwp */
1
+ /* hash: 735pg */
2
2
  :root {
3
3
  --color-black: #000;
4
4
  --color-black-60: rgba(0, 0, 0, 0.6);
@@ -23,7 +23,7 @@
23
23
  :root {
24
24
  --border-radius-l: 12px;
25
25
  }
26
- .bank-card__component_x2sls {
26
+ .bank-card__component_2rj78 {
27
27
  /* TODO: как это будет собираться и работать в webView */
28
28
  --form-control-border-radius: 0;
29
29
  --form-control-border-bottom: 1px solid var(--color-black-60);
@@ -43,11 +43,11 @@
43
43
 
44
44
  font-family: var(--font-family-styrene);
45
45
  }
46
- .bank-card__aspectRatioContainer_x2sls {
46
+ .bank-card__aspectRatioContainer_2rj78 {
47
47
  /* Эталонный размер 343x216 */
48
48
  padding-bottom: 63%;
49
49
  }
50
- .bank-card__content_x2sls {
50
+ .bank-card__content_2rj78 {
51
51
  position: absolute;
52
52
  top: 0;
53
53
  right: 0;
@@ -60,7 +60,7 @@
60
60
  border-radius: var(--border-radius-l);
61
61
  box-sizing: border-box;
62
62
  }
63
- .bank-card__label_x2sls {
63
+ .bank-card__label_2rj78 {
64
64
  left: 0;
65
65
  transform: translateY(-1px);
66
66
  color: var(--color-black-60);
@@ -68,25 +68,25 @@
68
68
  line-height: 24px
69
69
  }
70
70
  @media (max-width: 360px) {
71
- .bank-card__label_x2sls {
71
+ .bank-card__label_2rj78 {
72
72
  font-size: 16px
73
73
  }
74
74
  }
75
- .bank-card__focused_x2sls .bank-card__label_x2sls,
76
- .bank-card__filled_x2sls .bank-card__label_x2sls {
75
+ .bank-card__focused_2rj78 .bank-card__label_2rj78,
76
+ .bank-card__filled_2rj78 .bank-card__label_2rj78 {
77
77
  color: var(--color-black);
78
78
  transform: translateY(-19px) scale(0.6)
79
79
  }
80
80
  @media (max-width: 360px) {
81
- .bank-card__focused_x2sls .bank-card__label_x2sls,
82
- .bank-card__filled_x2sls .bank-card__label_x2sls {
81
+ .bank-card__focused_2rj78 .bank-card__label_2rj78,
82
+ .bank-card__filled_2rj78 .bank-card__label_2rj78 {
83
83
  transform: translateY(-22px) scale(0.75)
84
84
  }
85
85
  }
86
- .bank-card__focused_x2sls:before {
86
+ .bank-card__focused_2rj78:before {
87
87
  transform: scale(1) !important;
88
88
  }
89
- .bank-card__input_x2sls {
89
+ .bank-card__input_2rj78 {
90
90
  font-size: 20px;
91
91
  line-height: 24px;
92
92
  font-weight: 400;
@@ -98,36 +98,36 @@
98
98
 
99
99
  /* TODO: обсудить с дизайнером, почему инпут не соответствует дизайн-системе, либо уменьшить каскад в form-control */
100
100
  padding-left: 0 !important;
101
- padding-bottom: 4px !important
101
+ padding-bottom: var(--gap-2xs) !important
102
102
  }
103
103
  @media (max-width: 360px) {
104
- .bank-card__input_x2sls {
104
+ .bank-card__input_2rj78 {
105
105
  font-size: 16px
106
106
  }
107
107
  }
108
- .bank-card__bankLogo_x2sls {
108
+ .bank-card__bankLogo_2rj78 {
109
109
  position: absolute;
110
110
  top: 20px;
111
111
  left: 20px
112
112
  }
113
- .bank-card__bankLogo_x2sls svg {
113
+ .bank-card__bankLogo_2rj78 svg {
114
114
  max-height: 32px;
115
115
  width: auto;
116
116
  display: block
117
117
  }
118
- .bank-card__bankLogo_x2sls svg g {
118
+ .bank-card__bankLogo_2rj78 svg g {
119
119
  fill: var(--color-black);
120
120
  }
121
- .bank-card__brandLogo_x2sls {
121
+ .bank-card__brandLogo_2rj78 {
122
122
  position: absolute;
123
123
  bottom: 20px;
124
124
  right: 20px
125
125
  }
126
- .bank-card__brandLogo_x2sls svg {
126
+ .bank-card__brandLogo_2rj78 svg {
127
127
  display: block;
128
128
  fill: var(--color-black);
129
129
  }
130
- .bank-card__usePhoto_x2sls {
130
+ .bank-card__usePhoto_2rj78 {
131
131
  display: block;
132
132
  margin: 0;
133
133
  padding: 0;
@@ -145,7 +145,7 @@
145
145
  /* В макете иконка прилегает к правому краю поля, а по дизайн-системе там должен быть отступ */
146
146
  margin-right: calc(var(--gap-s) * -1)
147
147
  }
148
- .bank-card__usePhoto_x2sls svg {
148
+ .bank-card__usePhoto_2rj78 svg {
149
149
  fill: var(--color-black);
150
150
  display: block;
151
151
  }
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
- var styles = {"component":"bank-card__component_x2sls","aspectRatioContainer":"bank-card__aspectRatioContainer_x2sls","content":"bank-card__content_x2sls","label":"bank-card__label_x2sls","focused":"bank-card__focused_x2sls","filled":"bank-card__filled_x2sls","input":"bank-card__input_x2sls","bankLogo":"bank-card__bankLogo_x2sls","brandLogo":"bank-card__brandLogo_x2sls","usePhoto":"bank-card__usePhoto_x2sls"};
11
+ var styles = {"component":"bank-card__component_2rj78","aspectRatioContainer":"bank-card__aspectRatioContainer_2rj78","content":"bank-card__content_2rj78","label":"bank-card__label_2rj78","focused":"bank-card__focused_2rj78","filled":"bank-card__filled_2rj78","input":"bank-card__input_2rj78","bankLogo":"bank-card__bankLogo_2rj78","brandLogo":"bank-card__brandLogo_2rj78","usePhoto":"bank-card__usePhoto_2rj78"};
12
12
  require('./index.css')
13
13
 
14
14
  // prettier-ignore
package/modern/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 1lcwp */
1
+ /* hash: 735pg */
2
2
  :root {
3
3
  --color-black: #000;
4
4
  --color-black-60: rgba(0, 0, 0, 0.6);
@@ -23,7 +23,7 @@
23
23
  :root {
24
24
  --border-radius-l: 12px;
25
25
  }
26
- .bank-card__component_x2sls {
26
+ .bank-card__component_2rj78 {
27
27
  /* TODO: как это будет собираться и работать в webView */
28
28
  --form-control-border-radius: 0;
29
29
  --form-control-border-bottom: 1px solid var(--color-black-60);
@@ -43,11 +43,11 @@
43
43
 
44
44
  font-family: var(--font-family-styrene);
45
45
  }
46
- .bank-card__aspectRatioContainer_x2sls {
46
+ .bank-card__aspectRatioContainer_2rj78 {
47
47
  /* Эталонный размер 343x216 */
48
48
  padding-bottom: 63%;
49
49
  }
50
- .bank-card__content_x2sls {
50
+ .bank-card__content_2rj78 {
51
51
  position: absolute;
52
52
  top: 0;
53
53
  right: 0;
@@ -60,7 +60,7 @@
60
60
  border-radius: var(--border-radius-l);
61
61
  box-sizing: border-box;
62
62
  }
63
- .bank-card__label_x2sls {
63
+ .bank-card__label_2rj78 {
64
64
  left: 0;
65
65
  transform: translateY(-1px);
66
66
  color: var(--color-black-60);
@@ -68,25 +68,25 @@
68
68
  line-height: 24px
69
69
  }
70
70
  @media (max-width: 360px) {
71
- .bank-card__label_x2sls {
71
+ .bank-card__label_2rj78 {
72
72
  font-size: 16px
73
73
  }
74
74
  }
75
- .bank-card__focused_x2sls .bank-card__label_x2sls,
76
- .bank-card__filled_x2sls .bank-card__label_x2sls {
75
+ .bank-card__focused_2rj78 .bank-card__label_2rj78,
76
+ .bank-card__filled_2rj78 .bank-card__label_2rj78 {
77
77
  color: var(--color-black);
78
78
  transform: translateY(-19px) scale(0.6)
79
79
  }
80
80
  @media (max-width: 360px) {
81
- .bank-card__focused_x2sls .bank-card__label_x2sls,
82
- .bank-card__filled_x2sls .bank-card__label_x2sls {
81
+ .bank-card__focused_2rj78 .bank-card__label_2rj78,
82
+ .bank-card__filled_2rj78 .bank-card__label_2rj78 {
83
83
  transform: translateY(-22px) scale(0.75)
84
84
  }
85
85
  }
86
- .bank-card__focused_x2sls:before {
86
+ .bank-card__focused_2rj78:before {
87
87
  transform: scale(1) !important;
88
88
  }
89
- .bank-card__input_x2sls {
89
+ .bank-card__input_2rj78 {
90
90
  font-size: 20px;
91
91
  line-height: 24px;
92
92
  font-weight: 400;
@@ -98,36 +98,36 @@
98
98
 
99
99
  /* TODO: обсудить с дизайнером, почему инпут не соответствует дизайн-системе, либо уменьшить каскад в form-control */
100
100
  padding-left: 0 !important;
101
- padding-bottom: 4px !important
101
+ padding-bottom: var(--gap-2xs) !important
102
102
  }
103
103
  @media (max-width: 360px) {
104
- .bank-card__input_x2sls {
104
+ .bank-card__input_2rj78 {
105
105
  font-size: 16px
106
106
  }
107
107
  }
108
- .bank-card__bankLogo_x2sls {
108
+ .bank-card__bankLogo_2rj78 {
109
109
  position: absolute;
110
110
  top: 20px;
111
111
  left: 20px
112
112
  }
113
- .bank-card__bankLogo_x2sls svg {
113
+ .bank-card__bankLogo_2rj78 svg {
114
114
  max-height: 32px;
115
115
  width: auto;
116
116
  display: block
117
117
  }
118
- .bank-card__bankLogo_x2sls svg g {
118
+ .bank-card__bankLogo_2rj78 svg g {
119
119
  fill: var(--color-black);
120
120
  }
121
- .bank-card__brandLogo_x2sls {
121
+ .bank-card__brandLogo_2rj78 {
122
122
  position: absolute;
123
123
  bottom: 20px;
124
124
  right: 20px
125
125
  }
126
- .bank-card__brandLogo_x2sls svg {
126
+ .bank-card__brandLogo_2rj78 svg {
127
127
  display: block;
128
128
  fill: var(--color-black);
129
129
  }
130
- .bank-card__usePhoto_x2sls {
130
+ .bank-card__usePhoto_2rj78 {
131
131
  display: block;
132
132
  margin: 0;
133
133
  padding: 0;
@@ -145,7 +145,7 @@
145
145
  /* В макете иконка прилегает к правому краю поля, а по дизайн-системе там должен быть отступ */
146
146
  margin-right: calc(var(--gap-s) * -1)
147
147
  }
148
- .bank-card__usePhoto_x2sls svg {
148
+ .bank-card__usePhoto_2rj78 svg {
149
149
  fill: var(--color-black);
150
150
  display: block;
151
151
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alfalab/core-components-bank-card",
3
- "version": "5.2.4",
3
+ "version": "5.2.6",
4
4
  "description": "Bank card component",
5
5
  "keywords": [],
6
6
  "license": "MIT",
@@ -18,7 +18,7 @@
18
18
  "react-dom": "^16.9.0 || ^17.0.1 || ^18.0.0"
19
19
  },
20
20
  "dependencies": {
21
- "@alfalab/core-components-masked-input": "^6.0.1",
21
+ "@alfalab/core-components-masked-input": "^6.0.2",
22
22
  "@alfalab/icons-glyph": "^2.71.0",
23
23
  "@alfalab/icons-logotype": "^2.19.0",
24
24
  "classnames": "^2.3.1"
package/send-stats.js CHANGED
@@ -55,7 +55,7 @@ async function main() {
55
55
  };
56
56
 
57
57
  return new Promise((resolve, reject) => {
58
- const req = http.request(options, res => {
58
+ const req = http.request(options, (res) => {
59
59
  res.on('end', () => {
60
60
  resolve();
61
61
  });