siam-ui-utils 2.0.27 → 2.0.29

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "siam-ui-utils",
3
- "version": "2.0.27",
3
+ "version": "2.0.29",
4
4
  "keywords": [
5
5
  "ampf-react",
6
6
  "ampf-utils",
package/src/App.css CHANGED
@@ -40,3 +40,8 @@
40
40
  .read-the-docs {
41
41
  color: #888;
42
42
  }
43
+
44
+
45
+ .custom-dropzone-uploader-dni-digital{
46
+ display: flex;
47
+ }
package/src/App.jsx CHANGED
@@ -48,6 +48,7 @@ const App = () => {
48
48
  maxFiles={7}
49
49
  nameFileLabel="Subir archivos"
50
50
  capture="environment"
51
+ onFilesSelectedSelfie
51
52
  />
52
53
  </AccordionBody>
53
54
  </AccordionItem>
@@ -62,9 +63,7 @@ const App = () => {
62
63
  onChangeFiles={() => {
63
64
  console.log('onChange');
64
65
  }}
65
- onMaxFileSizeError={() => {
66
- console.log('MAXIMO ARCHIVO PERMITIDO :>> ');
67
- }}
66
+ classNames="custom-dropzone-uploader-dni-digital"
68
67
  />
69
68
  </AccordionBody>
70
69
  </AccordionItem>
@@ -0,0 +1,8 @@
1
+ import React from 'react';
2
+ import { FormattedMessage, injectIntl } from 'react-intl';
3
+
4
+ const InjectMassage = (props) => <FormattedMessage {...props} />;
5
+
6
+ export default injectIntl(InjectMassage, {
7
+ withRef: false,
8
+ });
@@ -13,6 +13,7 @@ export const DropzoneUploaderDniDigital = ({
13
13
  onChangeFiles,
14
14
  totalFiles,
15
15
  label = 'Cargar Dni',
16
+ maxFiles = 2,
16
17
  maxSize = 2,
17
18
  onMaxFileSizeError = () => {
18
19
  alert('El archivo supera el tamaño máximo');
@@ -47,7 +48,6 @@ export const DropzoneUploaderDniDigital = ({
47
48
 
48
49
  const CustomPreview = ({ fileWithMeta }) => {
49
50
  const { meta, remove } = fileWithMeta;
50
- console.log('meta.size :>> ', meta.size);
51
51
  if (meta.size / (1024 * 1024) > maxSize) {
52
52
  onMaxFileSizeError();
53
53
  remove();
@@ -103,7 +103,8 @@ export const DropzoneUploaderDniDigital = ({
103
103
  };
104
104
 
105
105
  const Input = ({ accept, onFiles, getFilesFromEvent }) => {
106
- const text = totalFiles > 0 ? `${2 - totalFiles} archivos más` : `${label}`;
106
+ const text =
107
+ totalFiles > 0 ? `${maxFiles - totalFiles} archivos más` : `${label}`;
107
108
  return (
108
109
  <>
109
110
  <Button
@@ -135,7 +136,7 @@ export const DropzoneUploaderDniDigital = ({
135
136
  <div className={classNames}>
136
137
  <Dropzone
137
138
  disableUpload={false}
138
- maxFiles={totalFiles < 2 ? 2 : 0}
139
+ maxFiles={totalFiles < maxFiles ? maxFiles : 0}
139
140
  maxSize={maxSize} // en megas
140
141
  InputComponent={Input}
141
142
  PreviewComponent={CustomPreview}
package/src/index.js CHANGED
@@ -4,3 +4,4 @@ export * from './bridges';
4
4
  export * from './CustomBootstrap';
5
5
  export * from './CustomSelectInput';
6
6
  export * from './tomar-foto';
7
+ export * as IntlMessages from './IntlMessages';
@@ -1,66 +1,69 @@
1
- import { useState } from 'react'
2
- import { Row } from 'reactstrap'
3
- import { DropzoneUploader, Colxx } from '../'
4
- import { TAKE_PHOTO } from '../constants'
5
- import imgHacerFoto from '../assets/img/take-photo.png'
1
+ import { useState } from 'react';
2
+ import { Row } from 'reactstrap';
3
+ import { DropzoneUploader, Colxx } from '../';
4
+ import { TAKE_PHOTO } from '../constants';
5
+ import imgHacerFoto from '../assets/img/take-photo.png';
6
6
 
7
7
  // eslint-disable-next-line react/prop-types
8
- export const TomarFoto = ({ onFilesSelectedSelfie, isMobile = false }) => {
9
- const [filesTotalSelectedSelfie, setTotalFilesSelectedSelfie] = useState(0)
10
- const {
11
- LOAD_SELFIE_WITH_IDENTITY_CARD_MESSAGE,
12
- MESSAGE_SELFIE_ONLY_CAN_TAKE_FROM_CELLPHONE,
13
- TAKE_PHOTO_MESSAGE,
14
- } = TAKE_PHOTO
8
+ export const TomarFoto = ({
9
+ onFilesSelectedSelfie = () => {},
10
+ isMobile = false,
11
+ }) => {
12
+ const [filesTotalSelectedSelfie, setTotalFilesSelectedSelfie] = useState(0);
13
+ const {
14
+ LOAD_SELFIE_WITH_IDENTITY_CARD_MESSAGE,
15
+ MESSAGE_SELFIE_ONLY_CAN_TAKE_FROM_CELLPHONE,
16
+ TAKE_PHOTO_MESSAGE,
17
+ } = TAKE_PHOTO;
15
18
 
16
- const handleFilesSelectedSelfie = (files) => {
17
- setTotalFilesSelectedSelfie(files.length)
18
- onFilesSelectedSelfie(files)
19
- }
19
+ const handleFilesSelectedSelfie = (files) => {
20
+ setTotalFilesSelectedSelfie(files.length);
21
+ onFilesSelectedSelfie(files);
22
+ };
20
23
 
21
- return (
22
- <>
23
- <Row className='pt-2 ml-4'>
24
- <Colxx xxs='11' md='5'>
25
- {LOAD_SELFIE_WITH_IDENTITY_CARD_MESSAGE}
26
- </Colxx>
27
- </Row>
28
- <Row className='pt-2 ml-2'>
29
- <Colxx xxs='12' md='9'>
30
- {isMobile ? (
31
- <>
32
- <Colxx xxs='12' className='text-center'>
33
- {filesTotalSelectedSelfie === 0 && (
34
- <img
35
- style={{ width: '97%' }}
36
- alt='hacerFotoDNI'
37
- src={imgHacerFoto}
38
- />
39
- )}
40
- <DropzoneUploader
41
- className='pt-2 ml-2'
42
- maxFiles={1}
43
- onChangeFiles={handleFilesSelectedSelfie}
44
- totalFiles={filesTotalSelectedSelfie}
45
- accept='image/jpg,image/jpeg'
46
- capture='environment'
47
- nameFileLabel={TAKE_PHOTO_MESSAGE}
48
- />
49
- </Colxx>
50
- </>
51
- ) : (
52
- <h2
53
- className={'view-icon iconsminds-smartphone-4 ml-2 mr-2'}
54
- style={{
55
- color: 'red',
56
- margin: '10px 10px 0px 10px',
57
- }}
58
- >
59
- {MESSAGE_SELFIE_ONLY_CAN_TAKE_FROM_CELLPHONE}
60
- </h2>
61
- )}
62
- </Colxx>
63
- </Row>
64
- </>
65
- )
66
- }
24
+ return (
25
+ <>
26
+ <Row className="pt-2 ml-4">
27
+ <Colxx xxs="11" md="5">
28
+ {LOAD_SELFIE_WITH_IDENTITY_CARD_MESSAGE}
29
+ </Colxx>
30
+ </Row>
31
+ <Row className="pt-2 ml-2">
32
+ <Colxx xxs="12" md="9">
33
+ {isMobile ? (
34
+ <>
35
+ <Colxx xxs="12" className="text-center">
36
+ {filesTotalSelectedSelfie === 0 && (
37
+ <img
38
+ style={{ width: '97%' }}
39
+ alt="hacerFotoDNI"
40
+ src={imgHacerFoto}
41
+ />
42
+ )}
43
+ <DropzoneUploader
44
+ className="pt-2 ml-2"
45
+ maxFiles={1}
46
+ onChangeFiles={handleFilesSelectedSelfie}
47
+ totalFiles={filesTotalSelectedSelfie}
48
+ accept="image/jpg,image/jpeg"
49
+ capture="environment"
50
+ nameFileLabel={TAKE_PHOTO_MESSAGE}
51
+ />
52
+ </Colxx>
53
+ </>
54
+ ) : (
55
+ <h2
56
+ className={'view-icon iconsminds-smartphone-4 ml-2 mr-2'}
57
+ style={{
58
+ color: 'red',
59
+ margin: '10px 10px 0px 10px',
60
+ }}
61
+ >
62
+ {MESSAGE_SELFIE_ONLY_CAN_TAKE_FROM_CELLPHONE}
63
+ </h2>
64
+ )}
65
+ </Colxx>
66
+ </Row>
67
+ </>
68
+ );
69
+ };